← All changes | src/editor/components/HeaderSelect.tsx +5 -30 1.27.3 → 1.13.0 View file →

		@@ -3,22 +3,16 @@
3	3	import { Attributes } from '../../types';
4	4	import { Headlights } from './headers/Headlights';
5	5	import { HeadlightsMuted } from './headers/HeadlightsMuted';
6	6	import { HeadlightsMutedAlt } from './headers/HeadlightsMutedAlt';
7		-import { PillString } from './headers/PillString';
8	7	import { SimpleString } from './headers/SimpleString';
9		-import { StringSmall } from './headers/StringSmall';
10		-import { UnsupportedTheme } from './misc/Unsupported';
11	8
12	9	type HeaderSelectProps = {
13	10	attributes: Attributes;
14	11	onClick: (slug: string) => void;
15	12	};
16		-
17		-const unsupportedWithCssVars = ['headlightsMutedAlt'];
18		-
19	13	export const HeaderSelect = ({ attributes, onClick }: HeaderSelectProps) => {
20		- const { headerType, ...attributesWithoutHeaderType }: Attributes =
	14	+ const { headerType, ...attributesWithoutHeaderType }: Partial<Attributes> =
21	15	attributes;
22	16	const { bgColor } = attributes;
23	17	const types = {
24	18	none: __('None', 'code-block-pro'),
		@@ -25,12 +19,9 @@
25	19	headlights: __('Headlights', 'code-block-pro'),
26	20	headlightsMuted: __('Headlights muted', 'code-block-pro'),
27	21	headlightsMutedAlt: __('Headlights muted alt', 'code-block-pro'),
28	22	simpleString: __('Simple string', 'code-block-pro'),
29		- stringSmall: __('String muted', 'code-block-pro'),
30		- pillString: __('Pill string', 'code-block-pro'),
31	23	};
32		- const isUnsupported = bgColor?.startsWith('var(');
33	24
34	25	return (
35	26	<div className="code-block-pro-editor">
36	27	{Object.entries(types).map(([slug, type]) => (
		@@ -44,14 +35,12 @@
44	35	)
45	36	: type
46	37	}
47	38	help={
48		- ['simpleString', 'pillString', 'stringSmall'].includes(
49		- slug,
50		- )
	39	+ ['simpleString'].includes(slug)
51	40	? // Settings refers to the panel that can be expanded
52	41	__(
53		- 'Set the text at the top of this panel.',
	42	+ 'Update extras in the Settings panel',
54	43	'code-block-pro',
55	44	)
56	45	: undefined
57	46	}
		@@ -71,11 +60,8 @@
71	60	style={{ backgroundColor: bgColor }}
72	61	/>
73	62	</span>
74	63	</button>
75		- {isUnsupported && unsupportedWithCssVars.includes(slug) && (
76		- <UnsupportedTheme />
77		- )}
78	64	</BaseControl>
79	65	))}
80	66	</div>
81	67	);
		@@ -80,15 +66,10 @@
80	66	</div>
81	67	);
82	68	};
83	69
84		-export const HeaderType = (attributes: Attributes) => {
85		- const { headerType, bgColor } = attributes;
86		- const isACustomTheme = bgColor?.startsWith('var(');
87		- if (isACustomTheme && unsupportedWithCssVars.includes(headerType ?? '')) {
88		- return null;
89		- }
90		-
	70	+export const HeaderType = (attributes: Partial<Attributes>) => {
	71	+ const { headerType } = attributes;
91	72	if (headerType === 'headlights') {
92	73	return <Headlights {...attributes} />;
93	74	}
94	75	if (headerType === 'headlightsMuted') {
		@@ -98,13 +79,7 @@
98	79	return <HeadlightsMutedAlt {...attributes} />;
99	80	}
100	81	if (headerType === 'simpleString') {
101	82	return <SimpleString {...attributes} />;
102		- }
103		- if (headerType === 'stringSmall') {
104		- return <StringSmall {...attributes} />;
105		- }
106		- if (headerType === 'pillString') {
107		- return <PillString {...attributes} />;
108	83	}
109	84	return null;
110	85	};