@wordpress/edit-site 5.7.0 → 5.9.0

package/build/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js

@@ -13,6 +13,12 @@ var _data = require("@wordpress/data");
 
 var _blocks = require("@wordpress/blocks");
 
+var _components = require("@wordpress/components");
+
+var _dom = require("@wordpress/dom");
+
+var _coreData = require("@wordpress/core-data");
+
 var _privateApis = require("../../private-apis");
 
 var _loader = require("./loader");
@@ -24,30 +30,126 @@ var _loader = require("./loader");
 /**
  * Internal dependencies
  */
-function NavigationMenuContent(_ref) {
+function CustomLinkAdditionalBlockUI(_ref) {
+  let {
+    block,
+    onClose
+  } = _ref;
+  const {
+    updateBlockAttributes
+  } = (0, _data.useDispatch)(_blockEditor.store);
+  const {
+    label,
+    url,
+    opensInNewTab
+  } = block.attributes;
+  const link = {
+    url,
+    opensInNewTab,
+    title: label && (0, _dom.__unstableStripHTML)(label)
+  };
+  return (0, _element.createElement)(_components.Popover, {
+    placement: "bottom",
+    shift: true,
+    onClose: onClose
+  }, (0, _element.createElement)(_blockEditor.__experimentalLinkControl, {
+    hasTextControl: true,
+    hasRichPreviews: true,
+    value: link,
+    onChange: updatedValue => {
+      updateBlockAttributes(block.clientId, {
+        label: updatedValue.title,
+        url: updatedValue.url,
+        opensInNewTab: updatedValue.opensInNewTab
+      });
+      onClose();
+    },
+    onCancel: onClose
+  }));
+} // Needs to be kept in sync with the query used at packages/block-library/src/page-list/edit.js.
+
+
+const MAX_PAGE_COUNT = 100;
+const PAGES_QUERY = ['postType', 'page', {
+  per_page: MAX_PAGE_COUNT,
+  _fields: ['id', 'link', 'menu_order', 'parent', 'title', 'type'],
+  // TODO: When https://core.trac.wordpress.org/ticket/39037 REST API support for multiple orderby
+  // values is resolved, update 'orderby' to [ 'menu_order', 'post_title' ] to provide a consistent
+  // sort.
+  orderby: 'menu_order',
+  order: 'asc'
+}];
+
+function NavigationMenuContent(_ref2) {
   let {
     rootClientId,
     onSelect
-  } = _ref;
+  } = _ref2;
+  const [isLoading, setIsLoading] = (0, _element.useState)(true);
   const {
     clientIdsTree,
-    isLoading
+    shouldKeepLoading,
+    isSinglePageList
   } = (0, _data.useSelect)(select => {
     const {
       __unstableGetClientIdsTree,
-      areInnerBlocksControlled
+      areInnerBlocksControlled,
+      getBlockName
     } = select(_blockEditor.store);
+    const {
+      isResolving
+    } = select(_coreData.store);
+
+    const _clientIdsTree = __unstableGetClientIdsTree(rootClientId);
+
+    const hasOnlyPageListBlock = _clientIdsTree.length === 1 && getBlockName(_clientIdsTree[0].clientId) === 'core/page-list';
+    const isLoadingPages = isResolving('getEntityRecords', PAGES_QUERY);
     return {
-      clientIdsTree: __unstableGetClientIdsTree(rootClientId),
+      clientIdsTree: _clientIdsTree,
       // This is a small hack to wait for the navigation block
       // to actually load its inner blocks.
-      isLoading: !areInnerBlocksControlled(rootClientId)
+      shouldKeepLoading: !areInnerBlocksControlled(rootClientId) || isLoadingPages,
+      isSinglePageList: hasOnlyPageListBlock && !isLoadingPages && _clientIdsTree[0].innerBlocks.length > 0
     };
   }, [rootClientId]);
   const {
     replaceBlock,
     __unstableMarkNextChangeAsNotPersistent
   } = (0, _data.useDispatch)(_blockEditor.store);
+  const [customLinkEditPopoverOpenId, setIsCustomLinkEditPopoverOpenId] = (0, _element.useState)(false);
+  const renderAdditionalBlockUICallback = (0, _element.useCallback)(block => {
+    if (customLinkEditPopoverOpenId && block.clientId === customLinkEditPopoverOpenId) {
+      return (0, _element.createElement)(CustomLinkAdditionalBlockUI, {
+        block: block,
+        onClose: () => {
+          setIsCustomLinkEditPopoverOpenId(false);
+        }
+      });
+    }
+
+    return null;
+  }, [customLinkEditPopoverOpenId, setIsCustomLinkEditPopoverOpenId]); // Delay loading stop by 50ms to avoid flickering.
+
+  (0, _element.useEffect)(() => {
+    let timeoutId;
+
+    if (shouldKeepLoading && !isLoading) {
+      setIsLoading(true);
+    }
+
+    if (!shouldKeepLoading && isLoading) {
+      timeoutId = setTimeout(() => {
+        setIsLoading(false);
+        timeoutId = undefined;
+      }, 50);
+    }
+
+    return () => {
+      if (timeoutId) {
+        clearTimeout(timeoutId);
+      }
+    };
+  }, [shouldKeepLoading, clientIdsTree, isLoading]);
   const {
     OffCanvasEditor,
     LeafMoreMenu
@@ -57,17 +159,20 @@ function NavigationMenuContent(_ref) {
       __unstableMarkNextChangeAsNotPersistent();
 
       replaceBlock(block.clientId, (0, _blocks.createBlock)('core/navigation-link', block.attributes));
+    } else if (block.name === 'core/navigation-link' && block.attributes.kind === 'custom' && block.attributes.url) {
+      setIsCustomLinkEditPopoverOpenId(block.clientId);
     } else {
       onSelect(block);
     }
-  }, [onSelect, __unstableMarkNextChangeAsNotPersistent, replaceBlock]); // The hidden block is needed because it makes block edit side effects trigger.
+  }, [onSelect, __unstableMarkNextChangeAsNotPersistent, replaceBlock, setIsCustomLinkEditPopoverOpenId]); // The hidden block is needed because it makes block edit side effects trigger.
   // For example a navigation page list load its items has an effect on edit to load its items.
 
   return (0, _element.createElement)(_element.Fragment, null, isLoading && (0, _element.createElement)(_loader.NavigationMenuLoader, null), !isLoading && (0, _element.createElement)(OffCanvasEditor, {
-    blocks: clientIdsTree,
+    blocks: isSinglePageList ? clientIdsTree[0].innerBlocks : clientIdsTree,
     onSelect: offCanvasOnselect,
     LeafMoreMenu: LeafMoreMenu,
-    showAppender: false
+    showAppender: false,
+    renderAdditionalBlockUI: renderAdditionalBlockUICallback
   }), (0, _element.createElement)("div", {
     style: {
       visibility: 'hidden'

package/build/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js"],"names":["NavigationMenuContent","rootClientId","onSelect","clientIdsTree","isLoading","select","__unstableGetClientIdsTree","areInnerBlocksControlled","blockEditorStore","replaceBlock","__unstableMarkNextChangeAsNotPersistent","OffCanvasEditor","LeafMoreMenu","blockEditorPrivateApis","offCanvasOnselect","block","name","attributes","url","clientId","visibility"],"mappings":";;;;;;;AAWA;;AARA;;AAMA;;AACA;;AAMA;;AACA;;AAjBA;AACA;AACA;;AAWA;AACA;AACA;AAIe,SAASA,qBAAT,OAA6D;AAAA,MAA7B;AAAEC,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,GAA6B;AAC3E,QAAM;AAAEC,IAAAA,aAAF;AAAiBC,IAAAA;AAAjB,MAA+B,qBAClCC,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA,0BAAF;AAA8BC,MAAAA;AAA9B,QACLF,MAAM,CAAEG,kBAAF,CADP;AAEA,WAAO;AACNL,MAAAA,aAAa,EAAEG,0BAA0B,CAAEL,YAAF,CADnC;AAGN;AACA;AACAG,MAAAA,SAAS,EAAE,CAAEG,wBAAwB,CAAEN,YAAF;AAL/B,KAAP;AAOA,GAXmC,EAYpC,CAAEA,YAAF,CAZoC,CAArC;AAcA,QAAM;AAAEQ,IAAAA,YAAF;AAAgBC,IAAAA;AAAhB,MACL,uBAAaF,kBAAb,CADD;AAGA,QAAM;AAAEG,IAAAA,eAAF;AAAmBC,IAAAA;AAAnB,MAAoC,yBAAQC,wBAAR,CAA1C;AAEA,QAAMC,iBAAiB,GAAG,0BACvBC,KAAF,IAAa;AACZ,QACCA,KAAK,CAACC,IAAN,KAAe,sBAAf,IACA,CAAED,KAAK,CAACE,UAAN,CAAiBC,GAFpB,EAGE;AACDR,MAAAA,uCAAuC;;AACvCD,MAAAA,YAAY,CACXM,KAAK,CAACI,QADK,EAEX,yBAAa,sBAAb,EAAqCJ,KAAK,CAACE,UAA3C,CAFW,CAAZ;AAIA,KATD,MASO;AACNf,MAAAA,QAAQ,CAAEa,KAAF,CAAR;AACA;AACD,GAdwB,EAezB,CAAEb,QAAF,EAAYQ,uCAAZ,EAAqDD,YAArD,CAfyB,CAA1B,CApB2E,CAsC3E;AACA;;AACA,SACC,qDACGL,SAAS,IAAI,4BAAC,4BAAD,OADhB,EAEG,CAAEA,SAAF,IACD,4BAAC,eAAD;AACC,IAAA,MAAM,EAAGD,aADV;AAEC,IAAA,QAAQ,EAAGW,iBAFZ;AAGC,IAAA,YAAY,EAAGF,YAHhB;AAIC,IAAA,YAAY,EAAG;AAJhB,IAHF,EAUC;AAAK,IAAA,KAAK,EAAG;AAAEQ,MAAAA,UAAU,EAAE;AAAd;AAAb,KACC,4BAAC,uBAAD,QACC,4BAAC,sBAAD,OADD,CADD,CAVD,CADD;AAkBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n\tBlockList,\n\tBlockTools,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { createBlock } from '@wordpress/blocks';\nimport { useCallback } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\nimport { NavigationMenuLoader } from './loader';\n\nexport default function NavigationMenuContent( { rootClientId, onSelect } ) {\n\tconst { clientIdsTree, isLoading } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { __unstableGetClientIdsTree, areInnerBlocksControlled } =\n\t\t\t\tselect( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tclientIdsTree: __unstableGetClientIdsTree( rootClientId ),\n\n\t\t\t\t// This is a small hack to wait for the navigation block\n\t\t\t\t// to actually load its inner blocks.\n\t\t\t\tisLoading: ! areInnerBlocksControlled( rootClientId ),\n\t\t\t};\n\t\t},\n\t\t[ rootClientId ]\n\t);\n\tconst { replaceBlock, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst { OffCanvasEditor, LeafMoreMenu } = unlock( blockEditorPrivateApis );\n\n\tconst offCanvasOnselect = useCallback(\n\t\t( block ) => {\n\t\t\tif (\n\t\t\t\tblock.name === 'core/navigation-link' &&\n\t\t\t\t! block.attributes.url\n\t\t\t) {\n\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\treplaceBlock(\n\t\t\t\t\tblock.clientId,\n\t\t\t\t\tcreateBlock( 'core/navigation-link', block.attributes )\n\t\t\t\t);\n\t\t\t} else {\n\t\t\t\tonSelect( block );\n\t\t\t}\n\t\t},\n\t\t[ onSelect, __unstableMarkNextChangeAsNotPersistent, replaceBlock ]\n\t);\n\n\t// The hidden block is needed because it makes block edit side effects trigger.\n\t// For example a navigation page list load its items has an effect on edit to load its items.\n\treturn (\n\t\t<>\n\t\t\t{ isLoading && <NavigationMenuLoader /> }\n\t\t\t{ ! isLoading && (\n\t\t\t\t<OffCanvasEditor\n\t\t\t\t\tblocks={ clientIdsTree }\n\t\t\t\t\tonSelect={ offCanvasOnselect }\n\t\t\t\t\tLeafMoreMenu={ LeafMoreMenu }\n\t\t\t\t\tshowAppender={ false }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<div style={ { visibility: 'hidden' } }>\n\t\t\t\t<BlockTools>\n\t\t\t\t\t<BlockList />\n\t\t\t\t</BlockTools>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-navigation-menus/navigation-menu-content.js"],"names":["CustomLinkAdditionalBlockUI","block","onClose","updateBlockAttributes","blockEditorStore","label","url","opensInNewTab","attributes","link","title","updatedValue","clientId","MAX_PAGE_COUNT","PAGES_QUERY","per_page","_fields","orderby","order","NavigationMenuContent","rootClientId","onSelect","isLoading","setIsLoading","clientIdsTree","shouldKeepLoading","isSinglePageList","select","__unstableGetClientIdsTree","areInnerBlocksControlled","getBlockName","isResolving","coreStore","_clientIdsTree","hasOnlyPageListBlock","length","isLoadingPages","innerBlocks","replaceBlock","__unstableMarkNextChangeAsNotPersistent","customLinkEditPopoverOpenId","setIsCustomLinkEditPopoverOpenId","renderAdditionalBlockUICallback","timeoutId","setTimeout","undefined","clearTimeout","OffCanvasEditor","LeafMoreMenu","blockEditorPrivateApis","offCanvasOnselect","name","kind","visibility"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n\tBlockList,\n\tBlockTools,\n\t__experimentalLinkControl as LinkControl,\n} from '@wordpress/block-editor';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { createBlock } from '@wordpress/blocks';\nimport { Popover } from '@wordpress/components';\nimport { __unstableStripHTML as stripHTML } from '@wordpress/dom';\nimport { useCallback, useEffect, useState } from '@wordpress/element';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\nimport { NavigationMenuLoader } from './loader';\n\nfunction CustomLinkAdditionalBlockUI( { block, onClose } ) {\n\tconst { updateBlockAttributes } = useDispatch( blockEditorStore );\n\tconst { label, url, opensInNewTab } = block.attributes;\n\tconst link = {\n\t\turl,\n\t\topensInNewTab,\n\t\ttitle: label && stripHTML( label ),\n\t};\n\treturn (\n\t\t<Popover placement=\"bottom\" shift onClose={ onClose }>\n\t\t\t<LinkControl\n\t\t\t\thasTextControl\n\t\t\t\thasRichPreviews\n\t\t\t\tvalue={ link }\n\t\t\t\tonChange={ ( updatedValue ) => {\n\t\t\t\t\tupdateBlockAttributes( block.clientId, {\n\t\t\t\t\t\tlabel: updatedValue.title,\n\t\t\t\t\t\turl: updatedValue.url,\n\t\t\t\t\t\topensInNewTab: updatedValue.opensInNewTab,\n\t\t\t\t\t} );\n\t\t\t\t\tonClose();\n\t\t\t\t} }\n\t\t\t\tonCancel={ onClose }\n\t\t\t/>\n\t\t</Popover>\n\t);\n}\n// Needs to be kept in sync with the query used at packages/block-library/src/page-list/edit.js.\nconst MAX_PAGE_COUNT = 100;\nconst PAGES_QUERY = [\n\t'postType',\n\t'page',\n\t{\n\t\tper_page: MAX_PAGE_COUNT,\n\t\t_fields: [ 'id', 'link', 'menu_order', 'parent', 'title', 'type' ],\n\t\t// TODO: When https://core.trac.wordpress.org/ticket/39037 REST API support for multiple orderby\n\t\t// values is resolved, update 'orderby' to [ 'menu_order', 'post_title' ] to provide a consistent\n\t\t// sort.\n\t\torderby: 'menu_order',\n\t\torder: 'asc',\n\t},\n];\n\nexport default function NavigationMenuContent( { rootClientId, onSelect } ) {\n\tconst [ isLoading, setIsLoading ] = useState( true );\n\tconst { clientIdsTree, shouldKeepLoading, isSinglePageList } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\t__unstableGetClientIdsTree,\n\t\t\t\tareInnerBlocksControlled,\n\t\t\t\tgetBlockName,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst { isResolving } = select( coreStore );\n\n\t\t\tconst _clientIdsTree = __unstableGetClientIdsTree( rootClientId );\n\t\t\tconst hasOnlyPageListBlock =\n\t\t\t\t_clientIdsTree.length === 1 &&\n\t\t\t\tgetBlockName( _clientIdsTree[ 0 ].clientId ) ===\n\t\t\t\t\t'core/page-list';\n\t\t\tconst isLoadingPages = isResolving(\n\t\t\t\t'getEntityRecords',\n\t\t\t\tPAGES_QUERY\n\t\t\t);\n\t\t\treturn {\n\t\t\t\tclientIdsTree: _clientIdsTree,\n\t\t\t\t// This is a small hack to wait for the navigation block\n\t\t\t\t// to actually load its inner blocks.\n\t\t\t\tshouldKeepLoading:\n\t\t\t\t\t! areInnerBlocksControlled( rootClientId ) ||\n\t\t\t\t\tisLoadingPages,\n\t\t\t\tisSinglePageList:\n\t\t\t\t\thasOnlyPageListBlock &&\n\t\t\t\t\t! isLoadingPages &&\n\t\t\t\t\t_clientIdsTree[ 0 ].innerBlocks.length > 0,\n\t\t\t};\n\t\t},\n\t\t[ rootClientId ]\n\t);\n\tconst { replaceBlock, __unstableMarkNextChangeAsNotPersistent } =\n\t\tuseDispatch( blockEditorStore );\n\n\tconst [ customLinkEditPopoverOpenId, setIsCustomLinkEditPopoverOpenId ] =\n\t\tuseState( false );\n\n\tconst renderAdditionalBlockUICallback = useCallback(\n\t\t( block ) => {\n\t\t\tif (\n\t\t\t\tcustomLinkEditPopoverOpenId &&\n\t\t\t\tblock.clientId === customLinkEditPopoverOpenId\n\t\t\t) {\n\t\t\t\treturn (\n\t\t\t\t\t<CustomLinkAdditionalBlockUI\n\t\t\t\t\t\tblock={ block }\n\t\t\t\t\t\tonClose={ () => {\n\t\t\t\t\t\t\tsetIsCustomLinkEditPopoverOpenId( false );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t);\n\t\t\t}\n\t\t\treturn null;\n\t\t},\n\t\t[ customLinkEditPopoverOpenId, setIsCustomLinkEditPopoverOpenId ]\n\t);\n\n\t// Delay loading stop by 50ms to avoid flickering.\n\tuseEffect( () => {\n\t\tlet timeoutId;\n\t\tif ( shouldKeepLoading && ! isLoading ) {\n\t\t\tsetIsLoading( true );\n\t\t}\n\t\tif ( ! shouldKeepLoading && isLoading ) {\n\t\t\ttimeoutId = setTimeout( () => {\n\t\t\t\tsetIsLoading( false );\n\t\t\t\ttimeoutId = undefined;\n\t\t\t}, 50 );\n\t\t}\n\t\treturn () => {\n\t\t\tif ( timeoutId ) {\n\t\t\t\tclearTimeout( timeoutId );\n\t\t\t}\n\t\t};\n\t}, [ shouldKeepLoading, clientIdsTree, isLoading ] );\n\n\tconst { OffCanvasEditor, LeafMoreMenu } = unlock( blockEditorPrivateApis );\n\n\tconst offCanvasOnselect = useCallback(\n\t\t( block ) => {\n\t\t\tif (\n\t\t\t\tblock.name === 'core/navigation-link' &&\n\t\t\t\t! block.attributes.url\n\t\t\t) {\n\t\t\t\t__unstableMarkNextChangeAsNotPersistent();\n\t\t\t\treplaceBlock(\n\t\t\t\t\tblock.clientId,\n\t\t\t\t\tcreateBlock( 'core/navigation-link', block.attributes )\n\t\t\t\t);\n\t\t\t} else if (\n\t\t\t\tblock.name === 'core/navigation-link' &&\n\t\t\t\tblock.attributes.kind === 'custom' &&\n\t\t\t\tblock.attributes.url\n\t\t\t) {\n\t\t\t\tsetIsCustomLinkEditPopoverOpenId( block.clientId );\n\t\t\t} else {\n\t\t\t\tonSelect( block );\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tonSelect,\n\t\t\t__unstableMarkNextChangeAsNotPersistent,\n\t\t\treplaceBlock,\n\t\t\tsetIsCustomLinkEditPopoverOpenId,\n\t\t]\n\t);\n\n\t// The hidden block is needed because it makes block edit side effects trigger.\n\t// For example a navigation page list load its items has an effect on edit to load its items.\n\treturn (\n\t\t<>\n\t\t\t{ isLoading && <NavigationMenuLoader /> }\n\t\t\t{ ! isLoading && (\n\t\t\t\t<OffCanvasEditor\n\t\t\t\t\tblocks={\n\t\t\t\t\t\tisSinglePageList\n\t\t\t\t\t\t\t? clientIdsTree[ 0 ].innerBlocks\n\t\t\t\t\t\t\t: clientIdsTree\n\t\t\t\t\t}\n\t\t\t\t\tonSelect={ offCanvasOnselect }\n\t\t\t\t\tLeafMoreMenu={ LeafMoreMenu }\n\t\t\t\t\tshowAppender={ false }\n\t\t\t\t\trenderAdditionalBlockUI={ renderAdditionalBlockUICallback }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t<div style={ { visibility: 'hidden' } }>\n\t\t\t\t<BlockTools>\n\t\t\t\t\t<BlockList />\n\t\t\t\t</BlockTools>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"]}

package/build/components/site-hub/index.js

@@ -25,6 +25,8 @@ var _blockEditor = require("@wordpress/block-editor");
 
 var _coreData = require("@wordpress/core-data");
 
+var _htmlEntities = require("@wordpress/html-entities");
+
 var _store = require("../../store");
 
 var _siteIcon = _interopRequireDefault(require("../site-icon"));
@@ -45,10 +47,8 @@ var _privateApis = require("../../private-apis");
 const HUB_ANIMATION_DURATION = 0.3;
 const SiteHub = (0, _element.forwardRef)((props, ref) => {
   const {
-    canvasMode,
-    dashboardLink
+    canvasMode
   } = (0, _data.useSelect)(select => {
-    select(_store.store).getEditedPostType();
     const {
       getCanvasMode,
       getSettings
@@ -65,16 +65,13 @@ const SiteHub = (0, _element.forwardRef)((props, ref) => {
   const {
     clearSelectedBlock
   } = (0, _data.useDispatch)(_blockEditor.store);
-  const isBackToDashboardButton = canvasMode === 'view';
-  const showLabels = canvasMode !== 'edit';
-  const siteIconButtonProps = isBackToDashboardButton ? {
-    href: dashboardLink || 'index.php',
-    'aria-label': (0, _i18n.__)('Go back to the dashboard')
-  } : {
-    label: (0, _i18n.__)('Open Navigation Sidebar'),
+  const siteIconButtonProps = {
+    label: (0, _i18n.__)('Open Admin Sidebar'),
     onClick: () => {
-      clearSelectedBlock();
-      setCanvasMode('view');
+      if (canvasMode === 'edit') {
+        clearSelectedBlock();
+        setCanvasMode('view');
+      }
     }
   };
   const siteTitle = (0, _data.useSelect)(select => {
@@ -86,7 +83,7 @@ const SiteHub = (0, _element.forwardRef)((props, ref) => {
     ref: ref
   }, props, {
     className: (0, _classnames.default)('edit-site-site-hub', props.className),
-    layout: true,
+    initial: false,
     transition: {
       type: 'tween',
       duration: disableMotion ? 0 : HUB_ANIMATION_DURATION,
@@ -106,11 +103,37 @@ const SiteHub = (0, _element.forwardRef)((props, ref) => {
     }
   }, (0, _element.createElement)(_components.Button, (0, _extends2.default)({}, siteIconButtonProps, {
     className: "edit-site-layout__view-mode-toggle"
-  }), (0, _element.createElement)(_siteIcon.default, {
+  }), (0, _element.createElement)(_components.__unstableMotion.div, {
+    initial: false,
+    animate: {
+      scale: canvasMode === 'view' ? 0.5 : 1
+    },
+    whileHover: {
+      scale: canvasMode === 'view' ? 0.5 : 0.96
+    },
+    transition: {
+      type: 'tween',
+      duration: disableMotion ? 0 : HUB_ANIMATION_DURATION,
+      ease: 'easeOut'
+    }
+  }, (0, _element.createElement)(_siteIcon.default, {
     className: "edit-site-layout__view-mode-toggle-icon"
-  }))), showLabels && (0, _element.createElement)("div", {
-    className: "edit-site-site-hub__site-title"
-  }, siteTitle)));
+  })))), (0, _element.createElement)(_components.__unstableAnimatePresence, null, (0, _element.createElement)(_components.__unstableMotion.div, {
+    layout: canvasMode === 'edit',
+    animate: {
+      opacity: canvasMode === 'view' ? 1 : 0
+    },
+    exit: {
+      opacity: 0
+    },
+    className: "edit-site-site-hub__site-title",
+    transition: {
+      type: 'tween',
+      duration: disableMotion ? 0 : 0.2,
+      ease: 'easeOut',
+      delay: canvasMode === 'view' ? 0.1 : 0
+    }
+  }, (0, _htmlEntities.decodeEntities)(siteTitle)))));
 });
 var _default = SiteHub;
 exports.default = _default;

package/build/components/site-hub/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/site-hub/index.js"],"names":["HUB_ANIMATION_DURATION","SiteHub","props","ref","canvasMode","dashboardLink","select","editSiteStore","getEditedPostType","getCanvasMode","getSettings","__experimentalDashboardLink","disableMotion","setCanvasMode","clearSelectedBlock","blockEditorStore","isBackToDashboardButton","showLabels","siteIconButtonProps","href","label","onClick","siteTitle","coreStore","getEntityRecord","title","className","type","duration","ease"],"mappings":";;;;;;;;;AAkBA;;;;AAfA;;AAKA;;AACA;;AAKA;;AACA;;AACA;;AACA;;AAMA;;AACA;;AACA;;AAzBA;AACA;AACA;;AAGA;AACA;AACA;;AAaA;AACA;AACA;AAKA,MAAMA,sBAAsB,GAAG,GAA/B;AAEA,MAAMC,OAAO,GAAG,yBAAY,CAAEC,KAAF,EAASC,GAAT,KAAkB;AAC7C,QAAM;AAAEC,IAAAA,UAAF;AAAcC,IAAAA;AAAd,MAAgC,qBAAaC,MAAF,IAAc;AAC9DA,IAAAA,MAAM,CAAEC,YAAF,CAAN,CAAwBC,iBAAxB;AACA,UAAM;AAAEC,MAAAA,aAAF;AAAiBC,MAAAA;AAAjB,QAAiC,yBACtCJ,MAAM,CAAEC,YAAF,CADgC,CAAvC;AAGA,WAAO;AACNH,MAAAA,UAAU,EAAEK,aAAa,EADnB;AAENJ,MAAAA,aAAa,EAAEK,WAAW,GAAGC;AAFvB,KAAP;AAIA,GATqC,EASnC,EATmC,CAAtC;AAUA,QAAMC,aAAa,GAAG,gCAAtB;AACA,QAAM;AAAEC,IAAAA;AAAF,MAAoB,yBAAQ,uBAAaN,YAAb,CAAR,CAA1B;AACA,QAAM;AAAEO,IAAAA;AAAF,MAAyB,uBAAaC,kBAAb,CAA/B;AACA,QAAMC,uBAAuB,GAAGZ,UAAU,KAAK,MAA/C;AACA,QAAMa,UAAU,GAAGb,UAAU,KAAK,MAAlC;AACA,QAAMc,mBAAmB,GAAGF,uBAAuB,GAChD;AACAG,IAAAA,IAAI,EAAEd,aAAa,IAAI,WADvB;AAEA,kBAAc,cAAI,0BAAJ;AAFd,GADgD,GAKhD;AACAe,IAAAA,KAAK,EAAE,cAAI,yBAAJ,CADP;AAEAC,IAAAA,OAAO,EAAE,MAAM;AACdP,MAAAA,kBAAkB;AAClBD,MAAAA,aAAa,CAAE,MAAF,CAAb;AACA;AALD,GALH;AAYA,QAAMS,SAAS,GAAG,qBACfhB,MAAF;AAAA;;AAAA,oCACCA,MAAM,CAAEiB,eAAF,CAAN,CAAoBC,eAApB,CAAqC,MAArC,EAA6C,MAA7C,CADD,0DACC,sBAAuDC,KADxD;AAAA,GADiB,EAGjB,EAHiB,CAAlB;AAMA,SACC,4BAAC,4BAAD,CAAQ,GAAR;AACC,IAAA,GAAG,EAAGtB;AADP,KAEMD,KAFN;AAGC,IAAA,SAAS,EAAG,yBAAY,oBAAZ,EAAkCA,KAAK,CAACwB,SAAxC,CAHb;AAIC,IAAA,MAAM,MAJP;AAKC,IAAA,UAAU,EAAG;AACZC,MAAAA,IAAI,EAAE,OADM;AAEZC,MAAAA,QAAQ,EAAEhB,aAAa,GAAG,CAAH,GAAOZ,sBAFlB;AAGZ6B,MAAAA,IAAI,EAAE;AAHM;AALd,MAWC,4BAAC,gCAAD;AACC,IAAA,OAAO,EAAC,YADT;AAEC,IAAA,SAAS,EAAC,kCAFX;AAGC,IAAA,OAAO,EAAC;AAHT,KAKC,4BAAC,4BAAD,CAAQ,GAAR;AACC,IAAA,SAAS,EAAC,gDADX;AAEC,IAAA,MAAM,MAFP;AAGC,IAAA,UAAU,EAAG;AACZF,MAAAA,IAAI,EAAE,OADM;AAEZC,MAAAA,QAAQ,EAAEhB,aAAa,GAAG,CAAH,GAAOZ,sBAFlB;AAGZ6B,MAAAA,IAAI,EAAE;AAHM;AAHd,KASC,4BAAC,kBAAD,6BACMX,mBADN;AAEC,IAAA,SAAS,EAAC;AAFX,MAIC,4BAAC,iBAAD;AAAU,IAAA,SAAS,EAAC;AAApB,IAJD,CATD,CALD,EAsBGD,UAAU,IACX;AAAK,IAAA,SAAS,EAAC;AAAf,KACGK,SADH,CAvBF,CAXD,CADD;AA0CA,CA5Ee,CAAhB;eA8EerB,O","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tButton,\n\t__unstableMotion as motion,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useReducedMotion } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport SiteIcon from '../site-icon';\nimport { unlock } from '../../private-apis';\n\nconst HUB_ANIMATION_DURATION = 0.3;\n\nconst SiteHub = forwardRef( ( props, ref ) => {\n\tconst { canvasMode, dashboardLink } = useSelect( ( select ) => {\n\t\tselect( editSiteStore ).getEditedPostType();\n\t\tconst { getCanvasMode, getSettings } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\t\treturn {\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tdashboardLink: getSettings().__experimentalDashboardLink,\n\t\t};\n\t}, [] );\n\tconst disableMotion = useReducedMotion();\n\tconst { setCanvasMode } = unlock( useDispatch( editSiteStore ) );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst isBackToDashboardButton = canvasMode === 'view';\n\tconst showLabels = canvasMode !== 'edit';\n\tconst siteIconButtonProps = isBackToDashboardButton\n\t\t? {\n\t\t\t\thref: dashboardLink || 'index.php',\n\t\t\t\t'aria-label': __( 'Go back to the dashboard' ),\n\t\t  }\n\t\t: {\n\t\t\t\tlabel: __( 'Open Navigation Sidebar' ),\n\t\t\t\tonClick: () => {\n\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\tsetCanvasMode( 'view' );\n\t\t\t\t},\n\t\t  };\n\tconst siteTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityRecord( 'root', 'site' )?.title,\n\t\t[]\n\t);\n\n\treturn (\n\t\t<motion.div\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames( 'edit-site-site-hub', props.className ) }\n\t\t\tlayout\n\t\t\ttransition={ {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: disableMotion ? 0 : HUB_ANIMATION_DURATION,\n\t\t\t\tease: 'easeOut',\n\t\t\t} }\n\t\t>\n\t\t\t<HStack\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tclassName=\"edit-site-site-hub__text-content\"\n\t\t\t\tspacing=\"0\"\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-site-hub__view-mode-toggle-container\"\n\t\t\t\t\tlayout\n\t\t\t\t\ttransition={ {\n\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\tduration: disableMotion ? 0 : HUB_ANIMATION_DURATION,\n\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{ ...siteIconButtonProps }\n\t\t\t\t\t\tclassName=\"edit-site-layout__view-mode-toggle\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<SiteIcon className=\"edit-site-layout__view-mode-toggle-icon\" />\n\t\t\t\t\t</Button>\n\t\t\t\t</motion.div>\n\n\t\t\t\t{ showLabels && (\n\t\t\t\t\t<div className=\"edit-site-site-hub__site-title\">\n\t\t\t\t\t\t{ siteTitle }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</motion.div>\n\t);\n} );\n\nexport default SiteHub;\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/site-hub/index.js"],"names":["HUB_ANIMATION_DURATION","SiteHub","props","ref","canvasMode","select","getCanvasMode","getSettings","editSiteStore","dashboardLink","__experimentalDashboardLink","disableMotion","setCanvasMode","clearSelectedBlock","blockEditorStore","siteIconButtonProps","label","onClick","siteTitle","coreStore","getEntityRecord","title","className","type","duration","ease","scale","opacity","delay"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tButton,\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__experimentalHStack as HStack,\n} from '@wordpress/components';\nimport { useReducedMotion } from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { store as blockEditorStore } from '@wordpress/block-editor';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport SiteIcon from '../site-icon';\nimport { unlock } from '../../private-apis';\n\nconst HUB_ANIMATION_DURATION = 0.3;\n\nconst SiteHub = forwardRef( ( props, ref ) => {\n\tconst { canvasMode } = useSelect( ( select ) => {\n\t\tconst { getCanvasMode, getSettings } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\t\treturn {\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tdashboardLink: getSettings().__experimentalDashboardLink,\n\t\t};\n\t}, [] );\n\tconst disableMotion = useReducedMotion();\n\tconst { setCanvasMode } = unlock( useDispatch( editSiteStore ) );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst siteIconButtonProps = {\n\t\tlabel: __( 'Open Admin Sidebar' ),\n\t\tonClick: () => {\n\t\t\tif ( canvasMode === 'edit' ) {\n\t\t\t\tclearSelectedBlock();\n\t\t\t\tsetCanvasMode( 'view' );\n\t\t\t}\n\t\t},\n\t};\n\tconst siteTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityRecord( 'root', 'site' )?.title,\n\t\t[]\n\t);\n\n\treturn (\n\t\t<motion.div\n\t\t\tref={ ref }\n\t\t\t{ ...props }\n\t\t\tclassName={ classnames( 'edit-site-site-hub', props.className ) }\n\t\t\tinitial={ false }\n\t\t\ttransition={ {\n\t\t\t\ttype: 'tween',\n\t\t\t\tduration: disableMotion ? 0 : HUB_ANIMATION_DURATION,\n\t\t\t\tease: 'easeOut',\n\t\t\t} }\n\t\t>\n\t\t\t<HStack\n\t\t\t\tjustify=\"flex-start\"\n\t\t\t\tclassName=\"edit-site-site-hub__text-content\"\n\t\t\t\tspacing=\"0\"\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-site-hub__view-mode-toggle-container\"\n\t\t\t\t\tlayout\n\t\t\t\t\ttransition={ {\n\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\tduration: disableMotion ? 0 : HUB_ANIMATION_DURATION,\n\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t} }\n\t\t\t\t>\n\t\t\t\t\t<Button\n\t\t\t\t\t\t{ ...siteIconButtonProps }\n\t\t\t\t\t\tclassName=\"edit-site-layout__view-mode-toggle\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\tscale: canvasMode === 'view' ? 0.5 : 1,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\twhileHover={ {\n\t\t\t\t\t\t\t\tscale: canvasMode === 'view' ? 0.5 : 0.96,\n\t\t\t\t\t\t\t} }\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\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t: HUB_ANIMATION_DURATION,\n\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<SiteIcon className=\"edit-site-layout__view-mode-toggle-icon\" />\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t</Button>\n\t\t\t\t</motion.div>\n\n\t\t\t\t<AnimatePresence>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tlayout={ canvasMode === 'edit' }\n\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\topacity: canvasMode === 'view' ? 1 : 0,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tclassName=\"edit-site-site-hub__site-title\"\n\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\tduration: disableMotion ? 0 : 0.2,\n\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\tdelay: canvasMode === 'view' ? 0.1 : 0,\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ decodeEntities( siteTitle ) }\n\t\t\t\t\t</motion.div>\n\t\t\t\t</AnimatePresence>\n\t\t\t</HStack>\n\t\t</motion.div>\n\t);\n} );\n\nexport default SiteHub;\n"]}

package/build/components/site-icon/index.js

@@ -37,18 +37,19 @@ function SiteIcon(_ref) {
     siteIconUrl
   } = (0, _data.useSelect)(select => {
     const {
-      getEntityRecord,
-      isResolving
+      getEntityRecord
     } = select(_coreData.store);
-    const siteData = getEntityRecord('root', '__unstableBase', undefined) || {};
+    const siteData = getEntityRecord('root', '__unstableBase', undefined);
     return {
-      isRequestingSite: isResolving('core', 'getEntityRecord', ['root', '__unstableBase', undefined]),
-      siteIconUrl: siteData.site_icon_url
+      isRequestingSite: !siteData,
+      siteIconUrl: siteData === null || siteData === void 0 ? void 0 : siteData.site_icon_url
     };
   }, []);
 
   if (isRequestingSite && !siteIconUrl) {
-    return null;
+    return (0, _element.createElement)("div", {
+      className: "edit-site-site-icon__image"
+    });
   }
 
   const icon = siteIconUrl ? (0, _element.createElement)("img", {
@@ -57,7 +58,7 @@ function SiteIcon(_ref) {
     src: siteIconUrl
   }) : (0, _element.createElement)(_components.Icon, {
     className: "edit-site-site-icon__icon",
-    size: "32px",
+    size: "48px",
     icon: _icons.wordpress
   });
   return (0, _element.createElement)("div", {

package/build/components/site-icon/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/site-icon/index.js"],"names":["SiteIcon","className","isRequestingSite","siteIconUrl","select","getEntityRecord","isResolving","coreDataStore","siteData","undefined","site_icon_url","icon","wordpress"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAZA;AACA;AACA;;AAGA;AACA;AACA;AAOA,SAASA,QAAT,OAAmC;AAAA,MAAhB;AAAEC,IAAAA;AAAF,GAAgB;AAClC,QAAM;AAAEC,IAAAA,gBAAF;AAAoBC,IAAAA;AAApB,MAAoC,qBAAaC,MAAF,IAAc;AAClE,UAAM;AAAEC,MAAAA,eAAF;AAAmBC,MAAAA;AAAnB,QAAmCF,MAAM,CAAEG,eAAF,CAA/C;AACA,UAAMC,QAAQ,GACbH,eAAe,CAAE,MAAF,EAAU,gBAAV,EAA4BI,SAA5B,CAAf,IAA0D,EAD3D;AAGA,WAAO;AACNP,MAAAA,gBAAgB,EAAEI,WAAW,CAAE,MAAF,EAAU,iBAAV,EAA6B,CACzD,MADyD,EAEzD,gBAFyD,EAGzDG,SAHyD,CAA7B,CADvB;AAMNN,MAAAA,WAAW,EAAEK,QAAQ,CAACE;AANhB,KAAP;AAQA,GAbyC,EAavC,EAbuC,CAA1C;;AAeA,MAAKR,gBAAgB,IAAI,CAAEC,WAA3B,EAAyC;AACxC,WAAO,IAAP;AACA;;AAED,QAAMQ,IAAI,GAAGR,WAAW,GACvB;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,GAAG,EAAG,cAAI,WAAJ,CAFP;AAGC,IAAA,GAAG,EAAGA;AAHP,IADuB,GAOvB,4BAAC,gBAAD;AACC,IAAA,SAAS,EAAC,2BADX;AAEC,IAAA,IAAI,EAAC,MAFN;AAGC,IAAA,IAAI,EAAGS;AAHR,IAPD;AAcA,SACC;AAAK,IAAA,SAAS,EAAG,yBAAYX,SAAZ,EAAuB,qBAAvB;AAAjB,KACGU,IADH,CADD;AAKA;;eAEcX,Q","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { Icon } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { wordpress } from '@wordpress/icons';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\nfunction SiteIcon( { className } ) {\n\tconst { isRequestingSite, siteIconUrl } = useSelect( ( select ) => {\n\t\tconst { getEntityRecord, isResolving } = select( coreDataStore );\n\t\tconst siteData =\n\t\t\tgetEntityRecord( 'root', '__unstableBase', undefined ) || {};\n\n\t\treturn {\n\t\t\tisRequestingSite: isResolving( 'core', 'getEntityRecord', [\n\t\t\t\t'root',\n\t\t\t\t'__unstableBase',\n\t\t\t\tundefined,\n\t\t\t] ),\n\t\t\tsiteIconUrl: siteData.site_icon_url,\n\t\t};\n\t}, [] );\n\n\tif ( isRequestingSite && ! siteIconUrl ) {\n\t\treturn null;\n\t}\n\n\tconst icon = siteIconUrl ? (\n\t\t<img\n\t\t\tclassName=\"edit-site-site-icon__image\"\n\t\t\talt={ __( 'Site Icon' ) }\n\t\t\tsrc={ siteIconUrl }\n\t\t/>\n\t) : (\n\t\t<Icon\n\t\t\tclassName=\"edit-site-site-icon__icon\"\n\t\t\tsize=\"32px\"\n\t\t\ticon={ wordpress }\n\t\t/>\n\t);\n\n\treturn (\n\t\t<div className={ classnames( className, 'edit-site-site-icon' ) }>\n\t\t\t{ icon }\n\t\t</div>\n\t);\n}\n\nexport default SiteIcon;\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/site-icon/index.js"],"names":["SiteIcon","className","isRequestingSite","siteIconUrl","select","getEntityRecord","coreDataStore","siteData","undefined","site_icon_url","icon","wordpress"],"mappings":";;;;;;;;;;;AAGA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AAZA;AACA;AACA;;AAGA;AACA;AACA;AAOA,SAASA,QAAT,OAAmC;AAAA,MAAhB;AAAEC,IAAAA;AAAF,GAAgB;AAClC,QAAM;AAAEC,IAAAA,gBAAF;AAAoBC,IAAAA;AAApB,MAAoC,qBAAaC,MAAF,IAAc;AAClE,UAAM;AAAEC,MAAAA;AAAF,QAAsBD,MAAM,CAAEE,eAAF,CAAlC;AACA,UAAMC,QAAQ,GAAGF,eAAe,CAAE,MAAF,EAAU,gBAAV,EAA4BG,SAA5B,CAAhC;AAEA,WAAO;AACNN,MAAAA,gBAAgB,EAAE,CAAEK,QADd;AAENJ,MAAAA,WAAW,EAAEI,QAAF,aAAEA,QAAF,uBAAEA,QAAQ,CAAEE;AAFjB,KAAP;AAIA,GARyC,EAQvC,EARuC,CAA1C;;AAUA,MAAKP,gBAAgB,IAAI,CAAEC,WAA3B,EAAyC;AACxC,WAAO;AAAK,MAAA,SAAS,EAAC;AAAf,MAAP;AACA;;AAED,QAAMO,IAAI,GAAGP,WAAW,GACvB;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,GAAG,EAAG,cAAI,WAAJ,CAFP;AAGC,IAAA,GAAG,EAAGA;AAHP,IADuB,GAOvB,4BAAC,gBAAD;AACC,IAAA,SAAS,EAAC,2BADX;AAEC,IAAA,IAAI,EAAC,MAFN;AAGC,IAAA,IAAI,EAAGQ;AAHR,IAPD;AAcA,SACC;AAAK,IAAA,SAAS,EAAG,yBAAYV,SAAZ,EAAuB,qBAAvB;AAAjB,KACGS,IADH,CADD;AAKA;;eAEcV,Q","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { Icon } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { wordpress } from '@wordpress/icons';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\nfunction SiteIcon( { className } ) {\n\tconst { isRequestingSite, siteIconUrl } = useSelect( ( select ) => {\n\t\tconst { getEntityRecord } = select( coreDataStore );\n\t\tconst siteData = getEntityRecord( 'root', '__unstableBase', undefined );\n\n\t\treturn {\n\t\t\tisRequestingSite: ! siteData,\n\t\t\tsiteIconUrl: siteData?.site_icon_url,\n\t\t};\n\t}, [] );\n\n\tif ( isRequestingSite && ! siteIconUrl ) {\n\t\treturn <div className=\"edit-site-site-icon__image\" />;\n\t}\n\n\tconst icon = siteIconUrl ? (\n\t\t<img\n\t\t\tclassName=\"edit-site-site-icon__image\"\n\t\t\talt={ __( 'Site Icon' ) }\n\t\t\tsrc={ siteIconUrl }\n\t\t/>\n\t) : (\n\t\t<Icon\n\t\t\tclassName=\"edit-site-site-icon__icon\"\n\t\t\tsize=\"48px\"\n\t\t\ticon={ wordpress }\n\t\t/>\n\t);\n\n\treturn (\n\t\t<div className={ classnames( className, 'edit-site-site-icon' ) }>\n\t\t\t{ icon }\n\t\t</div>\n\t);\n}\n\nexport default SiteIcon;\n"]}

package/build/components/start-template-options/index.js

@@ -54,7 +54,7 @@ function useFallbackTemplateContent(slug) {
       } = _ref;
       return setTemplateContent(content.raw);
     });
-  }, [slug]);
+  }, [isCustom, slug]);
   return templateContent;
 }
 
