npm - @wordpress/edit-site - Versions diffs - 5.31.0 → 5.32.0 - Mend

@wordpress/edit-site 5.31.0 → 5.32.0

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

Files changed (280) hide show

package/build-module/components/keyboard-shortcut-help-modal/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["classnames","Modal","__","useShortcut","store","keyboardShortcutsStore","interfaceStore","useSelect","useDispatch","textFormattingShortcuts","Shortcut","DynamicShortcut","KEYBOARD_SHORTCUT_HELP_MODAL_NAME","ShortcutList","shortcuts","createElement","className","role","map","shortcut","index","key","name","ShortcutSection","title","ShortcutCategorySection","categoryName","additionalShortcuts","categoryShortcuts","select","getCategoryShortcuts","concat","KeyboardShortcutHelpModal","isModalActive","closeModal","openModal","toggleModal","onRequestClose","keyCombination","character","description","ariaLabel"],"sources":["@wordpress/edit-site/src/components/keyboard-shortcut-help-modal/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Modal } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseShortcut,\n\tstore as keyboardShortcutsStore,\n} from '@wordpress/keyboard-shortcuts';\nimport { store as interfaceStore } from '@wordpress/interface';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/\n Internal dependencies\n /\nimport { textFormattingShortcuts } from './config';\nimport Shortcut from './shortcut';\nimport DynamicShortcut from './dynamic-shortcut';\n\nexport const KEYBOARD_SHORTCUT_HELP_MODAL_NAME =\n\t'edit-site/keyboard-shortcut-help';\n\nconst ShortcutList = ( { shortcuts } ) => (\n\t/\n\t * Disable reason: The `list` ARIA role is redundant but\n\t * Safari+VoiceOver won't announce the list otherwise.\n\t /\n\t/ eslint-disable jsx-a11y/no-redundant-roles /\n\t<ul\n\t\tclassName=\"edit-site-keyboard-shortcut-help-modal__shortcut-list\"\n\t\trole=\"list\"\n\t>\n\t\t{ shortcuts.map( ( shortcut, index ) => (\n\t\t\t<li\n\t\t\t\tclassName=\"edit-site-keyboard-shortcut-help-modal__shortcut\"\n\t\t\t\tkey={ index }\n\t\t\t>\n\t\t\t\t{ typeof shortcut === 'string' ? (\n\t\t\t\t\t<DynamicShortcut name={ shortcut } />\n\t\t\t\t) : (\n\t\t\t\t\t<Shortcut { ...shortcut } />\n\t\t\t\t) }\n\t\t\t</li>\n\t\t) ) }\n\t</ul>\n\t/ eslint-enable jsx-a11y/no-redundant-roles /\n);\n\nconst ShortcutSection = ( { title, shortcuts, className } ) => (\n\t<section\n\t\tclassName={ classnames(\n\t\t\t'edit-site-keyboard-shortcut-help-modal__section',\n\t\t\tclassName\n\t\t) }\n\t>\n\t\t{ !! title && (\n\t\t\t<h2 className=\"edit-site-keyboard-shortcut-help-modal__section-title\">\n\t\t\t\t{ title }\n\t\t\t</h2>\n\t\t) }\n\t\t<ShortcutList shortcuts={ shortcuts } />\n\t</section>\n);\n\nconst ShortcutCategorySection = ( {\n\ttitle,\n\tcategoryName,\n\tadditionalShortcuts = [],\n} ) => {\n\tconst categoryShortcuts = useSelect(\n\t\t( select ) => {\n\t\t\treturn select( keyboardShortcutsStore ).getCategoryShortcuts(\n\t\t\t\tcategoryName\n\t\t\t);\n\t\t},\n\t\t[ categoryName ]\n\t);\n\n\treturn (\n\t\t<ShortcutSection\n\t\t\ttitle={ title }\n\t\t\tshortcuts={ categoryShortcuts.concat( additionalShortcuts ) }\n\t\t/>\n\t);\n};\n\nexport default function KeyboardShortcutHelpModal() {\n\tconst isModalActive = useSelect( ( select ) =>\n\t\tselect( interfaceStore ).isModalActive(\n\t\t\tKEYBOARD_SHORTCUT_HELP_MODAL_NAME\n\t\t)\n\t);\n\tconst { closeModal, openModal } = useDispatch( interfaceStore );\n\tconst toggleModal = () =>\n\t\tisModalActive\n\t\t\t? closeModal()\n\t\t\t: openModal( KEYBOARD_SHORTCUT_HELP_MODAL_NAME );\n\tuseShortcut( 'core/edit-site/keyboard-shortcuts', toggleModal );\n\tif ( ! isModalActive ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<Modal\n\t\t\tclassName=\"edit-site-keyboard-shortcut-help-modal\"\n\t\t\ttitle={ __( 'Keyboard shortcuts' ) }\n\t\t\tonRequestClose={ toggleModal }\n\t\t>\n\t\t\t<ShortcutSection\n\t\t\t\tclassName=\"edit-site-keyboard-shortcut-help-modal__main-shortcuts\"\n\t\t\t\tshortcuts={ [ 'core/edit-site/keyboard-shortcuts' ] }\n\t\t\t/>\n\t\t\t<ShortcutCategorySection\n\t\t\t\ttitle={ __( 'Global shortcuts' ) }\n\t\t\t\tcategoryName=\"global\"\n\t\t\t/>\n\n\t\t\t<ShortcutCategorySection\n\t\t\t\ttitle={ __( 'Selection shortcuts' ) }\n\t\t\t\tcategoryName=\"selection\"\n\t\t\t/>\n\n\t\t\t<ShortcutCategorySection\n\t\t\t\ttitle={ __( 'Block shortcuts' ) }\n\t\t\t\tcategoryName=\"block\"\n\t\t\t\tadditionalShortcuts={ [\n\t\t\t\t\t{\n\t\t\t\t\t\tkeyCombination: { character: '/' },\n\t\t\t\t\t\tdescription: __(\n\t\t\t\t\t\t\t'Change the block type after adding a new paragraph.'\n\t\t\t\t\t\t),\n\t\t\t\t\t\t/ translators: The forward-slash character. e.g. '/'. */\n\t\t\t\t\t\tariaLabel: __( 'Forward-slash' ),\n\t\t\t\t\t},\n\t\t\t\t] }\n\t\t\t/>\n\t\t\t<ShortcutSection\n\t\t\t\ttitle={ __( 'Text formatting' ) }\n\t\t\t\tshortcuts={ textFormattingShortcuts }\n\t\t\t/>\n\t\t</Modal>\n\t);\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["classnames","Modal","__","useShortcut","store","keyboardShortcutsStore","interfaceStore","useSelect","useDispatch","textFormattingShortcuts","Shortcut","DynamicShortcut","KEYBOARD_SHORTCUT_HELP_MODAL_NAME","ShortcutList","shortcuts","createElement","className","role","map","shortcut","index","key","name","ShortcutSection","title","ShortcutCategorySection","categoryName","additionalShortcuts","categoryShortcuts","select","getCategoryShortcuts","concat","KeyboardShortcutHelpModal","isModalActive","closeModal","openModal","toggleModal","onRequestClose","keyCombination","character","description","ariaLabel"],"sources":["@wordpress/edit-site/src/components/keyboard-shortcut-help-modal/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { Modal } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseShortcut,\n\tstore as keyboardShortcutsStore,\n} from '@wordpress/keyboard-shortcuts';\nimport { store as interfaceStore } from '@wordpress/interface';\nimport { useSelect, useDispatch } from '@wordpress/data';\n\n/\n Internal dependencies\n /\nimport { textFormattingShortcuts } from './config';\nimport Shortcut from './shortcut';\nimport DynamicShortcut from './dynamic-shortcut';\n\nexport const KEYBOARD_SHORTCUT_HELP_MODAL_NAME =\n\t'edit-site/keyboard-shortcut-help';\n\nconst ShortcutList = ( { shortcuts } ) => (\n\t/\n\t * Disable reason: The `list` ARIA role is redundant but\n\t * Safari+VoiceOver won't announce the list otherwise.\n\t /\n\t/ eslint-disable jsx-a11y/no-redundant-roles /\n\t<ul\n\t\tclassName=\"edit-site-keyboard-shortcut-help-modal__shortcut-list\"\n\t\trole=\"list\"\n\t>\n\t\t{ shortcuts.map( ( shortcut, index ) => (\n\t\t\t<li\n\t\t\t\tclassName=\"edit-site-keyboard-shortcut-help-modal__shortcut\"\n\t\t\t\tkey={ index }\n\t\t\t>\n\t\t\t\t{ typeof shortcut === 'string' ? (\n\t\t\t\t\t<DynamicShortcut name={ shortcut } />\n\t\t\t\t) : (\n\t\t\t\t\t<Shortcut { ...shortcut } />\n\t\t\t\t) }\n\t\t\t</li>\n\t\t) ) }\n\t</ul>\n\t/ eslint-enable jsx-a11y/no-redundant-roles /\n);\n\nconst ShortcutSection = ( { title, shortcuts, className } ) => (\n\t<section\n\t\tclassName={ classnames(\n\t\t\t'edit-site-keyboard-shortcut-help-modal__section',\n\t\t\tclassName\n\t\t) }\n\t>\n\t\t{ !! title && (\n\t\t\t<h2 className=\"edit-site-keyboard-shortcut-help-modal__section-title\">\n\t\t\t\t{ title }\n\t\t\t</h2>\n\t\t) }\n\t\t<ShortcutList shortcuts={ shortcuts } />\n\t</section>\n);\n\nconst ShortcutCategorySection = ( {\n\ttitle,\n\tcategoryName,\n\tadditionalShortcuts = [],\n} ) => {\n\tconst categoryShortcuts = useSelect(\n\t\t( select ) => {\n\t\t\treturn select( keyboardShortcutsStore ).getCategoryShortcuts(\n\t\t\t\tcategoryName\n\t\t\t);\n\t\t},\n\t\t[ categoryName ]\n\t);\n\n\treturn (\n\t\t<ShortcutSection\n\t\t\ttitle={ title }\n\t\t\tshortcuts={ categoryShortcuts.concat( additionalShortcuts ) }\n\t\t/>\n\t);\n};\n\nexport default function KeyboardShortcutHelpModal() {\n\tconst isModalActive = useSelect( ( select ) =>\n\t\tselect( interfaceStore ).isModalActive(\n\t\t\tKEYBOARD_SHORTCUT_HELP_MODAL_NAME\n\t\t)\n\t);\n\tconst { closeModal, openModal } = useDispatch( interfaceStore );\n\tconst toggleModal = () =>\n\t\tisModalActive\n\t\t\t? closeModal()\n\t\t\t: openModal( KEYBOARD_SHORTCUT_HELP_MODAL_NAME );\n\tuseShortcut( 'core/edit-site/keyboard-shortcuts', toggleModal );\n\tif ( ! isModalActive ) {\n\t\treturn null;\n\t}\n\treturn (\n\t\t<Modal\n\t\t\tclassName=\"edit-site-keyboard-shortcut-help-modal\"\n\t\t\ttitle={ __( 'Keyboard shortcuts' ) }\n\t\t\tonRequestClose={ toggleModal }\n\t\t>\n\t\t\t<ShortcutSection\n\t\t\t\tclassName=\"edit-site-keyboard-shortcut-help-modal__main-shortcuts\"\n\t\t\t\tshortcuts={ [ 'core/edit-site/keyboard-shortcuts' ] }\n\t\t\t/>\n\t\t\t<ShortcutCategorySection\n\t\t\t\ttitle={ __( 'Global shortcuts' ) }\n\t\t\t\tcategoryName=\"global\"\n\t\t\t/>\n\n\t\t\t<ShortcutCategorySection\n\t\t\t\ttitle={ __( 'Selection shortcuts' ) }\n\t\t\t\tcategoryName=\"selection\"\n\t\t\t/>\n\n\t\t\t<ShortcutCategorySection\n\t\t\t\ttitle={ __( 'Block shortcuts' ) }\n\t\t\t\tcategoryName=\"block\"\n\t\t\t\tadditionalShortcuts={ [\n\t\t\t\t\t{\n\t\t\t\t\t\tkeyCombination: { character: '/' },\n\t\t\t\t\t\tdescription: __(\n\t\t\t\t\t\t\t'Change the block type after adding a new paragraph.'\n\t\t\t\t\t\t),\n\t\t\t\t\t\t/ translators: The forward-slash character. e.g. '/'. */\n\t\t\t\t\t\tariaLabel: __( 'Forward-slash' ),\n\t\t\t\t\t},\n\t\t\t\t] }\n\t\t\t/>\n\t\t\t<ShortcutSection\n\t\t\t\ttitle={ __( 'Text formatting' ) }\n\t\t\t\tshortcuts={ textFormattingShortcuts }\n\t\t\t/>\n\t\t\t<ShortcutCategorySection\n\t\t\t\ttitle={ __( 'List View shortcuts' ) }\n\t\t\t\tcategoryName=\"list-view\"\n\t\t\t/>\n\t\t</Modal>\n\t);\n}\n"],"mappings":"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"}

package/build-module/components/layout/animation.js ADDED Viewed

@@ -0,0 +1,122 @@
+/**
+ * External dependencies
+ */
+import { Controller } from '@react-spring/web';
+/**
+ * WordPress dependencies
+ */
+import { useLayoutEffect, useMemo, useRef } from '@wordpress/element';
+function getAbsolutePosition(element) {
+  return {
+    top: element.offsetTop,
+    left: element.offsetLeft
+  };
+}
+const ANIMATION_DURATION = 300;
+/**
+ * Hook used to compute the styles required to move a div into a new position.
+ *
+ * The way this animation works is the following:
+ *  - It first renders the element as if there was no animation.
+ *  - It takes a snapshot of the position of the block to use it
+ *    as a destination point for the animation.
+ *  - It restores the element to the previous position using a CSS transform
+ *  - It uses the "resetAnimation" flag to reset the animation
+ *    from the beginning in order to animate to the new destination point.
+ *
+ * @param {Object} $1                          Options
+ * @param {*}      $1.triggerAnimationOnChange Variable used to trigger the animation if it changes.
+ */
+function useMovingAnimation({
+  triggerAnimationOnChange
+}) {
+  const ref = useRef();
+  // Whenever the trigger changes, we need to take a snapshot of the current
+  // position of the block to use it as a destination point for the animation.
+  const {
+    previous,
+    prevRect
+  } = useMemo(() => ({
+    previous: ref.current && getAbsolutePosition(ref.current),
+    prevRect: ref.current && ref.current.getBoundingClientRect()
+  }),
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [triggerAnimationOnChange]);
+  useLayoutEffect(() => {
+    if (!previous || !ref.current) {
+      return;
+    }
+    // We disable the animation if the user has a preference for reduced
+    // motion.
+    const disableAnimation = window.matchMedia('(prefers-reduced-motion: reduce)').matches;
+    if (disableAnimation) {
+      return;
+    }
+    const controller = new Controller({
+      x: 0,
+      y: 0,
+      width: prevRect.width,
+      height: prevRect.height,
+      config: {
+        duration: ANIMATION_DURATION
+      },
+      onChange({
+        value
+      }) {
+        if (!ref.current) {
+          return;
+        }
+        let {
+          x,
+          y,
+          width,
+          height
+        } = value;
+        x = Math.round(x);
+        y = Math.round(y);
+        width = Math.round(width);
+        height = Math.round(height);
+        const finishedMoving = x === 0 && y === 0;
+        ref.current.style.transformOrigin = 'center center';
+        ref.current.style.transform = finishedMoving ? null // Set to `null` to explicitly remove the transform.
+        : `translate3d(${x}px,${y}px,0)`;
+        ref.current.style.width = finishedMoving ? null : `${width}px`;
+        ref.current.style.height = finishedMoving ? null : `${height}px`;
+      }
+    });
+    ref.current.style.transform = undefined;
+    const destination = ref.current.getBoundingClientRect();
+    const x = Math.round(prevRect.left - destination.left);
+    const y = Math.round(prevRect.top - destination.top);
+    const width = destination.width;
+    const height = destination.height;
+    controller.start({
+      x: 0,
+      y: 0,
+      width,
+      height,
+      from: {
+        x,
+        y,
+        width: prevRect.width,
+        height: prevRect.height
+      }
+    });
+    return () => {
+      controller.stop();
+      controller.set({
+        x: 0,
+        y: 0,
+        width: prevRect.width,
+        height: prevRect.height
+      });
+    };
+  }, [previous, prevRect]);
+  return ref;
+}
+export default useMovingAnimation;
+//# sourceMappingURL=animation.js.map

package/build-module/components/layout/animation.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["Controller","useLayoutEffect","useMemo","useRef","getAbsolutePosition","element","top","offsetTop","left","offsetLeft","ANIMATION_DURATION","useMovingAnimation","triggerAnimationOnChange","ref","previous","prevRect","current","getBoundingClientRect","disableAnimation","window","matchMedia","matches","controller","x","y","width","height","config","duration","onChange","value","Math","round","finishedMoving","style","transformOrigin","transform","undefined","destination","start","from","stop","set"],"sources":["@wordpress/edit-site/src/components/layout/animation.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport { Controller } from '@react-spring/web';\n\n/**\n * WordPress dependencies\n */\nimport { useLayoutEffect, useMemo, useRef } from '@wordpress/element';\n\nfunction getAbsolutePosition( element ) {\n\treturn {\n\t\ttop: element.offsetTop,\n\t\tleft: element.offsetLeft,\n\t};\n}\n\nconst ANIMATION_DURATION = 300;\n\n/**\n * Hook used to compute the styles required to move a div into a new position.\n *\n * The way this animation works is the following:\n * - It first renders the element as if there was no animation.\n * - It takes a snapshot of the position of the block to use it\n * as a destination point for the animation.\n * - It restores the element to the previous position using a CSS transform\n * - It uses the \"resetAnimation\" flag to reset the animation\n * from the beginning in order to animate to the new destination point.\n *\n * @param {Object} $1 Options\n * @param {*} $1.triggerAnimationOnChange Variable used to trigger the animation if it changes.\n */\nfunction useMovingAnimation( { triggerAnimationOnChange } ) {\n\tconst ref = useRef();\n\n\t// Whenever the trigger changes, we need to take a snapshot of the current\n\t// position of the block to use it as a destination point for the animation.\n\tconst { previous, prevRect } = useMemo(\n\t\t() => ( {\n\t\t\tprevious: ref.current && getAbsolutePosition( ref.current ),\n\t\t\tprevRect: ref.current && ref.current.getBoundingClientRect(),\n\t\t} ),\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\n\t\t[ triggerAnimationOnChange ]\n\t);\n\n\tuseLayoutEffect( () => {\n\t\tif ( ! previous || ! ref.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We disable the animation if the user has a preference for reduced\n\t\t// motion.\n\t\tconst disableAnimation = window.matchMedia(\n\t\t\t'(prefers-reduced-motion: reduce)'\n\t\t).matches;\n\n\t\tif ( disableAnimation ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst controller = new Controller( {\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t\twidth: prevRect.width,\n\t\t\theight: prevRect.height,\n\t\t\tconfig: { duration: ANIMATION_DURATION },\n\t\t\tonChange( { value } ) {\n\t\t\t\tif ( ! ref.current ) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\t\t\t\tlet { x, y, width, height } = value;\n\t\t\t\tx = Math.round( x );\n\t\t\t\ty = Math.round( y );\n\t\t\t\twidth = Math.round( width );\n\t\t\t\theight = Math.round( height );\n\t\t\t\tconst finishedMoving = x === 0 && y === 0;\n\t\t\t\tref.current.style.transformOrigin = 'center center';\n\t\t\t\tref.current.style.transform = finishedMoving\n\t\t\t\t\t? null // Set to `null` to explicitly remove the transform.\n\t\t\t\t\t: `translate3d(${ x }px,${ y }px,0)`;\n\t\t\t\tref.current.style.width = finishedMoving\n\t\t\t\t\t? null\n\t\t\t\t\t: `${ width }px`;\n\t\t\t\tref.current.style.height = finishedMoving\n\t\t\t\t\t? null\n\t\t\t\t\t: `${ height }px`;\n\t\t\t},\n\t\t} );\n\n\t\tref.current.style.transform = undefined;\n\t\tconst destination = ref.current.getBoundingClientRect();\n\n\t\tconst x = Math.round( prevRect.left - destination.left );\n\t\tconst y = Math.round( prevRect.top - destination.top );\n\t\tconst width = destination.width;\n\t\tconst height = destination.height;\n\n\t\tcontroller.start( {\n\t\t\tx: 0,\n\t\t\ty: 0,\n\t\t\twidth,\n\t\t\theight,\n\t\t\tfrom: { x, y, width: prevRect.width, height: prevRect.height },\n\t\t} );\n\n\t\treturn () => {\n\t\t\tcontroller.stop();\n\t\t\tcontroller.set( {\n\t\t\t\tx: 0,\n\t\t\t\ty: 0,\n\t\t\t\twidth: prevRect.width,\n\t\t\t\theight: prevRect.height,\n\t\t\t} );\n\t\t};\n\t}, [ previous, prevRect ] );\n\n\treturn ref;\n}\n\nexport default useMovingAnimation;\n"],"mappings":"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"}

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

