npm - @wordpress/edit-site - Versions diffs - 5.28.2 → 5.28.3 - Mend

@wordpress/edit-site 5.28.2 → 5.28.3

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 (82) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"names":["classnames","useSelect","Notice","useInstanceId","useViewportMatch","store","preferencesStore","BlockBreadcrumb","BlockToolbar","blockEditorStore","privateApis","blockEditorPrivateApis","BlockInspector","InterfaceSkeleton","ComplementaryArea","interfaceStore","EditorKeyboardShortcutsRegister","EditorKeyboardShortcuts","EditorNotices","EditorSnackbars","editorPrivateApis","editorStore","__","sprintf","coreDataStore","SidebarComplementaryAreaFills","SidebarInspectorFill","CodeEditor","KeyboardShortcutsEditMode","WelcomeGuide","StartTemplateOptions","editSiteStore","GlobalStylesRenderer","useTitle","CanvasLoader","unlock","useEditedEntityRecord","PatternModal","POST_TYPE_LABELS","TEMPLATE_POST_TYPE","SiteEditorCanvas","TemplatePartConverter","useSpecificEditorSettings","BlockRemovalWarningModal","ExperimentalEditorProvider","EditorProvider","InserterSidebar","ListViewSidebar","interfaceLabels","body","sidebar","actions","footer","blockRemovalRules","Editor","isLoading","record","editedPost","getTitle","isLoaded","hasLoadedPost","type","editedPostType","isLargeViewport","context","contextPost","editorMode","canvasMode","blockEditorMode","isRightSidebarOpen","isInserterOpen","isListViewOpen","isDistractionFree","showIconLabels","showBlockBreadcrumbs","postTypeLabel","select","get","getEditedPostContext","getEditorMode","getCanvasMode","__unstableGetEditorMode","getActiveComplementaryArea","getEntityRecord","isInserterOpened","isListViewOpened","getPostTypeLabel","_context","postId","postType","undefined","name","isViewMode","isEditMode","showVisualEditor","shouldShowBlockBreadcrumbs","shouldShowInserter","shouldShowListView","secondarySidebarLabel","postWithTemplate","title","_POST_TYPE_LABELS$edi","loadingProgressId","settings","isReady","createElement","Fragment","id","status","isDismissible","post","__unstableTemplate","useSubRegistry","enableRegionNavigation","className","notices","content","hideDragHandle","rules","secondarySidebar","Slot","scope","rootLabelText","labels"],"sources":["@wordpress/edit-site/src/components/editor/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useSelect } from '@wordpress/data';\nimport { Notice } from '@wordpress/components';\nimport { useInstanceId, useViewportMatch } from '@wordpress/compose';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tBlockBreadcrumb,\n\tBlockToolbar,\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n\tBlockInspector,\n} from '@wordpress/block-editor';\nimport {\n\tInterfaceSkeleton,\n\tComplementaryArea,\n\tstore as interfaceStore,\n} from '@wordpress/interface';\nimport {\n\tEditorKeyboardShortcutsRegister,\n\tEditorKeyboardShortcuts,\n\tEditorNotices,\n\tEditorSnackbars,\n\tprivateApis as editorPrivateApis,\n\tstore as editorStore,\n} from '@wordpress/editor';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\n/\n Internal dependencies\n /\nimport {\n\tSidebarComplementaryAreaFills,\n\tSidebarInspectorFill,\n} from '../sidebar-edit-mode';\nimport CodeEditor from '../code-editor';\nimport KeyboardShortcutsEditMode from '../keyboard-shortcuts/edit-mode';\nimport WelcomeGuide from '../welcome-guide';\nimport StartTemplateOptions from '../start-template-options';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesRenderer } from '../global-styles-renderer';\nimport useTitle from '../routes/use-title';\nimport CanvasLoader from '../canvas-loader';\nimport { unlock } from '../../lock-unlock';\nimport useEditedEntityRecord from '../use-edited-entity-record';\nimport PatternModal from '../pattern-modal';\nimport { POST_TYPE_LABELS, TEMPLATE_POST_TYPE } from '../../utils/constants';\nimport SiteEditorCanvas from '../block-editor/site-editor-canvas';\nimport TemplatePartConverter from '../template-part-converter';\nimport { useSpecificEditorSettings } from '../block-editor/use-site-editor-settings';\n\nconst { BlockRemovalWarningModal } = unlock( blockEditorPrivateApis );\nconst {\n\tExperimentalEditorProvider: EditorProvider,\n\tInserterSidebar,\n\tListViewSidebar,\n} = unlock( editorPrivateApis );\n\nconst interfaceLabels = {\n\t/ translators: accessibility text for the editor content landmark region. /\n\tbody: __( 'Editor content' ),\n\t/ translators: accessibility text for the editor settings landmark region. /\n\tsidebar: __( 'Editor settings' ),\n\t/ translators: accessibility text for the editor publish landmark region. /\n\tactions: __( 'Editor publish' ),\n\t/ translators: accessibility text for the editor footer landmark region. */\n\tfooter: __( 'Editor footer' ),\n};\n\n// Prevent accidental removal of certain blocks, asking the user for\n// confirmation.\nconst blockRemovalRules = {\n\t'core/query': __( 'Query Loop displays a list of posts or pages.' ),\n\t'core/post-content': __(\n\t\t'Post Content displays the content of a post or page.'\n\t),\n\t'core/post-template': __(\n\t\t'Post Template displays each post or page in a Query Loop.'\n\t),\n\t'bindings/core/pattern-overrides': __(\n\t\t'Blocks from synced patterns that can have overriden content.'\n\t),\n};\n\nexport default function Editor( { isLoading } ) {\n\tconst {\n\t\trecord: editedPost,\n\t\tgetTitle,\n\t\tisLoaded: hasLoadedPost,\n\t} = useEditedEntityRecord();\n\n\tconst { type: editedPostType } = editedPost;\n\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\n\tconst {\n\t\tcontext,\n\t\tcontextPost,\n\t\teditorMode,\n\t\tcanvasMode,\n\t\tblockEditorMode,\n\t\tisRightSidebarOpen,\n\t\tisInserterOpen,\n\t\tisListViewOpen,\n\t\tisDistractionFree,\n\t\tshowIconLabels,\n\t\tshowBlockBreadcrumbs,\n\t\tpostTypeLabel,\n\t} = useSelect( ( select ) => {\n\t\tconst { get } = select( preferencesStore );\n\t\tconst { getEditedPostContext, getEditorMode, getCanvasMode } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\t\tconst { __unstableGetEditorMode } = select( blockEditorStore );\n\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\t\tconst { getEntityRecord } = select( coreDataStore );\n\t\tconst { isInserterOpened, isListViewOpened, getPostTypeLabel } =\n\t\t\tselect( editorStore );\n\t\tconst _context = getEditedPostContext();\n\n\t\t// The currently selected entity to display.\n\t\t// Typically template or template part in the site editor.\n\t\treturn {\n\t\t\tcontext: _context,\n\t\t\tcontextPost: _context?.postId\n\t\t\t\t? getEntityRecord(\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t_context.postType,\n\t\t\t\t\t\t_context.postId\n\t\t\t\t )\n\t\t\t\t: undefined,\n\t\t\teditorMode: getEditorMode(),\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tblockEditorMode: __unstableGetEditorMode(),\n\t\t\tisInserterOpen: isInserterOpened(),\n\t\t\tisListViewOpen: isListViewOpened(),\n\t\t\tisRightSidebarOpen: getActiveComplementaryArea(\n\t\t\t\teditSiteStore.name\n\t\t\t),\n\t\t\tisDistractionFree: get( 'core', 'distractionFree' ),\n\t\t\tshowBlockBreadcrumbs: get( 'core', 'showBlockBreadcrumbs' ),\n\t\t\tshowIconLabels: get( 'core', 'showIconLabels' ),\n\t\t\tpostTypeLabel: getPostTypeLabel(),\n\t\t};\n\t}, [] );\n\n\tconst isViewMode = canvasMode === 'view';\n\tconst isEditMode = canvasMode === 'edit';\n\tconst showVisualEditor = isViewMode \|\| editorMode === 'visual';\n\tconst shouldShowBlockBreadcrumbs =\n\t\t! isDistractionFree &&\n\t\tshowBlockBreadcrumbs &&\n\t\tisEditMode &&\n\t\tshowVisualEditor &&\n\t\tblockEditorMode !== 'zoom-out';\n\tconst shouldShowInserter = isEditMode && showVisualEditor && isInserterOpen;\n\tconst shouldShowListView = isEditMode && showVisualEditor && isListViewOpen;\n\tconst secondarySidebarLabel = isListViewOpen\n\t\t? __( 'List View' )\n\t\t: __( 'Block Library' );\n\tconst postWithTemplate = !! context?.postId;\n\n\tlet title;\n\tif ( hasLoadedPost ) {\n\t\ttitle = sprintf(\n\t\t\t// translators: A breadcrumb trail for the Admin document title. %1$s: title of template being edited, %2$s: type of template (Template or Template Part).\n\t\t\t__( '%1$s ‹ %2$s' ),\n\t\t\tgetTitle(),\n\t\t\tPOST_TYPE_LABELS[ editedPostType ] ??\n\t\t\t\tPOST_TYPE_LABELS[ TEMPLATE_POST_TYPE ]\n\t\t);\n\t}\n\n\t// Only announce the title once the editor is ready to prevent \"Replace\"\n\t// action in <URLQueryController> from double-announcing.\n\tuseTitle( hasLoadedPost && title );\n\n\tconst loadingProgressId = useInstanceId(\n\t\tCanvasLoader,\n\t\t'edit-site-editor__loading-progress'\n\t);\n\n\tconst settings = useSpecificEditorSettings();\n\tconst isReady =\n\t\t! isLoading &&\n\t\t( ( postWithTemplate && !! contextPost && !! editedPost ) \|\|\n\t\t\t( ! postWithTemplate && !! editedPost ) );\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isReady ? <CanvasLoader id={ loadingProgressId } /> : null }\n\t\t\t{ isEditMode && <WelcomeGuide /> }\n\t\t\t{ hasLoadedPost && ! editedPost && (\n\t\t\t\t<Notice status=\"warning\" isDismissible={ false }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"You attempted to edit an item that doesn't exist. Perhaps it was deleted?\"\n\t\t\t\t\t) }\n\t\t\t\t</Notice>\n\t\t\t) }\n\t\t\t{ isReady && (\n\t\t\t\t<EditorProvider\n\t\t\t\t\tpost={ postWithTemplate ? contextPost : editedPost }\n\t\t\t\t\t__unstableTemplate={\n\t\t\t\t\t\tpostWithTemplate ? editedPost : undefined\n\t\t\t\t\t}\n\t\t\t\t\tsettings={ settings }\n\t\t\t\t\tuseSubRegistry={ false }\n\t\t\t\t>\n\t\t\t\t\t<SidebarComplementaryAreaFills />\n\t\t\t\t\t{ isEditMode && <StartTemplateOptions /> }\n\t\t\t\t\t<InterfaceSkeleton\n\t\t\t\t\t\tisDistractionFree={ isDistractionFree }\n\t\t\t\t\t\tenableRegionNavigation={ false }\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-editor__interface-skeleton',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'show-icon-labels': showIconLabels,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tnotices={ <EditorSnackbars /> }\n\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<GlobalStylesRenderer />\n\t\t\t\t\t\t\t\t{ isEditMode && <EditorNotices /> }\n\t\t\t\t\t\t\t\t{ showVisualEditor && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<TemplatePartConverter />\n\t\t\t\t\t\t\t\t\t\t<SidebarInspectorFill>\n\t\t\t\t\t\t\t\t\t\t\t<BlockInspector />\n\t\t\t\t\t\t\t\t\t\t</SidebarInspectorFill>\n\t\t\t\t\t\t\t\t\t\t{ ! isLargeViewport && (\n\t\t\t\t\t\t\t\t\t\t\t<BlockToolbar hideDragHandle />\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t<SiteEditorCanvas />\n\t\t\t\t\t\t\t\t\t\t<BlockRemovalWarningModal\n\t\t\t\t\t\t\t\t\t\t\trules={ blockRemovalRules }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<PatternModal />\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t{ editorMode === 'text' && isEditMode && (\n\t\t\t\t\t\t\t\t\t<CodeEditor />\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t{ isEditMode && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<KeyboardShortcutsEditMode />\n\t\t\t\t\t\t\t\t\t\t<EditorKeyboardShortcutsRegister />\n\t\t\t\t\t\t\t\t\t\t<EditorKeyboardShortcuts />\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsecondarySidebar={\n\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\t( ( shouldShowInserter && <InserterSidebar /> ) \|\|\n\t\t\t\t\t\t\t\t( shouldShowListView && <ListViewSidebar /> ) )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsidebar={\n\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\tisRightSidebarOpen && (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<ComplementaryArea.Slot scope=\"core/edit-site\" />\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tfooter={\n\t\t\t\t\t\t\tshouldShowBlockBreadcrumbs && (\n\t\t\t\t\t\t\t\t<BlockBreadcrumb\n\t\t\t\t\t\t\t\t\trootLabelText={ postTypeLabel }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tlabels={ {\n\t\t\t\t\t\t\t...interfaceLabels,\n\t\t\t\t\t\t\tsecondarySidebar: secondarySidebarLabel,\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</EditorProvider>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["classnames","useSelect","Notice","useInstanceId","useViewportMatch","store","preferencesStore","BlockBreadcrumb","BlockToolbar","blockEditorStore","privateApis","blockEditorPrivateApis","BlockInspector","InterfaceSkeleton","ComplementaryArea","interfaceStore","EditorKeyboardShortcutsRegister","EditorKeyboardShortcuts","EditorNotices","EditorSnackbars","editorPrivateApis","editorStore","__","sprintf","coreDataStore","SidebarComplementaryAreaFills","SidebarInspectorFill","CodeEditor","KeyboardShortcutsEditMode","WelcomeGuide","StartTemplateOptions","editSiteStore","GlobalStylesRenderer","useTitle","CanvasLoader","unlock","useEditedEntityRecord","PatternModal","POST_TYPE_LABELS","TEMPLATE_POST_TYPE","SiteEditorCanvas","TemplatePartConverter","useSpecificEditorSettings","BlockRemovalWarningModal","ExperimentalEditorProvider","EditorProvider","InserterSidebar","ListViewSidebar","interfaceLabels","body","sidebar","actions","footer","blockRemovalRules","Editor","isLoading","record","editedPost","getTitle","isLoaded","hasLoadedPost","type","editedPostType","isLargeViewport","context","contextPost","editorMode","canvasMode","blockEditorMode","isRightSidebarOpen","isInserterOpen","isListViewOpen","isDistractionFree","showIconLabels","showBlockBreadcrumbs","postTypeLabel","select","get","getEditedPostContext","getEditorMode","getCanvasMode","__unstableGetEditorMode","getActiveComplementaryArea","getEntityRecord","isInserterOpened","isListViewOpened","getPostTypeLabel","_context","postId","postType","undefined","name","isViewMode","isEditMode","showVisualEditor","shouldShowBlockBreadcrumbs","shouldShowInserter","shouldShowListView","secondarySidebarLabel","postWithTemplate","title","_POST_TYPE_LABELS$edi","loadingProgressId","settings","isReady","createElement","Fragment","id","status","isDismissible","post","__unstableTemplate","useSubRegistry","enableRegionNavigation","className","notices","content","hideDragHandle","rules","secondarySidebar","Slot","scope","rootLabelText","labels"],"sources":["@wordpress/edit-site/src/components/editor/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useSelect } from '@wordpress/data';\nimport { Notice } from '@wordpress/components';\nimport { useInstanceId, useViewportMatch } from '@wordpress/compose';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tBlockBreadcrumb,\n\tBlockToolbar,\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n\tBlockInspector,\n} from '@wordpress/block-editor';\nimport {\n\tInterfaceSkeleton,\n\tComplementaryArea,\n\tstore as interfaceStore,\n} from '@wordpress/interface';\nimport {\n\tEditorKeyboardShortcutsRegister,\n\tEditorKeyboardShortcuts,\n\tEditorNotices,\n\tEditorSnackbars,\n\tprivateApis as editorPrivateApis,\n\tstore as editorStore,\n} from '@wordpress/editor';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { store as coreDataStore } from '@wordpress/core-data';\n\n/\n Internal dependencies\n /\nimport {\n\tSidebarComplementaryAreaFills,\n\tSidebarInspectorFill,\n} from '../sidebar-edit-mode';\nimport CodeEditor from '../code-editor';\nimport KeyboardShortcutsEditMode from '../keyboard-shortcuts/edit-mode';\nimport WelcomeGuide from '../welcome-guide';\nimport StartTemplateOptions from '../start-template-options';\nimport { store as editSiteStore } from '../../store';\nimport { GlobalStylesRenderer } from '../global-styles-renderer';\nimport useTitle from '../routes/use-title';\nimport CanvasLoader from '../canvas-loader';\nimport { unlock } from '../../lock-unlock';\nimport useEditedEntityRecord from '../use-edited-entity-record';\nimport PatternModal from '../pattern-modal';\nimport { POST_TYPE_LABELS, TEMPLATE_POST_TYPE } from '../../utils/constants';\nimport SiteEditorCanvas from '../block-editor/site-editor-canvas';\nimport TemplatePartConverter from '../template-part-converter';\nimport { useSpecificEditorSettings } from '../block-editor/use-site-editor-settings';\n\nconst { BlockRemovalWarningModal } = unlock( blockEditorPrivateApis );\nconst {\n\tExperimentalEditorProvider: EditorProvider,\n\tInserterSidebar,\n\tListViewSidebar,\n} = unlock( editorPrivateApis );\n\nconst interfaceLabels = {\n\t/ translators: accessibility text for the editor content landmark region. /\n\tbody: __( 'Editor content' ),\n\t/ translators: accessibility text for the editor settings landmark region. /\n\tsidebar: __( 'Editor settings' ),\n\t/ translators: accessibility text for the editor publish landmark region. /\n\tactions: __( 'Editor publish' ),\n\t/ translators: accessibility text for the editor footer landmark region. */\n\tfooter: __( 'Editor footer' ),\n};\n\n// Prevent accidental removal of certain blocks, asking the user for\n// confirmation.\nconst blockRemovalRules = {\n\t'core/query': __( 'Query Loop displays a list of posts or pages.' ),\n\t'core/post-content': __(\n\t\t'Post Content displays the content of a post or page.'\n\t),\n\t'core/post-template': __(\n\t\t'Post Template displays each post or page in a Query Loop.'\n\t),\n\t'bindings/core/pattern-overrides': __(\n\t\t'Blocks from synced patterns that can have overriden content.'\n\t),\n};\n\nexport default function Editor( { isLoading } ) {\n\tconst {\n\t\trecord: editedPost,\n\t\tgetTitle,\n\t\tisLoaded: hasLoadedPost,\n\t} = useEditedEntityRecord();\n\n\tconst { type: editedPostType } = editedPost;\n\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\n\tconst {\n\t\tcontext,\n\t\tcontextPost,\n\t\teditorMode,\n\t\tcanvasMode,\n\t\tblockEditorMode,\n\t\tisRightSidebarOpen,\n\t\tisInserterOpen,\n\t\tisListViewOpen,\n\t\tisDistractionFree,\n\t\tshowIconLabels,\n\t\tshowBlockBreadcrumbs,\n\t\tpostTypeLabel,\n\t} = useSelect( ( select ) => {\n\t\tconst { get } = select( preferencesStore );\n\t\tconst { getEditedPostContext, getEditorMode, getCanvasMode } = unlock(\n\t\t\tselect( editSiteStore )\n\t\t);\n\t\tconst { __unstableGetEditorMode } = select( blockEditorStore );\n\t\tconst { getActiveComplementaryArea } = select( interfaceStore );\n\t\tconst { getEntityRecord } = select( coreDataStore );\n\t\tconst { isInserterOpened, isListViewOpened, getPostTypeLabel } =\n\t\t\tselect( editorStore );\n\t\tconst _context = getEditedPostContext();\n\n\t\t// The currently selected entity to display.\n\t\t// Typically template or template part in the site editor.\n\t\treturn {\n\t\t\tcontext: _context,\n\t\t\tcontextPost: _context?.postId\n\t\t\t\t? getEntityRecord(\n\t\t\t\t\t\t'postType',\n\t\t\t\t\t\t_context.postType,\n\t\t\t\t\t\t_context.postId\n\t\t\t\t )\n\t\t\t\t: undefined,\n\t\t\teditorMode: getEditorMode(),\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tblockEditorMode: __unstableGetEditorMode(),\n\t\t\tisInserterOpen: isInserterOpened(),\n\t\t\tisListViewOpen: isListViewOpened(),\n\t\t\tisRightSidebarOpen: getActiveComplementaryArea(\n\t\t\t\teditSiteStore.name\n\t\t\t),\n\t\t\tisDistractionFree: get( 'core', 'distractionFree' ),\n\t\t\tshowBlockBreadcrumbs: get( 'core', 'showBlockBreadcrumbs' ),\n\t\t\tshowIconLabels: get( 'core', 'showIconLabels' ),\n\t\t\tpostTypeLabel: getPostTypeLabel(),\n\t\t};\n\t}, [] );\n\n\tconst isViewMode = canvasMode === 'view';\n\tconst isEditMode = canvasMode === 'edit';\n\tconst showVisualEditor = isViewMode \|\| editorMode === 'visual';\n\tconst shouldShowBlockBreadcrumbs =\n\t\t! isDistractionFree &&\n\t\tshowBlockBreadcrumbs &&\n\t\tisEditMode &&\n\t\tshowVisualEditor &&\n\t\tblockEditorMode !== 'zoom-out';\n\tconst shouldShowInserter = isEditMode && showVisualEditor && isInserterOpen;\n\tconst shouldShowListView = isEditMode && showVisualEditor && isListViewOpen;\n\tconst secondarySidebarLabel = isListViewOpen\n\t\t? __( 'List View' )\n\t\t: __( 'Block Library' );\n\tconst postWithTemplate = !! context?.postId;\n\n\tlet title;\n\tif ( hasLoadedPost ) {\n\t\ttitle = sprintf(\n\t\t\t// translators: A breadcrumb trail for the Admin document title. %1$s: title of template being edited, %2$s: type of template (Template or Template Part).\n\t\t\t__( '%1$s ‹ %2$s' ),\n\t\t\tgetTitle(),\n\t\t\tPOST_TYPE_LABELS[ editedPostType ] ??\n\t\t\t\tPOST_TYPE_LABELS[ TEMPLATE_POST_TYPE ]\n\t\t);\n\t}\n\n\t// Only announce the title once the editor is ready to prevent \"Replace\"\n\t// action in <URLQueryController> from double-announcing.\n\tuseTitle( hasLoadedPost && title );\n\n\tconst loadingProgressId = useInstanceId(\n\t\tCanvasLoader,\n\t\t'edit-site-editor__loading-progress'\n\t);\n\n\tconst settings = useSpecificEditorSettings();\n\tconst isReady =\n\t\t! isLoading &&\n\t\t( ( postWithTemplate && !! contextPost && !! editedPost ) \|\|\n\t\t\t( ! postWithTemplate && !! editedPost ) );\n\n\treturn (\n\t\t<>\n\t\t\t{ ! isReady ? <CanvasLoader id={ loadingProgressId } /> : null }\n\t\t\t{ isEditMode && <WelcomeGuide /> }\n\t\t\t{ hasLoadedPost && ! editedPost && (\n\t\t\t\t<Notice status=\"warning\" isDismissible={ false }>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t\"You attempted to edit an item that doesn't exist. Perhaps it was deleted?\"\n\t\t\t\t\t) }\n\t\t\t\t</Notice>\n\t\t\t) }\n\t\t\t{ isReady && (\n\t\t\t\t<EditorProvider\n\t\t\t\t\tpost={ postWithTemplate ? contextPost : editedPost }\n\t\t\t\t\t__unstableTemplate={\n\t\t\t\t\t\tpostWithTemplate ? editedPost : undefined\n\t\t\t\t\t}\n\t\t\t\t\tsettings={ settings }\n\t\t\t\t\tuseSubRegistry={ false }\n\t\t\t\t>\n\t\t\t\t\t<SidebarComplementaryAreaFills />\n\t\t\t\t\t{ isEditMode && <StartTemplateOptions /> }\n\t\t\t\t\t<InterfaceSkeleton\n\t\t\t\t\t\tisDistractionFree={ isDistractionFree }\n\t\t\t\t\t\tenableRegionNavigation={ false }\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-editor__interface-skeleton',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'show-icon-labels': showIconLabels,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tnotices={ <EditorSnackbars /> }\n\t\t\t\t\t\tcontent={\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t<GlobalStylesRenderer />\n\t\t\t\t\t\t\t\t{ isEditMode && <EditorNotices /> }\n\t\t\t\t\t\t\t\t{ showVisualEditor && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<TemplatePartConverter />\n\t\t\t\t\t\t\t\t\t\t<SidebarInspectorFill>\n\t\t\t\t\t\t\t\t\t\t\t<BlockInspector />\n\t\t\t\t\t\t\t\t\t\t</SidebarInspectorFill>\n\t\t\t\t\t\t\t\t\t\t{ ! isLargeViewport && (\n\t\t\t\t\t\t\t\t\t\t\t<BlockToolbar hideDragHandle />\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t\t<SiteEditorCanvas />\n\t\t\t\t\t\t\t\t\t\t<BlockRemovalWarningModal\n\t\t\t\t\t\t\t\t\t\t\trules={ blockRemovalRules }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t<PatternModal />\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t{ editorMode === 'text' && isEditMode && (\n\t\t\t\t\t\t\t\t\t<CodeEditor />\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t{ isEditMode && (\n\t\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t\t<KeyboardShortcutsEditMode />\n\t\t\t\t\t\t\t\t\t\t<EditorKeyboardShortcutsRegister />\n\t\t\t\t\t\t\t\t\t\t<EditorKeyboardShortcuts />\n\t\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsecondarySidebar={\n\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\t( ( shouldShowInserter && <InserterSidebar /> ) \|\|\n\t\t\t\t\t\t\t\t( shouldShowListView && <ListViewSidebar /> ) )\n\t\t\t\t\t\t}\n\t\t\t\t\t\tsidebar={\n\t\t\t\t\t\t\t! isDistractionFree &&\n\t\t\t\t\t\t\tisEditMode &&\n\t\t\t\t\t\t\tisRightSidebarOpen && (\n\t\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t\t<ComplementaryArea.Slot scope=\"core/edit-site\" />\n\t\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tfooter={\n\t\t\t\t\t\t\tshouldShowBlockBreadcrumbs && (\n\t\t\t\t\t\t\t\t<BlockBreadcrumb\n\t\t\t\t\t\t\t\t\trootLabelText={ postTypeLabel }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t}\n\t\t\t\t\t\tlabels={ {\n\t\t\t\t\t\t\t...interfaceLabels,\n\t\t\t\t\t\t\tsecondarySidebar: secondarySidebarLabel,\n\t\t\t\t\t\t} }\n\t\t\t\t\t/>\n\t\t\t\t</EditorProvider>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,SAAS,QAAQ,iBAAiB;AAC3C,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,SAASC,aAAa,EAAEC,gBAAgB,QAAQ,oBAAoB;AACpE,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,wBAAwB;AAClE,SACCC,eAAe,EACfC,YAAY,EACZH,KAAK,IAAII,gBAAgB,EACzBC,WAAW,IAAIC,sBAAsB,EACrCC,cAAc,QACR,yBAAyB;AAChC,SACCC,iBAAiB,EACjBC,iBAAiB,EACjBT,KAAK,IAAIU,cAAc,QACjB,sBAAsB;AAC7B,SACCC,+BAA+B,EAC/BC,uBAAuB,EACvBC,aAAa,EACbC,eAAe,EACfT,WAAW,IAAIU,iBAAiB,EAChCf,KAAK,IAAIgB,WAAW,QACd,mBAAmB;AAC1B,SAASC,EAAE,EAAEC,OAAO,QAAQ,iBAAiB;AAC7C,SAASlB,KAAK,IAAImB,aAAa,QAAQ,sBAAsB;;AAE7D;AACA;AACA;AACA,SACCC,6BAA6B,EAC7BC,oBAAoB,QACd,sBAAsB;AAC7B,OAAOC,UAAU,MAAM,gBAAgB;AACvC,OAAOC,yBAAyB,MAAM,iCAAiC;AACvE,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,OAAOC,oBAAoB,MAAM,2BAA2B;AAC5D,SAASzB,KAAK,IAAI0B,aAAa,QAAQ,aAAa;AACpD,SAASC,oBAAoB,QAAQ,2BAA2B;AAChE,OAAOC,QAAQ,MAAM,qBAAqB;AAC1C,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,OAAOC,qBAAqB,MAAM,6BAA6B;AAC/D,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,SAASC,gBAAgB,EAAEC,kBAAkB,QAAQ,uBAAuB;AAC5E,OAAOC,gBAAgB,MAAM,oCAAoC;AACjE,OAAOC,qBAAqB,MAAM,4BAA4B;AAC9D,SAASC,yBAAyB,QAAQ,0CAA0C;AAEpF,MAAM;EAAEC;AAAyB,CAAC,GAAGR,MAAM,CAAExB,sBAAuB,CAAC;AACrE,MAAM;EACLiC,0BAA0B,EAAEC,cAAc;EAC1CC,eAAe;EACfC;AACD,CAAC,GAAGZ,MAAM,CAAEf,iBAAkB,CAAC;AAE/B,MAAM4B,eAAe,GAAG;EACvB;EACAC,IAAI,EAAE3B,EAAE,CAAE,gBAAiB,CAAC;EAC5B;EACA4B,OAAO,EAAE5B,EAAE,CAAE,iBAAkB,CAAC;EAChC;EACA6B,OAAO,EAAE7B,EAAE,CAAE,gBAAiB,CAAC;EAC/B;EACA8B,MAAM,EAAE9B,EAAE,CAAE,eAAgB;AAC7B,CAAC;;AAED;AACA;AACA,MAAM+B,iBAAiB,GAAG;EACzB,YAAY,EAAE/B,EAAE,CAAE,+CAAgD,CAAC;EACnE,mBAAmB,EAAEA,EAAE,CACtB,sDACD,CAAC;EACD,oBAAoB,EAAEA,EAAE,CACvB,2DACD,CAAC;EACD,iCAAiC,EAAEA,EAAE,CACpC,8DACD;AACD,CAAC;AAED,eAAe,SAASgC,MAAMA,CAAE;EAAEC;AAAU,CAAC,EAAG;EAC/C,MAAM;IACLC,MAAM,EAAEC,UAAU;IAClBC,QAAQ;IACRC,QAAQ,EAAEC;EACX,CAAC,GAAGxB,qBAAqB,CAAC,CAAC;EAE3B,MAAM;IAAEyB,IAAI,EAAEC;EAAe,CAAC,GAAGL,UAAU;EAE3C,MAAMM,eAAe,GAAG3D,gBAAgB,CAAE,QAAS,CAAC;EAEpD,MAAM;IACL4D,OAAO;IACPC,WAAW;IACXC,UAAU;IACVC,UAAU;IACVC,eAAe;IACfC,kBAAkB;IAClBC,cAAc;IACdC,cAAc;IACdC,iBAAiB;IACjBC,cAAc;IACdC,oBAAoB;IACpBC;EACD,CAAC,GAAG1E,SAAS,CAAI2E,MAAM,IAAM;IAC5B,MAAM;MAAEC;IAAI,CAAC,GAAGD,MAAM,CAAEtE,gBAAiB,CAAC;IAC1C,MAAM;MAAEwE,oBAAoB;MAAEC,aAAa;MAAEC;IAAc,CAAC,GAAG7C,MAAM,CACpEyC,MAAM,CAAE7C,aAAc,CACvB,CAAC;IACD,MAAM;MAAEkD;IAAwB,CAAC,GAAGL,MAAM,CAAEnE,gBAAiB,CAAC;IAC9D,MAAM;MAAEyE;IAA2B,CAAC,GAAGN,MAAM,CAAE7D,cAAe,CAAC;IAC/D,MAAM;MAAEoE;IAAgB,CAAC,GAAGP,MAAM,CAAEpD,aAAc,CAAC;IACnD,MAAM;MAAE4D,gBAAgB;MAAEC,gBAAgB;MAAEC;IAAiB,CAAC,GAC7DV,MAAM,CAAEvD,WAAY,CAAC;IACtB,MAAMkE,QAAQ,GAAGT,oBAAoB,CAAC,CAAC;;IAEvC;IACA;IACA,OAAO;MACNd,OAAO,EAAEuB,QAAQ;MACjBtB,WAAW,EAAEsB,QAAQ,EAAEC,MAAM,GAC1BL,eAAe,CACf,UAAU,EACVI,QAAQ,CAACE,QAAQ,EACjBF,QAAQ,CAACC,MACT,CAAC,GACDE,SAAS;MACZxB,UAAU,EAAEa,aAAa,CAAC,CAAC;MAC3BZ,UAAU,EAAEa,aAAa,CAAC,CAAC;MAC3BZ,eAAe,EAAEa,uBAAuB,CAAC,CAAC;MAC1CX,cAAc,EAAEc,gBAAgB,CAAC,CAAC;MAClCb,cAAc,EAAEc,gBAAgB,CAAC,CAAC;MAClChB,kBAAkB,EAAEa,0BAA0B,CAC7CnD,aAAa,CAAC4D,IACf,CAAC;MACDnB,iBAAiB,EAAEK,GAAG,CAAE,MAAM,EAAE,iBAAkB,CAAC;MACnDH,oBAAoB,EAAEG,GAAG,CAAE,MAAM,EAAE,sBAAuB,CAAC;MAC3DJ,cAAc,EAAEI,GAAG,CAAE,MAAM,EAAE,gBAAiB,CAAC;MAC/CF,aAAa,EAAEW,gBAAgB,CAAC;IACjC,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMM,UAAU,GAAGzB,UAAU,KAAK,MAAM;EACxC,MAAM0B,UAAU,GAAG1B,UAAU,KAAK,MAAM;EACxC,MAAM2B,gBAAgB,GAAGF,UAAU,IAAI1B,UAAU,KAAK,QAAQ;EAC9D,MAAM6B,0BAA0B,GAC/B,CAAEvB,iBAAiB,IACnBE,oBAAoB,IACpBmB,UAAU,IACVC,gBAAgB,IAChB1B,eAAe,KAAK,UAAU;EAC/B,MAAM4B,kBAAkB,GAAGH,UAAU,IAAIC,gBAAgB,IAAIxB,cAAc;EAC3E,MAAM2B,kBAAkB,GAAGJ,UAAU,IAAIC,gBAAgB,IAAIvB,cAAc;EAC3E,MAAM2B,qBAAqB,GAAG3B,cAAc,GACzCjD,EAAE,CAAE,WAAY,CAAC,GACjBA,EAAE,CAAE,eAAgB,CAAC;EACxB,MAAM6E,gBAAgB,GAAG,CAAC,CAAEnC,OAAO,EAAEwB,MAAM;EAE3C,IAAIY,KAAK;EACT,IAAKxC,aAAa,EAAG;IAAA,IAAAyC,qBAAA;IACpBD,KAAK,GAAG7E,OAAO;IACd;IACAD,EAAE,CAAE,aAAc,CAAC,EACnBoC,QAAQ,CAAC,CAAC,GAAA2C,qBAAA,GACV/D,gBAAgB,CAAEwB,cAAc,CAAE,cAAAuC,qBAAA,cAAAA,qBAAA,GACjC/D,gBAAgB,CAAEC,kBAAkB,CACtC,CAAC;EACF;;EAEA;EACA;EACAN,QAAQ,CAAE2B,aAAa,IAAIwC,KAAM,CAAC;EAElC,MAAME,iBAAiB,GAAGnG,aAAa,CACtC+B,YAAY,EACZ,oCACD,CAAC;EAED,MAAMqE,QAAQ,GAAG7D,yBAAyB,CAAC,CAAC;EAC5C,MAAM8D,OAAO,GACZ,CAAEjD,SAAS,KACP4C,gBAAgB,IAAI,CAAC,CAAElC,WAAW,IAAI,CAAC,CAAER,UAAU,IACpD,CAAE0C,gBAAgB,IAAI,CAAC,CAAE1C,UAAY,CAAE;EAE3C,OACCgD,aAAA,CAAAC,QAAA,QACG,CAAEF,OAAO,GAAGC,aAAA,CAACvE,YAAY;IAACyE,EAAE,EAAGL;EAAmB,CAAE,CAAC,GAAG,IAAI,EAC5DT,UAAU,IAAIY,aAAA,CAAC5E,YAAY,MAAE,CAAC,EAC9B+B,aAAa,IAAI,CAAEH,UAAU,IAC9BgD,aAAA,CAACvG,MAAM;IAAC0G,MAAM,EAAC,SAAS;IAACC,aAAa,EAAG;EAAO,GAC7CvF,EAAE,CACH,2EACD,CACO,CACR,EACCkF,OAAO,IACRC,aAAA,CAAC5D,cAAc;IACdiE,IAAI,EAAGX,gBAAgB,GAAGlC,WAAW,GAAGR,UAAY;IACpDsD,kBAAkB,EACjBZ,gBAAgB,GAAG1C,UAAU,GAAGiC,SAChC;IACDa,QAAQ,EAAGA,QAAU;IACrBS,cAAc,EAAG;EAAO,GAExBP,aAAA,CAAChF,6BAA6B,MAAE,CAAC,EAC/BoE,UAAU,IAAIY,aAAA,CAAC3E,oBAAoB,MAAE,CAAC,EACxC2E,aAAA,CAAC5F,iBAAiB;IACjB2D,iBAAiB,EAAGA,iBAAmB;IACvCyC,sBAAsB,EAAG,KAAO;IAChCC,SAAS,EAAGlH,UAAU,CACrB,sCAAsC,EACtC;MACC,kBAAkB,EAAEyE;IACrB,CACD,CAAG;IACH0C,OAAO,EAAGV,aAAA,CAACtF,eAAe,MAAE,CAAG;IAC/BiG,OAAO,EACNX,aAAA,CAAAC,QAAA,QACCD,aAAA,CAACzE,oBAAoB,MAAE,CAAC,EACtB6D,UAAU,IAAIY,aAAA,CAACvF,aAAa,MAAE,CAAC,EAC/B4E,gBAAgB,IACjBW,aAAA,CAAAC,QAAA,QACCD,aAAA,CAAChE,qBAAqB,MAAE,CAAC,EACzBgE,aAAA,CAAC/E,oBAAoB,QACpB+E,aAAA,CAAC7F,cAAc,MAAE,CACI,CAAC,EACrB,CAAEmD,eAAe,IAClB0C,aAAA,CAACjG,YAAY;MAAC6G,cAAc;IAAA,CAAE,CAC9B,EACDZ,aAAA,CAACjE,gBAAgB,MAAE,CAAC,EACpBiE,aAAA,CAAC9D,wBAAwB;MACxB2E,KAAK,EAAGjE;IAAmB,CAC3B,CAAC,EACFoD,aAAA,CAACpE,YAAY,MAAE,CACd,CACF,EACC6B,UAAU,KAAK,MAAM,IAAI2B,UAAU,IACpCY,aAAA,CAAC9E,UAAU,MAAE,CACb,EACCkE,UAAU,IACXY,aAAA,CAAAC,QAAA,QACCD,aAAA,CAAC7E,yBAAyB,MAAE,CAAC,EAC7B6E,aAAA,CAACzF,+BAA+B,MAAE,CAAC,EACnCyF,aAAA,CAACxF,uBAAuB,MAAE,CACzB,CAEF,CACF;IACDsG,gBAAgB,EACf1B,UAAU,KACNG,kBAAkB,IAAIS,aAAA,CAAC3D,eAAe,MAAE,CAAC,IAC1CmD,kBAAkB,IAAIQ,aAAA,CAAC1D,eAAe,MAAE,CAAG,CAC9C;IACDG,OAAO,EACN,CAAEsB,iBAAiB,IACnBqB,UAAU,IACVxB,kBAAkB,IACjBoC,aAAA,CAAAC,QAAA,QACCD,aAAA,CAAC3F,iBAAiB,CAAC0G,IAAI;MAACC,KAAK,EAAC;IAAgB,CAAE,CAC/C,CAEH;IACDrE,MAAM,EACL2C,0BAA0B,IACzBU,aAAA,CAAClG,eAAe;MACfmH,aAAa,EAAG/C;IAAe,CAC/B,CAEF;IACDgD,MAAM,EAAG;MACR,GAAG3E,eAAe;MAClBuE,gBAAgB,EAAErB;IACnB;EAAG,CACH,CACc,CAEhB,CAAC;AAEL"}

package/build-module/components/global-styles/block-preview-panel.js CHANGED Viewed

@@ -29,7 +29,7 @@ const BlockPreviewPanel = ({
     return getBlockFromExample(name, example);
   }, [name, blockExample, variation]);
   const viewportWidth = (_blockExample$viewpor = blockExample?.viewportWidth) !== null && _blockExample$viewpor !== void 0 ? _blockExample$viewpor : null;
-  const previewHeight = '150px';
+  const previewHeight = 150;
   if (!blockExample) {
     return null;
   }
@@ -49,7 +49,7 @@ const BlockPreviewPanel = ({
     additionalStyles: [{
       css: `
 								body{
-									min-height:${previewHeight};
+									min-height:${previewHeight}px;
 									display:flex;align-items:center;justify-content:center;
 								}
 							`

package/build-module/components/global-styles/block-preview-panel.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["BlockPreview","getBlockType","getBlockFromExample","__experimentalSpacer","Spacer","useMemo","BlockPreviewPanel","name","variation","_blockExample$viewpor","blockExample","example","blocks","attributes","className","viewportWidth","previewHeight","createElement","marginX","marginBottom","style","maxHeight","boxSizing","minHeight","additionalStyles","css"],"sources":["@wordpress/edit-site/src/components/global-styles/block-preview-panel.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { BlockPreview } from '@wordpress/block-editor';\nimport { getBlockType, getBlockFromExample } from '@wordpress/blocks';\nimport { __experimentalSpacer as Spacer } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\nconst BlockPreviewPanel = ( { name, variation = '' } ) => {\n\tconst blockExample = getBlockType( name )?.example;\n\tconst blocks = useMemo( () => {\n\t\tif ( ! blockExample ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tlet example = blockExample;\n\t\tif ( variation ) {\n\t\t\texample = {\n\t\t\t\t...example,\n\t\t\t\tattributes: {\n\t\t\t\t\t...example.attributes,\n\t\t\t\t\tclassName: 'is-style-' + variation,\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\n\t\treturn getBlockFromExample( name, example );\n\t}, [ name, blockExample, variation ] );\n\n\tconst viewportWidth = blockExample?.viewportWidth ?? null;\n\tconst previewHeight = ~~'150px'~~;\n\n\tif ( ! blockExample ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Spacer marginX={ 4 } marginBottom={ 4 }>\n\t\t\t<div\n\t\t\t\tclassName=\"edit-site-global-styles__block-preview-panel\"\n\t\t\t\tstyle={ { maxHeight: previewHeight, boxSizing: 'initial' } }\n\t\t\t>\n\t\t\t\t<BlockPreview\n\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\tminHeight={ previewHeight }\n\t\t\t\t\tadditionalStyles={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tcss: `\n\t\t\t\t\t\t\t\tbody{\n\t\t\t\t\t\t\t\t\tmin-height:${ previewHeight };\n\t\t\t\t\t\t\t\t\tdisplay:flex;align-items:center;justify-content:center;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</Spacer>\n\t);\n};\n\nexport default BlockPreviewPanel;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,YAAY,QAAQ,yBAAyB;AACtD,SAASC,YAAY,EAAEC,mBAAmB,QAAQ,mBAAmB;AACrE,SAASC,oBAAoB,IAAIC,MAAM,QAAQ,uBAAuB;AACtE,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,MAAMC,iBAAiB,GAAGA,CAAE;EAAEC,IAAI;EAAEC,SAAS,GAAG;AAAG,CAAC,KAAM;EAAA,IAAAC,qBAAA;EACzD,MAAMC,YAAY,GAAGT,YAAY,CAAEM,IAAK,CAAC,EAAEI,OAAO;EAClD,MAAMC,MAAM,GAAGP,OAAO,CAAE,MAAM;IAC7B,IAAK,CAAEK,YAAY,EAAG;MACrB,OAAO,IAAI;IACZ;IAEA,IAAIC,OAAO,GAAGD,YAAY;IAC1B,IAAKF,SAAS,EAAG;MAChBG,OAAO,GAAG;QACT,GAAGA,OAAO;QACVE,UAAU,EAAE;UACX,GAAGF,OAAO,CAACE,UAAU;UACrBC,SAAS,EAAE,WAAW,GAAGN;QAC1B;MACD,CAAC;IACF;IAEA,OAAON,mBAAmB,CAAEK,IAAI,EAAEI,OAAQ,CAAC;EAC5C,CAAC,EAAE,CAAEJ,IAAI,EAAEG,YAAY,EAAEF,SAAS,CAAG,CAAC;EAEtC,MAAMO,aAAa,IAAAN,qBAAA,GAAGC,YAAY,EAAEK,aAAa,cAAAN,qBAAA,cAAAA,qBAAA,GAAI,IAAI;EACzD,MAAMO,aAAa,GAAG,~~OAAO~~;~~EAE7B~~,IAAK,CAAEN,YAAY,EAAG;IACrB,OAAO,IAAI;EACZ;EAEA,OACCO,aAAA,CAACb,MAAM;IAACc,OAAO,EAAG,CAAG;IAACC,YAAY,EAAG;EAAG,GACvCF,aAAA;IACCH,SAAS,EAAC,8CAA8C;IACxDM,KAAK,EAAG;MAAEC,SAAS,EAAEL,aAAa;MAAEM,SAAS,EAAE;IAAU;EAAG,GAE5DL,aAAA,CAACjB,YAAY;IACZY,MAAM,EAAGA,MAAQ;IACjBG,aAAa,EAAGA,aAAe;IAC/BQ,SAAS,EAAGP,aAAe;IAC3BQ,gBAAgB,EAAG,CAClB;MACCC,GAAG,EAAG;AACb;AACA,sBAAuBT,aAAe;AACtC;AACA;AACA;IACM,CAAC;EACC,CACH,CACG,CACE,CAAC;AAEX,CAAC;AAED,eAAeV,iBAAiB"}
1	+ {"version":3,"names":["BlockPreview","getBlockType","getBlockFromExample","__experimentalSpacer","Spacer","useMemo","BlockPreviewPanel","name","variation","_blockExample$viewpor","blockExample","example","blocks","attributes","className","viewportWidth","previewHeight","createElement","marginX","marginBottom","style","maxHeight","boxSizing","minHeight","additionalStyles","css"],"sources":["@wordpress/edit-site/src/components/global-styles/block-preview-panel.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { BlockPreview } from '@wordpress/block-editor';\nimport { getBlockType, getBlockFromExample } from '@wordpress/blocks';\nimport { __experimentalSpacer as Spacer } from '@wordpress/components';\nimport { useMemo } from '@wordpress/element';\n\nconst BlockPreviewPanel = ( { name, variation = '' } ) => {\n\tconst blockExample = getBlockType( name )?.example;\n\tconst blocks = useMemo( () => {\n\t\tif ( ! blockExample ) {\n\t\t\treturn null;\n\t\t}\n\n\t\tlet example = blockExample;\n\t\tif ( variation ) {\n\t\t\texample = {\n\t\t\t\t...example,\n\t\t\t\tattributes: {\n\t\t\t\t\t...example.attributes,\n\t\t\t\t\tclassName: 'is-style-' + variation,\n\t\t\t\t},\n\t\t\t};\n\t\t}\n\n\t\treturn getBlockFromExample( name, example );\n\t}, [ name, blockExample, variation ] );\n\n\tconst viewportWidth = blockExample?.viewportWidth ?? null;\n\tconst previewHeight = 150;\n\n\tif ( ! blockExample ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<Spacer marginX={ 4 } marginBottom={ 4 }>\n\t\t\t<div\n\t\t\t\tclassName=\"edit-site-global-styles__block-preview-panel\"\n\t\t\t\tstyle={ { maxHeight: previewHeight, boxSizing: 'initial' } }\n\t\t\t>\n\t\t\t\t<BlockPreview\n\t\t\t\t\tblocks={ blocks }\n\t\t\t\t\tviewportWidth={ viewportWidth }\n\t\t\t\t\tminHeight={ previewHeight }\n\t\t\t\t\tadditionalStyles={ [\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tcss: `\n\t\t\t\t\t\t\t\tbody{\n\t\t\t\t\t\t\t\t\tmin-height:${ previewHeight }px;\n\t\t\t\t\t\t\t\t\tdisplay:flex;align-items:center;justify-content:center;\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t`,\n\t\t\t\t\t\t},\n\t\t\t\t\t] }\n\t\t\t\t/>\n\t\t\t</div>\n\t\t</Spacer>\n\t);\n};\n\nexport default BlockPreviewPanel;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,YAAY,QAAQ,yBAAyB;AACtD,SAASC,YAAY,EAAEC,mBAAmB,QAAQ,mBAAmB;AACrE,SAASC,oBAAoB,IAAIC,MAAM,QAAQ,uBAAuB;AACtE,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,MAAMC,iBAAiB,GAAGA,CAAE;EAAEC,IAAI;EAAEC,SAAS,GAAG;AAAG,CAAC,KAAM;EAAA,IAAAC,qBAAA;EACzD,MAAMC,YAAY,GAAGT,YAAY,CAAEM,IAAK,CAAC,EAAEI,OAAO;EAClD,MAAMC,MAAM,GAAGP,OAAO,CAAE,MAAM;IAC7B,IAAK,CAAEK,YAAY,EAAG;MACrB,OAAO,IAAI;IACZ;IAEA,IAAIC,OAAO,GAAGD,YAAY;IAC1B,IAAKF,SAAS,EAAG;MAChBG,OAAO,GAAG;QACT,GAAGA,OAAO;QACVE,UAAU,EAAE;UACX,GAAGF,OAAO,CAACE,UAAU;UACrBC,SAAS,EAAE,WAAW,GAAGN;QAC1B;MACD,CAAC;IACF;IAEA,OAAON,mBAAmB,CAAEK,IAAI,EAAEI,OAAQ,CAAC;EAC5C,CAAC,EAAE,CAAEJ,IAAI,EAAEG,YAAY,EAAEF,SAAS,CAAG,CAAC;EAEtC,MAAMO,aAAa,IAAAN,qBAAA,GAAGC,YAAY,EAAEK,aAAa,cAAAN,qBAAA,cAAAA,qBAAA,GAAI,IAAI;EACzD,MAAMO,aAAa,GAAG,GAAG;EAEzB,IAAK,CAAEN,YAAY,EAAG;IACrB,OAAO,IAAI;EACZ;EAEA,OACCO,aAAA,CAACb,MAAM;IAACc,OAAO,EAAG,CAAG;IAACC,YAAY,EAAG;EAAG,GACvCF,aAAA;IACCH,SAAS,EAAC,8CAA8C;IACxDM,KAAK,EAAG;MAAEC,SAAS,EAAEL,aAAa;MAAEM,SAAS,EAAE;IAAU;EAAG,GAE5DL,aAAA,CAACjB,YAAY;IACZY,MAAM,EAAGA,MAAQ;IACjBG,aAAa,EAAGA,aAAe;IAC/BQ,SAAS,EAAGP,aAAe;IAC3BQ,gBAAgB,EAAG,CAClB;MACCC,GAAG,EAAG;AACb;AACA,sBAAuBT,aAAe;AACtC;AACA;AACA;IACM,CAAC;EACC,CACH,CACG,CACE,CAAC;AAEX,CAAC;AAED,eAAeV,iBAAiB"}

package/build-module/components/global-styles/font-library-modal/collection-font-details.js CHANGED Viewed

@@ -35,7 +35,7 @@ function CollectionFontDetails({
     // If the font has no fontFace, we want to check if the font is in the outline
     fontToInstallOutline)
   }))), createElement(Spacer, {
-    margin: 8
+    margin: 16
   }));
 }
 export default CollectionFontDetails;

package/build-module/components/global-styles/font-library-modal/collection-font-details.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__experimentalVStack","VStack","__experimentalSpacer","Spacer","CollectionFontVariant","isFontFontFaceInOutline","sortFontFaces","CollectionFontDetails","font","handleToggleVariant","fontToInstallOutline","fontFaces","fontFace","length","fontFamily","fontStyle","fontWeight","createElement","Fragment","margin","spacing","map","face","i","key","selected","slug"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/collection-font-details.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n} from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport CollectionFontVariant from './collection-font-variant';\nimport { isFontFontFaceInOutline } from './utils/fonts-outline';\nimport { sortFontFaces } from './utils/sort-font-faces';\n\nfunction CollectionFontDetails( {\n\tfont,\n\thandleToggleVariant,\n\tfontToInstallOutline,\n} ) {\n\tconst fontFaces =\n\t\tfont.fontFace && font.fontFace.length\n\t\t\t? sortFontFaces( font.fontFace )\n\t\t\t: [\n\t\t\t\t\t{\n\t\t\t\t\t\tfontFamily: font.fontFamily,\n\t\t\t\t\t\tfontStyle: 'normal',\n\t\t\t\t\t\tfontWeight: '400',\n\t\t\t\t\t},\n\t\t\t ];\n\n\treturn (\n\t\t<>\n\t\t\t<Spacer margin={ 4 } />\n\t\t\t<VStack spacing={ 0 }>\n\t\t\t\t<Spacer margin={ 8 } />\n\t\t\t\t{ fontFaces.map( ( face, i ) => (\n\t\t\t\t\t<CollectionFontVariant\n\t\t\t\t\t\tfont={ font }\n\t\t\t\t\t\tface={ face }\n\t\t\t\t\t\tkey={ `face${ i }` }\n\t\t\t\t\t\thandleToggleVariant={ handleToggleVariant }\n\t\t\t\t\t\tselected={ isFontFontFaceInOutline(\n\t\t\t\t\t\t\tfont.slug,\n\t\t\t\t\t\t\tfont.fontFace ? face : null, // If the font has no fontFace, we want to check if the font is in the outline\n\t\t\t\t\t\t\tfontToInstallOutline\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</VStack>\n\t\t\t<Spacer margin={ 8 } />\n\t\t</>\n\t);\n}\n\nexport default CollectionFontDetails;\n"],"mappings":";AAAA;AACA;AACA;AACA,SACCA,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,QACxB,uBAAuB;;AAE9B;AACA;AACA;AACA,OAAOC,qBAAqB,MAAM,2BAA2B;AAC7D,SAASC,uBAAuB,QAAQ,uBAAuB;AAC/D,SAASC,aAAa,QAAQ,yBAAyB;AAEvD,SAASC,qBAAqBA,CAAE;EAC/BC,IAAI;EACJC,mBAAmB;EACnBC;AACD,CAAC,EAAG;EACH,MAAMC,SAAS,GACdH,IAAI,CAACI,QAAQ,IAAIJ,IAAI,CAACI,QAAQ,CAACC,MAAM,GAClCP,aAAa,CAAEE,IAAI,CAACI,QAAS,CAAC,GAC9B,CACA;IACCE,UAAU,EAAEN,IAAI,CAACM,UAAU;IAC3BC,SAAS,EAAE,QAAQ;IACnBC,UAAU,EAAE;EACb,CAAC,CACA;EAEL,OACCC,aAAA,CAAAC,QAAA,QACCD,aAAA,CAACd,MAAM;IAACgB,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBF,aAAA,CAAChB,MAAM;IAACmB,OAAO,EAAG;EAAG,GACpBH,aAAA,CAACd,MAAM;IAACgB,MAAM,EAAG;EAAG,CAAE,CAAC,EACrBR,SAAS,CAACU,GAAG,CAAE,CAAEC,IAAI,EAAEC,CAAC,KACzBN,aAAA,CAACb,qBAAqB;IACrBI,IAAI,EAAGA,IAAM;IACbc,IAAI,EAAGA,IAAM;IACbE,GAAG,EAAI,OAAOD,CAAG,EAAG;IACpBd,mBAAmB,EAAGA,mBAAqB;IAC3CgB,QAAQ,EAAGpB,uBAAuB,CACjCG,IAAI,CAACkB,IAAI,EACTlB,IAAI,CAACI,QAAQ,GAAGU,IAAI,GAAG,IAAI;IAAE;IAC7BZ,oBACD;EAAG,CACH,CACA,CACK,CAAC,EACTO,aAAA,CAACd,MAAM;IAACgB,MAAM,EAAG;~~EAAG~~,CAAE,~~CACrB~~,CAAC;AAEL;AAEA,eAAeZ,qBAAqB"}
1	+ {"version":3,"names":["__experimentalVStack","VStack","__experimentalSpacer","Spacer","CollectionFontVariant","isFontFontFaceInOutline","sortFontFaces","CollectionFontDetails","font","handleToggleVariant","fontToInstallOutline","fontFaces","fontFace","length","fontFamily","fontStyle","fontWeight","createElement","Fragment","margin","spacing","map","face","i","key","selected","slug"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/collection-font-details.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\t__experimentalVStack as VStack,\n\t__experimentalSpacer as Spacer,\n} from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport CollectionFontVariant from './collection-font-variant';\nimport { isFontFontFaceInOutline } from './utils/fonts-outline';\nimport { sortFontFaces } from './utils/sort-font-faces';\n\nfunction CollectionFontDetails( {\n\tfont,\n\thandleToggleVariant,\n\tfontToInstallOutline,\n} ) {\n\tconst fontFaces =\n\t\tfont.fontFace && font.fontFace.length\n\t\t\t? sortFontFaces( font.fontFace )\n\t\t\t: [\n\t\t\t\t\t{\n\t\t\t\t\t\tfontFamily: font.fontFamily,\n\t\t\t\t\t\tfontStyle: 'normal',\n\t\t\t\t\t\tfontWeight: '400',\n\t\t\t\t\t},\n\t\t\t ];\n\n\treturn (\n\t\t<>\n\t\t\t<Spacer margin={ 4 } />\n\t\t\t<VStack spacing={ 0 }>\n\t\t\t\t<Spacer margin={ 8 } />\n\t\t\t\t{ fontFaces.map( ( face, i ) => (\n\t\t\t\t\t<CollectionFontVariant\n\t\t\t\t\t\tfont={ font }\n\t\t\t\t\t\tface={ face }\n\t\t\t\t\t\tkey={ `face${ i }` }\n\t\t\t\t\t\thandleToggleVariant={ handleToggleVariant }\n\t\t\t\t\t\tselected={ isFontFontFaceInOutline(\n\t\t\t\t\t\t\tfont.slug,\n\t\t\t\t\t\t\tfont.fontFace ? face : null, // If the font has no fontFace, we want to check if the font is in the outline\n\t\t\t\t\t\t\tfontToInstallOutline\n\t\t\t\t\t\t) }\n\t\t\t\t\t/>\n\t\t\t\t) ) }\n\t\t\t</VStack>\n\t\t\t<Spacer margin={ 16 } />\n\t\t</>\n\t);\n}\n\nexport default CollectionFontDetails;\n"],"mappings":";AAAA;AACA;AACA;AACA,SACCA,oBAAoB,IAAIC,MAAM,EAC9BC,oBAAoB,IAAIC,MAAM,QACxB,uBAAuB;;AAE9B;AACA;AACA;AACA,OAAOC,qBAAqB,MAAM,2BAA2B;AAC7D,SAASC,uBAAuB,QAAQ,uBAAuB;AAC/D,SAASC,aAAa,QAAQ,yBAAyB;AAEvD,SAASC,qBAAqBA,CAAE;EAC/BC,IAAI;EACJC,mBAAmB;EACnBC;AACD,CAAC,EAAG;EACH,MAAMC,SAAS,GACdH,IAAI,CAACI,QAAQ,IAAIJ,IAAI,CAACI,QAAQ,CAACC,MAAM,GAClCP,aAAa,CAAEE,IAAI,CAACI,QAAS,CAAC,GAC9B,CACA;IACCE,UAAU,EAAEN,IAAI,CAACM,UAAU;IAC3BC,SAAS,EAAE,QAAQ;IACnBC,UAAU,EAAE;EACb,CAAC,CACA;EAEL,OACCC,aAAA,CAAAC,QAAA,QACCD,aAAA,CAACd,MAAM;IAACgB,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBF,aAAA,CAAChB,MAAM;IAACmB,OAAO,EAAG;EAAG,GACpBH,aAAA,CAACd,MAAM;IAACgB,MAAM,EAAG;EAAG,CAAE,CAAC,EACrBR,SAAS,CAACU,GAAG,CAAE,CAAEC,IAAI,EAAEC,CAAC,KACzBN,aAAA,CAACb,qBAAqB;IACrBI,IAAI,EAAGA,IAAM;IACbc,IAAI,EAAGA,IAAM;IACbE,GAAG,EAAI,OAAOD,CAAG,EAAG;IACpBd,mBAAmB,EAAGA,mBAAqB;IAC3CgB,QAAQ,EAAGpB,uBAAuB,CACjCG,IAAI,CAACkB,IAAI,EACTlB,IAAI,CAACI,QAAQ,GAAGU,IAAI,GAAG,IAAI;IAAE;IAC7BZ,oBACD;EAAG,CACH,CACA,CACK,CAAC,EACTO,aAAA,CAACd,MAAM;IAACgB,MAAM,EAAG;EAAI,CAAE,CACtB,CAAC;AAEL;AAEA,eAAeZ,qBAAqB"}

package/build-module/components/global-styles/font-library-modal/font-collection.js CHANGED Viewed

@@ -2,10 +2,10 @@ import { createElement, Fragment } from "react";
 /**
  * WordPress dependencies
  */
-import { useContext, useEffect, useState, useMemo } from '@wordpress/element';
-import { __experimentalSpacer as Spacer, __experimentalInputControl as InputControl, __experimentalText as Text, SelectControl, Spinner, Icon, FlexItem, Flex, Button } from '@wordpress/components';
+import { useContext, useEffect, useState, useMemo, createInterpolateElement } from '@wordpress/element';
+import { __experimentalSpacer as Spacer, __experimentalInputControl as InputControl, __experimentalText as Text, __experimentalHStack as HStack, SelectControl, Spinner, Icon, FlexItem, Flex, Button } from '@wordpress/components';
 import { debounce } from '@wordpress/compose';
-import { __, _x } from '@wordpress/i18n';
+import { sprintf, __, _x } from '@wordpress/i18n';
 import { search, closeSmall } from '@wordpress/icons';
 /**
@@ -13,7 +13,6 @@ import { search, closeSmall } from '@wordpress/icons';
  */
 import TabPanelLayout from './tab-panel-layout';
 import { FontLibraryContext } from './context';
-import FontsGrid from './fonts-grid';
 import FontCard from './font-card';
 import filterFonts from './utils/filter-fonts';
 import CollectionFontDetails from './collection-font-details';
@@ -35,6 +34,7 @@ function FontCollection({
   };
   const [selectedFont, setSelectedFont] = useState(null);
   const [fontsToInstall, setFontsToInstall] = useState([]);
+  const [page, setPage] = useState(1);
   const [filters, setFilters] = useState({});
   const [renderConfirmDialog, setRenderConfirmDialog] = useState(requiresPermission && !getGoogleFontsPermissionFromStorage());
   const {
@@ -84,27 +84,39 @@ function FontCollection({
   const collectionCategories = (_selectedCollection$c = selectedCollection?.categories) !== null && _selectedCollection$c !== void 0 ? _selectedCollection$c : [];
   const categories = [DEFAULT_CATEGORY, ...collectionCategories];
   const fonts = useMemo(() => filterFonts(collectionFonts, filters), [collectionFonts, filters]);
+  // NOTE: The height of the font library modal unavailable to use for rendering font family items is roughly 417px
+  // The height of each font family item is 61px.
+  const pageSize = Math.floor((window.innerHeight - 417) / 61);
+  const totalPages = Math.ceil(fonts.length / pageSize);
+  const itemsStart = (page - 1) * pageSize;
+  const itemsLimit = page * pageSize;
+  const items = fonts.slice(itemsStart, itemsLimit);
   const handleCategoryFilter = category => {
     setFilters({
       ...filters,
       category
     });
+    setPage(1);
   };
   const handleUpdateSearchInput = value => {
     setFilters({
       ...filters,
       search: value
     });
+    setPage(1);
   };
   const debouncedUpdateSearchInput = debounce(handleUpdateSearchInput, 300);
   const resetFilters = () => {
     setFilters({});
+    setPage(1);
   };
   const resetSearch = () => {
     setFilters({
       ...filters,
       search: ''
     });
+    setPage(1);
   };
   const handleUnselectFont = () => {
     setSelectedFont(null);
@@ -151,15 +163,25 @@ function FontCollection({
     }
     resetFontsToInstall();
   };
+  let footerComponent = null;
+  if (selectedFont) {
+    footerComponent = createElement(InstallFooter, {
+      handleInstall: handleInstall,
+      isDisabled: fontsToInstall.length === 0
+    });
+  } else if (!renderConfirmDialog && totalPages > 1) {
+    footerComponent = createElement(PaginationFooter, {
+      page: page,
+      totalPages: totalPages,
+      setPage: setPage
+    });
+  }
   return createElement(TabPanelLayout, {
     title: !selectedFont ? selectedCollection.name : selectedFont.name,
     description: !selectedFont ? selectedCollection.description : __('Select font variants to install.'),
     notice: notice,
     handleBack: !!selectedFont && handleUnselectFont,
-    footer: createElement(Footer, {
-      handleInstall: handleInstall,
-      isDisabled: fontsToInstall.length === 0
-    })
+    footer: footerComponent
   }, renderConfirmDialog && createElement(Fragment, null, createElement(Spacer, {
     margin: 8
   }), createElement(GoogleFontsConfirmDialog, null)), !renderConfirmDialog && !selectedFont && createElement(Flex, null, createElement(FlexItem, null, createElement(InputControl, {
@@ -187,7 +209,9 @@ function FontCollection({
     font: selectedFont,
     handleToggleVariant: handleToggleVariant,
     fontToInstallOutline: fontToInstallOutline
-  }), !renderConfirmDialog && !selectedFont && createElement(FontsGrid, null, fonts.map(font => createElement(FontCard, {
+  }), !renderConfirmDialog && !selectedFont && createElement("div", {
+    className: "font-library-modal__fonts-grid__main"
+  }, items.map(font => createElement(FontCard, {
     key: font.font_family_settings.slug,
     font: font.font_family_settings,
     onClick: () => {
@@ -195,7 +219,60 @@ function FontCollection({
     }
   }))));
 }
-function Footer({
+function PaginationFooter({
+  page,
+  totalPages,
+  setPage
+}) {
+  return createElement(Flex, {
+    justify: "center"
+  }, createElement(Button, {
+    label: __('First page'),
+    size: "compact",
+    onClick: () => setPage(1),
+    disabled: page === 1,
+    __experimentalIsFocusable: true
+  }, createElement("span", null, "\xAB")), createElement(Button, {
+    label: __('Previous page'),
+    size: "compact",
+    onClick: () => setPage(page - 1),
+    disabled: page === 1,
+    __experimentalIsFocusable: true
+  }, createElement("span", null, "\u2039")), createElement(HStack, {
+    justify: "flex-start",
+    expanded: false,
+    spacing: 2
+  }, createInterpolateElement(sprintf(
+  // translators: %s: Total number of pages.
+  _x('Page <CurrenPageControl /> of %s', 'paging'), totalPages), {
+    CurrenPageControl: createElement(SelectControl, {
+      "aria-label": __('Current page'),
+      value: page,
+      options: [...Array(totalPages)].map((e, i) => {
+        return {
+          label: i + 1,
+          value: i + 1
+        };
+      }),
+      onChange: newPage => setPage(parseInt(newPage)),
+      size: 'compact',
+      __nextHasNoMarginBottom: true
+    })
+  })), createElement(Button, {
+    label: __('Next page'),
+    size: "compact",
+    onClick: () => setPage(page + 1),
+    disabled: page === totalPages,
+    __experimentalIsFocusable: true
+  }, createElement("span", null, "\u203A")), createElement(Button, {
+    label: __('Last page'),
+    size: "compact",
+    onClick: () => setPage(totalPages),
+    disabled: page === totalPages,
+    __experimentalIsFocusable: true
+  }, createElement("span", null, "\xBB")));
+}
+function InstallFooter({
   handleInstall,
   isDisabled
 }) {

package/build-module/components/global-styles/font-library-modal/font-collection.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["useContext","useEffect","useState","useMemo","__experimentalSpacer","Spacer","__experimentalInputControl","InputControl","__experimentalText","Text","SelectControl","Spinner","Icon","FlexItem","Flex","Button","debounce","__","_x","search","closeSmall","TabPanelLayout","FontLibraryContext","FontsGrid","FontCard","filterFonts","CollectionFontDetails","toggleFont","getFontsOutline","GoogleFontsConfirmDialog","downloadFontFaceAssets","DEFAULT_CATEGORY","slug","name","FontCollection","_selectedCollection$c","requiresPermission","getGoogleFontsPermissionFromStorage","window","localStorage","getItem","selectedFont","setSelectedFont","fontsToInstall","setFontsToInstall","filters","setFilters","renderConfirmDialog","setRenderConfirmDialog","collections","getFontCollection","installFont","notice","setNotice","selectedCollection","find","collection","handleStorage","addEventListener","removeEventListener","fetchFontCollection","resetFilters","e","type","message","collectionFonts","_selectedCollection$f","font_families","collectionCategories","categories","fonts","handleCategoryFilter","category","handleUpdateSearchInput","value","debouncedUpdateSearchInput","resetSearch","handleUnselectFont","handleToggleVariant","font","face","newFontsToInstall","fontToInstallOutline","resetFontsToInstall","handleInstall","fontFamily","fontFace","Promise","all","map","src","file","error","createElement","title","description","handleBack","footer","Footer","isDisabled","length","Fragment","margin","placeholder","label","onChange","prefix","icon","suffix","onClick","key","font_family_settings","isInstalling","justify","variant","isBusy","disabled","__experimentalIsFocusable"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/font-collection.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { useContext, useEffect, useState, useMemo } from '@wordpress/element';\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalInputControl as InputControl,\n\t__experimentalText as Text,\n\tSelectControl,\n\tSpinner,\n\tIcon,\n\tFlexItem,\n\tFlex,\n\tButton,\n} from '@wordpress/components';\nimport { debounce } from '@wordpress/compose';\nimport { __, _x } from '@wordpress/i18n';\nimport { search, closeSmall } from '@wordpress/icons';\n\n/\n Internal dependencies\n */\nimport TabPanelLayout from './tab-panel-layout';\nimport { FontLibraryContext } from './context';\nimport FontsGrid from './fonts-grid';\nimport FontCard from './font-card';\nimport filterFonts from './utils/filter-fonts';\nimport CollectionFontDetails from './collection-font-details';\nimport { toggleFont } from './utils/toggleFont';\nimport { getFontsOutline } from './utils/fonts-outline';\nimport GoogleFontsConfirmDialog from './google-fonts-confirm-dialog';\nimport { downloadFontFaceAssets } from './utils';\n\nconst DEFAULT_CATEGORY = {\n\tslug: 'all',\n\tname: _x( 'All', 'font categories' ),\n};\nfunction FontCollection( { slug } ) {\n\tconst requiresPermission = slug === 'google-fonts';\n\n\tconst getGoogleFontsPermissionFromStorage = () => {\n\t\treturn (\n\t\t\twindow.localStorage.getItem(\n\t\t\t\t'wp-font-library-google-fonts-permission'\n\t\t\t) === 'true'\n\t\t);\n\t};\n\n\tconst [ selectedFont, setSelectedFont ] = useState( null );\n\tconst [ fontsToInstall, setFontsToInstall ] = useState( [] );\n\tconst [ filters, setFilters ] = useState( {} );\n\tconst [ renderConfirmDialog, setRenderConfirmDialog ] = useState(\n\t\trequiresPermission && ! getGoogleFontsPermissionFromStorage()\n\t);\n\tconst { collections, getFontCollection, installFont, notice, setNotice } =\n\t\tuseContext( FontLibraryContext );\n\tconst selectedCollection = collections.find(\n\t\t( collection ) => collection.slug === slug\n\t);\n\n\tuseEffect( () => {\n\t\tconst handleStorage = () => {\n\t\t\tsetRenderConfirmDialog(\n\t\t\t\trequiresPermission && ! getGoogleFontsPermissionFromStorage()\n\t\t\t);\n\t\t};\n\t\thandleStorage();\n\t\twindow.addEventListener( 'storage', handleStorage );\n\t\treturn () => window.removeEventListener( 'storage', handleStorage );\n\t}, [ slug, requiresPermission ] );\n\n\tuseEffect( () => {\n\t\tconst fetchFontCollection = async () => {\n\t\t\ttry {\n\t\t\t\tawait getFontCollection( slug );\n\t\t\t\tresetFilters();\n\t\t\t} catch ( e ) {\n\t\t\t\tif ( ! notice ) {\n\t\t\t\t\tsetNotice( {\n\t\t\t\t\t\ttype: 'error',\n\t\t\t\t\t\tmessage: e?.message,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tfetchFontCollection();\n\t}, [ slug, getFontCollection, setNotice, notice ] );\n\n\tuseEffect( () => {\n\t\tsetSelectedFont( null );\n\t\tsetNotice( null );\n\t}, [ slug, setNotice ] );\n\n\tuseEffect( () => {\n\t\t// If the selected fonts change, reset the selected fonts to install\n\t\tsetFontsToInstall( [] );\n\t}, [ selectedFont ] );\n\n\tconst collectionFonts = useMemo(\n\t\t() => selectedCollection?.font_families ?? [],\n\t\t[ selectedCollection ]\n\t);\n\tconst collectionCategories = selectedCollection?.categories ?? [];\n\n\tconst categories = [ DEFAULT_CATEGORY, ...collectionCategories ];\n\n\tconst fonts = useMemo(\n\t\t() => filterFonts( collectionFonts, filters ),\n\t\t[ collectionFonts, filters ]\n\t);\n\n\tconst handleCategoryFilter = ( category ) => {\n\t\tsetFilters( { ...filters, category } );\n\t};\n\n\tconst handleUpdateSearchInput = ( value ) => {\n\t\tsetFilters( { ...filters, search: value } );\n\t};\n\n\tconst debouncedUpdateSearchInput = debounce( handleUpdateSearchInput, 300 );\n\n\tconst resetFilters = () => {\n\t\tsetFilters( {} );\n\t};\n\n\tconst resetSearch = () => {\n\t\tsetFilters( { ...filters, search: '' } );\n\t};\n\n\tconst handleUnselectFont = () => {\n\t\tsetSelectedFont( null );\n\t};\n\n\tconst handleToggleVariant = ( font, face ) => {\n\t\tconst newFontsToInstall = toggleFont( font, face, fontsToInstall );\n\t\tsetFontsToInstall( newFontsToInstall );\n\t};\n\n\tconst fontToInstallOutline = getFontsOutline( fontsToInstall );\n\n\tconst resetFontsToInstall = () => {\n\t\tsetFontsToInstall( [] );\n\t};\n\n\tconst handleInstall = async () => {\n\t\tsetNotice( null );\n\n\t\tconst fontFamily = fontsToInstall[ 0 ];\n\n\t\ttry {\n\t\t\tif ( fontFamily?.fontFace ) {\n\t\t\t\tawait Promise.all(\n\t\t\t\t\tfontFamily.fontFace.map( async ( fontFace ) => {\n\t\t\t\t\t\tif ( fontFace.src ) {\n\t\t\t\t\t\t\tfontFace.file = await downloadFontFaceAssets(\n\t\t\t\t\t\t\t\tfontFace.src\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t} )\n\t\t\t\t);\n\t\t\t}\n\t\t} catch ( error ) {\n\t\t\t// If any of the fonts fail to download,\n\t\t\t// show an error notice and stop the request from being sent.\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage: __(\n\t\t\t\t\t'Error installing the fonts, could not be downloaded.'\n\t\t\t\t),\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tawait installFont( fontFamily );\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'success',\n\t\t\t\tmessage: __( 'Fonts were installed successfully.' ),\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage: error.message,\n\t\t\t} );\n\t\t}\n\t\tresetFontsToInstall();\n\t};\n\n\treturn (\n\t\t<TabPanelLayout\n\t\t\ttitle={\n\t\t\t\t! selectedFont ? selectedCollection.name : selectedFont.name\n\t\t\t}\n\t\t\tdescription={\n\t\t\t\t! selectedFont\n\t\t\t\t\t? selectedCollection.description\n\t\t\t\t\t: __( 'Select font variants to install.' )\n\t\t\t}\n\t\t\tnotice={ notice }\n\t\t\thandleBack={ !! selectedFont && handleUnselectFont }\n\t\t\tfooter={\n\t\t\t\t<Footer\n\t\t\t\t\thandleInstall={ handleInstall }\n\t\t\t\t\tisDisabled={ fontsToInstall.length === 0 }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t{ renderConfirmDialog && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer margin={ 8 } />\n\t\t\t\t\t<GoogleFontsConfirmDialog />\n\t\t\t\t</>\n\t\t\t) }\n\n\t\t\t{ ! renderConfirmDialog && ! selectedFont && (\n\t\t\t\t<Flex>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tvalue={ filters.search }\n\t\t\t\t\t\t\tplaceholder={ __( 'Font name…' ) }\n\t\t\t\t\t\t\tlabel={ __( 'Search' ) }\n\t\t\t\t\t\t\tonChange={ debouncedUpdateSearchInput }\n\t\t\t\t\t\t\tprefix={ <Icon icon={ search } /> }\n\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\tfilters?.search ? (\n\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\t\tonClick={ resetSearch }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\tlabel={ __( 'Category' ) }\n\t\t\t\t\t\t\tvalue={ filters.category }\n\t\t\t\t\t\t\tonChange={ handleCategoryFilter }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ categories &&\n\t\t\t\t\t\t\t\tcategories.map( ( category ) => (\n\t\t\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\t\t\tvalue={ category.slug }\n\t\t\t\t\t\t\t\t\t\tkey={ category.slug }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ category.name }\n\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</SelectControl>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t) }\n\n\t\t\t<Spacer margin={ 4 } />\n\t\t\t{ ! renderConfirmDialog &&\n\t\t\t\t! selectedCollection?.font_families &&\n\t\t\t\t! notice && <Spinner /> }\n\n\t\t\t{ ! renderConfirmDialog &&\n\t\t\t\t!! selectedCollection?.font_families?.length &&\n\t\t\t\t! fonts.length && (\n\t\t\t\t\t<Text>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'No fonts found. Try with a different search term'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\n\t\t\t{ ! renderConfirmDialog && selectedFont && (\n\t\t\t\t<CollectionFontDetails\n\t\t\t\t\tfont={ selectedFont }\n\t\t\t\t\thandleToggleVariant={ handleToggleVariant }\n\t\t\t\t\tfontToInstallOutline={ fontToInstallOutline }\n\t\t\t\t/>\n\t\t\t) }\n\n\t\t\t{ ! renderConfirmDialog && ! selectedFont && (\n\t\t\t\t<FontsGrid>\n\t\t\t\t\t{ fonts.map( ( font ) => (\n\t\t\t\t\t\t<FontCard\n\t\t\t\t\t\t\tkey={ font.font_family_settings.slug }\n\t\t\t\t\t\t\tfont={ font.font_family_settings }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetSelectedFont( font.font_family_settings );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</FontsGrid>\n\t\t\t) }\n\t\t</TabPanelLayout>\n\t);\n}\n\nfunction Footer( { handleInstall, isDisabled } ) {\n\tconst { isInstalling } = useContext( FontLibraryContext );\n\n\treturn (\n\t\t<Flex justify=\"flex-end\">\n\t\t\t<Button\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tonClick={ handleInstall }\n\t\t\t\tisBusy={ isInstalling }\n\t\t\t\tdisabled={ isDisabled \|\| isInstalling }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t{ __( 'Install' ) }\n\t\t\t</Button>\n\t\t</Flex>\n\t);\n}\n\nexport default FontCollection;\n"],"mappings":"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"}
1	+ {"version":3,"names":["useContext","useEffect","useState","useMemo","createInterpolateElement","__experimentalSpacer","Spacer","__experimentalInputControl","InputControl","__experimentalText","Text","__experimentalHStack","HStack","SelectControl","Spinner","Icon","FlexItem","Flex","Button","debounce","sprintf","__","_x","search","closeSmall","TabPanelLayout","FontLibraryContext","FontCard","filterFonts","CollectionFontDetails","toggleFont","getFontsOutline","GoogleFontsConfirmDialog","downloadFontFaceAssets","DEFAULT_CATEGORY","slug","name","FontCollection","_selectedCollection$c","requiresPermission","getGoogleFontsPermissionFromStorage","window","localStorage","getItem","selectedFont","setSelectedFont","fontsToInstall","setFontsToInstall","page","setPage","filters","setFilters","renderConfirmDialog","setRenderConfirmDialog","collections","getFontCollection","installFont","notice","setNotice","selectedCollection","find","collection","handleStorage","addEventListener","removeEventListener","fetchFontCollection","resetFilters","e","type","message","collectionFonts","_selectedCollection$f","font_families","collectionCategories","categories","fonts","pageSize","Math","floor","innerHeight","totalPages","ceil","length","itemsStart","itemsLimit","items","slice","handleCategoryFilter","category","handleUpdateSearchInput","value","debouncedUpdateSearchInput","resetSearch","handleUnselectFont","handleToggleVariant","font","face","newFontsToInstall","fontToInstallOutline","resetFontsToInstall","handleInstall","fontFamily","fontFace","Promise","all","map","src","file","error","footerComponent","createElement","InstallFooter","isDisabled","PaginationFooter","title","description","handleBack","footer","Fragment","margin","placeholder","label","onChange","prefix","icon","suffix","onClick","key","className","font_family_settings","justify","size","disabled","__experimentalIsFocusable","expanded","spacing","CurrenPageControl","options","Array","i","newPage","parseInt","__nextHasNoMarginBottom","isInstalling","variant","isBusy"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/font-collection.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport {\n\tuseContext,\n\tuseEffect,\n\tuseState,\n\tuseMemo,\n\tcreateInterpolateElement,\n} from '@wordpress/element';\nimport {\n\t__experimentalSpacer as Spacer,\n\t__experimentalInputControl as InputControl,\n\t__experimentalText as Text,\n\t__experimentalHStack as HStack,\n\tSelectControl,\n\tSpinner,\n\tIcon,\n\tFlexItem,\n\tFlex,\n\tButton,\n} from '@wordpress/components';\nimport { debounce } from '@wordpress/compose';\nimport { sprintf, __, _x } from '@wordpress/i18n';\nimport { search, closeSmall } from '@wordpress/icons';\n\n/\n Internal dependencies\n /\nimport TabPanelLayout from './tab-panel-layout';\nimport { FontLibraryContext } from './context';\nimport FontCard from './font-card';\nimport filterFonts from './utils/filter-fonts';\nimport CollectionFontDetails from './collection-font-details';\nimport { toggleFont } from './utils/toggleFont';\nimport { getFontsOutline } from './utils/fonts-outline';\nimport GoogleFontsConfirmDialog from './google-fonts-confirm-dialog';\nimport { downloadFontFaceAssets } from './utils';\n\nconst DEFAULT_CATEGORY = {\n\tslug: 'all',\n\tname: _x( 'All', 'font categories' ),\n};\nfunction FontCollection( { slug } ) {\n\tconst requiresPermission = slug === 'google-fonts';\n\n\tconst getGoogleFontsPermissionFromStorage = () => {\n\t\treturn (\n\t\t\twindow.localStorage.getItem(\n\t\t\t\t'wp-font-library-google-fonts-permission'\n\t\t\t) === 'true'\n\t\t);\n\t};\n\n\tconst [ selectedFont, setSelectedFont ] = useState( null );\n\tconst [ fontsToInstall, setFontsToInstall ] = useState( [] );\n\tconst [ page, setPage ] = useState( 1 );\n\tconst [ filters, setFilters ] = useState( {} );\n\tconst [ renderConfirmDialog, setRenderConfirmDialog ] = useState(\n\t\trequiresPermission && ! getGoogleFontsPermissionFromStorage()\n\t);\n\tconst { collections, getFontCollection, installFont, notice, setNotice } =\n\t\tuseContext( FontLibraryContext );\n\tconst selectedCollection = collections.find(\n\t\t( collection ) => collection.slug === slug\n\t);\n\n\tuseEffect( () => {\n\t\tconst handleStorage = () => {\n\t\t\tsetRenderConfirmDialog(\n\t\t\t\trequiresPermission && ! getGoogleFontsPermissionFromStorage()\n\t\t\t);\n\t\t};\n\t\thandleStorage();\n\t\twindow.addEventListener( 'storage', handleStorage );\n\t\treturn () => window.removeEventListener( 'storage', handleStorage );\n\t}, [ slug, requiresPermission ] );\n\n\tuseEffect( () => {\n\t\tconst fetchFontCollection = async () => {\n\t\t\ttry {\n\t\t\t\tawait getFontCollection( slug );\n\t\t\t\tresetFilters();\n\t\t\t} catch ( e ) {\n\t\t\t\tif ( ! notice ) {\n\t\t\t\t\tsetNotice( {\n\t\t\t\t\t\ttype: 'error',\n\t\t\t\t\t\tmessage: e?.message,\n\t\t\t\t\t} );\n\t\t\t\t}\n\t\t\t}\n\t\t};\n\t\tfetchFontCollection();\n\t}, [ slug, getFontCollection, setNotice, notice ] );\n\n\tuseEffect( () => {\n\t\tsetSelectedFont( null );\n\t\tsetNotice( null );\n\t}, [ slug, setNotice ] );\n\n\tuseEffect( () => {\n\t\t// If the selected fonts change, reset the selected fonts to install\n\t\tsetFontsToInstall( [] );\n\t}, [ selectedFont ] );\n\n\tconst collectionFonts = useMemo(\n\t\t() => selectedCollection?.font_families ?? [],\n\t\t[ selectedCollection ]\n\t);\n\tconst collectionCategories = selectedCollection?.categories ?? [];\n\n\tconst categories = [ DEFAULT_CATEGORY, ...collectionCategories ];\n\n\tconst fonts = useMemo(\n\t\t() => filterFonts( collectionFonts, filters ),\n\t\t[ collectionFonts, filters ]\n\t);\n\n\t// NOTE: The height of the font library modal unavailable to use for rendering font family items is roughly 417px\n\t// The height of each font family item is 61px.\n\tconst pageSize = Math.floor( ( window.innerHeight - 417 ) / 61 );\n\tconst totalPages = Math.ceil( fonts.length / pageSize );\n\tconst itemsStart = ( page - 1 ) pageSize;\n\tconst itemsLimit = page * pageSize;\n\tconst items = fonts.slice( itemsStart, itemsLimit );\n\n\tconst handleCategoryFilter = ( category ) => {\n\t\tsetFilters( { ...filters, category } );\n\t\tsetPage( 1 );\n\t};\n\n\tconst handleUpdateSearchInput = ( value ) => {\n\t\tsetFilters( { ...filters, search: value } );\n\t\tsetPage( 1 );\n\t};\n\n\tconst debouncedUpdateSearchInput = debounce( handleUpdateSearchInput, 300 );\n\n\tconst resetFilters = () => {\n\t\tsetFilters( {} );\n\t\tsetPage( 1 );\n\t};\n\n\tconst resetSearch = () => {\n\t\tsetFilters( { ...filters, search: '' } );\n\t\tsetPage( 1 );\n\t};\n\n\tconst handleUnselectFont = () => {\n\t\tsetSelectedFont( null );\n\t};\n\n\tconst handleToggleVariant = ( font, face ) => {\n\t\tconst newFontsToInstall = toggleFont( font, face, fontsToInstall );\n\t\tsetFontsToInstall( newFontsToInstall );\n\t};\n\n\tconst fontToInstallOutline = getFontsOutline( fontsToInstall );\n\n\tconst resetFontsToInstall = () => {\n\t\tsetFontsToInstall( [] );\n\t};\n\n\tconst handleInstall = async () => {\n\t\tsetNotice( null );\n\n\t\tconst fontFamily = fontsToInstall[ 0 ];\n\n\t\ttry {\n\t\t\tif ( fontFamily?.fontFace ) {\n\t\t\t\tawait Promise.all(\n\t\t\t\t\tfontFamily.fontFace.map( async ( fontFace ) => {\n\t\t\t\t\t\tif ( fontFace.src ) {\n\t\t\t\t\t\t\tfontFace.file = await downloadFontFaceAssets(\n\t\t\t\t\t\t\t\tfontFace.src\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t}\n\t\t\t\t\t} )\n\t\t\t\t);\n\t\t\t}\n\t\t} catch ( error ) {\n\t\t\t// If any of the fonts fail to download,\n\t\t\t// show an error notice and stop the request from being sent.\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage: __(\n\t\t\t\t\t'Error installing the fonts, could not be downloaded.'\n\t\t\t\t),\n\t\t\t} );\n\t\t\treturn;\n\t\t}\n\n\t\ttry {\n\t\t\tawait installFont( fontFamily );\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'success',\n\t\t\t\tmessage: __( 'Fonts were installed successfully.' ),\n\t\t\t} );\n\t\t} catch ( error ) {\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage: error.message,\n\t\t\t} );\n\t\t}\n\t\tresetFontsToInstall();\n\t};\n\n\tlet footerComponent = null;\n\tif ( selectedFont ) {\n\t\tfooterComponent = (\n\t\t\t<InstallFooter\n\t\t\t\thandleInstall={ handleInstall }\n\t\t\t\tisDisabled={ fontsToInstall.length === 0 }\n\t\t\t/>\n\t\t);\n\t} else if ( ! renderConfirmDialog && totalPages > 1 ) {\n\t\tfooterComponent = (\n\t\t\t<PaginationFooter\n\t\t\t\tpage={ page }\n\t\t\t\ttotalPages={ totalPages }\n\t\t\t\tsetPage={ setPage }\n\t\t\t/>\n\t\t);\n\t}\n\n\treturn (\n\t\t<TabPanelLayout\n\t\t\ttitle={\n\t\t\t\t! selectedFont ? selectedCollection.name : selectedFont.name\n\t\t\t}\n\t\t\tdescription={\n\t\t\t\t! selectedFont\n\t\t\t\t\t? selectedCollection.description\n\t\t\t\t\t: __( 'Select font variants to install.' )\n\t\t\t}\n\t\t\tnotice={ notice }\n\t\t\thandleBack={ !! selectedFont && handleUnselectFont }\n\t\t\tfooter={ footerComponent }\n\t\t>\n\t\t\t{ renderConfirmDialog && (\n\t\t\t\t<>\n\t\t\t\t\t<Spacer margin={ 8 } />\n\t\t\t\t\t<GoogleFontsConfirmDialog />\n\t\t\t\t</>\n\t\t\t) }\n\n\t\t\t{ ! renderConfirmDialog && ! selectedFont && (\n\t\t\t\t<Flex>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<InputControl\n\t\t\t\t\t\t\tvalue={ filters.search }\n\t\t\t\t\t\t\tplaceholder={ __( 'Font name…' ) }\n\t\t\t\t\t\t\tlabel={ __( 'Search' ) }\n\t\t\t\t\t\t\tonChange={ debouncedUpdateSearchInput }\n\t\t\t\t\t\t\tprefix={ <Icon icon={ search } /> }\n\t\t\t\t\t\t\tsuffix={\n\t\t\t\t\t\t\t\tfilters?.search ? (\n\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\ticon={ closeSmall }\n\t\t\t\t\t\t\t\t\t\tonClick={ resetSearch }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) : null\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\tlabel={ __( 'Category' ) }\n\t\t\t\t\t\t\tvalue={ filters.category }\n\t\t\t\t\t\t\tonChange={ handleCategoryFilter }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ categories &&\n\t\t\t\t\t\t\t\tcategories.map( ( category ) => (\n\t\t\t\t\t\t\t\t\t<option\n\t\t\t\t\t\t\t\t\t\tvalue={ category.slug }\n\t\t\t\t\t\t\t\t\t\tkey={ category.slug }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ category.name }\n\t\t\t\t\t\t\t\t\t</option>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</SelectControl>\n\t\t\t\t\t</FlexItem>\n\t\t\t\t</Flex>\n\t\t\t) }\n\n\t\t\t<Spacer margin={ 4 } />\n\t\t\t{ ! renderConfirmDialog &&\n\t\t\t\t! selectedCollection?.font_families &&\n\t\t\t\t! notice && <Spinner /> }\n\n\t\t\t{ ! renderConfirmDialog &&\n\t\t\t\t!! selectedCollection?.font_families?.length &&\n\t\t\t\t! fonts.length && (\n\t\t\t\t\t<Text>\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'No fonts found. Try with a different search term'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\n\t\t\t{ ! renderConfirmDialog && selectedFont && (\n\t\t\t\t<CollectionFontDetails\n\t\t\t\t\tfont={ selectedFont }\n\t\t\t\t\thandleToggleVariant={ handleToggleVariant }\n\t\t\t\t\tfontToInstallOutline={ fontToInstallOutline }\n\t\t\t\t/>\n\t\t\t) }\n\n\t\t\t{ ! renderConfirmDialog && ! selectedFont && (\n\t\t\t\t<div className=\"font-library-modal__fonts-grid__main\">\n\t\t\t\t\t{ items.map( ( font ) => (\n\t\t\t\t\t\t<FontCard\n\t\t\t\t\t\t\tkey={ font.font_family_settings.slug }\n\t\t\t\t\t\t\tfont={ font.font_family_settings }\n\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\tsetSelectedFont( font.font_family_settings );\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) ) }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</TabPanelLayout>\n\t);\n}\n\nfunction PaginationFooter( { page, totalPages, setPage } ) {\n\treturn (\n\t\t<Flex justify=\"center\">\n\t\t\t<Button\n\t\t\t\tlabel={ __( 'First page' ) }\n\t\t\t\tsize=\"compact\"\n\t\t\t\tonClick={ () => setPage( 1 ) }\n\t\t\t\tdisabled={ page === 1 }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t<span>«</span>\n\t\t\t</Button>\n\t\t\t<Button\n\t\t\t\tlabel={ __( 'Previous page' ) }\n\t\t\t\tsize=\"compact\"\n\t\t\t\tonClick={ () => setPage( page - 1 ) }\n\t\t\t\tdisabled={ page === 1 }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t<span>‹</span>\n\t\t\t</Button>\n\t\t\t<HStack justify=\"flex-start\" expanded={ false } spacing={ 2 }>\n\t\t\t\t{ createInterpolateElement(\n\t\t\t\t\tsprintf(\n\t\t\t\t\t\t// translators: %s: Total number of pages.\n\t\t\t\t\t\t_x( 'Page <CurrenPageControl /> of %s', 'paging' ),\n\t\t\t\t\t\ttotalPages\n\t\t\t\t\t),\n\t\t\t\t\t{\n\t\t\t\t\t\tCurrenPageControl: (\n\t\t\t\t\t\t\t<SelectControl\n\t\t\t\t\t\t\t\taria-label={ __( 'Current page' ) }\n\t\t\t\t\t\t\t\tvalue={ page }\n\t\t\t\t\t\t\t\toptions={ [ ...Array( totalPages ) ].map(\n\t\t\t\t\t\t\t\t\t( e, i ) => {\n\t\t\t\t\t\t\t\t\t\treturn {\n\t\t\t\t\t\t\t\t\t\t\tlabel: i + 1,\n\t\t\t\t\t\t\t\t\t\t\tvalue: i + 1,\n\t\t\t\t\t\t\t\t\t\t};\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\tonChange={ ( newPage ) =>\n\t\t\t\t\t\t\t\t\tsetPage( parseInt( newPage ) )\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tsize={ 'compact' }\n\t\t\t\t\t\t\t\t__nextHasNoMarginBottom\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t),\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t</HStack>\n\t\t\t<Button\n\t\t\t\tlabel={ __( 'Next page' ) }\n\t\t\t\tsize=\"compact\"\n\t\t\t\tonClick={ () => setPage( page + 1 ) }\n\t\t\t\tdisabled={ page === totalPages }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t<span>›</span>\n\t\t\t</Button>\n\t\t\t<Button\n\t\t\t\tlabel={ __( 'Last page' ) }\n\t\t\t\tsize=\"compact\"\n\t\t\t\tonClick={ () => setPage( totalPages ) }\n\t\t\t\tdisabled={ page === totalPages }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t<span>»</span>\n\t\t\t</Button>\n\t\t</Flex>\n\t);\n}\n\nfunction InstallFooter( { handleInstall, isDisabled } ) {\n\tconst { isInstalling } = useContext( FontLibraryContext );\n\n\treturn (\n\t\t<Flex justify=\"flex-end\">\n\t\t\t<Button\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tonClick={ handleInstall }\n\t\t\t\tisBusy={ isInstalling }\n\t\t\t\tdisabled={ isDisabled \|\| isInstalling }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t{ __( 'Install' ) }\n\t\t\t</Button>\n\t\t</Flex>\n\t);\n}\n\nexport default FontCollection;\n"],"mappings":"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"}

package/build-module/components/global-styles/font-library-modal/google-fonts-confirm-dialog.js CHANGED Viewed

@@ -14,7 +14,7 @@ function GoogleFontsConfirmDialog() {
     className: "font-library__google-fonts-confirm"
   }, createElement(Card, null, createElement(CardBody, null, createElement(Text, {
     as: "h3"
-  }, "Connect to Google Fonts"), createElement(Spacer, {
+  }, __('Connect to Google Fonts')), createElement(Spacer, {
     margin: 6
   }), createElement(Text, {
     as: "p"

package/build-module/components/global-styles/font-library-modal/google-fonts-confirm-dialog.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__","Button","Card","CardBody","__experimentalText","Text","__experimentalSpacer","Spacer","GoogleFontsConfirmDialog","handleConfirm","window","localStorage","setItem","dispatchEvent","Event","createElement","className","as","margin","variant","onClick"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/google-fonts-confirm-dialog.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tButton,\n\tCard,\n\tCardBody,\n\t__experimentalText as Text,\n\t__experimentalSpacer as Spacer,\n} from '@wordpress/components';\n\nfunction GoogleFontsConfirmDialog() {\n\tconst handleConfirm = () => {\n\t\t// eslint-disable-next-line no-undef\n\t\twindow.localStorage.setItem(\n\t\t\t'wp-font-library-google-fonts-permission',\n\t\t\t'true'\n\t\t);\n\t\twindow.dispatchEvent( new Event( 'storage' ) );\n\t};\n\n\treturn (\n\t\t<div className=\"font-library__google-fonts-confirm\">\n\t\t\t<Card>\n\t\t\t\t<CardBody>\n\t\t\t\t\t<Text as=\"h3\">Connect to Google Fonts</Text>\n\t\t\t\t\t<Spacer margin={ 6 } />\n\t\t\t\t\t<Text as=\"p\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'To install fonts from Google you must give permission to connect directly to Google servers. The fonts you install will be downloaded from Google and stored on your site. Your site will then use these locally-hosted fonts.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Text>\n\t\t\t\t\t<Spacer margin={ 3 } />\n\t\t\t\t\t<Text as=\"p\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'You can alternatively upload files directly on the Upload tab.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Text>\n\t\t\t\t\t<Spacer margin={ 6 } />\n\t\t\t\t\t<Button variant=\"primary\" onClick={ handleConfirm }>\n\t\t\t\t\t\t{ __( 'Allow access to Google Fonts' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</CardBody>\n\t\t\t</Card>\n\t\t</div>\n\t);\n}\n\nexport default GoogleFontsConfirmDialog;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SACCC,MAAM,EACNC,IAAI,EACJC,QAAQ,EACRC,kBAAkB,IAAIC,IAAI,EAC1BC,oBAAoB,IAAIC,MAAM,QACxB,uBAAuB;AAE9B,SAASC,wBAAwBA,CAAA,EAAG;EACnC,MAAMC,aAAa,GAAGA,CAAA,KAAM;IAC3B;IACAC,MAAM,CAACC,YAAY,CAACC,OAAO,CAC1B,yCAAyC,EACzC,MACD,CAAC;IACDF,MAAM,CAACG,aAAa,CAAE,IAAIC,KAAK,CAAE,SAAU,CAAE,CAAC;EAC/C,CAAC;EAED,OACCC,aAAA;IAAKC,SAAS,EAAC;EAAoC,GAClDD,aAAA,CAACb,IAAI,QACJa,aAAA,CAACZ,QAAQ,QACRY,aAAA,CAACV,IAAI;IAACY,EAAE,EAAC;EAAI,~~GAAC~~,~~yBAA6B~~,CAAC,~~EAC5CF~~,aAAA,CAACR,MAAM;IAACW,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBH,aAAA,CAACV,IAAI;IAACY,EAAE,EAAC;EAAG,GACTjB,EAAE,CACH,gOACD,CACK,CAAC,EACPe,aAAA,CAACR,MAAM;IAACW,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBH,aAAA,CAACV,IAAI;IAACY,EAAE,EAAC;EAAG,GACTjB,EAAE,CACH,gEACD,CACK,CAAC,EACPe,aAAA,CAACR,MAAM;IAACW,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBH,aAAA,CAACd,MAAM;IAACkB,OAAO,EAAC,SAAS;IAACC,OAAO,EAAGX;EAAe,GAChDT,EAAE,CAAE,8BAA+B,CAC9B,CACC,CACL,CACF,CAAC;AAER;AAEA,eAAeQ,wBAAwB"}
1	+ {"version":3,"names":["__","Button","Card","CardBody","__experimentalText","Text","__experimentalSpacer","Spacer","GoogleFontsConfirmDialog","handleConfirm","window","localStorage","setItem","dispatchEvent","Event","createElement","className","as","margin","variant","onClick"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/google-fonts-confirm-dialog.js"],"sourcesContent":["/*\n WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport {\n\tButton,\n\tCard,\n\tCardBody,\n\t__experimentalText as Text,\n\t__experimentalSpacer as Spacer,\n} from '@wordpress/components';\n\nfunction GoogleFontsConfirmDialog() {\n\tconst handleConfirm = () => {\n\t\t// eslint-disable-next-line no-undef\n\t\twindow.localStorage.setItem(\n\t\t\t'wp-font-library-google-fonts-permission',\n\t\t\t'true'\n\t\t);\n\t\twindow.dispatchEvent( new Event( 'storage' ) );\n\t};\n\n\treturn (\n\t\t<div className=\"font-library__google-fonts-confirm\">\n\t\t\t<Card>\n\t\t\t\t<CardBody>\n\t\t\t\t\t<Text as=\"h3\">{ __( 'Connect to Google Fonts' ) }</Text>\n\t\t\t\t\t<Spacer margin={ 6 } />\n\t\t\t\t\t<Text as=\"p\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'To install fonts from Google you must give permission to connect directly to Google servers. The fonts you install will be downloaded from Google and stored on your site. Your site will then use these locally-hosted fonts.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Text>\n\t\t\t\t\t<Spacer margin={ 3 } />\n\t\t\t\t\t<Text as=\"p\">\n\t\t\t\t\t\t{ __(\n\t\t\t\t\t\t\t'You can alternatively upload files directly on the Upload tab.'\n\t\t\t\t\t\t) }\n\t\t\t\t\t</Text>\n\t\t\t\t\t<Spacer margin={ 6 } />\n\t\t\t\t\t<Button variant=\"primary\" onClick={ handleConfirm }>\n\t\t\t\t\t\t{ __( 'Allow access to Google Fonts' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</CardBody>\n\t\t\t</Card>\n\t\t</div>\n\t);\n}\n\nexport default GoogleFontsConfirmDialog;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,QAAQ,iBAAiB;AACpC,SACCC,MAAM,EACNC,IAAI,EACJC,QAAQ,EACRC,kBAAkB,IAAIC,IAAI,EAC1BC,oBAAoB,IAAIC,MAAM,QACxB,uBAAuB;AAE9B,SAASC,wBAAwBA,CAAA,EAAG;EACnC,MAAMC,aAAa,GAAGA,CAAA,KAAM;IAC3B;IACAC,MAAM,CAACC,YAAY,CAACC,OAAO,CAC1B,yCAAyC,EACzC,MACD,CAAC;IACDF,MAAM,CAACG,aAAa,CAAE,IAAIC,KAAK,CAAE,SAAU,CAAE,CAAC;EAC/C,CAAC;EAED,OACCC,aAAA;IAAKC,SAAS,EAAC;EAAoC,GAClDD,aAAA,CAACb,IAAI,QACJa,aAAA,CAACZ,QAAQ,QACRY,aAAA,CAACV,IAAI;IAACY,EAAE,EAAC;EAAI,GAAGjB,EAAE,CAAE,yBAA0B,CAAS,CAAC,EACxDe,aAAA,CAACR,MAAM;IAACW,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBH,aAAA,CAACV,IAAI;IAACY,EAAE,EAAC;EAAG,GACTjB,EAAE,CACH,gOACD,CACK,CAAC,EACPe,aAAA,CAACR,MAAM;IAACW,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBH,aAAA,CAACV,IAAI;IAACY,EAAE,EAAC;EAAG,GACTjB,EAAE,CACH,gEACD,CACK,CAAC,EACPe,aAAA,CAACR,MAAM;IAACW,MAAM,EAAG;EAAG,CAAE,CAAC,EACvBH,aAAA,CAACd,MAAM;IAACkB,OAAO,EAAC,SAAS;IAACC,OAAO,EAAGX;EAAe,GAChDT,EAAE,CAAE,8BAA+B,CAC9B,CACC,CACL,CACF,CAAC;AAER;AAEA,eAAeQ,wBAAwB"}

package/build-module/components/global-styles/font-library-modal/installed-fonts.js CHANGED Viewed

@@ -4,14 +4,13 @@ import { createElement, Fragment } from "react";
  */
 import { __ } from '@wordpress/i18n';
 import { useContext, useEffect, useState } from '@wordpress/element';
-import { privateApis as componentsPrivateApis, __experimentalHStack as HStack, __experimentalSpacer as Spacer, Button, Spinner, FlexItem } from '@wordpress/components';
+import { privateApis as componentsPrivateApis, __experimentalHStack as HStack, __experimentalSpacer as Spacer, __experimentalText as Text, Button, Spinner, FlexItem } from '@wordpress/components';
 /**
  * Internal dependencies
  */
 import TabPanelLayout from './tab-panel-layout';
 import { FontLibraryContext } from './context';
-import FontsGrid from './fonts-grid';
 import LibraryFontDetails from './library-font-details';
 import LibraryFontCard from './library-font-card';
 import ConfirmDeleteDialog from './confirm-delete-dialog';
@@ -88,23 +87,27 @@ function InstalledFonts() {
     margin: 2
   }), createElement(Spinner, null), createElement(Spacer, {
     margin: 2
-  })), baseCustomFonts.length > 0 && createElement(Fragment, null, createElement(FontsGrid, null, baseCustomFonts.map(font => createElement(LibraryFontCard, {
+  })), baseCustomFonts.length > 0 && createElement(Fragment, null, baseCustomFonts.map(font => createElement(LibraryFontCard, {
     font: font,
     key: font.slug,
     onClick: () => {
       handleSelectFont(font);
     }
-  }))), createElement(Spacer, {
+  })), createElement(Spacer, {
     margin: 8
-  })), baseThemeFonts.length > 0 && createElement(Fragment, null, createElement(FontsGrid, {
-    title: __('Theme Fonts')
-  }, baseThemeFonts.map(font => createElement(LibraryFontCard, {
+  })), baseThemeFonts.length > 0 && createElement(Fragment, null, createElement(Text, {
+    className: "font-library-modal__subtitle"
+  }, __('Theme Fonts')), createElement(Spacer, {
+    margin: 2
+  }), baseThemeFonts.map(font => createElement(LibraryFontCard, {
     font: font,
     key: font.slug,
     onClick: () => {
       handleSelectFont(font);
     }
-  }))))), libraryFontSelected && createElement(LibraryFontDetails, {
+  }))), createElement(Spacer, {
+    margin: 16
+  })), libraryFontSelected && createElement(LibraryFontDetails, {
     font: libraryFontSelected,
     isConfirmDeleteOpen: isConfirmDeleteOpen,
     handleConfirmUninstall: handleConfirmUninstall,

package/build-module/components/global-styles/font-library-modal/installed-fonts.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["__","useContext","useEffect","useState","privateApis","componentsPrivateApis","__experimentalHStack","HStack","__experimentalSpacer","Spacer","Button","Spinner","FlexItem","TabPanelLayout","FontLibraryContext","FontsGrid","LibraryFontDetails","LibraryFontCard","ConfirmDeleteDialog","unlock","ProgressBar","InstalledFonts","baseCustomFonts","libraryFontSelected","baseThemeFonts","handleSetLibraryFontSelected","refreshLibrary","uninstallFontFamily","isResolvingLibrary","notice","setNotice","isConfirmDeleteOpen","setIsConfirmDeleteOpen","handleUnselectFont","handleSelectFont","font","handleConfirmUninstall","type","message","error","handleUninstallClick","handleCancelUninstall","tabDescription","shouldDisplayDeleteButton","source","createElement","title","name","description","handleBack","footer","Footer","Fragment","margin","length","map","key","slug","onClick","saveFontFamilies","fontFamiliesHasChanges","isInstalling","justify","isDestructive","variant","disabled","__experimentalIsFocusable"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/installed-fonts.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useContext, useEffect, useState } from '@wordpress/element';\nimport {\n\tprivateApis as componentsPrivateApis,\n\t__experimentalHStack as HStack,\n\t__experimentalSpacer as Spacer,\n\tButton,\n\tSpinner,\n\tFlexItem,\n} from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport TabPanelLayout from './tab-panel-layout';\nimport { FontLibraryContext } from './context';\nimport FontsGrid from './fonts-grid';\nimport LibraryFontDetails from './library-font-details';\nimport LibraryFontCard from './library-font-card';\nimport ConfirmDeleteDialog from './confirm-delete-dialog';\nimport { unlock } from '../../../lock-unlock';\nconst { ProgressBar } = unlock( componentsPrivateApis );\n\nfunction InstalledFonts() {\n\tconst {\n\t\tbaseCustomFonts,\n\t\tlibraryFontSelected,\n\t\tbaseThemeFonts,\n\t\thandleSetLibraryFontSelected,\n\t\trefreshLibrary,\n\t\tuninstallFontFamily,\n\t\tisResolvingLibrary,\n\t\tnotice,\n\t\tsetNotice,\n\t} = useContext( FontLibraryContext );\n\tconst [ isConfirmDeleteOpen, setIsConfirmDeleteOpen ] = useState( false );\n\n\tconst handleUnselectFont = () => {\n\t\thandleSetLibraryFontSelected( null );\n\t};\n\n\tconst handleSelectFont = ( font ) => {\n\t\thandleSetLibraryFontSelected( font );\n\t};\n\n\tconst handleConfirmUninstall = async () => {\n\t\tsetNotice( null );\n\n\t\ttry {\n\t\t\tawait uninstallFontFamily( libraryFontSelected );\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'success',\n\t\t\t\tmessage: __( 'Font family uninstalled successfully.' ),\n\t\t\t} );\n\n\t\t\t// If the font was succesfully uninstalled it is unselected.\n\t\t\thandleUnselectFont();\n\t\t\tsetIsConfirmDeleteOpen( false );\n\t\t} catch ( error ) {\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage:\n\t\t\t\t\t__( 'There was an error uninstalling the font family. ' ) +\n\t\t\t\t\terror.message,\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst handleUninstallClick = async () => {\n\t\tsetIsConfirmDeleteOpen( true );\n\t};\n\n\tconst handleCancelUninstall = () => {\n\t\tsetIsConfirmDeleteOpen( false );\n\t};\n\n\tconst tabDescription = !! libraryFontSelected\n\t\t? __(\n\t\t\t\t'Choose font variants. Keep in mind that too many variants could make your site slower.'\n\t\t )\n\t\t: null;\n\n\tconst shouldDisplayDeleteButton =\n\t\t!! libraryFontSelected && libraryFontSelected?.source !== 'theme';\n\n\tuseEffect( () => {\n\t\thandleSelectFont( libraryFontSelected );\n\t\trefreshLibrary();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\treturn (\n\t\t<TabPanelLayout\n\t\t\ttitle={ libraryFontSelected?.name \|\| '' }\n\t\t\tdescription={ tabDescription }\n\t\t\tnotice={ notice }\n\t\t\thandleBack={ !! libraryFontSelected && handleUnselectFont }\n\t\t\tfooter={\n\t\t\t\t<Footer\n\t\t\t\t\tshouldDisplayDeleteButton={ shouldDisplayDeleteButton }\n\t\t\t\t\thandleUninstallClick={ handleUninstallClick }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<ConfirmDeleteDialog\n\t\t\t\tfont={ libraryFontSelected }\n\t\t\t\tisConfirmDeleteOpen={ isConfirmDeleteOpen }\n\t\t\t\thandleConfirmUninstall={ handleConfirmUninstall }\n\t\t\t\thandleCancelUninstall={ handleCancelUninstall }\n\t\t\t/>\n\n\t\t\t{ ! libraryFontSelected && (\n\t\t\t\t<>\n\t\t\t\t\t{ isResolvingLibrary && (\n\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t<Spacer margin={ 2 } />\n\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t<Spacer margin={ 2 } />\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t) }\n\t\t\t\t\t{ baseCustomFonts.length > 0 && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<FontsGrid>\n\t\t\t\t\t\t\t\t{ baseCustomFonts.map( ( font ) => (\n\t\t\t\t\t\t\t\t\t<LibraryFontCard\n\t\t\t\t\t\t\t\t\t\tfont={ font }\n\t\t\t\t\t\t\t\t\t\tkey={ font.slug }\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\thandleSelectFont( font );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</FontsGrid>\n\t\t\t\t\t\t\t<Spacer margin={ 8 } />\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ baseThemeFonts.length > 0 && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<FontsGrid title={ __( 'Theme Fonts' ) }>\n\t\t\t\t\t\t\t\t{ baseThemeFonts.map( ( font ) => (\n\t\t\t\t\t\t\t\t\t<LibraryFontCard\n\t\t\t\t\t\t\t\t\t\tfont={ font }\n\t\t\t\t\t\t\t\t\t\tkey={ font.slug }\n\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\thandleSelectFont( font );\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t</FontsGrid>\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t</>\n\t\t\t) }\n\n\t\t\t{ libraryFontSelected && (\n\t\t\t\t<LibraryFontDetails\n\t\t\t\t\tfont={ libraryFontSelected }\n\t\t\t\t\tisConfirmDeleteOpen={ isConfirmDeleteOpen }\n\t\t\t\t\thandleConfirmUninstall={ handleConfirmUninstall }\n\t\t\t\t\thandleCancelUninstall={ handleCancelUninstall }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</TabPanelLayout>\n\t);\n}\n\nfunction Footer( { shouldDisplayDeleteButton, handleUninstallClick } ) {\n\tconst { saveFontFamilies, fontFamiliesHasChanges, isInstalling } =\n\t\tuseContext( FontLibraryContext );\n\treturn (\n\t\t<HStack justify=\"flex-end\">\n\t\t\t{ isInstalling && <ProgressBar /> }\n\t\t\t<div>\n\t\t\t\t{ shouldDisplayDeleteButton && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tisDestructive\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ handleUninstallClick }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Delete' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t<Button\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tonClick={ saveFontFamilies }\n\t\t\t\tdisabled={ ! fontFamiliesHasChanges }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t{ __( 'Update' ) }\n\t\t\t</Button>\n\t\t</HStack>\n\t);\n}\n\nexport default InstalledFonts;\n"],"mappings":"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"}
1	+ {"version":3,"names":["__","useContext","useEffect","useState","privateApis","componentsPrivateApis","__experimentalHStack","HStack","__experimentalSpacer","Spacer","__experimentalText","Text","Button","Spinner","FlexItem","TabPanelLayout","FontLibraryContext","LibraryFontDetails","LibraryFontCard","ConfirmDeleteDialog","unlock","ProgressBar","InstalledFonts","baseCustomFonts","libraryFontSelected","baseThemeFonts","handleSetLibraryFontSelected","refreshLibrary","uninstallFontFamily","isResolvingLibrary","notice","setNotice","isConfirmDeleteOpen","setIsConfirmDeleteOpen","handleUnselectFont","handleSelectFont","font","handleConfirmUninstall","type","message","error","handleUninstallClick","handleCancelUninstall","tabDescription","shouldDisplayDeleteButton","source","createElement","title","name","description","handleBack","footer","Footer","Fragment","margin","length","map","key","slug","onClick","className","saveFontFamilies","fontFamiliesHasChanges","isInstalling","justify","isDestructive","variant","disabled","__experimentalIsFocusable"],"sources":["@wordpress/edit-site/src/components/global-styles/font-library-modal/installed-fonts.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { __ } from '@wordpress/i18n';\nimport { useContext, useEffect, useState } from '@wordpress/element';\nimport {\n\tprivateApis as componentsPrivateApis,\n\t__experimentalHStack as HStack,\n\t__experimentalSpacer as Spacer,\n\t__experimentalText as Text,\n\tButton,\n\tSpinner,\n\tFlexItem,\n} from '@wordpress/components';\n\n/\n Internal dependencies\n */\nimport TabPanelLayout from './tab-panel-layout';\nimport { FontLibraryContext } from './context';\nimport LibraryFontDetails from './library-font-details';\nimport LibraryFontCard from './library-font-card';\nimport ConfirmDeleteDialog from './confirm-delete-dialog';\nimport { unlock } from '../../../lock-unlock';\nconst { ProgressBar } = unlock( componentsPrivateApis );\n\nfunction InstalledFonts() {\n\tconst {\n\t\tbaseCustomFonts,\n\t\tlibraryFontSelected,\n\t\tbaseThemeFonts,\n\t\thandleSetLibraryFontSelected,\n\t\trefreshLibrary,\n\t\tuninstallFontFamily,\n\t\tisResolvingLibrary,\n\t\tnotice,\n\t\tsetNotice,\n\t} = useContext( FontLibraryContext );\n\tconst [ isConfirmDeleteOpen, setIsConfirmDeleteOpen ] = useState( false );\n\n\tconst handleUnselectFont = () => {\n\t\thandleSetLibraryFontSelected( null );\n\t};\n\n\tconst handleSelectFont = ( font ) => {\n\t\thandleSetLibraryFontSelected( font );\n\t};\n\n\tconst handleConfirmUninstall = async () => {\n\t\tsetNotice( null );\n\n\t\ttry {\n\t\t\tawait uninstallFontFamily( libraryFontSelected );\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'success',\n\t\t\t\tmessage: __( 'Font family uninstalled successfully.' ),\n\t\t\t} );\n\n\t\t\t// If the font was succesfully uninstalled it is unselected.\n\t\t\thandleUnselectFont();\n\t\t\tsetIsConfirmDeleteOpen( false );\n\t\t} catch ( error ) {\n\t\t\tsetNotice( {\n\t\t\t\ttype: 'error',\n\t\t\t\tmessage:\n\t\t\t\t\t__( 'There was an error uninstalling the font family. ' ) +\n\t\t\t\t\terror.message,\n\t\t\t} );\n\t\t}\n\t};\n\n\tconst handleUninstallClick = async () => {\n\t\tsetIsConfirmDeleteOpen( true );\n\t};\n\n\tconst handleCancelUninstall = () => {\n\t\tsetIsConfirmDeleteOpen( false );\n\t};\n\n\tconst tabDescription = !! libraryFontSelected\n\t\t? __(\n\t\t\t\t'Choose font variants. Keep in mind that too many variants could make your site slower.'\n\t\t )\n\t\t: null;\n\n\tconst shouldDisplayDeleteButton =\n\t\t!! libraryFontSelected && libraryFontSelected?.source !== 'theme';\n\n\tuseEffect( () => {\n\t\thandleSelectFont( libraryFontSelected );\n\t\trefreshLibrary();\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t}, [] );\n\n\treturn (\n\t\t<TabPanelLayout\n\t\t\ttitle={ libraryFontSelected?.name \|\| '' }\n\t\t\tdescription={ tabDescription }\n\t\t\tnotice={ notice }\n\t\t\thandleBack={ !! libraryFontSelected && handleUnselectFont }\n\t\t\tfooter={\n\t\t\t\t<Footer\n\t\t\t\t\tshouldDisplayDeleteButton={ shouldDisplayDeleteButton }\n\t\t\t\t\thandleUninstallClick={ handleUninstallClick }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t<ConfirmDeleteDialog\n\t\t\t\tfont={ libraryFontSelected }\n\t\t\t\tisConfirmDeleteOpen={ isConfirmDeleteOpen }\n\t\t\t\thandleConfirmUninstall={ handleConfirmUninstall }\n\t\t\t\thandleCancelUninstall={ handleCancelUninstall }\n\t\t\t/>\n\n\t\t\t{ ! libraryFontSelected && (\n\t\t\t\t<>\n\t\t\t\t\t{ isResolvingLibrary && (\n\t\t\t\t\t\t<FlexItem>\n\t\t\t\t\t\t\t<Spacer margin={ 2 } />\n\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t<Spacer margin={ 2 } />\n\t\t\t\t\t\t</FlexItem>\n\t\t\t\t\t) }\n\t\t\t\t\t{ baseCustomFonts.length > 0 && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t{ baseCustomFonts.map( ( font ) => (\n\t\t\t\t\t\t\t\t<LibraryFontCard\n\t\t\t\t\t\t\t\t\tfont={ font }\n\t\t\t\t\t\t\t\t\tkey={ font.slug }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\thandleSelectFont( font );\n\t\t\t\t\t\t\t\t\t} }\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<Spacer margin={ 8 } />\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ baseThemeFonts.length > 0 && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<Text className=\"font-library-modal__subtitle\">\n\t\t\t\t\t\t\t\t{ __( 'Theme Fonts' ) }\n\t\t\t\t\t\t\t</Text>\n\n\t\t\t\t\t\t\t<Spacer margin={ 2 } />\n\t\t\t\t\t\t\t{ baseThemeFonts.map( ( font ) => (\n\t\t\t\t\t\t\t\t<LibraryFontCard\n\t\t\t\t\t\t\t\t\tfont={ font }\n\t\t\t\t\t\t\t\t\tkey={ font.slug }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\thandleSelectFont( font );\n\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t</>\n\t\t\t\t\t) }\n\t\t\t\t\t<Spacer margin={ 16 } />\n\t\t\t\t</>\n\t\t\t) }\n\n\t\t\t{ libraryFontSelected && (\n\t\t\t\t<LibraryFontDetails\n\t\t\t\t\tfont={ libraryFontSelected }\n\t\t\t\t\tisConfirmDeleteOpen={ isConfirmDeleteOpen }\n\t\t\t\t\thandleConfirmUninstall={ handleConfirmUninstall }\n\t\t\t\t\thandleCancelUninstall={ handleCancelUninstall }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</TabPanelLayout>\n\t);\n}\n\nfunction Footer( { shouldDisplayDeleteButton, handleUninstallClick } ) {\n\tconst { saveFontFamilies, fontFamiliesHasChanges, isInstalling } =\n\t\tuseContext( FontLibraryContext );\n\treturn (\n\t\t<HStack justify=\"flex-end\">\n\t\t\t{ isInstalling && <ProgressBar /> }\n\t\t\t<div>\n\t\t\t\t{ shouldDisplayDeleteButton && (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tisDestructive\n\t\t\t\t\t\tvariant=\"tertiary\"\n\t\t\t\t\t\tonClick={ handleUninstallClick }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Delete' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t<Button\n\t\t\t\tvariant=\"primary\"\n\t\t\t\tonClick={ saveFontFamilies }\n\t\t\t\tdisabled={ ! fontFamiliesHasChanges }\n\t\t\t\t__experimentalIsFocusable\n\t\t\t>\n\t\t\t\t{ __( 'Update' ) }\n\t\t\t</Button>\n\t\t</HStack>\n\t);\n}\n\nexport default InstalledFonts;\n"],"mappings":"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"}

package/build-module/components/layout/index.js CHANGED Viewed

@@ -211,7 +211,7 @@ export default function Layout() {
     }
   }, createElement(Header, null)))), createElement("div", {
     className: "edit-site-layout__content"
-  }, createElement(NavigableRegion, {
+  }, (!isMobileViewport || isMobileViewport && !areas.mobile) && createElement(NavigableRegion, {
     ariaLabel: __('Navigation'),
     className: "edit-site-layout__sidebar-region"
   }, createElement(AnimatePresence, null, canvasMode === 'view' && createElement(motion.div, {
@@ -232,12 +232,17 @@ export default function Layout() {
       ease: 'easeOut'
     },
     className: "edit-site-layout__sidebar"
-  }, createElement(Sidebar, null)))), createElement(SavePanel, null), areas.content && canvasMode !== 'edit' && createElement("div", {
+  }, createElement(Sidebar, null)))), createElement(SavePanel, null), isMobileViewport && areas.mobile && createElement("div", {
+    className: "edit-site-layout__mobile",
+    style: {
+      maxWidth: widths?.content
+    }
+  }, areas.mobile), !isMobileViewport && areas.content && canvasMode !== 'edit' && createElement("div", {
     className: "edit-site-layout__area",
     style: {
       maxWidth: widths?.content
     }
-  }, areas.content), areas.preview && createElement("div", {
+  }, areas.content), !isMobileViewport && areas.preview && createElement("div", {
     className: "edit-site-layout__canvas-container"
   }, canvasResizer, !!canvasSize.width && createElement(motion.div, {
     whileHover: canvasMode === 'view' ? {