@@ -147,7 +147,8 @@ function StartModal(_ref3) {
     title: (0, _i18n.__)('Choose a pattern'),
     closeLabel: (0, _i18n.__)('Cancel'),
     focusOnMount: "firstElement",
-    onRequestClose: onClose
+    onRequestClose: onClose,
+    isFullScreen: true
   }, (0, _element.createElement)("div", {
     className: "edit-site-start-template-options__modal-content"
   }, (0, _element.createElement)(PatternSelection, {
@@ -169,7 +170,7 @@ const START_TEMPLATE_MODAL_STATES = {
 function StartTemplateOptions() {
   const [modalState, setModalState] = (0, _element.useState)(START_TEMPLATE_MODAL_STATES.INITIAL);
   const {
-    shouldOpenModel,
+    shouldOpenModal,
     slug,
     isCustom,
     postType
@@ -183,20 +184,20 @@ function StartTemplateOptions() {
 
     const postId = getEditedPostId();
     const {
-      __experimentalGetDirtyEntityRecords,
-      getEditedEntityRecord
+      getEditedEntityRecord,
+      hasEditsForEntityRecord
     } = select(_coreData.store);
     const templateRecord = getEditedEntityRecord('postType', _postType, postId);
-    const hasDirtyEntityRecords = __experimentalGetDirtyEntityRecords().length > 0;
+    const hasEdits = hasEditsForEntityRecord('postType', _postType, postId);
     return {
-      shouldOpenModel: !hasDirtyEntityRecords && '' === templateRecord.content && 'wp_template' === _postType && !select(_preferences.store).get('core/edit-site', 'welcomeGuide'),
+      shouldOpenModal: !hasEdits && '' === templateRecord.content && 'wp_template' === _postType && !select(_preferences.store).get('core/edit-site', 'welcomeGuide'),
       slug: templateRecord.slug,
       isCustom: templateRecord.is_custom,
       postType: _postType
     };
   }, []);
 
-  if (modalState === START_TEMPLATE_MODAL_STATES.INITIAL && !shouldOpenModel || modalState === START_TEMPLATE_MODAL_STATES.CLOSED) {
+  if (modalState === START_TEMPLATE_MODAL_STATES.INITIAL && !shouldOpenModal || modalState === START_TEMPLATE_MODAL_STATES.CLOSED) {
     return null;
   }
 

package/build/components/start-template-options/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/start-template-options/index.js"],"names":["useFallbackTemplateContent","slug","isCustom","templateContent","setTemplateContent","path","is_custom","ignore_empty","then","content","raw","START_BLANK_TITLE","useStartPatterns","fallbackContent","patterns","select","getEditedPostType","getEditedPostId","editSiteStore","getEntityRecord","coreStore","postId","postType","record","getSettings","blockEditorStore","__experimentalBlockPatterns","name","blocks","title","filter","pattern","Array","isArray","templateTypes","some","templateType","startsWith","map","PatternSelection","onChoosePattern","onChange","blockPatterns","shownBlockPatterns","selection","undefined","StartModal","onClose","START_TEMPLATE_MODAL_STATES","INITIAL","CLOSED","StartTemplateOptions","modalState","setModalState","shouldOpenModel","_postType","__experimentalGetDirtyEntityRecords","getEditedEntityRecord","templateRecord","hasDirtyEntityRecords","length","preferencesStore","get"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Modal } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useEffect, useMemo } from '@wordpress/element';\nimport {\n\t__experimentalBlockPatternsList as BlockPatternsList,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useSelect } from '@wordpress/data';\nimport { useAsyncList } from '@wordpress/compose';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { parse } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { store as coreStore, useEntityBlockEditor } from '@wordpress/core-data';\nimport apiFetch from '@wordpress/api-fetch';\nimport { addQueryArgs } from '@wordpress/url';\n\nfunction useFallbackTemplateContent( slug, isCustom = false ) {\n\tconst [ templateContent, setTemplateContent ] = useState( '' );\n\n\tuseEffect( () => {\n\t\tapiFetch( {\n\t\t\tpath: addQueryArgs( '/wp/v2/templates/lookup', {\n\t\t\t\tslug,\n\t\t\t\tis_custom: isCustom,\n\t\t\t\tignore_empty: true,\n\t\t\t} ),\n\t\t} ).then( ( { content } ) => setTemplateContent( content.raw ) );\n\t}, [ slug ] );\n\treturn templateContent;\n}\n\nconst START_BLANK_TITLE = __( 'Start blank' );\n\nfunction useStartPatterns( fallbackContent ) {\n\tconst { slug, patterns } = useSelect( ( select ) => {\n\t\tconst { getEditedPostType, getEditedPostId } = select( editSiteStore );\n\t\tconst { getEntityRecord } = select( coreStore );\n\t\tconst postId = getEditedPostId();\n\t\tconst postType = getEditedPostType();\n\t\tconst record = getEntityRecord( 'postType', postType, postId );\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\treturn {\n\t\t\tslug: record.slug,\n\t\t\tpatterns: getSettings().__experimentalBlockPatterns,\n\t\t};\n\t}, [] );\n\n\treturn useMemo( () => {\n\t\t// filter patterns that are supposed to be used in the current template being edited.\n\t\treturn [\n\t\t\t{\n\t\t\t\tname: 'fallback',\n\t\t\t\tblocks: parse( fallbackContent ),\n\t\t\t\ttitle: __( 'Fallback content' ),\n\t\t\t},\n\t\t\t...patterns\n\t\t\t\t.filter( ( pattern ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\tArray.isArray( pattern.templateTypes ) &&\n\t\t\t\t\t\tpattern.templateTypes.some( ( templateType ) =>\n\t\t\t\t\t\t\tslug.startsWith( templateType )\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} )\n\t\t\t\t.map( ( pattern ) => {\n\t\t\t\t\treturn { ...pattern, blocks: parse( pattern.content ) };\n\t\t\t\t} ),\n\t\t\t{\n\t\t\t\tname: 'start-blank',\n\t\t\t\tblocks: parse(\n\t\t\t\t\t'<!-- wp:paragraph --><p></p><!-- /wp:paragraph -->'\n\t\t\t\t),\n\t\t\t\ttitle: START_BLANK_TITLE,\n\t\t\t},\n\t\t];\n\t}, [ fallbackContent, slug, patterns ] );\n}\n\nfunction PatternSelection( { fallbackContent, onChoosePattern, postType } ) {\n\tconst [ , , onChange ] = useEntityBlockEditor( 'postType', postType );\n\tconst blockPatterns = useStartPatterns( fallbackContent );\n\tconst shownBlockPatterns = useAsyncList( blockPatterns );\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"edit-site-start-template-options__pattern-container\"\n\t\t\tstyle={ {\n\t\t\t\t'--wp-edit-site-start-template-options-start-blank': `\"${ START_BLANK_TITLE }\"`,\n\t\t\t} }\n\t\t>\n\t\t\t<BlockPatternsList\n\t\t\t\tblockPatterns={ blockPatterns }\n\t\t\t\tshownPatterns={ shownBlockPatterns }\n\t\t\t\tonClickPattern={ ( pattern, blocks ) => {\n\t\t\t\t\tonChange( 'start-blank' === pattern.name ? [] : blocks, {\n\t\t\t\t\t\tselection: undefined,\n\t\t\t\t\t} );\n\t\t\t\t\tonChoosePattern();\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction StartModal( { slug, isCustom, onClose, postType } ) {\n\tconst fallbackContent = useFallbackTemplateContent( slug, isCustom );\n\tif ( ! fallbackContent ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<Modal\n\t\t\tclassName=\"edit-site-start-template-options__modal\"\n\t\t\ttitle={ __( 'Choose a pattern' ) }\n\t\t\tcloseLabel={ __( 'Cancel' ) }\n\t\t\tfocusOnMount=\"firstElement\"\n\t\t\tonRequestClose={ onClose }\n\t\t>\n\t\t\t<div className=\"edit-site-start-template-options__modal-content\">\n\t\t\t\t<PatternSelection\n\t\t\t\t\tfallbackContent={ fallbackContent }\n\t\t\t\t\tslug={ slug }\n\t\t\t\t\tisCustom={ isCustom }\n\t\t\t\t\tpostType={ postType }\n\t\t\t\t\tonChoosePattern={ () => {\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n}\n\nconst START_TEMPLATE_MODAL_STATES = {\n\tINITIAL: 'INITIAL',\n\tCLOSED: 'CLOSED',\n};\n\nexport default function StartTemplateOptions() {\n\tconst [ modalState, setModalState ] = useState(\n\t\tSTART_TEMPLATE_MODAL_STATES.INITIAL\n\t);\n\tconst { shouldOpenModel, slug, isCustom, postType } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEditedPostType, getEditedPostId } =\n\t\t\t\tselect( editSiteStore );\n\t\t\tconst _postType = getEditedPostType();\n\t\t\tconst postId = getEditedPostId();\n\t\t\tconst {\n\t\t\t\t__experimentalGetDirtyEntityRecords,\n\t\t\t\tgetEditedEntityRecord,\n\t\t\t} = select( coreStore );\n\t\t\tconst templateRecord = getEditedEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t_postType,\n\t\t\t\tpostId\n\t\t\t);\n\n\t\t\tconst hasDirtyEntityRecords =\n\t\t\t\t__experimentalGetDirtyEntityRecords().length > 0;\n\n\t\t\treturn {\n\t\t\t\tshouldOpenModel:\n\t\t\t\t\t! hasDirtyEntityRecords &&\n\t\t\t\t\t'' === templateRecord.content &&\n\t\t\t\t\t'wp_template' === _postType &&\n\t\t\t\t\t! select( preferencesStore ).get(\n\t\t\t\t\t\t'core/edit-site',\n\t\t\t\t\t\t'welcomeGuide'\n\t\t\t\t\t),\n\t\t\t\tslug: templateRecord.slug,\n\t\t\t\tisCustom: templateRecord.is_custom,\n\t\t\t\tpostType: _postType,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tif (\n\t\t( modalState === START_TEMPLATE_MODAL_STATES.INITIAL &&\n\t\t\t! shouldOpenModel ) ||\n\t\tmodalState === START_TEMPLATE_MODAL_STATES.CLOSED\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StartModal\n\t\t\tslug={ slug }\n\t\t\tisCustom={ isCustom }\n\t\t\tpostType={ postType }\n\t\t\tonClose={ () =>\n\t\t\t\tsetModalState( START_TEMPLATE_MODAL_STATES.CLOSED )\n\t\t\t}\n\t\t/>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/start-template-options/index.js"],"names":["useFallbackTemplateContent","slug","isCustom","templateContent","setTemplateContent","path","is_custom","ignore_empty","then","content","raw","START_BLANK_TITLE","useStartPatterns","fallbackContent","patterns","select","getEditedPostType","getEditedPostId","editSiteStore","getEntityRecord","coreStore","postId","postType","record","getSettings","blockEditorStore","__experimentalBlockPatterns","name","blocks","title","filter","pattern","Array","isArray","templateTypes","some","templateType","startsWith","map","PatternSelection","onChoosePattern","onChange","blockPatterns","shownBlockPatterns","selection","undefined","StartModal","onClose","START_TEMPLATE_MODAL_STATES","INITIAL","CLOSED","StartTemplateOptions","modalState","setModalState","shouldOpenModal","_postType","getEditedEntityRecord","hasEditsForEntityRecord","templateRecord","hasEdits","preferencesStore","get"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { Modal } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useState, useEffect, useMemo } from '@wordpress/element';\nimport {\n\t__experimentalBlockPatternsList as BlockPatternsList,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useSelect } from '@wordpress/data';\nimport { useAsyncList } from '@wordpress/compose';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport { parse } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { store as coreStore, useEntityBlockEditor } from '@wordpress/core-data';\nimport apiFetch from '@wordpress/api-fetch';\nimport { addQueryArgs } from '@wordpress/url';\n\nfunction useFallbackTemplateContent( slug, isCustom = false ) {\n\tconst [ templateContent, setTemplateContent ] = useState( '' );\n\n\tuseEffect( () => {\n\t\tapiFetch( {\n\t\t\tpath: addQueryArgs( '/wp/v2/templates/lookup', {\n\t\t\t\tslug,\n\t\t\t\tis_custom: isCustom,\n\t\t\t\tignore_empty: true,\n\t\t\t} ),\n\t\t} ).then( ( { content } ) => setTemplateContent( content.raw ) );\n\t}, [ isCustom, slug ] );\n\treturn templateContent;\n}\n\nconst START_BLANK_TITLE = __( 'Start blank' );\n\nfunction useStartPatterns( fallbackContent ) {\n\tconst { slug, patterns } = useSelect( ( select ) => {\n\t\tconst { getEditedPostType, getEditedPostId } = select( editSiteStore );\n\t\tconst { getEntityRecord } = select( coreStore );\n\t\tconst postId = getEditedPostId();\n\t\tconst postType = getEditedPostType();\n\t\tconst record = getEntityRecord( 'postType', postType, postId );\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\treturn {\n\t\t\tslug: record.slug,\n\t\t\tpatterns: getSettings().__experimentalBlockPatterns,\n\t\t};\n\t}, [] );\n\n\treturn useMemo( () => {\n\t\t// filter patterns that are supposed to be used in the current template being edited.\n\t\treturn [\n\t\t\t{\n\t\t\t\tname: 'fallback',\n\t\t\t\tblocks: parse( fallbackContent ),\n\t\t\t\ttitle: __( 'Fallback content' ),\n\t\t\t},\n\t\t\t...patterns\n\t\t\t\t.filter( ( pattern ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\tArray.isArray( pattern.templateTypes ) &&\n\t\t\t\t\t\tpattern.templateTypes.some( ( templateType ) =>\n\t\t\t\t\t\t\tslug.startsWith( templateType )\n\t\t\t\t\t\t)\n\t\t\t\t\t);\n\t\t\t\t} )\n\t\t\t\t.map( ( pattern ) => {\n\t\t\t\t\treturn { ...pattern, blocks: parse( pattern.content ) };\n\t\t\t\t} ),\n\t\t\t{\n\t\t\t\tname: 'start-blank',\n\t\t\t\tblocks: parse(\n\t\t\t\t\t'<!-- wp:paragraph --><p></p><!-- /wp:paragraph -->'\n\t\t\t\t),\n\t\t\t\ttitle: START_BLANK_TITLE,\n\t\t\t},\n\t\t];\n\t}, [ fallbackContent, slug, patterns ] );\n}\n\nfunction PatternSelection( { fallbackContent, onChoosePattern, postType } ) {\n\tconst [ , , onChange ] = useEntityBlockEditor( 'postType', postType );\n\tconst blockPatterns = useStartPatterns( fallbackContent );\n\tconst shownBlockPatterns = useAsyncList( blockPatterns );\n\n\treturn (\n\t\t<div\n\t\t\tclassName=\"edit-site-start-template-options__pattern-container\"\n\t\t\tstyle={ {\n\t\t\t\t'--wp-edit-site-start-template-options-start-blank': `\"${ START_BLANK_TITLE }\"`,\n\t\t\t} }\n\t\t>\n\t\t\t<BlockPatternsList\n\t\t\t\tblockPatterns={ blockPatterns }\n\t\t\t\tshownPatterns={ shownBlockPatterns }\n\t\t\t\tonClickPattern={ ( pattern, blocks ) => {\n\t\t\t\t\tonChange( 'start-blank' === pattern.name ? [] : blocks, {\n\t\t\t\t\t\tselection: undefined,\n\t\t\t\t\t} );\n\t\t\t\t\tonChoosePattern();\n\t\t\t\t} }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nfunction StartModal( { slug, isCustom, onClose, postType } ) {\n\tconst fallbackContent = useFallbackTemplateContent( slug, isCustom );\n\tif ( ! fallbackContent ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<Modal\n\t\t\tclassName=\"edit-site-start-template-options__modal\"\n\t\t\ttitle={ __( 'Choose a pattern' ) }\n\t\t\tcloseLabel={ __( 'Cancel' ) }\n\t\t\tfocusOnMount=\"firstElement\"\n\t\t\tonRequestClose={ onClose }\n\t\t\tisFullScreen={ true }\n\t\t>\n\t\t\t<div className=\"edit-site-start-template-options__modal-content\">\n\t\t\t\t<PatternSelection\n\t\t\t\t\tfallbackContent={ fallbackContent }\n\t\t\t\t\tslug={ slug }\n\t\t\t\t\tisCustom={ isCustom }\n\t\t\t\t\tpostType={ postType }\n\t\t\t\t\tonChoosePattern={ () => {\n\t\t\t\t\t\tonClose();\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</Modal>\n\t);\n}\n\nconst START_TEMPLATE_MODAL_STATES = {\n\tINITIAL: 'INITIAL',\n\tCLOSED: 'CLOSED',\n};\n\nexport default function StartTemplateOptions() {\n\tconst [ modalState, setModalState ] = useState(\n\t\tSTART_TEMPLATE_MODAL_STATES.INITIAL\n\t);\n\tconst { shouldOpenModal, slug, isCustom, postType } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getEditedPostType, getEditedPostId } =\n\t\t\t\tselect( editSiteStore );\n\t\t\tconst _postType = getEditedPostType();\n\t\t\tconst postId = getEditedPostId();\n\t\t\tconst { getEditedEntityRecord, hasEditsForEntityRecord } =\n\t\t\t\tselect( coreStore );\n\t\t\tconst templateRecord = getEditedEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t_postType,\n\t\t\t\tpostId\n\t\t\t);\n\t\t\tconst hasEdits = hasEditsForEntityRecord(\n\t\t\t\t'postType',\n\t\t\t\t_postType,\n\t\t\t\tpostId\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tshouldOpenModal:\n\t\t\t\t\t! hasEdits &&\n\t\t\t\t\t'' === templateRecord.content &&\n\t\t\t\t\t'wp_template' === _postType &&\n\t\t\t\t\t! select( preferencesStore ).get(\n\t\t\t\t\t\t'core/edit-site',\n\t\t\t\t\t\t'welcomeGuide'\n\t\t\t\t\t),\n\t\t\t\tslug: templateRecord.slug,\n\t\t\t\tisCustom: templateRecord.is_custom,\n\t\t\t\tpostType: _postType,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tif (\n\t\t( modalState === START_TEMPLATE_MODAL_STATES.INITIAL &&\n\t\t\t! shouldOpenModal ) ||\n\t\tmodalState === START_TEMPLATE_MODAL_STATES.CLOSED\n\t) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<StartModal\n\t\t\tslug={ slug }\n\t\t\tisCustom={ isCustom }\n\t\t\tpostType={ postType }\n\t\t\tonClose={ () =>\n\t\t\t\tsetModalState( START_TEMPLATE_MODAL_STATES.CLOSED )\n\t\t\t}\n\t\t/>\n\t);\n}\n"]}

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

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-exports.useHasStyleBook = useHasStyleBook;
 
 var _element = require("@wordpress/element");
 
@@ -24,14 +23,12 @@ var _blockEditor = require("@wordpress/block-editor");
 
 var _data = require("@wordpress/data");
 
-var _icons = require("@wordpress/icons");
-
 var _compose = require("@wordpress/compose");
 
-var _keycodes = require("@wordpress/keycodes");
-
 var _privateApis = require("../../private-apis");
 
+var _editorCanvasContainer = _interopRequireDefault(require("../editor-canvas-container"));
+
 /**
  * External dependencies
  */
@@ -46,12 +43,7 @@ var _privateApis = require("../../private-apis");
 const {
   ExperimentalBlockEditorProvider,
   useGlobalStyle
-} = (0, _privateApis.unlock)(_blockEditor.privateApis);
-const SLOT_FILL_NAME = 'EditSiteStyleBook';
-const {
-  Slot: StyleBookSlot,
-  Fill: StyleBookFill
-} = (0, _components.createSlotFill)(SLOT_FILL_NAME); // The content area of the Style Book is rendered within an iframe so that global styles
+} = (0, _privateApis.unlock)(_blockEditor.privateApis); // The content area of the Style Book is rendered within an iframe so that global styles
 // are applied to elements within the entire content area. To support elements that are
 // not part of the block previews, such as headings and layout for the block previews,
 // additional CSS rules need to be passed into the iframe. These are hard-coded below.
@@ -165,12 +157,9 @@ function getExamples() {
 function StyleBook(_ref) {
   let {
     isSelected,
-    onSelect,
-    onClose
+    onSelect
   } = _ref;
   const [resizeObserver, sizes] = (0, _compose.useResizeObserver)();
-  const focusOnMountRef = (0, _compose.useFocusOnMount)('firstElement');
-  const sectionFocusReturnRef = (0, _compose.useFocusReturn)();
   const [textColor] = useGlobalStyle('color.text');
   const [backgroundColor] = useGlobalStyle('color.background');
   const examples = (0, _element.useMemo)(getExamples, []);
@@ -183,32 +172,17 @@ function StyleBook(_ref) {
   const settings = (0, _element.useMemo)(() => ({ ...originalSettings,
     __unstableIsPreviewMode: true
   }), [originalSettings]);
-
-  function closeOnEscape(event) {
-    if (event.keyCode === _keycodes.ESCAPE && !event.defaultPrevented) {
-      event.preventDefault();
-      onClose();
-    }
-  }
-
-  return (0, _element.createElement)(StyleBookFill, null, (0, _element.createElement)("section", {
+  return (0, _element.createElement)(_editorCanvasContainer.default, {
+    closeButtonLabel: (0, _i18n.__)('Close Style Book')
+  }, (0, _element.createElement)("div", {
     className: (0, _classnames.default)('edit-site-style-book', {
       'is-wide': sizes.width > 600
     }),
     style: {
       color: textColor,
       background: backgroundColor
-    },
-    "aria-label": (0, _i18n.__)('Style Book'),
-    onKeyDown: closeOnEscape,
-    ref: (0, _compose.useMergeRefs)([sectionFocusReturnRef, focusOnMountRef])
-  }, resizeObserver, (0, _element.createElement)(_components.Button, {
-    className: "edit-site-style-book__close-button",
-    icon: _icons.closeSmall,
-    label: (0, _i18n.__)('Close Style Book'),
-    onClick: onClose,
-    showTooltip: false
-  }), (0, _element.createElement)(_components.TabPanel, {
+    }
+  }, resizeObserver, (0, _element.createElement)(_components.TabPanel, {
     className: "edit-site-style-book__tab-panel",
     tabs: tabs
   }, tab => (0, _element.createElement)(_blockEditor.__unstableIframe, {
@@ -301,12 +275,6 @@ const Example = _ref3 => {
   })))));
 };
 
-function useHasStyleBook() {
-  const fills = (0, _components.__experimentalUseSlotFills)(SLOT_FILL_NAME);
-  return !!(fills !== null && fills !== void 0 && fills.length);
-}
-
-StyleBook.Slot = StyleBookSlot;
 var _default = StyleBook;
 exports.default = _default;
 //# sourceMappingURL=index.js.map