npm - @wordpress/edit-site - Versions diffs - 6.7.1-next.1f6eadc42.0 → 6.8.0 - Mend

@wordpress/edit-site 6.7.1-next.1f6eadc42.0 → 6.8.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 (113) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"names":["__experimentalItemGroup","ItemGroup","FlexItem","__experimentalHStack","HStack","__experimentalZStack","ZStack","__experimentalVStack","VStack","ColorIndicator","Button","isRTL","__","Icon","shuffle","chevronLeft","chevronRight","useMemo","privateApis","blockEditorPrivateApis","Subtitle","NavigationButtonAsItem","useColorRandomizer","ColorIndicatorWrapper","unlock","jsx","_jsx","jsxs","_jsxs","useGlobalSetting","EMPTY_COLORS","Palette","name","customColors","themeColors","defaultColors","defaultPaletteEnabled","randomizeThemeColors","colors","screenPath","encodeURIComponent","paletteButtonText","length","spacing","children","level","isBordered","isSeparated","path","direction","isLayered","offset","slice","map","color","index","colorValue","icon","window","__experimentalEnableColorRandomizer","__next40pxDefaultSize","variant","onClick"],"sources":["@wordpress/edit-site/src/components/global-styles/palette.js"],"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 { isRTL, __ } from '@wordpress/i18n';\nimport { Icon, shuffle, chevronLeft, chevronRight } 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 '../../lock-unlock';\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 ? __( 'Edit palette' ) : __( 'Add 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={ paletteButtonText }\n\t\t\t\t>\n\t\t\t\t\t<HStack direction=\"row\">\n\t\t\t\t\t\t{ colors.length <= 0 && (\n\t\t\t\t\t\t\t<FlexItem>{ __( 'Add colors' ) }</FlexItem>\n\t\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<Icon icon={ isRTL() ? chevronLeft : chevronRight } />\n\t\t\t\t\t</HStack>\n\t\t\t\t</NavigationButtonAsItem>\n\t\t\t</ItemGroup>\n\t\t\t{ window.__experimentalEnableColorRandomizer &&\n\t\t\t\tthemeColors?.length > 0 && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\~~t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t\~~t__next40pxDefaultSize~~={ false }~~\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\ticon={ shuffle }\n\t\t\t\t\t\tonClick={ randomizeThemeColors }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Randomize colors' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default Palette;\n"],"mappings":"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~~IACA;IAAA;MACAkD~~,qBAAqB~~,EAAG,KAAO~~;~~MAC/BC~~,OAAO,EAAC,WAAW;MACnBJ,IAAI,EAAG3C,OAAS;MAChBgD,OAAO,EAAGzB,oBAAsB;MAAAO,QAAA,EAE9BhC,EAAE,CAAE,kBAAmB;IAAC,CACnB,CACR;EAAA,CACK,CAAC;AAEX;AAEA,eAAemB,OAAO","ignoreList":[]}
1	+ {"version":3,"names":["__experimentalItemGroup","ItemGroup","FlexItem","__experimentalHStack","HStack","__experimentalZStack","ZStack","__experimentalVStack","VStack","ColorIndicator","Button","isRTL","__","Icon","shuffle","chevronLeft","chevronRight","useMemo","privateApis","blockEditorPrivateApis","Subtitle","NavigationButtonAsItem","useColorRandomizer","ColorIndicatorWrapper","unlock","jsx","_jsx","jsxs","_jsxs","useGlobalSetting","EMPTY_COLORS","Palette","name","customColors","themeColors","defaultColors","defaultPaletteEnabled","randomizeThemeColors","colors","screenPath","encodeURIComponent","paletteButtonText","length","spacing","children","level","isBordered","isSeparated","path","direction","isLayered","offset","slice","map","color","index","colorValue","icon","window","__experimentalEnableColorRandomizer","__next40pxDefaultSize","variant","onClick"],"sources":["@wordpress/edit-site/src/components/global-styles/palette.js"],"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 { isRTL, __ } from '@wordpress/i18n';\nimport { Icon, shuffle, chevronLeft, chevronRight } 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 '../../lock-unlock';\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 ? __( 'Edit palette' ) : __( 'Add 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={ paletteButtonText }\n\t\t\t\t>\n\t\t\t\t\t<HStack direction=\"row\">\n\t\t\t\t\t\t{ colors.length <= 0 && (\n\t\t\t\t\t\t\t<FlexItem>{ __( 'Add colors' ) }</FlexItem>\n\t\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<Icon icon={ isRTL() ? chevronLeft : chevronRight } />\n\t\t\t\t\t</HStack>\n\t\t\t\t</NavigationButtonAsItem>\n\t\t\t</ItemGroup>\n\t\t\t{ window.__experimentalEnableColorRandomizer &&\n\t\t\t\tthemeColors?.length > 0 && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\ticon={ shuffle }\n\t\t\t\t\t\tonClick={ randomizeThemeColors }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Randomize colors' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t</VStack>\n\t);\n}\n\nexport default Palette;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/global-styles/root-menu.js CHANGED Viewed

@@ -2,7 +2,7 @@
  * WordPress dependencies
  */
 import { __experimentalItemGroup as ItemGroup } from '@wordpress/components';
-import { typography, color, layout, shadow as shadowIcon } from '@wordpress/icons';
+import { background, typography, color, layout, shadow as shadowIcon } from '@wordpress/icons';
 import { __ } from '@wordpress/i18n';
 import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
@@ -19,11 +19,17 @@ const {
   useHasTypographyPanel,
   useHasColorPanel,
   useGlobalSetting,
-  useSettingsForBlockElement
+  useSettingsForBlockElement,
+  useHasBackgroundPanel
 } = unlock(blockEditorPrivateApis);
 function RootMenu() {
   const [rawSettings] = useGlobalSetting('');
   const settings = useSettingsForBlockElement(rawSettings);
+  /*
+   * Use the raw settings to determine if the background panel should be displayed,
+   * as the background panel is not dependent on the block element settings.
+   */
+  const hasBackgroundPanel = useHasBackgroundPanel(rawSettings);
   const hasTypographyPanel = useHasTypographyPanel(settings);
   const hasColorPanel = useHasColorPanel(settings);
   const hasShadowPanel = true; // useHasShadowPanel( settings );
@@ -41,6 +47,11 @@ function RootMenu() {
         path: "/colors",
         "aria-label": __('Colors styles'),
         children: __('Colors')
+      }), hasBackgroundPanel && /*#__PURE__*/_jsx(NavigationButtonAsItem, {
+        icon: background,
+        path: "/background",
+        "aria-label": __('Background styles'),
+        children: __('Background')
       }), hasShadowPanel && /*#__PURE__*/_jsx(NavigationButtonAsItem, {
         icon: shadowIcon,
         path: "/shadows",

package/build-module/components/global-styles/root-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__experimentalItemGroup","ItemGroup","typography","color","layout","shadow","shadowIcon","__","privateApis","blockEditorPrivateApis","NavigationButtonAsItem","unlock","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useHasDimensionsPanel","useHasTypographyPanel","useHasColorPanel","useGlobalSetting","useSettingsForBlockElement","RootMenu","rawSettings","settings","hasTypographyPanel","hasColorPanel","hasShadowPanel","hasDimensionsPanel","hasLayoutPanel","children","icon","path"],"sources":["@wordpress/edit-site/src/components/global-styles/root-menu.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __experimentalItemGroup as ItemGroup } from '@wordpress/components';\nimport {\n\ttypography,\n\tcolor,\n\tlayout,\n\tshadow as shadowIcon,\n} from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasColorPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n} = unlock( blockEditorPrivateApis );\n\nfunction RootMenu() {\n\tconst [ rawSettings ] = useGlobalSetting( '' );\n\tconst settings = useSettingsForBlockElement( rawSettings );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasShadowPanel = true; // useHasShadowPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasDimensionsPanel;\n\n\treturn (\n\t\t<>\n\t\t\t<ItemGroup>\n\t\t\t\t{ hasTypographyPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ typography }\n\t\t\t\t\t\tpath=\"/typography\"\n\t\t\t\t\t\taria-label={ __( 'Typography styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Typography' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasColorPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ color }\n\t\t\t\t\t\tpath=\"/colors\"\n\t\t\t\t\t\taria-label={ __( 'Colors styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Colors' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasShadowPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ shadowIcon }\n\t\t\t\t\t\tpath=\"/shadows\"\n\t\t\t\t\t\taria-label={ __( 'Shadow styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Shadows' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasLayoutPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ layout }\n\t\t\t\t\t\tpath=\"/layout\"\n\t\t\t\t\t\taria-label={ __( 'Layout styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t</ItemGroup>\n\t\t</>\n\t);\n}\n\nexport default RootMenu;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,uBAAuB,IAAIC,SAAS,QAAQ,uBAAuB;AAC5E,SACCC,UAAU,EACVC,KAAK,EACLC,MAAM,EACNC,MAAM,IAAIC,UAAU,QACd,kBAAkB;AACzB,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,IAAIC,sBAAsB,QAAQ,yBAAyB;;AAE/E;AACA;AACA;AACA,SAASC,sBAAsB,QAAQ,qBAAqB;AAC5D,SAASC,MAAM,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAE3C,MAAM;EACLC,qBAAqB;EACrBC,qBAAqB;EACrBC,gBAAgB;EAChBC,gBAAgB;EAChBC;AACD,CAAC,~~GAAGX~~,MAAM,CAAEF,sBAAuB,CAAC;AAEpC,~~SAASc~~,QAAQA,CAAA,EAAG;EACnB,MAAM,CAAEC,WAAW,CAAE,~~GAAGH~~,gBAAgB,CAAE,EAAG,CAAC;EAC9C,~~MAAMI~~,QAAQ,~~GAAGH~~,0BAA0B,~~CAAEE~~,WAAY,CAAC;EAC1D,MAAME,kBAAkB,~~GAAGP~~,qBAAqB,~~CAAEM~~,QAAS,CAAC;EAC5D,~~MAAME~~,aAAa,~~GAAGP~~,gBAAgB,~~CAAEK~~,QAAS,CAAC;EAClD,~~MAAMG~~,cAAc,GAAG,IAAI,CAAC,CAAC;EAC7B,MAAMC,kBAAkB,~~GAAGX~~,qBAAqB,~~CAAEO~~,QAAS,CAAC;EAC5D,~~MAAMK~~,cAAc,GAAGD,kBAAkB;EAEzC,~~oBACChB~~,IAAA,CAAAI,SAAA;~~IAAAc~~,QAAA,~~eACChB~~,KAAA,~~CAACd~~,SAAS;~~MAAA8B~~,QAAA,GACPL,kBAAkB,~~iBACnBb~~,IAAA,CAACH,sBAAsB;~~QACtBsB~~,IAAI,~~EAAG9B~~,UAAY;~~QACnB+B~~,IAAI,EAAC,aAAa;QAClB,~~cAAa1B~~,EAAE,CAAE,mBAAoB,CAAG;~~QAAAwB~~,QAAA,~~EAEtCxB~~,EAAE,CAAE,YAAa;MAAC,CACG,CACxB,~~EACCoB~~,aAAa,~~iBACdd~~,IAAA,CAACH,sBAAsB;~~QACtBsB~~,IAAI,~~EAAG7B~~,KAAO;~~QACd8B~~,IAAI,EAAC,SAAS;QACd,~~cAAa1B~~,EAAE,CAAE,eAAgB,CAAG;~~QAAAwB~~,QAAA,~~EAElCxB~~,EAAE,CAAE,QAAS;MAAC,CACO,CACxB,~~EACCqB~~,cAAc,~~iBACff~~,IAAA,CAACH,sBAAsB;~~QACtBsB~~,IAAI,~~EAAG1B~~,UAAY;~~QACnB2B~~,IAAI,EAAC,UAAU;QACf,~~cAAa1B~~,EAAE,CAAE,eAAgB,CAAG;~~QAAAwB~~,QAAA,~~EAElCxB~~,EAAE,CAAE,SAAU;MAAC,CACM,CACxB,~~EACCuB~~,cAAc,~~iBACfjB~~,IAAA,CAACH,sBAAsB;~~QACtBsB~~,IAAI,~~EAAG5B~~,MAAQ;~~QACf6B~~,IAAI,EAAC,SAAS;QACd,~~cAAa1B~~,EAAE,CAAE,eAAgB,CAAG;~~QAAAwB~~,QAAA,~~EAElCxB~~,EAAE,CAAE,QAAS;MAAC,CACO,CACxB;IAAA,CACS;EAAC,CACX,CAAC;AAEL;AAEA,~~eAAegB~~,QAAQ","ignoreList":[]}
1	+ {"version":3,"names":["__experimentalItemGroup","ItemGroup","background","typography","color","layout","shadow","shadowIcon","__","privateApis","blockEditorPrivateApis","NavigationButtonAsItem","unlock","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useHasDimensionsPanel","useHasTypographyPanel","useHasColorPanel","useGlobalSetting","useSettingsForBlockElement","useHasBackgroundPanel","RootMenu","rawSettings","settings","hasBackgroundPanel","hasTypographyPanel","hasColorPanel","hasShadowPanel","hasDimensionsPanel","hasLayoutPanel","children","icon","path"],"sources":["@wordpress/edit-site/src/components/global-styles/root-menu.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __experimentalItemGroup as ItemGroup } from '@wordpress/components';\nimport {\n\tbackground,\n\ttypography,\n\tcolor,\n\tlayout,\n\tshadow as shadowIcon,\n} from '@wordpress/icons';\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport { NavigationButtonAsItem } from './navigation-button';\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\tuseHasDimensionsPanel,\n\tuseHasTypographyPanel,\n\tuseHasColorPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n\tuseHasBackgroundPanel,\n} = unlock( blockEditorPrivateApis );\n\nfunction RootMenu() {\n\tconst [ rawSettings ] = useGlobalSetting( '' );\n\tconst settings = useSettingsForBlockElement( rawSettings );\n\t/\n\t * Use the raw settings to determine if the background panel should be displayed,\n\t * as the background panel is not dependent on the block element settings.\n\t */\n\tconst hasBackgroundPanel = useHasBackgroundPanel( rawSettings );\n\tconst hasTypographyPanel = useHasTypographyPanel( settings );\n\tconst hasColorPanel = useHasColorPanel( settings );\n\tconst hasShadowPanel = true; // useHasShadowPanel( settings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\tconst hasLayoutPanel = hasDimensionsPanel;\n\n\treturn (\n\t\t<>\n\t\t\t<ItemGroup>\n\t\t\t\t{ hasTypographyPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ typography }\n\t\t\t\t\t\tpath=\"/typography\"\n\t\t\t\t\t\taria-label={ __( 'Typography styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Typography' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasColorPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ color }\n\t\t\t\t\t\tpath=\"/colors\"\n\t\t\t\t\t\taria-label={ __( 'Colors styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Colors' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasBackgroundPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ background }\n\t\t\t\t\t\tpath=\"/background\"\n\t\t\t\t\t\taria-label={ __( 'Background styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Background' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasShadowPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ shadowIcon }\n\t\t\t\t\t\tpath=\"/shadows\"\n\t\t\t\t\t\taria-label={ __( 'Shadow styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Shadows' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t\t{ hasLayoutPanel && (\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\ticon={ layout }\n\t\t\t\t\t\tpath=\"/layout\"\n\t\t\t\t\t\taria-label={ __( 'Layout styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Layout' ) }\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t) }\n\t\t\t</ItemGroup>\n\t\t</>\n\t);\n}\n\nexport default RootMenu;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,uBAAuB,IAAIC,SAAS,QAAQ,uBAAuB;AAC5E,SACCC,UAAU,EACVC,UAAU,EACVC,KAAK,EACLC,MAAM,EACNC,MAAM,IAAIC,UAAU,QACd,kBAAkB;AACzB,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,IAAIC,sBAAsB,QAAQ,yBAAyB;;AAE/E;AACA;AACA;AACA,SAASC,sBAAsB,QAAQ,qBAAqB;AAC5D,SAASC,MAAM,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAE3C,MAAM;EACLC,qBAAqB;EACrBC,qBAAqB;EACrBC,gBAAgB;EAChBC,gBAAgB;EAChBC,0BAA0B;EAC1BC;AACD,CAAC,GAAGZ,MAAM,CAAEF,sBAAuB,CAAC;AAEpC,SAASe,QAAQA,CAAA,EAAG;EACnB,MAAM,CAAEC,WAAW,CAAE,GAAGJ,gBAAgB,CAAE,EAAG,CAAC;EAC9C,MAAMK,QAAQ,GAAGJ,0BAA0B,CAAEG,WAAY,CAAC;EAC1D;AACD;AACA;AACA;EACC,MAAME,kBAAkB,GAAGJ,qBAAqB,CAAEE,WAAY,CAAC;EAC/D,MAAMG,kBAAkB,GAAGT,qBAAqB,CAAEO,QAAS,CAAC;EAC5D,MAAMG,aAAa,GAAGT,gBAAgB,CAAEM,QAAS,CAAC;EAClD,MAAMI,cAAc,GAAG,IAAI,CAAC,CAAC;EAC7B,MAAMC,kBAAkB,GAAGb,qBAAqB,CAAEQ,QAAS,CAAC;EAC5D,MAAMM,cAAc,GAAGD,kBAAkB;EAEzC,oBACClB,IAAA,CAAAI,SAAA;IAAAgB,QAAA,eACClB,KAAA,CAACf,SAAS;MAAAiC,QAAA,GACPL,kBAAkB,iBACnBf,IAAA,CAACH,sBAAsB;QACtBwB,IAAI,EAAGhC,UAAY;QACnBiC,IAAI,EAAC,aAAa;QAClB,cAAa5B,EAAE,CAAE,mBAAoB,CAAG;QAAA0B,QAAA,EAEtC1B,EAAE,CAAE,YAAa;MAAC,CACG,CACxB,EACCsB,aAAa,iBACdhB,IAAA,CAACH,sBAAsB;QACtBwB,IAAI,EAAG/B,KAAO;QACdgC,IAAI,EAAC,SAAS;QACd,cAAa5B,EAAE,CAAE,eAAgB,CAAG;QAAA0B,QAAA,EAElC1B,EAAE,CAAE,QAAS;MAAC,CACO,CACxB,EACCoB,kBAAkB,iBACnBd,IAAA,CAACH,sBAAsB;QACtBwB,IAAI,EAAGjC,UAAY;QACnBkC,IAAI,EAAC,aAAa;QAClB,cAAa5B,EAAE,CAAE,mBAAoB,CAAG;QAAA0B,QAAA,EAEtC1B,EAAE,CAAE,YAAa;MAAC,CACG,CACxB,EACCuB,cAAc,iBACfjB,IAAA,CAACH,sBAAsB;QACtBwB,IAAI,EAAG5B,UAAY;QACnB6B,IAAI,EAAC,UAAU;QACf,cAAa5B,EAAE,CAAE,eAAgB,CAAG;QAAA0B,QAAA,EAElC1B,EAAE,CAAE,SAAU;MAAC,CACM,CACxB,EACCyB,cAAc,iBACfnB,IAAA,CAACH,sBAAsB;QACtBwB,IAAI,EAAG9B,MAAQ;QACf+B,IAAI,EAAC,SAAS;QACd,cAAa5B,EAAE,CAAE,eAAgB,CAAG;QAAA0B,QAAA,EAElC1B,EAAE,CAAE,QAAS;MAAC,CACO,CACxB;IAAA,CACS;EAAC,CACX,CAAC;AAEL;AAEA,eAAeiB,QAAQ","ignoreList":[]}

package/build-module/components/global-styles/screen-background.js ADDED Viewed

@@ -0,0 +1,34 @@
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
+import { __experimentalText as Text } from '@wordpress/components';
+/**
+ * Internal dependencies
+ */
+import BackgroundPanel from './background-panel';
+import ScreenHeader from './header';
+import { unlock } from '../../lock-unlock';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Fragment as _Fragment } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+const {
+  useHasBackgroundPanel,
+  useGlobalSetting
+} = unlock(blockEditorPrivateApis);
+function ScreenBackground() {
+  const [settings] = useGlobalSetting('');
+  const hasBackgroundPanel = useHasBackgroundPanel(settings);
+  return /*#__PURE__*/_jsxs(_Fragment, {
+    children: [/*#__PURE__*/_jsx(ScreenHeader, {
+      title: __('Background'),
+      description: /*#__PURE__*/_jsx(Text, {
+        children: __('Set styles for the site’s background.')
+      })
+    }), hasBackgroundPanel && /*#__PURE__*/_jsx(BackgroundPanel, {})]
+  });
+}
+export default ScreenBackground;
+//# sourceMappingURL=screen-background.js.map

package/build-module/components/global-styles/screen-background.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["__","privateApis","blockEditorPrivateApis","__experimentalText","Text","BackgroundPanel","ScreenHeader","unlock","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","useHasBackgroundPanel","useGlobalSetting","ScreenBackground","settings","hasBackgroundPanel","children","title","description"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-background.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { __experimentalText as Text } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport BackgroundPanel from './background-panel';\nimport ScreenHeader from './header';\nimport { unlock } from '../../lock-unlock';\n\nconst { useHasBackgroundPanel, useGlobalSetting } = unlock(\n\tblockEditorPrivateApis\n);\n\nfunction ScreenBackground() {\n\tconst [ settings ] = useGlobalSetting( '' );\n\tconst hasBackgroundPanel = useHasBackgroundPanel( settings );\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader\n\t\t\t\ttitle={ __( 'Background' ) }\n\t\t\t\tdescription={\n\t\t\t\t\t<Text>\n\t\t\t\t\t\t{ __( 'Set styles for the site’s background.' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t}\n\t\t\t/>\n\t\t\t{ hasBackgroundPanel && <BackgroundPanel /> }\n\t\t</>\n\t);\n}\n\nexport default ScreenBackground;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,IAAIC,sBAAsB,QAAQ,yBAAyB;AAC/E,SAASC,kBAAkB,IAAIC,IAAI,QAAQ,uBAAuB;;AAElE;AACA;AACA;AACA,OAAOC,eAAe,MAAM,oBAAoB;AAChD,OAAOC,YAAY,MAAM,UAAU;AACnC,SAASC,MAAM,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE3C,MAAM;EAAEC,qBAAqB;EAAEC;AAAiB,CAAC,GAAGR,MAAM,CACzDL,sBACD,CAAC;AAED,SAASc,gBAAgBA,CAAA,EAAG;EAC3B,MAAM,CAAEC,QAAQ,CAAE,GAAGF,gBAAgB,CAAE,EAAG,CAAC;EAC3C,MAAMG,kBAAkB,GAAGJ,qBAAqB,CAAEG,QAAS,CAAC;EAC5D,oBACCJ,KAAA,CAAAF,SAAA;IAAAQ,QAAA,gBACCV,IAAA,CAACH,YAAY;MACZc,KAAK,EAAGpB,EAAE,CAAE,YAAa,CAAG;MAC5BqB,WAAW,eACVZ,IAAA,CAACL,IAAI;QAAAe,QAAA,EACFnB,EAAE,CAAE,uCAAwC;MAAC,CAC1C;IACN,CACD,CAAC,EACAkB,kBAAkB,iBAAIT,IAAA,CAACJ,eAAe,IAAE,CAAC;EAAA,CAC1C,CAAC;AAEL;AAEA,eAAeW,gBAAgB","ignoreList":[]}

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

@@ -8,14 +8,12 @@ import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
  * Internal dependencies
  */
 import DimensionsPanel from './dimensions-panel';
-import BackgroundPanel from './background-panel';
 import ScreenHeader from './header';
 import { unlock } from '../../lock-unlock';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 const {
-  useHasBackgroundPanel,
   useHasDimensionsPanel,
   useGlobalSetting,
   useSettingsForBlockElement
@@ -24,15 +22,10 @@ function ScreenLayout() {
   const [rawSettings] = useGlobalSetting('');
   const settings = useSettingsForBlockElement(rawSettings);
   const hasDimensionsPanel = useHasDimensionsPanel(settings);
-  /*
-   * Use the raw settings to determine if the background panel should be displayed,
-   * as the background panel is not dependent on the block element settings.
-   */
-  const hasBackgroundPanel = useHasBackgroundPanel(rawSettings);
   return /*#__PURE__*/_jsxs(_Fragment, {
     children: [/*#__PURE__*/_jsx(ScreenHeader, {
       title: __('Layout')
-    }), hasDimensionsPanel && /*#__PURE__*/_jsx(DimensionsPanel, {}), hasBackgroundPanel && /*#__PURE__*/_jsx(BackgroundPanel, {})]
+    }), hasDimensionsPanel && /*#__PURE__*/_jsx(DimensionsPanel, {})]
   });
 }
 export default ScreenLayout;

package/build-module/components/global-styles/screen-layout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__","privateApis","blockEditorPrivateApis","DimensionsPanel","~~BackgroundPanel","~~ScreenHeader","unlock","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","~~useHasBackgroundPanel","~~useHasDimensionsPanel","useGlobalSetting","useSettingsForBlockElement","ScreenLayout","rawSettings","settings","hasDimensionsPanel","~~hasBackgroundPanel","~~children","title"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-layout.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport DimensionsPanel from './dimensions-panel';\nimport ~~BackgroundPanel from './background-panel';\nimport~~ ScreenHeader from './header';\nimport { unlock } from '../../lock-unlock';\n\nconst {\n\~~tuseHasBackgroundPanel,\n\tuseHasDimensionsPanel,\n\tuseGlobalSetting,\n\tuseSettingsForBlockElement,\n} = unlock~~( blockEditorPrivateApis );\n\nfunction ScreenLayout() {\n\tconst [ rawSettings ] = useGlobalSetting( '' );\n\tconst settings = useSettingsForBlockElement( rawSettings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\~~t/\~~n\t * Use the raw settings to determine if the background panel should be displayed,\n\t * as the background panel is not dependent on the block element settings.\n\t */\n\tconst hasBackgroundPanel = useHasBackgroundPanel( rawSettings );\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader title={ __( 'Layout' ) } />\n\t\t\t{ hasDimensionsPanel && <DimensionsPanel /> }\n\t\t~~\t{ hasBackgroundPanel && <BackgroundPanel /> }\n\t\t~~</>\n\t);\n}\n\nexport default ScreenLayout;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,IAAIC,sBAAsB,QAAQ,yBAAyB;;AAE/E;AACA;AACA;AACA,OAAOC,eAAe,MAAM,oBAAoB;AAChD,OAAOC,~~eAAe,MAAM,oBAAoB;AAChD,OAAOC,~~YAAY,MAAM,UAAU;AACnC,SAASC,MAAM,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE3C,MAAM;~~EACLC~~,qBAAqB;~~EACrBC~~,~~qBAAqB;EACrBC,~~gBAAgB;~~EAChBC~~;~~AACD~~,CAAC,~~GAAGV~~,MAAM,~~CAAEJ~~,sBAAuB,CAAC;~~AAEpC~~,~~SAASe~~,YAAYA,CAAA,EAAG;EACvB,MAAM,CAAEC,WAAW,CAAE,GAAGH,gBAAgB,CAAE,EAAG,CAAC;EAC9C,MAAMI,QAAQ,GAAGH,0BAA0B,CAAEE,WAAY,CAAC;EAC1D,MAAME,kBAAkB,GAAGN,qBAAqB,CAAEK,QAAS,CAAC;~~EAC5D;AACD;AACA;AACA;EACC~~,~~MAAME,kBAAkB,GAAGR,qBAAqB,CAAEK,WAAY,CAAC;EAC/D,~~oBACCN,KAAA,CAAAF,SAAA;~~IAAAY~~,QAAA,~~gBACCd~~,IAAA,CAACH,YAAY;~~MAACkB~~,KAAK,~~EAAGvB~~,EAAE,CAAE,QAAS;IAAG,CAAE,CAAC,~~EACvCoB~~,kBAAkB,~~iBAAIZ~~,IAAA,~~CAACL,eAAe,IAAE,CAAC,EACzCkB,kBAAkB,iBAAIb,IAAA,~~CAACJ,eAAe,IAAE,CAAC;EAAA,CAC1C,CAAC;AAEL;AAEA,~~eAAea~~,YAAY","ignoreList":[]}
1	+ {"version":3,"names":["__","privateApis","blockEditorPrivateApis","DimensionsPanel","ScreenHeader","unlock","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","useHasDimensionsPanel","useGlobalSetting","useSettingsForBlockElement","ScreenLayout","rawSettings","settings","hasDimensionsPanel","children","title"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-layout.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n */\nimport DimensionsPanel from './dimensions-panel';\nimport ScreenHeader from './header';\nimport { unlock } from '../../lock-unlock';\n\nconst { useHasDimensionsPanel, useGlobalSetting, useSettingsForBlockElement } =\n\tunlock( blockEditorPrivateApis );\n\nfunction ScreenLayout() {\n\tconst [ rawSettings ] = useGlobalSetting( '' );\n\tconst settings = useSettingsForBlockElement( rawSettings );\n\tconst hasDimensionsPanel = useHasDimensionsPanel( settings );\n\n\treturn (\n\t\t<>\n\t\t\t<ScreenHeader title={ __( 'Layout' ) } />\n\t\t\t{ hasDimensionsPanel && <DimensionsPanel /> }\n\t\t</>\n\t);\n}\n\nexport default ScreenLayout;\n"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SAASC,WAAW,IAAIC,sBAAsB,QAAQ,yBAAyB;;AAE/E;AACA;AACA;AACA,OAAOC,eAAe,MAAM,oBAAoB;AAChD,OAAOC,YAAY,MAAM,UAAU;AACnC,SAASC,MAAM,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE3C,MAAM;EAAEC,qBAAqB;EAAEC,gBAAgB;EAAEC;AAA2B,CAAC,GAC5ET,MAAM,CAAEH,sBAAuB,CAAC;AAEjC,SAASa,YAAYA,CAAA,EAAG;EACvB,MAAM,CAAEC,WAAW,CAAE,GAAGH,gBAAgB,CAAE,EAAG,CAAC;EAC9C,MAAMI,QAAQ,GAAGH,0BAA0B,CAAEE,WAAY,CAAC;EAC1D,MAAME,kBAAkB,GAAGN,qBAAqB,CAAEK,QAAS,CAAC;EAE5D,oBACCN,KAAA,CAAAF,SAAA;IAAAU,QAAA,gBACCZ,IAAA,CAACH,YAAY;MAACgB,KAAK,EAAGpB,EAAE,CAAE,QAAS;IAAG,CAAE,CAAC,EACvCkB,kBAAkB,iBAAIX,IAAA,CAACJ,eAAe,IAAE,CAAC;EAAA,CAC1C,CAAC;AAEL;AAEA,eAAeY,YAAY","ignoreList":[]}

package/build-module/components/global-styles/screen-revisions/revisions-buttons.js CHANGED Viewed

@@ -131,10 +131,8 @@ function RevisionsButtons({
           'is-reset': isReset
         }),
         "aria-current": isSelected,
-        children: [/*#__PURE__*/_jsx(Button
-        // TODO: Switch to `true` (40px size) if possible
-        , {
-          __next40pxDefaultSize: false,
+        children: [/*#__PURE__*/_jsx(Button, {
+          __next40pxDefaultSize: true,
           className: "edit-site-global-styles-screen-revisions__revision-button",
           accessibleWhenDisabled: true,
           disabled: isSelected,

package/build-module/components/global-styles/screen-revisions/revisions-buttons.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["clsx","__","sprintf","Button","dateI18n","getDate","humanTimeDiff","getSettings","store","coreStore","useSelect","privateApis","blockEditorPrivateApis","unlock","jsx","_jsx","jsxs","_jsxs","DAY_IN_MILLISECONDS","getGlobalStylesChanges","ChangesSummary","revision","previousRevision","changes","maxResults","length","className","children","map","change","getRevisionLabel","id","authorDisplayName","formattedModifiedDate","areStylesEqual","RevisionsButtons","userRevisions","selectedRevisionId","onChange","canApplyRevision","onApplyRevision","currentThemeName","currentUser","select","getCurrentTheme","getCurrentUser","currentTheme","name","rendered","stylesheet","dateNowInMs","getTime","datetimeAbbreviated","formats","role","index","author","modified","isUnsaved","revisionAuthor","authorAvatar","avatar_urls","isFirstItem","isSelected","isReset","modifiedDate","displayDate","revisionLabel","__next40pxDefaultSize","accessibleWhenDisabled","disabled","onClick","dateTime","alt","src","size","variant"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-revisions/revisions-buttons.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\nimport { dateI18n, getDate, humanTimeDiff, getSettings } from '@wordpress/date';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../../lock-unlock';\n\nconst DAY_IN_MILLISECONDS = 60 60 * 1000 * 24;\nconst { getGlobalStylesChanges } = unlock( blockEditorPrivateApis );\n\nfunction ChangesSummary( { revision, previousRevision } ) {\n\tconst changes = getGlobalStylesChanges( revision, previousRevision, {\n\t\tmaxResults: 7,\n\t} );\n\n\tif ( ! changes.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ul\n\t\t\tdata-testid=\"global-styles-revision-changes\"\n\t\t\tclassName=\"edit-site-global-styles-screen-revisions__changes\"\n\t\t>\n\t\t\t{ changes.map( ( change ) => (\n\t\t\t\t<li key={ change }>{ change }</li>\n\t\t\t) ) }\n\t\t</ul>\n\t);\n}\n\n/*\n Returns a button label for the revision.\n \n @param {string\|number} id A revision object.\n * @param {string} authorDisplayName Author name.\n * @param {string} formattedModifiedDate Revision modified date formatted.\n * @param {boolean} areStylesEqual Whether the revision matches the current editor styles.\n * @return {string} Translated label.\n /\nfunction getRevisionLabel(\n\tid,\n\tauthorDisplayName,\n\tformattedModifiedDate,\n\tareStylesEqual\n) {\n\tif ( 'parent' === id ) {\n\t\treturn __( 'Reset the styles to the theme defaults' );\n\t}\n\n\tif ( 'unsaved' === id ) {\n\t\treturn sprintf(\n\t\t\t/ translators: %s: author display name /\n\t\t\t__( 'Unsaved changes by %s' ),\n\t\t\tauthorDisplayName\n\t\t);\n\t}\n\n\treturn areStylesEqual\n\t\t? sprintf(\n\t\t\t\t// translators: %1$s: author display name, %2$s: revision creation date.\n\t\t\t\t__(\n\t\t\t\t\t'Changes saved by %1$s on %2$s. This revision matches current editor styles.'\n\t\t\t\t),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedModifiedDate\n\t\t )\n\t\t: sprintf(\n\t\t\t\t// translators: %1$s: author display name, %2$s: revision creation date.\n\t\t\t\t__( 'Changes saved by %1$s on %2$s' ),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedModifiedDate\n\t\t );\n}\n\n/\n Returns a rendered list of revisions buttons.\n \n @typedef {Object} props\n * @property {Array<Object>} userRevisions A collection of user revisions.\n * @property {number} selectedRevisionId The id of the currently-selected revision.\n * @property {Function} onChange Callback fired when a revision is selected.\n \n @param {props} Component props.\n * @return {JSX.Element} The modal component.\n */\nfunction RevisionsButtons( {\n\tuserRevisions,\n\tselectedRevisionId,\n\tonChange,\n\tcanApplyRevision,\n\tonApplyRevision,\n} ) {\n\tconst { currentThemeName, currentUser } = useSelect( ( select ) => {\n\t\tconst { getCurrentTheme, getCurrentUser } = select( coreStore );\n\t\tconst currentTheme = getCurrentTheme();\n\t\treturn {\n\t\t\tcurrentThemeName:\n\t\t\t\tcurrentTheme?.name?.rendered \|\| currentTheme?.stylesheet,\n\t\t\tcurrentUser: getCurrentUser(),\n\t\t};\n\t}, [] );\n\tconst dateNowInMs = getDate().getTime();\n\tconst { datetimeAbbreviated } = getSettings().formats;\n\n\treturn (\n\t\t<ol\n\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revisions-list\"\n\t\t\taria-label={ __( 'Global styles revisions list' ) }\n\t\t\trole=\"group\"\n\t\t>\n\t\t\t{ userRevisions.map( ( revision, index ) => {\n\t\t\t\tconst { id, author, modified } = revision;\n\t\t\t\tconst isUnsaved = 'unsaved' === id;\n\t\t\t\t// Unsaved changes are created by the current user.\n\t\t\t\tconst revisionAuthor = isUnsaved ? currentUser : author;\n\t\t\t\tconst authorDisplayName = revisionAuthor?.name \|\| __( 'User' );\n\t\t\t\tconst authorAvatar = revisionAuthor?.avatar_urls?.[ '48' ];\n\t\t\t\tconst isFirstItem = index === 0;\n\t\t\t\tconst isSelected = selectedRevisionId\n\t\t\t\t\t? selectedRevisionId === id\n\t\t\t\t\t: isFirstItem;\n\t\t\t\tconst areStylesEqual = ! canApplyRevision && isSelected;\n\t\t\t\tconst isReset = 'parent' === id;\n\t\t\t\tconst modifiedDate = getDate( modified );\n\t\t\t\tconst displayDate =\n\t\t\t\t\tmodified &&\n\t\t\t\t\tdateNowInMs - modifiedDate.getTime() > DAY_IN_MILLISECONDS\n\t\t\t\t\t\t? dateI18n( datetimeAbbreviated, modifiedDate )\n\t\t\t\t\t\t: humanTimeDiff( modified );\n\t\t\t\tconst revisionLabel = getRevisionLabel(\n\t\t\t\t\tid,\n\t\t\t\t\tauthorDisplayName,\n\t\t\t\t\tdateI18n( datetimeAbbreviated, modifiedDate ),\n\t\t\t\t\tareStylesEqual\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'edit-site-global-styles-screen-revisions__revision-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t\t\t'is-active': areStylesEqual,\n\t\t\t\t\t\t\t\t'is-reset': isReset,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\taria-current={ isSelected }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t// TODO: Switch to `true` (40px size) if possible\n\t\t\t\t\t\t\t__next40pxDefaultSize={ false }\n\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revision-button\"\n\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\tdisabled={ isSelected }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonChange( revision );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taria-label={ revisionLabel }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ isReset ? (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t{ __( 'Default styles' ) }\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t{ currentThemeName }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t{ isUnsaved ? (\n\t\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__date\">\n\t\t\t\t\t\t\t\t\t\t\t{ __( '(Unsaved)' ) }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<time\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__date\"\n\t\t\t\t\t\t\t\t\t\t\tdateTime={ modified }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ displayDate }\n\t\t\t\t\t\t\t\t\t\t</time>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\talt={ authorDisplayName }\n\t\t\t\t\t\t\t\t\t\t\tsrc={ authorAvatar }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t{ authorDisplayName }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t{ isSelected && (\n\t\t\t\t\t\t\t\t\t\t<ChangesSummary\n\t\t\t\t\t\t\t\t\t\t\trevision={ revision }\n\t\t\t\t\t\t\t\t\t\t\tpreviousRevision={\n\t\t\t\t\t\t\t\t\t\t\t\tindex < userRevisions.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t? userRevisions[ index + 1 ]\n\t\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</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t{ isSelected &&\n\t\t\t\t\t\t\t( areStylesEqual ? (\n\t\t\t\t\t\t\t\t<p className=\"edit-site-global-styles-screen-revisions__applied-text\">\n\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t'These styles are already applied to your site.'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__apply-button\"\n\t\t\t\t\t\t\t\t\tonClick={ onApplyRevision }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ isReset\n\t\t\t\t\t\t\t\t\t\t? __( 'Reset to defaults' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Apply' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ol>\n\t);\n}\n\nexport default RevisionsButtons;\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["clsx","__","sprintf","Button","dateI18n","getDate","humanTimeDiff","getSettings","store","coreStore","useSelect","privateApis","blockEditorPrivateApis","unlock","jsx","_jsx","jsxs","_jsxs","DAY_IN_MILLISECONDS","getGlobalStylesChanges","ChangesSummary","revision","previousRevision","changes","maxResults","length","className","children","map","change","getRevisionLabel","id","authorDisplayName","formattedModifiedDate","areStylesEqual","RevisionsButtons","userRevisions","selectedRevisionId","onChange","canApplyRevision","onApplyRevision","currentThemeName","currentUser","select","getCurrentTheme","getCurrentUser","currentTheme","name","rendered","stylesheet","dateNowInMs","getTime","datetimeAbbreviated","formats","role","index","author","modified","isUnsaved","revisionAuthor","authorAvatar","avatar_urls","isFirstItem","isSelected","isReset","modifiedDate","displayDate","revisionLabel","__next40pxDefaultSize","accessibleWhenDisabled","disabled","onClick","dateTime","alt","src","size","variant"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-revisions/revisions-buttons.js"],"sourcesContent":["/*\n External dependencies\n /\nimport clsx from 'clsx';\n\n/\n WordPress dependencies\n /\nimport { __, sprintf } from '@wordpress/i18n';\nimport { Button } from '@wordpress/components';\nimport { dateI18n, getDate, humanTimeDiff, getSettings } from '@wordpress/date';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { useSelect } from '@wordpress/data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport { unlock } from '../../../lock-unlock';\n\nconst DAY_IN_MILLISECONDS = 60 60 * 1000 * 24;\nconst { getGlobalStylesChanges } = unlock( blockEditorPrivateApis );\n\nfunction ChangesSummary( { revision, previousRevision } ) {\n\tconst changes = getGlobalStylesChanges( revision, previousRevision, {\n\t\tmaxResults: 7,\n\t} );\n\n\tif ( ! changes.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<ul\n\t\t\tdata-testid=\"global-styles-revision-changes\"\n\t\t\tclassName=\"edit-site-global-styles-screen-revisions__changes\"\n\t\t>\n\t\t\t{ changes.map( ( change ) => (\n\t\t\t\t<li key={ change }>{ change }</li>\n\t\t\t) ) }\n\t\t</ul>\n\t);\n}\n\n/*\n Returns a button label for the revision.\n \n @param {string\|number} id A revision object.\n * @param {string} authorDisplayName Author name.\n * @param {string} formattedModifiedDate Revision modified date formatted.\n * @param {boolean} areStylesEqual Whether the revision matches the current editor styles.\n * @return {string} Translated label.\n /\nfunction getRevisionLabel(\n\tid,\n\tauthorDisplayName,\n\tformattedModifiedDate,\n\tareStylesEqual\n) {\n\tif ( 'parent' === id ) {\n\t\treturn __( 'Reset the styles to the theme defaults' );\n\t}\n\n\tif ( 'unsaved' === id ) {\n\t\treturn sprintf(\n\t\t\t/ translators: %s: author display name /\n\t\t\t__( 'Unsaved changes by %s' ),\n\t\t\tauthorDisplayName\n\t\t);\n\t}\n\n\treturn areStylesEqual\n\t\t? sprintf(\n\t\t\t\t// translators: %1$s: author display name, %2$s: revision creation date.\n\t\t\t\t__(\n\t\t\t\t\t'Changes saved by %1$s on %2$s. This revision matches current editor styles.'\n\t\t\t\t),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedModifiedDate\n\t\t )\n\t\t: sprintf(\n\t\t\t\t// translators: %1$s: author display name, %2$s: revision creation date.\n\t\t\t\t__( 'Changes saved by %1$s on %2$s' ),\n\t\t\t\tauthorDisplayName,\n\t\t\t\tformattedModifiedDate\n\t\t );\n}\n\n/\n Returns a rendered list of revisions buttons.\n \n @typedef {Object} props\n * @property {Array<Object>} userRevisions A collection of user revisions.\n * @property {number} selectedRevisionId The id of the currently-selected revision.\n * @property {Function} onChange Callback fired when a revision is selected.\n \n @param {props} Component props.\n * @return {JSX.Element} The modal component.\n */\nfunction RevisionsButtons( {\n\tuserRevisions,\n\tselectedRevisionId,\n\tonChange,\n\tcanApplyRevision,\n\tonApplyRevision,\n} ) {\n\tconst { currentThemeName, currentUser } = useSelect( ( select ) => {\n\t\tconst { getCurrentTheme, getCurrentUser } = select( coreStore );\n\t\tconst currentTheme = getCurrentTheme();\n\t\treturn {\n\t\t\tcurrentThemeName:\n\t\t\t\tcurrentTheme?.name?.rendered \|\| currentTheme?.stylesheet,\n\t\t\tcurrentUser: getCurrentUser(),\n\t\t};\n\t}, [] );\n\tconst dateNowInMs = getDate().getTime();\n\tconst { datetimeAbbreviated } = getSettings().formats;\n\n\treturn (\n\t\t<ol\n\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revisions-list\"\n\t\t\taria-label={ __( 'Global styles revisions list' ) }\n\t\t\trole=\"group\"\n\t\t>\n\t\t\t{ userRevisions.map( ( revision, index ) => {\n\t\t\t\tconst { id, author, modified } = revision;\n\t\t\t\tconst isUnsaved = 'unsaved' === id;\n\t\t\t\t// Unsaved changes are created by the current user.\n\t\t\t\tconst revisionAuthor = isUnsaved ? currentUser : author;\n\t\t\t\tconst authorDisplayName = revisionAuthor?.name \|\| __( 'User' );\n\t\t\t\tconst authorAvatar = revisionAuthor?.avatar_urls?.[ '48' ];\n\t\t\t\tconst isFirstItem = index === 0;\n\t\t\t\tconst isSelected = selectedRevisionId\n\t\t\t\t\t? selectedRevisionId === id\n\t\t\t\t\t: isFirstItem;\n\t\t\t\tconst areStylesEqual = ! canApplyRevision && isSelected;\n\t\t\t\tconst isReset = 'parent' === id;\n\t\t\t\tconst modifiedDate = getDate( modified );\n\t\t\t\tconst displayDate =\n\t\t\t\t\tmodified &&\n\t\t\t\t\tdateNowInMs - modifiedDate.getTime() > DAY_IN_MILLISECONDS\n\t\t\t\t\t\t? dateI18n( datetimeAbbreviated, modifiedDate )\n\t\t\t\t\t\t: humanTimeDiff( modified );\n\t\t\t\tconst revisionLabel = getRevisionLabel(\n\t\t\t\t\tid,\n\t\t\t\t\tauthorDisplayName,\n\t\t\t\t\tdateI18n( datetimeAbbreviated, modifiedDate ),\n\t\t\t\t\tareStylesEqual\n\t\t\t\t);\n\n\t\t\t\treturn (\n\t\t\t\t\t<li\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'edit-site-global-styles-screen-revisions__revision-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t\t\t'is-active': areStylesEqual,\n\t\t\t\t\t\t\t\t'is-reset': isReset,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tkey={ id }\n\t\t\t\t\t\taria-current={ isSelected }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t__next40pxDefaultSize\n\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__revision-button\"\n\t\t\t\t\t\t\taccessibleWhenDisabled\n\t\t\t\t\t\t\tdisabled={ isSelected }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonChange( revision );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\taria-label={ revisionLabel }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ isReset ? (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t{ __( 'Default styles' ) }\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t{ currentThemeName }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__description\">\n\t\t\t\t\t\t\t\t\t{ isUnsaved ? (\n\t\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__date\">\n\t\t\t\t\t\t\t\t\t\t\t{ __( '(Unsaved)' ) }\n\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t\t<time\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__date\"\n\t\t\t\t\t\t\t\t\t\t\tdateTime={ modified }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ displayDate }\n\t\t\t\t\t\t\t\t\t\t</time>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t<span className=\"edit-site-global-styles-screen-revisions__meta\">\n\t\t\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\t\t\talt={ authorDisplayName }\n\t\t\t\t\t\t\t\t\t\t\tsrc={ authorAvatar }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t{ authorDisplayName }\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t{ isSelected && (\n\t\t\t\t\t\t\t\t\t\t<ChangesSummary\n\t\t\t\t\t\t\t\t\t\t\trevision={ revision }\n\t\t\t\t\t\t\t\t\t\t\tpreviousRevision={\n\t\t\t\t\t\t\t\t\t\t\t\tindex < userRevisions.length\n\t\t\t\t\t\t\t\t\t\t\t\t\t? userRevisions[ index + 1 ]\n\t\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</span>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t{ isSelected &&\n\t\t\t\t\t\t\t( areStylesEqual ? (\n\t\t\t\t\t\t\t\t<p className=\"edit-site-global-styles-screen-revisions__applied-text\">\n\t\t\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t\t\t'These styles are already applied to your site.'\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-global-styles-screen-revisions__apply-button\"\n\t\t\t\t\t\t\t\t\tonClick={ onApplyRevision }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ isReset\n\t\t\t\t\t\t\t\t\t\t? __( 'Reset to defaults' )\n\t\t\t\t\t\t\t\t\t\t: __( 'Apply' ) }\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t</li>\n\t\t\t\t);\n\t\t\t} ) }\n\t\t</ol>\n\t);\n}\n\nexport default RevisionsButtons;\n"],"mappings":"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","ignoreList":[]}

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

@@ -43,11 +43,14 @@ function ScreenRoot() {
   return /*#__PURE__*/_jsxs(Card, {
     size: "small",
     className: "edit-site-global-styles-screen-root",
+    isRounded: false,
     children: [/*#__PURE__*/_jsx(CardBody, {
       children: /*#__PURE__*/_jsxs(VStack, {
         spacing: 4,
         children: [/*#__PURE__*/_jsx(Card, {
+          className: "edit-site-global-styles-screen-root__active-style-tile",
           children: /*#__PURE__*/_jsx(CardMedia, {
+            className: "edit-site-global-styles-screen-root__active-style-tile-preview",
             children: /*#__PURE__*/_jsx(PreviewStyles, {})
           })
         }), hasVariations && /*#__PURE__*/_jsx(ItemGroup, {

package/build-module/components/global-styles/screen-root.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalSpacer","Spacer","__experimentalVStack","VStack","FlexItem","CardBody","Card","CardDivider","CardMedia","isRTL","__","chevronLeft","chevronRight","useSelect","store","coreStore","privateApis","blockEditorPrivateApis","IconWithCurrentColor","NavigationButtonAsItem","RootMenu","PreviewStyles","unlock","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useGlobalStyle","ScreenRoot","customCSS","hasVariations","canEditCSS","select","getEntityRecord","__experimentalGetCurrentGlobalStylesId","__experimentalGetCurrentThemeGlobalStylesVariations","globalStylesId","globalStyles","undefined","length","_links","size","className","children","spacing","path","justify","icon","as","paddingTop","paddingX","marginBottom"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-root.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalVStack as VStack,\n\tFlexItem,\n\tCardBody,\n\tCard,\n\tCardDivider,\n\tCardMedia,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronLeft, chevronRight } from '@wordpress/icons';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport { IconWithCurrentColor } from './icon-with-current-color';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport RootMenu from './root-menu';\nimport PreviewStyles from './preview-styles';\nimport { unlock } from '../../lock-unlock';\n\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction ScreenRoot() {\n\tconst [ customCSS ] = useGlobalStyle( 'css' );\n\n\tconst { hasVariations, canEditCSS } = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetEntityRecord,\n\t\t\t__experimentalGetCurrentGlobalStylesId,\n\t\t\t__experimentalGetCurrentThemeGlobalStylesVariations,\n\t\t} = select( coreStore );\n\n\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\tconst globalStyles = globalStylesId\n\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t: undefined;\n\n\t\treturn {\n\t\t\thasVariations:\n\t\t\t\t!! __experimentalGetCurrentThemeGlobalStylesVariations()\n\t\t\t\t\t?.length,\n\t\t\tcanEditCSS: !! globalStyles?._links?.[ 'wp:action-edit-css' ],\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Card ~~size~~=\"small\" ~~className~~=\"edit-site-global-styles-screen-root\">\n\t\t\t<CardBody>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t<Card>\n\t\t\t\t\t\t<CardMedia>\n\t\t\t\t\t\t\t<PreviewStyles />\n\t\t\t\t\t\t</CardMedia>\n\t\t\t\t\t</Card>\n\t\t\t\t\t{ hasVariations && (\n\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\tpath=\"/variations\"\n\t\t\t\t\t\t\t\taria-label={ __( 'Browse styles' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Browse styles' ) }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? chevronLeft : chevronRight\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</HStack>\n\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<RootMenu />\n\t\t\t\t</VStack>\n\t\t\t</CardBody>\n\n\t\t\t<CardDivider />\n\n\t\t\t<CardBody>\n\t\t\t\t<Spacer\n\t\t\t\t\tas=\"p\"\n\t\t\t\t\tpaddingTop={ 2 }\n\t\t\t\t\t/\n\t\t\t\t\t * 13px matches the text inset of the NavigationButton (12px padding, plus the width of the button's border).\n\t\t\t\t\t * This is an ad hoc override for this instance and the Addtional CSS option below. Other options for matching the\n\t\t\t\t\t * the nav button inset should be looked at before reusing further.\n\t\t\t\t\t */\n\t\t\t\t\tpaddingX=\"13px\"\n\t\t\t\t\tmarginBottom={ 4 }\n\t\t\t\t>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Customize the appearance of specific blocks for the whole site.'\n\t\t\t\t\t) }\n\t\t\t\t</Spacer>\n\t\t\t\t<ItemGroup>\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\tpath=\"/blocks\"\n\t\t\t\t\t\taria-label={ __( 'Blocks styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t<FlexItem>{ __( 'Blocks' ) }</FlexItem>\n\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\ticon={ isRTL() ? chevronLeft : chevronRight }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t</ItemGroup>\n\t\t\t</CardBody>\n\n\t\t\t{ canEditCSS && !! customCSS && (\n\t\t\t\t<>\n\t\t\t\t\t<CardDivider />\n\t\t\t\t\t<CardBody>\n\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\tas=\"p\"\n\t\t\t\t\t\t\tpaddingTop={ 2 }\n\t\t\t\t\t\t\tpaddingX=\"13px\"\n\t\t\t\t\t\t\tmarginBottom={ 4 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Add your own CSS to customize the appearance and layout of your site.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\tpath=\"/css\"\n\t\t\t\t\t\t\t\taria-label={ __( 'Additional CSS' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Additional CSS' ) }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? chevronLeft : chevronRight\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</HStack>\n\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t</CardBody>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</Card>\n\t);\n}\n\nexport default ScreenRoot;\n"],"mappings":"AAAA;AACA;AACA;AACA,SACCA,uBAAuB,IAAIC,SAAS,EACpCC,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,EAC9BC,QAAQ,EACRC,QAAQ,EACRC,IAAI,EACJC,WAAW,EACXC,SAAS,QACH,uBAAuB;AAC9B,SAASC,KAAK,EAAEC,EAAE,QAAQ,iBAAiB;AAC3C,SAASC,WAAW,EAAEC,YAAY,QAAQ,kBAAkB;AAC5D,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,KAAK,IAAIC,SAAS,QAAQ,sBAAsB;AACzD,SAASC,WAAW,IAAIC,sBAAsB,QAAQ,yBAAyB;;AAE/E;AACA;AACA;AACA,SAASC,oBAAoB,QAAQ,2BAA2B;AAChE,SAASC,sBAAsB,QAAQ,qBAAqB;AAC5D,OAAOC,QAAQ,MAAM,aAAa;AAClC,OAAOC,aAAa,MAAM,kBAAkB;AAC5C,SAASC,MAAM,QAAQ,mBAAmB;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAAA,SAAAC,QAAA,IAAAC,SAAA;AAE3C,MAAM;EAAEC;AAAe,CAAC,GAAGP,MAAM,CAAEL,sBAAuB,CAAC;AAE3D,SAASa,UAAUA,CAAA,EAAG;EACrB,MAAM,CAAEC,SAAS,CAAE,GAAGF,cAAc,CAAE,KAAM,CAAC;EAE7C,MAAM;IAAEG,aAAa;IAAEC;EAAW,CAAC,GAAGpB,SAAS,CAAIqB,MAAM,IAAM;IAC9D,MAAM;MACLC,eAAe;MACfC,sCAAsC;MACtCC;IACD,CAAC,GAAGH,MAAM,CAAEnB,SAAU,CAAC;IAEvB,MAAMuB,cAAc,GAAGF,sCAAsC,CAAC,CAAC;IAC/D,MAAMG,YAAY,GAAGD,cAAc,GAChCH,eAAe,CAAE,MAAM,EAAE,cAAc,EAAEG,cAAe,CAAC,GACzDE,SAAS;IAEZ,OAAO;MACNR,aAAa,EACZ,CAAC,CAAEK,mDAAmD,CAAC,CAAC,EACrDI,MAAM;MACVR,UAAU,EAAE,CAAC,CAAEM,YAAY,EAAEG,MAAM,GAAI,oBAAoB;IAC5D,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,oBACChB,KAAA,CAACpB,IAAI;~~IAACqC~~,IAAI,EAAC,OAAO;~~IAACC~~,SAAS,EAAC,qCAAqC;IAAAC,QAAA,~~gBACjErB~~,IAAA,CAACnB,QAAQ;~~MAAAwC~~,QAAA,~~eACRnB~~,KAAA,CAACvB,MAAM;~~QAAC2C~~,OAAO,EAAG,CAAG;QAAAD,QAAA,~~gBACpBrB~~,IAAA,CAAClB,IAAI;~~UAAAuC~~,QAAA,~~eACJrB~~,IAAA,CAAChB,SAAS;~~YAAAqC~~,QAAA,~~eACTrB~~,IAAA,CAACH,aAAa,IAAE;UAAC,CACP;QAAC,CACP,CAAC,EACLW,aAAa,iBACdR,IAAA,CAAC3B,SAAS;~~UAAAgD~~,QAAA,~~eACTrB~~,IAAA,CAACL,sBAAsB;~~YACtB4B~~,IAAI,EAAC,aAAa;YAClB,~~cAAarC~~,EAAE,CAAE,eAAgB,CAAG;~~YAAAmC~~,QAAA,~~eAEpCnB~~,KAAA,CAAC3B,MAAM;~~cAACiD~~,OAAO,EAAC,eAAe;cAAAH,QAAA,~~gBAC9BrB~~,IAAA,CAACpB,QAAQ;~~gBAAAyC~~,QAAA,~~EACNnC~~,EAAE,CAAE,eAAgB;cAAC,CACd,CAAC,eACXc,IAAA,CAACN,oBAAoB;~~gBACpB+B~~,IAAI,~~EACHxC~~,KAAK,CAAC,CAAC,GAAGE,WAAW,GAAGC;cACxB,CACD,CAAC;YAAA,CACK;UAAC,CACc;QAAC,CACf,CACX,eACDY,IAAA,CAACJ,QAAQ,IAAE,CAAC;MAAA,CACL;IAAC,CACA,CAAC,eAEXI,IAAA,CAACjB,WAAW,IAAE,CAAC,eAEfmB,KAAA,CAACrB,QAAQ;~~MAAAwC~~,QAAA,~~gBACRrB~~,IAAA,CAACvB,MAAM;~~QACNiD~~,EAAE,EAAC,GAAG;QACNC,UAAU,EAAG;QACb;AACL;AACA;AACA;AACA,WAJK;QAKAC,QAAQ,EAAC,MAAM;QACfC,YAAY,EAAG,CAAG;QAAAR,QAAA,~~EAEhBnC~~,EAAE,CACH,iEACD;MAAC,CACM,CAAC,eACTc,IAAA,CAAC3B,SAAS;~~QAAAgD~~,QAAA,~~eACTrB~~,IAAA,CAACL,sBAAsB;~~UACtB4B~~,IAAI,EAAC,SAAS;UACd,~~cAAarC~~,EAAE,CAAE,eAAgB,CAAG;~~UAAAmC~~,QAAA,~~eAEpCnB~~,KAAA,CAAC3B,MAAM;~~YAACiD~~,OAAO,EAAC,eAAe;YAAAH,QAAA,~~gBAC9BrB~~,IAAA,CAACpB,QAAQ;~~cAAAyC~~,QAAA,~~EAAGnC~~,EAAE,CAAE,QAAS;YAAC,CAAY,CAAC,eACvCc,IAAA,CAACN,oBAAoB;~~cACpB+B~~,IAAI,~~EAAGxC~~,KAAK,CAAC,CAAC,GAAGE,WAAW,GAAGC;YAAc,CAC7C,CAAC;UAAA,CACK;QAAC,CACc;MAAC,CACf,CAAC;IAAA,CACH,CAAC,EAETqB,UAAU,IAAI,CAAC,CAAEF,SAAS,iBAC3BL,KAAA,CAAAE,SAAA;~~MAAAiB~~,QAAA,~~gBACCrB~~,IAAA,CAACjB,WAAW,IAAE,CAAC,eACfmB,KAAA,CAACrB,QAAQ;~~QAAAwC~~,QAAA,~~gBACRrB~~,IAAA,CAACvB,MAAM;~~UACNiD~~,EAAE,EAAC,GAAG;UACNC,UAAU,EAAG,CAAG;UAChBC,QAAQ,EAAC,MAAM;UACfC,YAAY,EAAG,CAAG;UAAAR,QAAA,~~EAEhBnC~~,EAAE,CACH,uEACD;QAAC,CACM,CAAC,eACTc,IAAA,CAAC3B,SAAS;~~UAAAgD~~,QAAA,~~eACTrB~~,IAAA,CAACL,sBAAsB;~~YACtB4B~~,IAAI,EAAC,MAAM;YACX,~~cAAarC~~,EAAE,CAAE,gBAAiB,CAAG;~~YAAAmC~~,QAAA,~~eAErCnB~~,KAAA,CAAC3B,MAAM;~~cAACiD~~,OAAO,EAAC,eAAe;cAAAH,QAAA,~~gBAC9BrB~~,IAAA,CAACpB,QAAQ;~~gBAAAyC~~,QAAA,~~EACNnC~~,EAAE,CAAE,gBAAiB;cAAC,CACf,CAAC,eACXc,IAAA,CAACN,oBAAoB;~~gBACpB+B~~,IAAI,~~EACHxC~~,KAAK,CAAC,CAAC,GAAGE,WAAW,GAAGC;cACxB,CACD,CAAC;YAAA,CACK;UAAC,CACc;QAAC,CACf,CAAC;MAAA,CACH,CAAC;IAAA,CACV,CACF;EAAA,CACI,CAAC;AAET;AAEA,eAAekB,UAAU","ignoreList":[]}
1	+ {"version":3,"names":["__experimentalItemGroup","ItemGroup","__experimentalHStack","HStack","__experimentalSpacer","Spacer","__experimentalVStack","VStack","FlexItem","CardBody","Card","CardDivider","CardMedia","isRTL","__","chevronLeft","chevronRight","useSelect","store","coreStore","privateApis","blockEditorPrivateApis","IconWithCurrentColor","NavigationButtonAsItem","RootMenu","PreviewStyles","unlock","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","useGlobalStyle","ScreenRoot","customCSS","hasVariations","canEditCSS","select","getEntityRecord","__experimentalGetCurrentGlobalStylesId","__experimentalGetCurrentThemeGlobalStylesVariations","globalStylesId","globalStyles","undefined","length","_links","size","className","isRounded","children","spacing","path","justify","icon","as","paddingTop","paddingX","marginBottom"],"sources":["@wordpress/edit-site/src/components/global-styles/screen-root.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalHStack as HStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalVStack as VStack,\n\tFlexItem,\n\tCardBody,\n\tCard,\n\tCardDivider,\n\tCardMedia,\n} from '@wordpress/components';\nimport { isRTL, __ } from '@wordpress/i18n';\nimport { chevronLeft, chevronRight } from '@wordpress/icons';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\n\n/\n Internal dependencies\n /\nimport { IconWithCurrentColor } from './icon-with-current-color';\nimport { NavigationButtonAsItem } from './navigation-button';\nimport RootMenu from './root-menu';\nimport PreviewStyles from './preview-styles';\nimport { unlock } from '../../lock-unlock';\n\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nfunction ScreenRoot() {\n\tconst [ customCSS ] = useGlobalStyle( 'css' );\n\n\tconst { hasVariations, canEditCSS } = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetEntityRecord,\n\t\t\t__experimentalGetCurrentGlobalStylesId,\n\t\t\t__experimentalGetCurrentThemeGlobalStylesVariations,\n\t\t} = select( coreStore );\n\n\t\tconst globalStylesId = __experimentalGetCurrentGlobalStylesId();\n\t\tconst globalStyles = globalStylesId\n\t\t\t? getEntityRecord( 'root', 'globalStyles', globalStylesId )\n\t\t\t: undefined;\n\n\t\treturn {\n\t\t\thasVariations:\n\t\t\t\t!! __experimentalGetCurrentThemeGlobalStylesVariations()\n\t\t\t\t\t?.length,\n\t\t\tcanEditCSS: !! globalStyles?._links?.[ 'wp:action-edit-css' ],\n\t\t};\n\t}, [] );\n\n\treturn (\n\t\t<Card\n\t\t\tsize=\"small\"\n\t\t\tclassName=\"edit-site-global-styles-screen-root\"\n\t\t\tisRounded={ false }\n\t\t>\n\t\t\t<CardBody>\n\t\t\t\t<VStack spacing={ 4 }>\n\t\t\t\t\t<Card className=\"edit-site-global-styles-screen-root__active-style-tile\">\n\t\t\t\t\t\t<CardMedia className=\"edit-site-global-styles-screen-root__active-style-tile-preview\">\n\t\t\t\t\t\t\t<PreviewStyles />\n\t\t\t\t\t\t</CardMedia>\n\t\t\t\t\t</Card>\n\t\t\t\t\t{ hasVariations && (\n\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\tpath=\"/variations\"\n\t\t\t\t\t\t\t\taria-label={ __( 'Browse styles' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Browse styles' ) }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? chevronLeft : chevronRight\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</HStack>\n\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t) }\n\t\t\t\t\t<RootMenu />\n\t\t\t\t</VStack>\n\t\t\t</CardBody>\n\n\t\t\t<CardDivider />\n\n\t\t\t<CardBody>\n\t\t\t\t<Spacer\n\t\t\t\t\tas=\"p\"\n\t\t\t\t\tpaddingTop={ 2 }\n\t\t\t\t\t/\n\t\t\t\t\t * 13px matches the text inset of the NavigationButton (12px padding, plus the width of the button's border).\n\t\t\t\t\t * This is an ad hoc override for this instance and the Addtional CSS option below. Other options for matching the\n\t\t\t\t\t * the nav button inset should be looked at before reusing further.\n\t\t\t\t\t */\n\t\t\t\t\tpaddingX=\"13px\"\n\t\t\t\t\tmarginBottom={ 4 }\n\t\t\t\t>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'Customize the appearance of specific blocks for the whole site.'\n\t\t\t\t\t) }\n\t\t\t\t</Spacer>\n\t\t\t\t<ItemGroup>\n\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\tpath=\"/blocks\"\n\t\t\t\t\t\taria-label={ __( 'Blocks styles' ) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t<FlexItem>{ __( 'Blocks' ) }</FlexItem>\n\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\ticon={ isRTL() ? chevronLeft : chevronRight }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</HStack>\n\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t</ItemGroup>\n\t\t\t</CardBody>\n\n\t\t\t{ canEditCSS && !! customCSS && (\n\t\t\t\t<>\n\t\t\t\t\t<CardDivider />\n\t\t\t\t\t<CardBody>\n\t\t\t\t\t\t<Spacer\n\t\t\t\t\t\t\tas=\"p\"\n\t\t\t\t\t\t\tpaddingTop={ 2 }\n\t\t\t\t\t\t\tpaddingX=\"13px\"\n\t\t\t\t\t\t\tmarginBottom={ 4 }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t\t'Add your own CSS to customize the appearance and layout of your site.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Spacer>\n\t\t\t\t\t\t<ItemGroup>\n\t\t\t\t\t\t\t<NavigationButtonAsItem\n\t\t\t\t\t\t\t\tpath=\"/css\"\n\t\t\t\t\t\t\t\taria-label={ __( 'Additional CSS' ) }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<HStack justify=\"space-between\">\n\t\t\t\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t\t\t\t{ __( 'Additional CSS' ) }\n\t\t\t\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t\t\t\t\t<IconWithCurrentColor\n\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\tisRTL() ? chevronLeft : chevronRight\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</HStack>\n\t\t\t\t\t\t\t</NavigationButtonAsItem>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t</CardBody>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</Card>\n\t);\n}\n\nexport default ScreenRoot;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/global-styles/shadows-edit-panel.js CHANGED Viewed

@@ -6,10 +6,10 @@ import clsx from 'clsx';
 /**
  * WordPress dependencies
  */
-import { __experimentalHStack as HStack, __experimentalVStack as VStack, __experimentalSpacer as Spacer, __experimentalItemGroup as ItemGroup, __experimentalInputControl as InputControl, __experimentalUnitControl as UnitControl, __experimentalParseQuantityAndUnitFromRawValue as parseQuantityAndUnitFromRawValue, __experimentalGrid as Grid, __experimentalDropdownContentWrapper as DropdownContentWrapper, __experimentalUseNavigator as useNavigator, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, __experimentalConfirmDialog as ConfirmDialog, Dropdown, RangeControl, Button, Flex, FlexItem, ColorPalette, Modal, privateApis as componentsPrivateApis } from '@wordpress/components';
+import { __experimentalHStack as HStack, __experimentalVStack as VStack, __experimentalSpacer as Spacer, __experimentalItemGroup as ItemGroup, __experimentalInputControl as InputControl, __experimentalUnitControl as UnitControl, __experimentalGrid as Grid, __experimentalDropdownContentWrapper as DropdownContentWrapper, __experimentalUseNavigator as useNavigator, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, __experimentalConfirmDialog as ConfirmDialog, Dropdown, Button, Flex, FlexItem, ColorPalette, Modal, privateApis as componentsPrivateApis } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
 import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
-import { plus, shadow as shadowIcon, reset, settings, moreVertical } from '@wordpress/icons';
+import { plus, shadow as shadowIcon, reset, moreVertical } from '@wordpress/icons';
 import { useState, useMemo } from '@wordpress/element';
 /**
@@ -19,7 +19,7 @@ import { unlock } from '../../lock-unlock';
 import Subtitle from './subtitle';
 import ScreenHeader from './header';
 import { defaultShadow } from './shadows-panel';
-import { getShadowParts, shadowStringToObject, shadowObjectToString, CUSTOM_VALUE_SETTINGS } from './shadow-utils';
+import { getShadowParts, shadowStringToObject, shadowObjectToString } from './shadow-utils';
 import { jsx as _jsx } from "react/jsx-runtime";
 import { jsxs as _jsxs } from "react/jsx-runtime";
 import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -170,19 +170,15 @@ export default function ShadowsEditPanel() {
           justify: "flex-end",
           expanded: false,
           children: [/*#__PURE__*/_jsx(FlexItem, {
-            children: /*#__PURE__*/_jsx(Button
-            // TODO: Switch to `true` (40px size) if possible
-            , {
-              __next40pxDefaultSize: false,
+            children: /*#__PURE__*/_jsx(Button, {
+              __next40pxDefaultSize: true,
               variant: "tertiary",
               onClick: () => setIsRenameModalVisible(false),
               children: __('Cancel')
             })
           }), /*#__PURE__*/_jsx(FlexItem, {
-            children: /*#__PURE__*/_jsx(Button
-            // TODO: Switch to `true` (40px size) if possible
-            , {
-              __next40pxDefaultSize: false,
+            children: /*#__PURE__*/_jsx(Button, {
+              __next40pxDefaultSize: true,
               variant: "primary",
               type: "submit",
               children: __('Save')
@@ -310,19 +306,15 @@ function ShadowItem({
           style: {
             flexGrow: 1
           },
-          children: /*#__PURE__*/_jsx(Button
-          // TODO: Switch to `true` (40px size) if possible
-          , {
-            __next40pxDefaultSize: false,
+          children: /*#__PURE__*/_jsx(Button, {
+            __next40pxDefaultSize: true,
             icon: shadowIcon,
             ...toggleProps,
             children: shadowObj.inset ? __('Inner shadow') : __('Drop shadow')
           })
         }), canRemove && /*#__PURE__*/_jsx(FlexItem, {
-          children: /*#__PURE__*/_jsx(Button
-          // TODO: Switch to `true` (40px size) if possible
-          , {
-            __next40pxDefaultSize: false,
+          children: /*#__PURE__*/_jsx(Button, {
+            __next40pxDefaultSize: true,
             icon: reset,
             ...removeButtonProps
           })
@@ -381,12 +373,10 @@ function ShadowPopover({
       children: [/*#__PURE__*/_jsx(ShadowInputControl, {
         label: __('X Position'),
         value: shadowObj.x,
-        hasNegativeRange: true,
         onChange: value => onShadowChange('x', value)
       }), /*#__PURE__*/_jsx(ShadowInputControl, {
         label: __('Y Position'),
         value: shadowObj.y,
-        hasNegativeRange: true,
         onChange: value => onShadowChange('y', value)
       }), /*#__PURE__*/_jsx(ShadowInputControl, {
         label: __('Blur'),
@@ -395,7 +385,6 @@ function ShadowPopover({
       }), /*#__PURE__*/_jsx(ShadowInputControl, {
         label: __('Spread'),
         value: shadowObj.spread,
-        hasNegativeRange: true,
         onChange: value => onShadowChange('spread', value)
       })]
     })]
@@ -404,51 +393,18 @@ function ShadowPopover({
 function ShadowInputControl({
   label,
   value,
-  onChange,
-  hasNegativeRange
+  onChange
 }) {
-  var _CUSTOM_VALUE_SETTING, _CUSTOM_VALUE_SETTING2, _CUSTOM_VALUE_SETTING3;
-  const [isCustomInput, setIsCustomInput] = useState(false);
-  const [parsedQuantity, parsedUnit] = parseQuantityAndUnitFromRawValue(value);
-  const sliderOnChange = next => {
-    onChange(next !== undefined ? [next, parsedUnit || 'px'].join('') : '0px');
-  };
   const onValueChange = next => {
     const isNumeric = next !== undefined && !isNaN(parseFloat(next));
     const nextValue = isNumeric ? next : '0px';
     onChange(nextValue);
   };
-  return /*#__PURE__*/_jsxs(VStack, {
-    justify: "flex-start",
-    children: [/*#__PURE__*/_jsxs(HStack, {
-      justify: "space-between",
-      children: [/*#__PURE__*/_jsx(Subtitle, {
-        children: label
-      }), /*#__PURE__*/_jsx(Button, {
-        label: __('Use custom size'),
-        icon: settings,
-        onClick: () => {
-          setIsCustomInput(!isCustomInput);
-        },
-        isPressed: isCustomInput,
-        size: "small"
-      })]
-    }), isCustomInput ? /*#__PURE__*/_jsx(UnitControl, {
-      label: label,
-      hideLabelFromVision: true,
-      __next40pxDefaultSize: true,
-      value: value,
-      onChange: onValueChange
-    }) : /*#__PURE__*/_jsx(RangeControl, {
-      value: parsedQuantity !== null && parsedQuantity !== void 0 ? parsedQuantity : 0,
-      onChange: sliderOnChange,
-      withInputField: false,
-      __next40pxDefaultSize: true,
-      __nextHasNoMarginBottom: true,
-      min: hasNegativeRange ? -((_CUSTOM_VALUE_SETTING = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING !== void 0 ? _CUSTOM_VALUE_SETTING : 10) : 0,
-      max: (_CUSTOM_VALUE_SETTING2 = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.max) !== null && _CUSTOM_VALUE_SETTING2 !== void 0 ? _CUSTOM_VALUE_SETTING2 : 10,
-      step: (_CUSTOM_VALUE_SETTING3 = CUSTOM_VALUE_SETTINGS[parsedUnit !== null && parsedUnit !== void 0 ? parsedUnit : 'px']?.step) !== null && _CUSTOM_VALUE_SETTING3 !== void 0 ? _CUSTOM_VALUE_SETTING3 : 0.1
-    })]
+  return /*#__PURE__*/_jsx(UnitControl, {
+    label: label,
+    __next40pxDefaultSize: true,
+    value: value,
+    onChange: onValueChange
   });
 }
 //# sourceMappingURL=shadows-edit-panel.js.map