← All changes | src/editor/controls/Sidebar.tsx +27 -19 1.9.3 → 1.13.0 View file →

		@@ -7,9 +7,8 @@
7	7	Button,
8	8	CheckboxControl,
9	9	} from '@wordpress/components';
10	10	import { __ } from '@wordpress/i18n';
11		-import { Theme } from 'shiki';
12	11	import { useLanguage } from '../../hooks/useLanguage';
13	12	import { useGlobalStore } from '../../state/global';
14	13	import { useLanguageStore } from '../../state/language';
15	14	import { useThemeStore } from '../../state/theme';
		@@ -21,10 +20,10 @@
21	20	FontFamilySelect,
22	21	} from '../components/FontSelect';
23	22	import { FooterSelect } from '../components/FooterSelect';
24	23	import { HeaderSelect } from '../components/HeaderSelect';
25		-// import { Notice } from '../components/Notice';
26		-import { ThemeSelect } from '../components/ThemeSelect';
	24	+import { HeightPanel } from '../components/HeightPanel';
	25	+import { ThemesPanel } from '../components/ThemesPanel';
27	26	import { BlurControl } from './BlurControl';
28	27	import { HighlightingControl } from './HighlightingControl';
29	28
30	29	export const SidebarControls = ({
		@@ -36,12 +35,14 @@
36	35	const { updateThemeHistory } = useThemeStore();
37	36	const { setPreviousSettings } = useGlobalStore();
38	37	const { headerType, footerType } = attributes;
39	38
	39	+ const footersNeedingLinks = ['simpleStringEnd', 'simpleStringStart'];
	40	+
40	41	const showHeaderTextEdit = ['simpleString'].includes(headerType);
41		- const showFooterTextEdit = ['simpleStringEnd'].includes(footerType);
42		- const showFooterLinkEdit = ['simpleStringEnd'].includes(footerType);
43		- const showFooterLinkTargetEdit = ['simpleStringEnd'].includes(footerType);
	42	+ const showFooterTextEdit = footersNeedingLinks.includes(footerType);
	43	+ const showFooterLinkEdit = footersNeedingLinks.includes(footerType);
	44	+ const showFooterLinkTargetEdit = footersNeedingLinks.includes(footerType);
44	45
45	46	return (
46	47	<InspectorControls>
47	48	<PanelBody
		@@ -54,11 +55,22 @@
54	55	label={__('Code Language', 'code-block-pro')}
55	56	data-cy-cbp="language-select"
56	57	value={language}
57	58	onChange={setLanguage}
	59	+ help={
	60	+ language === 'ansi'
	61	+ ? __(
	62	+ 'Some code themes may not render ANSI correctly. Control sequences render only on the front.',
	63	+ 'code-block-pro',
	64	+ )
	65	+ : null
	66	+ }
58	67	options={Object.entries(languages).map(
59	68	([value, label]) => ({
60		- label,
	69	+ label: label.replace(
	70	+ 'ANSI',
	71	+ 'ANSI (experimental)',
	72	+ ),
61	73	value,
62	74	}),
63	75	)}
64	76	/>
		@@ -146,9 +158,8 @@
146	158	}}
147	159	/>
148	160	</BaseControl>
149	161	)}
150		- {/* <Notice /> */}
151	162	</div>
152	163	</PanelBody>
153	164	<PanelBody
154	165	title={__('Line Settings', 'code-block-pro')}
		@@ -217,20 +228,13 @@
217	228	updateThemeHistory({ ...attributes, footerType });
218	229	}}
219	230	/>
220	231	</PanelBody>
	232	+ <ThemesPanel
	233	+ attributes={attributes}
	234	+ setAttributes={setAttributes}
	235	+ />
221	236	<PanelBody
222		- title={__('Themes', 'code-block-pro')}
223		- initialOpen={false}>
224		- <ThemeSelect
225		- {...attributes}
226		- onClick={(slug: Theme) => {
227		- setAttributes({ theme: slug });
228		- updateThemeHistory({ ...attributes, theme: slug });
229		- }}
230		- />
231		- </PanelBody>
232		- <PanelBody
233	237	title={__('Styling', 'code-block-pro')}
234	238	initialOpen={false}>
235	239	<div
236	240	className="code-block-pro-editor"
		@@ -294,8 +298,12 @@
294	298	/>
295	299	</div>
296	300	</div>
297	301	</PanelBody>
	302	+ <HeightPanel
	303	+ attributes={attributes}
	304	+ setAttributes={setAttributes}
	305	+ />
298	306	<PanelBody
299	307	title={__('Extra Settings', 'code-block-pro')}
300	308	initialOpen={false}>
301	309	<BaseControl id="code-block-pro-show-copy-button">