npm - @wordpress/edit-site - Versions diffs - 5.11.0 → 5.12.0 - Mend

@wordpress/edit-site 5.11.0 → 5.12.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (587) hide show

package/build/components/global-styles/gradients-palette-panel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/gradients-palette-panel.js"],"names":["useGlobalSetting","blockEditorPrivateApis","mobilePopoverProps","placement","offset","noop","GradientPalettePanel","name","themeGradients","setThemeGradients","baseThemeGradients","defaultGradients","setDefaultGradients","baseDefaultGradients","customGradients","setCustomGradients","defaultPaletteEnabled","customDuotone","defaultDuotone","themeDuotone","defaultDuotoneEnabled","duotonePalette","isMobileViewport","popoverProps","undefined","length"],"mappings":";;;;;;;;;;;AAGA;;AACA;;AAMA;;AACA;;AAKA;;AACA;;AAjBA;AACA;AACA;;AAWA;AACA;AACA;AAIA,MAAM;AAAEA,EAAAA;AAAF,IAAuB,yBAAQC,wBAAR,CAA7B;AACA,MAAMC,kBAAkB,GAAG;AAAEC,EAAAA,SAAS,EAAE,cAAb;AAA6BC,EAAAA,MAAM,EAAE;AAArC,CAA3B;;AAEA,MAAMC,IAAI,GAAG,MAAM,CAAE,CAArB;;AAEe,SAASC,oBAAT,~~OAA0C~~;~~AAAA,MAAX;~~AAAEC,~~IAAAA~~;AAAF,~~GAAW~~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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useViewportMatch } from '@wordpress/compose';\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalPaletteEdit as PaletteEdit,\n\t__experimentalSpacer as Spacer,\n\tDuotonePicker,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport Subtitle from './subtitle';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting } = unlock( blockEditorPrivateApis );\nconst mobilePopoverProps = { placement: 'bottom-start', offset: 8 };\n\nconst noop = () => {};\n\nexport default function GradientPalettePanel( { name } ) {\n\tconst [ themeGradients, setThemeGradients ] = useGlobalSetting(\n\t\t'color.gradients.theme',\n\t\tname\n\t);\n\tconst [ baseThemeGradients ] = useGlobalSetting(\n\t\t'color.gradients.theme',\n\t\tname,\n\t\t'base'\n\t);\n\tconst [ defaultGradients, setDefaultGradients ] = useGlobalSetting(\n\t\t'color.gradients.default',\n\t\tname\n\t);\n\tconst [ baseDefaultGradients ] = useGlobalSetting(\n\t\t'color.gradients.default',\n\t\tname,\n\t\t'base'\n\t);\n\tconst [ customGradients, setCustomGradients ] = useGlobalSetting(\n\t\t'color.gradients.custom',\n\t\tname\n\t);\n\n\tconst [ defaultPaletteEnabled ] = useGlobalSetting(\n\t\t'color.defaultGradients',\n\t\tname\n\t);\n\n\tconst [ customDuotone ] = useGlobalSetting( 'color.duotone.custom' ) \|\| [];\n\tconst [ defaultDuotone ] =\n\t\tuseGlobalSetting( 'color.duotone.default' ) \|\| [];\n\tconst [ themeDuotone ] = useGlobalSetting( 'color.duotone.theme' ) \|\| [];\n\tconst [ defaultDuotoneEnabled ] = useGlobalSetting(\n\t\t'color.defaultDuotone'\n\t);\n\n\tconst duotonePalette = [\n\t\t...( customDuotone \|\| [] ),\n\t\t...( themeDuotone \|\| [] ),\n\t\t...( defaultDuotone && defaultDuotoneEnabled ? defaultDuotone : [] ),\n\t];\n\n\tconst isMobileViewport = useViewportMatch( 'small', '<' );\n\tconst popoverProps = isMobileViewport ? mobilePopoverProps : undefined;\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"edit-site-global-styles-gradient-palette-panel\"\n\t\t\tspacing={ 10 }\n\t\t>\n\t\t\t{ !! themeGradients && !! themeGradients.length && (\n\t\t\t\t<PaletteEdit\n\t\t\t\t\tcanReset={ themeGradients !== baseThemeGradients }\n\t\t\t\t\tcanOnlyChangeValues\n\t\t\t\t\tgradients={ themeGradients }\n\t\t\t\t\tonChange={ setThemeGradients }\n\t\t\t\t\tpaletteLabel={ __( 'Theme' ) }\n\t\t\t\t\tpaletteLabelHeadingLevel={ 3 }\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ !! defaultGradients &&\n\t\t\t\t!! defaultGradients.length &&\n\t\t\t\t!! defaultPaletteEnabled && (\n\t\t\t\t\t<PaletteEdit\n\t\t\t\t\t\tcanReset={ defaultGradients !== baseDefaultGradients }\n\t\t\t\t\t\tcanOnlyChangeValues\n\t\t\t\t\t\tgradients={ defaultGradients }\n\t\t\t\t\t\tonChange={ setDefaultGradients }\n\t\t\t\t\t\tpaletteLabel={ __( 'Default' ) }\n\t\t\t\t\t\tpaletteLabelLevel={ 3 }\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t<PaletteEdit\n\t\t\t\tgradients={ customGradients }\n\t\t\t\tonChange={ setCustomGradients }\n\t\t\t\tpaletteLabel={ __( 'Custom' ) }\n\t\t\t\tpaletteLabelLevel={ 3 }\n\t\t\t\temptyMessage={ __(\n\t\t\t\t\t'Custom gradients are empty! Add some gradients to create your own palette.'\n\t\t\t\t) }\n\t\t\t\tslugPrefix=\"custom-\"\n\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t/>\n\t\t\t{ !! duotonePalette && !! duotonePalette.length && (\n\t\t\t\t<div>\n\t\t\t\t\t<Subtitle level={ 3 }>{ __( 'Duotone' ) }</Subtitle>\n\t\t\t\t\t<Spacer margin={ 3 } />\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomDuotone={ true }\n\t\t\t\t\t\tdisableCustomColors={ true }\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tonChange={ noop }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/gradients-palette-panel.js"],"names":["useGlobalSetting","blockEditorPrivateApis","mobilePopoverProps","placement","offset","noop","GradientPalettePanel","name","themeGradients","setThemeGradients","baseThemeGradients","defaultGradients","setDefaultGradients","baseDefaultGradients","customGradients","setCustomGradients","defaultPaletteEnabled","customDuotone","defaultDuotone","themeDuotone","defaultDuotoneEnabled","duotonePalette","isMobileViewport","popoverProps","undefined","length"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { useViewportMatch } from '@wordpress/compose';\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalPaletteEdit as PaletteEdit,\n\t__experimentalSpacer as Spacer,\n\tDuotonePicker,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport Subtitle from './subtitle';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting } = unlock( blockEditorPrivateApis );\nconst mobilePopoverProps = { placement: 'bottom-start', offset: 8 };\n\nconst noop = () => {};\n\nexport default function GradientPalettePanel( { name } ) {\n\tconst [ themeGradients, setThemeGradients ] = useGlobalSetting(\n\t\t'color.gradients.theme',\n\t\tname\n\t);\n\tconst [ baseThemeGradients ] = useGlobalSetting(\n\t\t'color.gradients.theme',\n\t\tname,\n\t\t'base'\n\t);\n\tconst [ defaultGradients, setDefaultGradients ] = useGlobalSetting(\n\t\t'color.gradients.default',\n\t\tname\n\t);\n\tconst [ baseDefaultGradients ] = useGlobalSetting(\n\t\t'color.gradients.default',\n\t\tname,\n\t\t'base'\n\t);\n\tconst [ customGradients, setCustomGradients ] = useGlobalSetting(\n\t\t'color.gradients.custom',\n\t\tname\n\t);\n\n\tconst [ defaultPaletteEnabled ] = useGlobalSetting(\n\t\t'color.defaultGradients',\n\t\tname\n\t);\n\n\tconst [ customDuotone ] = useGlobalSetting( 'color.duotone.custom' ) \|\| [];\n\tconst [ defaultDuotone ] =\n\t\tuseGlobalSetting( 'color.duotone.default' ) \|\| [];\n\tconst [ themeDuotone ] = useGlobalSetting( 'color.duotone.theme' ) \|\| [];\n\tconst [ defaultDuotoneEnabled ] = useGlobalSetting(\n\t\t'color.defaultDuotone'\n\t);\n\n\tconst duotonePalette = [\n\t\t...( customDuotone \|\| [] ),\n\t\t...( themeDuotone \|\| [] ),\n\t\t...( defaultDuotone && defaultDuotoneEnabled ? defaultDuotone : [] ),\n\t];\n\n\tconst isMobileViewport = useViewportMatch( 'small', '<' );\n\tconst popoverProps = isMobileViewport ? mobilePopoverProps : undefined;\n\n\treturn (\n\t\t<VStack\n\t\t\tclassName=\"edit-site-global-styles-gradient-palette-panel\"\n\t\t\tspacing={ 10 }\n\t\t>\n\t\t\t{ !! themeGradients && !! themeGradients.length && (\n\t\t\t\t<PaletteEdit\n\t\t\t\t\tcanReset={ themeGradients !== baseThemeGradients }\n\t\t\t\t\tcanOnlyChangeValues\n\t\t\t\t\tgradients={ themeGradients }\n\t\t\t\t\tonChange={ setThemeGradients }\n\t\t\t\t\tpaletteLabel={ __( 'Theme' ) }\n\t\t\t\t\tpaletteLabelHeadingLevel={ 3 }\n\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ !! defaultGradients &&\n\t\t\t\t!! defaultGradients.length &&\n\t\t\t\t!! defaultPaletteEnabled && (\n\t\t\t\t\t<PaletteEdit\n\t\t\t\t\t\tcanReset={ defaultGradients !== baseDefaultGradients }\n\t\t\t\t\t\tcanOnlyChangeValues\n\t\t\t\t\t\tgradients={ defaultGradients }\n\t\t\t\t\t\tonChange={ setDefaultGradients }\n\t\t\t\t\t\tpaletteLabel={ __( 'Default' ) }\n\t\t\t\t\t\tpaletteLabelLevel={ 3 }\n\t\t\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t<PaletteEdit\n\t\t\t\tgradients={ customGradients }\n\t\t\t\tonChange={ setCustomGradients }\n\t\t\t\tpaletteLabel={ __( 'Custom' ) }\n\t\t\t\tpaletteLabelLevel={ 3 }\n\t\t\t\temptyMessage={ __(\n\t\t\t\t\t'Custom gradients are empty! Add some gradients to create your own palette.'\n\t\t\t\t) }\n\t\t\t\tslugPrefix=\"custom-\"\n\t\t\t\tpopoverProps={ popoverProps }\n\t\t\t/>\n\t\t\t{ !! duotonePalette && !! duotonePalette.length && (\n\t\t\t\t<div>\n\t\t\t\t\t<Subtitle level={ 3 }>{ __( 'Duotone' ) }</Subtitle>\n\t\t\t\t\t<Spacer margin={ 3 } />\n\t\t\t\t\t<DuotonePicker\n\t\t\t\t\t\tduotonePalette={ duotonePalette }\n\t\t\t\t\t\tdisableCustomDuotone={ true }\n\t\t\t\t\t\tdisableCustomColors={ true }\n\t\t\t\t\t\tclearable={ false }\n\t\t\t\t\t\tonChange={ noop }\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n"]}

