@wordpress/edit-site 6.10.0 → 6.12.0

package/build-module/components/style-book/index.js

@@ -7,12 +7,12 @@ import clsx from 'clsx';
  * WordPress dependencies
  */
 import { Disabled, Composite, privateApis as componentsPrivateApis } from '@wordpress/components';
-import { __, sprintf } from '@wordpress/i18n';
-import { BlockList, privateApis as blockEditorPrivateApis, store as blockEditorStore, __unstableEditorStyles as EditorStyles, __unstableIframe as Iframe } from '@wordpress/block-editor';
+import { __, _x, sprintf } from '@wordpress/i18n';
+import { BlockList, privateApis as blockEditorPrivateApis, store as blockEditorStore, useSettings, __unstableEditorStyles as EditorStyles, __unstableIframe as Iframe, __experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients } from '@wordpress/block-editor';
 import { privateApis as editorPrivateApis } from '@wordpress/editor';
 import { useSelect } from '@wordpress/data';
 import { useResizeObserver } from '@wordpress/compose';
-import { useMemo, useState, memo, useContext } from '@wordpress/element';
+import { useMemo, useState, memo, useContext, useRef, useLayoutEffect } from '@wordpress/element';
 import { ENTER, SPACE } from '@wordpress/keycodes';
 
 /**
@@ -39,6 +39,91 @@ const {
 function isObjectEmpty(object) {
   return !object || Object.keys(object).length === 0;
 }
+
+/**
+ * Scrolls to a section within an iframe.
+ *
+ * @param {string}            anchorId The id of the element to scroll to.
+ * @param {HTMLIFrameElement} iframe   The target iframe.
+ */
+const scrollToSection = (anchorId, iframe) => {
+  if (!iframe || !iframe?.contentDocument) {
+    return;
+  }
+  const element = iframe.contentDocument.getElementById(anchorId);
+  if (element) {
+    element.scrollIntoView({
+      behavior: 'smooth'
+    });
+  }
+};
+
+/**
+ * Parses a Block Editor navigation path to extract the block name and
+ * build a style book navigation path. The object can be extended to include a category,
+ * representing a style book tab/section.
+ *
+ * @param {string} path An internal Block Editor navigation path.
+ * @return {null|{block: string}} An object containing the example to navigate to.
+ */
+const getStyleBookNavigationFromPath = path => {
+  if (path && typeof path === 'string') {
+    let block = path.includes('/blocks/') ? decodeURIComponent(path.split('/blocks/')[1]) : null;
+    // Default to theme-colors if the path ends with /colors.
+    block = path.endsWith('/colors') ? 'theme-colors' : block;
+    return {
+      block
+    };
+  }
+  return null;
+};
+
+/**
+ * Retrieves colors, gradients, and duotone filters from Global Styles.
+ * The inclusion of default (Core) palettes is controlled by the relevant
+ * theme.json property e.g. defaultPalette, defaultGradients, defaultDuotone.
+ *
+ * @return {Object} Object containing properties for each type of palette.
+ */
+function useMultiOriginPalettes() {
+  const {
+    colors,
+    gradients
+  } = useMultipleOriginColorsAndGradients();
+
+  // Add duotone filters to the palettes data.
+  const [shouldDisplayDefaultDuotones, customDuotones, themeDuotones, defaultDuotones] = useSettings('color.defaultDuotone', 'color.duotone.custom', 'color.duotone.theme', 'color.duotone.default');
+  const palettes = useMemo(() => {
+    const result = {
+      colors,
+      gradients,
+      duotones: []
+    };
+    if (themeDuotones && themeDuotones.length) {
+      result.duotones.push({
+        name: _x('Theme', 'Indicates these duotone filters come from the theme.'),
+        slug: 'theme',
+        duotones: themeDuotones
+      });
+    }
+    if (shouldDisplayDefaultDuotones && defaultDuotones && defaultDuotones.length) {
+      result.duotones.push({
+        name: _x('Default', 'Indicates these duotone filters come from WordPress.'),
+        slug: 'default',
+        duotones: defaultDuotones
+      });
+    }
+    if (customDuotones && customDuotones.length) {
+      result.duotones.push({
+        name: _x('Custom', 'Indicates these doutone filters are created by the user.'),
+        slug: 'custom',
+        duotones: customDuotones
+      });
+    }
+    return result;
+  }, [colors, gradients, customDuotones, themeDuotones, defaultDuotones, shouldDisplayDefaultDuotones]);
+  return palettes;
+}
 function StyleBook({
   enableResizing = true,
   isSelected,
@@ -47,16 +132,28 @@ function StyleBook({
   showCloseButton = true,
   onClose,
   showTabs = true,
-  userConfig = {}
+  userConfig = {},
+  path = ''
 }) {
   const [resizeObserver, sizes] = useResizeObserver();
   const [textColor] = useGlobalStyle('color.text');
   const [backgroundColor] = useGlobalStyle('color.background');
-  const [examples] = useState(getExamples);
+  const colors = useMultiOriginPalettes();
+  const examples = useMemo(() => getExamples(colors), [colors]);
   const tabs = useMemo(() => getTopLevelStyleBookCategories().filter(category => examples.some(example => example.category === category.slug)), [examples]);
+  const examplesForSinglePageUse = [];
+  const overviewCategoryExamples = getExamplesByCategory({
+    slug: 'overview'
+  }, examples);
+  examplesForSinglePageUse.push(...overviewCategoryExamples.examples);
+  const otherExamples = examples.filter(example => {
+    return example.category !== 'overview' && !overviewCategoryExamples.examples.find(overviewExample => overviewExample.name === example.name);
+  });
+  examplesForSinglePageUse.push(...otherExamples);
   const {
     base: baseConfig
   } = useContext(GlobalStylesContext);
+  const goTo = getStyleBookNavigationFromPath(path);
   const mergedConfig = useMemo(() => {
     if (!isObjectEmpty(userConfig) && !isObjectEmpty(baseConfig)) {
       return mergeBaseAndUserConfigs(baseConfig, userConfig);
@@ -67,12 +164,12 @@ function StyleBook({
   // Copied from packages/edit-site/src/components/revisions/index.js
   // could we create a shared hook?
   const originalSettings = useSelect(select => select(blockEditorStore).getSettings(), []);
+  const [globalStyles] = useGlobalStylesOutputWithConfig(mergedConfig);
   const settings = useMemo(() => ({
     ...originalSettings,
-    __unstableIsPreviewMode: true
-  }), [originalSettings]);
-  const [globalStyles] = useGlobalStylesOutputWithConfig(mergedConfig);
-  settings.styles = !isObjectEmpty(globalStyles) && !isObjectEmpty(userConfig) ? globalStyles : settings.styles;
+    styles: !isObjectEmpty(globalStyles) && !isObjectEmpty(userConfig) ? globalStyles : originalSettings.styles,
+    isPreviewMode: true
+  }), [globalStyles, originalSettings, userConfig]);
   return /*#__PURE__*/_jsx(EditorCanvasContainer, {
     onClose: onClose,
     enableResizing: enableResizing,
@@ -86,38 +183,38 @@ function StyleBook({
         color: textColor,
         background: backgroundColor
       },
-      children: [resizeObserver, showTabs ? /*#__PURE__*/_jsx("div", {
-        className: "edit-site-style-book__tabs",
-        children: /*#__PURE__*/_jsxs(Tabs, {
-          children: [/*#__PURE__*/_jsx("div", {
-            className: "edit-site-style-book__tablist-container",
-            children: /*#__PURE__*/_jsx(Tabs.TabList, {
-              children: tabs.map(tab => /*#__PURE__*/_jsx(Tabs.Tab, {
-                tabId: tab.slug,
-                children: tab.title
-              }, tab.slug))
-            })
-          }), tabs.map(tab => /*#__PURE__*/_jsx(Tabs.TabPanel, {
-            tabId: tab.slug,
-            focusable: false,
-            children: /*#__PURE__*/_jsx(StyleBookBody, {
-              category: tab.slug,
-              examples: examples,
-              isSelected: isSelected,
-              onSelect: onSelect,
-              settings: settings,
-              sizes: sizes,
-              title: tab.title
-            })
-          }, tab.slug))]
-        })
+      children: [resizeObserver, showTabs ? /*#__PURE__*/_jsxs(Tabs, {
+        children: [/*#__PURE__*/_jsx("div", {
+          className: "edit-site-style-book__tablist-container",
+          children: /*#__PURE__*/_jsx(Tabs.TabList, {
+            children: tabs.map(tab => /*#__PURE__*/_jsx(Tabs.Tab, {
+              tabId: tab.slug,
+              children: tab.title
+            }, tab.slug))
+          })
+        }), tabs.map(tab => /*#__PURE__*/_jsx(Tabs.TabPanel, {
+          tabId: tab.slug,
+          focusable: false,
+          className: "edit-site-style-book__tabpanel",
+          children: /*#__PURE__*/_jsx(StyleBookBody, {
+            category: tab.slug,
+            examples: examples,
+            isSelected: isSelected,
+            onSelect: onSelect,
+            settings: settings,
+            sizes: sizes,
+            title: tab.title,
+            goTo: goTo
+          })
+        }, tab.slug))]
       }) : /*#__PURE__*/_jsx(StyleBookBody, {
-        examples: examples,
+        examples: examplesForSinglePageUse,
         isSelected: isSelected,
         onClick: onClick,
         onSelect: onSelect,
         settings: settings,
-        sizes: sizes
+        sizes: sizes,
+        goTo: goTo
       })]
     })
   });
@@ -130,10 +227,12 @@ const StyleBookBody = ({
   onSelect,
   settings,
   sizes,
-  title
+  title,
+  goTo
 }) => {
   const [isFocused, setIsFocused] = useState(false);
-
+  const [hasIframeLoaded, setHasIframeLoaded] = useState(false);
+  const iframeRef = useRef(null);
   // The presence of an `onClick` prop indicates that the Style Book is being used as a button.
   // In this case, add additional props to the iframe to make it behave like a button.
   const buttonModeProps = {
@@ -163,7 +262,15 @@ const StyleBookBody = ({
     },
     readonly: true
   };
+  const handleLoad = () => setHasIframeLoaded(true);
+  useLayoutEffect(() => {
+    if (goTo?.block && hasIframeLoaded && iframeRef?.current) {
+      scrollToSection(`example-${goTo?.block}`, iframeRef?.current);
+    }
+  }, [iframeRef?.current, goTo?.block, scrollToSection, hasIframeLoaded]);
   return /*#__PURE__*/_jsxs(Iframe, {
+    onLoad: handleLoad,
+    ref: iframeRef,
     className: clsx('edit-site-style-book__iframe', {
       'is-focused': isFocused && !!onClick,
       'is-button': !!onClick
@@ -209,11 +316,10 @@ const Examples = memo(({
     children: [!!filteredExamples?.examples?.length && filteredExamples.examples.map(example => /*#__PURE__*/_jsx(Example, {
       id: `example-${example.name}`,
       title: example.title,
+      content: example.content,
       blocks: example.blocks,
-      isSelected: isSelected(example.name),
-      onClick: () => {
-        onSelect?.(example.name);
-      }
+      isSelected: isSelected?.(example.name),
+      onClick: () => onSelect?.(example.name)
     }, example.name)), !!filteredExamples?.subcategories?.length && filteredExamples.subcategories.map(subcategory => /*#__PURE__*/_jsxs(Composite.Group, {
       className: "edit-site-style-book__subcategory",
       children: [/*#__PURE__*/_jsx(Composite.GroupLabel, {
@@ -237,37 +343,45 @@ const Subcategory = ({
   return !!examples?.length && examples.map(example => /*#__PURE__*/_jsx(Example, {
     id: `example-${example.name}`,
     title: example.title,
+    content: example.content,
     blocks: example.blocks,
-    isSelected: isSelected(example.name),
+    isSelected: isSelected?.(example.name),
     onClick: () => {
       onSelect?.(example.name);
     }
   }, example.name));
 };
+const disabledExamples = ['example-duotones'];
 const Example = ({
   id,
   title,
   blocks,
   isSelected,
-  onClick
+  onClick,
+  content
 }) => {
   const originalSettings = useSelect(select => select(blockEditorStore).getSettings(), []);
   const settings = useMemo(() => ({
     ...originalSettings,
     focusMode: false,
     // Disable "Spotlight mode".
-    __unstableIsPreviewMode: true
+    isPreviewMode: true
   }), [originalSettings]);
 
   // Cache the list of blocks to avoid additional processing when the component is re-rendered.
   const renderedBlocks = useMemo(() => Array.isArray(blocks) ? blocks : [blocks], [blocks]);
+  const disabledProps = disabledExamples.includes(id) ? {
+    disabled: true,
+    accessibleWhenDisabled: true
+  } : {};
   return /*#__PURE__*/_jsx("div", {
     role: "row",
     children: /*#__PURE__*/_jsx("div", {
       role: "gridcell",
       children: /*#__PURE__*/_jsxs(Composite.Item, {
         className: clsx('edit-site-style-book__example', {
-          'is-selected': isSelected
+          'is-selected': isSelected,
+          'is-disabled-example': !!disabledProps?.disabled
         }),
         id: id,
         "aria-label": sprintf(
@@ -276,6 +390,7 @@ const Example = ({
         render: /*#__PURE__*/_jsx("div", {}),
         role: "button",
         onClick: onClick,
+        ...disabledProps,
         children: [/*#__PURE__*/_jsx("span", {
           className: "edit-site-style-book__example-title",
           children: title
@@ -284,12 +399,12 @@ const Example = ({
           "aria-hidden": true,
           children: /*#__PURE__*/_jsx(Disabled, {
             className: "edit-site-style-book__example-preview__content",
-            children: /*#__PURE__*/_jsx(ExperimentalBlockEditorProvider, {
+            children: content ? content : /*#__PURE__*/_jsxs(ExperimentalBlockEditorProvider, {
               value: renderedBlocks,
               settings: settings,
-              children: /*#__PURE__*/_jsx(BlockList, {
+              children: [/*#__PURE__*/_jsx(EditorStyles, {}), /*#__PURE__*/_jsx(BlockList, {
                 renderAppender: false
-              })
+              })]
             })
           })
         })]

package/build-module/components/style-book/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["clsx","Disabled","Composite","privateApis","componentsPrivateApis","__","sprintf","BlockList","blockEditorPrivateApis","store","blockEditorStore","__unstableEditorStyles","EditorStyles","__unstableIframe","Iframe","editorPrivateApis","useSelect","useResizeObserver","useMemo","useState","memo","useContext","ENTER","SPACE","unlock","EditorCanvasContainer","STYLE_BOOK_IFRAME_STYLES","getExamplesByCategory","getTopLevelStyleBookCategories","getExamples","jsx","_jsx","jsxs","_jsxs","ExperimentalBlockEditorProvider","useGlobalStyle","GlobalStylesContext","useGlobalStylesOutputWithConfig","mergeBaseAndUserConfigs","Tabs","isObjectEmpty","object","Object","keys","length","StyleBook","enableResizing","isSelected","onClick","onSelect","showCloseButton","onClose","showTabs","userConfig","resizeObserver","sizes","textColor","backgroundColor","examples","tabs","filter","category","some","example","slug","base","baseConfig","mergedConfig","originalSettings","select","getSettings","settings","__unstableIsPreviewMode","globalStyles","styles","closeButtonLabel","children","className","width","style","color","background","TabList","map","tab","Tab","tabId","title","TabPanel","focusable","StyleBookBody","isFocused","setIsFocused","buttonModeProps","role","onFocus","onBlur","onKeyDown","event","defaultPrevented","keyCode","preventDefault","readonly","name","tabIndex","Examples","label","categoryDefinition","find","_category","filteredExamples","orientation","Example","id","blocks","subcategories","subcategory","Group","GroupLabel","Subcategory","focusMode","renderedBlocks","Array","isArray","Item","render","value","renderAppender"],"sources":["@wordpress/edit-site/src/components/style-book/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tDisabled,\n\tComposite,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport {\n\tBlockList,\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n\t__unstableEditorStyles as EditorStyles,\n\t__unstableIframe as Iframe,\n} from '@wordpress/block-editor';\nimport { privateApis as editorPrivateApis } from '@wordpress/editor';\nimport { useSelect } from '@wordpress/data';\nimport { useResizeObserver } from '@wordpress/compose';\nimport { useMemo, useState, memo, useContext } from '@wordpress/element';\nimport { ENTER, SPACE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport EditorCanvasContainer from '../editor-canvas-container';\nimport { STYLE_BOOK_IFRAME_STYLES } from './constants';\nimport {\n\tgetExamplesByCategory,\n\tgetTopLevelStyleBookCategories,\n} from './categories';\nimport { getExamples } from './examples';\n\nconst {\n\tExperimentalBlockEditorProvider,\n\tuseGlobalStyle,\n\tGlobalStylesContext,\n\tuseGlobalStylesOutputWithConfig,\n} = unlock( blockEditorPrivateApis );\nconst { mergeBaseAndUserConfigs } = unlock( editorPrivateApis );\n\nconst { Tabs } = unlock( componentsPrivateApis );\n\nfunction isObjectEmpty( object ) {\n\treturn ! object || Object.keys( object ).length === 0;\n}\n\nfunction StyleBook( {\n\tenableResizing = true,\n\tisSelected,\n\tonClick,\n\tonSelect,\n\tshowCloseButton = true,\n\tonClose,\n\tshowTabs = true,\n\tuserConfig = {},\n} ) {\n\tconst [ resizeObserver, sizes ] = useResizeObserver();\n\tconst [ textColor ] = useGlobalStyle( 'color.text' );\n\tconst [ backgroundColor ] = useGlobalStyle( 'color.background' );\n\tconst [ examples ] = useState( getExamples );\n\tconst tabs = useMemo(\n\t\t() =>\n\t\t\tgetTopLevelStyleBookCategories().filter( ( category ) =>\n\t\t\t\texamples.some(\n\t\t\t\t\t( example ) => example.category === category.slug\n\t\t\t\t)\n\t\t\t),\n\t\t[ examples ]\n\t);\n\tconst { base: baseConfig } = useContext( GlobalStylesContext );\n\n\tconst mergedConfig = useMemo( () => {\n\t\tif ( ! isObjectEmpty( userConfig ) && ! isObjectEmpty( baseConfig ) ) {\n\t\t\treturn mergeBaseAndUserConfigs( baseConfig, userConfig );\n\t\t}\n\t\treturn {};\n\t}, [ baseConfig, userConfig ] );\n\n\t// Copied from packages/edit-site/src/components/revisions/index.js\n\t// could we create a shared hook?\n\tconst originalSettings = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings(),\n\t\t[]\n\t);\n\n\tconst settings = useMemo(\n\t\t() => ( { ...originalSettings, __unstableIsPreviewMode: true } ),\n\t\t[ originalSettings ]\n\t);\n\n\tconst [ globalStyles ] = useGlobalStylesOutputWithConfig( mergedConfig );\n\n\tsettings.styles =\n\t\t! isObjectEmpty( globalStyles ) && ! isObjectEmpty( userConfig )\n\t\t\t? globalStyles\n\t\t\t: settings.styles;\n\n\treturn (\n\t\t<EditorCanvasContainer\n\t\t\tonClose={ onClose }\n\t\t\tenableResizing={ enableResizing }\n\t\t\tcloseButtonLabel={ showCloseButton ? __( 'Close' ) : null }\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={ clsx( 'edit-site-style-book', {\n\t\t\t\t\t'is-wide': sizes.width > 600,\n\t\t\t\t\t'is-button': !! onClick,\n\t\t\t\t} ) }\n\t\t\t\tstyle={ {\n\t\t\t\t\tcolor: textColor,\n\t\t\t\t\tbackground: backgroundColor,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ resizeObserver }\n\t\t\t\t{ showTabs ? (\n\t\t\t\t\t<div className=\"edit-site-style-book__tabs\">\n\t\t\t\t\t\t<Tabs>\n\t\t\t\t\t\t\t<div className=\"edit-site-style-book__tablist-container\">\n\t\t\t\t\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t\t\t\t\t{ tabs.map( ( tab ) => (\n\t\t\t\t\t\t\t\t\t\t<Tabs.Tab\n\t\t\t\t\t\t\t\t\t\t\ttabId={ tab.slug }\n\t\t\t\t\t\t\t\t\t\t\tkey={ tab.slug }\n\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t{ tab.title }\n\t\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t\t</Tabs.TabList>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t{ tabs.map( ( tab ) => (\n\t\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\t\tkey={ tab.slug }\n\t\t\t\t\t\t\t\t\ttabId={ tab.slug }\n\t\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<StyleBookBody\n\t\t\t\t\t\t\t\t\t\tcategory={ tab.slug }\n\t\t\t\t\t\t\t\t\t\texamples={ examples }\n\t\t\t\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\t\t\t\t\tsizes={ sizes }\n\t\t\t\t\t\t\t\t\t\ttitle={ tab.title }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</Tabs>\n\t\t\t\t\t</div>\n\t\t\t\t) : (\n\t\t\t\t\t<StyleBookBody\n\t\t\t\t\t\texamples={ examples }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\tsizes={ sizes }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</EditorCanvasContainer>\n\t);\n}\n\nconst StyleBookBody = ( {\n\tcategory,\n\texamples,\n\tisSelected,\n\tonClick,\n\tonSelect,\n\tsettings,\n\tsizes,\n\ttitle,\n} ) => {\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\n\t// The presence of an `onClick` prop indicates that the Style Book is being used as a button.\n\t// In this case, add additional props to the iframe to make it behave like a button.\n\tconst buttonModeProps = {\n\t\trole: 'button',\n\t\tonFocus: () => setIsFocused( true ),\n\t\tonBlur: () => setIsFocused( false ),\n\t\tonKeyDown: ( event ) => {\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst { keyCode } = event;\n\t\t\tif ( onClick && ( keyCode === ENTER || keyCode === SPACE ) ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonClick( event );\n\t\t\t}\n\t\t},\n\t\tonClick: ( event ) => {\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( onClick ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonClick( event );\n\t\t\t}\n\t\t},\n\t\treadonly: true,\n\t};\n\n\treturn (\n\t\t<Iframe\n\t\t\tclassName={ clsx( 'edit-site-style-book__iframe', {\n\t\t\t\t'is-focused': isFocused && !! onClick,\n\t\t\t\t'is-button': !! onClick,\n\t\t\t} ) }\n\t\t\tname=\"style-book-canvas\"\n\t\t\ttabIndex={ 0 }\n\t\t\t{ ...( onClick ? buttonModeProps : {} ) }\n\t\t>\n\t\t\t<EditorStyles styles={ settings.styles } />\n\t\t\t<style>\n\t\t\t\t{ STYLE_BOOK_IFRAME_STYLES }\n\t\t\t\t{ !! onClick &&\n\t\t\t\t\t'body { cursor: pointer; } body * { pointer-events: none; }' }\n\t\t\t</style>\n\t\t\t<Examples\n\t\t\t\tclassName={ clsx( 'edit-site-style-book__examples', {\n\t\t\t\t\t'is-wide': sizes.width > 600,\n\t\t\t\t} ) }\n\t\t\t\texamples={ examples }\n\t\t\t\tcategory={ category }\n\t\t\t\tlabel={\n\t\t\t\t\ttitle\n\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t// translators: %s: Category of blocks, e.g. Text.\n\t\t\t\t\t\t\t\t__( 'Examples of blocks in the %s category' ),\n\t\t\t\t\t\t\t\ttitle\n\t\t\t\t\t\t  )\n\t\t\t\t\t\t: __( 'Examples of blocks' )\n\t\t\t\t}\n\t\t\t\tisSelected={ isSelected }\n\t\t\t\tonSelect={ onSelect }\n\t\t\t\tkey={ category }\n\t\t\t/>\n\t\t</Iframe>\n\t);\n};\n\nconst Examples = memo(\n\t( { className, examples, category, label, isSelected, onSelect } ) => {\n\t\tconst categoryDefinition = category\n\t\t\t? getTopLevelStyleBookCategories().find(\n\t\t\t\t\t( _category ) => _category.slug === category\n\t\t\t  )\n\t\t\t: null;\n\n\t\tconst filteredExamples = categoryDefinition\n\t\t\t? getExamplesByCategory( categoryDefinition, examples )\n\t\t\t: { examples };\n\n\t\treturn (\n\t\t\t<Composite\n\t\t\t\torientation=\"vertical\"\n\t\t\t\tclassName={ className }\n\t\t\t\taria-label={ label }\n\t\t\t\trole=\"grid\"\n\t\t\t>\n\t\t\t\t{ !! filteredExamples?.examples?.length &&\n\t\t\t\t\tfilteredExamples.examples.map( ( example ) => (\n\t\t\t\t\t\t<Example\n\t\t\t\t\t\t\tkey={ example.name }\n\t\t\t\t\t\t\tid={ `example-${ example.name }` }\n\t\t\t\t\t\t\ttitle={ example.title }\n\t\t\t\t\t\t\tblocks={ example.blocks }\n\t\t\t\t\t\t\tisSelected={ isSelected( example.name ) }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tonSelect?.( example.name );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t{ !! filteredExamples?.subcategories?.length &&\n\t\t\t\t\tfilteredExamples.subcategories.map( ( subcategory ) => (\n\t\t\t\t\t\t<Composite.Group\n\t\t\t\t\t\t\tclassName=\"edit-site-style-book__subcategory\"\n\t\t\t\t\t\t\tkey={ `subcategory-${ subcategory.slug }` }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Composite.GroupLabel>\n\t\t\t\t\t\t\t\t<h2 className=\"edit-site-style-book__subcategory-title\">\n\t\t\t\t\t\t\t\t\t{ subcategory.title }\n\t\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t</Composite.GroupLabel>\n\t\t\t\t\t\t\t<Subcategory\n\t\t\t\t\t\t\t\texamples={ subcategory.examples }\n\t\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Composite.Group>\n\t\t\t\t\t) ) }\n\t\t\t</Composite>\n\t\t);\n\t}\n);\n\nconst Subcategory = ( { examples, isSelected, onSelect } ) => {\n\treturn (\n\t\t!! examples?.length &&\n\t\texamples.map( ( example ) => (\n\t\t\t<Example\n\t\t\t\tkey={ example.name }\n\t\t\t\tid={ `example-${ example.name }` }\n\t\t\t\ttitle={ example.title }\n\t\t\t\tblocks={ example.blocks }\n\t\t\t\tisSelected={ isSelected( example.name ) }\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tonSelect?.( example.name );\n\t\t\t\t} }\n\t\t\t/>\n\t\t) )\n\t);\n};\n\nconst Example = ( { id, title, blocks, isSelected, onClick } ) => {\n\tconst originalSettings = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings(),\n\t\t[]\n\t);\n\tconst settings = useMemo(\n\t\t() => ( {\n\t\t\t...originalSettings,\n\t\t\tfocusMode: false, // Disable \"Spotlight mode\".\n\t\t\t__unstableIsPreviewMode: true,\n\t\t} ),\n\t\t[ originalSettings ]\n\t);\n\n\t// Cache the list of blocks to avoid additional processing when the component is re-rendered.\n\tconst renderedBlocks = useMemo(\n\t\t() => ( Array.isArray( blocks ) ? blocks : [ blocks ] ),\n\t\t[ blocks ]\n\t);\n\n\treturn (\n\t\t<div role=\"row\">\n\t\t\t<div role=\"gridcell\">\n\t\t\t\t<Composite.Item\n\t\t\t\t\tclassName={ clsx( 'edit-site-style-book__example', {\n\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t} ) }\n\t\t\t\t\tid={ id }\n\t\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t\t// translators: %s: Title of a block, e.g. Heading.\n\t\t\t\t\t\t__( 'Open %s styles in Styles panel' ),\n\t\t\t\t\t\ttitle\n\t\t\t\t\t) }\n\t\t\t\t\trender={ <div /> }\n\t\t\t\t\trole=\"button\"\n\t\t\t\t\tonClick={ onClick }\n\t\t\t\t>\n\t\t\t\t\t<span className=\"edit-site-style-book__example-title\">\n\t\t\t\t\t\t{ title }\n\t\t\t\t\t</span>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"edit-site-style-book__example-preview\"\n\t\t\t\t\t\taria-hidden\n\t\t\t\t\t>\n\t\t\t\t\t\t<Disabled className=\"edit-site-style-book__example-preview__content\">\n\t\t\t\t\t\t\t<ExperimentalBlockEditorProvider\n\t\t\t\t\t\t\t\tvalue={ renderedBlocks }\n\t\t\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<BlockList renderAppender={ false } />\n\t\t\t\t\t\t\t</ExperimentalBlockEditorProvider>\n\t\t\t\t\t\t</Disabled>\n\t\t\t\t\t</div>\n\t\t\t\t</Composite.Item>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default StyleBook;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["clsx","Disabled","Composite","privateApis","componentsPrivateApis","__","_x","sprintf","BlockList","blockEditorPrivateApis","store","blockEditorStore","useSettings","__unstableEditorStyles","EditorStyles","__unstableIframe","Iframe","__experimentalUseMultipleOriginColorsAndGradients","useMultipleOriginColorsAndGradients","editorPrivateApis","useSelect","useResizeObserver","useMemo","useState","memo","useContext","useRef","useLayoutEffect","ENTER","SPACE","unlock","EditorCanvasContainer","STYLE_BOOK_IFRAME_STYLES","getExamplesByCategory","getTopLevelStyleBookCategories","getExamples","jsx","_jsx","jsxs","_jsxs","ExperimentalBlockEditorProvider","useGlobalStyle","GlobalStylesContext","useGlobalStylesOutputWithConfig","mergeBaseAndUserConfigs","Tabs","isObjectEmpty","object","Object","keys","length","scrollToSection","anchorId","iframe","contentDocument","element","getElementById","scrollIntoView","behavior","getStyleBookNavigationFromPath","path","block","includes","decodeURIComponent","split","endsWith","useMultiOriginPalettes","colors","gradients","shouldDisplayDefaultDuotones","customDuotones","themeDuotones","defaultDuotones","palettes","result","duotones","push","name","slug","StyleBook","enableResizing","isSelected","onClick","onSelect","showCloseButton","onClose","showTabs","userConfig","resizeObserver","sizes","textColor","backgroundColor","examples","tabs","filter","category","some","example","examplesForSinglePageUse","overviewCategoryExamples","otherExamples","find","overviewExample","base","baseConfig","goTo","mergedConfig","originalSettings","select","getSettings","globalStyles","settings","styles","isPreviewMode","closeButtonLabel","children","className","width","style","color","background","TabList","map","tab","Tab","tabId","title","TabPanel","focusable","StyleBookBody","isFocused","setIsFocused","hasIframeLoaded","setHasIframeLoaded","iframeRef","buttonModeProps","role","onFocus","onBlur","onKeyDown","event","defaultPrevented","keyCode","preventDefault","readonly","handleLoad","current","onLoad","ref","tabIndex","Examples","label","categoryDefinition","_category","filteredExamples","orientation","Example","id","content","blocks","subcategories","subcategory","Group","GroupLabel","Subcategory","disabledExamples","focusMode","renderedBlocks","Array","isArray","disabledProps","disabled","accessibleWhenDisabled","Item","render","value","renderAppender"],"sources":["@wordpress/edit-site/src/components/style-book/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tDisabled,\n\tComposite,\n\tprivateApis as componentsPrivateApis,\n} from '@wordpress/components';\nimport { __, _x, sprintf } from '@wordpress/i18n';\nimport {\n\tBlockList,\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n\tuseSettings,\n\t__unstableEditorStyles as EditorStyles,\n\t__unstableIframe as Iframe,\n\t__experimentalUseMultipleOriginColorsAndGradients as useMultipleOriginColorsAndGradients,\n} from '@wordpress/block-editor';\nimport { privateApis as editorPrivateApis } from '@wordpress/editor';\nimport { useSelect } from '@wordpress/data';\nimport { useResizeObserver } from '@wordpress/compose';\nimport {\n\tuseMemo,\n\tuseState,\n\tmemo,\n\tuseContext,\n\tuseRef,\n\tuseLayoutEffect,\n} from '@wordpress/element';\nimport { ENTER, SPACE } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport EditorCanvasContainer from '../editor-canvas-container';\nimport { STYLE_BOOK_IFRAME_STYLES } from './constants';\nimport {\n\tgetExamplesByCategory,\n\tgetTopLevelStyleBookCategories,\n} from './categories';\nimport { getExamples } from './examples';\n\nconst {\n\tExperimentalBlockEditorProvider,\n\tuseGlobalStyle,\n\tGlobalStylesContext,\n\tuseGlobalStylesOutputWithConfig,\n} = unlock( blockEditorPrivateApis );\nconst { mergeBaseAndUserConfigs } = unlock( editorPrivateApis );\n\nconst { Tabs } = unlock( componentsPrivateApis );\n\nfunction isObjectEmpty( object ) {\n\treturn ! object || Object.keys( object ).length === 0;\n}\n\n/**\n * Scrolls to a section within an iframe.\n *\n * @param {string}            anchorId The id of the element to scroll to.\n * @param {HTMLIFrameElement} iframe   The target iframe.\n */\nconst scrollToSection = ( anchorId, iframe ) => {\n\tif ( ! iframe || ! iframe?.contentDocument ) {\n\t\treturn;\n\t}\n\n\tconst element = iframe.contentDocument.getElementById( anchorId );\n\tif ( element ) {\n\t\telement.scrollIntoView( {\n\t\t\tbehavior: 'smooth',\n\t\t} );\n\t}\n};\n\n/**\n * Parses a Block Editor navigation path to extract the block name and\n * build a style book navigation path. The object can be extended to include a category,\n * representing a style book tab/section.\n *\n * @param {string} path An internal Block Editor navigation path.\n * @return {null|{block: string}} An object containing the example to navigate to.\n */\nconst getStyleBookNavigationFromPath = ( path ) => {\n\tif ( path && typeof path === 'string' ) {\n\t\tlet block = path.includes( '/blocks/' )\n\t\t\t? decodeURIComponent( path.split( '/blocks/' )[ 1 ] )\n\t\t\t: null;\n\t\t// Default to theme-colors if the path ends with /colors.\n\t\tblock = path.endsWith( '/colors' ) ? 'theme-colors' : block;\n\n\t\treturn {\n\t\t\tblock,\n\t\t};\n\t}\n\treturn null;\n};\n\n/**\n * Retrieves colors, gradients, and duotone filters from Global Styles.\n * The inclusion of default (Core) palettes is controlled by the relevant\n * theme.json property e.g. defaultPalette, defaultGradients, defaultDuotone.\n *\n * @return {Object} Object containing properties for each type of palette.\n */\nfunction useMultiOriginPalettes() {\n\tconst { colors, gradients } = useMultipleOriginColorsAndGradients();\n\n\t// Add duotone filters to the palettes data.\n\tconst [\n\t\tshouldDisplayDefaultDuotones,\n\t\tcustomDuotones,\n\t\tthemeDuotones,\n\t\tdefaultDuotones,\n\t] = useSettings(\n\t\t'color.defaultDuotone',\n\t\t'color.duotone.custom',\n\t\t'color.duotone.theme',\n\t\t'color.duotone.default'\n\t);\n\n\tconst palettes = useMemo( () => {\n\t\tconst result = { colors, gradients, duotones: [] };\n\n\t\tif ( themeDuotones && themeDuotones.length ) {\n\t\t\tresult.duotones.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Theme',\n\t\t\t\t\t'Indicates these duotone filters come from the theme.'\n\t\t\t\t),\n\t\t\t\tslug: 'theme',\n\t\t\t\tduotones: themeDuotones,\n\t\t\t} );\n\t\t}\n\n\t\tif (\n\t\t\tshouldDisplayDefaultDuotones &&\n\t\t\tdefaultDuotones &&\n\t\t\tdefaultDuotones.length\n\t\t) {\n\t\t\tresult.duotones.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Default',\n\t\t\t\t\t'Indicates these duotone filters come from WordPress.'\n\t\t\t\t),\n\t\t\t\tslug: 'default',\n\t\t\t\tduotones: defaultDuotones,\n\t\t\t} );\n\t\t}\n\t\tif ( customDuotones && customDuotones.length ) {\n\t\t\tresult.duotones.push( {\n\t\t\t\tname: _x(\n\t\t\t\t\t'Custom',\n\t\t\t\t\t'Indicates these doutone filters are created by the user.'\n\t\t\t\t),\n\t\t\t\tslug: 'custom',\n\t\t\t\tduotones: customDuotones,\n\t\t\t} );\n\t\t}\n\n\t\treturn result;\n\t}, [\n\t\tcolors,\n\t\tgradients,\n\t\tcustomDuotones,\n\t\tthemeDuotones,\n\t\tdefaultDuotones,\n\t\tshouldDisplayDefaultDuotones,\n\t] );\n\n\treturn palettes;\n}\n\nfunction StyleBook( {\n\tenableResizing = true,\n\tisSelected,\n\tonClick,\n\tonSelect,\n\tshowCloseButton = true,\n\tonClose,\n\tshowTabs = true,\n\tuserConfig = {},\n\tpath = '',\n} ) {\n\tconst [ resizeObserver, sizes ] = useResizeObserver();\n\tconst [ textColor ] = useGlobalStyle( 'color.text' );\n\tconst [ backgroundColor ] = useGlobalStyle( 'color.background' );\n\tconst colors = useMultiOriginPalettes();\n\tconst examples = useMemo( () => getExamples( colors ), [ colors ] );\n\tconst tabs = useMemo(\n\t\t() =>\n\t\t\tgetTopLevelStyleBookCategories().filter( ( category ) =>\n\t\t\t\texamples.some(\n\t\t\t\t\t( example ) => example.category === category.slug\n\t\t\t\t)\n\t\t\t),\n\t\t[ examples ]\n\t);\n\n\tconst examplesForSinglePageUse = [];\n\tconst overviewCategoryExamples = getExamplesByCategory(\n\t\t{ slug: 'overview' },\n\t\texamples\n\t);\n\texamplesForSinglePageUse.push( ...overviewCategoryExamples.examples );\n\tconst otherExamples = examples.filter( ( example ) => {\n\t\treturn (\n\t\t\texample.category !== 'overview' &&\n\t\t\t! overviewCategoryExamples.examples.find(\n\t\t\t\t( overviewExample ) => overviewExample.name === example.name\n\t\t\t)\n\t\t);\n\t} );\n\texamplesForSinglePageUse.push( ...otherExamples );\n\n\tconst { base: baseConfig } = useContext( GlobalStylesContext );\n\tconst goTo = getStyleBookNavigationFromPath( path );\n\n\tconst mergedConfig = useMemo( () => {\n\t\tif ( ! isObjectEmpty( userConfig ) && ! isObjectEmpty( baseConfig ) ) {\n\t\t\treturn mergeBaseAndUserConfigs( baseConfig, userConfig );\n\t\t}\n\t\treturn {};\n\t}, [ baseConfig, userConfig ] );\n\n\t// Copied from packages/edit-site/src/components/revisions/index.js\n\t// could we create a shared hook?\n\tconst originalSettings = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings(),\n\t\t[]\n\t);\n\tconst [ globalStyles ] = useGlobalStylesOutputWithConfig( mergedConfig );\n\n\tconst settings = useMemo(\n\t\t() => ( {\n\t\t\t...originalSettings,\n\t\t\tstyles:\n\t\t\t\t! isObjectEmpty( globalStyles ) && ! isObjectEmpty( userConfig )\n\t\t\t\t\t? globalStyles\n\t\t\t\t\t: originalSettings.styles,\n\t\t\tisPreviewMode: true,\n\t\t} ),\n\t\t[ globalStyles, originalSettings, userConfig ]\n\t);\n\n\treturn (\n\t\t<EditorCanvasContainer\n\t\t\tonClose={ onClose }\n\t\t\tenableResizing={ enableResizing }\n\t\t\tcloseButtonLabel={ showCloseButton ? __( 'Close' ) : null }\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={ clsx( 'edit-site-style-book', {\n\t\t\t\t\t'is-wide': sizes.width > 600,\n\t\t\t\t\t'is-button': !! onClick,\n\t\t\t\t} ) }\n\t\t\t\tstyle={ {\n\t\t\t\t\tcolor: textColor,\n\t\t\t\t\tbackground: backgroundColor,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ resizeObserver }\n\t\t\t\t{ showTabs ? (\n\t\t\t\t\t<Tabs>\n\t\t\t\t\t\t<div className=\"edit-site-style-book__tablist-container\">\n\t\t\t\t\t\t\t<Tabs.TabList>\n\t\t\t\t\t\t\t\t{ tabs.map( ( tab ) => (\n\t\t\t\t\t\t\t\t\t<Tabs.Tab\n\t\t\t\t\t\t\t\t\t\ttabId={ tab.slug }\n\t\t\t\t\t\t\t\t\t\tkey={ tab.slug }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ tab.title }\n\t\t\t\t\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</Tabs.TabList>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t{ tabs.map( ( tab ) => (\n\t\t\t\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\t\t\t\tkey={ tab.slug }\n\t\t\t\t\t\t\t\ttabId={ tab.slug }\n\t\t\t\t\t\t\t\tfocusable={ false }\n\t\t\t\t\t\t\t\tclassName=\"edit-site-style-book__tabpanel\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<StyleBookBody\n\t\t\t\t\t\t\t\t\tcategory={ tab.slug }\n\t\t\t\t\t\t\t\t\texamples={ examples }\n\t\t\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\t\t\t\tsizes={ sizes }\n\t\t\t\t\t\t\t\t\ttitle={ tab.title }\n\t\t\t\t\t\t\t\t\tgoTo={ goTo }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</Tabs.TabPanel>\n\t\t\t\t\t\t) ) }\n\t\t\t\t\t</Tabs>\n\t\t\t\t) : (\n\t\t\t\t\t<StyleBookBody\n\t\t\t\t\t\texamples={ examplesForSinglePageUse }\n\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\tsizes={ sizes }\n\t\t\t\t\t\tgoTo={ goTo }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</EditorCanvasContainer>\n\t);\n}\n\nconst StyleBookBody = ( {\n\tcategory,\n\texamples,\n\tisSelected,\n\tonClick,\n\tonSelect,\n\tsettings,\n\tsizes,\n\ttitle,\n\tgoTo,\n} ) => {\n\tconst [ isFocused, setIsFocused ] = useState( false );\n\tconst [ hasIframeLoaded, setHasIframeLoaded ] = useState( false );\n\tconst iframeRef = useRef( null );\n\t// The presence of an `onClick` prop indicates that the Style Book is being used as a button.\n\t// In this case, add additional props to the iframe to make it behave like a button.\n\tconst buttonModeProps = {\n\t\trole: 'button',\n\t\tonFocus: () => setIsFocused( true ),\n\t\tonBlur: () => setIsFocused( false ),\n\t\tonKeyDown: ( event ) => {\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst { keyCode } = event;\n\t\t\tif ( onClick && ( keyCode === ENTER || keyCode === SPACE ) ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonClick( event );\n\t\t\t}\n\t\t},\n\t\tonClick: ( event ) => {\n\t\t\tif ( event.defaultPrevented ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tif ( onClick ) {\n\t\t\t\tevent.preventDefault();\n\t\t\t\tonClick( event );\n\t\t\t}\n\t\t},\n\t\treadonly: true,\n\t};\n\n\tconst handleLoad = () => setHasIframeLoaded( true );\n\tuseLayoutEffect( () => {\n\t\tif ( goTo?.block && hasIframeLoaded && iframeRef?.current ) {\n\t\t\tscrollToSection( `example-${ goTo?.block }`, iframeRef?.current );\n\t\t}\n\t}, [ iframeRef?.current, goTo?.block, scrollToSection, hasIframeLoaded ] );\n\n\treturn (\n\t\t<Iframe\n\t\t\tonLoad={ handleLoad }\n\t\t\tref={ iframeRef }\n\t\t\tclassName={ clsx( 'edit-site-style-book__iframe', {\n\t\t\t\t'is-focused': isFocused && !! onClick,\n\t\t\t\t'is-button': !! onClick,\n\t\t\t} ) }\n\t\t\tname=\"style-book-canvas\"\n\t\t\ttabIndex={ 0 }\n\t\t\t{ ...( onClick ? buttonModeProps : {} ) }\n\t\t>\n\t\t\t<EditorStyles styles={ settings.styles } />\n\t\t\t<style>\n\t\t\t\t{ STYLE_BOOK_IFRAME_STYLES }\n\t\t\t\t{ !! onClick &&\n\t\t\t\t\t'body { cursor: pointer; } body * { pointer-events: none; }' }\n\t\t\t</style>\n\t\t\t<Examples\n\t\t\t\tclassName={ clsx( 'edit-site-style-book__examples', {\n\t\t\t\t\t'is-wide': sizes.width > 600,\n\t\t\t\t} ) }\n\t\t\t\texamples={ examples }\n\t\t\t\tcategory={ category }\n\t\t\t\tlabel={\n\t\t\t\t\ttitle\n\t\t\t\t\t\t? sprintf(\n\t\t\t\t\t\t\t\t// translators: %s: Category of blocks, e.g. Text.\n\t\t\t\t\t\t\t\t__( 'Examples of blocks in the %s category' ),\n\t\t\t\t\t\t\t\ttitle\n\t\t\t\t\t\t  )\n\t\t\t\t\t\t: __( 'Examples of blocks' )\n\t\t\t\t}\n\t\t\t\tisSelected={ isSelected }\n\t\t\t\tonSelect={ onSelect }\n\t\t\t\tkey={ category }\n\t\t\t/>\n\t\t</Iframe>\n\t);\n};\n\nconst Examples = memo(\n\t( { className, examples, category, label, isSelected, onSelect } ) => {\n\t\tconst categoryDefinition = category\n\t\t\t? getTopLevelStyleBookCategories().find(\n\t\t\t\t\t( _category ) => _category.slug === category\n\t\t\t  )\n\t\t\t: null;\n\n\t\tconst filteredExamples = categoryDefinition\n\t\t\t? getExamplesByCategory( categoryDefinition, examples )\n\t\t\t: { examples };\n\n\t\treturn (\n\t\t\t<Composite\n\t\t\t\torientation=\"vertical\"\n\t\t\t\tclassName={ className }\n\t\t\t\taria-label={ label }\n\t\t\t\trole=\"grid\"\n\t\t\t>\n\t\t\t\t{ !! filteredExamples?.examples?.length &&\n\t\t\t\t\tfilteredExamples.examples.map( ( example ) => (\n\t\t\t\t\t\t<Example\n\t\t\t\t\t\t\tkey={ example.name }\n\t\t\t\t\t\t\tid={ `example-${ example.name }` }\n\t\t\t\t\t\t\ttitle={ example.title }\n\t\t\t\t\t\t\tcontent={ example.content }\n\t\t\t\t\t\t\tblocks={ example.blocks }\n\t\t\t\t\t\t\tisSelected={ isSelected?.( example.name ) }\n\t\t\t\t\t\t\tonClick={ () => onSelect?.( example.name ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t{ !! filteredExamples?.subcategories?.length &&\n\t\t\t\t\tfilteredExamples.subcategories.map( ( subcategory ) => (\n\t\t\t\t\t\t<Composite.Group\n\t\t\t\t\t\t\tclassName=\"edit-site-style-book__subcategory\"\n\t\t\t\t\t\t\tkey={ `subcategory-${ subcategory.slug }` }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Composite.GroupLabel>\n\t\t\t\t\t\t\t\t<h2 className=\"edit-site-style-book__subcategory-title\">\n\t\t\t\t\t\t\t\t\t{ subcategory.title }\n\t\t\t\t\t\t\t\t</h2>\n\t\t\t\t\t\t\t</Composite.GroupLabel>\n\t\t\t\t\t\t\t<Subcategory\n\t\t\t\t\t\t\t\texamples={ subcategory.examples }\n\t\t\t\t\t\t\t\tisSelected={ isSelected }\n\t\t\t\t\t\t\t\tonSelect={ onSelect }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</Composite.Group>\n\t\t\t\t\t) ) }\n\t\t\t</Composite>\n\t\t);\n\t}\n);\n\nconst Subcategory = ( { examples, isSelected, onSelect } ) => {\n\treturn (\n\t\t!! examples?.length &&\n\t\texamples.map( ( example ) => (\n\t\t\t<Example\n\t\t\t\tkey={ example.name }\n\t\t\t\tid={ `example-${ example.name }` }\n\t\t\t\ttitle={ example.title }\n\t\t\t\tcontent={ example.content }\n\t\t\t\tblocks={ example.blocks }\n\t\t\t\tisSelected={ isSelected?.( example.name ) }\n\t\t\t\tonClick={ () => {\n\t\t\t\t\tonSelect?.( example.name );\n\t\t\t\t} }\n\t\t\t/>\n\t\t) )\n\t);\n};\n\nconst disabledExamples = [ 'example-duotones' ];\n\nconst Example = ( { id, title, blocks, isSelected, onClick, content } ) => {\n\tconst originalSettings = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings(),\n\t\t[]\n\t);\n\tconst settings = useMemo(\n\t\t() => ( {\n\t\t\t...originalSettings,\n\t\t\tfocusMode: false, // Disable \"Spotlight mode\".\n\t\t\tisPreviewMode: true,\n\t\t} ),\n\t\t[ originalSettings ]\n\t);\n\n\t// Cache the list of blocks to avoid additional processing when the component is re-rendered.\n\tconst renderedBlocks = useMemo(\n\t\t() => ( Array.isArray( blocks ) ? blocks : [ blocks ] ),\n\t\t[ blocks ]\n\t);\n\n\tconst disabledProps = disabledExamples.includes( id )\n\t\t? {\n\t\t\t\tdisabled: true,\n\t\t\t\taccessibleWhenDisabled: true,\n\t\t  }\n\t\t: {};\n\n\treturn (\n\t\t<div role=\"row\">\n\t\t\t<div role=\"gridcell\">\n\t\t\t\t<Composite.Item\n\t\t\t\t\tclassName={ clsx( 'edit-site-style-book__example', {\n\t\t\t\t\t\t'is-selected': isSelected,\n\t\t\t\t\t\t'is-disabled-example': !! disabledProps?.disabled,\n\t\t\t\t\t} ) }\n\t\t\t\t\tid={ id }\n\t\t\t\t\taria-label={ sprintf(\n\t\t\t\t\t\t// translators: %s: Title of a block, e.g. Heading.\n\t\t\t\t\t\t__( 'Open %s styles in Styles panel' ),\n\t\t\t\t\t\ttitle\n\t\t\t\t\t) }\n\t\t\t\t\trender={ <div /> }\n\t\t\t\t\trole=\"button\"\n\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\t{ ...disabledProps }\n\t\t\t\t>\n\t\t\t\t\t<span className=\"edit-site-style-book__example-title\">\n\t\t\t\t\t\t{ title }\n\t\t\t\t\t</span>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"edit-site-style-book__example-preview\"\n\t\t\t\t\t\taria-hidden\n\t\t\t\t\t>\n\t\t\t\t\t\t<Disabled className=\"edit-site-style-book__example-preview__content\">\n\t\t\t\t\t\t\t{ content ? (\n\t\t\t\t\t\t\t\tcontent\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<ExperimentalBlockEditorProvider\n\t\t\t\t\t\t\t\t\tvalue={ renderedBlocks }\n\t\t\t\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<EditorStyles />\n\t\t\t\t\t\t\t\t\t<BlockList renderAppender={ false } />\n\t\t\t\t\t\t\t\t</ExperimentalBlockEditorProvider>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</Disabled>\n\t\t\t\t\t</div>\n\t\t\t\t</Composite.Item>\n\t\t\t</div>\n\t\t</div>\n\t);\n};\n\nexport default StyleBook;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/style-book/types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["@wordpress/edit-site/src/components/style-book/types.ts"],"sourcesContent":["type Block = {\n\tname: string;\n\tattributes: Record< string, unknown >;\n\tinnerBlocks?: Block[];\n};\n\nexport type StyleBookCategory = {\n\ttitle: string;\n\tslug: string;\n\tblocks?: string[];\n\texclude?: string[];\n\tsubcategories?: StyleBookCategory[];\n};\n\nexport type BlockExample = {\n\tname: string;\n\ttitle: string;\n\tcategory: string;\n\tblocks: Block | Block[];\n};\n\nexport type CategoryExamples = {\n\ttitle: string;\n\tslug: string;\n\texamples?: BlockExample[];\n\tsubcategories?: CategoryExamples[];\n};\n"],"mappings":"","ignoreList":[]}
+{"version":3,"names":[],"sources":["@wordpress/edit-site/src/components/style-book/types.ts"],"sourcesContent":["type Block = {\n\tname: string;\n\tattributes: Record< string, unknown >;\n\tinnerBlocks?: Block[];\n};\n\nexport type StyleBookCategory = {\n\ttitle: string;\n\tslug: string;\n\tblocks?: string[];\n\texclude?: string[];\n\tinclude?: string[];\n\tsubcategories?: StyleBookCategory[];\n};\n\nexport type BlockExample = {\n\tname: string;\n\ttitle: string;\n\tcategory: string;\n\tcontent?: JSX.Element;\n\tblocks?: Block | Block[];\n};\n\nexport type CategoryExamples = {\n\ttitle: string;\n\tslug: string;\n\texamples?: BlockExample[];\n\tsubcategories?: CategoryExamples[];\n};\n\nexport type StyleBookColorGroup = {\n\torigin: string;\n\tslug: string;\n\ttitle: string;\n\ttype: string;\n};\n\nexport type Color = { slug: string };\nexport type Gradient = { slug: string };\nexport type Duotone = {\n\tcolors: string[];\n\tslug: string;\n};\n\nexport type ColorOrigin = {\n\tname: string;\n\tslug: string;\n\tcolors?: Color[];\n\tgradients?: Gradient[];\n\tduotones?: Duotone[];\n};\n\nexport type MultiOriginPalettes = {\n\tdisableCustomColors: boolean;\n\tdisableCustomGradients: boolean;\n\thasColorsOrGradients: boolean;\n\tcolors: Omit< ColorOrigin, 'gradients' | 'duotones' >;\n\tduotones: Omit< ColorOrigin, 'colors' | 'gradients' >;\n\tgradients: Omit< ColorOrigin, 'colors' | 'duotones' >;\n};\n"],"mappings":"","ignoreList":[]}

package/build-module/components/sync-state-with-url/use-init-edited-entity-from-url.js

@@ -5,6 +5,7 @@ import { useEffect, useMemo } from '@wordpress/element';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { store as coreDataStore } from '@wordpress/core-data';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
+import { store as blockEditorStore } from '@wordpress/block-editor';
 
 /**
  * Internal dependencies
@@ -24,33 +25,19 @@ function useResolveEditedEntityAndContext({
   const {
     hasLoadedAllDependencies,
     homepageId,
-    postsPageId,
-    url,
-    frontPageTemplateId
+    postsPageId
   } = useSelect(select => {
     const {
-      getEntityRecord,
-      getEntityRecords
+      getEntityRecord
     } = select(coreDataStore);
     const siteData = getEntityRecord('root', 'site');
-    const base = getEntityRecord('root', '__unstableBase');
-    const templates = getEntityRecords('postType', TEMPLATE_POST_TYPE, {
-      per_page: -1
-    });
     const _homepageId = siteData?.show_on_front === 'page' && ['number', 'string'].includes(typeof siteData.page_on_front) && !!+siteData.page_on_front // We also need to check if it's not zero(`0`).
     ? siteData.page_on_front.toString() : null;
     const _postsPageId = siteData?.show_on_front === 'page' && ['number', 'string'].includes(typeof siteData.page_for_posts) ? siteData.page_for_posts.toString() : null;
-    let _frontPageTemplateId;
-    if (templates) {
-      const frontPageTemplate = templates.find(t => t.slug === 'front-page');
-      _frontPageTemplateId = frontPageTemplate ? frontPageTemplate.id : false;
-    }
     return {
-      hasLoadedAllDependencies: !!base && !!siteData,
+      hasLoadedAllDependencies: !!siteData,
       homepageId: _homepageId,
-      postsPageId: _postsPageId,
-      url: base?.home,
-      frontPageTemplateId: _frontPageTemplateId
+      postsPageId: _postsPageId
     };
   }, []);
 
@@ -74,20 +61,33 @@ function useResolveEditedEntityAndContext({
     const {
       getEditedEntityRecord,
       getEntityRecords,
-      getDefaultTemplateId,
-      __experimentalGetTemplateForLink
+      getDefaultTemplateId
     } = select(coreDataStore);
     function resolveTemplateForPostTypeAndId(postTypeToResolve, postIdToResolve) {
       // For the front page, we always use the front page template if existing.
       if (postTypeToResolve === 'page' && homepageId === postIdToResolve) {
-        // We're still checking whether the front page template exists.
-        // Don't resolve the template yet.
-        if (frontPageTemplateId === undefined) {
+        // The /lookup endpoint cannot currently handle a lookup
+        // when a page is set as the front page, so specifically in
+        // that case, we want to check if there is a front page
+        // template, and instead of falling back to the home
+        // template, we want to fall back to the page template.
+        const templates = getEntityRecords('postType', TEMPLATE_POST_TYPE, {
+          per_page: -1
+        });
+        if (templates) {
+          const id = templates?.find(({
+            slug
+          }) => slug === 'front-page')?.id;
+          if (id) {
+            return id;
+          }
+
+          // If no front page template is found, continue with the
+          // logic below (fetching the page template).
+        } else {
+          // Still resolving `templates`.
           return undefined;
         }
-        if (!!frontPageTemplateId) {
-          return frontPageTemplateId;
-        }
       }
       const editedEntity = getEditedEntityRecord('postType', postTypeToResolve, postIdToResolve);
       if (!editedEntity) {
@@ -95,7 +95,9 @@ function useResolveEditedEntityAndContext({
       }
       // Check if the current page is the posts page.
       if (postTypeToResolve === 'page' && postsPageId === postIdToResolve) {
-        return __experimentalGetTemplateForLink(editedEntity.link)?.id;
+        return getDefaultTemplateId({
+          slug: 'home'
+        });
       }
       // First see if the post/page has an assigned template and fetch it.
       const currentTemplateSlug = editedEntity.template;
@@ -140,11 +142,10 @@ function useResolveEditedEntityAndContext({
     }
 
     // If we're not rendering a specific page, use the front page template.
-    if (url) {
-      const template = __experimentalGetTemplateForLink(url);
-      return template?.id;
-    }
-  }, [homepageId, postsPageId, hasLoadedAllDependencies, url, postId, postType, frontPageTemplateId]);
+    return getDefaultTemplateId({
+      slug: 'front-page'
+    });
+  }, [homepageId, postsPageId, hasLoadedAllDependencies, postId, postType]);
   const context = useMemo(() => {
     if (postTypesWithoutParentTemplate.includes(postType) && postId) {
       return {};
@@ -198,10 +199,14 @@ export default function useInitEditedEntityFromURL() {
   const {
     setEditedEntity
   } = useDispatch(editSiteStore);
+  const {
+    resetZoomLevel
+  } = unlock(useDispatch(blockEditorStore));
   useEffect(() => {
     if (isReady) {
+      resetZoomLevel();
       setEditedEntity(postType, postId, context);
     }
-  }, [isReady, postType, postId, context, setEditedEntity]);
+  }, [isReady, postType, postId, context, setEditedEntity, resetZoomLevel]);
 }
 //# sourceMappingURL=use-init-edited-entity-from-url.js.map