@wordpress/edit-site 6.0.0 → 6.0.2

package/build/components/global-styles/variations/variation.js

@@ -11,6 +11,7 @@ var _keycodes = require("@wordpress/keycodes");
 var _i18n = require("@wordpress/i18n");
 var _blockEditor = require("@wordpress/block-editor");
 var _editor = require("@wordpress/editor");
+var _useThemeStyleVariationsByProperty = require("../../../hooks/use-theme-style-variations/use-theme-style-variations-by-property");
 var _lockUnlock = require("../../../lock-unlock");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
@@ -35,7 +36,8 @@ const {
 function Variation({
   variation,
   children,
-  isPill
+  isPill,
+  property
 }) {
   const [isFocused, setIsFocused] = (0, _element.useState)(false);
   const {
@@ -44,25 +46,18 @@ function Variation({
     setUserConfig
   } = (0, _element.useContext)(GlobalStylesContext);
   const context = (0, _element.useMemo)(() => {
-    var _variation$settings, _variation$styles, _variation$_links;
+    let merged = mergeBaseAndUserConfigs(base, variation);
+    if (property) {
+      merged = (0, _useThemeStyleVariationsByProperty.filterObjectByProperty)(merged, property);
+    }
     return {
-      user: {
-        settings: (_variation$settings = variation.settings) !== null && _variation$settings !== void 0 ? _variation$settings : {},
-        styles: (_variation$styles = variation.styles) !== null && _variation$styles !== void 0 ? _variation$styles : {},
-        _links: (_variation$_links = variation._links) !== null && _variation$_links !== void 0 ? _variation$_links : {}
-      },
+      user: variation,
       base,
-      merged: mergeBaseAndUserConfigs(base, variation),
+      merged,
       setUserConfig: () => {}
     };
-  }, [variation, base]);
-  const selectVariation = () => {
-    setUserConfig(() => ({
-      settings: variation.settings,
-      styles: variation.styles,
-      _links: variation._links
-    }));
-  };
+  }, [variation, base, property]);
+  const selectVariation = () => setUserConfig(variation);
   const selectOnEnter = event => {
     if (event.keyCode === _keycodes.ENTER) {
       event.preventDefault();

package/build/components/global-styles/variations/variation.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_keycodes","_i18n","_blockEditor","_editor","_lockUnlock","_jsxRuntime","mergeBaseAndUserConfigs","unlock","editorPrivateApis","GlobalStylesContext","areGlobalStyleConfigsEqual","blockEditorPrivateApis","Variation","variation","children","isPill","isFocused","setIsFocused","useState","base","user","setUserConfig","useContext","context","useMemo","_variation$settings","_variation$styles","_variation$_links","settings","styles","_links","merged","selectVariation","selectOnEnter","event","keyCode","ENTER","preventDefault","isActive","label","title","description","sprintf","__","jsx","Provider","value","className","clsx","role","onClick","onKeyDown","tabIndex","onFocus","onBlur"],"sources":["@wordpress/edit-site/src/components/global-styles/variations/variation.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useContext, useState } from '@wordpress/element';\nimport { ENTER } from '@wordpress/keycodes';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { privateApis as editorPrivateApis } from '@wordpress/editor';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../../lock-unlock';\n\nconst { mergeBaseAndUserConfigs } = unlock( editorPrivateApis );\nconst { GlobalStylesContext, areGlobalStyleConfigsEqual } = unlock(\n\tblockEditorPrivateApis\n);\n\nexport default function Variation( { variation, children, isPill } ) {\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\tconst { base, user, setUserConfig } = useContext( GlobalStylesContext );\n\tconst context = useMemo(\n\t\t() => ( {\n\t\t\tuser: {\n\t\t\t\tsettings: variation.settings ?? {},\n\t\t\t\tstyles: variation.styles ?? {},\n\t\t\t\t_links: variation._links ?? {},\n\t\t\t},\n\t\t\tbase,\n\t\t\tmerged: mergeBaseAndUserConfigs( base, variation ),\n\t\t\tsetUserConfig: () => {},\n\t\t} ),\n\t\t[ variation, base ]\n\t);\n\n\tconst selectVariation = () => {\n\t\tsetUserConfig( () => ( {\n\t\t\tsettings: variation.settings,\n\t\t\tstyles: variation.styles,\n\t\t\t_links: variation._links,\n\t\t} ) );\n\t};\n\n\tconst selectOnEnter = ( event ) => {\n\t\tif ( event.keyCode === ENTER ) {\n\t\t\tevent.preventDefault();\n\t\t\tselectVariation();\n\t\t}\n\t};\n\n\tconst isActive = useMemo(\n\t\t() => areGlobalStyleConfigsEqual( user, variation ),\n\t\t[ user, variation ]\n\t);\n\n\tlet label = variation?.title;\n\tif ( variation?.description ) {\n\t\tlabel = sprintf(\n\t\t\t/* translators: %1$s: variation title. %2$s variation description. */\n\t\t\t__( '%1$s (%2$s)' ),\n\t\t\tvariation?.title,\n\t\t\tvariation?.description\n\t\t);\n\t}\n\n\treturn (\n\t\t<GlobalStylesContext.Provider value={ context }>\n\t\t\t<div\n\t\t\t\tclassName={ clsx( 'edit-site-global-styles-variations_item', {\n\t\t\t\t\t'is-active': isActive,\n\t\t\t\t} ) }\n\t\t\t\trole=\"button\"\n\t\t\t\tonClick={ selectVariation }\n\t\t\t\tonKeyDown={ selectOnEnter }\n\t\t\t\ttabIndex=\"0\"\n\t\t\t\taria-label={ label }\n\t\t\t\taria-current={ isActive }\n\t\t\t\tonFocus={ () => setIsFocused( true ) }\n\t\t\t\tonBlur={ () => setIsFocused( false ) }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'edit-site-global-styles-variations_item-preview',\n\t\t\t\t\t\t{ 'is-pill': isPill }\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ children( isFocused ) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</GlobalStylesContext.Provider>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_element","_keycodes","_i18n","_blockEditor","_editor","_useThemeStyleVariationsByProperty","_lockUnlock","_jsxRuntime","mergeBaseAndUserConfigs","unlock","editorPrivateApis","GlobalStylesContext","areGlobalStyleConfigsEqual","blockEditorPrivateApis","Variation","variation","children","isPill","property","isFocused","setIsFocused","useState","base","user","setUserConfig","useContext","context","useMemo","merged","filterObjectByProperty","selectVariation","selectOnEnter","event","keyCode","ENTER","preventDefault","isActive","label","title","description","sprintf","__","jsx","Provider","value","className","clsx","role","onClick","onKeyDown","tabIndex","onFocus","onBlur"],"sources":["@wordpress/edit-site/src/components/global-styles/variations/variation.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, useContext, useState } from '@wordpress/element';\nimport { ENTER } from '@wordpress/keycodes';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';\nimport { privateApis as editorPrivateApis } from '@wordpress/editor';\n\n/**\n * Internal dependencies\n */\nimport { filterObjectByProperty } from '../../../hooks/use-theme-style-variations/use-theme-style-variations-by-property';\nimport { unlock } from '../../../lock-unlock';\n\nconst { mergeBaseAndUserConfigs } = unlock( editorPrivateApis );\nconst { GlobalStylesContext, areGlobalStyleConfigsEqual } = unlock(\n\tblockEditorPrivateApis\n);\n\nexport default function Variation( { variation, children, isPill, property } ) {\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\tconst { base, user, setUserConfig } = useContext( GlobalStylesContext );\n\n\tconst context = useMemo( () => {\n\t\tlet merged = mergeBaseAndUserConfigs( base, variation );\n\t\tif ( property ) {\n\t\t\tmerged = filterObjectByProperty( merged, property );\n\t\t}\n\t\treturn {\n\t\t\tuser: variation,\n\t\t\tbase,\n\t\t\tmerged,\n\t\t\tsetUserConfig: () => {},\n\t\t};\n\t}, [ variation, base, property ] );\n\n\tconst selectVariation = () => setUserConfig( variation );\n\n\tconst selectOnEnter = ( event ) => {\n\t\tif ( event.keyCode === ENTER ) {\n\t\t\tevent.preventDefault();\n\t\t\tselectVariation();\n\t\t}\n\t};\n\n\tconst isActive = useMemo(\n\t\t() => areGlobalStyleConfigsEqual( user, variation ),\n\t\t[ user, variation ]\n\t);\n\n\tlet label = variation?.title;\n\tif ( variation?.description ) {\n\t\tlabel = sprintf(\n\t\t\t/* translators: %1$s: variation title. %2$s variation description. */\n\t\t\t__( '%1$s (%2$s)' ),\n\t\t\tvariation?.title,\n\t\t\tvariation?.description\n\t\t);\n\t}\n\n\treturn (\n\t\t<GlobalStylesContext.Provider value={ context }>\n\t\t\t<div\n\t\t\t\tclassName={ clsx( 'edit-site-global-styles-variations_item', {\n\t\t\t\t\t'is-active': isActive,\n\t\t\t\t} ) }\n\t\t\t\trole=\"button\"\n\t\t\t\tonClick={ selectVariation }\n\t\t\t\tonKeyDown={ selectOnEnter }\n\t\t\t\ttabIndex=\"0\"\n\t\t\t\taria-label={ label }\n\t\t\t\taria-current={ isActive }\n\t\t\t\tonFocus={ () => setIsFocused( true ) }\n\t\t\t\tonBlur={ () => setIsFocused( false ) }\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t'edit-site-global-styles-variations_item-preview',\n\t\t\t\t\t\t{ 'is-pill': isPill }\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ children( isFocused ) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</GlobalStylesContext.Provider>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/components/global-styles/variations/variations-color.js

@@ -34,11 +34,12 @@ function ColorVariations({
     children: [title && /*#__PURE__*/(0, _jsxRuntime.jsx)(_subtitle.default, {
       level: 3,
       children: title
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalVStack, {
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalGrid, {
       spacing: gap,
       children: colorVariations.map((variation, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_variation.default, {
         variation: variation,
         isPill: true,
+        property: "color",
         children: () => /*#__PURE__*/(0, _jsxRuntime.jsx)(_previewColors.default, {})
       }, index))
     })]

package/build/components/global-styles/variations/variations-color.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_previewColors","_interopRequireDefault","_hooks","_subtitle","_variation","_jsxRuntime","ColorVariations","title","gap","colorVariations","useColorVariations","length","jsxs","__experimentalVStack","spacing","children","jsx","default","level","map","variation","index","isPill"],"sources":["@wordpress/edit-site/src/components/global-styles/variations/variations-color.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __experimentalVStack as VStack } from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport StylesPreviewColors from '../preview-colors';\nimport { useColorVariations } from '../hooks';\nimport Subtitle from '../subtitle';\nimport Variation from './variation';\n\nexport default function ColorVariations( { title, gap = 2 } ) {\n\tconst colorVariations = useColorVariations();\n\n\t// Return null if there is only one variation (the default).\n\tif ( colorVariations?.length <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t{ title && <Subtitle level={ 3 }>{ title }</Subtitle> }\n\t\t\t<VStack spacing={ gap }>\n\t\t\t\t{ colorVariations.map( ( variation, index ) => (\n\t\t\t\t\t<Variation key={ index } variation={ variation } isPill>\n\t\t\t\t\t\t{ () => <StylesPreviewColors /> }\n\t\t\t\t\t</Variation>\n\t\t\t\t) ) }\n\t\t\t</VStack>\n\t\t</VStack>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAKA,IAAAC,cAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,SAAA,GAAAF,sBAAA,CAAAF,OAAA;AACA,IAAAK,UAAA,GAAAH,sBAAA,CAAAF,OAAA;AAAoC,IAAAM,WAAA,GAAAN,OAAA;AAXpC;AACA;AACA;;AAGA;AACA;AACA;;AAMe,SAASO,eAAeA,CAAE;EAAEC,KAAK;EAAEC,GAAG,GAAG;AAAE,CAAC,EAAG;EAC7D,MAAMC,eAAe,GAAG,IAAAC,yBAAkB,EAAC,CAAC;;EAE5C;EACA,IAAKD,eAAe,EAAEE,MAAM,IAAI,CAAC,EAAG;IACnC,OAAO,IAAI;EACZ;EAEA,oBACC,IAAAN,WAAA,CAAAO,IAAA,EAACd,WAAA,CAAAe,oBAAM;IAACC,OAAO,EAAG,CAAG;IAAAC,QAAA,GAClBR,KAAK,iBAAI,IAAAF,WAAA,CAAAW,GAAA,EAACb,SAAA,CAAAc,OAAQ;MAACC,KAAK,EAAG,CAAG;MAAAH,QAAA,EAAGR;IAAK,CAAY,CAAC,eACrD,IAAAF,WAAA,CAAAW,GAAA,EAAClB,WAAA,CAAAe,oBAAM;MAACC,OAAO,EAAGN,GAAK;MAAAO,QAAA,EACpBN,eAAe,CAACU,GAAG,CAAE,CAAEC,SAAS,EAAEC,KAAK,kBACxC,IAAAhB,WAAA,CAAAW,GAAA,EAACZ,UAAA,CAAAa,OAAS;QAAeG,SAAS,EAAGA,SAAW;QAACE,MAAM;QAAAP,QAAA,EACpDA,CAAA,kBAAM,IAAAV,WAAA,CAAAW,GAAA,EAAChB,cAAA,CAAAiB,OAAmB,IAAE;MAAC,GADfI,KAEN,CACV;IAAC,CACI,CAAC;EAAA,CACF,CAAC;AAEX","ignoreList":[]}
+{"version":3,"names":["_components","require","_previewColors","_interopRequireDefault","_hooks","_subtitle","_variation","_jsxRuntime","ColorVariations","title","gap","colorVariations","useColorVariations","length","jsxs","__experimentalVStack","spacing","children","jsx","default","level","__experimentalGrid","map","variation","index","isPill","property"],"sources":["@wordpress/edit-site/src/components/global-styles/variations/variations-color.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalGrid as Grid,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport StylesPreviewColors from '../preview-colors';\nimport { useColorVariations } from '../hooks';\nimport Subtitle from '../subtitle';\nimport Variation from './variation';\n\nexport default function ColorVariations( { title, gap = 2 } ) {\n\tconst colorVariations = useColorVariations();\n\n\t// Return null if there is only one variation (the default).\n\tif ( colorVariations?.length <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t{ title && <Subtitle level={ 3 }>{ title }</Subtitle> }\n\t\t\t<Grid spacing={ gap }>\n\t\t\t\t{ colorVariations.map( ( variation, index ) => (\n\t\t\t\t\t<Variation\n\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\tisPill\n\t\t\t\t\t\tproperty=\"color\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ () => <StylesPreviewColors /> }\n\t\t\t\t\t</Variation>\n\t\t\t\t) ) }\n\t\t\t</Grid>\n\t\t</VStack>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAQA,IAAAC,cAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,MAAA,GAAAH,OAAA;AACA,IAAAI,SAAA,GAAAF,sBAAA,CAAAF,OAAA;AACA,IAAAK,UAAA,GAAAH,sBAAA,CAAAF,OAAA;AAAoC,IAAAM,WAAA,GAAAN,OAAA;AAdpC;AACA;AACA;;AAMA;AACA;AACA;;AAMe,SAASO,eAAeA,CAAE;EAAEC,KAAK;EAAEC,GAAG,GAAG;AAAE,CAAC,EAAG;EAC7D,MAAMC,eAAe,GAAG,IAAAC,yBAAkB,EAAC,CAAC;;EAE5C;EACA,IAAKD,eAAe,EAAEE,MAAM,IAAI,CAAC,EAAG;IACnC,OAAO,IAAI;EACZ;EAEA,oBACC,IAAAN,WAAA,CAAAO,IAAA,EAACd,WAAA,CAAAe,oBAAM;IAACC,OAAO,EAAG,CAAG;IAAAC,QAAA,GAClBR,KAAK,iBAAI,IAAAF,WAAA,CAAAW,GAAA,EAACb,SAAA,CAAAc,OAAQ;MAACC,KAAK,EAAG,CAAG;MAAAH,QAAA,EAAGR;IAAK,CAAY,CAAC,eACrD,IAAAF,WAAA,CAAAW,GAAA,EAAClB,WAAA,CAAAqB,kBAAI;MAACL,OAAO,EAAGN,GAAK;MAAAO,QAAA,EAClBN,eAAe,CAACW,GAAG,CAAE,CAAEC,SAAS,EAAEC,KAAK,kBACxC,IAAAjB,WAAA,CAAAW,GAAA,EAACZ,UAAA,CAAAa,OAAS;QAETI,SAAS,EAAGA,SAAW;QACvBE,MAAM;QACNC,QAAQ,EAAC,OAAO;QAAAT,QAAA,EAEdA,CAAA,kBAAM,IAAAV,WAAA,CAAAW,GAAA,EAAChB,cAAA,CAAAiB,OAAmB,IAAE;MAAC,GALzBK,KAMI,CACV;IAAC,CACE,CAAC;EAAA,CACA,CAAC;AAEX","ignoreList":[]}

package/build/components/global-styles/variations/variations-typography.js

@@ -41,6 +41,7 @@ function TypographyVariations({
       className: "edit-site-global-styles-style-variations-container",
       children: typographyVariations && typographyVariations.length && typographyVariations.map((variation, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_variation.default, {
         variation: variation,
+        property: "typography",
         children: isFocused => /*#__PURE__*/(0, _jsxRuntime.jsx)(_previewIframe.default, {
           label: variation?.title,
           isFocused: isFocused,

package/build/components/global-styles/variations/variations-typography.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_hooks","_typographyExample","_interopRequireDefault","_previewIframe","_variation","_subtitle","_jsxRuntime","TypographyVariations","title","gap","typographyVariations","useTypographyVariations","length","jsxs","__experimentalVStack","spacing","children","jsx","default","level","__experimentalGrid","columns","className","map","variation","index","isFocused","label","ratio","key","justify","style","height","overflow","fontSize"],"sources":["@wordpress/edit-site/src/components/global-styles/variations/variations-typography.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalVStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useTypographyVariations } from '../hooks';\nimport TypographyExample from '../typography-example';\nimport PreviewIframe from '../preview-iframe';\nimport Variation from './variation';\nimport Subtitle from '../subtitle';\n\nexport default function TypographyVariations( { title, gap = 2 } ) {\n\tconst typographyVariations = useTypographyVariations();\n\n\t// Return null if there is only one variation (the default).\n\tif ( typographyVariations?.length <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t{ title && <Subtitle level={ 3 }>{ title }</Subtitle> }\n\t\t\t<Grid\n\t\t\t\tcolumns={ 3 }\n\t\t\t\tgap={ gap }\n\t\t\t\tclassName=\"edit-site-global-styles-style-variations-container\"\n\t\t\t>\n\t\t\t\t{ typographyVariations &&\n\t\t\t\t\ttypographyVariations.length &&\n\t\t\t\t\ttypographyVariations.map( ( variation, index ) => (\n\t\t\t\t\t\t<Variation key={ index } variation={ variation }>\n\t\t\t\t\t\t\t{ ( isFocused ) => (\n\t\t\t\t\t\t\t\t<PreviewIframe\n\t\t\t\t\t\t\t\t\tlabel={ variation?.title }\n\t\t\t\t\t\t\t\t\tisFocused={ isFocused }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ ( { ratio, key } ) => (\n\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\t\t\t\t\t\tjustify=\"center\"\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\toverflow: 'hidden',\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\t\t<TypographyExample\n\t\t\t\t\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t\t\t\t\t\tfontSize={ 85 * ratio }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</PreviewIframe>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Variation>\n\t\t\t\t\t) ) }\n\t\t\t</Grid>\n\t\t</VStack>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AASA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,kBAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,cAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,UAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,SAAA,GAAAH,sBAAA,CAAAH,OAAA;AAAmC,IAAAO,WAAA,GAAAP,OAAA;AAhBnC;AACA;AACA;;AAOA;AACA;AACA;;AAOe,SAASQ,oBAAoBA,CAAE;EAAEC,KAAK;EAAEC,GAAG,GAAG;AAAE,CAAC,EAAG;EAClE,MAAMC,oBAAoB,GAAG,IAAAC,8BAAuB,EAAC,CAAC;;EAEtD;EACA,IAAKD,oBAAoB,EAAEE,MAAM,IAAI,CAAC,EAAG;IACxC,OAAO,IAAI;EACZ;EAEA,oBACC,IAAAN,WAAA,CAAAO,IAAA,EAACf,WAAA,CAAAgB,oBAAM;IAACC,OAAO,EAAG,CAAG;IAAAC,QAAA,GAClBR,KAAK,iBAAI,IAAAF,WAAA,CAAAW,GAAA,EAACZ,SAAA,CAAAa,OAAQ;MAACC,KAAK,EAAG,CAAG;MAAAH,QAAA,EAAGR;IAAK,CAAY,CAAC,eACrD,IAAAF,WAAA,CAAAW,GAAA,EAACnB,WAAA,CAAAsB,kBAAI;MACJC,OAAO,EAAG,CAAG;MACbZ,GAAG,EAAGA,GAAK;MACXa,SAAS,EAAC,oDAAoD;MAAAN,QAAA,EAE5DN,oBAAoB,IACrBA,oBAAoB,CAACE,MAAM,IAC3BF,oBAAoB,CAACa,GAAG,CAAE,CAAEC,SAAS,EAAEC,KAAK,kBAC3C,IAAAnB,WAAA,CAAAW,GAAA,EAACb,UAAA,CAAAc,OAAS;QAAeM,SAAS,EAAGA,SAAW;QAAAR,QAAA,EAC3CU,SAAS,iBACZ,IAAApB,WAAA,CAAAW,GAAA,EAACd,cAAA,CAAAe,OAAa;UACbS,KAAK,EAAGH,SAAS,EAAEhB,KAAO;UAC1BkB,SAAS,EAAGA,SAAW;UAAAV,QAAA,EAErBA,CAAE;YAAEY,KAAK;YAAEC;UAAI,CAAC,kBACjB,IAAAvB,WAAA,CAAAW,GAAA,EAACnB,WAAA,CAAAgB,oBAAM;YAENC,OAAO,EAAG,EAAE,GAAGa,KAAO;YACtBE,OAAO,EAAC,QAAQ;YAChBC,KAAK,EAAG;cACPC,MAAM,EAAE,MAAM;cACdC,QAAQ,EAAE;YACX,CAAG;YAAAjB,QAAA,eAEH,IAAAV,WAAA,CAAAW,GAAA,EAAChB,kBAAA,CAAAiB,OAAiB;cACjBM,SAAS,EAAGA,SAAW;cACvBU,QAAQ,EAAG,EAAE,GAAGN;YAAO,CACvB;UAAC,GAXIC,GAYC;QACR,CACa;MACf,GAvBeJ,KAwBN,CACV;IAAC,CACC,CAAC;EAAA,CACA,CAAC;AAEX","ignoreList":[]}
+{"version":3,"names":["_components","require","_hooks","_typographyExample","_interopRequireDefault","_previewIframe","_variation","_subtitle","_jsxRuntime","TypographyVariations","title","gap","typographyVariations","useTypographyVariations","length","jsxs","__experimentalVStack","spacing","children","jsx","default","level","__experimentalGrid","columns","className","map","variation","index","property","isFocused","label","ratio","key","justify","style","height","overflow","fontSize"],"sources":["@wordpress/edit-site/src/components/global-styles/variations/variations-typography.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__experimentalGrid as Grid,\n\t__experimentalVStack as HStack,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport { useTypographyVariations } from '../hooks';\nimport TypographyExample from '../typography-example';\nimport PreviewIframe from '../preview-iframe';\nimport Variation from './variation';\nimport Subtitle from '../subtitle';\n\nexport default function TypographyVariations( { title, gap = 2 } ) {\n\tconst typographyVariations = useTypographyVariations();\n\n\t// Return null if there is only one variation (the default).\n\tif ( typographyVariations?.length <= 1 ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t{ title && <Subtitle level={ 3 }>{ title }</Subtitle> }\n\t\t\t<Grid\n\t\t\t\tcolumns={ 3 }\n\t\t\t\tgap={ gap }\n\t\t\t\tclassName=\"edit-site-global-styles-style-variations-container\"\n\t\t\t>\n\t\t\t\t{ typographyVariations &&\n\t\t\t\t\ttypographyVariations.length &&\n\t\t\t\t\ttypographyVariations.map( ( variation, index ) => (\n\t\t\t\t\t\t<Variation\n\t\t\t\t\t\t\tkey={ index }\n\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\tproperty=\"typography\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( isFocused ) => (\n\t\t\t\t\t\t\t\t<PreviewIframe\n\t\t\t\t\t\t\t\t\tlabel={ variation?.title }\n\t\t\t\t\t\t\t\t\tisFocused={ isFocused }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ ( { ratio, key } ) => (\n\t\t\t\t\t\t\t\t\t\t<HStack\n\t\t\t\t\t\t\t\t\t\t\tkey={ key }\n\t\t\t\t\t\t\t\t\t\t\tspacing={ 10 * ratio }\n\t\t\t\t\t\t\t\t\t\t\tjustify=\"center\"\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\toverflow: 'hidden',\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\t\t<TypographyExample\n\t\t\t\t\t\t\t\t\t\t\t\tvariation={ variation }\n\t\t\t\t\t\t\t\t\t\t\t\tfontSize={ 85 * ratio }\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t</PreviewIframe>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Variation>\n\t\t\t\t\t) ) }\n\t\t\t</Grid>\n\t\t</VStack>\n\t);\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AASA,IAAAC,MAAA,GAAAD,OAAA;AACA,IAAAE,kBAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,cAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,UAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,SAAA,GAAAH,sBAAA,CAAAH,OAAA;AAAmC,IAAAO,WAAA,GAAAP,OAAA;AAhBnC;AACA;AACA;;AAOA;AACA;AACA;;AAOe,SAASQ,oBAAoBA,CAAE;EAAEC,KAAK;EAAEC,GAAG,GAAG;AAAE,CAAC,EAAG;EAClE,MAAMC,oBAAoB,GAAG,IAAAC,8BAAuB,EAAC,CAAC;;EAEtD;EACA,IAAKD,oBAAoB,EAAEE,MAAM,IAAI,CAAC,EAAG;IACxC,OAAO,IAAI;EACZ;EAEA,oBACC,IAAAN,WAAA,CAAAO,IAAA,EAACf,WAAA,CAAAgB,oBAAM;IAACC,OAAO,EAAG,CAAG;IAAAC,QAAA,GAClBR,KAAK,iBAAI,IAAAF,WAAA,CAAAW,GAAA,EAACZ,SAAA,CAAAa,OAAQ;MAACC,KAAK,EAAG,CAAG;MAAAH,QAAA,EAAGR;IAAK,CAAY,CAAC,eACrD,IAAAF,WAAA,CAAAW,GAAA,EAACnB,WAAA,CAAAsB,kBAAI;MACJC,OAAO,EAAG,CAAG;MACbZ,GAAG,EAAGA,GAAK;MACXa,SAAS,EAAC,oDAAoD;MAAAN,QAAA,EAE5DN,oBAAoB,IACrBA,oBAAoB,CAACE,MAAM,IAC3BF,oBAAoB,CAACa,GAAG,CAAE,CAAEC,SAAS,EAAEC,KAAK,kBAC3C,IAAAnB,WAAA,CAAAW,GAAA,EAACb,UAAA,CAAAc,OAAS;QAETM,SAAS,EAAGA,SAAW;QACvBE,QAAQ,EAAC,YAAY;QAAAV,QAAA,EAEjBW,SAAS,iBACZ,IAAArB,WAAA,CAAAW,GAAA,EAACd,cAAA,CAAAe,OAAa;UACbU,KAAK,EAAGJ,SAAS,EAAEhB,KAAO;UAC1BmB,SAAS,EAAGA,SAAW;UAAAX,QAAA,EAErBA,CAAE;YAAEa,KAAK;YAAEC;UAAI,CAAC,kBACjB,IAAAxB,WAAA,CAAAW,GAAA,EAACnB,WAAA,CAAAgB,oBAAM;YAENC,OAAO,EAAG,EAAE,GAAGc,KAAO;YACtBE,OAAO,EAAC,QAAQ;YAChBC,KAAK,EAAG;cACPC,MAAM,EAAE,MAAM;cACdC,QAAQ,EAAE;YACX,CAAG;YAAAlB,QAAA,eAEH,IAAAV,WAAA,CAAAW,GAAA,EAAChB,kBAAA,CAAAiB,OAAiB;cACjBM,SAAS,EAAGA,SAAW;cACvBW,QAAQ,EAAG,EAAE,GAAGN;YAAO,CACvB;UAAC,GAXIC,GAYC;QACR,CACa;MACf,GA1BKL,KA2BI,CACV;IAAC,CACC,CAAC;EAAA,CACA,CAAC;AAEX","ignoreList":[]}

package/build/components/global-styles-sidebar/index.js

@@ -133,6 +133,7 @@ function GlobalStylesSidebar() {
           icon: _icons.seen,
           label: (0, _i18n.__)('Style Book'),
           isPressed: isStyleBookOpened || isRevisionsStyleBookOpened,
+          __experimentalIsFocusable: true,
           disabled: shouldClearCanvasContainerView,
           onClick: toggleStyleBook,
           size: "compact"
@@ -142,6 +143,7 @@ function GlobalStylesSidebar() {
           label: (0, _i18n.__)('Revisions'),
           icon: _icons.backup,
           onClick: toggleRevisions,
+          __experimentalIsFocusable: true,
           disabled: !hasRevisions,
           isPressed: isRevisionsOpened || isRevisionsStyleBookOpened,
           size: "compact"

package/build/components/global-styles-sidebar/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","_icons","_data","_element","_preferences","_editor","_globalStyles","_store","_ui","_lockUnlock","_coreData","_defaultSidebar","_interopRequireDefault","_jsxRuntime","interfaceStore","unlock","editorPrivateApis","GlobalStylesSidebar","shouldClearCanvasContainerView","isStyleBookOpened","showListViewByDefault","hasRevisions","isRevisionsOpened","isRevisionsStyleBookOpened","useSelect","select","getActiveComplementaryArea","getEditorCanvasContainerView","getCanvasMode","editSiteStore","canvasContainerView","_isVisualEditorMode","editorStore","getEditorMode","_isEditCanvasMode","_showListViewByDefault","preferencesStore","get","getEntityRecord","__experimentalGetCurrentGlobalStylesId","coreStore","globalStylesId","globalStyles","undefined","_links","count","setEditorCanvasContainerView","useDispatch","useEffect","setIsListViewOpened","goTo","useNavigator","toggleRevisions","toggleStyleBook","jsx","default","className","identifier","title","__","icon","styles","closeLabel","panelClassName","header","jsxs","Flex","gap","children","FlexBlock","style","minWidth","FlexItem","Button","seen","label","isPressed","disabled","onClick","size","backup","GlobalStylesMenuSlot","GlobalStylesUI"],"sources":["@wordpress/edit-site/src/components/global-styles-sidebar/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tFlexItem,\n\tFlexBlock,\n\tFlex,\n\tButton,\n\t__experimentalUseNavigator as useNavigator,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { styles, seen, backup } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tstore as editorStore,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\n\n/**\n * Internal dependencies\n */\nimport { GlobalStylesUI } from '../global-styles';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesMenuSlot } from '../global-styles/ui';\nimport { unlock } from '../../lock-unlock';\nimport { store as coreStore } from '@wordpress/core-data';\nimport DefaultSidebar from './default-sidebar';\n\nconst { interfaceStore } = unlock( editorPrivateApis );\n\nexport default function GlobalStylesSidebar() {\n\tconst {\n\t\tshouldClearCanvasContainerView,\n\t\tisStyleBookOpened,\n\t\tshowListViewByDefault,\n\t\thasRevisions,\n\t\tisRevisionsOpened,\n\t\tisRevisionsStyleBookOpened,\n\t} = useSelect( ( select ) => {\n\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\t\tconst { getEditorCanvasContainerView, getCanvasMode } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\t\tconst canvasContainerView = getEditorCanvasContainerView();\n\t\tconst _isVisualEditorMode =\n\t\t\t'visual' === select( editorStore ).getEditorMode();\n\t\tconst _isEditCanvasMode = 'edit' === getCanvasMode();\n\t\tconst _showListViewByDefault = select( preferencesStore ).get(\n\t\t\t'core',\n\t\t\t'showListViewByDefault'\n\t\t);\n\t\tconst { getEntityRecord, __experimentalGetCurrentGlobalStylesId } =\n\t\t\tselect( 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\tisStyleBookOpened: 'style-book' === canvasContainerView,\n\t\t\tshouldClearCanvasContainerView:\n\t\t\t\t'edit-site/global-styles' !==\n\t\t\t\t\tgetActiveComplementaryArea( 'core' ) ||\n\t\t\t\t! _isVisualEditorMode ||\n\t\t\t\t! _isEditCanvasMode,\n\t\t\tshowListViewByDefault: _showListViewByDefault,\n\t\t\thasRevisions:\n\t\t\t\t!! globalStyles?._links?.[ 'version-history' ]?.[ 0 ]?.count,\n\t\t\tisRevisionsStyleBookOpened:\n\t\t\t\t'global-styles-revisions:style-book' === canvasContainerView,\n\t\t\tisRevisionsOpened:\n\t\t\t\t'global-styles-revisions' === canvasContainerView,\n\t\t};\n\t}, [] );\n\tconst { setEditorCanvasContainerView } = unlock(\n\t\tuseDispatch( editSiteStore )\n\t);\n\n\tuseEffect( () => {\n\t\tif ( shouldClearCanvasContainerView ) {\n\t\t\tsetEditorCanvasContainerView( undefined );\n\t\t}\n\t}, [ shouldClearCanvasContainerView ] );\n\n\tconst { setIsListViewOpened } = useDispatch( editorStore );\n\tconst { goTo } = useNavigator();\n\n\tconst toggleRevisions = () => {\n\t\tsetIsListViewOpened( false );\n\t\tif ( isRevisionsStyleBookOpened ) {\n\t\t\tgoTo( '/' );\n\t\t\tsetEditorCanvasContainerView( 'style-book' );\n\t\t\treturn;\n\t\t}\n\t\tif ( isRevisionsOpened ) {\n\t\t\tgoTo( '/' );\n\t\t\tsetEditorCanvasContainerView( undefined );\n\t\t\treturn;\n\t\t}\n\t\tgoTo( '/revisions' );\n\n\t\tif ( isStyleBookOpened ) {\n\t\t\tsetEditorCanvasContainerView(\n\t\t\t\t'global-styles-revisions:style-book'\n\t\t\t);\n\t\t} else {\n\t\t\tsetEditorCanvasContainerView( 'global-styles-revisions' );\n\t\t}\n\t};\n\tconst toggleStyleBook = () => {\n\t\tif ( isRevisionsOpened ) {\n\t\t\tsetEditorCanvasContainerView(\n\t\t\t\t'global-styles-revisions:style-book'\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\t\tif ( isRevisionsStyleBookOpened ) {\n\t\t\tsetEditorCanvasContainerView( 'global-styles-revisions' );\n\t\t\treturn;\n\t\t}\n\t\tsetIsListViewOpened( isStyleBookOpened && showListViewByDefault );\n\t\tsetEditorCanvasContainerView(\n\t\t\tisStyleBookOpened ? undefined : 'style-book'\n\t\t);\n\t};\n\n\treturn (\n\t\t<DefaultSidebar\n\t\t\tclassName=\"edit-site-global-styles-sidebar\"\n\t\t\tidentifier=\"edit-site/global-styles\"\n\t\t\ttitle={ __( 'Styles' ) }\n\t\t\ticon={ styles }\n\t\t\tcloseLabel={ __( 'Close Styles' ) }\n\t\t\tpanelClassName=\"edit-site-global-styles-sidebar__panel\"\n\t\t\theader={\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"edit-site-global-styles-sidebar__header\"\n\t\t\t\t\tgap={ 1 }\n\t\t\t\t>\n\t\t\t\t\t<FlexBlock style={ { minWidth: 'min-content' } }>\n\t\t\t\t\t\t<h2 className=\"edit-site-global-styles-sidebar__header-title\">\n\t\t\t\t\t\t\t{ __( 'Styles' ) }\n\t\t\t\t\t\t</h2>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={ seen }\n\t\t\t\t\t\t\tlabel={ __( 'Style Book' ) }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisStyleBookOpened || isRevisionsStyleBookOpened\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tdisabled={ shouldClearCanvasContainerView }\n\t\t\t\t\t\t\tonClick={ toggleStyleBook }\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tlabel={ __( 'Revisions' ) }\n\t\t\t\t\t\t\ticon={ backup }\n\t\t\t\t\t\t\tonClick={ toggleRevisions }\n\t\t\t\t\t\t\tdisabled={ ! hasRevisions }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisRevisionsOpened || isRevisionsStyleBookOpened\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<GlobalStylesMenuSlot />\n\t\t\t\t</Flex>\n\t\t\t}\n\t\t>\n\t\t\t<GlobalStylesUI />\n\t\t</DefaultSidebar>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_components","require","_i18n","_icons","_data","_element","_preferences","_editor","_globalStyles","_store","_ui","_lockUnlock","_coreData","_defaultSidebar","_interopRequireDefault","_jsxRuntime","interfaceStore","unlock","editorPrivateApis","GlobalStylesSidebar","shouldClearCanvasContainerView","isStyleBookOpened","showListViewByDefault","hasRevisions","isRevisionsOpened","isRevisionsStyleBookOpened","useSelect","select","getActiveComplementaryArea","getEditorCanvasContainerView","getCanvasMode","editSiteStore","canvasContainerView","_isVisualEditorMode","editorStore","getEditorMode","_isEditCanvasMode","_showListViewByDefault","preferencesStore","get","getEntityRecord","__experimentalGetCurrentGlobalStylesId","coreStore","globalStylesId","globalStyles","undefined","_links","count","setEditorCanvasContainerView","useDispatch","useEffect","setIsListViewOpened","goTo","useNavigator","toggleRevisions","toggleStyleBook","jsx","default","className","identifier","title","__","icon","styles","closeLabel","panelClassName","header","jsxs","Flex","gap","children","FlexBlock","style","minWidth","FlexItem","Button","seen","label","isPressed","__experimentalIsFocusable","disabled","onClick","size","backup","GlobalStylesMenuSlot","GlobalStylesUI"],"sources":["@wordpress/edit-site/src/components/global-styles-sidebar/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tFlexItem,\n\tFlexBlock,\n\tFlex,\n\tButton,\n\t__experimentalUseNavigator as useNavigator,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { styles, seen, backup } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect } from '@wordpress/element';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tstore as editorStore,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\n\n/**\n * Internal dependencies\n */\nimport { GlobalStylesUI } from '../global-styles';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesMenuSlot } from '../global-styles/ui';\nimport { unlock } from '../../lock-unlock';\nimport { store as coreStore } from '@wordpress/core-data';\nimport DefaultSidebar from './default-sidebar';\n\nconst { interfaceStore } = unlock( editorPrivateApis );\n\nexport default function GlobalStylesSidebar() {\n\tconst {\n\t\tshouldClearCanvasContainerView,\n\t\tisStyleBookOpened,\n\t\tshowListViewByDefault,\n\t\thasRevisions,\n\t\tisRevisionsOpened,\n\t\tisRevisionsStyleBookOpened,\n\t} = useSelect( ( select ) => {\n\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\t\tconst { getEditorCanvasContainerView, getCanvasMode } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\t\tconst canvasContainerView = getEditorCanvasContainerView();\n\t\tconst _isVisualEditorMode =\n\t\t\t'visual' === select( editorStore ).getEditorMode();\n\t\tconst _isEditCanvasMode = 'edit' === getCanvasMode();\n\t\tconst _showListViewByDefault = select( preferencesStore ).get(\n\t\t\t'core',\n\t\t\t'showListViewByDefault'\n\t\t);\n\t\tconst { getEntityRecord, __experimentalGetCurrentGlobalStylesId } =\n\t\t\tselect( 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\tisStyleBookOpened: 'style-book' === canvasContainerView,\n\t\t\tshouldClearCanvasContainerView:\n\t\t\t\t'edit-site/global-styles' !==\n\t\t\t\t\tgetActiveComplementaryArea( 'core' ) ||\n\t\t\t\t! _isVisualEditorMode ||\n\t\t\t\t! _isEditCanvasMode,\n\t\t\tshowListViewByDefault: _showListViewByDefault,\n\t\t\thasRevisions:\n\t\t\t\t!! globalStyles?._links?.[ 'version-history' ]?.[ 0 ]?.count,\n\t\t\tisRevisionsStyleBookOpened:\n\t\t\t\t'global-styles-revisions:style-book' === canvasContainerView,\n\t\t\tisRevisionsOpened:\n\t\t\t\t'global-styles-revisions' === canvasContainerView,\n\t\t};\n\t}, [] );\n\tconst { setEditorCanvasContainerView } = unlock(\n\t\tuseDispatch( editSiteStore )\n\t);\n\n\tuseEffect( () => {\n\t\tif ( shouldClearCanvasContainerView ) {\n\t\t\tsetEditorCanvasContainerView( undefined );\n\t\t}\n\t}, [ shouldClearCanvasContainerView ] );\n\n\tconst { setIsListViewOpened } = useDispatch( editorStore );\n\tconst { goTo } = useNavigator();\n\n\tconst toggleRevisions = () => {\n\t\tsetIsListViewOpened( false );\n\t\tif ( isRevisionsStyleBookOpened ) {\n\t\t\tgoTo( '/' );\n\t\t\tsetEditorCanvasContainerView( 'style-book' );\n\t\t\treturn;\n\t\t}\n\t\tif ( isRevisionsOpened ) {\n\t\t\tgoTo( '/' );\n\t\t\tsetEditorCanvasContainerView( undefined );\n\t\t\treturn;\n\t\t}\n\t\tgoTo( '/revisions' );\n\n\t\tif ( isStyleBookOpened ) {\n\t\t\tsetEditorCanvasContainerView(\n\t\t\t\t'global-styles-revisions:style-book'\n\t\t\t);\n\t\t} else {\n\t\t\tsetEditorCanvasContainerView( 'global-styles-revisions' );\n\t\t}\n\t};\n\tconst toggleStyleBook = () => {\n\t\tif ( isRevisionsOpened ) {\n\t\t\tsetEditorCanvasContainerView(\n\t\t\t\t'global-styles-revisions:style-book'\n\t\t\t);\n\t\t\treturn;\n\t\t}\n\t\tif ( isRevisionsStyleBookOpened ) {\n\t\t\tsetEditorCanvasContainerView( 'global-styles-revisions' );\n\t\t\treturn;\n\t\t}\n\t\tsetIsListViewOpened( isStyleBookOpened && showListViewByDefault );\n\t\tsetEditorCanvasContainerView(\n\t\t\tisStyleBookOpened ? undefined : 'style-book'\n\t\t);\n\t};\n\n\treturn (\n\t\t<DefaultSidebar\n\t\t\tclassName=\"edit-site-global-styles-sidebar\"\n\t\t\tidentifier=\"edit-site/global-styles\"\n\t\t\ttitle={ __( 'Styles' ) }\n\t\t\ticon={ styles }\n\t\t\tcloseLabel={ __( 'Close Styles' ) }\n\t\t\tpanelClassName=\"edit-site-global-styles-sidebar__panel\"\n\t\t\theader={\n\t\t\t\t<Flex\n\t\t\t\t\tclassName=\"edit-site-global-styles-sidebar__header\"\n\t\t\t\t\tgap={ 1 }\n\t\t\t\t>\n\t\t\t\t\t<FlexBlock style={ { minWidth: 'min-content' } }>\n\t\t\t\t\t\t<h2 className=\"edit-site-global-styles-sidebar__header-title\">\n\t\t\t\t\t\t\t{ __( 'Styles' ) }\n\t\t\t\t\t\t</h2>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\ticon={ seen }\n\t\t\t\t\t\t\tlabel={ __( 'Style Book' ) }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisStyleBookOpened || isRevisionsStyleBookOpened\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\t\tdisabled={ shouldClearCanvasContainerView }\n\t\t\t\t\t\t\tonClick={ toggleStyleBook }\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tlabel={ __( 'Revisions' ) }\n\t\t\t\t\t\t\ticon={ backup }\n\t\t\t\t\t\t\tonClick={ toggleRevisions }\n\t\t\t\t\t\t\t__experimentalIsFocusable\n\t\t\t\t\t\t\tdisabled={ ! hasRevisions }\n\t\t\t\t\t\t\tisPressed={\n\t\t\t\t\t\t\t\tisRevisionsOpened || isRevisionsStyleBookOpened\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tsize=\"compact\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<GlobalStylesMenuSlot />\n\t\t\t\t</Flex>\n\t\t\t}\n\t\t>\n\t\t\t<GlobalStylesUI />\n\t\t</DefaultSidebar>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/components/layout/index.js

@@ -68,14 +68,14 @@ function Layout() {
   (0, _useEditModeCommands.useEditModeCommands)();
   (0, _useCommonCommands.useCommonCommands)();
   const isMobileViewport = (0, _compose.useViewportMatch)('medium', '<');
+  const toggleRef = (0, _element.useRef)();
   const {
     isDistractionFree,
     hasFixedToolbar,
     hasBlockSelected,
     canvasMode,
     previousShortcut,
-    nextShortcut,
-    hasBlockBreadcrumbs
+    nextShortcut
   } = (0, _data.useSelect)(select => {
     const {
       getAllShortcutKeyCombinations
@@ -89,7 +89,6 @@ function Layout() {
       nextShortcut: getAllShortcutKeyCombinations('core/editor/next-region'),
       hasFixedToolbar: select(_preferences.store).get('core', 'fixedToolbar'),
       isDistractionFree: select(_preferences.store).get('core', 'distractionFree'),
-      hasBlockBreadcrumbs: select(_preferences.store).get('core', 'showBlockBreadcrumbs'),
       hasBlockSelected: select(_blockEditor.store).getBlockSelectionStart()
     };
   }, []);
@@ -111,26 +110,6 @@ function Layout() {
     triggerAnimationOnChange: canvasMode + '__' + routeKey
   });
 
-  // This determines which animation variant should apply to the header.
-  // There is also a `isDistractionFreeHovering` state that gets priority
-  // when hovering the `edit-site-layout__header-container` in distraction
-  // free mode. It's set via framer and trickles down to all the children
-  // so they can use this variant state too.
-  //
-  // TODO: The issue with this is we want to have the hover state stick when hovering
-  // a popover opened via the header. We'll probably need to lift this state to
-  // handle it ourselves. Also, focusWithin the header needs to be handled.
-  let headerAnimationState;
-  if (canvasMode === 'view') {
-    // We need 'view' to always take priority so 'isDistractionFree'
-    // doesn't bleed over into the view (sidebar) state
-    headerAnimationState = 'view';
-  } else if (isDistractionFree) {
-    headerAnimationState = 'isDistractionFree';
-  } else {
-    headerAnimationState = canvasMode; // edit, view, init
-  }
-
   // Sets the right context for the command palette
   let commandContext = 'site-editor';
   if (canvasMode === 'edit') {
@@ -142,6 +121,14 @@ function Layout() {
   useCommandContext(commandContext);
   const [backgroundColor] = useGlobalStyle('color.background');
   const [gradientValue] = useGlobalStyle('color.gradient');
+  const previousCanvaMode = (0, _compose.usePrevious)(canvasMode);
+  (0, _element.useEffect)(() => {
+    if (previousCanvaMode === 'edit') {
+      toggleRef.current?.focus();
+    }
+    // Should not depend on the previous canvas mode value but the next.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [canvasMode]);
 
   // Synchronizing the URL with the store value of canvasMode happens in an effect
   // This condition ensures the component is only rendered after the synchronization happens
@@ -157,42 +144,9 @@ function Layout() {
         'is-distraction-free': isDistractionFree && canvasMode === 'edit',
         'is-full-canvas': canvasMode === 'edit',
         'has-fixed-toolbar': hasFixedToolbar,
-        'is-block-toolbar-visible': hasBlockSelected,
-        'has-block-breadcrumbs': hasBlockBreadcrumbs && !isDistractionFree && canvasMode === 'edit'
+        'is-block-toolbar-visible': hasBlockSelected
       }),
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__unstableMotion.div, {
-        className: "edit-site-layout__header-container",
-        variants: {
-          isDistractionFree: {
-            opacity: 0,
-            transition: {
-              type: 'tween',
-              delay: 0.8,
-              delayChildren: 0.8
-            } // How long to wait before the header exits
-          },
-          isDistractionFreeHovering: {
-            opacity: 1,
-            transition: {
-              type: 'tween',
-              delay: 0.2,
-              delayChildren: 0.2
-            } // How long to wait before the header shows
-          },
-          view: {
-            opacity: 1
-          },
-          edit: {
-            opacity: 1
-          }
-        },
-        whileHover: isDistractionFree ? 'isDistractionFreeHovering' : undefined,
-        animate: headerAnimationState,
-        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_siteHub.default, {
-          isTransparent: isResizableFrameOversized,
-          className: "edit-site-layout__hub"
-        })
-      }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
         className: "edit-site-layout__content",
         children: [(!isMobileViewport || !areas.mobile) && /*#__PURE__*/(0, _jsxRuntime.jsx)(NavigableRegion, {
           ariaLabel: (0, _i18n.__)('Navigation'),
@@ -216,7 +170,10 @@ function Layout() {
                 ease: 'easeOut'
               },
               className: "edit-site-layout__sidebar",
-              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebar.default, {
+              children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_siteHub.default, {
+                ref: toggleRef,
+                isTransparent: isResizableFrameOversized
+              }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_sidebar.default, {
                 routeKey: routeKey,
                 children: areas.sidebar
               }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_saveHub.default, {})]

package/build/components/layout/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_clsx","_interopRequireDefault","require","_data","_components","_compose","_i18n","_element","_keyboardShortcuts","_commands","_preferences","_blockEditor","_coreCommands","_editor","_errorBoundary","_store","_useInitEditedEntityFromUrl","_siteHub","_resizableFrame","_useSyncCanvasModeWithUrl","_lockUnlock","_savePanel","_register","_global","_useCommonCommands","_useEditModeCommands","_hooks","_router","_animation","_sidebar","_saveHub","_jsxRuntime","useCommands","unlock","coreCommandsPrivateApis","useCommandContext","commandsPrivateApis","useGlobalStyle","blockEditorPrivateApis","NavigableRegion","editorPrivateApis","ANIMATION_DURATION","Layout","useInitEditedEntityFromURL","useSyncCanvasModeWithURL","useEditModeCommands","useCommonCommands","isMobileViewport","useViewportMatch","isDistractionFree","hasFixedToolbar","hasBlockSelected","canvasMode","previousShortcut","nextShortcut","hasBlockBreadcrumbs","useSelect","select","getAllShortcutKeyCombinations","keyboardShortcutsStore","getCanvasMode","editSiteStore","preferencesStore","get","blockEditorStore","getBlockSelectionStart","navigateRegionsProps","useNavigateRegions","previous","next","disableMotion","useReducedMotion","canvasResizer","canvasSize","useResizeObserver","fullResizer","isEditorLoading","useIsSiteEditorLoading","isResizableFrameOversized","setIsResizableFrameOversized","useState","key","routeKey","areas","widths","useLayoutAreas","animationRef","useMovingAnimation","triggerAnimationOnChange","headerAnimationState","commandContext","backgroundColor","gradientValue","jsxs","Fragment","children","jsx","CommandMenu","default","ref","className","clsx","__unstableMotion","div","variants","opacity","transition","type","delay","delayChildren","isDistractionFreeHovering","view","edit","whileHover","undefined","animate","isTransparent","mobile","ariaLabel","__","__unstableAnimatePresence","initial","exit","duration","ease","sidebar","EditorSnackbars","content","style","maxWidth","preview","width","isReady","isFullWidth","defaultSize","height","isOversized","setIsOversized","innerContentStyle","background"],"sources":["@wordpress/edit-site/src/components/layout/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\nimport {\n\tCommandMenu,\n\tprivateApis as commandsPrivateApis,\n} from '@wordpress/commands';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { privateApis as coreCommandsPrivateApis } from '@wordpress/core-commands';\nimport {\n\tEditorSnackbars,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\n\n/**\n * Internal dependencies\n */\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\nimport SiteHub from '../site-hub';\nimport ResizableFrame from '../resizable-frame';\nimport useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url';\nimport { unlock } from '../../lock-unlock';\nimport SavePanel from '../save-panel';\nimport KeyboardShortcutsRegister from '../keyboard-shortcuts/register';\nimport KeyboardShortcutsGlobal from '../keyboard-shortcuts/global';\nimport { useCommonCommands } from '../../hooks/commands/use-common-commands';\nimport { useEditModeCommands } from '../../hooks/commands/use-edit-mode-commands';\nimport { useIsSiteEditorLoading } from './hooks';\nimport useLayoutAreas from './router';\nimport useMovingAnimation from './animation';\nimport SidebarContent from '../sidebar';\nimport SaveHub from '../save-hub';\n\nconst { useCommands } = unlock( coreCommandsPrivateApis );\nconst { useCommandContext } = unlock( commandsPrivateApis );\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\nconst { NavigableRegion } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\n\nexport default function Layout() {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\tuseSyncCanvasModeWithURL();\n\tuseCommands();\n\tuseEditModeCommands();\n\tuseCommonCommands();\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\n\tconst {\n\t\tisDistractionFree,\n\t\thasFixedToolbar,\n\t\thasBlockSelected,\n\t\tcanvasMode,\n\t\tpreviousShortcut,\n\t\tnextShortcut,\n\t\thasBlockBreadcrumbs,\n\t} = useSelect( ( select ) => {\n\t\tconst { getAllShortcutKeyCombinations } = select(\n\t\t\tkeyboardShortcutsStore\n\t\t);\n\t\tconst { getCanvasMode } = unlock( select( editSiteStore ) );\n\t\treturn {\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tpreviousShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/editor/previous-region'\n\t\t\t),\n\t\t\tnextShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/editor/next-region'\n\t\t\t),\n\t\t\thasFixedToolbar: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'fixedToolbar'\n\t\t\t),\n\t\t\tisDistractionFree: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'distractionFree'\n\t\t\t),\n\t\t\thasBlockBreadcrumbs: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'showBlockBreadcrumbs'\n\t\t\t),\n\t\t\thasBlockSelected:\n\t\t\t\tselect( blockEditorStore ).getBlockSelectionStart(),\n\t\t};\n\t}, [] );\n\tconst navigateRegionsProps = useNavigateRegions( {\n\t\tprevious: previousShortcut,\n\t\tnext: nextShortcut,\n\t} );\n\tconst disableMotion = useReducedMotion();\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer ] = useResizeObserver();\n\tconst isEditorLoading = useIsSiteEditorLoading();\n\tconst [ isResizableFrameOversized, setIsResizableFrameOversized ] =\n\t\tuseState( false );\n\tconst { key: routeKey, areas, widths } = useLayoutAreas();\n\tconst animationRef = useMovingAnimation( {\n\t\ttriggerAnimationOnChange: canvasMode + '__' + routeKey,\n\t} );\n\n\t// This determines which animation variant should apply to the header.\n\t// There is also a `isDistractionFreeHovering` state that gets priority\n\t// when hovering the `edit-site-layout__header-container` in distraction\n\t// free mode. It's set via framer and trickles down to all the children\n\t// so they can use this variant state too.\n\t//\n\t// TODO: The issue with this is we want to have the hover state stick when hovering\n\t// a popover opened via the header. We'll probably need to lift this state to\n\t// handle it ourselves. Also, focusWithin the header needs to be handled.\n\tlet headerAnimationState;\n\n\tif ( canvasMode === 'view' ) {\n\t\t// We need 'view' to always take priority so 'isDistractionFree'\n\t\t// doesn't bleed over into the view (sidebar) state\n\t\theaderAnimationState = 'view';\n\t} else if ( isDistractionFree ) {\n\t\theaderAnimationState = 'isDistractionFree';\n\t} else {\n\t\theaderAnimationState = canvasMode; // edit, view, init\n\t}\n\n\t// Sets the right context for the command palette\n\tlet commandContext = 'site-editor';\n\n\tif ( canvasMode === 'edit' ) {\n\t\tcommandContext = 'entity-edit';\n\t}\n\tif ( hasBlockSelected ) {\n\t\tcommandContext = 'block-selection-edit';\n\t}\n\tuseCommandContext( commandContext );\n\n\tconst [ backgroundColor ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\n\t// Synchronizing the URL with the store value of canvasMode happens in an effect\n\t// This condition ensures the component is only rendered after the synchronization happens\n\t// which prevents any animations due to potential canvasMode value change.\n\tif ( canvasMode === 'init' ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<CommandMenu />\n\t\t\t<KeyboardShortcutsRegister />\n\t\t\t<KeyboardShortcutsGlobal />\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-distraction-free':\n\t\t\t\t\t\t\tisDistractionFree && canvasMode === 'edit',\n\t\t\t\t\t\t'is-full-canvas': canvasMode === 'edit',\n\t\t\t\t\t\t'has-fixed-toolbar': hasFixedToolbar,\n\t\t\t\t\t\t'is-block-toolbar-visible': hasBlockSelected,\n\t\t\t\t\t\t'has-block-breadcrumbs':\n\t\t\t\t\t\t\thasBlockBreadcrumbs &&\n\t\t\t\t\t\t\t! isDistractionFree &&\n\t\t\t\t\t\t\tcanvasMode === 'edit',\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-layout__header-container\"\n\t\t\t\t\tvariants={ {\n\t\t\t\t\t\tisDistractionFree: {\n\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\tdelay: 0.8,\n\t\t\t\t\t\t\t\tdelayChildren: 0.8,\n\t\t\t\t\t\t\t}, // How long to wait before the header exits\n\t\t\t\t\t\t},\n\t\t\t\t\t\tisDistractionFreeHovering: {\n\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\tdelay: 0.2,\n\t\t\t\t\t\t\t\tdelayChildren: 0.2,\n\t\t\t\t\t\t\t}, // How long to wait before the header shows\n\t\t\t\t\t\t},\n\t\t\t\t\t\tview: { opacity: 1 },\n\t\t\t\t\t\tedit: { opacity: 1 },\n\t\t\t\t\t} }\n\t\t\t\t\twhileHover={\n\t\t\t\t\t\tisDistractionFree\n\t\t\t\t\t\t\t? 'isDistractionFreeHovering'\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tanimate={ headerAnimationState }\n\t\t\t\t>\n\t\t\t\t\t<SiteHub\n\t\t\t\t\t\tisTransparent={ isResizableFrameOversized }\n\t\t\t\t\t\tclassName=\"edit-site-layout__hub\"\n\t\t\t\t\t/>\n\t\t\t\t</motion.div>\n\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t{ /*\n\t\t\t\t\t\tThe NavigableRegion must always be rendered and not use\n\t\t\t\t\t\t`inert` otherwise `useNavigateRegions` will fail.\n\t\t\t\t\t*/ }\n\t\t\t\t\t{ ( ! isMobileViewport || ! areas.mobile ) && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tariaLabel={ __( 'Navigation' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar-region\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tinitial={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\tanimate={ { opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\texit={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\t\t// Disable transition in mobile to emulate a full page transition.\n\t\t\t\t\t\t\t\t\t\t\t\tdisableMotion ||\n\t\t\t\t\t\t\t\t\t\t\t\tisMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<SidebarContent routeKey={ routeKey }>\n\t\t\t\t\t\t\t\t\t\t\t{ areas.sidebar }\n\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t<SaveHub />\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<EditorSnackbars />\n\n\t\t\t\t\t{ isMobileViewport && areas.mobile && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__mobile\">\n\t\t\t\t\t\t\t{ areas.mobile }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport &&\n\t\t\t\t\t\tareas.content &&\n\t\t\t\t\t\tcanvasMode !== 'edit' && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\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{ areas.content }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.preview && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__canvas-container\">\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'edit-site-layout__canvas',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-right-aligned':\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized,\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\tref={ animationRef }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t<ResizableFrame\n\t\t\t\t\t\t\t\t\t\t\tisReady={ ! isEditorLoading }\n\t\t\t\t\t\t\t\t\t\t\tisFullWidth={\n\t\t\t\t\t\t\t\t\t\t\t\tcanvasMode === 'edit'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tdefaultSize={ {\n\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\tcanvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t\t24 /* $canvas-padding */,\n\t\t\t\t\t\t\t\t\t\t\t\theight: canvasSize.height,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\tisOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tsetIsOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tsetIsResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tinnerContentStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\tbackground:\n\t\t\t\t\t\t\t\t\t\t\t\t\tgradientValue ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor,\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\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t</ResizableFrame>\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\n\t\t\t\t<SavePanel />\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_clsx","_interopRequireDefault","require","_data","_components","_compose","_i18n","_element","_keyboardShortcuts","_commands","_preferences","_blockEditor","_coreCommands","_editor","_errorBoundary","_store","_useInitEditedEntityFromUrl","_siteHub","_resizableFrame","_useSyncCanvasModeWithUrl","_lockUnlock","_savePanel","_register","_global","_useCommonCommands","_useEditModeCommands","_hooks","_router","_animation","_sidebar","_saveHub","_jsxRuntime","useCommands","unlock","coreCommandsPrivateApis","useCommandContext","commandsPrivateApis","useGlobalStyle","blockEditorPrivateApis","NavigableRegion","editorPrivateApis","ANIMATION_DURATION","Layout","useInitEditedEntityFromURL","useSyncCanvasModeWithURL","useEditModeCommands","useCommonCommands","isMobileViewport","useViewportMatch","toggleRef","useRef","isDistractionFree","hasFixedToolbar","hasBlockSelected","canvasMode","previousShortcut","nextShortcut","useSelect","select","getAllShortcutKeyCombinations","keyboardShortcutsStore","getCanvasMode","editSiteStore","preferencesStore","get","blockEditorStore","getBlockSelectionStart","navigateRegionsProps","useNavigateRegions","previous","next","disableMotion","useReducedMotion","canvasResizer","canvasSize","useResizeObserver","fullResizer","isEditorLoading","useIsSiteEditorLoading","isResizableFrameOversized","setIsResizableFrameOversized","useState","key","routeKey","areas","widths","useLayoutAreas","animationRef","useMovingAnimation","triggerAnimationOnChange","commandContext","backgroundColor","gradientValue","previousCanvaMode","usePrevious","useEffect","current","focus","jsxs","Fragment","children","jsx","CommandMenu","default","ref","className","clsx","mobile","ariaLabel","__","__unstableAnimatePresence","__unstableMotion","div","initial","opacity","animate","exit","transition","type","duration","ease","isTransparent","sidebar","EditorSnackbars","content","style","maxWidth","preview","width","isReady","isFullWidth","defaultSize","height","isOversized","setIsOversized","innerContentStyle","background"],"sources":["@wordpress/edit-site/src/components/layout/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n\tusePrevious,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useRef, useEffect } from '@wordpress/element';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\nimport {\n\tCommandMenu,\n\tprivateApis as commandsPrivateApis,\n} from '@wordpress/commands';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { privateApis as coreCommandsPrivateApis } from '@wordpress/core-commands';\nimport {\n\tEditorSnackbars,\n\tprivateApis as editorPrivateApis,\n} from '@wordpress/editor';\n\n/**\n * Internal dependencies\n */\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\nimport SiteHub from '../site-hub';\nimport ResizableFrame from '../resizable-frame';\nimport useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url';\nimport { unlock } from '../../lock-unlock';\nimport SavePanel from '../save-panel';\nimport KeyboardShortcutsRegister from '../keyboard-shortcuts/register';\nimport KeyboardShortcutsGlobal from '../keyboard-shortcuts/global';\nimport { useCommonCommands } from '../../hooks/commands/use-common-commands';\nimport { useEditModeCommands } from '../../hooks/commands/use-edit-mode-commands';\nimport { useIsSiteEditorLoading } from './hooks';\nimport useLayoutAreas from './router';\nimport useMovingAnimation from './animation';\nimport SidebarContent from '../sidebar';\nimport SaveHub from '../save-hub';\n\nconst { useCommands } = unlock( coreCommandsPrivateApis );\nconst { useCommandContext } = unlock( commandsPrivateApis );\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\nconst { NavigableRegion } = unlock( editorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\n\nexport default function Layout() {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\tuseSyncCanvasModeWithURL();\n\tuseCommands();\n\tuseEditModeCommands();\n\tuseCommonCommands();\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst toggleRef = useRef();\n\tconst {\n\t\tisDistractionFree,\n\t\thasFixedToolbar,\n\t\thasBlockSelected,\n\t\tcanvasMode,\n\t\tpreviousShortcut,\n\t\tnextShortcut,\n\t} = useSelect( ( select ) => {\n\t\tconst { getAllShortcutKeyCombinations } = select(\n\t\t\tkeyboardShortcutsStore\n\t\t);\n\t\tconst { getCanvasMode } = unlock( select( editSiteStore ) );\n\t\treturn {\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tpreviousShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/editor/previous-region'\n\t\t\t),\n\t\t\tnextShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/editor/next-region'\n\t\t\t),\n\t\t\thasFixedToolbar: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'fixedToolbar'\n\t\t\t),\n\t\t\tisDistractionFree: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'distractionFree'\n\t\t\t),\n\t\t\thasBlockSelected:\n\t\t\t\tselect( blockEditorStore ).getBlockSelectionStart(),\n\t\t};\n\t}, [] );\n\tconst navigateRegionsProps = useNavigateRegions( {\n\t\tprevious: previousShortcut,\n\t\tnext: nextShortcut,\n\t} );\n\tconst disableMotion = useReducedMotion();\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer ] = useResizeObserver();\n\tconst isEditorLoading = useIsSiteEditorLoading();\n\tconst [ isResizableFrameOversized, setIsResizableFrameOversized ] =\n\t\tuseState( false );\n\tconst { key: routeKey, areas, widths } = useLayoutAreas();\n\tconst animationRef = useMovingAnimation( {\n\t\ttriggerAnimationOnChange: canvasMode + '__' + routeKey,\n\t} );\n\n\t// Sets the right context for the command palette\n\tlet commandContext = 'site-editor';\n\n\tif ( canvasMode === 'edit' ) {\n\t\tcommandContext = 'entity-edit';\n\t}\n\tif ( hasBlockSelected ) {\n\t\tcommandContext = 'block-selection-edit';\n\t}\n\tuseCommandContext( commandContext );\n\n\tconst [ backgroundColor ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\tconst previousCanvaMode = usePrevious( canvasMode );\n\tuseEffect( () => {\n\t\tif ( previousCanvaMode === 'edit' ) {\n\t\t\ttoggleRef.current?.focus();\n\t\t}\n\t\t// Should not depend on the previous canvas mode value but the next.\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [ canvasMode ] );\n\n\t// Synchronizing the URL with the store value of canvasMode happens in an effect\n\t// This condition ensures the component is only rendered after the synchronization happens\n\t// which prevents any animations due to potential canvasMode value change.\n\tif ( canvasMode === 'init' ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<CommandMenu />\n\t\t\t<KeyboardShortcutsRegister />\n\t\t\t<KeyboardShortcutsGlobal />\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-distraction-free':\n\t\t\t\t\t\t\tisDistractionFree && canvasMode === 'edit',\n\t\t\t\t\t\t'is-full-canvas': canvasMode === 'edit',\n\t\t\t\t\t\t'has-fixed-toolbar': hasFixedToolbar,\n\t\t\t\t\t\t'is-block-toolbar-visible': hasBlockSelected,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t{ /*\n\t\t\t\t\t\tThe NavigableRegion must always be rendered and not use\n\t\t\t\t\t\t`inert` otherwise `useNavigateRegions` will fail.\n\t\t\t\t\t*/ }\n\t\t\t\t\t{ ( ! isMobileViewport || ! areas.mobile ) && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tariaLabel={ __( 'Navigation' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar-region\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tinitial={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\tanimate={ { opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\texit={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\t\t// Disable transition in mobile to emulate a full page transition.\n\t\t\t\t\t\t\t\t\t\t\t\tdisableMotion ||\n\t\t\t\t\t\t\t\t\t\t\t\tisMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<SiteHub\n\t\t\t\t\t\t\t\t\t\t\tref={ toggleRef }\n\t\t\t\t\t\t\t\t\t\t\tisTransparent={\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\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\t<SidebarContent routeKey={ routeKey }>\n\t\t\t\t\t\t\t\t\t\t\t{ areas.sidebar }\n\t\t\t\t\t\t\t\t\t\t</SidebarContent>\n\t\t\t\t\t\t\t\t\t\t<SaveHub />\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<EditorSnackbars />\n\n\t\t\t\t\t{ isMobileViewport && areas.mobile && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__mobile\">\n\t\t\t\t\t\t\t{ areas.mobile }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport &&\n\t\t\t\t\t\tareas.content &&\n\t\t\t\t\t\tcanvasMode !== 'edit' && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\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{ areas.content }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.preview && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__canvas-container\">\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t\t\t'edit-site-layout__canvas',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-right-aligned':\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized,\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\tref={ animationRef }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t<ResizableFrame\n\t\t\t\t\t\t\t\t\t\t\tisReady={ ! isEditorLoading }\n\t\t\t\t\t\t\t\t\t\t\tisFullWidth={\n\t\t\t\t\t\t\t\t\t\t\t\tcanvasMode === 'edit'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tdefaultSize={ {\n\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\tcanvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t\t24 /* $canvas-padding */,\n\t\t\t\t\t\t\t\t\t\t\t\theight: canvasSize.height,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\tisOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tsetIsOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tsetIsResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tinnerContentStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\tbackground:\n\t\t\t\t\t\t\t\t\t\t\t\t\tgradientValue ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor,\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\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t</ResizableFrame>\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\n\t\t\t\t<SavePanel />\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build/components/page-patterns/index.js

@@ -73,11 +73,11 @@ const DEFAULT_VIEW = {
 };
 const SYNC_FILTERS = [{
   value: _constants.PATTERN_SYNC_TYPES.full,
-  label: (0, _i18n._x)('Synced', 'Option that shows all synchronized patterns'),
+  label: (0, _i18n._x)('Synced', 'pattern (singular)'),
   description: (0, _i18n.__)('Patterns that are kept in sync across the site.')
 }, {
   value: _constants.PATTERN_SYNC_TYPES.unsynced,
-  label: (0, _i18n._x)('Not synced', 'Option that shows all patterns that are not synchronized'),
+  label: (0, _i18n._x)('Not synced', 'pattern (singular)'),
   description: (0, _i18n.__)('Patterns that can be changed freely without affecting the site.')
 }];
 function PreviewWrapper({
@@ -281,11 +281,11 @@ function DataviewsPatterns() {
           // Non-user patterns are all unsynced for the time being.
           return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
             className: `edit-site-patterns__field-sync-status-${item.syncStatus}`,
-            children: SYNC_FILTERS.find(({
+            children: (SYNC_FILTERS.find(({
               value
-            }) => value === item.syncStatus)?.label || SYNC_FILTERS.find(({
+            }) => value === item.syncStatus) || SYNC_FILTERS.find(({
               value
-            }) => value === _constants.PATTERN_SYNC_TYPES.unsynced).label
+            }) => value === _constants.PATTERN_SYNC_TYPES.unsynced)).label
           });
         },
         elements: SYNC_FILTERS,