package/build/components/global-styles/header.js CHANGED Viewed

@@ -16,11 +16,10 @@ var _icons = require("@wordpress/icons");
 /**
  * WordPress dependencies
  */
-function ScreenHeader(_ref) {
-  let {
-    title,
-    description
-  } = _ref;
+function ScreenHeader({
+  title,
+  description
+}) {
   return (0, _element.createElement)(_components.__experimentalVStack, {
     spacing: 0
   }, (0, _element.createElement)(_components.__experimentalView, null, (0, _element.createElement)(_components.__experimentalSpacer, {

package/build/components/global-styles/header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/header.js"],"names":["ScreenHeader","title","description","minWidth","padding","chevronRight","chevronLeft"],"mappings":";;;;;;;;;AAGA;;AAQA;;AACA;;AAZA;AACA;AACA;AAYA,SAASA,YAAT,~~OAAgD~~;~~AAAA,MAAzB;~~AAAEC,~~IAAAA~~,KAAF;AAASC,~~IAAAA~~;AAAT,~~GAAyB~~;AAC/C,SACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,4BAAC,8BAAD,QACC,4BAAC,gCAAD;AAAQ,IAAA,YAAY,EAAG,CAAvB;AAA2B,IAAA,QAAQ,EAAG,CAAtC;AAA0C,IAAA,QAAQ,EAAG;AAArD,KACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,4BAAC,iDAAD;AACC,IAAA,KAAK,EACJ;AACA;AACA;AAAEC,MAAAA,QAAQ,EAAE,EAAZ;AAAgBC,MAAAA,OAAO,EAAE;AAAzB,KAJF;AAMC,IAAA,IAAI,EAAG,qBAAUC,mBAAV,GAAyBC,kBANjC;AAOC,IAAA,OAAO,MAPR;AAQC,kBAAa,cAAI,+BAAJ;AARd,IADD,EAWC,4BAAC,gCAAD,QACC,4BAAC,iCAAD;AACC,IAAA,SAAS,EAAC,gCADX;AAEC,IAAA,KAAK,EAAG,CAFT;AAGC,IAAA,IAAI,EAAG;AAHR,KAKGL,KALH,CADD,CAXD,CADD,CADD,CADD,EA0BGC,WAAW,IACZ;AAAG,IAAA,SAAS,EAAC;AAAb,KACGA,WADH,CA3BF,CADD;AAkCA;;eAEcF,Y","sourcesContent":["/*\n WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalHeading as Heading,\n\t__experimentalView as View,\n\t__experimentalNavigatorToParentButton as NavigatorToParentButton,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nfunction ScreenHeader( { title, description } ) {\n\treturn (\n\t\t<VStack spacing={ 0 }>\n\t\t\t<View>\n\t\t\t\t<Spacer marginBottom={ 0 } paddingX={ 4 } paddingY={ 3 }>\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<NavigatorToParentButton\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t// TODO: This style override is also used in ToolsPanelHeader.\n\t\t\t\t\t\t\t\t// It should be supported out-of-the-box by Button.\n\t\t\t\t\t\t\t\t{ minWidth: 24, padding: 0 }\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\taria-label={ __( 'Navigate to the previous view' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Spacer>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-header\"\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t</HStack>\n\t\t\t\t</Spacer>\n\t\t\t</View>\n\t\t\t{ description && (\n\t\t\t\t<p className=\"edit-site-global-styles-header__description\">\n\t\t\t\t\t{ description }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default ScreenHeader;\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/header.js"],"names":["ScreenHeader","title","description","minWidth","padding","chevronRight","chevronLeft"],"mappings":";;;;;;;;;AAGA;;AAQA;;AACA;;AAZA;AACA;AACA;AAYA,SAASA,YAAT,CAAuB;AAAEC,EAAAA,KAAF;AAASC,EAAAA;AAAT,CAAvB,EAAgD;AAC/C,SACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,4BAAC,8BAAD,QACC,4BAAC,gCAAD;AAAQ,IAAA,YAAY,EAAG,CAAvB;AAA2B,IAAA,QAAQ,EAAG,CAAtC;AAA0C,IAAA,QAAQ,EAAG;AAArD,KACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,4BAAC,iDAAD;AACC,IAAA,KAAK,EACJ;AACA;AACA;AAAEC,MAAAA,QAAQ,EAAE,EAAZ;AAAgBC,MAAAA,OAAO,EAAE;AAAzB,KAJF;AAMC,IAAA,IAAI,EAAG,qBAAUC,mBAAV,GAAyBC,kBANjC;AAOC,IAAA,OAAO,MAPR;AAQC,kBAAa,cAAI,+BAAJ;AARd,IADD,EAWC,4BAAC,gCAAD,QACC,4BAAC,iCAAD;AACC,IAAA,SAAS,EAAC,gCADX;AAEC,IAAA,KAAK,EAAG,CAFT;AAGC,IAAA,IAAI,EAAG;AAHR,KAKGL,KALH,CADD,CAXD,CADD,CADD,CADD,EA0BGC,WAAW,IACZ;AAAG,IAAA,SAAS,EAAC;AAAb,KACGA,WADH,CA3BF,CADD;AAkCA;;eAEcF,Y","sourcesContent":["/*\n WordPress dependencies\n */\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalHeading as Heading,\n\t__experimentalView as View,\n\t__experimentalNavigatorToParentButton as NavigatorToParentButton,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronRight, chevronLeft } from '@wordpress/icons';\n\nfunction ScreenHeader( { title, description } ) {\n\treturn (\n\t\t<VStack spacing={ 0 }>\n\t\t\t<View>\n\t\t\t\t<Spacer marginBottom={ 0 } paddingX={ 4 } paddingY={ 3 }>\n\t\t\t\t\t<HStack spacing={ 2 }>\n\t\t\t\t\t\t<NavigatorToParentButton\n\t\t\t\t\t\t\tstyle={\n\t\t\t\t\t\t\t\t// TODO: This style override is also used in ToolsPanelHeader.\n\t\t\t\t\t\t\t\t// It should be supported out-of-the-box by Button.\n\t\t\t\t\t\t\t\t{ minWidth: 24, padding: 0 }\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\ticon={ isRTL() ? chevronRight : chevronLeft }\n\t\t\t\t\t\t\tisSmall\n\t\t\t\t\t\t\taria-label={ __( 'Navigate to the previous view' ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Spacer>\n\t\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-header\"\n\t\t\t\t\t\t\t\tlevel={ 2 }\n\t\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ title }\n\t\t\t\t\t\t\t</Heading>\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t</HStack>\n\t\t\t\t</Spacer>\n\t\t\t</View>\n\t\t\t{ description && (\n\t\t\t\t<p className=\"edit-site-global-styles-header__description\">\n\t\t\t\t\t{ description }\n\t\t\t\t</p>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default ScreenHeader;\n"]}

package/build/components/global-styles/icon-with-current-color.js CHANGED Viewed

@@ -22,11 +22,10 @@ var _components = require("@wordpress/components");
 /**
  * WordPress dependencies
  */
-function IconWithCurrentColor(_ref) {
-  let {
-    className,
-    ...props
-  } = _ref;
+function IconWithCurrentColor({
+  className,
+  ...props
+}) {
   return (0, _element.createElement)(_components.Icon, (0, _extends2.default)({
     className: (0, _classnames.default)(className, 'edit-site-global-styles-icon-with-current-color')
   }, props));

package/build/components/global-styles/icon-with-current-color.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/icon-with-current-color.js"],"names":["IconWithCurrentColor","className","props"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGO,SAASA,oBAAT,~~OAAyD~~;~~AAAA,MAA1B;~~AAAEC,~~IAAAA~~,SAAF;AAAa,~~OAAGC~~;AAAhB,~~GAA0B~~;AAC/D,SACC,4BAAC,gBAAD;AACC,IAAA,SAAS,EAAG,yBACXD,SADW,EAEX,iDAFW;AADb,KAKMC,KALN,EADD;AASA","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n */\nimport { Icon } from '@wordpress/components';\n\nexport function IconWithCurrentColor( { className, ...props } ) {\n\treturn (\n\t\t<Icon\n\t\t\tclassName={ classnames(\n\t\t\t\tclassName,\n\t\t\t\t'edit-site-global-styles-icon-with-current-color'\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/icon-with-current-color.js"],"names":["IconWithCurrentColor","className","props"],"mappings":";;;;;;;;;;;;;AAGA;;AAKA;;AARA;AACA;AACA;;AAGA;AACA;AACA;AAGO,SAASA,oBAAT,CAA+B;AAAEC,EAAAA,SAAF;AAAa,KAAGC;AAAhB,CAA/B,EAAyD;AAC/D,SACC,4BAAC,gBAAD;AACC,IAAA,SAAS,EAAG,yBACXD,SADW,EAEX,iDAFW;AADb,KAKMC,KALN,EADD;AASA","sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n */\nimport { Icon } from '@wordpress/components';\n\nexport function IconWithCurrentColor( { className, ...props } ) {\n\treturn (\n\t\t<Icon\n\t\t\tclassName={ classnames(\n\t\t\t\tclassName,\n\t\t\t\t'edit-site-global-styles-icon-with-current-color'\n\t\t\t) }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"]}

package/build/components/global-styles/navigation-button.js CHANGED Viewed

@@ -23,12 +23,11 @@ var _iconWithCurrentColor = require("./icon-with-current-color");
 /**
  * Internal dependencies
  */
-function GenericNavigationButton(_ref) {
-  let {
-    icon,
-    children,
-    ...props
-  } = _ref;
+function GenericNavigationButton({
+  icon,
+  children,
+  ...props
+}) {
   return (0, _element.createElement)(_components.__experimentalItem, props, icon && (0, _element.createElement)(_components.__experimentalHStack, {
     justify: "flex-start"
   }, (0, _element.createElement)(_iconWithCurrentColor.IconWithCurrentColor, {

package/build/components/global-styles/navigation-button.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/navigation-button.js"],"names":["GenericNavigationButton","icon","children","props","NavigationButtonAsItem","NavigationBackButtonAsItem"],"mappings":";;;;;;;;;;;;;;AAGA;;AAWA;;AAdA;AACA;AACA;;AASA;AACA;AACA;AAGA,SAASA,uBAAT,~~OAAiE~~;~~AAAA,MAA/B;~~AAAEC,~~IAAAA~~,IAAF;AAAQC,~~IAAAA~~,QAAR;AAAkB,~~OAAGC~~;AAArB,~~GAA+B~~;AAChE,SACC,4BAAC,8BAAD,EAAWA,KAAX,EACGF,IAAI,IACL,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,4BAAC,0CAAD;AAAsB,IAAA,IAAI,EAAGA,IAA7B;AAAoC,IAAA,IAAI,EAAG;AAA3C,IADD,EAEC,4BAAC,oBAAD,QAAYC,QAAZ,CAFD,CAFF,EAOG,CAAED,IAAF,IAAUC,QAPb,CADD;AAWA;;AAED,SAASE,sBAAT,CAAiCD,KAAjC,EAAyC;AACxC,SAAO,4BAAC,yCAAD;AAAiB,IAAA,EAAE,EAAGH;AAAtB,KAAqDG,KAArD,EAAP;AACA;;AAED,SAASE,0BAAT,CAAqCF,KAArC,EAA6C;AAC5C,SACC,4BAAC,iDAAD;AAAyB,IAAA,EAAE,EAAGH;AAA9B,KAA6DG,KAA7D,EADD;AAGA","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalNavigatorButton as NavigatorButton,\n\t__experimentalNavigatorToParentButton as NavigatorToParentButton,\n\t__experimentalItem as Item,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport { IconWithCurrentColor } from './icon-with-current-color';\n\nfunction GenericNavigationButton( { icon, children, ...props } ) {\n\treturn (\n\t\t<Item { ...props }>\n\t\t\t{ icon && (\n\t\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t\t<IconWithCurrentColor icon={ icon } size={ 24 } />\n\t\t\t\t\t<FlexItem>{ children }</FlexItem>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ ! icon && children }\n\t\t</Item>\n\t);\n}\n\nfunction NavigationButtonAsItem( props ) {\n\treturn <NavigatorButton as={ GenericNavigationButton } { ...props } />;\n}\n\nfunction NavigationBackButtonAsItem( props ) {\n\treturn (\n\t\t<NavigatorToParentButton as={ GenericNavigationButton } { ...props } />\n\t);\n}\n\nexport { NavigationButtonAsItem, NavigationBackButtonAsItem };\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/navigation-button.js"],"names":["GenericNavigationButton","icon","children","props","NavigationButtonAsItem","NavigationBackButtonAsItem"],"mappings":";;;;;;;;;;;;;;AAGA;;AAWA;;AAdA;AACA;AACA;;AASA;AACA;AACA;AAGA,SAASA,uBAAT,CAAkC;AAAEC,EAAAA,IAAF;AAAQC,EAAAA,QAAR;AAAkB,KAAGC;AAArB,CAAlC,EAAiE;AAChE,SACC,4BAAC,8BAAD,EAAWA,KAAX,EACGF,IAAI,IACL,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,4BAAC,0CAAD;AAAsB,IAAA,IAAI,EAAGA,IAA7B;AAAoC,IAAA,IAAI,EAAG;AAA3C,IADD,EAEC,4BAAC,oBAAD,QAAYC,QAAZ,CAFD,CAFF,EAOG,CAAED,IAAF,IAAUC,QAPb,CADD;AAWA;;AAED,SAASE,sBAAT,CAAiCD,KAAjC,EAAyC;AACxC,SAAO,4BAAC,yCAAD;AAAiB,IAAA,EAAE,EAAGH;AAAtB,KAAqDG,KAArD,EAAP;AACA;;AAED,SAASE,0BAAT,CAAqCF,KAArC,EAA6C;AAC5C,SACC,4BAAC,iDAAD;AAAyB,IAAA,EAAE,EAAGH;AAA9B,KAA6DG,KAA7D,EADD;AAGA","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalNavigatorButton as NavigatorButton,\n\t__experimentalNavigatorToParentButton as NavigatorToParentButton,\n\t__experimentalItem as Item,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport { IconWithCurrentColor } from './icon-with-current-color';\n\nfunction GenericNavigationButton( { icon, children, ...props } ) {\n\treturn (\n\t\t<Item { ...props }>\n\t\t\t{ icon && (\n\t\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t\t<IconWithCurrentColor icon={ icon } size={ 24 } />\n\t\t\t\t\t<FlexItem>{ children }</FlexItem>\n\t\t\t\t</HStack>\n\t\t\t) }\n\t\t\t{ ! icon && children }\n\t\t</Item>\n\t);\n}\n\nfunction NavigationButtonAsItem( props ) {\n\treturn <NavigatorButton as={ GenericNavigationButton } { ...props } />;\n}\n\nfunction NavigationBackButtonAsItem( props ) {\n\treturn (\n\t\t<NavigatorToParentButton as={ GenericNavigationButton } { ...props } />\n\t);\n}\n\nexport { NavigationButtonAsItem, NavigationBackButtonAsItem };\n"]}

package/build/components/global-styles/palette.js CHANGED Viewed

@@ -39,10 +39,9 @@ const {
 } = (0, _privateApis.unlock)(_blockEditor.privateApis);
 const EMPTY_COLORS = [];
-function Palette(_ref) {
-  let {
-    name
-  } = _ref;
+function Palette({
+  name
+}) {
   const [customColors] = useGlobalSetting('color.palette.custom');
   const [themeColors] = useGlobalSetting('color.palette.theme');
   const [defaultColors] = useGlobalSetting('color.palette.default');
@@ -67,16 +66,13 @@ function Palette(_ref) {
   }, (0, _element.createElement)(_components.__experimentalZStack, {
     isLayered: false,
     offset: -8
-  }, colors.slice(0, 5).map((_ref2, index) => {
-    let {
-      color
-    } = _ref2;
-    return (0, _element.createElement)(_colorIndicatorWrapper.default, {
-      key: `${color}-${index}`
-    }, (0, _element.createElement)(_components.ColorIndicator, {
-      colorValue: color
-    }));
-  })), (0, _element.createElement)(_components.FlexItem, null, paletteButtonText)))), randomizeThemeColors && (0, _element.createElement)(_components.Button, {
+  }, colors.slice(0, 5).map(({
+    color
+  }, index) => (0, _element.createElement)(_colorIndicatorWrapper.default, {
+    key: `${color}-${index}`
+  }, (0, _element.createElement)(_components.ColorIndicator, {
+    colorValue: color
+  })))), (0, _element.createElement)(_components.FlexItem, null, paletteButtonText)))), randomizeThemeColors && (0, _element.createElement)(_components.Button, {
     variant: "secondary",
     icon: _icons.shuffle,
     onClick: randomizeThemeColors

package/build/components/global-styles/palette.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/palette.js"],"names":["useGlobalSetting","blockEditorPrivateApis","EMPTY_COLORS","Palette","name","customColors","themeColors","defaultColors","defaultPaletteEnabled","randomizeThemeColors","colors","screenPath","encodeURIComponent","paletteButtonText","length","slice","map","~~index~~","~~color~~","shuffle"],"mappings":";;;;;;;;;AAcA;;AAXA;;AASA;;AACA;;AAEA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAxBA;AACA;AACA;;AAeA;AACA;AACA;AAOA,MAAM;AAAEA,EAAAA;AAAF,IAAuB,yBAAQC,wBAAR,CAA7B;AAEA,MAAMC,YAAY,GAAG,EAArB;;AAEA,SAASC,OAAT,~~OAA6B~~;~~AAAA,MAAX;~~AAAEC,~~IAAAA~~;AAAF,~~GAAW~~;AAC5B,QAAM,CAAEC,YAAF,IAAmBL,gBAAgB,CAAE,sBAAF,CAAzC;AACA,QAAM,CAAEM,WAAF,IAAkBN,gBAAgB,CAAE,qBAAF,CAAxC;AACA,QAAM,CAAEO,aAAF,IAAoBP,gBAAgB,CAAE,uBAAF,CAA1C;AAEA,QAAM,CAAEQ,qBAAF,IAA4BR,gBAAgB,CACjD,sBADiD,EAEjDI,IAFiD,CAAlD;AAKA,QAAM,CAAEK,oBAAF,IAA2B,gCAAjC;AAEA,QAAMC,MAAM,GAAG,sBACd,MAAM,CACL,IAAKL,YAAY,IAAIH,YAArB,CADK,EAEL,IAAKI,WAAW,IAAIJ,YAApB,CAFK,EAGL,IAAKK,aAAa,IAAIC,qBAAjB,GACFD,aADE,GAEFL,YAFH,CAHK,CADQ,EAQd,CAAEG,YAAF,EAAgBC,WAAhB,EAA6BC,aAA7B,EAA4CC,qBAA5C,CARc,CAAf;AAWA,QAAMG,UAAU,GAAG,CAAEP,IAAF,GAChB,iBADgB,GAEhB,aAAaQ,kBAAkB,CAAER,IAAF,CAA/B,GAA0C,iBAF7C;AAGA,QAAMS,iBAAiB,GACtBH,MAAM,CAACI,MAAP,GAAgB,CAAhB,GACG,oBACA;AACA,gBAAI,UAAJ,EAAgB,WAAhB,EAA6BJ,MAAM,CAACI,MAApC,CAFA,EAGAJ,MAAM,CAACI,MAHP,CADH,GAMG,cAAI,mBAAJ,CAPJ;AASA,SACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,4BAAC,iBAAD;AAAU,IAAA,KAAK,EAAG;AAAlB,KAAwB,cAAI,SAAJ,CAAxB,CADD,EAEC,4BAAC,mCAAD;AAAW,IAAA,UAAU,MAArB;AAAsB,IAAA,WAAW;AAAjC,KACC,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGH,UADR;AAEC,kBAAa,cAAI,gBAAJ;AAFd,KAIC,4BAAC,gCAAD;AACC,IAAA,SAAS,EACRD,MAAM,CAACI,MAAP,KAAkB,CAAlB,GAAsB,aAAtB,GAAsC;AAFxC,KAKC,4BAAC,gCAAD;AAAQ,IAAA,SAAS,EAAG,KAApB;AAA4B,IAAA,MAAM,EAAG,CAAC;AAAtC,KACGJ,MAAM,CACNK,KADA,CACO,CADP,EACU,CADV,EAEAC,GAFA,CAEK,~~QAAaC,KAAb~~;~~AAAA,QAAE;~~AAAEC,~~MAAAA~~;AAAF,~~KAAF;AAAA~~,~~WACL~~,4BAAC,8BAAD;AACC,~~MAAA~~,GAAG,EAAI,~~GAAGA~~,KAAO,~~IAAID~~,KAAO;AAD7B,~~OAGC~~,4BAAC,0BAAD;AAAgB,~~MAAA~~,UAAU,~~EAAGC~~;AAA7B,~~MAHD~~,~~CADK;AAAA~~,~~GAFL,~~CADH,CALD,EAgBC,4BAAC,oBAAD,~~QAAYL~~,iBAAZ,CAhBD,CAJD,CADD,CAFD,EA2BGJ,oBAAoB,IACrB,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,IAAI,EAAGU,cAFR;AAGC,IAAA,OAAO,EAAGV;AAHX,KAKG,cAAI,kBAAJ,CALH,CA5BF,CADD;AAuCA;;eAEcN,O","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n\t__experimentalZStack as ZStack,\n\t__experimentalVStack as VStack,\n\tColorIndicator,\n\tButton,\n} from '@wordpress/components';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { shuffle } from '@wordpress/icons';\nimport { useMemo } from '@wordpress/element';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport Subtitle from './subtitle';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { useColorRandomizer } from './hooks';\nimport ColorIndicatorWrapper from './color-indicator-wrapper';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting } = unlock( blockEditorPrivateApis );\n\nconst EMPTY_COLORS = [];\n\nfunction Palette( { name } ) {\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ defaultColors ] = useGlobalSetting( 'color.palette.default' );\n\n\tconst [ defaultPaletteEnabled ] = useGlobalSetting(\n\t\t'color.defaultPalette',\n\t\tname\n\t);\n\n\tconst [ randomizeThemeColors ] = useColorRandomizer();\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( customColors \|\| EMPTY_COLORS ),\n\t\t\t...( themeColors \|\| EMPTY_COLORS ),\n\t\t\t...( defaultColors && defaultPaletteEnabled\n\t\t\t\t? defaultColors\n\t\t\t\t: EMPTY_COLORS ),\n\t\t],\n\t\t[ customColors, themeColors, defaultColors, defaultPaletteEnabled ]\n\t);\n\n\tconst screenPath = ! name\n\t\t? '/colors/palette'\n\t\t: '/blocks/' + encodeURIComponent( name ) + '/colors/palette';\n\tconst paletteButtonText =\n\t\tcolors.length > 0\n\t\t\t? sprintf(\n\t\t\t\t\t// Translators: %d: Number of palette colors.\n\t\t\t\t\t_n( '%d color', '%d colors', colors.length ),\n\t\t\t\t\tcolors.length\n\t\t\t )\n\t\t\t: __( 'Add custom colors' );\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t<Subtitle level={ 3 }>{ __( 'Palette' ) }</Subtitle>\n\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\tpath={ screenPath }\n\t\t\t\t\taria-label={ __( 'Color palettes' ) }\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tdirection={\n\t\t\t\t\t\t\tcolors.length === 0 ? 'row-reverse' : 'row'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t\t\t{ colors\n\t\t\t\t\t\t\t\t.slice( 0, 5 )\n\t\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t\t<ColorIndicatorWrapper\n\t\t\t\t\t\t\t\t\t\tkey={ `${ color }-${ index }` }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</ZStack>\n\t\t\t\t\t\t<FlexItem>{ paletteButtonText }</FlexItem>\n\t\t\t\t\t</HStack>\n\t\t\t\t</NavigationButtonAsItem>\n\t\t\t</ItemGroup>\n\t\t\t{ randomizeThemeColors && (\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\ticon={ shuffle }\n\t\t\t\t\tonClick={ randomizeThemeColors }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Randomize colors' ) }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default Palette;\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/palette.js"],"names":["useGlobalSetting","blockEditorPrivateApis","EMPTY_COLORS","Palette","name","customColors","themeColors","defaultColors","defaultPaletteEnabled","randomizeThemeColors","colors","screenPath","encodeURIComponent","paletteButtonText","length","slice","map","color","index","shuffle"],"mappings":";;;;;;;;;AAcA;;AAXA;;AASA;;AACA;;AAEA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAxBA;AACA;AACA;;AAeA;AACA;AACA;AAOA,MAAM;AAAEA,EAAAA;AAAF,IAAuB,yBAAQC,wBAAR,CAA7B;AAEA,MAAMC,YAAY,GAAG,EAArB;;AAEA,SAASC,OAAT,CAAkB;AAAEC,EAAAA;AAAF,CAAlB,EAA6B;AAC5B,QAAM,CAAEC,YAAF,IAAmBL,gBAAgB,CAAE,sBAAF,CAAzC;AACA,QAAM,CAAEM,WAAF,IAAkBN,gBAAgB,CAAE,qBAAF,CAAxC;AACA,QAAM,CAAEO,aAAF,IAAoBP,gBAAgB,CAAE,uBAAF,CAA1C;AAEA,QAAM,CAAEQ,qBAAF,IAA4BR,gBAAgB,CACjD,sBADiD,EAEjDI,IAFiD,CAAlD;AAKA,QAAM,CAAEK,oBAAF,IAA2B,gCAAjC;AAEA,QAAMC,MAAM,GAAG,sBACd,MAAM,CACL,IAAKL,YAAY,IAAIH,YAArB,CADK,EAEL,IAAKI,WAAW,IAAIJ,YAApB,CAFK,EAGL,IAAKK,aAAa,IAAIC,qBAAjB,GACFD,aADE,GAEFL,YAFH,CAHK,CADQ,EAQd,CAAEG,YAAF,EAAgBC,WAAhB,EAA6BC,aAA7B,EAA4CC,qBAA5C,CARc,CAAf;AAWA,QAAMG,UAAU,GAAG,CAAEP,IAAF,GAChB,iBADgB,GAEhB,aAAaQ,kBAAkB,CAAER,IAAF,CAA/B,GAA0C,iBAF7C;AAGA,QAAMS,iBAAiB,GACtBH,MAAM,CAACI,MAAP,GAAgB,CAAhB,GACG,oBACA;AACA,gBAAI,UAAJ,EAAgB,WAAhB,EAA6BJ,MAAM,CAACI,MAApC,CAFA,EAGAJ,MAAM,CAACI,MAHP,CADH,GAMG,cAAI,mBAAJ,CAPJ;AASA,SACC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAG;AAAlB,KACC,4BAAC,iBAAD;AAAU,IAAA,KAAK,EAAG;AAAlB,KAAwB,cAAI,SAAJ,CAAxB,CADD,EAEC,4BAAC,mCAAD;AAAW,IAAA,UAAU,MAArB;AAAsB,IAAA,WAAW;AAAjC,KACC,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAGH,UADR;AAEC,kBAAa,cAAI,gBAAJ;AAFd,KAIC,4BAAC,gCAAD;AACC,IAAA,SAAS,EACRD,MAAM,CAACI,MAAP,KAAkB,CAAlB,GAAsB,aAAtB,GAAsC;AAFxC,KAKC,4BAAC,gCAAD;AAAQ,IAAA,SAAS,EAAG,KAApB;AAA4B,IAAA,MAAM,EAAG,CAAC;AAAtC,KACGJ,MAAM,CACNK,KADA,CACO,CADP,EACU,CADV,EAEAC,GAFA,CAEK,CAAE;AAAEC,IAAAA;AAAF,GAAF,EAAaC,KAAb,KACL,4BAAC,8BAAD;AACC,IAAA,GAAG,EAAI,GAAGD,KAAO,IAAIC,KAAO;AAD7B,KAGC,4BAAC,0BAAD;AAAgB,IAAA,UAAU,EAAGD;AAA7B,IAHD,CAHA,CADH,CALD,EAgBC,4BAAC,oBAAD,QAAYJ,iBAAZ,CAhBD,CAJD,CADD,CAFD,EA2BGJ,oBAAoB,IACrB,4BAAC,kBAAD;AACC,IAAA,OAAO,EAAC,WADT;AAEC,IAAA,IAAI,EAAGU,cAFR;AAGC,IAAA,OAAO,EAAGV;AAHX,KAKG,cAAI,kBAAJ,CALH,CA5BF,CADD;AAuCA;;eAEcN,O","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\tFlexItem,\n\t__experimentalHStack as HStack,\n\t__experimentalZStack as ZStack,\n\t__experimentalVStack as VStack,\n\tColorIndicator,\n\tButton,\n} from '@wordpress/components';\nimport { __, _n, sprintf } from '@wordpress/i18n';\nimport { shuffle } from '@wordpress/icons';\nimport { useMemo } from '@wordpress/element';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport Subtitle from './subtitle';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { useColorRandomizer } from './hooks';\nimport ColorIndicatorWrapper from './color-indicator-wrapper';\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting } = unlock( blockEditorPrivateApis );\n\nconst EMPTY_COLORS = [];\n\nfunction Palette( { name } ) {\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ defaultColors ] = useGlobalSetting( 'color.palette.default' );\n\n\tconst [ defaultPaletteEnabled ] = useGlobalSetting(\n\t\t'color.defaultPalette',\n\t\tname\n\t);\n\n\tconst [ randomizeThemeColors ] = useColorRandomizer();\n\n\tconst colors = useMemo(\n\t\t() => [\n\t\t\t...( customColors \|\| EMPTY_COLORS ),\n\t\t\t...( themeColors \|\| EMPTY_COLORS ),\n\t\t\t...( defaultColors && defaultPaletteEnabled\n\t\t\t\t? defaultColors\n\t\t\t\t: EMPTY_COLORS ),\n\t\t],\n\t\t[ customColors, themeColors, defaultColors, defaultPaletteEnabled ]\n\t);\n\n\tconst screenPath = ! name\n\t\t? '/colors/palette'\n\t\t: '/blocks/' + encodeURIComponent( name ) + '/colors/palette';\n\tconst paletteButtonText =\n\t\tcolors.length > 0\n\t\t\t? sprintf(\n\t\t\t\t\t// Translators: %d: Number of palette colors.\n\t\t\t\t\t_n( '%d color', '%d colors', colors.length ),\n\t\t\t\t\tcolors.length\n\t\t\t )\n\t\t\t: __( 'Add custom colors' );\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t<Subtitle level={ 3 }>{ __( 'Palette' ) }</Subtitle>\n\t\t\t<ItemGroup isBordered isSeparated>\n\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\tpath={ screenPath }\n\t\t\t\t\taria-label={ __( 'Color palettes' ) }\n\t\t\t\t>\n\t\t\t\t\t<HStack\n\t\t\t\t\t\tdirection={\n\t\t\t\t\t\t\tcolors.length === 0 ? 'row-reverse' : 'row'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<ZStack isLayered={ false } offset={ -8 }>\n\t\t\t\t\t\t\t{ colors\n\t\t\t\t\t\t\t\t.slice( 0, 5 )\n\t\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t\t<ColorIndicatorWrapper\n\t\t\t\t\t\t\t\t\t\tkey={ `${ color }-${ index }` }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<ColorIndicator colorValue={ color } />\n\t\t\t\t\t\t\t\t\t</ColorIndicatorWrapper>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</ZStack>\n\t\t\t\t\t\t<FlexItem>{ paletteButtonText }</FlexItem>\n\t\t\t\t\t</HStack>\n\t\t\t\t</NavigationButtonAsItem>\n\t\t\t</ItemGroup>\n\t\t\t{ randomizeThemeColors && (\n\t\t\t\t<Button\n\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\ticon={ shuffle }\n\t\t\t\t\tonClick={ randomizeThemeColors }\n\t\t\t\t>\n\t\t\t\t\t{ __( 'Randomize colors' ) }\n\t\t\t\t</Button>\n\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default Palette;\n"]}

package/build/components/global-styles/preview.js CHANGED Viewed

@@ -59,12 +59,11 @@ const normalizedWidth = 248;
 const normalizedHeight = 152;
 const normalizedColorSwatchSize = 32;
-const StylesPreview = _ref => {
-  let {
-    label,
-    isFocused,
-    withHoverView
-  } = _ref;
+const StylesPreview = ({
+  label,
+  isFocused,
+  withHoverView
+}) => {
   const [fontWeight] = useGlobalStyle('typography.fontWeight');
   const [fontFamily = 'serif'] = useGlobalStyle('typography.fontFamily');
   const [headingFontFamily = fontFamily] = useGlobalStyle('elements.h1.typography.fontFamily');
@@ -85,12 +84,9 @@ const StylesPreview = _ref => {
   const ratio = width ? width / normalizedWidth : 1;
   const paletteColors = (themeColors !== null && themeColors !== void 0 ? themeColors : []).concat(customColors !== null && customColors !== void 0 ? customColors : []).concat(coreColors !== null && coreColors !== void 0 ? coreColors : []);
   const highlightedColors = paletteColors.filter( // we exclude these two colors because they are already visible in the preview.
-  _ref2 => {
-    let {
-      color
-    } = _ref2;
-    return color !== backgroundColor && color !== headingColor;
-  }).slice(0, 2); // Reset leaked styles from WP common.css and remove main content layout padding and border.
+  ({
+    color
+  }) => color !== backgroundColor && color !== headingColor).slice(0, 2); // Reset leaked styles from WP common.css and remove main content layout padding and border.
   const editorStyles = (0, _element.useMemo)(() => {
     if (styles) {
@@ -160,32 +156,29 @@ const StylesPreview = _ref => {
     }
   }, "Aa"), (0, _element.createElement)(_components.__experimentalVStack, {
     spacing: 4 * ratio
-  }, highlightedColors.map((_ref3, index) => {
-    let {
-      slug,
-      color
-    } = _ref3;
-    return (0, _element.createElement)(_components.__unstableMotion.div, {
-      key: slug,
-      style: {
-        height: normalizedColorSwatchSize * ratio,
-        width: normalizedColorSwatchSize * ratio,
-        background: color,
-        borderRadius: normalizedColorSwatchSize * ratio / 2
-      },
-      animate: {
-        scale: 1,
-        opacity: 1
-      },
-      initial: {
-        scale: 0.1,
-        opacity: 0
-      },
-      transition: {
-        delay: index === 1 ? 0.2 : 0.1
-      }
-    });
-  })))), (0, _element.createElement)(_components.__unstableMotion.div, {
+  }, highlightedColors.map(({
+    slug,
+    color
+  }, index) => (0, _element.createElement)(_components.__unstableMotion.div, {
+    key: slug,
+    style: {
+      height: normalizedColorSwatchSize * ratio,
+      width: normalizedColorSwatchSize * ratio,
+      background: color,
+      borderRadius: normalizedColorSwatchSize * ratio / 2
+    },
+    animate: {
+      scale: 1,
+      opacity: 1
+    },
+    initial: {
+      scale: 0.1,
+      opacity: 0
+    },
+    transition: {
+      delay: index === 1 ? 0.2 : 0.1
+    }
+  }))))), (0, _element.createElement)(_components.__unstableMotion.div, {
     variants: withHoverView && midFrame,
     style: {
       height: '100%',
@@ -203,19 +196,16 @@ const StylesPreview = _ref => {
       height: '100%',
       overflow: 'hidden'
     }
-  }, paletteColors.slice(0, 4).map((_ref4, index) => {
-    let {
-      color
-    } = _ref4;
-    return (0, _element.createElement)("div", {
-      key: index,
-      style: {
-        height: '100%',
-        background: color,
-        flexGrow: 1
-      }
-    });
-  }))), (0, _element.createElement)(_components.__unstableMotion.div, {
+  }, paletteColors.slice(0, 4).map(({
+    color
+  }, index) => (0, _element.createElement)("div", {
+    key: index,
+    style: {
+      height: '100%',
+      background: color,
+      flexGrow: 1
+    }
+  })))), (0, _element.createElement)(_components.__unstableMotion.div, {
     variants: secondFrame,
     style: {
       height: '100%',

package/build/components/global-styles/preview.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/preview.js"],"names":["useGlobalSetting","useGlobalStyle","useGlobalStylesOutput","blockEditorPrivateApis","firstFrame","start","scale","opacity","hover","midFrame","secondFrame","normalizedWidth","normalizedHeight","normalizedColorSwatchSize","StylesPreview","label","isFocused","withHoverView","fontWeight","fontFamily","headingFontFamily","headingFontWeight","textColor","headingColor","backgroundColor","gradientValue","styles","disableMotion","coreColors","themeColors","customColors","isHovered","setIsHovered","containerResizeListener","width","ratio","paletteColors","concat","highlightedColors","filter","color","slice","editorStyles","css","isGlobalStyles","isReady","position","height","background","cursor","undefined","overflow","fontSize","delay","type","map","index","slug","borderRadius","top","flexGrow","padding","boxSizing","lineHeight","textAlign"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__unstableIframe as Iframe,\n\t__unstableEditorStyles as EditorStyles,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport {\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\nimport { useState, useMemo } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle, useGlobalStylesOutput } = unlock(\n\tblockEditorPrivateApis\n);\n\nconst firstFrame = {\n\tstart: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\thover: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst midFrame = {\n\thover: {\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\topacity: 0.5,\n\t},\n};\n\nconst secondFrame = {\n\thover: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\nconst normalizedColorSwatchSize = 32;\n\nconst StylesPreview = ( { label, isFocused, withHoverView } ) => {\n\tconst [ fontWeight ] = useGlobalStyle( 'typography.fontWeight' );\n\tconst [ fontFamily = 'serif' ] = useGlobalStyle( 'typography.fontFamily' );\n\tconst [ headingFontFamily = fontFamily ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontFamily'\n\t);\n\tconst [ headingFontWeight = fontWeight ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontWeight'\n\t);\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst [ styles ] = useGlobalStylesOutput();\n\tconst disableMotion = useReducedMotion();\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst ratio = width ? width / normalizedWidth : 1;\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\tconst highlightedColors = paletteColors\n\t\t.filter(\n\t\t\t// we exclude these two colors because they are already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor && color !== headingColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\t// Reset leaked styles from WP common.css and remove main content layout padding and border.\n\tconst editorStyles = useMemo( () => {\n\t\tif ( styles ) {\n\t\t\treturn [\n\t\t\t\t...styles,\n\t\t\t\t{\n\t\t\t\t\tcss: 'html{overflow:hidden}body{min-width: 0;padding: 0;border: none;}',\n\t\t\t\t\tisGlobalStyles: true,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn styles;\n\t}, [ styles ] );\n\tconst isReady = !! width;\n\n\treturn (\n\t\t<>\n\t\t\t<div style={ { position: 'relative' } }>\n\t\t\t\t{ containerResizeListener }\n\t\t\t</div>\n\t\t\t{ isReady && (\n\t\t\t\t<Iframe\n\t\t\t\t\tclassName=\"edit-site-global-styles-preview__iframe\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: normalizedHeight ratio,\n\t\t\t\t\t} }\n\t\t\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t>\n\t\t\t\t\t<EditorStyles styles={ editorStyles } />\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\t\t\tcursor: withHoverView ? 'pointer' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tinitial=\"start\"\n\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t( isHovered \|\| isFocused ) &&\n\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t\t\t: 'start'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ firstFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\tfontSize: 65 * ratio,\n\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\t\t\ttransition={ { delay: 0.3, type: 'tween' } }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\tAa\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t<VStack spacing={ 4 * ratio }>\n\t\t\t\t\t\t\t\t\t{ highlightedColors.map(\n\t\t\t\t\t\t\t\t\t\t( { slug, color }, index ) => (\n\t\t\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ slug }\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderRadius:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t( normalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio ) /\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t2,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 0.1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tdelay:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex === 1 ? 0.2 : 0.1,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ withHoverView && midFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tfilter: 'blur(60px)',\n\t\t\t\t\t\t\t\topacity: 0.1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ paletteColors\n\t\t\t\t\t\t\t\t\t.slice( 0, 4 )\n\t\t\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\tflexGrow: 1,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ secondFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tspacing={ 3 ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t\tpadding: 10 * ratio,\n\t\t\t\t\t\t\t\t\tboxSizing: 'border-box',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ label && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tfontSize: 40 * ratio,\n\t\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t\t\tlineHeight: '1em',\n\t\t\t\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t</Iframe>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nexport default StylesPreview;\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/preview.js"],"names":["useGlobalSetting","useGlobalStyle","useGlobalStylesOutput","blockEditorPrivateApis","firstFrame","start","scale","opacity","hover","midFrame","secondFrame","normalizedWidth","normalizedHeight","normalizedColorSwatchSize","StylesPreview","label","isFocused","withHoverView","fontWeight","fontFamily","headingFontFamily","headingFontWeight","textColor","headingColor","backgroundColor","gradientValue","styles","disableMotion","coreColors","themeColors","customColors","isHovered","setIsHovered","containerResizeListener","width","ratio","paletteColors","concat","highlightedColors","filter","color","slice","editorStyles","css","isGlobalStyles","isReady","position","height","background","cursor","undefined","overflow","fontSize","delay","type","map","slug","index","borderRadius","top","flexGrow","padding","boxSizing","lineHeight","textAlign"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__unstableIframe as Iframe,\n\t__unstableEditorStyles as EditorStyles,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport {\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\nimport { useState, useMemo } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../private-apis';\n\nconst { useGlobalSetting, useGlobalStyle, useGlobalStylesOutput } = unlock(\n\tblockEditorPrivateApis\n);\n\nconst firstFrame = {\n\tstart: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\thover: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst midFrame = {\n\thover: {\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\topacity: 0.5,\n\t},\n};\n\nconst secondFrame = {\n\thover: {\n\t\tscale: 1,\n\t\topacity: 1,\n\t},\n\tstart: {\n\t\tscale: 0,\n\t\topacity: 0,\n\t},\n};\n\nconst normalizedWidth = 248;\nconst normalizedHeight = 152;\n\nconst normalizedColorSwatchSize = 32;\n\nconst StylesPreview = ( { label, isFocused, withHoverView } ) => {\n\tconst [ fontWeight ] = useGlobalStyle( 'typography.fontWeight' );\n\tconst [ fontFamily = 'serif' ] = useGlobalStyle( 'typography.fontFamily' );\n\tconst [ headingFontFamily = fontFamily ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontFamily'\n\t);\n\tconst [ headingFontWeight = fontWeight ] = useGlobalStyle(\n\t\t'elements.h1.typography.fontWeight'\n\t);\n\tconst [ textColor = 'black' ] = useGlobalStyle( 'color.text' );\n\tconst [ headingColor = textColor ] = useGlobalStyle(\n\t\t'elements.h1.color.text'\n\t);\n\tconst [ backgroundColor = 'white' ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst [ styles ] = useGlobalStylesOutput();\n\tconst disableMotion = useReducedMotion();\n\tconst [ coreColors ] = useGlobalSetting( 'color.palette.core' );\n\tconst [ themeColors ] = useGlobalSetting( 'color.palette.theme' );\n\tconst [ customColors ] = useGlobalSetting( 'color.palette.custom' );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ containerResizeListener, { width } ] = useResizeObserver();\n\tconst ratio = width ? width / normalizedWidth : 1;\n\n\tconst paletteColors = ( themeColors ?? [] )\n\t\t.concat( customColors ?? [] )\n\t\t.concat( coreColors ?? [] );\n\tconst highlightedColors = paletteColors\n\t\t.filter(\n\t\t\t// we exclude these two colors because they are already visible in the preview.\n\t\t\t( { color } ) => color !== backgroundColor && color !== headingColor\n\t\t)\n\t\t.slice( 0, 2 );\n\n\t// Reset leaked styles from WP common.css and remove main content layout padding and border.\n\tconst editorStyles = useMemo( () => {\n\t\tif ( styles ) {\n\t\t\treturn [\n\t\t\t\t...styles,\n\t\t\t\t{\n\t\t\t\t\tcss: 'html{overflow:hidden}body{min-width: 0;padding: 0;border: none;}',\n\t\t\t\t\tisGlobalStyles: true,\n\t\t\t\t},\n\t\t\t];\n\t\t}\n\n\t\treturn styles;\n\t}, [ styles ] );\n\tconst isReady = !! width;\n\n\treturn (\n\t\t<>\n\t\t\t<div style={ { position: 'relative' } }>\n\t\t\t\t{ containerResizeListener }\n\t\t\t</div>\n\t\t\t{ isReady && (\n\t\t\t\t<Iframe\n\t\t\t\t\tclassName=\"edit-site-global-styles-preview__iframe\"\n\t\t\t\t\tstyle={ {\n\t\t\t\t\t\theight: normalizedHeight ratio,\n\t\t\t\t\t} }\n\t\t\t\t\tonMouseEnter={ () => setIsHovered( true ) }\n\t\t\t\t\tonMouseLeave={ () => setIsHovered( false ) }\n\t\t\t\t\ttabIndex={ -1 }\n\t\t\t\t>\n\t\t\t\t\t<EditorStyles styles={ editorStyles } />\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\theight: normalizedHeight * ratio,\n\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\tbackground: gradientValue ?? backgroundColor,\n\t\t\t\t\t\t\tcursor: withHoverView ? 'pointer' : undefined,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tinitial=\"start\"\n\t\t\t\t\t\tanimate={\n\t\t\t\t\t\t\t( isHovered \|\| isFocused ) &&\n\t\t\t\t\t\t\t! disableMotion &&\n\t\t\t\t\t\t\tlabel\n\t\t\t\t\t\t\t\t? 'hover'\n\t\t\t\t\t\t\t\t: 'start'\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ firstFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\tfontSize: 65 * ratio,\n\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\tanimate={ { scale: 1, opacity: 1 } }\n\t\t\t\t\t\t\t\t\tinitial={ { scale: 0.1, opacity: 0 } }\n\t\t\t\t\t\t\t\t\ttransition={ { delay: 0.3, type: 'tween' } }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\tAa\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t<VStack spacing={ 4 * ratio }>\n\t\t\t\t\t\t\t\t\t{ highlightedColors.map(\n\t\t\t\t\t\t\t\t\t\t( { slug, color }, index ) => (\n\t\t\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\t\t\tkey={ slug }\n\t\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tnormalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio,\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\t\tborderRadius:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t( normalizedColorSwatchSize \n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\tratio ) /\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t2,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tscale: 0.1,\n\t\t\t\t\t\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\t\t\tdelay:\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tindex === 1 ? 0.2 : 0.1,\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ withHoverView && midFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tfilter: 'blur(60px)',\n\t\t\t\t\t\t\t\topacity: 0.1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\tspacing={ 0 }\n\t\t\t\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ paletteColors\n\t\t\t\t\t\t\t\t\t.slice( 0, 4 )\n\t\t\t\t\t\t\t\t\t.map( ( { color }, index ) => (\n\t\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\t\t\t\tbackground: color,\n\t\t\t\t\t\t\t\t\t\t\t\tflexGrow: 1,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tvariants={ secondFrame }\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\tposition: 'absolute',\n\t\t\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<VStack\n\t\t\t\t\t\t\t\tspacing={ 3 ratio }\n\t\t\t\t\t\t\t\tjustify=\"center\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\theight: '100%',\n\t\t\t\t\t\t\t\t\toverflow: 'hidden',\n\t\t\t\t\t\t\t\t\tpadding: 10 * ratio,\n\t\t\t\t\t\t\t\t\tboxSizing: 'border-box',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{ label && (\n\t\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\t\t\tfontSize: 40 * ratio,\n\t\t\t\t\t\t\t\t\t\t\tfontFamily: headingFontFamily,\n\t\t\t\t\t\t\t\t\t\t\tcolor: headingColor,\n\t\t\t\t\t\t\t\t\t\t\tfontWeight: headingFontWeight,\n\t\t\t\t\t\t\t\t\t\t\tlineHeight: '1em',\n\t\t\t\t\t\t\t\t\t\t\ttextAlign: 'center',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ label }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</VStack>\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t</motion.div>\n\t\t\t\t</Iframe>\n\t\t\t) }\n\t\t</>\n\t);\n};\n\nexport default StylesPreview;\n"]}

package/build/components/global-styles/screen-block-list.js CHANGED Viewed

@@ -76,8 +76,6 @@ function useSortedBlockTypes() {
 }
 function useBlockHasGlobalStyles(blockName) {
-  var _useBlockVariations;
   const [rawSettings] = useGlobalSetting('', blockName);
   const settings = useSettingsForBlockElement(rawSettings, blockName);
   const hasTypographyPanel = useHasTypographyPanel(settings);
@@ -85,15 +83,14 @@ function useBlockHasGlobalStyles(blockName) {
   const hasBorderPanel = useHasBorderPanel(settings);
   const hasDimensionsPanel = useHasDimensionsPanel(settings);
   const hasLayoutPanel = hasBorderPanel || hasDimensionsPanel;
-  const hasVariationsPanel = !!((_useBlockVariations = (0, _variationsPanel.useBlockVariations)(blockName)) !== null && _useBlockVariations !== void 0 && _useBlockVariations.length);
+  const hasVariationsPanel = !!(0, _variationsPanel.useBlockVariations)(blockName)?.length;
   const hasGlobalStyles = hasTypographyPanel || hasColorPanel || hasLayoutPanel || hasVariationsPanel;
   return hasGlobalStyles;
 }
-function BlockMenuItem(_ref) {
-  let {
-    block
-  } = _ref;
+function BlockMenuItem({
+  block
+}) {
   const hasBlockMenuItem = useBlockHasGlobalStyles(block.name);
   if (!hasBlockMenuItem) {

package/build/components/global-styles/screen-block-list.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-block-list.js"],"names":["useHasDimensionsPanel","useHasTypographyPanel","useHasBorderPanel","useGlobalSetting","useSettingsForBlockElement","useHasColorPanel","blockEditorPrivateApis","useSortedBlockTypes","blockItems","select","blocksStore","getBlockTypes","groupByType","blocks","block","core","noncore","type","name","startsWith","push","coreItems","nonCoreItems","reduce","useBlockHasGlobalStyles","blockName","rawSettings","settings","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasDimensionsPanel","hasLayoutPanel","hasVariationsPanel","length","hasGlobalStyles","BlockMenuItem","hasBlockMenuItem","navigationButtonLabel","title","encodeURIComponent","icon","ScreenBlockList","sortedBlockTypes","filterValue","setFilterValue","debouncedSpeak","speak","isMatchingSearchTerm","filteredBlockTypes","filter","blockType","blockTypesListRef","count","current","childElementCount","resultsFoundMessage","map"],"mappings":";;;;;;;;;;AAWA;;AARA;;AACA;;AACA;;AAKA;;AAEA;;AAIA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AAzBA;AACA;AACA;;AAiBA;AACA;AACA;AAMA,MAAM;AACLA,EAAAA,qBADK;AAELC,EAAAA,qBAFK;AAGLC,EAAAA,iBAHK;AAILC,EAAAA,gBAJK;AAKLC,EAAAA,0BALK;AAMLC,EAAAA;AANK,IAOF,yBAAQC,wBAAR,CAPJ;;AASA,SAASC,mBAAT,GAA+B;AAC9B,QAAMC,UAAU,GAAG,qBAChBC,MAAF,IAAcA,MAAM,CAAEC,aAAF,CAAN,CAAsBC,aAAtB,EADI,EAElB,EAFkB,CAAnB,CAD8B,CAK9B;AACA;AACA;AACA;AACA;;AACA,QAAMC,WAAW,GAAG,CAAEC,MAAF,EAAUC,KAAV,KAAqB;AACxC,UAAM;AAAEC,MAAAA,IAAF;AAAQC,MAAAA;AAAR,QAAoBH,MAA1B;AACA,UAAMI,IAAI,GAAGH,KAAK,CAACI,IAAN,CAAWC,UAAX,CAAuB,OAAvB,IAAmCJ,IAAnC,GAA0CC,OAAvD;AACAC,IAAAA,IAAI,CAACG,IAAL,CAAWN,KAAX;AACA,WAAOD,MAAP;AACA,GALD;;AAMA,QAAM;AAAEE,IAAAA,IAAI,EAAEM,SAAR;AAAmBL,IAAAA,OAAO,EAAEM;AAA5B,MAA6Cd,UAAU,CAACe,MAAX,CAClDX,WADkD,EAElD;AAAEG,IAAAA,IAAI,EAAE,EAAR;AAAYC,IAAAA,OAAO,EAAE;AAArB,GAFkD,CAAnD;AAIA,SAAO,CAAE,GAAGK,SAAL,EAAgB,GAAGC,YAAnB,CAAP;AACA;;AAEM,SAASE,uBAAT,CAAkCC,SAAlC,EAA8C;AAAA;;AACpD,QAAM,CAAEC,WAAF,IAAkBvB,gBAAgB,CAAE,EAAF,EAAMsB,SAAN,CAAxC;AACA,QAAME,QAAQ,GAAGvB,0BAA0B,CAAEsB,WAAF,EAAeD,SAAf,CAA3C;AACA,QAAMG,kBAAkB,GAAG3B,qBAAqB,CAAE0B,QAAF,CAAhD;AACA,QAAME,aAAa,GAAGxB,gBAAgB,CAAEsB,QAAF,CAAtC;AACA,QAAMG,cAAc,GAAG5B,iBAAiB,CAAEyB,QAAF,CAAxC;AACA,QAAMI,kBAAkB,GAAG/B,qBAAqB,CAAE2B,QAAF,CAAhD;AACA,QAAMK,cAAc,GAAGF,cAAc,IAAIC,kBAAzC;AACA,QAAME,kBAAkB,GAAG,CAAC,yBAAE,yCAAoBR,SAApB,CAAF,gDAAE,oBAAiCS,MAAnC,CAA5B;AACA,QAAMC,eAAe,GACpBP,kBAAkB,IAClBC,aADA,IAEAG,cAFA,IAGAC,kBAJD;AAKA,SAAOE,eAAP;AACA;;AAED,SAASC,aAAT,OAAoC;AAAA,MAAZ;AAAEtB,IAAAA;AAAF,GAAY;AACnC,QAAMuB,gBAAgB,GAAGb,uBAAuB,CAAEV,KAAK,CAACI,IAAR,CAAhD;;AACA,MAAK,CAAEmB,gBAAP,EAA0B;AACzB,WAAO,IAAP;AACA;;AAED,QAAMC,qBAAqB,GAAG,oBAC7B;AACA,gBAAI,iBAAJ,CAF6B,EAG7BxB,KAAK,CAACyB,KAHuB,CAA9B;AAMA,SACC,4BAAC,wCAAD;AACC,IAAA,IAAI,EAAG,aAAaC,kBAAkB,CAAE1B,KAAK,CAACI,IAAR,CADvC;AAEC,kBAAaoB;AAFd,KAIC,4BAAC,gCAAD;AAAQ,IAAA,OAAO,EAAC;AAAhB,KACC,4BAAC,sBAAD;AAAW,IAAA,IAAI,EAAGxB,KAAK,CAAC2B;AAAxB,IADD,EAEC,4BAAC,oBAAD,QAAY3B,KAAK,CAACyB,KAAlB,CAFD,CAJD,CADD;AAWA;;AAED,SAASG,eAAT,GAA2B;AAC1B,QAAMC,gBAAgB,GAAGpC,mBAAmB,EAA5C;AACA,QAAM,CAAEqC,WAAF,EAAeC,cAAf,IAAkC,uBAAU,EAAV,CAAxC;AACA,QAAMC,cAAc,GAAG,0BAAaC,WAAb,EAAoB,GAApB,CAAvB;AACA,QAAMC,oBAAoB,GAAG,qBAC1BvC,MAAF,IAAcA,MAAM,CAAEC,aAAF,CAAN,CAAsBsC,oBADR,EAE5B,EAF4B,CAA7B;AAIA,QAAMC,kBAAkB,GAAG,sBAAS,MAAM;AACzC,QAAK,CAAEL,WAAP,EAAqB;AACpB,aAAOD,gBAAP;AACA;;AACD,WAAOA,gBAAgB,CAACO,MAAjB,CAA2BC,SAAF,IAC/BH,oBAAoB,CAAEG,SAAF,EAAaP,WAAb,CADd,CAAP;AAGA,GAP0B,EAOxB,CAAEA,WAAF,EAAeD,gBAAf,EAAiCK,oBAAjC,CAPwB,CAA3B;AASA,QAAMI,iBAAiB,GAAG,sBAA1B,CAjB0B,CAmB1B;;AACA,0BAAW,MAAM;AAChB,QAAK,CAAER,WAAP,EAAqB;AACpB;AACA,KAHe,CAIhB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AACA,UAAMS,KAAK,GAAGD,iBAAiB,CAACE,OAAlB,CAA0BC,iBAAxC;AACA,UAAMC,mBAAmB,GAAG;AAC3B;AACA,kBAAI,kBAAJ,EAAwB,mBAAxB,EAA6CH,KAA7C,CAF2B,EAG3BA,KAH2B,CAA5B;AAKAP,IAAAA,cAAc,CAAEU,mBAAF,EAAuBH,KAAvB,CAAd;AACA,GAnBD,EAmBG,CAAET,WAAF,EAAeE,cAAf,CAnBH;AAqBA,SACC,qDACC,4BAAC,eAAD;AACC,IAAA,KAAK,EAAG,cAAI,QAAJ,CADT;AAEC,IAAA,WAAW,EAAG,cACb,qEADa;AAFf,IADD,EAOC,4BAAC,yBAAD;AACC,IAAA,uBAAuB,MADxB;AAEC,IAAA,SAAS,EAAC,8BAFX;AAGC,IAAA,QAAQ,EAAGD,cAHZ;AAIC,IAAA,KAAK,EAAGD,WAJT;AAKC,IAAA,KAAK,EAAG,cAAI,mBAAJ,CALT;AAMC,IAAA,WAAW,EAAG,cAAI,QAAJ;AANf,IAPD,EAeC;AACC,IAAA,GAAG,EAAGQ,iBADP;AAEC,IAAA,SAAS,EAAC;AAFX,KAIGH,kBAAkB,CAACQ,GAAnB,CAA0B3C,KAAF,IACzB,4BAAC,aAAD;AACC,IAAA,KAAK,EAAGA,KADT;AAEC,IAAA,GAAG,EAAG,oBAAoBA,KAAK,CAACI;AAFjC,IADC,CAJH,CAfD,CADD;AA6BA;;eAEcwB,e","sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { __, sprintf, _n } from '@wordpress/i18n';\nimport {\n\tFlexItem,\n\tSearchControl,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useState, useMemo, useEffect, useRef } from '@wordpress/element';\nimport {\n\tBlockIcon,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { useDebounce } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\n\n/\n Internal dependencies\n /\nimport { useBlockVariations } from './variations-panel';\nimport ScreenHeader from './header';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../private-apis';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasBorderPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tuseHasColorPanel,\n} = unlock( blockEditorPrivateApis );\n\nfunction useSortedBlockTypes() {\n\tconst blockItems = useSelect(\n\t\t( select ) => select( blocksStore ).getBlockTypes(),\n\t\t[]\n\t);\n\t// Ensure core blocks are prioritized in the returned results,\n\t// because third party blocks can be registered earlier than\n\t// the core blocks (usually by using the `init` action),\n\t// thus affecting the display order.\n\t// We don't sort reusable blocks as they are handled differently.\n\tconst groupByType = ( blocks, block ) => {\n\t\tconst { core, noncore } = blocks;\n\t\tconst type = block.name.startsWith( 'core/' ) ? core : noncore;\n\t\ttype.push( block );\n\t\treturn blocks;\n\t};\n\tconst { core: coreItems, noncore: nonCoreItems } = blockItems.reduce(\n\t\tgroupByType,\n\t\t{ core: [], noncore: [] }\n\t);\n\treturn [ ...coreItems, ...nonCoreItems ];\n}\n\nexport function useBlockHasGlobalStyles( blockName ) {\n\tconst [ rawSettings ] = useGlobalSetting( '', blockName );\n\tconst settings = useSettingsForBlockElement( rawSettings, blockName );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasBorderPanel = useHasBorderPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasBorderPanel \|\| hasDimensionsPanel;\n\tconst hasVariationsPanel = !! useBlockVariations( blockName )?.length;\n\tconst hasGlobalStyles =\n\t\thasTypographyPanel \|\|\n\t\thasColorPanel \|\|\n\t\thasLayoutPanel \|\|\n\t\thasVariationsPanel;\n\treturn hasGlobalStyles;\n}\n\nfunction BlockMenuItem( { block } ) {\n\tconst hasBlockMenuItem = useBlockHasGlobalStyles( block.name );\n\tif ( ! hasBlockMenuItem ) {\n\t\treturn null;\n\t}\n\n\tconst navigationButtonLabel = sprintf(\n\t\t// translators: %s: is the name of a block e.g., 'Image' or 'Table'.\n\t\t__( '%s block styles' ),\n\t\tblock.title\n\t);\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\taria-label={ navigationButtonLabel }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<BlockIcon icon={ block.icon } />\n\t\t\t\t<FlexItem>{ block.title }</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction ScreenBlockList() {\n\tconst sortedBlockTypes = useSortedBlockTypes();\n\tconst [ filterValue, setFilterValue ] = useState( '' );\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst isMatchingSearchTerm = useSelect(\n\t\t( select ) => select( blocksStore ).isMatchingSearchTerm,\n\t\t[]\n\t);\n\tconst filteredBlockTypes = useMemo( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn sortedBlockTypes;\n\t\t}\n\t\treturn sortedBlockTypes.filter( ( blockType ) =>\n\t\t\tisMatchingSearchTerm( blockType, filterValue )\n\t\t);\n\t}, [ filterValue, sortedBlockTypes, isMatchingSearchTerm ] );\n\n\tconst blockTypesListRef = useRef();\n\n\t// Announce search results on change\n\tuseEffect( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn;\n\t\t}\n\t\t// We extract the results from the wrapper div's `ref` because\n\t\t// filtered items can contain items that will eventually not\n\t\t// render and there is no reliable way to detect when a child\n\t\t// will return `null`.\n\t\t// TODO: We should find a better way of handling this as it's\n\t\t// fragile and depends on the number of rendered elements of `BlockMenuItem`,\n\t\t// which is now one.\n\t\t// @see https://github.com/WordPress/gutenberg/pull/39117#discussion_r816022116\n\t\tconst count = blockTypesListRef.current.childElementCount;\n\t\tconst resultsFoundMessage = sprintf(\n\t\t\t/ translators: %d: number of results. */\n\t\t\t_n( '%d result found.', '%d results found.', count ),\n\t\t\tcount\n\t\t);\n\t\tdebouncedSpeak( resultsFoundMessage, count );\n\t}, [ filterValue, debouncedSpeak ] );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Blocks' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Customize the appearance of specific blocks and for the whole site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<SearchControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tclassName=\"edit-site-block-types-search\"\n\t\t\t\tonChange={ setFilterValue }\n\t\t\t\tvalue={ filterValue }\n\t\t\t\tlabel={ __( 'Search for blocks' ) }\n\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tref={ blockTypesListRef }\n\t\t\t\tclassName=\"edit-site-block-types-item-list\"\n\t\t\t>\n\t\t\t\t{ filteredBlockTypes.map( ( block ) => (\n\t\t\t\t\t<BlockMenuItem\n\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\tkey={ 'menu-itemblock-' + block.name }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ScreenBlockList;\n"]}
1	+ {"version":3,"sources":["@wordpress/edit-site/src/components/global-styles/screen-block-list.js"],"names":["useHasDimensionsPanel","useHasTypographyPanel","useHasBorderPanel","useGlobalSetting","useSettingsForBlockElement","useHasColorPanel","blockEditorPrivateApis","useSortedBlockTypes","blockItems","select","blocksStore","getBlockTypes","groupByType","blocks","block","core","noncore","type","name","startsWith","push","coreItems","nonCoreItems","reduce","useBlockHasGlobalStyles","blockName","rawSettings","settings","hasTypographyPanel","hasColorPanel","hasBorderPanel","hasDimensionsPanel","hasLayoutPanel","hasVariationsPanel","length","hasGlobalStyles","BlockMenuItem","hasBlockMenuItem","navigationButtonLabel","title","encodeURIComponent","icon","ScreenBlockList","sortedBlockTypes","filterValue","setFilterValue","debouncedSpeak","speak","isMatchingSearchTerm","filteredBlockTypes","filter","blockType","blockTypesListRef","count","current","childElementCount","resultsFoundMessage","map"],"mappings":"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","sourcesContent":["/*\n WordPress dependencies\n /\nimport { store as blocksStore } from '@wordpress/blocks';\nimport { __, sprintf, _n } from '@wordpress/i18n';\nimport {\n\tFlexItem,\n\tSearchControl,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\nimport { useState, useMemo, useEffect, useRef } from '@wordpress/element';\nimport {\n\tBlockIcon,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { useDebounce } from '@wordpress/compose';\nimport { speak } from '@wordpress/a11y';\n\n/\n Internal dependencies\n /\nimport { useBlockVariations } from './variations-panel';\nimport ScreenHeader from './header';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../private-apis';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasBorderPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tuseHasColorPanel,\n} = unlock( blockEditorPrivateApis );\n\nfunction useSortedBlockTypes() {\n\tconst blockItems = useSelect(\n\t\t( select ) => select( blocksStore ).getBlockTypes(),\n\t\t[]\n\t);\n\t// Ensure core blocks are prioritized in the returned results,\n\t// because third party blocks can be registered earlier than\n\t// the core blocks (usually by using the `init` action),\n\t// thus affecting the display order.\n\t// We don't sort reusable blocks as they are handled differently.\n\tconst groupByType = ( blocks, block ) => {\n\t\tconst { core, noncore } = blocks;\n\t\tconst type = block.name.startsWith( 'core/' ) ? core : noncore;\n\t\ttype.push( block );\n\t\treturn blocks;\n\t};\n\tconst { core: coreItems, noncore: nonCoreItems } = blockItems.reduce(\n\t\tgroupByType,\n\t\t{ core: [], noncore: [] }\n\t);\n\treturn [ ...coreItems, ...nonCoreItems ];\n}\n\nexport function useBlockHasGlobalStyles( blockName ) {\n\tconst [ rawSettings ] = useGlobalSetting( '', blockName );\n\tconst settings = useSettingsForBlockElement( rawSettings, blockName );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasBorderPanel = useHasBorderPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasBorderPanel \|\| hasDimensionsPanel;\n\tconst hasVariationsPanel = !! useBlockVariations( blockName )?.length;\n\tconst hasGlobalStyles =\n\t\thasTypographyPanel \|\|\n\t\thasColorPanel \|\|\n\t\thasLayoutPanel \|\|\n\t\thasVariationsPanel;\n\treturn hasGlobalStyles;\n}\n\nfunction BlockMenuItem( { block } ) {\n\tconst hasBlockMenuItem = useBlockHasGlobalStyles( block.name );\n\tif ( ! hasBlockMenuItem ) {\n\t\treturn null;\n\t}\n\n\tconst navigationButtonLabel = sprintf(\n\t\t// translators: %s: is the name of a block e.g., 'Image' or 'Table'.\n\t\t__( '%s block styles' ),\n\t\tblock.title\n\t);\n\n\treturn (\n\t\t<NavigationButtonAsItem\n\t\t\tpath={ '/blocks/' + encodeURIComponent( block.name ) }\n\t\t\taria-label={ navigationButtonLabel }\n\t\t>\n\t\t\t<HStack justify=\"flex-start\">\n\t\t\t\t<BlockIcon icon={ block.icon } />\n\t\t\t\t<FlexItem>{ block.title }</FlexItem>\n\t\t\t</HStack>\n\t\t</NavigationButtonAsItem>\n\t);\n}\n\nfunction ScreenBlockList() {\n\tconst sortedBlockTypes = useSortedBlockTypes();\n\tconst [ filterValue, setFilterValue ] = useState( '' );\n\tconst debouncedSpeak = useDebounce( speak, 500 );\n\tconst isMatchingSearchTerm = useSelect(\n\t\t( select ) => select( blocksStore ).isMatchingSearchTerm,\n\t\t[]\n\t);\n\tconst filteredBlockTypes = useMemo( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn sortedBlockTypes;\n\t\t}\n\t\treturn sortedBlockTypes.filter( ( blockType ) =>\n\t\t\tisMatchingSearchTerm( blockType, filterValue )\n\t\t);\n\t}, [ filterValue, sortedBlockTypes, isMatchingSearchTerm ] );\n\n\tconst blockTypesListRef = useRef();\n\n\t// Announce search results on change\n\tuseEffect( () => {\n\t\tif ( ! filterValue ) {\n\t\t\treturn;\n\t\t}\n\t\t// We extract the results from the wrapper div's `ref` because\n\t\t// filtered items can contain items that will eventually not\n\t\t// render and there is no reliable way to detect when a child\n\t\t// will return `null`.\n\t\t// TODO: We should find a better way of handling this as it's\n\t\t// fragile and depends on the number of rendered elements of `BlockMenuItem`,\n\t\t// which is now one.\n\t\t// @see https://github.com/WordPress/gutenberg/pull/39117#discussion_r816022116\n\t\tconst count = blockTypesListRef.current.childElementCount;\n\t\tconst resultsFoundMessage = sprintf(\n\t\t\t/ translators: %d: number of results. */\n\t\t\t_n( '%d result found.', '%d results found.', count ),\n\t\t\tcount\n\t\t);\n\t\tdebouncedSpeak( resultsFoundMessage, count );\n\t}, [ filterValue, debouncedSpeak ] );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Blocks' ) }\n\t\t\t\tdescription={ __(\n\t\t\t\t\t'Customize the appearance of specific blocks and for the whole site.'\n\t\t\t\t) }\n\t\t\t/>\n\t\t\t<SearchControl\n\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\tclassName=\"edit-site-block-types-search\"\n\t\t\t\tonChange={ setFilterValue }\n\t\t\t\tvalue={ filterValue }\n\t\t\t\tlabel={ __( 'Search for blocks' ) }\n\t\t\t\tplaceholder={ __( 'Search' ) }\n\t\t\t/>\n\t\t\t<div\n\t\t\t\tref={ blockTypesListRef }\n\t\t\t\tclassName=\"edit-site-block-types-item-list\"\n\t\t\t>\n\t\t\t\t{ filteredBlockTypes.map( ( block ) => (\n\t\t\t\t\t<BlockMenuItem\n\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\tkey={ 'menu-itemblock-' + block.name }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</div>\n\t\t</>\n\t);\n}\n\nexport default ScreenBlockList;\n"]}

package/build/components/global-styles/screen-block.js CHANGED Viewed

@@ -94,11 +94,10 @@ const {
   AdvancedPanel: StylesAdvancedPanel
 } = (0, _privateApis.unlock)(_blockEditor.privateApis);
-function ScreenBlock(_ref) {
-  let {
-    name,
-    variation
-  } = _ref;
+function ScreenBlock({
+  name,
+  variation
+}) {
   let prefixParts = [];
   if (variation) {
@@ -122,11 +121,11 @@ function ScreenBlock(_ref) {
   const hasDimensionsPanel = useHasDimensionsPanel(settings);
   const hasEffectsPanel = useHasEffectsPanel(settings);
   const hasFiltersPanel = useHasFiltersPanel(settings);
-  const hasVariationsPanel = !!(blockVariations !== null && blockVariations !== void 0 && blockVariations.length) && !variation;
+  const hasVariationsPanel = !!blockVariations?.length && !variation;
   const {
     canEditCSS
   } = (0, _data.useSelect)(select => {
-    var _globalStyles$_links$, _globalStyles$_links;
+    var _globalStyles$_links$;
     const {
       getEntityRecord,
@@ -137,7 +136,7 @@ function ScreenBlock(_ref) {
     const globalStyles = globalStylesId ? getEntityRecord('root', 'globalStyles', globalStylesId) : undefined;
     return {
-      canEditCSS: (_globalStyles$_links$ = !!(globalStyles !== null && globalStyles !== void 0 && (_globalStyles$_links = globalStyles._links) !== null && _globalStyles$_links !== void 0 && _globalStyles$_links['wp:action-edit-css'])) !== null && _globalStyles$_links$ !== void 0 ? _globalStyles$_links$ : false
+      canEditCSS: (_globalStyles$_links$ = !!globalStyles?._links?.['wp:action-edit-css']) !== null && _globalStyles$_links$ !== void 0 ? _globalStyles$_links$ : false
     };
   }, []);
   const currentBlockStyle = variation ? blockVariations.find(s => s.name === variation) : null; // These intermediary objects are needed because the "layout" property is stored
@@ -168,7 +167,7 @@ function ScreenBlock(_ref) {
   };
   const onChangeBorders = newStyle => {
-    if (!(newStyle !== null && newStyle !== void 0 && newStyle.border)) {
+    if (!newStyle?.border) {
       setStyle(newStyle);
       return;
     } // As Global Styles can't conditionally generate styles based on if
@@ -260,7 +259,7 @@ function ScreenBlock(_ref) {
     title: (0, _i18n.__)('Advanced'),
     initialOpen: false
   }, (0, _element.createElement)("p", null, (0, _i18n.sprintf)( // translators: %s: is the name of a block e.g., 'Image' or 'Table'.
-  (0, _i18n.__)('Add your own CSS to customize the appearance of the %s block.'), blockType === null || blockType === void 0 ? void 0 : blockType.title)), (0, _element.createElement)(StylesAdvancedPanel, {
+  (0, _i18n.__)('Add your own CSS to customize the appearance of the %s block.'), blockType?.title)), (0, _element.createElement)(StylesAdvancedPanel, {
     value: style,
     onChange: setStyle,
     inheritedValue: inheritedStyle