@@ -38,6 +38,7 @@ import { useCommonCommands } from '../../hooks/commands/use-common-commands';
 import { useEditModeCommands } from '../../hooks/commands/use-edit-mode-commands';
 import { useIsSiteEditorLoading } from './hooks';
 import useLayoutAreas from './router';
+import useMovingAnimation from './animation';
 const {
   useCommands
 } = unlock(coreCommandsPrivateApis);
@@ -47,7 +48,7 @@ const {
 const {
   useGlobalStyle
 } = unlock(blockEditorPrivateApis);
-const ANIMATION_DURATION = 0.5;
+const ANIMATION_DURATION = 0.3;
 export default function Layout() {
   // This ensures the edited entity id and type are initialized properly.
   useInitEditedEntityFromURL();
@@ -91,9 +92,13 @@ export default function Layout() {
   const isEditorLoading = useIsSiteEditorLoading();
   const [isResizableFrameOversized, setIsResizableFrameOversized] = useState(false);
   const {
+    key: routeKey,
     areas,
     widths
   } = useLayoutAreas();
+  const animationRef = useMovingAnimation({
+    triggerAnimationOnChange: canvasMode + '__' + routeKey
+  });
   // This determines which animation variant should apply to the header.
   // There is also a `isDistractionFreeHovering` state that gets priority
@@ -208,7 +213,7 @@ export default function Layout() {
     },
     transition: {
       type: 'tween',
-      duration: disableMotion ? 0 : 0.2,
+      duration: disableMotion ? 0 : ANIMATION_DURATION,
       ease: 'easeOut'
     }
   }, createElement(Header, null)))), createElement("div", {
@@ -246,24 +251,11 @@ export default function Layout() {
     }
   }, areas.content), !isMobileViewport && areas.preview && createElement("div", {
     className: "edit-site-layout__canvas-container"
-  }, canvasResizer, !!canvasSize.width && createElement(motion.div, {
-    whileHover: canvasMode === 'view' ? {
-      scale: 1.005,
-      transition: {
-        duration: disableMotion ? 0 : 0.5,
-        ease: 'easeOut'
-      }
-    } : {},
-    initial: false,
-    layout: "position",
+  }, canvasResizer, !!canvasSize.width && createElement("div", {
     className: classnames('edit-site-layout__canvas', {
       'is-right-aligned': isResizableFrameOversized
     }),
-    transition: {
-      type: 'tween',
-      duration: disableMotion ? 0 : ANIMATION_DURATION,
-      ease: 'easeOut'
-    }
+    ref: animationRef
   }, createElement(ErrorBoundary, null, createElement(ResizableFrame, {
     isReady: !isEditorLoading,
     isFullWidth: canvasMode === 'edit',

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

	@@ -1 +1 @@
1	- {"version":3,"names":["classnames","useSelect","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","__unstableUseNavigateRegions","useNavigateRegions","useReducedMotion","useViewportMatch","useResizeObserver","__","useState","NavigableRegion","store","keyboardShortcutsStore","CommandMenu","privateApis","commandsPrivateApis","preferencesStore","blockEditorPrivateApis","blockEditorStore","coreCommandsPrivateApis","Sidebar","ErrorBoundary","editSiteStore","Header","useInitEditedEntityFromURL","SiteHub","ResizableFrame","useSyncCanvasModeWithURL","unlock","SavePanel","KeyboardShortcutsRegister","KeyboardShortcutsGlobal","useCommonCommands","useEditModeCommands","useIsSiteEditorLoading","useLayoutAreas","useCommands","useCommandContext","useGlobalStyle","ANIMATION_DURATION","Layout","isMobileViewport","isDistractionFree","isZoomOutMode","hasFixedToolbar","hasBlockSelected","canvasMode","previousShortcut","nextShortcut","select","getAllShortcutKeyCombinations","getCanvasMode","get","__unstableGetEditorMode","getBlockSelectionStart","navigateRegionsProps","previous","next","disableMotion","canvasResizer","canvasSize","fullResizer","isEditorLoading","isResizableFrameOversized","setIsResizableFrameOversized","areas","widths","headerAnimationState","commandContext","backgroundColor","gradientValue","createElement","Fragment","ref","className","div","variants","opacity","transition","type","delay","delayChildren","isDistractionFreeHovering","view","edit","whileHover","undefined","animate","isTransparent","initial","key","ariaLabel","as","y","exit","duration","ease","mobile","style","maxWidth","content","preview","width","scale","layout","isReady","isFullWidth","defaultSize","height","isOversized","setIsOversized","innerContentStyle","background"],"sources":["@wordpress/edit-site/src/components/layout/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { NavigableRegion } from '@wordpress/interface';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\nimport {\n\tCommandMenu,\n\tprivateApis as commandsPrivateApis,\n} from '@wordpress/commands';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { privateApis as coreCommandsPrivateApis } from '@wordpress/core-commands';\n\n/\n Internal dependencies\n /\nimport Sidebar from '../sidebar';\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport Header from '../header-edit-mode';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\nimport SiteHub from '../site-hub';\nimport ResizableFrame from '../resizable-frame';\nimport useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url';\nimport { unlock } from '../../lock-unlock';\nimport SavePanel from '../save-panel';\nimport KeyboardShortcutsRegister from '../keyboard-shortcuts/register';\nimport KeyboardShortcutsGlobal from '../keyboard-shortcuts/global';\nimport { useCommonCommands } from '../../hooks/commands/use-common-commands';\nimport { useEditModeCommands } from '../../hooks/commands/use-edit-mode-commands';\nimport { useIsSiteEditorLoading } from './hooks';\nimport useLayoutAreas from './router';\n\nconst { useCommands } = unlock( coreCommandsPrivateApis );\nconst { useCommandContext } = unlock( commandsPrivateApis );\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nconst ANIMATION_DURATION = 0.5;\n\nexport default function Layout() {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\tuseSyncCanvasModeWithURL();\n\tuseCommands();\n\tuseEditModeCommands();\n\tuseCommonCommands();\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\n\tconst {\n\t\tisDistractionFree,\n\t\tisZoomOutMode,\n\t\thasFixedToolbar,\n\t\thasBlockSelected,\n\t\tcanvasMode,\n\t\tpreviousShortcut,\n\t\tnextShortcut,\n\t} = useSelect( ( select ) => {\n\t\tconst { getAllShortcutKeyCombinations } = select(\n\t\t\tkeyboardShortcutsStore\n\t\t);\n\t\tconst { getCanvasMode } = unlock( select( editSiteStore ) );\n\t\treturn {\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tpreviousShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/edit-site/previous-region'\n\t\t\t),\n\t\t\tnextShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/edit-site/next-region'\n\t\t\t),\n\t\t\thasFixedToolbar: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'fixedToolbar'\n\t\t\t),\n\t\t\tisDistractionFree: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'distractionFree'\n\t\t\t),\n\t\t\tisZoomOutMode:\n\t\t\t\tselect( blockEditorStore ).__unstableGetEditorMode() ===\n\t\t\t\t'zoom-out',\n\t\t\thasBlockSelected:\n\t\t\t\tselect( blockEditorStore ).getBlockSelectionStart(),\n\t\t};\n\t}, [] );\n\tconst navigateRegionsProps = useNavigateRegions( {\n\t\tprevious: previousShortcut,\n\t\tnext: nextShortcut,\n\t} );\n\tconst disableMotion = useReducedMotion();\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer ] = useResizeObserver();\n\tconst isEditorLoading = useIsSiteEditorLoading();\n\tconst [ isResizableFrameOversized, setIsResizableFrameOversized ] =\n\t\tuseState( false );\n\tconst { areas, widths } = useLayoutAreas();\n\n\t// This determines which animation variant should apply to the header.\n\t// There is also a `isDistractionFreeHovering` state that gets priority\n\t// when hovering the `edit-site-layout__header-container` in distraction\n\t// free mode. It's set via framer and trickles down to all the children\n\t// so they can use this variant state too.\n\t//\n\t// TODO: The issue with this is we want to have the hover state stick when hovering\n\t// a popover opened via the header. We'll probably need to lift this state to\n\t// handle it ourselves. Also, focusWithin the header needs to be handled.\n\tlet headerAnimationState;\n\n\tif ( canvasMode === 'view' ) {\n\t\t// We need 'view' to always take priority so 'isDistractionFree'\n\t\t// doesn't bleed over into the view (sidebar) state\n\t\theaderAnimationState = 'view';\n\t} else if ( isDistractionFree ) {\n\t\theaderAnimationState = 'isDistractionFree';\n\t} else {\n\t\theaderAnimationState = canvasMode; // edit, view, init\n\t}\n\n\t// Sets the right context for the command palette\n\tlet commandContext = 'site-editor';\n\n\tif ( canvasMode === 'edit' ) {\n\t\tcommandContext = 'site-editor-edit';\n\t}\n\tif ( hasBlockSelected ) {\n\t\tcommandContext = 'block-selection-edit';\n\t}\n\tuseCommandContext( commandContext );\n\n\tconst [ backgroundColor ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\n\t// Synchronizing the URL with the store value of canvasMode happens in an effect\n\t// This condition ensures the component is only rendered after the synchronization happens\n\t// which prevents any animations due to potential canvasMode value change.\n\tif ( canvasMode === 'init' ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<CommandMenu />\n\t\t\t<KeyboardShortcutsRegister />\n\t\t\t<KeyboardShortcutsGlobal />\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-distraction-free':\n\t\t\t\t\t\t\tisDistractionFree && canvasMode === 'edit',\n\t\t\t\t\t\t'is-full-canvas': canvasMode === 'edit',\n\t\t\t\t\t\t'has-fixed-toolbar': hasFixedToolbar,\n\t\t\t\t\t\t'is-block-toolbar-visible': hasBlockSelected,\n\t\t\t\t\t\t'is-zoom-out': isZoomOutMode,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-layout__header-container\"\n\t\t\t\t\tvariants={ {\n\t\t\t\t\t\tisDistractionFree: {\n\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\tdelay: 0.8,\n\t\t\t\t\t\t\t\tdelayChildren: 0.8,\n\t\t\t\t\t\t\t}, // How long to wait before the header exits\n\t\t\t\t\t\t},\n\t\t\t\t\t\tisDistractionFreeHovering: {\n\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\tdelay: 0.2,\n\t\t\t\t\t\t\t\tdelayChildren: 0.2,\n\t\t\t\t\t\t\t}, // How long to wait before the header shows\n\t\t\t\t\t\t},\n\t\t\t\t\t\tview: { opacity: 1 },\n\t\t\t\t\t\tedit: { opacity: 1 },\n\t\t\t\t\t} }\n\t\t\t\t\twhileHover={\n\t\t\t\t\t\tisDistractionFree\n\t\t\t\t\t\t\t? 'isDistractionFreeHovering'\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tanimate={ headerAnimationState }\n\t\t\t\t>\n\t\t\t\t\t<SiteHub\n\t\t\t\t\t\tisTransparent={ isResizableFrameOversized }\n\t\t\t\t\t\tclassName=\"edit-site-layout__hub\"\n\t\t\t\t\t/>\n\n\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t{ canvasMode === 'edit' && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tkey=\"header\"\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__header\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Editor top bar' ) }\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\t\t\tisDistractionFree: { opacity: 0, y: 0 },\n\t\t\t\t\t\t\t\t\tisDistractionFreeHovering: {\n\t\t\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\t\t\ty: 0,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\tview: { opacity: 1, y: '-100%' },\n\t\t\t\t\t\t\t\t\tedit: { opacity: 1, y: 0 },\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\topacity: isDistractionFree ? 1 : 0,\n\t\t\t\t\t\t\t\t\ty: isDistractionFree ? 0 : '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion ? 0 : 0.2,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Header />\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\t\t\t\t</motion.div>\n\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t{ /\n\t\t\t\t\t\tThe NavigableRegion must always be rendered and not use\n\t\t\t\t\t\t`inert` otherwise `useNavigateRegions` will fail.\n\t\t\t\t\t/ }\n\t\t\t\t\t{ ( ! isMobileViewport \|\|\n\t\t\t\t\t\t( isMobileViewport && ! areas.mobile ) ) && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tariaLabel={ __( 'Navigation' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar-region\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tinitial={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\tanimate={ { opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\texit={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\t\t// Disable transition in mobile to emulate a full page transition.\n\t\t\t\t\t\t\t\t\t\t\t\tdisableMotion \|\|\n\t\t\t\t\t\t\t\t\t\t\t\tisMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Sidebar />\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<SavePanel />\n\n\t\t\t\t\t{ isMobileViewport && areas.mobile && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__mobile\"\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ areas.mobile }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport &&\n\t\t\t\t\t\tareas.content &&\n\t\t\t\t\t\tcanvasMode !== 'edit' && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\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{ areas.content }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.preview && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__canvas-container\">\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\twhileHover={\n\t\t\t\t\t\t\t\t\t\tcanvasMode === 'view'\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\tscale: 1.005,\n\t\t\t\t\t\t\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t: 0.5,\n\t\t\t\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\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\t: {}\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tinitial={ false }\n\t\t\t\t\t\t\t\t\tlayout=\"position\"\n\t\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t\t'edit-site-layout__canvas',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-right-aligned':\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized,\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\ttransition={ {\n\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\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\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t<ResizableFrame\n\t\t\t\t\t\t\t\t\t\t\tisReady={ ! isEditorLoading }\n\t\t\t\t\t\t\t\t\t\t\tisFullWidth={\n\t\t\t\t\t\t\t\t\t\t\t\tcanvasMode === 'edit'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tdefaultSize={ {\n\t\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\t\tcanvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t\t24 / $canvas-padding */,\n\t\t\t\t\t\t\t\t\t\t\t\theight: canvasSize.height,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\tisOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tsetIsOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tsetIsResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tinnerContentStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\tbackground:\n\t\t\t\t\t\t\t\t\t\t\t\t\tgradientValue ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor,\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\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t</ResizableFrame>\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
1	+ {"version":3,"names":["classnames","useSelect","__unstableMotion","motion","__unstableAnimatePresence","AnimatePresence","__unstableUseNavigateRegions","useNavigateRegions","useReducedMotion","useViewportMatch","useResizeObserver","__","useState","NavigableRegion","store","keyboardShortcutsStore","CommandMenu","privateApis","commandsPrivateApis","preferencesStore","blockEditorPrivateApis","blockEditorStore","coreCommandsPrivateApis","Sidebar","ErrorBoundary","editSiteStore","Header","useInitEditedEntityFromURL","SiteHub","ResizableFrame","useSyncCanvasModeWithURL","unlock","SavePanel","KeyboardShortcutsRegister","KeyboardShortcutsGlobal","useCommonCommands","useEditModeCommands","useIsSiteEditorLoading","useLayoutAreas","useMovingAnimation","useCommands","useCommandContext","useGlobalStyle","ANIMATION_DURATION","Layout","isMobileViewport","isDistractionFree","isZoomOutMode","hasFixedToolbar","hasBlockSelected","canvasMode","previousShortcut","nextShortcut","select","getAllShortcutKeyCombinations","getCanvasMode","get","__unstableGetEditorMode","getBlockSelectionStart","navigateRegionsProps","previous","next","disableMotion","canvasResizer","canvasSize","fullResizer","isEditorLoading","isResizableFrameOversized","setIsResizableFrameOversized","key","routeKey","areas","widths","animationRef","triggerAnimationOnChange","headerAnimationState","commandContext","backgroundColor","gradientValue","createElement","Fragment","ref","className","div","variants","opacity","transition","type","delay","delayChildren","isDistractionFreeHovering","view","edit","whileHover","undefined","animate","isTransparent","initial","ariaLabel","as","y","exit","duration","ease","mobile","style","maxWidth","content","preview","width","isReady","isFullWidth","defaultSize","height","isOversized","setIsOversized","innerContentStyle","background"],"sources":["@wordpress/edit-site/src/components/layout/index.js"],"sourcesContent":["/*\n External dependencies\n /\nimport classnames from 'classnames';\n\n/\n WordPress dependencies\n /\nimport { useSelect } from '@wordpress/data';\nimport {\n\t__unstableMotion as motion,\n\t__unstableAnimatePresence as AnimatePresence,\n\t__unstableUseNavigateRegions as useNavigateRegions,\n} from '@wordpress/components';\nimport {\n\tuseReducedMotion,\n\tuseViewportMatch,\n\tuseResizeObserver,\n} from '@wordpress/compose';\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { NavigableRegion } from '@wordpress/interface';\nimport { store as keyboardShortcutsStore } from '@wordpress/keyboard-shortcuts';\nimport {\n\tCommandMenu,\n\tprivateApis as commandsPrivateApis,\n} from '@wordpress/commands';\nimport { store as preferencesStore } from '@wordpress/preferences';\nimport {\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n} from '@wordpress/block-editor';\nimport { privateApis as coreCommandsPrivateApis } from '@wordpress/core-commands';\n\n/\n Internal dependencies\n /\nimport Sidebar from '../sidebar';\nimport ErrorBoundary from '../error-boundary';\nimport { store as editSiteStore } from '../../store';\nimport Header from '../header-edit-mode';\nimport useInitEditedEntityFromURL from '../sync-state-with-url/use-init-edited-entity-from-url';\nimport SiteHub from '../site-hub';\nimport ResizableFrame from '../resizable-frame';\nimport useSyncCanvasModeWithURL from '../sync-state-with-url/use-sync-canvas-mode-with-url';\nimport { unlock } from '../../lock-unlock';\nimport SavePanel from '../save-panel';\nimport KeyboardShortcutsRegister from '../keyboard-shortcuts/register';\nimport KeyboardShortcutsGlobal from '../keyboard-shortcuts/global';\nimport { useCommonCommands } from '../../hooks/commands/use-common-commands';\nimport { useEditModeCommands } from '../../hooks/commands/use-edit-mode-commands';\nimport { useIsSiteEditorLoading } from './hooks';\nimport useLayoutAreas from './router';\nimport useMovingAnimation from './animation';\n\nconst { useCommands } = unlock( coreCommandsPrivateApis );\nconst { useCommandContext } = unlock( commandsPrivateApis );\nconst { useGlobalStyle } = unlock( blockEditorPrivateApis );\n\nconst ANIMATION_DURATION = 0.3;\n\nexport default function Layout() {\n\t// This ensures the edited entity id and type are initialized properly.\n\tuseInitEditedEntityFromURL();\n\tuseSyncCanvasModeWithURL();\n\tuseCommands();\n\tuseEditModeCommands();\n\tuseCommonCommands();\n\n\tconst isMobileViewport = useViewportMatch( 'medium', '<' );\n\n\tconst {\n\t\tisDistractionFree,\n\t\tisZoomOutMode,\n\t\thasFixedToolbar,\n\t\thasBlockSelected,\n\t\tcanvasMode,\n\t\tpreviousShortcut,\n\t\tnextShortcut,\n\t} = useSelect( ( select ) => {\n\t\tconst { getAllShortcutKeyCombinations } = select(\n\t\t\tkeyboardShortcutsStore\n\t\t);\n\t\tconst { getCanvasMode } = unlock( select( editSiteStore ) );\n\t\treturn {\n\t\t\tcanvasMode: getCanvasMode(),\n\t\t\tpreviousShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/edit-site/previous-region'\n\t\t\t),\n\t\t\tnextShortcut: getAllShortcutKeyCombinations(\n\t\t\t\t'core/edit-site/next-region'\n\t\t\t),\n\t\t\thasFixedToolbar: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'fixedToolbar'\n\t\t\t),\n\t\t\tisDistractionFree: select( preferencesStore ).get(\n\t\t\t\t'core',\n\t\t\t\t'distractionFree'\n\t\t\t),\n\t\t\tisZoomOutMode:\n\t\t\t\tselect( blockEditorStore ).__unstableGetEditorMode() ===\n\t\t\t\t'zoom-out',\n\t\t\thasBlockSelected:\n\t\t\t\tselect( blockEditorStore ).getBlockSelectionStart(),\n\t\t};\n\t}, [] );\n\tconst navigateRegionsProps = useNavigateRegions( {\n\t\tprevious: previousShortcut,\n\t\tnext: nextShortcut,\n\t} );\n\tconst disableMotion = useReducedMotion();\n\tconst [ canvasResizer, canvasSize ] = useResizeObserver();\n\tconst [ fullResizer ] = useResizeObserver();\n\tconst isEditorLoading = useIsSiteEditorLoading();\n\tconst [ isResizableFrameOversized, setIsResizableFrameOversized ] =\n\t\tuseState( false );\n\tconst { key: routeKey, areas, widths } = useLayoutAreas();\n\tconst animationRef = useMovingAnimation( {\n\t\ttriggerAnimationOnChange: canvasMode + '__' + routeKey,\n\t} );\n\n\t// This determines which animation variant should apply to the header.\n\t// There is also a `isDistractionFreeHovering` state that gets priority\n\t// when hovering the `edit-site-layout__header-container` in distraction\n\t// free mode. It's set via framer and trickles down to all the children\n\t// so they can use this variant state too.\n\t//\n\t// TODO: The issue with this is we want to have the hover state stick when hovering\n\t// a popover opened via the header. We'll probably need to lift this state to\n\t// handle it ourselves. Also, focusWithin the header needs to be handled.\n\tlet headerAnimationState;\n\n\tif ( canvasMode === 'view' ) {\n\t\t// We need 'view' to always take priority so 'isDistractionFree'\n\t\t// doesn't bleed over into the view (sidebar) state\n\t\theaderAnimationState = 'view';\n\t} else if ( isDistractionFree ) {\n\t\theaderAnimationState = 'isDistractionFree';\n\t} else {\n\t\theaderAnimationState = canvasMode; // edit, view, init\n\t}\n\n\t// Sets the right context for the command palette\n\tlet commandContext = 'site-editor';\n\n\tif ( canvasMode === 'edit' ) {\n\t\tcommandContext = 'site-editor-edit';\n\t}\n\tif ( hasBlockSelected ) {\n\t\tcommandContext = 'block-selection-edit';\n\t}\n\tuseCommandContext( commandContext );\n\n\tconst [ backgroundColor ] = useGlobalStyle( 'color.background' );\n\tconst [ gradientValue ] = useGlobalStyle( 'color.gradient' );\n\n\t// Synchronizing the URL with the store value of canvasMode happens in an effect\n\t// This condition ensures the component is only rendered after the synchronization happens\n\t// which prevents any animations due to potential canvasMode value change.\n\tif ( canvasMode === 'init' ) {\n\t\treturn null;\n\t}\n\n\treturn (\n\t\t<>\n\t\t\t<CommandMenu />\n\t\t\t<KeyboardShortcutsRegister />\n\t\t\t<KeyboardShortcutsGlobal />\n\t\t\t{ fullResizer }\n\t\t\t<div\n\t\t\t\t{ ...navigateRegionsProps }\n\t\t\t\tref={ navigateRegionsProps.ref }\n\t\t\t\tclassName={ classnames(\n\t\t\t\t\t'edit-site-layout',\n\t\t\t\t\tnavigateRegionsProps.className,\n\t\t\t\t\t{\n\t\t\t\t\t\t'is-distraction-free':\n\t\t\t\t\t\t\tisDistractionFree && canvasMode === 'edit',\n\t\t\t\t\t\t'is-full-canvas': canvasMode === 'edit',\n\t\t\t\t\t\t'has-fixed-toolbar': hasFixedToolbar,\n\t\t\t\t\t\t'is-block-toolbar-visible': hasBlockSelected,\n\t\t\t\t\t\t'is-zoom-out': isZoomOutMode,\n\t\t\t\t\t}\n\t\t\t\t) }\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tclassName=\"edit-site-layout__header-container\"\n\t\t\t\t\tvariants={ {\n\t\t\t\t\t\tisDistractionFree: {\n\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\tdelay: 0.8,\n\t\t\t\t\t\t\t\tdelayChildren: 0.8,\n\t\t\t\t\t\t\t}, // How long to wait before the header exits\n\t\t\t\t\t\t},\n\t\t\t\t\t\tisDistractionFreeHovering: {\n\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\ttransition: {\n\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\tdelay: 0.2,\n\t\t\t\t\t\t\t\tdelayChildren: 0.2,\n\t\t\t\t\t\t\t}, // How long to wait before the header shows\n\t\t\t\t\t\t},\n\t\t\t\t\t\tview: { opacity: 1 },\n\t\t\t\t\t\tedit: { opacity: 1 },\n\t\t\t\t\t} }\n\t\t\t\t\twhileHover={\n\t\t\t\t\t\tisDistractionFree\n\t\t\t\t\t\t\t? 'isDistractionFreeHovering'\n\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t}\n\t\t\t\t\tanimate={ headerAnimationState }\n\t\t\t\t>\n\t\t\t\t\t<SiteHub\n\t\t\t\t\t\tisTransparent={ isResizableFrameOversized }\n\t\t\t\t\t\tclassName=\"edit-site-layout__hub\"\n\t\t\t\t\t/>\n\n\t\t\t\t\t<AnimatePresence initial={ false }>\n\t\t\t\t\t\t{ canvasMode === 'edit' && (\n\t\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\t\tkey=\"header\"\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__header\"\n\t\t\t\t\t\t\t\tariaLabel={ __( 'Editor top bar' ) }\n\t\t\t\t\t\t\t\tas={ motion.div }\n\t\t\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\t\t\tisDistractionFree: { opacity: 0, y: 0 },\n\t\t\t\t\t\t\t\t\tisDistractionFreeHovering: {\n\t\t\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\t\t\ty: 0,\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\tview: { opacity: 1, y: '-100%' },\n\t\t\t\t\t\t\t\t\tedit: { opacity: 1, y: 0 },\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\t\ty: '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\t\topacity: isDistractionFree ? 1 : 0,\n\t\t\t\t\t\t\t\t\ty: isDistractionFree ? 0 : '-100%',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\tduration: disableMotion\n\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<Header />\n\t\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t\t) }\n\t\t\t\t\t</AnimatePresence>\n\t\t\t\t</motion.div>\n\n\t\t\t\t<div className=\"edit-site-layout__content\">\n\t\t\t\t\t{ /\n\t\t\t\t\t\tThe NavigableRegion must always be rendered and not use\n\t\t\t\t\t\t`inert` otherwise `useNavigateRegions` will fail.\n\t\t\t\t\t/ }\n\t\t\t\t\t{ ( ! isMobileViewport \|\|\n\t\t\t\t\t\t( isMobileViewport && ! areas.mobile ) ) && (\n\t\t\t\t\t\t<NavigableRegion\n\t\t\t\t\t\t\tariaLabel={ __( 'Navigation' ) }\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar-region\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<AnimatePresence>\n\t\t\t\t\t\t\t\t{ canvasMode === 'view' && (\n\t\t\t\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\t\t\t\tinitial={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\tanimate={ { opacity: 1 } }\n\t\t\t\t\t\t\t\t\t\texit={ { opacity: 0 } }\n\t\t\t\t\t\t\t\t\t\ttransition={ {\n\t\t\t\t\t\t\t\t\t\t\ttype: 'tween',\n\t\t\t\t\t\t\t\t\t\t\tduration:\n\t\t\t\t\t\t\t\t\t\t\t\t// Disable transition in mobile to emulate a full page transition.\n\t\t\t\t\t\t\t\t\t\t\t\tdisableMotion \|\|\n\t\t\t\t\t\t\t\t\t\t\t\tisMobileViewport\n\t\t\t\t\t\t\t\t\t\t\t\t\t? 0\n\t\t\t\t\t\t\t\t\t\t\t\t\t: ANIMATION_DURATION,\n\t\t\t\t\t\t\t\t\t\t\tease: 'easeOut',\n\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__sidebar\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t<Sidebar />\n\t\t\t\t\t\t\t\t\t</motion.div>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</AnimatePresence>\n\t\t\t\t\t\t</NavigableRegion>\n\t\t\t\t\t) }\n\n\t\t\t\t\t<SavePanel />\n\n\t\t\t\t\t{ isMobileViewport && areas.mobile && (\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName=\"edit-site-layout__mobile\"\n\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ areas.mobile }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport &&\n\t\t\t\t\t\tareas.content &&\n\t\t\t\t\t\tcanvasMode !== 'edit' && (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName=\"edit-site-layout__area\"\n\t\t\t\t\t\t\t\tstyle={ {\n\t\t\t\t\t\t\t\t\tmaxWidth: widths?.content,\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{ areas.content }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) }\n\n\t\t\t\t\t{ ! isMobileViewport && areas.preview && (\n\t\t\t\t\t\t<div className=\"edit-site-layout__canvas-container\">\n\t\t\t\t\t\t\t{ canvasResizer }\n\t\t\t\t\t\t\t{ !! canvasSize.width && (\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t\t\t\t'edit-site-layout__canvas',\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-right-aligned':\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized,\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\tref={ animationRef }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<ErrorBoundary>\n\t\t\t\t\t\t\t\t\t\t<ResizableFrame\n\t\t\t\t\t\t\t\t\t\t\tisReady={ ! isEditorLoading }\n\t\t\t\t\t\t\t\t\t\t\tisFullWidth={\n\t\t\t\t\t\t\t\t\t\t\t\tcanvasMode === 'edit'\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tdefaultSize={ {\n\t\t\t\t\t\t\t\t\t\t\t\twidth:\n\t\t\t\t\t\t\t\t\t\t\t\t\tcanvasSize.width -\n\t\t\t\t\t\t\t\t\t\t\t\t\t24 / $canvas-padding */,\n\t\t\t\t\t\t\t\t\t\t\t\theight: canvasSize.height,\n\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\tisOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tisResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tsetIsOversized={\n\t\t\t\t\t\t\t\t\t\t\t\tsetIsResizableFrameOversized\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t\tinnerContentStyle={ {\n\t\t\t\t\t\t\t\t\t\t\t\tbackground:\n\t\t\t\t\t\t\t\t\t\t\t\t\tgradientValue ??\n\t\t\t\t\t\t\t\t\t\t\t\t\tbackgroundColor,\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\t\t{ areas.preview }\n\t\t\t\t\t\t\t\t\t\t</ResizableFrame>\n\t\t\t\t\t\t\t\t\t</ErrorBoundary>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</>\n\t);\n}\n"],"mappings":"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"}

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

@@ -15,10 +15,12 @@ import PagePatterns from '../page-patterns';
 import PageTemplatesTemplateParts from '../page-templates-template-parts';
 import { TEMPLATE_POST_TYPE, TEMPLATE_PART_POST_TYPE } from '../../utils/constants';
 const {
-  useLocation
+  useLocation,
+  useHistory
 } = unlock(routerPrivateApis);
 export default function useLayoutAreas() {
   const isSiteEditorLoading = useIsSiteEditorLoading();
+  const history = useHistory();
   const {
     params
   } = useLocation();
@@ -36,30 +38,24 @@ export default function useLayoutAreas() {
   // Regular page
   if (path === '/page') {
+    const isListLayout = layout === 'list' || !layout;
     return {
+      key: 'pages-list',
       areas: {
-        content: undefined,
-        preview: createElement(Editor, {
-          isLoading: isSiteEditorLoading
+        content: createElement(PagePages, null),
+        preview: isListLayout && createElement(Editor, {
+          isLoading: isSiteEditorLoading,
+          onClick: () => history.push({
+            path,
+            postType: 'page',
+            postId,
+            canvas: 'edit'
+          })
         }),
         mobile: canvas === 'edit' ? createElement(Editor, {
           isLoading: isSiteEditorLoading
         }) : undefined
       },
-      widths: {
-        content: undefined
-      }
-    };
-  }
-  const isListLayout = isCustom !== 'true' && layout === 'list';
-  if (path === '/pages') {
-    return {
-      areas: {
-        content: createElement(PagePages, null),
-        preview: isListLayout && createElement(Editor, {
-          isLoading: isSiteEditorLoading
-        })
-      },
       widths: {
         content: isListLayout ? 380 : undefined
       }
@@ -69,6 +65,7 @@ export default function useLayoutAreas() {
   // Regular other post types
   if (postType && postId) {
     return {
+      key: 'page',
       areas: {
         preview: createElement(Editor, {
           isLoading: isSiteEditorLoading
@@ -82,7 +79,9 @@ export default function useLayoutAreas() {
   // Templates
   if (path === '/wp_template') {
+    const isListLayout = isCustom !== 'true' && layout === 'list';
     return {
+      key: 'templates-list',
       areas: {
         content: createElement(PageTemplatesTemplateParts, {
           postType: TEMPLATE_POST_TYPE
@@ -102,7 +101,9 @@ export default function useLayoutAreas() {
   // Template parts
   if (path === '/wp_template_part/all') {
+    const isListLayout = isCustom !== 'true' && layout === 'list';
     return {
+      key: 'template-parts',
       areas: {
         content: createElement(PageTemplatesTemplateParts, {
           postType: TEMPLATE_PART_POST_TYPE
@@ -123,6 +124,7 @@ export default function useLayoutAreas() {
   // Patterns
   if (path === '/patterns') {
     return {
+      key: 'patterns',
       areas: {
         content: createElement(PagePatterns, null),
         mobile: createElement(PagePatterns, null)
@@ -132,6 +134,7 @@ export default function useLayoutAreas() {
   // Fallback shows the home page preview
   return {
+    key: 'default',
     areas: {
       preview: createElement(Editor, {
         isLoading: isSiteEditorLoading

package/build-module/components/layout/router.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["privateApis","routerPrivateApis","unlock","useIsSiteEditorLoading","Editor","PagePages","PagePatterns","PageTemplatesTemplateParts","TEMPLATE_POST_TYPE","TEMPLATE_PART_POST_TYPE","useLocation","useLayoutAreas","isSiteEditorLoading","params","postType","postId","path","layout","isCustom","canvas","areas","content","~~undefined~~","preview","~~createElement~~","~~isLoading~~","mobile","~~widths~~","~~isListLayout~~"],"sources":["@wordpress/edit-site/src/components/layout/router.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/\n Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { useIsSiteEditorLoading } from './hooks';\nimport Editor from '../editor';\nimport PagePages from '../page-pages';\nimport PagePatterns from '../page-patterns';\nimport PageTemplatesTemplateParts from '../page-templates-template-parts';\n\nimport {\n\tTEMPLATE_POST_TYPE,\n\tTEMPLATE_PART_POST_TYPE,\n} from '../../utils/constants';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nexport default function useLayoutAreas() {\n\tconst isSiteEditorLoading = useIsSiteEditorLoading();\n\tconst { params } = useLocation();\n\tconst { postType, postId, path, layout, isCustom, canvas } = params ?? {};\n\n\t// Note: Since \"sidebar\" is not yet supported here,\n\t// returning undefined from \"mobile\" means show the sidebar.\n\n\t// Regular page\n\tif ( path === '/page' ) {\n\t\treturn {\n\t\t\tareas: {\n\t\t\t\tcontent: ~~undefined,\~~n\t\t\t\tpreview: ~~<Editor~~ ~~isLoading={~~ ~~isSiteEditorLoading } />,\~~n\t\t\t\~~tmobile:\~~n\t\t\t\t\~~tcanvas~~ ~~===~~ ~~'edit' ? (~~\n\t\t\t\t\t\~~t<Editor isLoading~~={ ~~isSiteEditorLoading~~ ~~} />\~~n\t\t\t\t\t) ~~: undefined,\~~n\t\t\t},\n\t\t\~~twidths: {~~\n\t\t\t\~~tcontent~~: ~~undefined~~,\n\t\t\t},\n\t\t~~};\n~~\t}\n\n\~~tconst~~ ~~isListLayout = isCustom !==~~ '~~true~~' ~~&& layout === 'list';\~~n\n\~~tif~~ ~~( path === '/pages'~~ ) {\n\t\~~treturn {~~\n\t\t\~~tareas: {~~\n\t\t\t\~~tcontent: <PagePages />,\~~n\t\t\t\~~tpreview:~~ ~~isListLayout~~ && (\n\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t),\n\t\t\t},\n\t\t\twidths: {\n\t\t\t\tcontent: isListLayout ? 380 : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Regular other post types\n\tif ( postType && postId ) {\n\t\treturn {\n\t\t\tareas: {\n\t\t\t\tpreview: <Editor isLoading={ isSiteEditorLoading } />,\n\t\t\t\tmobile:\n\t\t\t\t\tcanvas === 'edit' ? (\n\t\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t\t) : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Templates\n\tif ( path === '/wp_template' ) {\n\t\treturn {\n\t\t\tareas: {\n\t\t\t\tcontent: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t\tpreview: isListLayout && (\n\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t),\n\t\t\t\tmobile: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t},\n\t\t\twidths: {\n\t\t\t\tcontent: isListLayout ? 380 : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Template parts\n\tif ( path === '/wp_template_part/all' ) {\n\t\treturn {\n\t\t\tareas: {\n\t\t\t\tcontent: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t\tpreview: isListLayout && (\n\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t),\n\t\t\t\tmobile: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t},\n\t\t\twidths: {\n\t\t\t\tcontent: isListLayout ? 380 : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Patterns\n\tif ( path === '/patterns' ) {\n\t\treturn {\n\t\t\tareas: {\n\t\t\t\tcontent: <PagePatterns />,\n\t\t\t\tmobile: <PagePatterns />,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Fallback shows the home page preview\n\treturn {\n\t\tareas: {\n\t\t\tpreview: <Editor isLoading={ isSiteEditorLoading } />,\n\t\t\tmobile:\n\t\t\t\tcanvas === 'edit' ? (\n\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t) : undefined,\n\t\t},\n\t};\n}\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,WAAW,IAAIC,iBAAiB,QAAQ,mBAAmB;;AAEpE;AACA;AACA;AACA,SAASC,MAAM,QAAQ,mBAAmB;AAC1C,SAASC,sBAAsB,QAAQ,SAAS;AAChD,OAAOC,MAAM,MAAM,WAAW;AAC9B,OAAOC,SAAS,MAAM,eAAe;AACrC,OAAOC,YAAY,MAAM,kBAAkB;AAC3C,OAAOC,0BAA0B,MAAM,kCAAkC;AAEzE,SACCC,kBAAkB,EAClBC,uBAAuB,QACjB,uBAAuB;AAE9B,MAAM;EAAEC;~~AAAY~~,CAAC,~~GAAGR~~,MAAM,CAAED,iBAAkB,CAAC;~~AAEnD~~,eAAe,~~SAASU~~,cAAcA,CAAA,EAAG;EACxC,MAAMC,mBAAmB,~~GAAGT~~,sBAAsB,CAAC,CAAC;EACpD,MAAM;~~IAAEU~~;EAAO,CAAC,~~GAAGH~~,WAAW,CAAC,CAAC;EAChC,MAAM;~~IAAEI~~,QAAQ;IAAEC,MAAM;IAAEC,IAAI;IAAEC,MAAM;IAAEC,QAAQ;IAAEC;EAAO,CAAC,GAAGN,MAAM,aAANA,MAAM,cAANA,MAAM,GAAI,CAAC,CAAC;;EAEzE;EACA;;EAEA;EACA,IAAKG,IAAI,KAAK,OAAO,EAAG;IACvB,OAAO;MACNI,~~KAAK~~,EAAE;~~QACNC~~,~~OAAO~~,~~EAAEC,SAAS~~;~~QAClBC~~,OAAO,EAAEC,aAAA,~~CAACpB~~,~~MAAM;UAACqB,~~SAAS,~~EAAGb;QAAqB~~,~~CAAE,~~CAAC;~~QACrDc~~,~~MAAM~~,~~EACLP~~,~~MAAM~~,~~KAAK~~,~~MAAM,GAChBK,~~aAAA,~~CAACpB~~,MAAM;~~UAACqB~~,SAAS,~~EAAGb~~;~~QAAqB~~,~~CAAE~~,~~CAAC~~,~~GACzCU;MACN~~,~~CAAC;MACDK~~,~~MAAM~~,~~EAAE;QACPN~~,~~OAAO~~,~~EAAEC~~;~~MACV;IACD~~,~~CAAC~~;~~EACF;EAEA~~,~~MAAMM,YAAY,GAAGV,~~QAAQ,~~KAAK~~,MAAM,~~IAAID,~~MAAM,~~KAAK,~~MAAM~~;EAE7D~~,~~IAAKD,IAAI,KAAK,QAAQ,EAAG~~;~~IACxB~~,~~OAAO~~;~~MACNI~~,~~KAAK~~,~~EAAE~~;~~QACNC~~,~~OAAO~~,~~EAAEG~~,~~aAAA~~,~~CAACnB~~,~~SAAS~~,~~MAAE~~,~~CAAC;QACtBkB,OAAO,EAAEK,YAAY,IACpBJ,~~aAAA,~~CAACpB~~,MAAM;~~UAACqB~~,SAAS,~~EAAGb~~;QAAqB,CAAE;~~MAE7C~~,CAAC;~~MACDe~~,MAAM,EAAE;~~QACPN~~,OAAO,~~EAAEO~~,YAAY,GAAG,GAAG,~~GAAGN~~;MAC/B;IACD,CAAC;EACF;;EAEA;EACA,~~IAAKR~~,QAAQ,IAAIC,MAAM,EAAG;IACzB,OAAO;~~MACNK~~,KAAK,EAAE;QACNG,OAAO,~~EAAEC~~,aAAA,~~CAACpB~~,MAAM;~~UAACqB~~,SAAS,~~EAAGb~~;QAAqB,CAAE,CAAC;~~QACrDc~~,MAAM,~~EACLP~~,MAAM,KAAK,MAAM,GAChBK,aAAA,~~CAACpB~~,MAAM;~~UAACqB~~,SAAS,~~EAAGb~~;QAAqB,CAAE,CAAC,~~GACzCU~~;MACN;IACD,CAAC;EACF;;EAEA;EACA,~~IAAKN~~,IAAI,KAAK,cAAc,EAAG;IAC9B,OAAO;MACNI,KAAK,EAAE;QACNC,OAAO,~~EACNG~~,aAAA,~~CAACjB~~,0BAA0B;~~UAC1BO~~,QAAQ,~~EAAGN~~;QAAoB,CAC/B,CACD;~~QACDe~~,OAAO,~~EAAEK~~,YAAY,~~IACpBJ~~,aAAA,~~CAACpB~~,MAAM;~~UAACqB~~,SAAS,~~EAAGb~~;QAAqB,CAAE,CAC3C;~~QACDc~~,MAAM,~~EACLF~~,aAAA,~~CAACjB~~,0BAA0B;~~UAC1BO~~,QAAQ,~~EAAGN~~;QAAoB,CAC/B;MAEH,CAAC;~~MACDmB~~,MAAM,EAAE;~~QACPN~~,OAAO,~~EAAEO~~,YAAY,GAAG,GAAG,~~GAAGN~~;MAC/B;IACD,CAAC;EACF;;EAEA;EACA,~~IAAKN~~,IAAI,KAAK,uBAAuB,EAAG;IACvC,OAAO;MACNI,KAAK,EAAE;QACNC,OAAO,~~EACNG~~,aAAA,~~CAACjB~~,0BAA0B;~~UAC1BO~~,QAAQ,~~EAAGL~~;QAAyB,CACpC,CACD;~~QACDc~~,OAAO,~~EAAEK~~,YAAY,~~IACpBJ~~,aAAA,~~CAACpB~~,MAAM;~~UAACqB~~,SAAS,~~EAAGb~~;QAAqB,CAAE,CAC3C;~~QACDc~~,MAAM,~~EACLF~~,aAAA,~~CAACjB~~,0BAA0B;~~UAC1BO~~,QAAQ,~~EAAGL~~;QAAyB,CACpC;MAEH,CAAC;~~MACDkB~~,MAAM,EAAE;~~QACPN~~,OAAO,~~EAAEO~~,YAAY,GAAG,GAAG,~~GAAGN~~;MAC/B;IACD,CAAC;EACF;;EAEA;EACA,~~IAAKN~~,IAAI,KAAK,WAAW,EAAG;IAC3B,OAAO;~~MACNI~~,KAAK,EAAE;QACNC,OAAO,~~EAAEG~~,aAAA,~~CAAClB~~,YAAY,MAAE,CAAC;~~QACzBoB~~,MAAM,~~EAAEF~~,aAAA,~~CAAClB~~,YAAY,MAAE;MACxB;IACD,CAAC;EACF;;EAEA;EACA,OAAO;~~IACNc~~,KAAK,EAAE;MACNG,OAAO,~~EAAEC~~,aAAA,~~CAACpB~~,MAAM;~~QAACqB~~,SAAS,~~EAAGb~~;MAAqB,CAAE,CAAC;~~MACrDc~~,MAAM,~~EACLP~~,MAAM,KAAK,MAAM,GAChBK,aAAA,~~CAACpB~~,MAAM;~~QAACqB~~,SAAS,~~EAAGb~~;MAAqB,CAAE,CAAC,~~GACzCU~~;IACN;EACD,CAAC;AACF"}
1	+ {"version":3,"names":["privateApis","routerPrivateApis","unlock","useIsSiteEditorLoading","Editor","PagePages","PagePatterns","PageTemplatesTemplateParts","TEMPLATE_POST_TYPE","TEMPLATE_PART_POST_TYPE","useLocation","useHistory","useLayoutAreas","isSiteEditorLoading","history","params","postType","postId","path","layout","isCustom","canvas","isListLayout","key","areas","content","createElement","preview","isLoading","onClick","push","mobile","undefined","widths"],"sources":["@wordpress/edit-site/src/components/layout/router.js"],"sourcesContent":["/*\n WordPress dependencies\n /\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/\n Internal dependencies\n */\nimport { unlock } from '../../lock-unlock';\nimport { useIsSiteEditorLoading } from './hooks';\nimport Editor from '../editor';\nimport PagePages from '../page-pages';\nimport PagePatterns from '../page-patterns';\nimport PageTemplatesTemplateParts from '../page-templates-template-parts';\n\nimport {\n\tTEMPLATE_POST_TYPE,\n\tTEMPLATE_PART_POST_TYPE,\n} from '../../utils/constants';\n\nconst { useLocation, useHistory } = unlock( routerPrivateApis );\n\nexport default function useLayoutAreas() {\n\tconst isSiteEditorLoading = useIsSiteEditorLoading();\n\tconst history = useHistory();\n\tconst { params } = useLocation();\n\tconst { postType, postId, path, layout, isCustom, canvas } = params ?? {};\n\n\t// Note: Since \"sidebar\" is not yet supported here,\n\t// returning undefined from \"mobile\" means show the sidebar.\n\n\t// Regular page\n\tif ( path === '/page' ) {\n\t\tconst isListLayout = layout === 'list' \|\| ! layout;\n\t\treturn {\n\t\t\tkey: 'pages-list',\n\t\t\tareas: {\n\t\t\t\tcontent: <PagePages />,\n\t\t\t\tpreview: isListLayout && (\n\t\t\t\t\t<Editor\n\t\t\t\t\t\tisLoading={ isSiteEditorLoading }\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\thistory.push( {\n\t\t\t\t\t\t\t\tpath,\n\t\t\t\t\t\t\t\tpostType: 'page',\n\t\t\t\t\t\t\t\tpostId,\n\t\t\t\t\t\t\t\tcanvas: 'edit',\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\tmobile:\n\t\t\t\t\tcanvas === 'edit' ? (\n\t\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t\t) : undefined,\n\t\t\t},\n\t\t\twidths: {\n\t\t\t\tcontent: isListLayout ? 380 : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Regular other post types\n\tif ( postType && postId ) {\n\t\treturn {\n\t\t\tkey: 'page',\n\t\t\tareas: {\n\t\t\t\tpreview: <Editor isLoading={ isSiteEditorLoading } />,\n\t\t\t\tmobile:\n\t\t\t\t\tcanvas === 'edit' ? (\n\t\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t\t) : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Templates\n\tif ( path === '/wp_template' ) {\n\t\tconst isListLayout = isCustom !== 'true' && layout === 'list';\n\t\treturn {\n\t\t\tkey: 'templates-list',\n\t\t\tareas: {\n\t\t\t\tcontent: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t\tpreview: isListLayout && (\n\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t),\n\t\t\t\tmobile: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t},\n\t\t\twidths: {\n\t\t\t\tcontent: isListLayout ? 380 : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Template parts\n\tif ( path === '/wp_template_part/all' ) {\n\t\tconst isListLayout = isCustom !== 'true' && layout === 'list';\n\t\treturn {\n\t\t\tkey: 'template-parts',\n\t\t\tareas: {\n\t\t\t\tcontent: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t\tpreview: isListLayout && (\n\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t),\n\t\t\t\tmobile: (\n\t\t\t\t\t<PageTemplatesTemplateParts\n\t\t\t\t\t\tpostType={ TEMPLATE_PART_POST_TYPE }\n\t\t\t\t\t/>\n\t\t\t\t),\n\t\t\t},\n\t\t\twidths: {\n\t\t\t\tcontent: isListLayout ? 380 : undefined,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Patterns\n\tif ( path === '/patterns' ) {\n\t\treturn {\n\t\t\tkey: 'patterns',\n\t\t\tareas: {\n\t\t\t\tcontent: <PagePatterns />,\n\t\t\t\tmobile: <PagePatterns />,\n\t\t\t},\n\t\t};\n\t}\n\n\t// Fallback shows the home page preview\n\treturn {\n\t\tkey: 'default',\n\t\tareas: {\n\t\t\tpreview: <Editor isLoading={ isSiteEditorLoading } />,\n\t\t\tmobile:\n\t\t\t\tcanvas === 'edit' ? (\n\t\t\t\t\t<Editor isLoading={ isSiteEditorLoading } />\n\t\t\t\t) : undefined,\n\t\t},\n\t};\n}\n"],"mappings":"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"}

package/build-module/components/page-pages/index.js CHANGED Viewed

@@ -16,6 +16,7 @@ import { dateI18n, getDate, getSettings } from '@wordpress/date';
 import { privateApis as routerPrivateApis } from '@wordpress/router';
 import { useSelect, useDispatch } from '@wordpress/data';
 import { DataViews } from '@wordpress/dataviews';
+import { privateApis as editorPrivateApis } from '@wordpress/editor';
 /**
  * Internal dependencies
@@ -24,10 +25,12 @@ import Page from '../page';
 import { default as Link, useLink } from '../routes/link';
 import { DEFAULT_VIEWS, DEFAULT_CONFIG_PER_VIEW_TYPE } from '../sidebar-dataviews/default-views';
 import { ENUMERATION_TYPE, LAYOUT_GRID, LAYOUT_TABLE, LAYOUT_LIST, OPERATOR_IS_ANY, OPERATOR_IS_NONE } from '../../utils/constants';
-import { trashPostAction, usePermanentlyDeletePostAction, useRestorePostAction, postRevisionsAction, viewPostAction, useEditPostAction } from '../actions';
 import AddNewPageModal from '../add-new-page';
 import Media from '../media';
 import { unlock } from '../../lock-unlock';
+const {
+  usePostActions
+} = unlock(editorPrivateApis);
 const {
   useLocation,
   useHistory
@@ -298,10 +301,17 @@ export default function PagePages() {
       return createElement("time", null, formattedDate);
     }
   }], [authors, view.type]);
-  const permanentlyDeletePostAction = usePermanentlyDeletePostAction();
-  const restorePostAction = useRestorePostAction();
-  const editPostAction = useEditPostAction();
-  const actions = useMemo(() => [editPostAction, viewPostAction, restorePostAction, permanentlyDeletePostAction, postRevisionsAction, trashPostAction], [permanentlyDeletePostAction, restorePostAction, editPostAction]);
+  const onActionPerformed = useCallback((actionId, items) => {
+    if (actionId === 'edit-post') {
+      const post = items[0];
+      history.push({
+        postId: post.id,
+        postType: post.type,
+        canvas: 'edit'
+      });
+    }
+  }, [history]);
+  const actions = usePostActions(onActionPerformed);
   const onChangeView = useCallback(newView => {
     if (newView.type !== view.type) {
       newView = {
@@ -314,17 +324,9 @@ export default function PagePages() {
     setView(newView);
   }, [view.type, setView]);
   const [showAddPageModal, setShowAddPageModal] = useState(false);
-  const openModal = useCallback(() => {
-    if (!showAddPageModal) {
-      setShowAddPageModal(true);
-    }
-  }, [showAddPageModal]);
-  const closeModal = useCallback(() => {
-    if (showAddPageModal) {
-      setShowAddPageModal(false);
-    }
-  }, [showAddPageModal]);
-  const handleNewPage = useCallback(({
+  const openModal = () => setShowAddPageModal(true);
+  const closeModal = () => setShowAddPageModal(false);
+  const handleNewPage = ({
     type,
     id
   }) => {
@@ -334,7 +336,7 @@ export default function PagePages() {
       canvas: 'edit'
     });
     closeModal();
-  }, [history]);
+  };
   // TODO: we need to handle properly `data={ data || EMPTY_ARRAY }` for when `isLoading`.
   return createElement(Page, {