@wordpress/edit-site 5.22.0 → 5.23.0

package/build-module/components/header-edit-mode/document-tools/index.js

@@ -0,0 +1,152 @@
+import { createElement, Fragment } from "react";
+/**
+ * WordPress dependencies
+ */
+import { useCallback, useRef } from '@wordpress/element';
+import { useViewportMatch } from '@wordpress/compose';
+import { ToolSelector, NavigableToolbar, store as blockEditorStore, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
+import { useSelect, useDispatch } from '@wordpress/data';
+import { _x, __ } from '@wordpress/i18n';
+import { listView, plus, chevronUpDown } from '@wordpress/icons';
+import { Button, ToolbarItem } from '@wordpress/components';
+import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
+
+/**
+ * Internal dependencies
+ */
+import UndoButton from '../undo-redo/undo';
+import RedoButton from '../undo-redo/redo';
+import { store as editSiteStore } from '../../../store';
+import { unlock } from '../../../lock-unlock';
+const {
+  useShouldContextualToolbarShow
+} = unlock(blockEditorPrivateApis);
+const preventDefault = event => {
+  event.preventDefault();
+};
+export default function DocumentTools({
+  blockEditorMode,
+  hasFixedToolbar,
+  isDistractionFree,
+  showIconLabels,
+  setListViewToggleElement
+}) {
+  const inserterButton = useRef();
+  const {
+    isInserterOpen,
+    isListViewOpen,
+    listViewShortcut,
+    isVisualMode
+  } = useSelect(select => {
+    const {
+      __experimentalGetPreviewDeviceType,
+      isInserterOpened,
+      isListViewOpened,
+      getEditorMode
+    } = select(editSiteStore);
+    const {
+      getShortcutRepresentation
+    } = select(keyboardShortcutsStore);
+    return {
+      deviceType: __experimentalGetPreviewDeviceType(),
+      isInserterOpen: isInserterOpened(),
+      isListViewOpen: isListViewOpened(),
+      listViewShortcut: getShortcutRepresentation('core/edit-site/toggle-list-view'),
+      isVisualMode: getEditorMode() === 'visual'
+    };
+  }, []);
+  const {
+    __experimentalSetPreviewDeviceType: setPreviewDeviceType,
+    setIsInserterOpened,
+    setIsListViewOpened
+  } = useDispatch(editSiteStore);
+  const {
+    __unstableSetEditorMode
+  } = useDispatch(blockEditorStore);
+  const isLargeViewport = useViewportMatch('medium');
+  const toggleInserter = useCallback(() => {
+    if (isInserterOpen) {
+      // Focusing the inserter button should close the inserter popover.
+      // However, there are some cases it won't close when the focus is lost.
+      // See https://github.com/WordPress/gutenberg/issues/43090 for more details.
+      inserterButton.current.focus();
+      setIsInserterOpened(false);
+    } else {
+      setIsInserterOpened(true);
+    }
+  }, [isInserterOpen, setIsInserterOpened]);
+  const toggleListView = useCallback(() => setIsListViewOpened(!isListViewOpen), [setIsListViewOpened, isListViewOpen]);
+  const {
+    shouldShowContextualToolbar,
+    canFocusHiddenToolbar,
+    fixedToolbarCanBeFocused
+  } = useShouldContextualToolbarShow();
+  // If there's a block toolbar to be focused, disable the focus shortcut for the document toolbar.
+  // There's a fixed block toolbar when the fixed toolbar option is enabled or when the browser width is less than the large viewport.
+  const blockToolbarCanBeFocused = shouldShowContextualToolbar || canFocusHiddenToolbar || fixedToolbarCanBeFocused;
+
+  /* translators: button label text should, if possible, be under 16 characters. */
+  const longLabel = _x('Toggle block inserter', 'Generic label for block inserter button');
+  const shortLabel = !isInserterOpen ? __('Add') : __('Close');
+  const isZoomedOutViewExperimentEnabled = window?.__experimentalEnableZoomedOutView && isVisualMode;
+  const isZoomedOutView = blockEditorMode === 'zoom-out';
+  return createElement(NavigableToolbar, {
+    className: "edit-site-header-edit-mode__document-tools",
+    "aria-label": __('Document tools'),
+    shouldUseKeyboardFocusShortcut: !blockToolbarCanBeFocused
+  }, createElement("div", {
+    className: "edit-site-header-edit-mode__toolbar"
+  }, !isDistractionFree && createElement(ToolbarItem, {
+    ref: inserterButton,
+    as: Button,
+    className: "edit-site-header-edit-mode__inserter-toggle",
+    variant: "primary",
+    isPressed: isInserterOpen,
+    onMouseDown: preventDefault,
+    onClick: toggleInserter,
+    disabled: !isVisualMode,
+    icon: plus,
+    label: showIconLabels ? shortLabel : longLabel,
+    showTooltip: !showIconLabels,
+    "aria-expanded": isInserterOpen
+  }), isLargeViewport && createElement(Fragment, null, !hasFixedToolbar && createElement(ToolbarItem, {
+    as: ToolSelector,
+    showTooltip: !showIconLabels,
+    variant: showIconLabels ? 'tertiary' : undefined,
+    disabled: !isVisualMode
+  }), createElement(ToolbarItem, {
+    as: UndoButton,
+    showTooltip: !showIconLabels,
+    variant: showIconLabels ? 'tertiary' : undefined
+  }), createElement(ToolbarItem, {
+    as: RedoButton,
+    showTooltip: !showIconLabels,
+    variant: showIconLabels ? 'tertiary' : undefined
+  }), !isDistractionFree && createElement(ToolbarItem, {
+    as: Button,
+    className: "edit-site-header-edit-mode__list-view-toggle",
+    disabled: !isVisualMode || isZoomedOutView,
+    icon: listView,
+    isPressed: isListViewOpen
+    /* translators: button label text should, if possible, be under 16 characters. */,
+    label: __('List View'),
+    onClick: toggleListView,
+    ref: setListViewToggleElement,
+    shortcut: listViewShortcut,
+    showTooltip: !showIconLabels,
+    variant: showIconLabels ? 'tertiary' : undefined,
+    "aria-expanded": isListViewOpen
+  }), isZoomedOutViewExperimentEnabled && !isDistractionFree && !hasFixedToolbar && createElement(ToolbarItem, {
+    as: Button,
+    className: "edit-site-header-edit-mode__zoom-out-view-toggle",
+    icon: chevronUpDown,
+    isPressed: isZoomedOutView
+    /* translators: button label text should, if possible, be under 16 characters. */,
+    label: __('Zoom-out View'),
+    onClick: () => {
+      setPreviewDeviceType('Desktop');
+      __unstableSetEditorMode(isZoomedOutView ? 'edit' : 'zoom-out');
+    }
+  }))));
+}
+//# sourceMappingURL=index.js.map

package/build-module/components/header-edit-mode/document-tools/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useRef","useViewportMatch","ToolSelector","NavigableToolbar","store","blockEditorStore","privateApis","blockEditorPrivateApis","useSelect","useDispatch","_x","__","listView","plus","chevronUpDown","Button","ToolbarItem","keyboardShortcutsStore","UndoButton","RedoButton","editSiteStore","unlock","useShouldContextualToolbarShow","preventDefault","event","DocumentTools","blockEditorMode","hasFixedToolbar","isDistractionFree","showIconLabels","setListViewToggleElement","inserterButton","isInserterOpen","isListViewOpen","listViewShortcut","isVisualMode","select","__experimentalGetPreviewDeviceType","isInserterOpened","isListViewOpened","getEditorMode","getShortcutRepresentation","deviceType","__experimentalSetPreviewDeviceType","setPreviewDeviceType","setIsInserterOpened","setIsListViewOpened","__unstableSetEditorMode","isLargeViewport","toggleInserter","current","focus","toggleListView","shouldShowContextualToolbar","canFocusHiddenToolbar","fixedToolbarCanBeFocused","blockToolbarCanBeFocused","longLabel","shortLabel","isZoomedOutViewExperimentEnabled","window","__experimentalEnableZoomedOutView","isZoomedOutView","createElement","className","shouldUseKeyboardFocusShortcut","ref","as","variant","isPressed","onMouseDown","onClick","disabled","icon","label","showTooltip","Fragment","undefined","shortcut"],"sources":["@wordpress/edit-site/src/components/header-edit-mode/document-tools/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useCallback, useRef } from '@wordpress/element';\nimport { useViewportMatch } from '@wordpress/compose';\nimport {\n\tToolSelector,\n\tNavigableToolbar,\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { _x, __ } from '@wordpress/i18n';\nimport { listView, plus, chevronUpDown } from '@wordpress/icons';\nimport { Button, ToolbarItem } from '@wordpress/components';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\n\n/**\n * Internal dependencies\n */\nimport UndoButton from '../undo-redo/undo';\nimport RedoButton from '../undo-redo/redo';\nimport { store as editSiteStore } from '../../../store';\nimport { unlock } from '../../../lock-unlock';\n\nconst { useShouldContextualToolbarShow } = unlock( blockEditorPrivateApis );\n\nconst preventDefault = ( event ) => {\n\tevent.preventDefault();\n};\n\nexport default function DocumentTools( {\n\tblockEditorMode,\n\thasFixedToolbar,\n\tisDistractionFree,\n\tshowIconLabels,\n\tsetListViewToggleElement,\n} ) {\n\tconst inserterButton = useRef();\n\tconst { isInserterOpen, isListViewOpen, listViewShortcut, isVisualMode } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst {\n\t\t\t\t__experimentalGetPreviewDeviceType,\n\t\t\t\tisInserterOpened,\n\t\t\t\tisListViewOpened,\n\t\t\t\tgetEditorMode,\n\t\t\t} = select( editSiteStore );\n\t\t\tconst { getShortcutRepresentation } = select(\n\t\t\t\tkeyboardShortcutsStore\n\t\t\t);\n\n\t\t\treturn {\n\t\t\t\tdeviceType: __experimentalGetPreviewDeviceType(),\n\t\t\t\tisInserterOpen: isInserterOpened(),\n\t\t\t\tisListViewOpen: isListViewOpened(),\n\t\t\t\tlistViewShortcut: getShortcutRepresentation(\n\t\t\t\t\t'core/edit-site/toggle-list-view'\n\t\t\t\t),\n\t\t\t\tisVisualMode: getEditorMode() === 'visual',\n\t\t\t};\n\t\t}, [] );\n\n\tconst {\n\t\t__experimentalSetPreviewDeviceType: setPreviewDeviceType,\n\t\tsetIsInserterOpened,\n\t\tsetIsListViewOpened,\n\t} = useDispatch( editSiteStore );\n\tconst { __unstableSetEditorMode } = useDispatch( blockEditorStore );\n\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\n\tconst toggleInserter = useCallback( () => {\n\t\tif ( isInserterOpen ) {\n\t\t\t// Focusing the inserter button should close the inserter popover.\n\t\t\t// However, there are some cases it won't close when the focus is lost.\n\t\t\t// See https://github.com/WordPress/gutenberg/issues/43090 for more details.\n\t\t\tinserterButton.current.focus();\n\t\t\tsetIsInserterOpened( false );\n\t\t} else {\n\t\t\tsetIsInserterOpened( true );\n\t\t}\n\t}, [ isInserterOpen, setIsInserterOpened ] );\n\n\tconst toggleListView = useCallback(\n\t\t() => setIsListViewOpened( ! isListViewOpen ),\n\t\t[ setIsListViewOpened, isListViewOpen ]\n\t);\n\n\tconst {\n\t\tshouldShowContextualToolbar,\n\t\tcanFocusHiddenToolbar,\n\t\tfixedToolbarCanBeFocused,\n\t} = useShouldContextualToolbarShow();\n\t// If there's a block toolbar to be focused, disable the focus shortcut for the document toolbar.\n\t// There's a fixed block toolbar when the fixed toolbar option is enabled or when the browser width is less than the large viewport.\n\tconst blockToolbarCanBeFocused =\n\t\tshouldShowContextualToolbar ||\n\t\tcanFocusHiddenToolbar ||\n\t\tfixedToolbarCanBeFocused;\n\n\t/* translators: button label text should, if possible, be under 16 characters. */\n\tconst longLabel = _x(\n\t\t'Toggle block inserter',\n\t\t'Generic label for block inserter button'\n\t);\n\tconst shortLabel = ! isInserterOpen ? __( 'Add' ) : __( 'Close' );\n\n\tconst isZoomedOutViewExperimentEnabled =\n\t\twindow?.__experimentalEnableZoomedOutView && isVisualMode;\n\tconst isZoomedOutView = blockEditorMode === 'zoom-out';\n\n\treturn (\n\t\t<NavigableToolbar\n\t\t\tclassName=\"edit-site-header-edit-mode__document-tools\"\n\t\t\taria-label={ __( 'Document tools' ) }\n\t\t\tshouldUseKeyboardFocusShortcut={ ! blockToolbarCanBeFocused }\n\t\t>\n\t\t\t<div className=\"edit-site-header-edit-mode__toolbar\">\n\t\t\t\t{ ! isDistractionFree && (\n\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\tref={ inserterButton }\n\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\tclassName=\"edit-site-header-edit-mode__inserter-toggle\"\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\tisPressed={ isInserterOpen }\n\t\t\t\t\t\tonMouseDown={ preventDefault }\n\t\t\t\t\t\tonClick={ toggleInserter }\n\t\t\t\t\t\tdisabled={ ! isVisualMode }\n\t\t\t\t\t\ticon={ plus }\n\t\t\t\t\t\tlabel={ showIconLabels ? shortLabel : longLabel }\n\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\taria-expanded={ isInserterOpen }\n\t\t\t\t\t/>\n\t\t\t\t) }\n\t\t\t\t{ isLargeViewport && (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{ ! hasFixedToolbar && (\n\t\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\t\tas={ ToolSelector }\n\t\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tshowIconLabels ? 'tertiary' : undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tdisabled={ ! isVisualMode }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\tas={ UndoButton }\n\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\tas={ RedoButton }\n\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\tvariant={ showIconLabels ? 'tertiary' : undefined }\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{ ! isDistractionFree && (\n\t\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\t\t\tclassName=\"edit-site-header-edit-mode__list-view-toggle\"\n\t\t\t\t\t\t\t\tdisabled={ ! isVisualMode || isZoomedOutView }\n\t\t\t\t\t\t\t\ticon={ listView }\n\t\t\t\t\t\t\t\tisPressed={ isListViewOpen }\n\t\t\t\t\t\t\t\t/* translators: button label text should, if possible, be under 16 characters. */\n\t\t\t\t\t\t\t\tlabel={ __( 'List View' ) }\n\t\t\t\t\t\t\t\tonClick={ toggleListView }\n\t\t\t\t\t\t\t\tref={ setListViewToggleElement }\n\t\t\t\t\t\t\t\tshortcut={ listViewShortcut }\n\t\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\tshowIconLabels ? 'tertiary' : undefined\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\taria-expanded={ isListViewOpen }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ isZoomedOutViewExperimentEnabled &&\n\t\t\t\t\t\t\t! isDistractionFree &&\n\t\t\t\t\t\t\t! hasFixedToolbar && (\n\t\t\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-header-edit-mode__zoom-out-view-toggle\"\n\t\t\t\t\t\t\t\t\ticon={ chevronUpDown }\n\t\t\t\t\t\t\t\t\tisPressed={ isZoomedOutView }\n\t\t\t\t\t\t\t\t\t/* translators: button label text should, if possible, be under 16 characters. */\n\t\t\t\t\t\t\t\t\tlabel={ __( 'Zoom-out View' ) }\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tsetPreviewDeviceType( 'Desktop' );\n\t\t\t\t\t\t\t\t\t\t__unstableSetEditorMode(\n\t\t\t\t\t\t\t\t\t\t\tisZoomedOutView\n\t\t\t\t\t\t\t\t\t\t\t\t? 'edit'\n\t\t\t\t\t\t\t\t\t\t\t\t: 'zoom-out'\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) }\n\t\t\t\t\t</>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t</NavigableToolbar>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/header-edit-mode/index.js

@@ -7,16 +7,15 @@ import classnames from 'classnames';
 /**
  * WordPress dependencies
  */
-import { useCallback, useRef } from '@wordpress/element';
 import { useViewportMatch, useReducedMotion } from '@wordpress/compose';
 import { store as coreStore } from '@wordpress/core-data';
-import { ToolSelector, __experimentalPreviewOptions as PreviewOptions, NavigableToolbar, store as blockEditorStore, privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
+import { __experimentalPreviewOptions as PreviewOptions, privateApis as blockEditorPrivateApis, store as blockEditorStore } from '@wordpress/block-editor';
 import { useSelect, useDispatch } from '@wordpress/data';
+import { useEffect, useRef, useState } from '@wordpress/element';
 import { PinnedItems } from '@wordpress/interface';
-import { _x, __ } from '@wordpress/i18n';
-import { listView, plus, external, chevronUpDown } from '@wordpress/icons';
-import { __unstableMotion as motion, Button, ToolbarItem, MenuGroup, MenuItem, VisuallyHidden } from '@wordpress/components';
-import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
+import { __ } from '@wordpress/i18n';
+import { external, next, previous } from '@wordpress/icons';
+import { Button, __unstableMotion as motion, MenuGroup, MenuItem, Popover, VisuallyHidden } from '@wordpress/components';
 import { store as preferencesStore } from '@wordpress/preferences';
 
 /**
@@ -24,48 +23,36 @@ import { store as preferencesStore } from '@wordpress/preferences';
  */
 import MoreMenu from './more-menu';
 import SaveButton from '../save-button';
-import UndoButton from './undo-redo/undo';
-import RedoButton from './undo-redo/redo';
 import DocumentActions from './document-actions';
+import DocumentTools from './document-tools';
 import { store as editSiteStore } from '../../store';
 import { getEditorCanvasContainerTitle, useHasEditorCanvasContainer } from '../editor-canvas-container';
 import { unlock } from '../../lock-unlock';
 import { FOCUSABLE_ENTITIES } from '../../utils/constants';
 const {
-  useShouldContextualToolbarShow
+  BlockContextualToolbar
 } = unlock(blockEditorPrivateApis);
-const preventDefault = event => {
-  event.preventDefault();
-};
 export default function HeaderEditMode({
   setListViewToggleElement
 }) {
-  const inserterButton = useRef();
   const {
     deviceType,
     templateType,
-    isInserterOpen,
-    isListViewOpen,
-    listViewShortcut,
-    isVisualMode,
     isDistractionFree,
     blockEditorMode,
+    blockSelectionStart,
     homeUrl,
     showIconLabels,
     editorCanvasView,
-    hasFixedToolbar
+    hasFixedToolbar,
+    isZoomOutMode
   } = useSelect(select => {
     const {
       __experimentalGetPreviewDeviceType,
-      getEditedPostType,
-      isInserterOpened,
-      isListViewOpened,
-      getEditorMode
+      getEditedPostType
     } = select(editSiteStore);
     const {
-      getShortcutRepresentation
-    } = select(keyboardShortcutsStore);
-    const {
+      getBlockSelectionStart,
       __unstableGetEditorMode
     } = select(blockEditorStore);
     const postType = getEditedPostType();
@@ -78,56 +65,34 @@ export default function HeaderEditMode({
     return {
       deviceType: __experimentalGetPreviewDeviceType(),
       templateType: postType,
-      isInserterOpen: isInserterOpened(),
-      isListViewOpen: isListViewOpened(),
-      listViewShortcut: getShortcutRepresentation('core/edit-site/toggle-list-view'),
-      isVisualMode: getEditorMode() === 'visual',
       blockEditorMode: __unstableGetEditorMode(),
+      blockSelectionStart: getBlockSelectionStart(),
       homeUrl: getUnstableBase()?.home,
       showIconLabels: getPreference(editSiteStore.name, 'showIconLabels'),
       editorCanvasView: unlock(select(editSiteStore)).getEditorCanvasContainerView(),
+      hasFixedToolbar: getPreference(editSiteStore.name, 'fixedToolbar'),
       isDistractionFree: getPreference(editSiteStore.name, 'distractionFree'),
-      hasFixedToolbar: getPreference(editSiteStore.name, 'fixedToolbar')
+      isZoomOutMode: __unstableGetEditorMode() === 'zoom-out'
     };
   }, []);
+  const isLargeViewport = useViewportMatch('medium');
+  const isTopToolbar = !isZoomOutMode && hasFixedToolbar && isLargeViewport;
+  const blockToolbarRef = useRef();
   const {
-    __experimentalSetPreviewDeviceType: setPreviewDeviceType,
-    setIsInserterOpened,
-    setIsListViewOpened
+    __experimentalSetPreviewDeviceType: setPreviewDeviceType
   } = useDispatch(editSiteStore);
-  const {
-    __unstableSetEditorMode
-  } = useDispatch(blockEditorStore);
   const disableMotion = useReducedMotion();
-  const isLargeViewport = useViewportMatch('medium');
-  const toggleInserter = useCallback(() => {
-    if (isInserterOpen) {
-      // Focusing the inserter button should close the inserter popover.
-      // However, there are some cases it won't close when the focus is lost.
-      // See https://github.com/WordPress/gutenberg/issues/43090 for more details.
-      inserterButton.current.focus();
-      setIsInserterOpened(false);
-    } else {
-      setIsInserterOpened(true);
-    }
-  }, [isInserterOpen, setIsInserterOpened]);
-  const toggleListView = useCallback(() => setIsListViewOpened(!isListViewOpen), [setIsListViewOpened, isListViewOpen]);
-  const {
-    shouldShowContextualToolbar,
-    canFocusHiddenToolbar,
-    fixedToolbarCanBeFocused
-  } = useShouldContextualToolbarShow();
-  // If there's a block toolbar to be focused, disable the focus shortcut for the document toolbar.
-  // There's a fixed block toolbar when the fixed toolbar option is enabled or when the browser width is less than the large viewport.
-  const blockToolbarCanBeFocused = shouldShowContextualToolbar || canFocusHiddenToolbar || fixedToolbarCanBeFocused;
   const hasDefaultEditorCanvasView = !useHasEditorCanvasContainer();
   const isFocusMode = FOCUSABLE_ENTITIES.includes(templateType);
-
-  /* translators: button label text should, if possible, be under 16 characters. */
-  const longLabel = _x('Toggle block inserter', 'Generic label for block inserter button');
-  const shortLabel = !isInserterOpen ? __('Add') : __('Close');
-  const isZoomedOutViewExperimentEnabled = window?.__experimentalEnableZoomedOutView && isVisualMode;
   const isZoomedOutView = blockEditorMode === 'zoom-out';
+  const [isBlockToolsCollapsed, setIsBlockToolsCollapsed] = useState(true);
+  const hasBlockSelected = !!blockSelectionStart;
+  useEffect(() => {
+    // If we have a new block selection, show the block tools
+    if (blockSelectionStart) {
+      setIsBlockToolsCollapsed(false);
+    }
+  }, [blockSelectionStart]);
   const toolbarVariants = {
     isDistractionFree: {
       y: '-50px'
@@ -151,68 +116,35 @@ export default function HeaderEditMode({
     className: classnames('edit-site-header-edit-mode', {
       'show-icon-labels': showIconLabels
     })
-  }, hasDefaultEditorCanvasView && createElement(NavigableToolbar, {
-    as: motion.div,
+  }, hasDefaultEditorCanvasView && createElement(motion.div, {
     className: "edit-site-header-edit-mode__start",
-    "aria-label": __('Document tools'),
-    shouldUseKeyboardFocusShortcut: !blockToolbarCanBeFocused,
     variants: toolbarVariants,
     transition: toolbarTransition
-  }, createElement("div", {
-    className: "edit-site-header-edit-mode__toolbar"
-  }, !isDistractionFree && createElement(ToolbarItem, {
-    ref: inserterButton,
-    as: Button,
-    className: "edit-site-header-edit-mode__inserter-toggle",
-    variant: "primary",
-    isPressed: isInserterOpen,
-    onMouseDown: preventDefault,
-    onClick: toggleInserter,
-    disabled: !isVisualMode,
-    icon: plus,
-    label: showIconLabels ? shortLabel : longLabel,
-    showTooltip: !showIconLabels,
-    "aria-expanded": isInserterOpen
-  }), isLargeViewport && createElement(Fragment, null, !hasFixedToolbar && createElement(ToolbarItem, {
-    as: ToolSelector,
-    showTooltip: !showIconLabels,
-    variant: showIconLabels ? 'tertiary' : undefined,
-    disabled: !isVisualMode
-  }), createElement(ToolbarItem, {
-    as: UndoButton,
-    showTooltip: !showIconLabels,
-    variant: showIconLabels ? 'tertiary' : undefined
-  }), createElement(ToolbarItem, {
-    as: RedoButton,
-    showTooltip: !showIconLabels,
-    variant: showIconLabels ? 'tertiary' : undefined
-  }), !isDistractionFree && createElement(ToolbarItem, {
-    as: Button,
-    className: "edit-site-header-edit-mode__list-view-toggle",
-    disabled: !isVisualMode || isZoomedOutView,
-    icon: listView,
-    isPressed: isListViewOpen
-    /* translators: button label text should, if possible, be under 16 characters. */,
-    label: __('List View'),
-    onClick: toggleListView,
-    ref: setListViewToggleElement,
-    shortcut: listViewShortcut,
-    showTooltip: !showIconLabels,
-    variant: showIconLabels ? 'tertiary' : undefined,
-    "aria-expanded": isListViewOpen
-  }), isZoomedOutViewExperimentEnabled && !isDistractionFree && !hasFixedToolbar && createElement(ToolbarItem, {
-    as: Button,
-    className: "edit-site-header-edit-mode__zoom-out-view-toggle",
-    icon: chevronUpDown,
-    isPressed: isZoomedOutView
-    /* translators: button label text should, if possible, be under 16 characters. */,
-    label: __('Zoom-out View'),
+  }, createElement(DocumentTools, {
+    blockEditorMode: blockEditorMode,
+    isDistractionFree: isDistractionFree,
+    showIconLabels: showIconLabels,
+    setListViewToggleElement: setListViewToggleElement
+  }), isTopToolbar && createElement(Fragment, null, createElement("div", {
+    className: classnames('selected-block-tools-wrapper', {
+      'is-collapsed': isBlockToolsCollapsed
+    })
+  }, createElement(BlockContextualToolbar, {
+    isFixed: true
+  })), createElement(Popover.Slot, {
+    ref: blockToolbarRef,
+    name: "block-toolbar"
+  }), hasBlockSelected && createElement(Button, {
+    className: "edit-site-header-edit-mode__block-tools-toggle",
+    icon: isBlockToolsCollapsed ? next : previous,
     onClick: () => {
-      setPreviewDeviceType('Desktop');
-      __unstableSetEditorMode(isZoomedOutView ? 'edit' : 'zoom-out');
-    }
-  })))), !isDistractionFree && createElement("div", {
-    className: "edit-site-header-edit-mode__center"
+      setIsBlockToolsCollapsed(collapsed => !collapsed);
+    },
+    label: isBlockToolsCollapsed ? __('Show block tools') : __('Hide block tools')
+  }))), !isDistractionFree && createElement("div", {
+    className: classnames('edit-site-header-edit-mode__center', {
+      'is-collapsed': !isBlockToolsCollapsed && isLargeViewport
+    })
   }, !hasDefaultEditorCanvasView ? getEditorCanvasContainerTitle(editorCanvasView) : createElement(DocumentActions, null)), createElement("div", {
     className: "edit-site-header-edit-mode__end"
   }, createElement(motion.div, {

package/build-module/components/header-edit-mode/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["classnames","useCallback","useRef","useViewportMatch","useReducedMotion","store","coreStore","ToolSelector","__experimentalPreviewOptions","PreviewOptions","NavigableToolbar","blockEditorStore","privateApis","blockEditorPrivateApis","useSelect","useDispatch","PinnedItems","_x","__","listView","plus","external","chevronUpDown","__unstableMotion","motion","Button","ToolbarItem","MenuGroup","MenuItem","VisuallyHidden","keyboardShortcutsStore","preferencesStore","MoreMenu","SaveButton","UndoButton","RedoButton","DocumentActions","editSiteStore","getEditorCanvasContainerTitle","useHasEditorCanvasContainer","unlock","FOCUSABLE_ENTITIES","useShouldContextualToolbarShow","preventDefault","event","HeaderEditMode","setListViewToggleElement","inserterButton","deviceType","templateType","isInserterOpen","isListViewOpen","listViewShortcut","isVisualMode","isDistractionFree","blockEditorMode","homeUrl","showIconLabels","editorCanvasView","hasFixedToolbar","select","__experimentalGetPreviewDeviceType","getEditedPostType","isInserterOpened","isListViewOpened","getEditorMode","getShortcutRepresentation","__unstableGetEditorMode","postType","getUnstableBase","get","getPreference","home","name","getEditorCanvasContainerView","__experimentalSetPreviewDeviceType","setPreviewDeviceType","setIsInserterOpened","setIsListViewOpened","__unstableSetEditorMode","disableMotion","isLargeViewport","toggleInserter","current","focus","toggleListView","shouldShowContextualToolbar","canFocusHiddenToolbar","fixedToolbarCanBeFocused","blockToolbarCanBeFocused","hasDefaultEditorCanvasView","isFocusMode","includes","longLabel","shortLabel","isZoomedOutViewExperimentEnabled","window","__experimentalEnableZoomedOutView","isZoomedOutView","toolbarVariants","y","isDistractionFreeHovering","view","edit","toolbarTransition","type","duration","ease","createElement","className","as","div","shouldUseKeyboardFocusShortcut","variants","transition","ref","variant","isPressed","onMouseDown","onClick","disabled","icon","label","showTooltip","Fragment","undefined","shortcut","setDeviceType","isEnabled","onClose","href","target","Slot","scope"],"sources":["@wordpress/edit-site/src/components/header-edit-mode/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useCallback, useRef } from '@wordpress/element';\nimport { useViewportMatch, useReducedMotion } from '@wordpress/compose';\nimport { store as coreStore } from '@wordpress/core-data';\nimport {\n\tToolSelector,\n\t__experimentalPreviewOptions as PreviewOptions,\n\tNavigableToolbar,\n\tstore as blockEditorStore,\n\tprivateApis as blockEditorPrivateApis,\n} from '@wordpress/block-editor';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { PinnedItems } from '@wordpress/interface';\nimport { _x, __ } from '@wordpress/i18n';\nimport { listView, plus, external, chevronUpDown } from '@wordpress/icons';\nimport {\n\t__unstableMotion as motion,\n\tButton,\n\tToolbarItem,\n\tMenuGroup,\n\tMenuItem,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\nimport { store as preferencesStore } from '@wordpress/preferences';\n\n/**\n * Internal dependencies\n */\nimport MoreMenu from './more-menu';\nimport SaveButton from '../save-button';\nimport UndoButton from './undo-redo/undo';\nimport RedoButton from './undo-redo/redo';\nimport DocumentActions from './document-actions';\nimport { store as editSiteStore } from '../../store';\nimport {\n\tgetEditorCanvasContainerTitle,\n\tuseHasEditorCanvasContainer,\n} from '../editor-canvas-container';\nimport { unlock } from '../../lock-unlock';\nimport { FOCUSABLE_ENTITIES } from '../../utils/constants';\n\nconst { useShouldContextualToolbarShow } = unlock( blockEditorPrivateApis );\n\nconst preventDefault = ( event ) => {\n\tevent.preventDefault();\n};\n\nexport default function HeaderEditMode( { setListViewToggleElement } ) {\n\tconst inserterButton = useRef();\n\tconst {\n\t\tdeviceType,\n\t\ttemplateType,\n\t\tisInserterOpen,\n\t\tisListViewOpen,\n\t\tlistViewShortcut,\n\t\tisVisualMode,\n\t\tisDistractionFree,\n\t\tblockEditorMode,\n\t\thomeUrl,\n\t\tshowIconLabels,\n\t\teditorCanvasView,\n\t\thasFixedToolbar,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\t__experimentalGetPreviewDeviceType,\n\t\t\tgetEditedPostType,\n\t\t\tisInserterOpened,\n\t\t\tisListViewOpened,\n\t\t\tgetEditorMode,\n\t\t} = select( editSiteStore );\n\t\tconst { getShortcutRepresentation } = select( keyboardShortcutsStore );\n\t\tconst { __unstableGetEditorMode } = select( blockEditorStore );\n\n\t\tconst postType = getEditedPostType();\n\n\t\tconst {\n\t\t\tgetUnstableBase, // Site index.\n\t\t} = select( coreStore );\n\n\t\tconst { get: getPreference } = select( preferencesStore );\n\n\t\treturn {\n\t\t\tdeviceType: __experimentalGetPreviewDeviceType(),\n\t\t\ttemplateType: postType,\n\t\t\tisInserterOpen: isInserterOpened(),\n\t\t\tisListViewOpen: isListViewOpened(),\n\t\t\tlistViewShortcut: getShortcutRepresentation(\n\t\t\t\t'core/edit-site/toggle-list-view'\n\t\t\t),\n\t\t\tisVisualMode: getEditorMode() === 'visual',\n\t\t\tblockEditorMode: __unstableGetEditorMode(),\n\t\t\thomeUrl: getUnstableBase()?.home,\n\t\t\tshowIconLabels: getPreference(\n\t\t\t\teditSiteStore.name,\n\t\t\t\t'showIconLabels'\n\t\t\t),\n\t\t\teditorCanvasView: unlock(\n\t\t\t\tselect( editSiteStore )\n\t\t\t).getEditorCanvasContainerView(),\n\t\t\tisDistractionFree: getPreference(\n\t\t\t\teditSiteStore.name,\n\t\t\t\t'distractionFree'\n\t\t\t),\n\t\t\thasFixedToolbar: getPreference(\n\t\t\t\teditSiteStore.name,\n\t\t\t\t'fixedToolbar'\n\t\t\t),\n\t\t};\n\t}, [] );\n\n\tconst {\n\t\t__experimentalSetPreviewDeviceType: setPreviewDeviceType,\n\t\tsetIsInserterOpened,\n\t\tsetIsListViewOpened,\n\t} = useDispatch( editSiteStore );\n\tconst { __unstableSetEditorMode } = useDispatch( blockEditorStore );\n\tconst disableMotion = useReducedMotion();\n\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\n\tconst toggleInserter = useCallback( () => {\n\t\tif ( isInserterOpen ) {\n\t\t\t// Focusing the inserter button should close the inserter popover.\n\t\t\t// However, there are some cases it won't close when the focus is lost.\n\t\t\t// See https://github.com/WordPress/gutenberg/issues/43090 for more details.\n\t\t\tinserterButton.current.focus();\n\t\t\tsetIsInserterOpened( false );\n\t\t} else {\n\t\t\tsetIsInserterOpened( true );\n\t\t}\n\t}, [ isInserterOpen, setIsInserterOpened ] );\n\n\tconst toggleListView = useCallback(\n\t\t() => setIsListViewOpened( ! isListViewOpen ),\n\t\t[ setIsListViewOpened, isListViewOpen ]\n\t);\n\n\tconst {\n\t\tshouldShowContextualToolbar,\n\t\tcanFocusHiddenToolbar,\n\t\tfixedToolbarCanBeFocused,\n\t} = useShouldContextualToolbarShow();\n\t// If there's a block toolbar to be focused, disable the focus shortcut for the document toolbar.\n\t// There's a fixed block toolbar when the fixed toolbar option is enabled or when the browser width is less than the large viewport.\n\tconst blockToolbarCanBeFocused =\n\t\tshouldShowContextualToolbar ||\n\t\tcanFocusHiddenToolbar ||\n\t\tfixedToolbarCanBeFocused;\n\n\tconst hasDefaultEditorCanvasView = ! useHasEditorCanvasContainer();\n\n\tconst isFocusMode = FOCUSABLE_ENTITIES.includes( templateType );\n\n\t/* translators: button label text should, if possible, be under 16 characters. */\n\tconst longLabel = _x(\n\t\t'Toggle block inserter',\n\t\t'Generic label for block inserter button'\n\t);\n\tconst shortLabel = ! isInserterOpen ? __( 'Add' ) : __( 'Close' );\n\n\tconst isZoomedOutViewExperimentEnabled =\n\t\twindow?.__experimentalEnableZoomedOutView && isVisualMode;\n\tconst isZoomedOutView = blockEditorMode === 'zoom-out';\n\n\tconst toolbarVariants = {\n\t\tisDistractionFree: { y: '-50px' },\n\t\tisDistractionFreeHovering: { y: 0 },\n\t\tview: { y: 0 },\n\t\tedit: { y: 0 },\n\t};\n\n\tconst toolbarTransition = {\n\t\ttype: 'tween',\n\t\tduration: disableMotion ? 0 : 0.2,\n\t\tease: 'easeOut',\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'edit-site-header-edit-mode', {\n\t\t\t\t'show-icon-labels': showIconLabels,\n\t\t\t} ) }\n\t\t>\n\t\t\t{ hasDefaultEditorCanvasView && (\n\t\t\t\t<NavigableToolbar\n\t\t\t\t\tas={ motion.div }\n\t\t\t\t\tclassName=\"edit-site-header-edit-mode__start\"\n\t\t\t\t\taria-label={ __( 'Document tools' ) }\n\t\t\t\t\tshouldUseKeyboardFocusShortcut={\n\t\t\t\t\t\t! blockToolbarCanBeFocused\n\t\t\t\t\t}\n\t\t\t\t\tvariants={ toolbarVariants }\n\t\t\t\t\ttransition={ toolbarTransition }\n\t\t\t\t>\n\t\t\t\t\t<div className=\"edit-site-header-edit-mode__toolbar\">\n\t\t\t\t\t\t{ ! isDistractionFree && (\n\t\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\t\tref={ inserterButton }\n\t\t\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\t\t\tclassName=\"edit-site-header-edit-mode__inserter-toggle\"\n\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\tisPressed={ isInserterOpen }\n\t\t\t\t\t\t\t\tonMouseDown={ preventDefault }\n\t\t\t\t\t\t\t\tonClick={ toggleInserter }\n\t\t\t\t\t\t\t\tdisabled={ ! isVisualMode }\n\t\t\t\t\t\t\t\ticon={ plus }\n\t\t\t\t\t\t\t\tlabel={\n\t\t\t\t\t\t\t\t\tshowIconLabels ? shortLabel : longLabel\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\t\taria-expanded={ isInserterOpen }\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t) }\n\t\t\t\t\t\t{ isLargeViewport && (\n\t\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t\t{ ! hasFixedToolbar && (\n\t\t\t\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\t\t\t\tas={ ToolSelector }\n\t\t\t\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\tshowIconLabels\n\t\t\t\t\t\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\tdisabled={ ! isVisualMode }\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<ToolbarItem\n\t\t\t\t\t\t\t\t\tas={ UndoButton }\n\t\t\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\tshowIconLabels ? 'tertiary' : undefined\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<ToolbarItem\n\t\t\t\t\t\t\t\t\tas={ RedoButton }\n\t\t\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\tshowIconLabels ? 'tertiary' : undefined\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{ ! isDistractionFree && (\n\t\t\t\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-header-edit-mode__list-view-toggle\"\n\t\t\t\t\t\t\t\t\t\tdisabled={\n\t\t\t\t\t\t\t\t\t\t\t! isVisualMode || isZoomedOutView\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\ticon={ listView }\n\t\t\t\t\t\t\t\t\t\tisPressed={ isListViewOpen }\n\t\t\t\t\t\t\t\t\t\t/* translators: button label text should, if possible, be under 16 characters. */\n\t\t\t\t\t\t\t\t\t\tlabel={ __( 'List View' ) }\n\t\t\t\t\t\t\t\t\t\tonClick={ toggleListView }\n\t\t\t\t\t\t\t\t\t\tref={ setListViewToggleElement }\n\t\t\t\t\t\t\t\t\t\tshortcut={ listViewShortcut }\n\t\t\t\t\t\t\t\t\t\tshowTooltip={ ! showIconLabels }\n\t\t\t\t\t\t\t\t\t\tvariant={\n\t\t\t\t\t\t\t\t\t\t\tshowIconLabels\n\t\t\t\t\t\t\t\t\t\t\t\t? 'tertiary'\n\t\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\taria-expanded={ isListViewOpen }\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{ isZoomedOutViewExperimentEnabled &&\n\t\t\t\t\t\t\t\t\t! isDistractionFree &&\n\t\t\t\t\t\t\t\t\t! hasFixedToolbar && (\n\t\t\t\t\t\t\t\t\t\t<ToolbarItem\n\t\t\t\t\t\t\t\t\t\t\tas={ Button }\n\t\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-header-edit-mode__zoom-out-view-toggle\"\n\t\t\t\t\t\t\t\t\t\t\ticon={ chevronUpDown }\n\t\t\t\t\t\t\t\t\t\t\tisPressed={ isZoomedOutView }\n\t\t\t\t\t\t\t\t\t\t\t/* translators: button label text should, if possible, be under 16 characters. */\n\t\t\t\t\t\t\t\t\t\t\tlabel={ __( 'Zoom-out View' ) }\n\t\t\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\t\t\tsetPreviewDeviceType(\n\t\t\t\t\t\t\t\t\t\t\t\t\t'Desktop'\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t\t__unstableSetEditorMode(\n\t\t\t\t\t\t\t\t\t\t\t\t\tisZoomedOutView\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 'edit'\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 'zoom-out'\n\t\t\t\t\t\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</div>\n\t\t\t\t</NavigableToolbar>\n\t\t\t) }\n\n\t\t\t{ ! isDistractionFree && (\n\t\t\t\t<div className=\"edit-site-header-edit-mode__center\">\n\t\t\t\t\t{ ! hasDefaultEditorCanvasView ? (\n\t\t\t\t\t\tgetEditorCanvasContainerTitle( editorCanvasView )\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<DocumentActions />\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t) }\n\n\t\t\t<div className=\"edit-site-header-edit-mode__end\">\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-header-edit-mode__actions\"\n\t\t\t\t\tvariants={ toolbarVariants }\n\t\t\t\t\ttransition={ toolbarTransition }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-header-edit-mode__preview-options',\n\t\t\t\t\t\t\t{ 'is-zoomed-out': isZoomedOutView }\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<PreviewOptions\n\t\t\t\t\t\t\tdeviceType={ deviceType }\n\t\t\t\t\t\t\tsetDeviceType={ setPreviewDeviceType }\n\t\t\t\t\t\t\tlabel={ __( 'View' ) }\n\t\t\t\t\t\t\tisEnabled={\n\t\t\t\t\t\t\t\t! isFocusMode && hasDefaultEditorCanvasView\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( { onClose } ) => (\n\t\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\thref={ homeUrl }\n\t\t\t\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'View site' ) }\n\t\t\t\t\t\t\t\t\t\t<VisuallyHidden as=\"span\">\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t/* translators: accessibility text */\n\t\t\t\t\t\t\t\t\t\t\t\t__( '(opens in a new tab)' )\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</PreviewOptions>\n\t\t\t\t\t</div>\n\t\t\t\t\t<SaveButton />\n\t\t\t\t\t{ ! isDistractionFree && (\n\t\t\t\t\t\t<PinnedItems.Slot scope=\"core/edit-site\" />\n\t\t\t\t\t) }\n\t\t\t\t\t<MoreMenu showIconLabels={ showIconLabels } />\n\t\t\t\t</motion.div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["classnames","useViewportMatch","useReducedMotion","store","coreStore","__experimentalPreviewOptions","PreviewOptions","privateApis","blockEditorPrivateApis","blockEditorStore","useSelect","useDispatch","useEffect","useRef","useState","PinnedItems","__","external","next","previous","Button","__unstableMotion","motion","MenuGroup","MenuItem","Popover","VisuallyHidden","preferencesStore","MoreMenu","SaveButton","DocumentActions","DocumentTools","editSiteStore","getEditorCanvasContainerTitle","useHasEditorCanvasContainer","unlock","FOCUSABLE_ENTITIES","BlockContextualToolbar","HeaderEditMode","setListViewToggleElement","deviceType","templateType","isDistractionFree","blockEditorMode","blockSelectionStart","homeUrl","showIconLabels","editorCanvasView","hasFixedToolbar","isZoomOutMode","select","__experimentalGetPreviewDeviceType","getEditedPostType","getBlockSelectionStart","__unstableGetEditorMode","postType","getUnstableBase","get","getPreference","home","name","getEditorCanvasContainerView","isLargeViewport","isTopToolbar","blockToolbarRef","__experimentalSetPreviewDeviceType","setPreviewDeviceType","disableMotion","hasDefaultEditorCanvasView","isFocusMode","includes","isZoomedOutView","isBlockToolsCollapsed","setIsBlockToolsCollapsed","hasBlockSelected","toolbarVariants","y","isDistractionFreeHovering","view","edit","toolbarTransition","type","duration","ease","createElement","className","div","variants","transition","Fragment","isFixed","Slot","ref","icon","onClick","collapsed","label","setDeviceType","isEnabled","onClose","href","target","as","scope"],"sources":["@wordpress/edit-site/src/components/header-edit-mode/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useViewportMatch, useReducedMotion } from '@wordpress/compose';\nimport { store as coreStore } from '@wordpress/core-data';\nimport {\n\t__experimentalPreviewOptions as PreviewOptions,\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { useEffect, useRef, useState } from '@wordpress/element';\nimport { PinnedItems } from '@wordpress/interface';\nimport { __ } from '@wordpress/i18n';\nimport { external, next, previous } from '@wordpress/icons';\nimport {\n\tButton,\n\t__unstableMotion as motion,\n\tMenuGroup,\n\tMenuItem,\n\tPopover,\n\tVisuallyHidden,\n} from '@wordpress/components';\nimport { store as preferencesStore } from '@wordpress/preferences';\n\n/**\n * Internal dependencies\n */\nimport MoreMenu from './more-menu';\nimport SaveButton from '../save-button';\nimport DocumentActions from './document-actions';\nimport DocumentTools from './document-tools';\nimport { store as editSiteStore } from '../../store';\nimport {\n\tgetEditorCanvasContainerTitle,\n\tuseHasEditorCanvasContainer,\n} from '../editor-canvas-container';\nimport { unlock } from '../../lock-unlock';\nimport { FOCUSABLE_ENTITIES } from '../../utils/constants';\n\nconst { BlockContextualToolbar } = unlock( blockEditorPrivateApis );\n\nexport default function HeaderEditMode( { setListViewToggleElement } ) {\n\tconst {\n\t\tdeviceType,\n\t\ttemplateType,\n\t\tisDistractionFree,\n\t\tblockEditorMode,\n\t\tblockSelectionStart,\n\t\thomeUrl,\n\t\tshowIconLabels,\n\t\teditorCanvasView,\n\t\thasFixedToolbar,\n\t\tisZoomOutMode,\n\t} = useSelect( ( select ) => {\n\t\tconst { __experimentalGetPreviewDeviceType, getEditedPostType } =\n\t\t\tselect( editSiteStore );\n\t\tconst { getBlockSelectionStart, __unstableGetEditorMode } =\n\t\t\tselect( blockEditorStore );\n\n\t\tconst postType = getEditedPostType();\n\n\t\tconst {\n\t\t\tgetUnstableBase, // Site index.\n\t\t} = select( coreStore );\n\n\t\tconst { get: getPreference } = select( preferencesStore );\n\n\t\treturn {\n\t\t\tdeviceType: __experimentalGetPreviewDeviceType(),\n\t\t\ttemplateType: postType,\n\t\t\tblockEditorMode: __unstableGetEditorMode(),\n\t\t\tblockSelectionStart: getBlockSelectionStart(),\n\t\t\thomeUrl: getUnstableBase()?.home,\n\t\t\tshowIconLabels: getPreference(\n\t\t\t\teditSiteStore.name,\n\t\t\t\t'showIconLabels'\n\t\t\t),\n\t\t\teditorCanvasView: unlock(\n\t\t\t\tselect( editSiteStore )\n\t\t\t).getEditorCanvasContainerView(),\n\t\t\thasFixedToolbar: getPreference(\n\t\t\t\teditSiteStore.name,\n\t\t\t\t'fixedToolbar'\n\t\t\t),\n\t\t\tisDistractionFree: getPreference(\n\t\t\t\teditSiteStore.name,\n\t\t\t\t'distractionFree'\n\t\t\t),\n\t\t\tisZoomOutMode: __unstableGetEditorMode() === 'zoom-out',\n\t\t};\n\t}, [] );\n\n\tconst isLargeViewport = useViewportMatch( 'medium' );\n\tconst isTopToolbar = ! isZoomOutMode && hasFixedToolbar && isLargeViewport;\n\tconst blockToolbarRef = useRef();\n\n\tconst { __experimentalSetPreviewDeviceType: setPreviewDeviceType } =\n\t\tuseDispatch( editSiteStore );\n\tconst disableMotion = useReducedMotion();\n\n\tconst hasDefaultEditorCanvasView = ! useHasEditorCanvasContainer();\n\n\tconst isFocusMode = FOCUSABLE_ENTITIES.includes( templateType );\n\n\tconst isZoomedOutView = blockEditorMode === 'zoom-out';\n\n\tconst [ isBlockToolsCollapsed, setIsBlockToolsCollapsed ] =\n\t\tuseState( true );\n\n\tconst hasBlockSelected = !! blockSelectionStart;\n\n\tuseEffect( () => {\n\t\t// If we have a new block selection, show the block tools\n\t\tif ( blockSelectionStart ) {\n\t\t\tsetIsBlockToolsCollapsed( false );\n\t\t}\n\t}, [ blockSelectionStart ] );\n\n\tconst toolbarVariants = {\n\t\tisDistractionFree: { y: '-50px' },\n\t\tisDistractionFreeHovering: { y: 0 },\n\t\tview: { y: 0 },\n\t\tedit: { y: 0 },\n\t};\n\n\tconst toolbarTransition = {\n\t\ttype: 'tween',\n\t\tduration: disableMotion ? 0 : 0.2,\n\t\tease: 'easeOut',\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={ classnames( 'edit-site-header-edit-mode', {\n\t\t\t\t'show-icon-labels': showIconLabels,\n\t\t\t} ) }\n\t\t>\n\t\t\t{ hasDefaultEditorCanvasView && (\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-header-edit-mode__start\"\n\t\t\t\t\tvariants={ toolbarVariants }\n\t\t\t\t\ttransition={ toolbarTransition }\n\t\t\t\t>\n\t\t\t\t\t<DocumentTools\n\t\t\t\t\t\tblockEditorMode={ blockEditorMode }\n\t\t\t\t\t\tisDistractionFree={ isDistractionFree }\n\t\t\t\t\t\tshowIconLabels={ showIconLabels }\n\t\t\t\t\t\tsetListViewToggleElement={ setListViewToggleElement }\n\t\t\t\t\t/>\n\t\t\t\t\t{ isTopToolbar && (\n\t\t\t\t\t\t<>\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t'selected-block-tools-wrapper',\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t'is-collapsed': isBlockToolsCollapsed,\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\t<BlockContextualToolbar isFixed />\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t<Popover.Slot\n\t\t\t\t\t\t\t\tref={ blockToolbarRef }\n\t\t\t\t\t\t\t\tname=\"block-toolbar\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t{ hasBlockSelected && (\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tclassName=\"edit-site-header-edit-mode__block-tools-toggle\"\n\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\tisBlockToolsCollapsed ? next : previous\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\t\t\t\t\tsetIsBlockToolsCollapsed(\n\t\t\t\t\t\t\t\t\t\t\t( collapsed ) => ! collapsed\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\tlabel={\n\t\t\t\t\t\t\t\t\t\tisBlockToolsCollapsed\n\t\t\t\t\t\t\t\t\t\t\t? __( 'Show block tools' )\n\t\t\t\t\t\t\t\t\t\t\t: __( 'Hide block tools' )\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</motion.div>\n\t\t\t) }\n\n\t\t\t{ ! isDistractionFree && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t'edit-site-header-edit-mode__center',\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\t'is-collapsed':\n\t\t\t\t\t\t\t\t! isBlockToolsCollapsed && isLargeViewport,\n\t\t\t\t\t\t}\n\t\t\t\t\t) }\n\t\t\t\t>\n\t\t\t\t\t{ ! hasDefaultEditorCanvasView ? (\n\t\t\t\t\t\tgetEditorCanvasContainerTitle( editorCanvasView )\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<DocumentActions />\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t) }\n\n\t\t\t<div className=\"edit-site-header-edit-mode__end\">\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-header-edit-mode__actions\"\n\t\t\t\t\tvariants={ toolbarVariants }\n\t\t\t\t\ttransition={ toolbarTransition }\n\t\t\t\t>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'edit-site-header-edit-mode__preview-options',\n\t\t\t\t\t\t\t{ 'is-zoomed-out': isZoomedOutView }\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<PreviewOptions\n\t\t\t\t\t\t\tdeviceType={ deviceType }\n\t\t\t\t\t\t\tsetDeviceType={ setPreviewDeviceType }\n\t\t\t\t\t\t\tlabel={ __( 'View' ) }\n\t\t\t\t\t\t\tisEnabled={\n\t\t\t\t\t\t\t\t! isFocusMode && hasDefaultEditorCanvasView\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ ( { onClose } ) => (\n\t\t\t\t\t\t\t\t<MenuGroup>\n\t\t\t\t\t\t\t\t\t<MenuItem\n\t\t\t\t\t\t\t\t\t\thref={ homeUrl }\n\t\t\t\t\t\t\t\t\t\ttarget=\"_blank\"\n\t\t\t\t\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t\t\t\t\t\tonClick={ onClose }\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{ __( 'View site' ) }\n\t\t\t\t\t\t\t\t\t\t<VisuallyHidden as=\"span\">\n\t\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t\t/* translators: accessibility text */\n\t\t\t\t\t\t\t\t\t\t\t\t__( '(opens in a new tab)' )\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t</VisuallyHidden>\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t</MenuGroup>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</PreviewOptions>\n\t\t\t\t\t</div>\n\t\t\t\t\t<SaveButton />\n\t\t\t\t\t{ ! isDistractionFree && (\n\t\t\t\t\t\t<PinnedItems.Slot scope=\"core/edit-site\" />\n\t\t\t\t\t) }\n\t\t\t\t\t<MoreMenu showIconLabels={ showIconLabels } />\n\t\t\t\t</motion.div>\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/header-edit-mode/more-menu/site-export.js

@@ -1,9 +1,4 @@
 import { createElement } from "react";
-/**
- * External dependencies
- */
-import downloadjs from 'downloadjs';
-
 /**
  * WordPress dependencies
  */
@@ -12,6 +7,7 @@ import { MenuItem } from '@wordpress/components';
 import apiFetch from '@wordpress/api-fetch';
 import { download } from '@wordpress/icons';
 import { useDispatch } from '@wordpress/data';
+import { downloadBlob } from '@wordpress/blob';
 import { store as noticesStore } from '@wordpress/notices';
 export default function SiteExport() {
   const {
@@ -30,7 +26,7 @@ export default function SiteExport() {
       const contentDisposition = response.headers.get('content-disposition');
       const contentDispositionMatches = contentDisposition.match(/=(.+)\.zip/);
       const fileName = contentDispositionMatches[1] ? contentDispositionMatches[1] : 'edit-site-export';
-      downloadjs(blob, fileName + '.zip', 'application/zip');
+      downloadBlob(fileName + '.zip', blob, 'application/zip');
     } catch (errorResponse) {
       let error = {};
       try {

package/build-module/components/header-edit-mode/more-menu/site-export.js.map

@@ -1 +1 @@
-{"version":3,"names":["downloadjs","__","_x","MenuItem","apiFetch","download","useDispatch","store","noticesStore","SiteExport","createErrorNotice","handleExport","response","path","parse","headers","Accept","blob","contentDisposition","get","contentDispositionMatches","match","fileName","errorResponse","error","json","e","errorMessage","message","code","type","createElement","role","icon","onClick","info"],"sources":["@wordpress/edit-site/src/components/header-edit-mode/more-menu/site-export.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport downloadjs from 'downloadjs';\n\n/**\n * WordPress dependencies\n */\nimport { __, _x } from '@wordpress/i18n';\nimport { MenuItem } from '@wordpress/components';\nimport apiFetch from '@wordpress/api-fetch';\nimport { download } from '@wordpress/icons';\nimport { useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\n\nexport default function SiteExport() {\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tasync function handleExport() {\n\t\ttry {\n\t\t\tconst response = await apiFetch( {\n\t\t\t\tpath: '/wp-block-editor/v1/export',\n\t\t\t\tparse: false,\n\t\t\t\theaders: {\n\t\t\t\t\tAccept: 'application/zip',\n\t\t\t\t},\n\t\t\t} );\n\t\t\tconst blob = await response.blob();\n\t\t\tconst contentDisposition = response.headers.get(\n\t\t\t\t'content-disposition'\n\t\t\t);\n\t\t\tconst contentDispositionMatches =\n\t\t\t\tcontentDisposition.match( /=(.+)\\.zip/ );\n\t\t\tconst fileName = contentDispositionMatches[ 1 ]\n\t\t\t\t? contentDispositionMatches[ 1 ]\n\t\t\t\t: 'edit-site-export';\n\n\t\t\tdownloadjs( blob, fileName + '.zip', 'application/zip' );\n\t\t} catch ( errorResponse ) {\n\t\t\tlet error = {};\n\t\t\ttry {\n\t\t\t\terror = await errorResponse.json();\n\t\t\t} catch ( e ) {}\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __( 'An error occurred while creating the site export.' );\n\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\t\t}\n\t}\n\n\treturn (\n\t\t<MenuItem\n\t\t\trole=\"menuitem\"\n\t\t\ticon={ download }\n\t\t\tonClick={ handleExport }\n\t\t\tinfo={ __(\n\t\t\t\t'Download your theme with updated templates and styles.'\n\t\t\t) }\n\t\t>\n\t\t\t{ _x( 'Export', 'site exporter menu item' ) }\n\t\t</MenuItem>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,UAAU,MAAM,YAAY;;AAEnC;AACA;AACA;AACA,SAASC,EAAE,EAAEC,EAAE,QAAQ,iBAAiB;AACxC,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,OAAOC,QAAQ,MAAM,sBAAsB;AAC3C,SAASC,QAAQ,QAAQ,kBAAkB;AAC3C,SAASC,WAAW,QAAQ,iBAAiB;AAC7C,SAASC,KAAK,IAAIC,YAAY,QAAQ,oBAAoB;AAE1D,eAAe,SAASC,UAAUA,CAAA,EAAG;EACpC,MAAM;IAAEC;EAAkB,CAAC,GAAGJ,WAAW,CAAEE,YAAa,CAAC;EAEzD,eAAeG,YAAYA,CAAA,EAAG;IAC7B,IAAI;MACH,MAAMC,QAAQ,GAAG,MAAMR,QAAQ,CAAE;QAChCS,IAAI,EAAE,4BAA4B;QAClCC,KAAK,EAAE,KAAK;QACZC,OAAO,EAAE;UACRC,MAAM,EAAE;QACT;MACD,CAAE,CAAC;MACH,MAAMC,IAAI,GAAG,MAAML,QAAQ,CAACK,IAAI,CAAC,CAAC;MAClC,MAAMC,kBAAkB,GAAGN,QAAQ,CAACG,OAAO,CAACI,GAAG,CAC9C,qBACD,CAAC;MACD,MAAMC,yBAAyB,GAC9BF,kBAAkB,CAACG,KAAK,CAAE,YAAa,CAAC;MACzC,MAAMC,QAAQ,GAAGF,yBAAyB,CAAE,CAAC,CAAE,GAC5CA,yBAAyB,CAAE,CAAC,CAAE,GAC9B,kBAAkB;MAErBpB,UAAU,CAAEiB,IAAI,EAAEK,QAAQ,GAAG,MAAM,EAAE,iBAAkB,CAAC;IACzD,CAAC,CAAC,OAAQC,aAAa,EAAG;MACzB,IAAIC,KAAK,GAAG,CAAC,CAAC;MACd,IAAI;QACHA,KAAK,GAAG,MAAMD,aAAa,CAACE,IAAI,CAAC,CAAC;MACnC,CAAC,CAAC,OAAQC,CAAC,EAAG,CAAC;MACf,MAAMC,YAAY,GACjBH,KAAK,CAACI,OAAO,IAAIJ,KAAK,CAACK,IAAI,KAAK,eAAe,GAC5CL,KAAK,CAACI,OAAO,GACb3B,EAAE,CAAE,mDAAoD,CAAC;MAE7DS,iBAAiB,CAAEiB,YAAY,EAAE;QAAEG,IAAI,EAAE;MAAW,CAAE,CAAC;IACxD;EACD;EAEA,OACCC,aAAA,CAAC5B,QAAQ;IACR6B,IAAI,EAAC,UAAU;IACfC,IAAI,EAAG5B,QAAU;IACjB6B,OAAO,EAAGvB,YAAc;IACxBwB,IAAI,EAAGlC,EAAE,CACR,wDACD;EAAG,GAEDC,EAAE,CAAE,QAAQ,EAAE,yBAA0B,CACjC,CAAC;AAEb"}
+{"version":3,"names":["__","_x","MenuItem","apiFetch","download","useDispatch","downloadBlob","store","noticesStore","SiteExport","createErrorNotice","handleExport","response","path","parse","headers","Accept","blob","contentDisposition","get","contentDispositionMatches","match","fileName","errorResponse","error","json","e","errorMessage","message","code","type","createElement","role","icon","onClick","info"],"sources":["@wordpress/edit-site/src/components/header-edit-mode/more-menu/site-export.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, _x } from '@wordpress/i18n';\nimport { MenuItem } from '@wordpress/components';\nimport apiFetch from '@wordpress/api-fetch';\nimport { download } from '@wordpress/icons';\nimport { useDispatch } from '@wordpress/data';\nimport { downloadBlob } from '@wordpress/blob';\nimport { store as noticesStore } from '@wordpress/notices';\n\nexport default function SiteExport() {\n\tconst { createErrorNotice } = useDispatch( noticesStore );\n\n\tasync function handleExport() {\n\t\ttry {\n\t\t\tconst response = await apiFetch( {\n\t\t\t\tpath: '/wp-block-editor/v1/export',\n\t\t\t\tparse: false,\n\t\t\t\theaders: {\n\t\t\t\t\tAccept: 'application/zip',\n\t\t\t\t},\n\t\t\t} );\n\t\t\tconst blob = await response.blob();\n\t\t\tconst contentDisposition = response.headers.get(\n\t\t\t\t'content-disposition'\n\t\t\t);\n\t\t\tconst contentDispositionMatches =\n\t\t\t\tcontentDisposition.match( /=(.+)\\.zip/ );\n\t\t\tconst fileName = contentDispositionMatches[ 1 ]\n\t\t\t\t? contentDispositionMatches[ 1 ]\n\t\t\t\t: 'edit-site-export';\n\n\t\t\tdownloadBlob( fileName + '.zip', blob, 'application/zip' );\n\t\t} catch ( errorResponse ) {\n\t\t\tlet error = {};\n\t\t\ttry {\n\t\t\t\terror = await errorResponse.json();\n\t\t\t} catch ( e ) {}\n\t\t\tconst errorMessage =\n\t\t\t\terror.message && error.code !== 'unknown_error'\n\t\t\t\t\t? error.message\n\t\t\t\t\t: __( 'An error occurred while creating the site export.' );\n\n\t\t\tcreateErrorNotice( errorMessage, { type: 'snackbar' } );\n\t\t}\n\t}\n\n\treturn (\n\t\t<MenuItem\n\t\t\trole=\"menuitem\"\n\t\t\ticon={ download }\n\t\t\tonClick={ handleExport }\n\t\t\tinfo={ __(\n\t\t\t\t'Download your theme with updated templates and styles.'\n\t\t\t) }\n\t\t>\n\t\t\t{ _x( 'Export', 'site exporter menu item' ) }\n\t\t</MenuItem>\n\t);\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,EAAE,EAAEC,EAAE,QAAQ,iBAAiB;AACxC,SAASC,QAAQ,QAAQ,uBAAuB;AAChD,OAAOC,QAAQ,MAAM,sBAAsB;AAC3C,SAASC,QAAQ,QAAQ,kBAAkB;AAC3C,SAASC,WAAW,QAAQ,iBAAiB;AAC7C,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,KAAK,IAAIC,YAAY,QAAQ,oBAAoB;AAE1D,eAAe,SAASC,UAAUA,CAAA,EAAG;EACpC,MAAM;IAAEC;EAAkB,CAAC,GAAGL,WAAW,CAAEG,YAAa,CAAC;EAEzD,eAAeG,YAAYA,CAAA,EAAG;IAC7B,IAAI;MACH,MAAMC,QAAQ,GAAG,MAAMT,QAAQ,CAAE;QAChCU,IAAI,EAAE,4BAA4B;QAClCC,KAAK,EAAE,KAAK;QACZC,OAAO,EAAE;UACRC,MAAM,EAAE;QACT;MACD,CAAE,CAAC;MACH,MAAMC,IAAI,GAAG,MAAML,QAAQ,CAACK,IAAI,CAAC,CAAC;MAClC,MAAMC,kBAAkB,GAAGN,QAAQ,CAACG,OAAO,CAACI,GAAG,CAC9C,qBACD,CAAC;MACD,MAAMC,yBAAyB,GAC9BF,kBAAkB,CAACG,KAAK,CAAE,YAAa,CAAC;MACzC,MAAMC,QAAQ,GAAGF,yBAAyB,CAAE,CAAC,CAAE,GAC5CA,yBAAyB,CAAE,CAAC,CAAE,GAC9B,kBAAkB;MAErBd,YAAY,CAAEgB,QAAQ,GAAG,MAAM,EAAEL,IAAI,EAAE,iBAAkB,CAAC;IAC3D,CAAC,CAAC,OAAQM,aAAa,EAAG;MACzB,IAAIC,KAAK,GAAG,CAAC,CAAC;MACd,IAAI;QACHA,KAAK,GAAG,MAAMD,aAAa,CAACE,IAAI,CAAC,CAAC;MACnC,CAAC,CAAC,OAAQC,CAAC,EAAG,CAAC;MACf,MAAMC,YAAY,GACjBH,KAAK,CAACI,OAAO,IAAIJ,KAAK,CAACK,IAAI,KAAK,eAAe,GAC5CL,KAAK,CAACI,OAAO,GACb5B,EAAE,CAAE,mDAAoD,CAAC;MAE7DU,iBAAiB,CAAEiB,YAAY,EAAE;QAAEG,IAAI,EAAE;MAAW,CAAE,CAAC;IACxD;EACD;EAEA,OACCC,aAAA,CAAC7B,QAAQ;IACR8B,IAAI,EAAC,UAAU;IACfC,IAAI,EAAG7B,QAAU;IACjB8B,OAAO,EAAGvB,YAAc;IACxBwB,IAAI,EAAGnC,EAAE,CACR,wDACD;EAAG,GAEDC,EAAE,CAAE,QAAQ,EAAE,yBAA0B,CACjC,CAAC;AAEb"}

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

@@ -11,7 +11,7 @@ import { useSelect } from '@wordpress/data';
 import { __unstableMotion as motion, __unstableAnimatePresence as AnimatePresence, __unstableUseNavigateRegions as useNavigateRegions } from '@wordpress/components';
 import { useReducedMotion, useViewportMatch, useResizeObserver } from '@wordpress/compose';
 import { __ } from '@wordpress/i18n';
-import { useState, useRef } from '@wordpress/element';
+import { useState } from '@wordpress/element';
 import { NavigableRegion } from '@wordpress/interface';
 import { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';
 import { CommandMenu, privateApis as commandsPrivateApis } from '@wordpress/commands';
@@ -62,7 +62,6 @@ export default function Layout() {
   useEditModeCommands();
   useCommonCommands();
   useBlockCommands();
-  const hubRef = useRef();
   const {
     params
   } = useLocation();
@@ -98,7 +97,7 @@ export default function Layout() {
     next: nextShortcut
   });
   const disableMotion = useReducedMotion();
-  const showSidebar = isMobileViewport && !isListPage || !isMobileViewport && (canvasMode === 'view' || !isEditorPage);
+  const showSidebar = isMobileViewport && canvasMode === 'view' && !isListPage || !isMobileViewport && (canvasMode === 'view' || !isEditorPage);
   const showCanvas = isMobileViewport && isEditorPage && isEditing || !isMobileViewport || !isEditorPage;
   const isFullCanvas = isMobileViewport && isListPage || isEditorPage && isEditing;
   const [canvasResizer, canvasSize] = useResizeObserver();
@@ -153,7 +152,8 @@ export default function Layout() {
       'is-distraction-free': isDistractionFree && isEditing,
       'is-full-canvas': isFullCanvas,
       'is-edit-mode': isEditing,
-      'has-fixed-toolbar': hasFixedToolbar
+      'has-fixed-toolbar': hasFixedToolbar,
+      'is-block-toolbar-visible': hasBlockSelected
     })
   }, createElement(motion.div, {
     className: "edit-site-layout__header-container",
@@ -186,21 +186,6 @@ export default function Layout() {
     whileHover: isDistractionFree ? 'isDistractionFreeHovering' : undefined,
     animate: headerAnimationState
   }, createElement(SiteHub, {
-    variants: {
-      isDistractionFree: {
-        x: '-100%'
-      },
-      isDistractionFreeHovering: {
-        x: 0
-      },
-      view: {
-        x: 0
-      },
-      edit: {
-        x: 0
-      }
-    },
-    ref: hubRef,
     isTransparent: isResizableFrameOversized,
     className: "edit-site-layout__hub"
   }), createElement(AnimatePresence, {
@@ -252,7 +237,7 @@ export default function Layout() {
     // (https://github.com/WordPress/gutenberg/pull/51558/files#r1231763003),
     // so we can't remove the element entirely. Using `inert` will make
     // it inaccessible to screen readers and keyboard navigation.
-    inert: showSidebar ? undefined : 'inert',
+    inert: showSidebar ? undefined : 'true',
     animate: {
       opacity: showSidebar ? 1 : 0
     },