npm - @wordpress/edit-site - Versions diffs - 5.24.1 → 5.25.1-next.79a6196f.0 - Mend

@wordpress/edit-site 5.24.1 → 5.25.1-next.79a6196f.0

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

Files changed (652) hide show

package/build-module/components/sidebar-navigation-screen-template/home-template-details.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__","debounce","useSelect","useDispatch","store","coreStore","CheckboxControl","__experimentalInputControl","InputControl","__experimentalNumberControl","NumberControl","__experimentalTruncate","Truncate","__experimentalItemGroup","ItemGroup","header","footer","layout","useMemo","useState","useEffect","decodeEntities","SidebarNavigationScreenDetailsPanel","SidebarNavigationScreenDetailsPanelRow","unlock","editSiteStore","useLink","SidebarNavigationItem","TEMPLATE_PART_POST_TYPE","EMPTY_OBJECT","TemplateAreaButton","postId","icon","title","_icons$icon","icons","linkInfo","postType","createElement","className","withChevron","limit","ellipsizeMode","numberOfLines","HomeTemplateDetails","editEntityRecord","allowCommentsOnNewPosts","templatePartAreas","postsPerPage","postsPageTitle","postsPageId","currentTemplateParts","select","getEntityRecord","getSettings","getCurrentTemplateTemplateParts","siteSettings","_postsPageRecord","page_for_posts","default_comment_status","rendered","id","posts_per_page","defaultTemplatePartAreas","commentsOnNewPostsValue","setCommentsOnNewPostsValue","postsCountValue","setPostsCountValue","postsPageTitleValue","setPostsPageTitleValue","templateAreas","templatePartIds","Set","filterOutDuplicateTemplateParts","currentTemplatePart","has","templatePart","add","length","filter","map","block","find","area","clientId","setAllowCommentsOnNewPosts","newValue","undefined","setPostsPageTitle","setPostsPerPage","Fragment","spacing","placeholder","size","value","onChange","label","help","spinControls","step","min","checked","theme","slug","key"],"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-template/home-template-details.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { debounce } from '@wordpress/compose';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport {\n\tCheckboxControl,\n\t__experimentalInputControl as InputControl,\n\t__experimentalNumberControl as NumberControl,\n\t__experimentalTruncate as Truncate,\n\t__experimentalItemGroup as ItemGroup,\n} from '@wordpress/components';\nimport { header, footer, layout } from '@wordpress/icons';\nimport { useMemo, useState, useEffect } from '@wordpress/element';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/\n Internal dependencies\n /\nimport {\n\tSidebarNavigationScreenDetailsPanel,\n\tSidebarNavigationScreenDetailsPanelRow,\n} from '../sidebar-navigation-screen-details-panel';\nimport { unlock } from '../../lock-unlock';\nimport { store as editSiteStore } from '../../store';\nimport { useLink } from '../routes/link';\nimport SidebarNavigationItem from '../sidebar-navigation-item';\nimport { TEMPLATE_PART_POST_TYPE } from '../../utils/constants';\n\nconst EMPTY_OBJECT = {};\n\nfunction TemplateAreaButton( { postId, icon, title } ) {\n\tconst icons = {\n\t\theader,\n\t\tfooter,\n\t};\n\tconst linkInfo = useLink( {\n\t\tpostType: TEMPLATE_PART_POST_TYPE,\n\t\tpostId,\n\t} );\n\n\treturn (\n\t\t<SidebarNavigationItem\n\t\t\tclassName=\"edit-site-sidebar-navigation-screen-template__template-area-button\"\n\t\t\t{ ...linkInfo }\n\t\t\ticon={ icons[ icon ] ?? layout }\n\t\t\twithChevron\n\t\t>\n\t\t\t<Truncate\n\t\t\t\tlimit={ 20 }\n\t\t\t\tellipsizeMode=\"tail\"\n\t\t\t\tnumberOfLines={ 1 }\n\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen-template__template-area-label-text\"\n\t\t\t>\n\t\t\t\t{ decodeEntities( title ) }\n\t\t\t</Truncate>\n\t\t</SidebarNavigationItem>\n\t);\n}\n\nexport default function HomeTemplateDetails() {\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\n\tconst {\n\t\tallowCommentsOnNewPosts,\n\t\ttemplatePartAreas,\n\t\tpostsPerPage,\n\t\tpostsPageTitle,\n\t\tpostsPageId,\n\t\tcurrentTemplateParts,\n\t} = useSelect( ( select ) => {\n\t\tconst { getEntityRecord } = select( coreStore );\n\t\tconst { getSettings, getCurrentTemplateTemplateParts } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\t\tconst siteSettings = getEntityRecord( 'root', 'site' );\n\t\tconst _postsPageRecord = siteSettings?.page_for_posts\n\t\t\t? getEntityRecord(\n\t\t\t\t\t'postType',\n\t\t\t\t\t'page',\n\t\t\t\t\tsiteSettings?.page_for_posts\n\t\t\t )\n\t\t\t: EMPTY_OBJECT;\n\n\t\treturn {\n\t\t\tallowCommentsOnNewPosts:\n\t\t\t\tsiteSettings?.default_comment_status === 'open',\n\t\t\tpostsPageTitle: _postsPageRecord?.title?.rendered,\n\t\t\tpostsPageId: _postsPageRecord?.id,\n\t\t\tpostsPerPage: siteSettings?.posts_per_page,\n\t\t\ttemplatePartAreas: getSettings()?.defaultTemplatePartAreas,\n\t\t\tcurrentTemplateParts: getCurrentTemplateTemplateParts(),\n\t\t};\n\t}, [] );\n\n\tconst [ commentsOnNewPostsValue, setCommentsOnNewPostsValue ] =\n\t\tuseState( '' );\n\tconst [ postsCountValue, setPostsCountValue ] = useState( 1 );\n\tconst [ postsPageTitleValue, setPostsPageTitleValue ] = useState( '' );\n\n\t/\n\t * This hook serves to set the server-retrieved values,\n\t * postsPageTitle, allowCommentsOnNewPosts, postsPerPage,\n\t * to local state.\n\t /\n\tuseEffect( () => {\n\t\tsetCommentsOnNewPostsValue( allowCommentsOnNewPosts );\n\t\tsetPostsPageTitleValue( postsPageTitle );\n\t\tsetPostsCountValue( postsPerPage );\n\t}, [ postsPageTitle, allowCommentsOnNewPosts, postsPerPage ] );\n\n\t/\n\t * Merge data in currentTemplateParts with templatePartAreas,\n\t * which contains the template icon and fallback labels\n\t */\n\tconst templateAreas = useMemo( () => {\n\t\t// Keep track of template part IDs that have already been added to the array.\n\t\tconst templatePartIds = new Set();\n\t\tconst filterOutDuplicateTemplateParts = ( currentTemplatePart ) => {\n\t\t\t// If the template part has already been added to the array, skip it.\n\t\t\tif ( templatePartIds.has( currentTemplatePart.templatePart.id ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// Add to the array of template part IDs.\n\t\t\ttemplatePartIds.add( currentTemplatePart.templatePart.id );\n\t\t\treturn currentTemplatePart;\n\t\t};\n\n\t\treturn currentTemplateParts.length && templatePartAreas\n\t\t\t? currentTemplateParts\n\t\t\t\t\t.filter( filterOutDuplicateTemplateParts )\n\t\t\t\t\t.map( ( { templatePart, block } ) => ( {\n\t\t\t\t\t\t...templatePartAreas?.find(\n\t\t\t\t\t\t\t( { area } ) => area === templatePart?.area\n\t\t\t\t\t\t),\n\t\t\t\t\t\t...templatePart,\n\t\t\t\t\t\tclientId: block.clientId,\n\t\t\t\t\t} ) )\n\t\t\t: [];\n\t}, [ currentTemplateParts, templatePartAreas ] );\n\n\tconst setAllowCommentsOnNewPosts = ( newValue ) => {\n\t\tsetCommentsOnNewPostsValue( newValue );\n\t\teditEntityRecord( 'root', 'site', undefined, {\n\t\t\tdefault_comment_status: newValue ? 'open' : null,\n\t\t} );\n\t};\n\n\tconst setPostsPageTitle = ( newValue ) => {\n\t\tsetPostsPageTitleValue( newValue );\n\t\teditEntityRecord( 'postType', 'page', postsPageId, {\n\t\t\ttitle: newValue,\n\t\t} );\n\t};\n\n\tconst setPostsPerPage = ( newValue ) => {\n\t\tsetPostsCountValue( newValue );\n\t\teditEntityRecord( 'root', 'site', undefined, {\n\t\t\tposts_per_page: newValue,\n\t\t} );\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<SidebarNavigationScreenDetailsPanel spacing={ 6 }>\n\t\t\t\t{ postsPageId && (\n\t\t\t\t\t<SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen__input-control\"\n\t\t\t\t\t\t\tplaceholder={ __( 'No Title' ) }\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tvalue={ postsPageTitleValue }\n\t\t\t\t\t\t\tonChange={ debounce( setPostsPageTitle, 300 ) }\n\t\t\t\t\t\t\tlabel={ __( 'Blog title' ) }\n\t\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t\t'Set the Posts Page title. Appears in search results, and when the page is shared on social media.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t) }\n\t\t\t\t<SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t<NumberControl\n\t\t\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen__input-control\"\n\t\t\t\t\t\tplaceholder={ 0 }\n\t\t\t\t\t\tvalue={ postsCountValue }\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\tspinControls=\"custom\"\n\t\t\t\t\t\tstep=\"1\"\n\t\t\t\t\t\tmin=\"1\"\n\t\t\t\t\t\tonChange={ setPostsPerPage }\n\t\t\t\t\t\tlabel={ __( 'Posts per page' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Set the default number of posts to display on blog pages, including categories and tags. Some templates may override this setting.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t</SidebarNavigationScreenDetailsPanel>\n\n\t\t\t<SidebarNavigationScreenDetailsPanel\n\t\t\t\ttitle={ __( 'Discussion' ) }\n\t\t\t\tspacing={ 3 }\n\t\t\t>\n\t\t\t\t<SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen__input-control\"\n\t\t\t\t\t\tlabel={ __( 'Allow comments on new posts' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Changes will apply to new posts only. Individual posts may override these settings.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tchecked={ commentsOnNewPostsValue }\n\t\t\t\t\t\tonChange={ setAllowCommentsOnNewPosts }\n\t\t\t\t\t/>\n\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t</SidebarNavigationScreenDetailsPanel>\n\t\t\t<SidebarNavigationScreenDetailsPanel\n\t\t\t\ttitle={ __( 'Areas' ) }\n\t\t\t\tspacing={ 3 }\n\t\t\t>\n\t\t\t\t<ItemGroup>\n\t\t\t\t\t{ templateAreas.map(\n\t\t\t\t\t\t( { clientId, label, icon, theme, slug, title } ) => (\n\t\t\t\t\t\t\t<SidebarNavigationScreenDetailsPanelRow\n\t\t\t\t\t\t\t\tkey={ clientId }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<TemplateAreaButton\n\t\t\t\t\t\t\t\t\tpostId={ `${ theme }//${ slug }` }\n\t\t\t\t\t\t\t\t\ttitle={ title?.rendered \|\| label }\n\t\t\t\t\t\t\t\t\ticon={ icon }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t\t)\n\t\t\t\t\t) }\n\t\t\t\t</ItemGroup>\n\t\t\t</SidebarNavigationScreenDetailsPanel>\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["__","debounce","useSelect","useDispatch","store","coreStore","CheckboxControl","__experimentalInputControl","InputControl","__experimentalNumberControl","NumberControl","useState","useEffect","SidebarNavigationScreenDetailsPanel","SidebarNavigationScreenDetailsPanelRow","EMPTY_OBJECT","HomeTemplateDetails","editEntityRecord","allowCommentsOnNewPosts","postsPerPage","postsPageTitle","postsPageId","select","getEntityRecord","siteSettings","_postsPageRecord","page_for_posts","default_comment_status","title","rendered","id","posts_per_page","commentsOnNewPostsValue","setCommentsOnNewPostsValue","postsCountValue","setPostsCountValue","postsPageTitleValue","setPostsPageTitleValue","setAllowCommentsOnNewPosts","newValue","undefined","setPostsPageTitle","setPostsPerPage","createElement","Fragment","spacing","className","placeholder","size","value","onChange","label","help","spinControls","step","min","checked"],"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-template/home-template-details.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { debounce } from '@wordpress/compose';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport {\n\tCheckboxControl,\n\t__experimentalInputControl as InputControl,\n\t__experimentalNumberControl as NumberControl,\n} from '@wordpress/components';\nimport { useState, useEffect } from '@wordpress/element';\n\n/\n Internal dependencies\n /\nimport {\n\tSidebarNavigationScreenDetailsPanel,\n\tSidebarNavigationScreenDetailsPanelRow,\n} from '../sidebar-navigation-screen-details-panel';\n\nconst EMPTY_OBJECT = {};\n\nexport default function HomeTemplateDetails() {\n\tconst { editEntityRecord } = useDispatch( coreStore );\n\n\tconst {\n\t\tallowCommentsOnNewPosts,\n\t\tpostsPerPage,\n\t\tpostsPageTitle,\n\t\tpostsPageId,\n\t} = useSelect( ( select ) => {\n\t\tconst { getEntityRecord } = select( coreStore );\n\t\tconst siteSettings = getEntityRecord( 'root', 'site' );\n\t\tconst _postsPageRecord = siteSettings?.page_for_posts\n\t\t\t? getEntityRecord(\n\t\t\t\t\t'postType',\n\t\t\t\t\t'page',\n\t\t\t\t\tsiteSettings?.page_for_posts\n\t\t\t )\n\t\t\t: EMPTY_OBJECT;\n\n\t\treturn {\n\t\t\tallowCommentsOnNewPosts:\n\t\t\t\tsiteSettings?.default_comment_status === 'open',\n\t\t\tpostsPageTitle: _postsPageRecord?.title?.rendered,\n\t\t\tpostsPageId: _postsPageRecord?.id,\n\t\t\tpostsPerPage: siteSettings?.posts_per_page,\n\t\t};\n\t}, [] );\n\n\tconst [ commentsOnNewPostsValue, setCommentsOnNewPostsValue ] =\n\t\tuseState( '' );\n\tconst [ postsCountValue, setPostsCountValue ] = useState( 1 );\n\tconst [ postsPageTitleValue, setPostsPageTitleValue ] = useState( '' );\n\n\t/\n\t * This hook serves to set the server-retrieved values,\n\t * postsPageTitle, allowCommentsOnNewPosts, postsPerPage,\n\t * to local state.\n\t */\n\tuseEffect( () => {\n\t\tsetCommentsOnNewPostsValue( allowCommentsOnNewPosts );\n\t\tsetPostsPageTitleValue( postsPageTitle );\n\t\tsetPostsCountValue( postsPerPage );\n\t}, [ postsPageTitle, allowCommentsOnNewPosts, postsPerPage ] );\n\n\tconst setAllowCommentsOnNewPosts = ( newValue ) => {\n\t\tsetCommentsOnNewPostsValue( newValue );\n\t\teditEntityRecord( 'root', 'site', undefined, {\n\t\t\tdefault_comment_status: newValue ? 'open' : null,\n\t\t} );\n\t};\n\n\tconst setPostsPageTitle = ( newValue ) => {\n\t\tsetPostsPageTitleValue( newValue );\n\t\teditEntityRecord( 'postType', 'page', postsPageId, {\n\t\t\ttitle: newValue,\n\t\t} );\n\t};\n\n\tconst setPostsPerPage = ( newValue ) => {\n\t\tsetPostsCountValue( newValue );\n\t\teditEntityRecord( 'root', 'site', undefined, {\n\t\t\tposts_per_page: newValue,\n\t\t} );\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t<SidebarNavigationScreenDetailsPanel spacing={ 6 }>\n\t\t\t\t{ postsPageId && (\n\t\t\t\t\t<SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen__input-control\"\n\t\t\t\t\t\t\tplaceholder={ __( 'No Title' ) }\n\t\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\t\tvalue={ postsPageTitleValue }\n\t\t\t\t\t\t\tonChange={ debounce( setPostsPageTitle, 300 ) }\n\t\t\t\t\t\t\tlabel={ __( 'Blog title' ) }\n\t\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t\t'Set the Posts Page title. Appears in search results, and when the page is shared on social media.'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t) }\n\t\t\t\t<SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t<NumberControl\n\t\t\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen__input-control\"\n\t\t\t\t\t\tplaceholder={ 0 }\n\t\t\t\t\t\tvalue={ postsCountValue }\n\t\t\t\t\t\tsize={ '__unstable-large' }\n\t\t\t\t\t\tspinControls=\"custom\"\n\t\t\t\t\t\tstep=\"1\"\n\t\t\t\t\t\tmin=\"1\"\n\t\t\t\t\t\tonChange={ setPostsPerPage }\n\t\t\t\t\t\tlabel={ __( 'Posts per page' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Set the default number of posts to display on blog pages, including categories and tags. Some templates may override this setting.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t</SidebarNavigationScreenDetailsPanel>\n\n\t\t\t<SidebarNavigationScreenDetailsPanel\n\t\t\t\ttitle={ __( 'Discussion' ) }\n\t\t\t\tspacing={ 3 }\n\t\t\t>\n\t\t\t\t<SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t<CheckboxControl\n\t\t\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen__input-control\"\n\t\t\t\t\t\tlabel={ __( 'Allow comments on new posts' ) }\n\t\t\t\t\t\thelp={ __(\n\t\t\t\t\t\t\t'Changes will apply to new posts only. Individual posts may override these settings.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tchecked={ commentsOnNewPostsValue }\n\t\t\t\t\t\tonChange={ setAllowCommentsOnNewPosts }\n\t\t\t\t\t/>\n\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t</SidebarNavigationScreenDetailsPanel>\n\t\t</>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/sidebar-navigation-screen-template/index.js CHANGED Viewed

@@ -10,6 +10,7 @@ import { store as coreStore } from '@wordpress/core-data';
 /**
  * Internal dependencies
  */
+import TemplateAreas from './template-areas';
 import SidebarNavigationScreen from '../sidebar-navigation-screen';
 import useEditedEntityRecord from '../use-edited-entity-record';
 import { unlock } from '../../lock-unlock';
@@ -33,7 +34,7 @@ function useTemplateDetails(postType, postId) {
   if (!descriptionText && addedBy.text) {
     descriptionText = __('This is a custom template that can be applied manually to any Post or Page.');
   }
-  const content = record?.slug === 'home' || record?.slug === 'index' ? createElement(HomeTemplateDetails, null) : null;
+  const content = record?.slug === 'home' || record?.slug === 'index' ? createElement(Fragment, null, createElement(HomeTemplateDetails, null), createElement(TemplateAreas, null)) : createElement(TemplateAreas, null);
   const footer = record?.modified ? createElement(SidebarNavigationScreenDetailsFooter, {
     record: record
   }) : null;

package/build-module/components/sidebar-navigation-screen-template/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__","_x","useDispatch","useSelect","pencil","__experimentalUseNavigator","useNavigator","Icon","store","coreStore","SidebarNavigationScreen","useEditedEntityRecord","unlock","editSiteStore","SidebarButton","useAddedBy","TemplateActions","HomeTemplateDetails","SidebarNavigationScreenDetailsFooter","useTemplateDetails","postType","postId","getDescription","getTitle","record","currentTheme","select","getCurrentTheme","addedBy","isAddedByActiveTheme","type","theme","stylesheet","title","descriptionText","text","content","slug","createElement","footer","modified","description","~~Fragment","~~className","imageUrl","src","alt","width","height","icon","isCustomized","SidebarNavigationScreenTemplate","navigator","params","setCanvasMode","actions","toggleProps","as","onRemove","goTo","onClick","label"],"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-template/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __, _x } from '@wordpress/i18n';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { pencil } from '@wordpress/icons';\nimport {\n\t__experimentalUseNavigator as useNavigator,\n\tIcon,\n} from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\n/\n Internal dependencies\n */\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport useEditedEntityRecord from '../use-edited-entity-record';\nimport { unlock } from '../../lock-unlock';\nimport { store as editSiteStore } from '../../store';\nimport SidebarButton from '../sidebar-button';\nimport { useAddedBy } from '../list/added-by';\nimport TemplateActions from '../template-actions';\nimport HomeTemplateDetails from './home-template-details';\nimport SidebarNavigationScreenDetailsFooter from '../sidebar-navigation-screen-details-footer';\n\nfunction useTemplateDetails( postType, postId ) {\n\tconst { getDescription, getTitle, record } = useEditedEntityRecord(\n\t\tpostType,\n\t\tpostId\n\t);\n\tconst currentTheme = useSelect(\n\t\t( select ) => select( coreStore ).getCurrentTheme(),\n\t\t[]\n\t);\n\tconst addedBy = useAddedBy( postType, postId );\n\tconst isAddedByActiveTheme =\n\t\taddedBy.type === 'theme' && record.theme === currentTheme?.stylesheet;\n\tconst title = getTitle();\n\tlet descriptionText = getDescription();\n\n\tif ( ! descriptionText && addedBy.text ) {\n\t\tdescriptionText = __(\n\t\t\t'This is a custom template that can be applied manually to any Post or Page.'\n\t\t);\n\t}\n\n\tconst content =\n\t\trecord?.slug === 'home' \|\| record?.slug === 'index' ? (\n\t\t\t<HomeTemplateDetails />\n\t\t) : ~~null~~;\n\n\tconst footer = record?.modified ? (\n\t\t<SidebarNavigationScreenDetailsFooter record={ record } />\n\t) : null;\n\n\tconst description = (\n\t\t<>\n\t\t\t{ descriptionText }\n\n\t\t\t{ addedBy.text && ! isAddedByActiveTheme && (\n\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description\">\n\t\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description-author\">\n\t\t\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description-author-icon\">\n\t\t\t\t\t\t\t{ addedBy.imageUrl ? (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\tsrc={ addedBy.imageUrl }\n\t\t\t\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Icon icon={ addedBy.icon } />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t{ addedBy.text }\n\t\t\t\t\t</span>\n\n\t\t\t\t\t{ addedBy.isCustomized && (\n\t\t\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description-customized\">\n\t\t\t\t\t\t\t{ _x( '(Customized)', 'template' ) }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn { title, description, content, footer };\n}\n\nexport default function SidebarNavigationScreenTemplate() {\n\tconst navigator = useNavigator();\n\tconst {\n\t\tparams: { postType, postId },\n\t} = navigator;\n\tconst { setCanvasMode } = unlock( useDispatch( editSiteStore ) );\n\tconst { title, content, description, footer } = useTemplateDetails(\n\t\tpostType,\n\t\tpostId\n\t);\n\n\treturn (\n\t\t<SidebarNavigationScreen\n\t\t\ttitle={ title }\n\t\t\tactions={\n\t\t\t\t<>\n\t\t\t\t\t<TemplateActions\n\t\t\t\t\t\tpostType={ postType }\n\t\t\t\t\t\tpostId={ postId }\n\t\t\t\t\t\ttoggleProps={ { as: SidebarButton } }\n\t\t\t\t\t\tonRemove={ () => {\n\t\t\t\t\t\t\tnavigator.goTo( `/${ postType }/all` );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<SidebarButton\n\t\t\t\t\t\tonClick={ () => setCanvasMode( 'edit' ) }\n\t\t\t\t\t\tlabel={ __( 'Edit' ) }\n\t\t\t\t\t\ticon={ pencil }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t}\n\t\t\tdescription={ description }\n\t\t\tcontent={ content }\n\t\t\tfooter={ footer }\n\t\t/>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,EAAEC,EAAE,QAAQ,iBAAiB;AACxC,SAASC,WAAW,EAAEC,SAAS,QAAQ,iBAAiB;AACxD,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SACCC,0BAA0B,IAAIC,YAAY,EAC1CC,IAAI,QACE,uBAAuB;AAC9B,SAASC,KAAK,IAAIC,SAAS,QAAQ,sBAAsB;AACzD;AACA;AACA;AACA,OAAOC,uBAAuB,MAAM,8BAA8B;AAClE,OAAOC,qBAAqB,MAAM,6BAA6B;AAC/D,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,~~SAASJ~~,KAAK,~~IAAIK~~,aAAa,QAAQ,aAAa;AACpD,OAAOC,aAAa,MAAM,mBAAmB;AAC7C,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,OAAOC,eAAe,MAAM,qBAAqB;AACjD,OAAOC,mBAAmB,MAAM,yBAAyB;AACzD,OAAOC,oCAAoC,MAAM,6CAA6C;AAE9F,SAASC,kBAAkBA,CAAEC,QAAQ,EAAEC,MAAM,EAAG;EAC/C,MAAM;IAAEC,cAAc;IAAEC,QAAQ;IAAEC;EAAO,CAAC,GAAGb,qBAAqB,CACjES,QAAQ,EACRC,MACD,CAAC;EACD,MAAMI,YAAY,~~GAAGtB~~,SAAS,~~CAC3BuB~~,MAAM,IAAMA,MAAM,~~CAAEjB~~,SAAU,CAAC,~~CAACkB~~,eAAe,CAAC,CAAC,EACnD,EACD,CAAC;EACD,MAAMC,OAAO,GAAGb,UAAU,CAAEK,QAAQ,EAAEC,MAAO,CAAC;EAC9C,MAAMQ,oBAAoB,GACzBD,OAAO,CAACE,IAAI,KAAK,OAAO,IAAIN,MAAM,CAACO,KAAK,KAAKN,YAAY,EAAEO,UAAU;EACtE,MAAMC,KAAK,GAAGV,QAAQ,CAAC,CAAC;EACxB,IAAIW,eAAe,GAAGZ,cAAc,CAAC,CAAC;EAEtC,IAAK,CAAEY,eAAe,IAAIN,OAAO,CAACO,IAAI,EAAG;IACxCD,eAAe,~~GAAGlC~~,EAAE,CACnB,6EACD,CAAC;EACF;EAEA,~~MAAMoC~~,OAAO,GACZZ,MAAM,EAAEa,IAAI,KAAK,MAAM,IAAIb,MAAM,EAAEa,IAAI,KAAK,OAAO,GAClDC,aAAA,CAACrB,mBAAmB,MAAE,CAAC,~~GACpB~~,~~IAAI~~;~~EAET~~,~~MAAMsB~~,MAAM,~~GAAGf~~,MAAM,~~EAAEgB~~,QAAQ,~~GAC9BF~~,aAAA,CAACpB,oCAAoC;IAACM,MAAM,EAAGA;EAAQ,CAAE,CAAC,GACvD,IAAI;EAER,~~MAAMiB~~,WAAW,~~GAChBH~~,aAAA,~~CAAAI~~,QAAA,~~QACGR~~,eAAe,EAEfN,OAAO,CAACO,IAAI,IAAI,CAAEN,oBAAoB,IACvCS,aAAA;IAAMK,SAAS,EAAC;EAAoE,GACnFL,aAAA;IAAMK,SAAS,EAAC;EAA2E,GAC1FL,aAAA;IAAMK,SAAS,EAAC;EAAgF,GAC7Ff,OAAO,CAACgB,QAAQ,GACjBN,aAAA;IACCO,GAAG,EAAGjB,OAAO,CAACgB,QAAU;IACxBE,GAAG,EAAC,EAAE;IACNC,KAAK,EAAC,IAAI;IACVC,MAAM,EAAC;EAAI,CACX,CAAC,GAEFV,aAAA,~~CAAC/B~~,IAAI;~~IAAC0C~~,IAAI,EAAGrB,OAAO,CAACqB;EAAM,CAAE,CAEzB,CAAC,EACLrB,OAAO,CAACO,IACL,CAAC,EAELP,OAAO,CAACsB,YAAY,IACrBZ,aAAA;IAAMK,SAAS,EAAC;EAA+E,~~GAC5F1C~~,EAAE,CAAE,cAAc,EAAE,UAAW,CAC5B,CAEF,CAEN,CACF;EAED,OAAO;~~IAAEgC~~,KAAK;~~IAAEQ~~,WAAW;~~IAAEL~~,OAAO;~~IAAEG~~;EAAO,CAAC;AAC/C;AAEA,eAAe,~~SAASY~~,+BAA+BA,CAAA,EAAG;EACzD,MAAMC,SAAS,~~GAAG9C~~,YAAY,CAAC,CAAC;EAChC,MAAM;~~IACL+C~~,MAAM,EAAE;MAAEjC,QAAQ;MAAEC;IAAO;EAC5B,CAAC,GAAG+B,SAAS;EACb,MAAM;IAAEE;EAAc,CAAC,GAAG1C,MAAM,~~CAAEV~~,WAAW,~~CAAEW~~,aAAc,CAAE,CAAC;EAChE,MAAM;IAAEoB,KAAK;IAAEG,OAAO;~~IAAEK~~,WAAW;IAAEF;EAAO,CAAC,~~GAAGpB~~,kBAAkB,CACjEC,QAAQ,EACRC,MACD,CAAC;EAED,OACCiB,aAAA,CAAC5B,uBAAuB;IACvBuB,KAAK,EAAGA,KAAO;IACfsB,OAAO,EACNjB,aAAA,~~CAAAI~~,QAAA,~~QACCJ~~,aAAA,CAACtB,eAAe;MACfI,QAAQ,EAAGA,QAAU;MACrBC,MAAM,EAAGA,MAAQ;MACjBmC,WAAW,EAAG;QAAEC,EAAE,EAAE3C;MAAc,CAAG;MACrC4C,QAAQ,EAAGA,CAAA,KAAM;QAChBN,SAAS,CAACO,IAAI,CAAG,IAAIvC,QAAU,MAAM,CAAC;MACvC;IAAG,CACH,CAAC,EACFkB,aAAA,CAACxB,aAAa;MACb8C,OAAO,EAAGA,CAAA,KAAMN,aAAa,CAAE,MAAO,CAAG;MACzCO,KAAK,~~EAAG7D~~,EAAE,CAAE,MAAO,CAAG;~~MACtBiD~~,IAAI,~~EAAG7C~~;IAAQ,CACf,CACA,CACF;~~IACDqC~~,WAAW,EAAGA,WAAa;~~IAC3BL~~,OAAO,EAAGA,OAAS;~~IACnBG~~,MAAM,EAAGA;EAAQ,CACjB,CAAC;AAEJ"}
1	+ {"version":3,"names":["__","_x","useDispatch","useSelect","pencil","__experimentalUseNavigator","useNavigator","Icon","store","coreStore","TemplateAreas","SidebarNavigationScreen","useEditedEntityRecord","unlock","editSiteStore","SidebarButton","useAddedBy","TemplateActions","HomeTemplateDetails","SidebarNavigationScreenDetailsFooter","useTemplateDetails","postType","postId","getDescription","getTitle","record","currentTheme","select","getCurrentTheme","addedBy","isAddedByActiveTheme","type","theme","stylesheet","title","descriptionText","text","content","slug","createElement","Fragment","footer","modified","description","className","imageUrl","src","alt","width","height","icon","isCustomized","SidebarNavigationScreenTemplate","navigator","params","setCanvasMode","actions","toggleProps","as","onRemove","goTo","onClick","label"],"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-template/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __, _x } from '@wordpress/i18n';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { pencil } from '@wordpress/icons';\nimport {\n\t__experimentalUseNavigator as useNavigator,\n\tIcon,\n} from '@wordpress/components';\nimport { store as coreStore } from '@wordpress/core-data';\n/\n Internal dependencies\n */\nimport TemplateAreas from './template-areas';\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport useEditedEntityRecord from '../use-edited-entity-record';\nimport { unlock } from '../../lock-unlock';\nimport { store as editSiteStore } from '../../store';\nimport SidebarButton from '../sidebar-button';\nimport { useAddedBy } from '../list/added-by';\nimport TemplateActions from '../template-actions';\nimport HomeTemplateDetails from './home-template-details';\nimport SidebarNavigationScreenDetailsFooter from '../sidebar-navigation-screen-details-footer';\n\nfunction useTemplateDetails( postType, postId ) {\n\tconst { getDescription, getTitle, record } = useEditedEntityRecord(\n\t\tpostType,\n\t\tpostId\n\t);\n\tconst currentTheme = useSelect(\n\t\t( select ) => select( coreStore ).getCurrentTheme(),\n\t\t[]\n\t);\n\tconst addedBy = useAddedBy( postType, postId );\n\tconst isAddedByActiveTheme =\n\t\taddedBy.type === 'theme' && record.theme === currentTheme?.stylesheet;\n\tconst title = getTitle();\n\tlet descriptionText = getDescription();\n\n\tif ( ! descriptionText && addedBy.text ) {\n\t\tdescriptionText = __(\n\t\t\t'This is a custom template that can be applied manually to any Post or Page.'\n\t\t);\n\t}\n\n\tconst content =\n\t\trecord?.slug === 'home' \|\| record?.slug === 'index' ? (\n\t\t\t<>\n\t\t\t\t<HomeTemplateDetails />\n\t\t\t\t<TemplateAreas />\n\t\t\t</>\n\t\t) : (\n\t\t\t<TemplateAreas />\n\t\t);\n\n\tconst footer = record?.modified ? (\n\t\t<SidebarNavigationScreenDetailsFooter record={ record } />\n\t) : null;\n\n\tconst description = (\n\t\t<>\n\t\t\t{ descriptionText }\n\n\t\t\t{ addedBy.text && ! isAddedByActiveTheme && (\n\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description\">\n\t\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description-author\">\n\t\t\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description-author-icon\">\n\t\t\t\t\t\t\t{ addedBy.imageUrl ? (\n\t\t\t\t\t\t\t\t<img\n\t\t\t\t\t\t\t\t\tsrc={ addedBy.imageUrl }\n\t\t\t\t\t\t\t\t\talt=\"\"\n\t\t\t\t\t\t\t\t\twidth=\"24\"\n\t\t\t\t\t\t\t\t\theight=\"24\"\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<Icon icon={ addedBy.icon } />\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t{ addedBy.text }\n\t\t\t\t\t</span>\n\n\t\t\t\t\t{ addedBy.isCustomized && (\n\t\t\t\t\t\t<span className=\"edit-site-sidebar-navigation-screen-template__added-by-description-customized\">\n\t\t\t\t\t\t\t{ _x( '(Customized)', 'template' ) }\n\t\t\t\t\t\t</span>\n\t\t\t\t\t) }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t</>\n\t);\n\n\treturn { title, description, content, footer };\n}\n\nexport default function SidebarNavigationScreenTemplate() {\n\tconst navigator = useNavigator();\n\tconst {\n\t\tparams: { postType, postId },\n\t} = navigator;\n\tconst { setCanvasMode } = unlock( useDispatch( editSiteStore ) );\n\tconst { title, content, description, footer } = useTemplateDetails(\n\t\tpostType,\n\t\tpostId\n\t);\n\n\treturn (\n\t\t<SidebarNavigationScreen\n\t\t\ttitle={ title }\n\t\t\tactions={\n\t\t\t\t<>\n\t\t\t\t\t<TemplateActions\n\t\t\t\t\t\tpostType={ postType }\n\t\t\t\t\t\tpostId={ postId }\n\t\t\t\t\t\ttoggleProps={ { as: SidebarButton } }\n\t\t\t\t\t\tonRemove={ () => {\n\t\t\t\t\t\t\tnavigator.goTo( `/${ postType }/all` );\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t\t<SidebarButton\n\t\t\t\t\t\tonClick={ () => setCanvasMode( 'edit' ) }\n\t\t\t\t\t\tlabel={ __( 'Edit' ) }\n\t\t\t\t\t\ticon={ pencil }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t}\n\t\t\tdescription={ description }\n\t\t\tcontent={ content }\n\t\t\tfooter={ footer }\n\t\t/>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/sidebar-navigation-screen-template/template-areas.js ADDED Viewed

@@ -0,0 +1,109 @@
+import { createElement } from "react";
+/**
+ * WordPress dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { useSelect } from '@wordpress/data';
+import { __experimentalTruncate as Truncate, __experimentalItemGroup as ItemGroup } from '@wordpress/components';
+import { store as editorStore } from '@wordpress/editor';
+import { useMemo } from '@wordpress/element';
+import { decodeEntities } from '@wordpress/html-entities';
+/**
+ * Internal dependencies
+ */
+import { SidebarNavigationScreenDetailsPanel, SidebarNavigationScreenDetailsPanelRow } from '../sidebar-navigation-screen-details-panel';
+import { unlock } from '../../lock-unlock';
+import { store as editSiteStore } from '../../store';
+import { useLink } from '../routes/link';
+import SidebarNavigationItem from '../sidebar-navigation-item';
+import { TEMPLATE_PART_POST_TYPE } from '../../utils/constants';
+function TemplateAreaButton({
+  postId,
+  area,
+  title
+}) {
+  const templatePartArea = useSelect(select => {
+    const defaultAreas = select(editorStore).__experimentalGetDefaultTemplatePartAreas();
+    return defaultAreas.find(defaultArea => defaultArea.area === area);
+  }, [area]);
+  const linkInfo = useLink({
+    postType: TEMPLATE_PART_POST_TYPE,
+    postId
+  });
+  return createElement(SidebarNavigationItem, {
+    className: "edit-site-sidebar-navigation-screen-template__template-area-button",
+    ...linkInfo,
+    icon: templatePartArea?.icon,
+    withChevron: true
+  }, createElement(Truncate, {
+    limit: 20,
+    ellipsizeMode: "tail",
+    numberOfLines: 1,
+    className: "edit-site-sidebar-navigation-screen-template__template-area-label-text"
+  }, decodeEntities(title)));
+}
+export default function TemplateAreas() {
+  const {
+    templatePartAreas,
+    currentTemplateParts
+  } = useSelect(select => {
+    const {
+      getSettings,
+      getCurrentTemplateTemplateParts
+    } = unlock(select(editSiteStore));
+    return {
+      templatePartAreas: getSettings()?.defaultTemplatePartAreas,
+      currentTemplateParts: getCurrentTemplateTemplateParts()
+    };
+  }, []);
+  /*
+   * Merge data in currentTemplateParts with templatePartAreas,
+   * which contains the template icon and fallback labels
+   */
+  const templateAreas = useMemo(() => {
+    // Keep track of template part IDs that have already been added to the array.
+    const templatePartIds = new Set();
+    const filterOutDuplicateTemplateParts = currentTemplatePart => {
+      // If the template part has already been added to the array, skip it.
+      if (templatePartIds.has(currentTemplatePart.templatePart.id)) {
+        return;
+      }
+      // Add to the array of template part IDs.
+      templatePartIds.add(currentTemplatePart.templatePart.id);
+      return currentTemplatePart;
+    };
+    return currentTemplateParts.length && templatePartAreas ? currentTemplateParts.filter(filterOutDuplicateTemplateParts).map(({
+      templatePart,
+      block
+    }) => ({
+      ...templatePartAreas?.find(({
+        area
+      }) => area === templatePart?.area),
+      ...templatePart,
+      clientId: block.clientId
+    })) : [];
+  }, [currentTemplateParts, templatePartAreas]);
+  if (!templateAreas.length) {
+    return null;
+  }
+  return createElement(SidebarNavigationScreenDetailsPanel, {
+    title: __('Areas'),
+    spacing: 3
+  }, createElement(ItemGroup, null, templateAreas.map(({
+    clientId,
+    label,
+    area,
+    theme,
+    slug,
+    title
+  }) => createElement(SidebarNavigationScreenDetailsPanelRow, {
+    key: clientId
+  }, createElement(TemplateAreaButton, {
+    postId: `${theme}//${slug}`,
+    title: title?.rendered || label,
+    area: area
+  })))));
+}
+//# sourceMappingURL=template-areas.js.map

package/build-module/components/sidebar-navigation-screen-template/template-areas.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["__","useSelect","__experimentalTruncate","Truncate","__experimentalItemGroup","ItemGroup","store","editorStore","useMemo","decodeEntities","SidebarNavigationScreenDetailsPanel","SidebarNavigationScreenDetailsPanelRow","unlock","editSiteStore","useLink","SidebarNavigationItem","TEMPLATE_PART_POST_TYPE","TemplateAreaButton","postId","area","title","templatePartArea","select","defaultAreas","__experimentalGetDefaultTemplatePartAreas","find","defaultArea","linkInfo","postType","createElement","className","icon","withChevron","limit","ellipsizeMode","numberOfLines","TemplateAreas","templatePartAreas","currentTemplateParts","getSettings","getCurrentTemplateTemplateParts","defaultTemplatePartAreas","templateAreas","templatePartIds","Set","filterOutDuplicateTemplateParts","currentTemplatePart","has","templatePart","id","add","length","filter","map","block","clientId","spacing","label","theme","slug","key","rendered"],"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-template/template-areas.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__experimentalTruncate as Truncate,\n\t__experimentalItemGroup as ItemGroup,\n} from '@wordpress/components';\nimport { store as editorStore } from '@wordpress/editor';\nimport { useMemo } from '@wordpress/element';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/**\n * Internal dependencies\n */\nimport {\n\tSidebarNavigationScreenDetailsPanel,\n\tSidebarNavigationScreenDetailsPanelRow,\n} from '../sidebar-navigation-screen-details-panel';\nimport { unlock } from '../../lock-unlock';\nimport { store as editSiteStore } from '../../store';\nimport { useLink } from '../routes/link';\nimport SidebarNavigationItem from '../sidebar-navigation-item';\nimport { TEMPLATE_PART_POST_TYPE } from '../../utils/constants';\n\nfunction TemplateAreaButton( { postId, area, title } ) {\n\tconst templatePartArea = useSelect(\n\t\t( select ) => {\n\t\t\tconst defaultAreas =\n\t\t\t\tselect(\n\t\t\t\t\teditorStore\n\t\t\t\t).__experimentalGetDefaultTemplatePartAreas();\n\n\t\t\treturn defaultAreas.find(\n\t\t\t\t( defaultArea ) => defaultArea.area === area\n\t\t\t);\n\t\t},\n\t\t[ area ]\n\t);\n\tconst linkInfo = useLink( {\n\t\tpostType: TEMPLATE_PART_POST_TYPE,\n\t\tpostId,\n\t} );\n\n\treturn (\n\t\t<SidebarNavigationItem\n\t\t\tclassName=\"edit-site-sidebar-navigation-screen-template__template-area-button\"\n\t\t\t{ ...linkInfo }\n\t\t\ticon={ templatePartArea?.icon }\n\t\t\twithChevron\n\t\t>\n\t\t\t<Truncate\n\t\t\t\tlimit={ 20 }\n\t\t\t\tellipsizeMode=\"tail\"\n\t\t\t\tnumberOfLines={ 1 }\n\t\t\t\tclassName=\"edit-site-sidebar-navigation-screen-template__template-area-label-text\"\n\t\t\t>\n\t\t\t\t{ decodeEntities( title ) }\n\t\t\t</Truncate>\n\t\t</SidebarNavigationItem>\n\t);\n}\n\nexport default function TemplateAreas() {\n\tconst { templatePartAreas, currentTemplateParts } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getSettings, getCurrentTemplateTemplateParts } = unlock(\n\t\t\t\tselect( editSiteStore )\n\t\t\t);\n\t\t\treturn {\n\t\t\t\ttemplatePartAreas: getSettings()?.defaultTemplatePartAreas,\n\t\t\t\tcurrentTemplateParts: getCurrentTemplateTemplateParts(),\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\t/*\n\t * Merge data in currentTemplateParts with templatePartAreas,\n\t * which contains the template icon and fallback labels\n\t */\n\tconst templateAreas = useMemo( () => {\n\t\t// Keep track of template part IDs that have already been added to the array.\n\t\tconst templatePartIds = new Set();\n\t\tconst filterOutDuplicateTemplateParts = ( currentTemplatePart ) => {\n\t\t\t// If the template part has already been added to the array, skip it.\n\t\t\tif ( templatePartIds.has( currentTemplatePart.templatePart.id ) ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\t// Add to the array of template part IDs.\n\t\t\ttemplatePartIds.add( currentTemplatePart.templatePart.id );\n\t\t\treturn currentTemplatePart;\n\t\t};\n\n\t\treturn currentTemplateParts.length && templatePartAreas\n\t\t\t? currentTemplateParts\n\t\t\t\t\t.filter( filterOutDuplicateTemplateParts )\n\t\t\t\t\t.map( ( { templatePart, block } ) => ( {\n\t\t\t\t\t\t...templatePartAreas?.find(\n\t\t\t\t\t\t\t( { area } ) => area === templatePart?.area\n\t\t\t\t\t\t),\n\t\t\t\t\t\t...templatePart,\n\t\t\t\t\t\tclientId: block.clientId,\n\t\t\t\t\t} ) )\n\t\t\t: [];\n\t}, [ currentTemplateParts, templatePartAreas ] );\n\n\tif ( ! templateAreas.length ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<SidebarNavigationScreenDetailsPanel\n\t\t\ttitle={ __( 'Areas' ) }\n\t\t\tspacing={ 3 }\n\t\t>\n\t\t\t<ItemGroup>\n\t\t\t\t{ templateAreas.map(\n\t\t\t\t\t( { clientId, label, area, theme, slug, title } ) => (\n\t\t\t\t\t\t<SidebarNavigationScreenDetailsPanelRow\n\t\t\t\t\t\t\tkey={ clientId }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<TemplateAreaButton\n\t\t\t\t\t\t\t\tpostId={ `${ theme }//${ slug }` }\n\t\t\t\t\t\t\t\ttitle={ title?.rendered || label }\n\t\t\t\t\t\t\t\tarea={ area }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</SidebarNavigationScreenDetailsPanelRow>\n\t\t\t\t\t)\n\t\t\t\t) }\n\t\t\t</ItemGroup>\n\t\t</SidebarNavigationScreenDetailsPanel>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/sidebar-navigation-screen-templates/index.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { createElement, Fragment } from "react";
 /**
  * WordPress dependencies
  */
-import { __experimentalItemGroup as ItemGroup, __experimentalItem as Item } from '@wordpress/components';
+import { __experimentalItemGroup as ItemGroup, __experimentalItem as Item, __experimentalVStack as VStack } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import { useEntityRecords } from '@wordpress/core-data';
 import { decodeEntities } from '@wordpress/html-entities';
@@ -39,8 +39,6 @@ export default function SidebarNavigationScreenTemplates() {
   } = useEntityRecords('postType', TEMPLATE_POST_TYPE, {
     per_page: -1
   });
-  const sortedTemplates = templates ? [...templates] : [];
-  sortedTemplates.sort((a, b) => a.title.rendered.localeCompare(b.title.rendered));
   const browseAllLink = useLink({
     path: '/wp_template/all'
   });
@@ -54,16 +52,73 @@ export default function SidebarNavigationScreenTemplates() {
         as: SidebarButton
       }
     }),
-    content: createElement(Fragment, null, isLoading && __('Loading templates…'), !isLoading && createElement(ItemGroup, null, !templates?.length && createElement(Item, null, __('No templates found')), sortedTemplates.map(template => createElement(TemplateItem, {
-      postType: TEMPLATE_POST_TYPE,
-      postId: template.id,
-      key: template.id,
-      withChevron: true
-    }, decodeEntities(template.title?.rendered || template.slug))))),
+    content: createElement(Fragment, null, isLoading && __('Loading templates…'), !isLoading && createElement(SidebarTemplatesList, {
+      templates: templates
+    })),
     footer: !isMobileViewport && createElement(SidebarNavigationItem, {
       withChevron: true,
       ...browseAllLink
     }, __('Manage all templates'))
   });
 }
+function TemplatesGroup({
+  title,
+  templates
+}) {
+  return createElement(ItemGroup, null, !!title && createElement(Item, {
+    className: "edit-site-sidebar-navigation-screen-templates__templates-group-title"
+  }, title), templates.map(template => createElement(TemplateItem, {
+    postType: TEMPLATE_POST_TYPE,
+    postId: template.id,
+    key: template.id,
+    withChevron: true
+  }, decodeEntities(template.title?.rendered || template.slug))));
+}
+function SidebarTemplatesList({
+  templates
+}) {
+  if (!templates?.length) {
+    return createElement(ItemGroup, null, createElement(Item, null, __('No templates found')));
+  }
+  const sortedTemplates = templates ? [...templates] : [];
+  sortedTemplates.sort((a, b) => a.title.rendered.localeCompare(b.title.rendered));
+  const {
+    hierarchyTemplates,
+    customTemplates,
+    ...plugins
+  } = sortedTemplates.reduce((accumulator, template) => {
+    const {
+      original_source: originalSource,
+      author_text: authorText
+    } = template;
+    if (originalSource === 'plugin') {
+      if (!accumulator[authorText]) {
+        accumulator[authorText] = [];
+      }
+      accumulator[authorText].push(template);
+    } else if (template.is_custom) {
+      accumulator.customTemplates.push(template);
+    } else {
+      accumulator.hierarchyTemplates.push(template);
+    }
+    return accumulator;
+  }, {
+    hierarchyTemplates: [],
+    customTemplates: []
+  });
+  return createElement(VStack, {
+    spacing: 3
+  }, !!hierarchyTemplates.length && createElement(TemplatesGroup, {
+    templates: hierarchyTemplates
+  }), !!customTemplates.length && createElement(TemplatesGroup, {
+    title: __('Custom'),
+    templates: customTemplates
+  }), Object.entries(plugins).map(([plugin, pluginTemplates]) => {
+    return createElement(TemplatesGroup, {
+      key: plugin,
+      title: plugin,
+      templates: pluginTemplates
+    });
+  }));
+}
 //# sourceMappingURL=index.js.map

package/build-module/components/sidebar-navigation-screen-templates/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__experimentalItemGroup","ItemGroup","__experimentalItem","Item","__","useEntityRecords","decodeEntities","useViewportMatch","SidebarNavigationScreen","useLink","SidebarNavigationItem","AddNewTemplate","SidebarButton","TEMPLATE_POST_TYPE","TemplateItem","postType","postId","props","linkInfo","createElement","SidebarNavigationScreenTemplates","isMobileViewport","records","templates","isResolving","isLoading","per_page","~~sortedTemplates~~","~~sort~~","a","b","~~title~~","~~rendered~~","~~localeCompare~~","~~browseAllLink~~","~~path~~","~~canCreate~~","~~description~~","~~actions~~","~~templateType~~","~~toggleProps~~","as","~~content~~","~~Fragment~~","length","~~map~~","~~template~~","id","~~key~~","~~withChevron~~","~~slug~~","~~footer~~"],"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-templates/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useEntityRecords } from '@wordpress/core-data';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { useViewportMatch } from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport { useLink } from '../routes/link';\nimport SidebarNavigationItem from '../sidebar-navigation-item';\nimport AddNewTemplate from '../add-new-template';\nimport SidebarButton from '../sidebar-button';\nimport { TEMPLATE_POST_TYPE } from '../../utils/constants';\n\nconst TemplateItem = ( { postType, postId, ...props } ) => {\n\tconst linkInfo = useLink( {\n\t\tpostType,\n\t\tpostId,\n\t} );\n\treturn <SidebarNavigationItem { ...linkInfo } { ...props } />;\n};\n\nexport default function SidebarNavigationScreenTemplates() {\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\n\tconst { records: templates, isResolving: isLoading } = useEntityRecords(\n\t\t'postType',\n\t\tTEMPLATE_POST_TYPE,\n\t\t{~~\n\t\t\tper_page~~: -1~~,\n\t\t~~}\n\t);\n\n\tconst ~~sortedTemplates = templates ? [ ...templates ] : [];\n\tsortedTemplates.sort( ( a, b ) =>\n\t\ta.title.rendered.localeCompare( b.title.rendered )\n\t);\n\n\tconst~~ browseAllLink = useLink( { path: '/wp_template/all' } );\n\tconst canCreate = ! isMobileViewport;\n\treturn (\n\t\t<SidebarNavigationScreen\n\t\t\ttitle={ __( 'Templates' ) }\n\t\t\tdescription={ __(\n\t\t\t\t'Express the layout of your site with templates.'\n\t\t\t) }\n\t\t\tactions={\n\t\t\t\tcanCreate && (\n\t\t\t\t\t<AddNewTemplate\n\t\t\t\t\t\ttemplateType={ TEMPLATE_POST_TYPE }\n\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\tas: SidebarButton,\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\tcontent={\n\t\t\t\t<>\n\t\t\t\t\t{ isLoading && __( 'Loading templates…' ) }\n\t\t\t\t\t{ ! isLoading && (\n\t\t\t\t\t\t<~~ItemGroup>\~~n\t\t\t\t\t\t\t{ ! ~~templates?.length~~ && (\n\t\t\t\t\t\t\t\t~~<Item>~~{ __( 'No templates ~~found~~' ) }~~</Item>\~~n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t{ ~~sortedTemplates.map~~( ( ~~template~~ ) => (\n\t\t\t\t\t\t\t\t<~~TemplateItem~~\n\t\t\t\t\t\t\t\t\~~tpostType=~~{ ~~TEMPLATE_POST_TYPE~~ }\n\t\t\t\t\t\t\t\t\~~tpostId~~={ ~~template.id~~ }\n\t\t\t\t\t\t\t\t\tkey={ template.id }\n\t\t\t\t\t\t\t\t\~~twithChevron~~\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t{ ~~decodeEntities~~(\n\t\t\t\t\t\t\t\t\t\~~ttemplate~~.title?.rendered ~~\|\|\~~n\t\t\t\t\t\t\t\t\t\t\~~ttemplate.slug~~\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t~~</TemplateItem>\~~n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t~~</ItemGroup>\~~n\t\t\t\t\t) }\n\t\t\t\t~~</>\~~n\t\t\t}\n\t\t\~~tfooter~~={\n\t\t\t\t! ~~isMobileViewport~~ && (\n\t\t\t\t\t~~<SidebarNavigationItem~~ ~~withChevron~~ { ~~...browseAllLink~~ }>\n\t\t\t\t\t\t{ __( ~~'Manage~~ ~~all~~ ~~templates'~~ ) }\n\t\t\t\t\t~~</SidebarNavigationItem>\~~n\t\t\t\t)\n\t\t\t}\n\t\t~~/>\~~n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SACCA,uBAAuB,IAAIC,SAAS,EACpCC,kBAAkB,IAAIC,IAAI,~~QACpB~~,uBAAuB;AAC9B,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SAASC,gBAAgB,QAAQ,sBAAsB;AACvD,SAASC,cAAc,QAAQ,0BAA0B;AACzD,SAASC,gBAAgB,QAAQ,oBAAoB;;AAErD;AACA;AACA;AACA,OAAOC,uBAAuB,MAAM,8BAA8B;AAClE,SAASC,OAAO,QAAQ,gBAAgB;AACxC,OAAOC,qBAAqB,MAAM,4BAA4B;AAC9D,OAAOC,cAAc,MAAM,qBAAqB;AAChD,OAAOC,aAAa,MAAM,mBAAmB;AAC7C,SAASC,kBAAkB,QAAQ,uBAAuB;AAE1D,MAAMC,YAAY,GAAGA,CAAE;EAAEC,QAAQ;EAAEC,MAAM;EAAE,GAAGC;AAAM,CAAC,KAAM;EAC1D,MAAMC,QAAQ,GAAGT,OAAO,CAAE;IACzBM,QAAQ;IACRC;EACD,CAAE,CAAC;EACH,OAAOG,aAAA,CAACT,qBAAqB;IAAA,GAAMQ,QAAQ;IAAA,GAAQD;EAAK,CAAI,CAAC;AAC9D,CAAC;AAED,eAAe,SAASG,gCAAgCA,CAAA,EAAG;EAC1D,MAAMC,gBAAgB,GAAGd,gBAAgB,CAAE,QAAQ,EAAE,GAAI,CAAC;~~EAE1D~~,MAAM;IAAEe,OAAO,EAAEC,SAAS;IAAEC,WAAW,EAAEC;EAAU,CAAC,GAAGpB,gBAAgB,CACtE,UAAU,EACVQ,kBAAkB,EAClB;~~IACCa~~,QAAQ,EAAE,CAAC;~~EACZ~~,~~CACD~~,CAAC;~~EAED~~,MAAMC,~~eAAe,GAAGJ,SAAS,GAAG,CAAE,GAAGA,SAAS,CAAE,GAAG,EAAE;EACzDI,eAAe,CAACC,IAAI,CAAE,CAAEC,CAAC,EAAEC,CAAC,KAC3BD,CAAC,CAACE,KAAK,CAACC,QAAQ,CAACC,~~aAAa,~~CAAEH~~,~~CAAC,CAACC,KAAK,CAACC,QAAS,CAClD,CAAC;EAED,MAAME,aAAa,GAAGzB,~~OAAO,CAAE;~~IAAE0B~~,IAAI,EAAE;EAAmB,CAAE,CAAC;EAC7D,MAAMC,SAAS,GAAG,~~CAAEf~~,gBAAgB;EACpC,OACCF,aAAA,CAACX,uBAAuB;~~IACvBuB~~,KAAK,~~EAAG3B~~,EAAE,CAAE,WAAY,CAAG;~~IAC3BiC~~,WAAW,~~EAAGjC~~,EAAE,CACf,iDACD,CAAG;~~IACHkC~~,OAAO,~~EACNF~~,SAAS,~~IACRjB~~,aAAA,CAACR,cAAc;~~MACd4B~~,YAAY,~~EAAG1B~~,kBAAoB;~~MACnC2B~~,WAAW,EAAG;QACbC,EAAE,~~EAAE7B~~;MACL;IAAG,CACH,CAEF;~~IACD8B~~,OAAO,~~EACNvB~~,aAAA,~~CAAAwB~~,QAAA,~~QACGlB~~,SAAS,IAAIrB,EAAE,CAAE,oBAAqB,CAAC,EACvC,CAAEqB,SAAS,IACZN,aAAA,~~CAAClB~~,SAAS,~~QACP~~,~~CAAEsB~~,~~SAAS~~,~~EAAEqB~~,MAAM,~~IACpBzB~~,aAAA,~~CAAChB~~,~~IAAI~~,~~QAAGC~~,EAAE,CAAE,~~oBAAqB~~,~~CAAS~~,~~CAC1C~~,~~EACCuB~~,~~eAAe~~,~~CAACkB~~,GAAG,CAAIC,QAAQ,~~IAChC3B~~,aAAA,CAACL,YAAY;~~MACZC~~,QAAQ,EAAGF,kBAAoB;~~MAC~~/BG,MAAM,~~EAAG8B~~,QAAQ,CAACC,EAAI;~~MACtBC~~,GAAG,EAAGF,QAAQ,CAACC,EAAI;~~MACnBE~~,WAAW;~~IAAA~~,~~GAET3C~~,cAAc,~~CACfwC~~,QAAQ,~~CAACf~~,KAAK,~~EAAEC~~,QAAQ,~~IACvBc~~,QAAQ,CAACI,~~IACX~~,CACa,CACb,CACQ,~~CAEX~~,~~CACF~~;~~IACDC~~,MAAM,~~EACL~~,~~CAAE9B~~,~~gBAAgB~~,~~IACjBF~~,aAAA,~~CAACT~~,~~qBAAqB~~;~~MAACuC~~,WAAW;~~MAAA~~,~~GAAMf~~;~~IAAa~~,~~GAClD9B~~,EAAE,CAAE,~~sBAAuB~~,~~CACP~~;~~EAExB~~,CACD,CAAC;~~AAEJ~~"}
1	+ {"version":3,"names":["__experimentalItemGroup","ItemGroup","__experimentalItem","Item","__experimentalVStack","VStack","__","useEntityRecords","decodeEntities","useViewportMatch","SidebarNavigationScreen","useLink","SidebarNavigationItem","AddNewTemplate","SidebarButton","TEMPLATE_POST_TYPE","TemplateItem","postType","postId","props","linkInfo","createElement","SidebarNavigationScreenTemplates","isMobileViewport","records","templates","isResolving","isLoading","per_page","browseAllLink","path","canCreate","title","description","actions","templateType","toggleProps","as","content","Fragment","SidebarTemplatesList","footer","withChevron","TemplatesGroup","className","map","template","id","key","rendered","slug","length","sortedTemplates","sort","a","b","localeCompare","hierarchyTemplates","customTemplates","plugins","reduce","accumulator","original_source","originalSource","author_text","authorText","push","is_custom","spacing","Object","entries","plugin","pluginTemplates"],"sources":["@wordpress/edit-site/src/components/sidebar-navigation-screen-templates/index.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { useEntityRecords } from '@wordpress/core-data';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { useViewportMatch } from '@wordpress/compose';\n\n/\n Internal dependencies\n */\nimport SidebarNavigationScreen from '../sidebar-navigation-screen';\nimport { useLink } from '../routes/link';\nimport SidebarNavigationItem from '../sidebar-navigation-item';\nimport AddNewTemplate from '../add-new-template';\nimport SidebarButton from '../sidebar-button';\nimport { TEMPLATE_POST_TYPE } from '../../utils/constants';\n\nconst TemplateItem = ( { postType, postId, ...props } ) => {\n\tconst linkInfo = useLink( {\n\t\tpostType,\n\t\tpostId,\n\t} );\n\treturn <SidebarNavigationItem { ...linkInfo } { ...props } />;\n};\n\nexport default function SidebarNavigationScreenTemplates() {\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\tconst { records: templates, isResolving: isLoading } = useEntityRecords(\n\t\t'postType',\n\t\tTEMPLATE_POST_TYPE,\n\t\t{ per_page: -1 }\n\t);\n\tconst browseAllLink = useLink( { path: '/wp_template/all' } );\n\tconst canCreate = ! isMobileViewport;\n\treturn (\n\t\t<SidebarNavigationScreen\n\t\t\ttitle={ __( 'Templates' ) }\n\t\t\tdescription={ __(\n\t\t\t\t'Express the layout of your site with templates.'\n\t\t\t) }\n\t\t\tactions={\n\t\t\t\tcanCreate && (\n\t\t\t\t\t<AddNewTemplate\n\t\t\t\t\t\ttemplateType={ TEMPLATE_POST_TYPE }\n\t\t\t\t\t\ttoggleProps={ {\n\t\t\t\t\t\t\tas: SidebarButton,\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\tcontent={\n\t\t\t\t<>\n\t\t\t\t\t{ isLoading && __( 'Loading templates…' ) }\n\t\t\t\t\t{ ! isLoading && (\n\t\t\t\t\t\t<SidebarTemplatesList templates={ templates } />\n\t\t\t\t\t) }\n\t\t\t\t</>\n\t\t\t}\n\t\t\tfooter={\n\t\t\t\t! isMobileViewport && (\n\t\t\t\t\t<SidebarNavigationItem withChevron { ...browseAllLink }>\n\t\t\t\t\t\t{ __( 'Manage all templates' ) }\n\t\t\t\t\t</SidebarNavigationItem>\n\t\t\t\t)\n\t\t\t}\n\t\t/>\n\t);\n}\n\nfunction TemplatesGroup( { title, templates } ) {\n\treturn (\n\t\t<ItemGroup>\n\t\t\t{ !! title && (\n\t\t\t\t<Item className=\"edit-site-sidebar-navigation-screen-templates__templates-group-title\">\n\t\t\t\t\t{ title }\n\t\t\t\t</Item>\n\t\t\t) }\n\t\t\t{ templates.map( ( template ) => (\n\t\t\t\t<TemplateItem\n\t\t\t\t\tpostType={ TEMPLATE_POST_TYPE }\n\t\t\t\t\tpostId={ template.id }\n\t\t\t\t\tkey={ template.id }\n\t\t\t\t\twithChevron\n\t\t\t\t>\n\t\t\t\t\t{ decodeEntities(\n\t\t\t\t\t\ttemplate.title?.rendered \|\| template.slug\n\t\t\t\t\t) }\n\t\t\t\t</TemplateItem>\n\t\t\t) ) }\n\t\t</ItemGroup>\n\t);\n}\nfunction SidebarTemplatesList( { templates } ) {\n\tif ( ! templates?.length ) {\n\t\treturn (\n\t\t\t<ItemGroup>\n\t\t\t\t<Item>{ __( 'No templates found' ) }</Item>\n\t\t\t</ItemGroup>\n\t\t);\n\t}\n\tconst sortedTemplates = templates ? [ ...templates ] : [];\n\tsortedTemplates.sort( ( a, b ) =>\n\t\ta.title.rendered.localeCompare( b.title.rendered )\n\t);\n\tconst { hierarchyTemplates, customTemplates, ...plugins } =\n\t\tsortedTemplates.reduce(\n\t\t\t( accumulator, template ) => {\n\t\t\t\tconst {\n\t\t\t\t\toriginal_source: originalSource,\n\t\t\t\t\tauthor_text: authorText,\n\t\t\t\t} = template;\n\t\t\t\tif ( originalSource === 'plugin' ) {\n\t\t\t\t\tif ( ! accumulator[ authorText ] ) {\n\t\t\t\t\t\taccumulator[ authorText ] = [];\n\t\t\t\t\t}\n\t\t\t\t\taccumulator[ authorText ].push( template );\n\t\t\t\t} else if ( template.is_custom ) {\n\t\t\t\t\taccumulator.customTemplates.push( template );\n\t\t\t\t} else {\n\t\t\t\t\taccumulator.hierarchyTemplates.push( template );\n\t\t\t\t}\n\t\t\t\treturn accumulator;\n\t\t\t},\n\t\t\t{ hierarchyTemplates: [], customTemplates: [] }\n\t\t);\n\treturn (\n\t\t<VStack spacing={ 3 }>\n\t\t\t{ !! hierarchyTemplates.length && (\n\t\t\t\t<TemplatesGroup templates={ hierarchyTemplates } />\n\t\t\t) }\n\t\t\t{ !! customTemplates.length && (\n\t\t\t\t<TemplatesGroup\n\t\t\t\t\ttitle={ __( 'Custom' ) }\n\t\t\t\t\ttemplates={ customTemplates }\n\t\t\t\t/>\n\t\t\t) }\n\t\t\t{ Object.entries( plugins ).map(\n\t\t\t\t( [ plugin, pluginTemplates ] ) => {\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<TemplatesGroup\n\t\t\t\t\t\t\tkey={ plugin }\n\t\t\t\t\t\t\ttitle={ plugin }\n\t\t\t\t\t\t\ttemplates={ pluginTemplates }\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</VStack>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/site-hub/index.js CHANGED Viewed

@@ -13,6 +13,7 @@ import { useReducedMotion } from '@wordpress/compose';
 import { __ } from '@wordpress/i18n';
 import { store as blockEditorStore } from '@wordpress/block-editor';
 import { store as coreStore } from '@wordpress/core-data';
+import { store as editorStore } from '@wordpress/editor';
 import { decodeEntities } from '@wordpress/html-entities';
 import { memo } from '@wordpress/element';
 import { search, external } from '@wordpress/icons';
@@ -56,12 +57,14 @@ const SiteHub = memo(({
   } = useDispatch(commandsStore);
   const disableMotion = useReducedMotion();
   const {
-    setCanvasMode,
-    __experimentalSetPreviewDeviceType: setPreviewDeviceType
+    setCanvasMode
   } = unlock(useDispatch(editSiteStore));
   const {
     clearSelectedBlock
   } = useDispatch(blockEditorStore);
+  const {
+    setDeviceType
+  } = useDispatch(editorStore);
   const isBackToDashboardButton = canvasMode === 'view';
   const siteIconButtonProps = isBackToDashboardButton ? {
     href: dashboardLink,
@@ -75,7 +78,7 @@ const SiteHub = memo(({
       event.preventDefault();
       if (canvasMode === 'edit') {
         clearSelectedBlock();
-        setPreviewDeviceType('Desktop');
+        setDeviceType('Desktop');
         setCanvasMode('view');
       }
     }

package/build-module/components/site-hub/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["classnames","useSelect","useDispatch","Button","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","__experimentalHStack","HStack","useReducedMotion","__","store","blockEditorStore","coreStore","decodeEntities","memo","search","external","commandsStore","displayShortcut","editSiteStore","SiteIcon","unlock","HUB_ANIMATION_DURATION","SiteHub","isTransparent","className","canvasMode","dashboardLink","homeUrl","siteTitle","select","getCanvasMode","getSettings","getSite","getUnstableBase","__experimentalDashboardLink","home","title","open","openCommandCenter","disableMotion","setCanvasMode","__experimentalSetPreviewDeviceType","setPreviewDeviceType","clearSelectedBlock","isBackToDashboardButton","siteIconButtonProps","href","label","role","onClick","event","preventDefault","createElement","div","variants","isDistractionFree","x","isDistractionFreeHovering","view","edit","initial","transition","type","duration","ease","justify","alignment","spacing","layout","animate","scale","whileHover","opacity","exit","delay","target","icon","shortcut","primary"],"sources":["@wordpress/edit-site/src/components/site-hub/index.js"],"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 { memo } from '@wordpress/element';\nimport { search, external } from '@wordpress/icons';\nimport { store as commandsStore } from '@wordpress/commands';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/\n Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport SiteIcon from '../site-icon';\nimport { unlock } from '../../lock-unlock';\n\nconst HUB_ANIMATION_DURATION = 0.3;\n\nconst SiteHub = memo( ( { isTransparent, className } ) => {\n\tconst { canvasMode, dashboardLink, homeUrl, siteTitle } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getCanvasMode, getSettings } = unlock(\n\t\t\t\tselect( editSiteStore )\n\t\t\t);\n\n\t\t\tconst {\n\t\t\t\tgetSite,\n\t\t\t\tgetUnstableBase, // Site index.\n\t\t\t} = select( coreStore );\n\n\t\t\treturn {\n\t\t\t\tcanvasMode: getCanvasMode(),\n\t\t\t\tdashboardLink:\n\t\t\t\t\tgetSettings().__experimentalDashboardLink \|\| 'index.php',\n\t\t\t\thomeUrl: getUnstableBase()?.home,\n\t\t\t\tsiteTitle: getSite()?.title,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { open: openCommandCenter } = useDispatch( commandsStore );\n\n\tconst disableMotion = useReducedMotion();\n\tconst {\n\t\tsetCanvasMode,\n\t\t__experimentalSetPreviewDeviceType: setPreviewDeviceType,\n\t} = unlock( useDispatch( editSiteStore ) );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst isBackToDashboardButton = canvasMode === 'view';\n\tconst siteIconButtonProps = isBackToDashboardButton\n\t\t? {\n\t\t\t\thref: dashboardLink,\n\t\t\t\tlabel: __( 'Go to the Dashboard' ),\n\t\t }\n\t\t: {\n\t\t\t\thref: dashboardLink, // We need to keep the `href` here so the component doesn't remount as a `<button>` and break the animation.\n\t\t\t\trole: 'button',\n\t\t\t\tlabel: __( 'Open Navigation' ),\n\t\t\t\tonClick: ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( canvasMode === 'edit' ) {\n\t\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\t\tsetPreviewDeviceType( 'Desktop' );\n\t\t\t\t\t\tsetCanvasMode( 'view' );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t };\n\n\treturn (\n\t\t<motion.div\n\t\t\tclassName={ classnames( 'edit-site-site-hub', className ) }\n\t\t\tvariants={ {\n\t\t\t\tisDistractionFree: { x: '-100%' },\n\t\t\t\tisDistractionFreeHovering: { x: 0 },\n\t\t\t\tview: { x: 0 },\n\t\t\t\tedit: { x: 0 },\n\t\t\t} }\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=\"space-between\"\n\t\t\t\talignment=\"center\"\n\t\t\t\tclassName=\"edit-site-site-hub__container\"\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\tclassName=\"edit-site-site-hub__text-content\"\n\t\t\t\t\tspacing=\"0\"\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-site-hub__view-mode-toggle-container',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'has-transparent-background': isTransparent,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tlayout\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\n\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t: HUB_ANIMATION_DURATION,\n\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t{ ...siteIconButtonProps }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__view-mode-toggle\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\tscale: canvasMode === 'view' ? 0.5 : 1,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\twhileHover={ {\n\t\t\t\t\t\t\t\t\tscale: canvasMode === 'view' ? 0.5 : 0.96,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: HUB_ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SiteIcon className=\"edit-site-layout__view-mode-toggle-icon\" />\n\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</motion.div>\n\n\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tlayout={ canvasMode === 'edit' }\n\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\topacity: canvasMode === 'view' ? 1 : 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'edit-site-site-hub__site-title',\n\t\t\t\t\t\t\t\t{ 'is-transparent': isTransparent }\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 ? 0 : 0.2,\n\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\tdelay: canvasMode === 'view' ? 0.1 : 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ decodeEntities( siteTitle ) }\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\thref={ homeUrl }\n\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\tlabel={ __( 'View site (opens in a new tab)' ) }\n\t\t\t\t\t\t\taria-label={ __(\n\t\t\t\t\t\t\t\t'View site (opens in a new tab)'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t\t\tclassName=\"edit-site-site-hub__site-view-link\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-site-hub_toggle-command-center',\n\t\t\t\t\t\t\t{ 'is-transparent': isTransparent }\n\t\t\t\t\t\t) }\n\t\t\t\t\t\ticon={ search }\n\t\t\t\t\t\tonClick={ () => openCommandCenter() }\n\t\t\t\t\t\tlabel={ __( 'Open command palette' ) }\n\t\t\t\t\t\tshortcut={ displayShortcut.primary( 'k' ) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</motion.div>\n\t);\n} );\n\nexport default SiteHub;\n"],"mappings":"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"}
1	+ {"version":3,"names":["classnames","useSelect","useDispatch","Button","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","__experimentalHStack","HStack","useReducedMotion","__","store","blockEditorStore","coreStore","editorStore","decodeEntities","memo","search","external","commandsStore","displayShortcut","editSiteStore","SiteIcon","unlock","HUB_ANIMATION_DURATION","SiteHub","isTransparent","className","canvasMode","dashboardLink","homeUrl","siteTitle","select","getCanvasMode","getSettings","getSite","getUnstableBase","__experimentalDashboardLink","home","title","open","openCommandCenter","disableMotion","setCanvasMode","clearSelectedBlock","setDeviceType","isBackToDashboardButton","siteIconButtonProps","href","label","role","onClick","event","preventDefault","createElement","div","variants","isDistractionFree","x","isDistractionFreeHovering","view","edit","initial","transition","type","duration","ease","justify","alignment","spacing","layout","animate","scale","whileHover","opacity","exit","delay","target","icon","shortcut","primary"],"sources":["@wordpress/edit-site/src/components/site-hub/index.js"],"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 { store as editorStore } from '@wordpress/editor';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { memo } from '@wordpress/element';\nimport { search, external } from '@wordpress/icons';\nimport { store as commandsStore } from '@wordpress/commands';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/\n Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport SiteIcon from '../site-icon';\nimport { unlock } from '../../lock-unlock';\n\nconst HUB_ANIMATION_DURATION = 0.3;\n\nconst SiteHub = memo( ( { isTransparent, className } ) => {\n\tconst { canvasMode, dashboardLink, homeUrl, siteTitle } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getCanvasMode, getSettings } = unlock(\n\t\t\t\tselect( editSiteStore )\n\t\t\t);\n\n\t\t\tconst {\n\t\t\t\tgetSite,\n\t\t\t\tgetUnstableBase, // Site index.\n\t\t\t} = select( coreStore );\n\n\t\t\treturn {\n\t\t\t\tcanvasMode: getCanvasMode(),\n\t\t\t\tdashboardLink:\n\t\t\t\t\tgetSettings().__experimentalDashboardLink \|\| 'index.php',\n\t\t\t\thomeUrl: getUnstableBase()?.home,\n\t\t\t\tsiteTitle: getSite()?.title,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\tconst { open: openCommandCenter } = useDispatch( commandsStore );\n\n\tconst disableMotion = useReducedMotion();\n\tconst { setCanvasMode } = unlock( useDispatch( editSiteStore ) );\n\tconst { clearSelectedBlock } = useDispatch( blockEditorStore );\n\tconst { setDeviceType } = useDispatch( editorStore );\n\tconst isBackToDashboardButton = canvasMode === 'view';\n\tconst siteIconButtonProps = isBackToDashboardButton\n\t\t? {\n\t\t\t\thref: dashboardLink,\n\t\t\t\tlabel: __( 'Go to the Dashboard' ),\n\t\t }\n\t\t: {\n\t\t\t\thref: dashboardLink, // We need to keep the `href` here so the component doesn't remount as a `<button>` and break the animation.\n\t\t\t\trole: 'button',\n\t\t\t\tlabel: __( 'Open Navigation' ),\n\t\t\t\tonClick: ( event ) => {\n\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\tif ( canvasMode === 'edit' ) {\n\t\t\t\t\t\tclearSelectedBlock();\n\t\t\t\t\t\tsetDeviceType( 'Desktop' );\n\t\t\t\t\t\tsetCanvasMode( 'view' );\n\t\t\t\t\t}\n\t\t\t\t},\n\t\t };\n\n\treturn (\n\t\t<motion.div\n\t\t\tclassName={ classnames( 'edit-site-site-hub', className ) }\n\t\t\tvariants={ {\n\t\t\t\tisDistractionFree: { x: '-100%' },\n\t\t\t\tisDistractionFreeHovering: { x: 0 },\n\t\t\t\tview: { x: 0 },\n\t\t\t\tedit: { x: 0 },\n\t\t\t} }\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=\"space-between\"\n\t\t\t\talignment=\"center\"\n\t\t\t\tclassName=\"edit-site-site-hub__container\"\n\t\t\t>\n\t\t\t\t<HStack\n\t\t\t\t\tjustify=\"flex-start\"\n\t\t\t\t\tclassName=\"edit-site-site-hub__text-content\"\n\t\t\t\t\tspacing=\"0\"\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-site-hub__view-mode-toggle-container',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'has-transparent-background': isTransparent,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tlayout\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\n\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t: HUB_ANIMATION_DURATION,\n\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t} }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t{ ...siteIconButtonProps }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__view-mode-toggle\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\t\tscale: canvasMode === 'view' ? 0.5 : 1,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\twhileHover={ {\n\t\t\t\t\t\t\t\t\tscale: canvasMode === 'view' ? 0.5 : 0.96,\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: HUB_ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<SiteIcon className=\"edit-site-layout__view-mode-toggle-icon\" />\n\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</motion.div>\n\n\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tlayout={ canvasMode === 'edit' }\n\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\topacity: canvasMode === 'view' ? 1 : 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t'edit-site-site-hub__site-title',\n\t\t\t\t\t\t\t\t{ 'is-transparent': isTransparent }\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 ? 0 : 0.2,\n\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\tdelay: canvasMode === 'view' ? 0.1 : 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ decodeEntities( siteTitle ) }\n\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\thref={ homeUrl }\n\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\tlabel={ __( 'View site (opens in a new tab)' ) }\n\t\t\t\t\t\t\taria-label={ __(\n\t\t\t\t\t\t\t\t'View site (opens in a new tab)'\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t\t\tclassName=\"edit-site-site-hub__site-view-link\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</HStack>\n\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-site-hub_toggle-command-center',\n\t\t\t\t\t\t\t{ 'is-transparent': isTransparent }\n\t\t\t\t\t\t) }\n\t\t\t\t\t\ticon={ search }\n\t\t\t\t\t\tonClick={ () => openCommandCenter() }\n\t\t\t\t\t\tlabel={ __( 'Open command palette' ) }\n\t\t\t\t\t\tshortcut={ displayShortcut.primary( 'k' ) }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t</motion.div>\n\t);\n} );\n\nexport default SiteHub;\n"],"mappings":"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"}

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

@@ -7,13 +7,13 @@ import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
-import { Disabled, TabPanel, privateApis as componentsPrivateApis } from '@wordpress/components';
+import { Disabled, privateApis as componentsPrivateApis } from '@wordpress/components';
 import { __, sprintf } from '@wordpress/i18n';
 import { getCategories, getBlockTypes, getBlockFromExample, createBlock } from '@wordpress/blocks';
 import { BlockList, privateApis as blockEditorPrivateApis, store as blockEditorStore, __unstableEditorStyles as EditorStyles, __unstableIframe as Iframe } from '@wordpress/block-editor';
 import { useSelect } from '@wordpress/data';
 import { useResizeObserver } from '@wordpress/compose';
-import { useMemo, useState, memo } from '@wordpress/element';
+import { useMemo, useState, memo, useContext } from '@wordpress/element';
 import { ENTER, SPACE } from '@wordpress/keycodes';
 /**
@@ -21,14 +21,18 @@ import { ENTER, SPACE } from '@wordpress/keycodes';
  */
 import { unlock } from '../../lock-unlock';
 import EditorCanvasContainer from '../editor-canvas-container';
+import { mergeBaseAndUserConfigs } from '../global-styles/global-styles-provider';
 const {
   ExperimentalBlockEditorProvider,
-  useGlobalStyle
+  useGlobalStyle,
+  GlobalStylesContext,
+  useGlobalStylesOutputWithConfig
 } = unlock(blockEditorPrivateApis);
 const {
   CompositeV2: Composite,
   CompositeItemV2: CompositeItem,
-  useCompositeStoreV2: useCompositeStore
+  useCompositeStoreV2: useCompositeStore,
+  Tabs
 } = unlock(componentsPrivateApis);
 // The content area of the Style Book is rendered within an iframe so that global styles
@@ -102,6 +106,9 @@ const STYLE_BOOK_IFRAME_STYLES = `
 		margin-bottom: 0;
 	}
 `;
+function isObjectEmpty(object) {
+  return !object || Object.keys(object).length === 0;
+}
 function getExamples() {
   // Use our own example for the Heading block so that we can show multiple
   // heading levels.
@@ -147,7 +154,9 @@ function StyleBook({
   onClick,
   onSelect,
   showCloseButton = true,
-  showTabs = true
+  onClose,
+  showTabs = true,
+  userConfig = {}
 }) {
   const [resizeObserver, sizes] = useResizeObserver();
   const [textColor] = useGlobalStyle('color.text');
@@ -158,12 +167,27 @@ function StyleBook({
     title: category.title,
     icon: category.icon
   })), [examples]);
+  const {
+    base: baseConfig
+  } = useContext(GlobalStylesContext);
+  const mergedConfig = useMemo(() => {
+    if (!isObjectEmpty(userConfig) && !isObjectEmpty(baseConfig)) {
+      return mergeBaseAndUserConfigs(baseConfig, userConfig);
+    }
+    return {};
+  }, [baseConfig, userConfig]);
+  // Copied from packages/edit-site/src/components/revisions/index.js
+  // could we create a shared hook?
   const originalSettings = useSelect(select => select(blockEditorStore).getSettings(), []);
   const settings = useMemo(() => ({
     ...originalSettings,
     __unstableIsPreviewMode: true
   }), [originalSettings]);
+  const [globalStyles] = useGlobalStylesOutputWithConfig(mergedConfig);
+  settings.styles = !isObjectEmpty(globalStyles) && !isObjectEmpty(userConfig) ? globalStyles : settings.styles;
   return createElement(EditorCanvasContainer, {
+    onClose: onClose,
     enableResizing: enableResizing,
     closeButtonLabel: showCloseButton ? __('Close Style Book') : null
   }, createElement("div", {
@@ -175,10 +199,16 @@ function StyleBook({
       color: textColor,
       background: backgroundColor
     }
-  }, resizeObserver, showTabs ? createElement(TabPanel, {
-    className: "edit-site-style-book__tab-panel",
-    tabs: tabs
-  }, tab => createElement(StyleBookBody, {
+  }, resizeObserver, showTabs ? createElement("div", {
+    className: "edit-site-style-book__tabs"
+  }, createElement(Tabs, null, createElement(Tabs.TabList, null, tabs.map(tab => createElement(Tabs.Tab, {
+    tabId: tab.name,
+    key: tab.name
+  }, tab.title))), tabs.map(tab => createElement(Tabs.TabPanel, {
+    key: tab.name,
+    tabId: tab.name,
+    focusable: false
+  }, createElement(StyleBookBody, {
     category: tab.name,
     examples: examples,
     isSelected: isSelected,
@@ -186,7 +216,7 @@ function StyleBook({
     settings: settings,
     sizes: sizes,
     title: tab.title
-  })) : createElement(StyleBookBody, {
+  }))))) : createElement(StyleBookBody, {
     examples: examples,
     isSelected: isSelected,
     onClick: onClick,