@wordpress/edit-site 5.9.0 → 5.11.0

package/build-module/components/resizable-frame/index.js

@@ -0,0 +1,228 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+/**
+ * WordPress dependencies
+ */
+
+import { useState, useRef, useEffect } from '@wordpress/element';
+import { ResizableBox, __unstableMotion as motion } from '@wordpress/components';
+import { useDispatch } from '@wordpress/data';
+/**
+ * Internal dependencies
+ */
+
+import { unlock } from '../../private-apis';
+import { store as editSiteStore } from '../../store'; // Removes the inline styles in the drag handles.
+
+const HANDLE_STYLES_OVERRIDE = {
+  position: undefined,
+  userSelect: undefined,
+  cursor: undefined,
+  width: undefined,
+  height: undefined,
+  top: undefined,
+  right: undefined,
+  bottom: undefined,
+  left: undefined
+}; // The minimum width of the frame (in px) while resizing.
+
+const FRAME_MIN_WIDTH = 340; // The reference width of the frame (in px) used to calculate the aspect ratio.
+
+const FRAME_REFERENCE_WIDTH = 1300; // 9 : 19.5 is the target aspect ratio enforced (when possible) while resizing.
+
+const FRAME_TARGET_ASPECT_RATIO = 9 / 19.5; // The minimum distance (in px) between the frame resize handle and the
+// viewport's edge. If the frame is resized to be closer to the viewport's edge
+// than this distance, then "canvas mode" will be enabled.
+
+const SNAP_TO_EDIT_CANVAS_MODE_THRESHOLD = 200;
+
+function calculateNewHeight(width, initialAspectRatio) {
+  const lerp = (a, b, amount) => {
+    return a + (b - a) * amount;
+  }; // Calculate the intermediate aspect ratio based on the current width.
+
+
+  const lerpFactor = 1 - Math.max(0, Math.min(1, (width - FRAME_MIN_WIDTH) / (FRAME_REFERENCE_WIDTH - FRAME_MIN_WIDTH))); // Calculate the height based on the intermediate aspect ratio
+  // ensuring the frame arrives at the target aspect ratio.
+
+  const intermediateAspectRatio = lerp(initialAspectRatio, FRAME_TARGET_ASPECT_RATIO, lerpFactor);
+  return width / intermediateAspectRatio;
+}
+
+function ResizableFrame(_ref2) {
+  let {
+    isFullWidth,
+    isReady,
+    children,
+    oversizedClassName
+  } = _ref2;
+  const [frameSize, setFrameSize] = useState({
+    width: '100%',
+    height: '100%'
+  }); // The width of the resizable frame when a new resize gesture starts.
+
+  const [startingWidth, setStartingWidth] = useState();
+  const [isResizing, setIsResizing] = useState(false);
+  const [isHovering, setIsHovering] = useState(false);
+  const [isOversized, setIsOversized] = useState(false);
+  const [resizeRatio, setResizeRatio] = useState(1);
+  const {
+    setCanvasMode
+  } = unlock(useDispatch(editSiteStore));
+  const initialAspectRatioRef = useRef(null); // The width of the resizable frame on initial render.
+
+  const initialComputedWidthRef = useRef(null);
+  const FRAME_TRANSITION = {
+    type: 'tween',
+    duration: isResizing ? 0 : 0.5
+  };
+  const frameRef = useRef(null); // Remember frame dimensions on initial render.
+
+  useEffect(() => {
+    const {
+      offsetWidth,
+      offsetHeight
+    } = frameRef.current.resizable;
+    initialComputedWidthRef.current = offsetWidth;
+    initialAspectRatioRef.current = offsetWidth / offsetHeight;
+  }, []);
+
+  const handleResizeStart = (_event, _direction, ref) => {
+    // Remember the starting width so we don't have to get `ref.offsetWidth` on
+    // every resize event thereafter, which will cause layout thrashing.
+    setStartingWidth(ref.offsetWidth);
+    setIsResizing(true);
+  }; // Calculate the frame size based on the window width as its resized.
+
+
+  const handleResize = (_event, _direction, _ref, delta) => {
+    const normalizedDelta = delta.width / resizeRatio;
+    const deltaAbs = Math.abs(normalizedDelta);
+    const maxDoubledDelta = delta.width < 0 // is shrinking
+    ? deltaAbs : (initialComputedWidthRef.current - startingWidth) / 2;
+    const deltaToDouble = Math.min(deltaAbs, maxDoubledDelta);
+    const doubleSegment = deltaAbs === 0 ? 0 : deltaToDouble / deltaAbs;
+    const singleSegment = 1 - doubleSegment;
+    setResizeRatio(singleSegment + doubleSegment * 2);
+    const updatedWidth = startingWidth + delta.width;
+    setIsOversized(updatedWidth > initialComputedWidthRef.current); // Width will be controlled by the library (via `resizeRatio`),
+    // so we only need to update the height.
+
+    setFrameSize({
+      height: isOversized ? '100%' : calculateNewHeight(updatedWidth, initialAspectRatioRef.current)
+    });
+  };
+
+  const handleResizeStop = (_event, _direction, ref) => {
+    setIsResizing(false);
+
+    if (!isOversized) {
+      return;
+    }
+
+    setIsOversized(false);
+    const remainingWidth = ref.ownerDocument.documentElement.offsetWidth - ref.offsetWidth;
+
+    if (remainingWidth > SNAP_TO_EDIT_CANVAS_MODE_THRESHOLD) {
+      // Reset the initial aspect ratio if the frame is resized slightly
+      // above the sidebar but not far enough to trigger full screen.
+      setFrameSize({
+        width: '100%',
+        height: '100%'
+      });
+    } else {
+      // Trigger full screen if the frame is resized far enough to the left.
+      setCanvasMode('edit');
+    }
+  };
+
+  const frameAnimationVariants = {
+    default: {
+      flexGrow: 0,
+      height: frameSize.height
+    },
+    fullWidth: {
+      flexGrow: 1,
+      height: frameSize.height
+    }
+  };
+  return createElement(ResizableBox, {
+    as: motion.div,
+    ref: frameRef,
+    initial: false,
+    variants: frameAnimationVariants,
+    animate: isFullWidth ? 'fullWidth' : 'default',
+    onAnimationComplete: definition => {
+      if (definition === 'fullWidth') setFrameSize({
+        width: '100%',
+        height: '100%'
+      });
+    },
+    transition: FRAME_TRANSITION,
+    size: frameSize,
+    enable: {
+      top: false,
+      right: false,
+      bottom: false,
+      // Resizing will be disabled until the editor content is loaded.
+      left: isReady,
+      topRight: false,
+      bottomRight: false,
+      bottomLeft: false,
+      topLeft: false
+    },
+    resizeRatio: resizeRatio,
+    handleClasses: undefined,
+    handleStyles: {
+      left: HANDLE_STYLES_OVERRIDE,
+      right: HANDLE_STYLES_OVERRIDE
+    },
+    minWidth: FRAME_MIN_WIDTH,
+    maxWidth: isFullWidth ? '100%' : '150%',
+    maxHeight: '100%',
+    onMouseOver: () => setIsHovering(true),
+    onMouseOut: () => setIsHovering(false),
+    handleComponent: {
+      left: isHovering || isResizing ? createElement(motion.div, {
+        key: "handle",
+        className: "edit-site-resizable-frame__handle",
+        title: "Drag to resize",
+        initial: {
+          opacity: 0,
+          left: 0
+        },
+        animate: {
+          opacity: 1,
+          left: -15
+        },
+        exit: {
+          opacity: 0,
+          left: 0
+        },
+        whileHover: {
+          scale: 1.1
+        }
+      }) : null
+    },
+    onResizeStart: handleResizeStart,
+    onResize: handleResize,
+    onResizeStop: handleResizeStop,
+    className: classnames('edit-site-resizable-frame__inner', {
+      'is-resizing': isResizing,
+      [oversizedClassName]: isOversized
+    })
+  }, createElement(motion.div, {
+    className: "edit-site-resizable-frame__inner-content",
+    animate: {
+      borderRadius: isFullWidth ? 0 : 8
+    },
+    transition: FRAME_TRANSITION
+  }, children));
+}
+
+export default ResizableFrame;
+//# sourceMappingURL=index.js.map

package/build-module/components/resizable-frame/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/resizable-frame/index.js"],"names":["classnames","useState","useRef","useEffect","ResizableBox","__unstableMotion","motion","useDispatch","unlock","store","editSiteStore","HANDLE_STYLES_OVERRIDE","position","undefined","userSelect","cursor","width","height","top","right","bottom","left","FRAME_MIN_WIDTH","FRAME_REFERENCE_WIDTH","FRAME_TARGET_ASPECT_RATIO","SNAP_TO_EDIT_CANVAS_MODE_THRESHOLD","calculateNewHeight","initialAspectRatio","lerp","a","b","amount","lerpFactor","Math","max","min","intermediateAspectRatio","ResizableFrame","isFullWidth","isReady","children","oversizedClassName","frameSize","setFrameSize","startingWidth","setStartingWidth","isResizing","setIsResizing","isHovering","setIsHovering","isOversized","setIsOversized","resizeRatio","setResizeRatio","setCanvasMode","initialAspectRatioRef","initialComputedWidthRef","FRAME_TRANSITION","type","duration","frameRef","offsetWidth","offsetHeight","current","resizable","handleResizeStart","_event","_direction","ref","handleResize","_ref","delta","normalizedDelta","deltaAbs","abs","maxDoubledDelta","deltaToDouble","doubleSegment","singleSegment","updatedWidth","handleResizeStop","remainingWidth","ownerDocument","documentElement","frameAnimationVariants","default","flexGrow","fullWidth","div","definition","topRight","bottomRight","bottomLeft","topLeft","opacity","scale","borderRadius"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { useState, useRef, useEffect } from '@wordpress/element';\nimport {\n\tResizableBox,\n\t__unstableMotion as motion,\n} from '@wordpress/components';\nimport { useDispatch } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\nimport { store as editSiteStore } from '../../store';\n\n// Removes the inline styles in the drag handles.\nconst HANDLE_STYLES_OVERRIDE = {\n\tposition: undefined,\n\tuserSelect: undefined,\n\tcursor: undefined,\n\twidth: undefined,\n\theight: undefined,\n\ttop: undefined,\n\tright: undefined,\n\tbottom: undefined,\n\tleft: undefined,\n};\n\n// The minimum width of the frame (in px) while resizing.\nconst FRAME_MIN_WIDTH = 340;\n// The reference width of the frame (in px) used to calculate the aspect ratio.\nconst FRAME_REFERENCE_WIDTH = 1300;\n// 9 : 19.5 is the target aspect ratio enforced (when possible) while resizing.\nconst FRAME_TARGET_ASPECT_RATIO = 9 / 19.5;\n// The minimum distance (in px) between the frame resize handle and the\n// viewport's edge. If the frame is resized to be closer to the viewport's edge\n// than this distance, then \"canvas mode\" will be enabled.\nconst SNAP_TO_EDIT_CANVAS_MODE_THRESHOLD = 200;\n\nfunction calculateNewHeight( width, initialAspectRatio ) {\n\tconst lerp = ( a, b, amount ) => {\n\t\treturn a + ( b - a ) * amount;\n\t};\n\n\t// Calculate the intermediate aspect ratio based on the current width.\n\tconst lerpFactor =\n\t\t1 -\n\t\tMath.max(\n\t\t\t0,\n\t\t\tMath.min(\n\t\t\t\t1,\n\t\t\t\t( width - FRAME_MIN_WIDTH ) /\n\t\t\t\t\t( FRAME_REFERENCE_WIDTH - FRAME_MIN_WIDTH )\n\t\t\t)\n\t\t);\n\n\t// Calculate the height based on the intermediate aspect ratio\n\t// ensuring the frame arrives at the target aspect ratio.\n\tconst intermediateAspectRatio = lerp(\n\t\tinitialAspectRatio,\n\t\tFRAME_TARGET_ASPECT_RATIO,\n\t\tlerpFactor\n\t);\n\n\treturn width / intermediateAspectRatio;\n}\n\nfunction ResizableFrame( {\n\tisFullWidth,\n\tisReady,\n\tchildren,\n\toversizedClassName,\n} ) {\n\tconst [ frameSize, setFrameSize ] = useState( {\n\t\twidth: '100%',\n\t\theight: '100%',\n\t} );\n\t// The width of the resizable frame when a new resize gesture starts.\n\tconst [ startingWidth, setStartingWidth ] = useState();\n\tconst [ isResizing, setIsResizing ] = useState( false );\n\tconst [ isHovering, setIsHovering ] = useState( false );\n\tconst [ isOversized, setIsOversized ] = useState( false );\n\tconst [ resizeRatio, setResizeRatio ] = useState( 1 );\n\tconst { setCanvasMode } = unlock( useDispatch( editSiteStore ) );\n\tconst initialAspectRatioRef = useRef( null );\n\t// The width of the resizable frame on initial render.\n\tconst initialComputedWidthRef = useRef( null );\n\tconst FRAME_TRANSITION = { type: 'tween', duration: isResizing ? 0 : 0.5 };\n\tconst frameRef = useRef( null );\n\n\t// Remember frame dimensions on initial render.\n\tuseEffect( () => {\n\t\tconst { offsetWidth, offsetHeight } = frameRef.current.resizable;\n\t\tinitialComputedWidthRef.current = offsetWidth;\n\t\tinitialAspectRatioRef.current = offsetWidth / offsetHeight;\n\t}, [] );\n\n\tconst handleResizeStart = ( _event, _direction, ref ) => {\n\t\t// Remember the starting width so we don't have to get `ref.offsetWidth` on\n\t\t// every resize event thereafter, which will cause layout thrashing.\n\t\tsetStartingWidth( ref.offsetWidth );\n\t\tsetIsResizing( true );\n\t};\n\n\t// Calculate the frame size based on the window width as its resized.\n\tconst handleResize = ( _event, _direction, _ref, delta ) => {\n\t\tconst normalizedDelta = delta.width / resizeRatio;\n\t\tconst deltaAbs = Math.abs( normalizedDelta );\n\t\tconst maxDoubledDelta =\n\t\t\tdelta.width < 0 // is shrinking\n\t\t\t\t? deltaAbs\n\t\t\t\t: ( initialComputedWidthRef.current - startingWidth ) / 2;\n\t\tconst deltaToDouble = Math.min( deltaAbs, maxDoubledDelta );\n\t\tconst doubleSegment = deltaAbs === 0 ? 0 : deltaToDouble / deltaAbs;\n\t\tconst singleSegment = 1 - doubleSegment;\n\n\t\tsetResizeRatio( singleSegment + doubleSegment * 2 );\n\n\t\tconst updatedWidth = startingWidth + delta.width;\n\n\t\tsetIsOversized( updatedWidth > initialComputedWidthRef.current );\n\n\t\t// Width will be controlled by the library (via `resizeRatio`),\n\t\t// so we only need to update the height.\n\t\tsetFrameSize( {\n\t\t\theight: isOversized\n\t\t\t\t? '100%'\n\t\t\t\t: calculateNewHeight(\n\t\t\t\t\t\tupdatedWidth,\n\t\t\t\t\t\tinitialAspectRatioRef.current\n\t\t\t\t  ),\n\t\t} );\n\t};\n\n\tconst handleResizeStop = ( _event, _direction, ref ) => {\n\t\tsetIsResizing( false );\n\n\t\tif ( ! isOversized ) {\n\t\t\treturn;\n\t\t}\n\n\t\tsetIsOversized( false );\n\n\t\tconst remainingWidth =\n\t\t\tref.ownerDocument.documentElement.offsetWidth - ref.offsetWidth;\n\n\t\tif ( remainingWidth > SNAP_TO_EDIT_CANVAS_MODE_THRESHOLD ) {\n\t\t\t// Reset the initial aspect ratio if the frame is resized slightly\n\t\t\t// above the sidebar but not far enough to trigger full screen.\n\t\t\tsetFrameSize( { width: '100%', height: '100%' } );\n\t\t} else {\n\t\t\t// Trigger full screen if the frame is resized far enough to the left.\n\t\t\tsetCanvasMode( 'edit' );\n\t\t}\n\t};\n\n\tconst frameAnimationVariants = {\n\t\tdefault: {\n\t\t\tflexGrow: 0,\n\t\t\theight: frameSize.height,\n\t\t},\n\t\tfullWidth: {\n\t\t\tflexGrow: 1,\n\t\t\theight: frameSize.height,\n\t\t},\n\t};\n\n\treturn (\n\t\t<ResizableBox\n\t\t\tas={ motion.div }\n\t\t\tref={ frameRef }\n\t\t\tinitial={ false }\n\t\t\tvariants={ frameAnimationVariants }\n\t\t\tanimate={ isFullWidth ? 'fullWidth' : 'default' }\n\t\t\tonAnimationComplete={ ( definition ) => {\n\t\t\t\tif ( definition === 'fullWidth' )\n\t\t\t\t\tsetFrameSize( { width: '100%', height: '100%' } );\n\t\t\t} }\n\t\t\ttransition={ FRAME_TRANSITION }\n\t\t\tsize={ frameSize }\n\t\t\tenable={ {\n\t\t\t\ttop: false,\n\t\t\t\tright: false,\n\t\t\t\tbottom: false,\n\t\t\t\t// Resizing will be disabled until the editor content is loaded.\n\t\t\t\tleft: isReady,\n\t\t\t\ttopRight: false,\n\t\t\t\tbottomRight: false,\n\t\t\t\tbottomLeft: false,\n\t\t\t\ttopLeft: false,\n\t\t\t} }\n\t\t\tresizeRatio={ resizeRatio }\n\t\t\thandleClasses={ undefined }\n\t\t\thandleStyles={ {\n\t\t\t\tleft: HANDLE_STYLES_OVERRIDE,\n\t\t\t\tright: HANDLE_STYLES_OVERRIDE,\n\t\t\t} }\n\t\t\tminWidth={ FRAME_MIN_WIDTH }\n\t\t\tmaxWidth={ isFullWidth ? '100%' : '150%' }\n\t\t\tmaxHeight={ '100%' }\n\t\t\tonMouseOver={ () => setIsHovering( true ) }\n\t\t\tonMouseOut={ () => setIsHovering( false ) }\n\t\t\thandleComponent={ {\n\t\t\t\tleft:\n\t\t\t\t\tisHovering || isResizing ? (\n\t\t\t\t\t\t<motion.div\n\t\t\t\t\t\t\tkey=\"handle\"\n\t\t\t\t\t\t\tclassName=\"edit-site-resizable-frame__handle\"\n\t\t\t\t\t\t\ttitle=\"Drag to resize\"\n\t\t\t\t\t\t\tinitial={ {\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tanimate={ {\n\t\t\t\t\t\t\t\topacity: 1,\n\t\t\t\t\t\t\t\tleft: -15,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\texit={ {\n\t\t\t\t\t\t\t\topacity: 0,\n\t\t\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\twhileHover={ { scale: 1.1 } }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) : null,\n\t\t\t} }\n\t\t\tonResizeStart={ handleResizeStart }\n\t\t\tonResize={ handleResize }\n\t\t\tonResizeStop={ handleResizeStop }\n\t\t\tclassName={ classnames( 'edit-site-resizable-frame__inner', {\n\t\t\t\t'is-resizing': isResizing,\n\t\t\t\t[ oversizedClassName ]: isOversized,\n\t\t\t} ) }\n\t\t>\n\t\t\t<motion.div\n\t\t\t\tclassName=\"edit-site-resizable-frame__inner-content\"\n\t\t\t\tanimate={ {\n\t\t\t\t\tborderRadius: isFullWidth ? 0 : 8,\n\t\t\t\t} }\n\t\t\t\ttransition={ FRAME_TRANSITION }\n\t\t\t>\n\t\t\t\t{ children }\n\t\t\t</motion.div>\n\t\t</ResizableBox>\n\t);\n}\n\nexport default ResizableFrame;\n"]}

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

@@ -0,0 +1,78 @@
+import { createElement } from "@wordpress/element";
+
+/**
+ * External dependencies
+ */
+import { isEmpty } from 'lodash';
+/**
+ * WordPress dependencies
+ */
+
+import { Disabled } from '@wordpress/components';
+import { __ } from '@wordpress/i18n';
+import { BlockList, privateApis as blockEditorPrivateApis, store as blockEditorStore, __unstableEditorStyles as EditorStyles, __unstableIframe as Iframe } from '@wordpress/block-editor';
+import { useSelect } from '@wordpress/data';
+import { useMemo } from '@wordpress/element';
+import { store as coreStore } from '@wordpress/core-data';
+/**
+ * Internal dependencies
+ */
+
+import { unlock } from '../../private-apis';
+import { mergeBaseAndUserConfigs } from '../global-styles/global-styles-provider';
+import EditorCanvasContainer from '../editor-canvas-container';
+const {
+  ExperimentalBlockEditorProvider,
+  useGlobalStylesOutputWithConfig
+} = unlock(blockEditorPrivateApis);
+
+function Revisions(_ref) {
+  let {
+    onClose,
+    userConfig,
+    blocks
+  } = _ref;
+  const {
+    baseConfig
+  } = useSelect(select => ({
+    baseConfig: select(coreStore).__experimentalGetCurrentThemeBaseGlobalStyles()
+  }), []);
+  const mergedConfig = useMemo(() => {
+    if (!isEmpty(userConfig) && !isEmpty(baseConfig)) {
+      return mergeBaseAndUserConfigs(baseConfig, userConfig);
+    }
+
+    return {};
+  }, [baseConfig, userConfig]);
+  const renderedBlocksArray = useMemo(() => Array.isArray(blocks) ? blocks : [blocks], [blocks]);
+  const originalSettings = useSelect(select => select(blockEditorStore).getSettings(), []);
+  const settings = useMemo(() => ({ ...originalSettings,
+    __unstableIsPreviewMode: true
+  }), [originalSettings]);
+  const [globalStyles] = useGlobalStylesOutputWithConfig(mergedConfig);
+  const editorStyles = !isEmpty(globalStyles) && !isEmpty(userConfig) ? globalStyles : settings.styles;
+  return createElement(EditorCanvasContainer, {
+    title: __('Revisions'),
+    onClose: onClose,
+    closeButtonLabel: __('Close revisions'),
+    enableResizing: true
+  }, createElement(Iframe, {
+    className: "edit-site-revisions__iframe",
+    name: "revisions",
+    tabIndex: 0
+  }, createElement(EditorStyles, {
+    styles: editorStyles
+  }), createElement("style", null, // Forming a "block formatting context" to prevent margin collapsing.
+  // @see https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Block_formatting_context
+  `.is-root-container { display: flow-root; } body { position: relative; padding: 32px; }`), createElement(Disabled, {
+    className: "edit-site-revisions__example-preview__content"
+  }, createElement(ExperimentalBlockEditorProvider, {
+    value: renderedBlocksArray,
+    settings: settings
+  }, createElement(BlockList, {
+    renderAppender: false
+  })))));
+}
+
+export default Revisions;
+//# sourceMappingURL=index.js.map

package/build-module/components/revisions/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/edit-site/src/components/revisions/index.js"],"names":["isEmpty","Disabled","__","BlockList","privateApis","blockEditorPrivateApis","store","blockEditorStore","__unstableEditorStyles","EditorStyles","__unstableIframe","Iframe","useSelect","useMemo","coreStore","unlock","mergeBaseAndUserConfigs","EditorCanvasContainer","ExperimentalBlockEditorProvider","useGlobalStylesOutputWithConfig","Revisions","onClose","userConfig","blocks","baseConfig","select","__experimentalGetCurrentThemeBaseGlobalStyles","mergedConfig","renderedBlocksArray","Array","isArray","originalSettings","getSettings","settings","__unstableIsPreviewMode","globalStyles","editorStyles","styles"],"mappings":"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","sourcesContent":["/**\n * External dependencies\n */\nimport { isEmpty } from 'lodash';\n\n/**\n * WordPress dependencies\n */\nimport { Disabled } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tBlockList,\n\tprivateApis as blockEditorPrivateApis,\n\tstore as blockEditorStore,\n\t__unstableEditorStyles as EditorStyles,\n\t__unstableIframe as Iframe,\n} from '@wordpress/block-editor';\nimport { useSelect } from '@wordpress/data';\nimport { useMemo } from '@wordpress/element';\nimport { store as coreStore } from '@wordpress/core-data';\n\n/**\n * Internal dependencies\n */\n\nimport { unlock } from '../../private-apis';\nimport { mergeBaseAndUserConfigs } from '../global-styles/global-styles-provider';\nimport EditorCanvasContainer from '../editor-canvas-container';\n\nconst { ExperimentalBlockEditorProvider, useGlobalStylesOutputWithConfig } =\n\tunlock( blockEditorPrivateApis );\n\nfunction Revisions( { onClose, userConfig, blocks } ) {\n\tconst { baseConfig } = useSelect(\n\t\t( select ) => ( {\n\t\t\tbaseConfig:\n\t\t\t\tselect(\n\t\t\t\t\tcoreStore\n\t\t\t\t).__experimentalGetCurrentThemeBaseGlobalStyles(),\n\t\t} ),\n\t\t[]\n\t);\n\n\tconst mergedConfig = useMemo( () => {\n\t\tif ( ! isEmpty( userConfig ) && ! isEmpty( baseConfig ) ) {\n\t\t\treturn mergeBaseAndUserConfigs( baseConfig, userConfig );\n\t\t}\n\t\treturn {};\n\t}, [ baseConfig, userConfig ] );\n\n\tconst renderedBlocksArray = useMemo(\n\t\t() => ( Array.isArray( blocks ) ? blocks : [ blocks ] ),\n\t\t[ blocks ]\n\t);\n\n\tconst originalSettings = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings(),\n\t\t[]\n\t);\n\tconst settings = useMemo(\n\t\t() => ( { ...originalSettings, __unstableIsPreviewMode: true } ),\n\t\t[ originalSettings ]\n\t);\n\n\tconst [ globalStyles ] = useGlobalStylesOutputWithConfig( mergedConfig );\n\n\tconst editorStyles =\n\t\t! isEmpty( globalStyles ) && ! isEmpty( userConfig )\n\t\t\t? globalStyles\n\t\t\t: settings.styles;\n\n\treturn (\n\t\t<EditorCanvasContainer\n\t\t\ttitle={ __( 'Revisions' ) }\n\t\t\tonClose={ onClose }\n\t\t\tcloseButtonLabel={ __( 'Close revisions' ) }\n\t\t\tenableResizing={ true }\n\t\t>\n\t\t\t<Iframe\n\t\t\t\tclassName=\"edit-site-revisions__iframe\"\n\t\t\t\tname=\"revisions\"\n\t\t\t\ttabIndex={ 0 }\n\t\t\t>\n\t\t\t\t<EditorStyles styles={ editorStyles } />\n\t\t\t\t<style>\n\t\t\t\t\t{\n\t\t\t\t\t\t// Forming a \"block formatting context\" to prevent margin collapsing.\n\t\t\t\t\t\t// @see https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Block_formatting_context\n\t\t\t\t\t\t`.is-root-container { display: flow-root; } body { position: relative; padding: 32px; }`\n\t\t\t\t\t}\n\t\t\t\t</style>\n\t\t\t\t<Disabled className=\"edit-site-revisions__example-preview__content\">\n\t\t\t\t\t<ExperimentalBlockEditorProvider\n\t\t\t\t\t\tvalue={ renderedBlocksArray }\n\t\t\t\t\t\tsettings={ settings }\n\t\t\t\t\t>\n\t\t\t\t\t\t<BlockList renderAppender={ false } />\n\t\t\t\t\t</ExperimentalBlockEditorProvider>\n\t\t\t\t</Disabled>\n\t\t\t</Iframe>\n\t\t</EditorCanvasContainer>\n\t);\n}\n\nexport default Revisions;\n"]}

package/build-module/components/routes/link.js

@@ -5,11 +5,16 @@ import { createElement } from "@wordpress/element";
  * WordPress dependencies
  */
 import { addQueryArgs, getQueryArgs, removeQueryArgs } from '@wordpress/url';
+import { privateApis as routerPrivateApis } from '@wordpress/router';
 /**
  * Internal dependencies
  */
 
-import { useHistory } from './index';
+import { unlock } from '../../private-apis';
+import { isPreviewingTheme, currentlyPreviewingTheme } from '../../utils/is-previewing-theme';
+const {
+  useHistory
+} = unlock(routerPrivateApis);
 export function useLink() {
   let params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   let state = arguments.length > 1 ? arguments[1] : undefined;
@@ -28,6 +33,13 @@ export function useLink() {
 
   const currentArgs = getQueryArgs(window.location.href);
   const currentUrlWithoutArgs = removeQueryArgs(window.location.href, ...Object.keys(currentArgs));
+
+  if (isPreviewingTheme()) {
+    params = { ...params,
+      theme_preview: currentlyPreviewingTheme()
+    };
+  }
+
   const newUrl = addQueryArgs(currentUrlWithoutArgs, params);
   return {
     href: newUrl,

package/build-module/components/routes/link.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/routes/link.js"],"names":["addQueryArgs","getQueryArgs","removeQueryArgs","useHistory","useLink","params","state","shouldReplace","history","onClick","event","preventDefault","replace","push","currentArgs","window","location","href","currentUrlWithoutArgs","Object","keys","newUrl","Link","children","props"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,YAAT,EAAuBC,YAAvB,EAAqCC,eAArC,QAA4D,gBAA5D;AAEA;AACA;AACA;;AACA,SAASC,UAAT,QAA2B,SAA3B;AAEA,OAAO,SAASC,OAAT,GAA8D;AAAA,MAA5CC,MAA4C,uEAAnC,EAAmC;AAAA,MAA/BC,KAA+B;AAAA,MAAxBC,aAAwB,uEAAR,KAAQ;AACpE,QAAMC,OAAO,GAAGL,UAAU,EAA1B;;AAEA,WAASM,OAAT,CAAkBC,KAAlB,EAA0B;AACzBA,IAAAA,KAAK,CAACC,cAAN;;AAEA,QAAKJ,aAAL,EAAqB;AACpBC,MAAAA,OAAO,CAACI,OAAR,CAAiBP,MAAjB,EAAyBC,KAAzB;AACA,KAFD,MAEO;AACNE,MAAAA,OAAO,CAACK,IAAR,CAAcR,MAAd,EAAsBC,KAAtB;AACA;AACD;;AAED,QAAMQ,WAAW,GAAGb,YAAY,CAAEc,MAAM,CAACC,QAAP,CAAgBC,IAAlB,CAAhC;AACA,QAAMC,qBAAqB,GAAGhB,eAAe,CAC5Ca,MAAM,CAACC,QAAP,CAAgBC,IAD4B,EAE5C,GAAGE,MAAM,CAACC,IAAP,CAAaN,WAAb,CAFyC,CAA7C;AAIA,QAAMO,MAAM,GAAGrB,YAAY,CAAEkB,qBAAF,EAAyBb,MAAzB,CAA3B;AAEA,SAAO;AACNY,IAAAA,IAAI,EAAEI,MADA;AAENZ,IAAAA;AAFM,GAAP;AAIA;AAED,eAAe,SAASa,IAAT,OAMX;AAAA,MAN0B;AAC7BjB,IAAAA,MAAM,GAAG,EADoB;AAE7BC,IAAAA,KAF6B;AAG7BM,IAAAA,OAAO,EAAEL,aAAa,GAAG,KAHI;AAI7BgB,IAAAA,QAJ6B;AAK7B,OAAGC;AAL0B,GAM1B;AACH,QAAM;AAAEP,IAAAA,IAAF;AAAQR,IAAAA;AAAR,MAAoBL,OAAO,CAAEC,MAAF,EAAUC,KAAV,EAAiBC,aAAjB,CAAjC;AAEA,SACC;AAAG,IAAA,IAAI,EAAGU,IAAV;AAAiB,IAAA,OAAO,EAAGR;AAA3B,KAA0Ce,KAA1C,GACGD,QADH,CADD;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { addQueryArgs, getQueryArgs, removeQueryArgs } from '@wordpress/url';\n\n/**\n * Internal dependencies\n */\nimport { useHistory } from './index';\n\nexport function useLink( params = {}, state, shouldReplace = false ) {\n\tconst history = useHistory();\n\n\tfunction onClick( event ) {\n\t\tevent.preventDefault();\n\n\t\tif ( shouldReplace ) {\n\t\t\thistory.replace( params, state );\n\t\t} else {\n\t\t\thistory.push( params, state );\n\t\t}\n\t}\n\n\tconst currentArgs = getQueryArgs( window.location.href );\n\tconst currentUrlWithoutArgs = removeQueryArgs(\n\t\twindow.location.href,\n\t\t...Object.keys( currentArgs )\n\t);\n\tconst newUrl = addQueryArgs( currentUrlWithoutArgs, params );\n\n\treturn {\n\t\thref: newUrl,\n\t\tonClick,\n\t};\n}\n\nexport default function Link( {\n\tparams = {},\n\tstate,\n\treplace: shouldReplace = false,\n\tchildren,\n\t...props\n} ) {\n\tconst { href, onClick } = useLink( params, state, shouldReplace );\n\n\treturn (\n\t\t<a href={ href } onClick={ onClick } { ...props }>\n\t\t\t{ children }\n\t\t</a>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/routes/link.js"],"names":["addQueryArgs","getQueryArgs","removeQueryArgs","privateApis","routerPrivateApis","unlock","isPreviewingTheme","currentlyPreviewingTheme","useHistory","useLink","params","state","shouldReplace","history","onClick","event","preventDefault","replace","push","currentArgs","window","location","href","currentUrlWithoutArgs","Object","keys","theme_preview","newUrl","Link","children","props"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,YAAT,EAAuBC,YAAvB,EAAqCC,eAArC,QAA4D,gBAA5D;AACA,SAASC,WAAW,IAAIC,iBAAxB,QAAiD,mBAAjD;AAEA;AACA;AACA;;AACA,SAASC,MAAT,QAAuB,oBAAvB;AACA,SACCC,iBADD,EAECC,wBAFD,QAGO,iCAHP;AAKA,MAAM;AAAEC,EAAAA;AAAF,IAAiBH,MAAM,CAAED,iBAAF,CAA7B;AAEA,OAAO,SAASK,OAAT,GAA8D;AAAA,MAA5CC,MAA4C,uEAAnC,EAAmC;AAAA,MAA/BC,KAA+B;AAAA,MAAxBC,aAAwB,uEAAR,KAAQ;AACpE,QAAMC,OAAO,GAAGL,UAAU,EAA1B;;AAEA,WAASM,OAAT,CAAkBC,KAAlB,EAA0B;AACzBA,IAAAA,KAAK,CAACC,cAAN;;AAEA,QAAKJ,aAAL,EAAqB;AACpBC,MAAAA,OAAO,CAACI,OAAR,CAAiBP,MAAjB,EAAyBC,KAAzB;AACA,KAFD,MAEO;AACNE,MAAAA,OAAO,CAACK,IAAR,CAAcR,MAAd,EAAsBC,KAAtB;AACA;AACD;;AAED,QAAMQ,WAAW,GAAGlB,YAAY,CAAEmB,MAAM,CAACC,QAAP,CAAgBC,IAAlB,CAAhC;AACA,QAAMC,qBAAqB,GAAGrB,eAAe,CAC5CkB,MAAM,CAACC,QAAP,CAAgBC,IAD4B,EAE5C,GAAGE,MAAM,CAACC,IAAP,CAAaN,WAAb,CAFyC,CAA7C;;AAKA,MAAKb,iBAAiB,EAAtB,EAA2B;AAC1BI,IAAAA,MAAM,GAAG,EACR,GAAGA,MADK;AAERgB,MAAAA,aAAa,EAAEnB,wBAAwB;AAF/B,KAAT;AAIA;;AAED,QAAMoB,MAAM,GAAG3B,YAAY,CAAEuB,qBAAF,EAAyBb,MAAzB,CAA3B;AAEA,SAAO;AACNY,IAAAA,IAAI,EAAEK,MADA;AAENb,IAAAA;AAFM,GAAP;AAIA;AAED,eAAe,SAASc,IAAT,OAMX;AAAA,MAN0B;AAC7BlB,IAAAA,MAAM,GAAG,EADoB;AAE7BC,IAAAA,KAF6B;AAG7BM,IAAAA,OAAO,EAAEL,aAAa,GAAG,KAHI;AAI7BiB,IAAAA,QAJ6B;AAK7B,OAAGC;AAL0B,GAM1B;AACH,QAAM;AAAER,IAAAA,IAAF;AAAQR,IAAAA;AAAR,MAAoBL,OAAO,CAAEC,MAAF,EAAUC,KAAV,EAAiBC,aAAjB,CAAjC;AAEA,SACC;AAAG,IAAA,IAAI,EAAGU,IAAV;AAAiB,IAAA,OAAO,EAAGR;AAA3B,KAA0CgB,KAA1C,GACGD,QADH,CADD;AAKA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { addQueryArgs, getQueryArgs, removeQueryArgs } from '@wordpress/url';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\nimport {\n\tisPreviewingTheme,\n\tcurrentlyPreviewingTheme,\n} from '../../utils/is-previewing-theme';\n\nconst { useHistory } = unlock( routerPrivateApis );\n\nexport function useLink( params = {}, state, shouldReplace = false ) {\n\tconst history = useHistory();\n\n\tfunction onClick( event ) {\n\t\tevent.preventDefault();\n\n\t\tif ( shouldReplace ) {\n\t\t\thistory.replace( params, state );\n\t\t} else {\n\t\t\thistory.push( params, state );\n\t\t}\n\t}\n\n\tconst currentArgs = getQueryArgs( window.location.href );\n\tconst currentUrlWithoutArgs = removeQueryArgs(\n\t\twindow.location.href,\n\t\t...Object.keys( currentArgs )\n\t);\n\n\tif ( isPreviewingTheme() ) {\n\t\tparams = {\n\t\t\t...params,\n\t\t\ttheme_preview: currentlyPreviewingTheme(),\n\t\t};\n\t}\n\n\tconst newUrl = addQueryArgs( currentUrlWithoutArgs, params );\n\n\treturn {\n\t\thref: newUrl,\n\t\tonClick,\n\t};\n}\n\nexport default function Link( {\n\tparams = {},\n\tstate,\n\treplace: shouldReplace = false,\n\tchildren,\n\t...props\n} ) {\n\tconst { href, onClick } = useLink( params, state, shouldReplace );\n\n\treturn (\n\t\t<a href={ href } onClick={ onClick } { ...props }>\n\t\t\t{ children }\n\t\t</a>\n\t);\n}\n"]}

package/build-module/components/routes/use-title.js

@@ -7,11 +7,15 @@ import { store as coreStore } from '@wordpress/core-data';
 import { __, sprintf } from '@wordpress/i18n';
 import { speak } from '@wordpress/a11y';
 import { decodeEntities } from '@wordpress/html-entities';
+import { privateApis as routerPrivateApis } from '@wordpress/router';
 /**
  * Internal dependencies
  */
 
-import { useLocation } from './index';
+import { unlock } from '../../private-apis';
+const {
+  useLocation
+} = unlock(routerPrivateApis);
 export default function useTitle(title) {
   const location = useLocation();
   const siteTitle = useSelect(select => {

package/build-module/components/routes/use-title.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/routes/use-title.js"],"names":["useEffect","useRef","useSelect","store","coreStore","__","sprintf","speak","decodeEntities","useLocation","useTitle","title","location","siteTitle","select","getEntityRecord","isInitialLocationRef","current","formattedTitle","document"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,KAAK,IAAIC,SAAlB,QAAmC,sBAAnC;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,KAAT,QAAsB,iBAAtB;AACA,SAASC,cAAT,QAA+B,0BAA/B;AAEA;AACA;AACA;;AACA,SAASC,WAAT,QAA4B,SAA5B;AAEA,eAAe,SAASC,QAAT,CAAmBC,KAAnB,EAA2B;AACzC,QAAMC,QAAQ,GAAGH,WAAW,EAA5B;AACA,QAAMI,SAAS,GAAGX,SAAS,CACxBY,MAAF;AAAA;;AAAA,oCACCA,MAAM,CAAEV,SAAF,CAAN,CAAoBW,eAApB,CAAqC,MAArC,EAA6C,MAA7C,CADD,0DACC,sBAAuDJ,KADxD;AAAA,GAD0B,EAG1B,EAH0B,CAA3B;AAKA,QAAMK,oBAAoB,GAAGf,MAAM,CAAE,IAAF,CAAnC;AAEAD,EAAAA,SAAS,CAAE,MAAM;AAChBgB,IAAAA,oBAAoB,CAACC,OAArB,GAA+B,KAA/B;AACA,GAFQ,EAEN,CAAEL,QAAF,CAFM,CAAT;AAIAZ,EAAAA,SAAS,CAAE,MAAM;AAChB;AACA,QAAKgB,oBAAoB,CAACC,OAA1B,EAAoC;AACnC;AACA;;AAED,QAAKN,KAAK,IAAIE,SAAd,EAA0B;AACzB;AACA,YAAMK,cAAc,GAAGZ,OAAO;AAC7B;AACAD,MAAAA,EAAE,CAAE,yBAAF,CAF2B,EAG7BG,cAAc,CAAEG,KAAF,CAHe,EAI7BH,cAAc,CAAEK,SAAF,CAJe,CAA9B;AAOAM,MAAAA,QAAQ,CAACR,KAAT,GAAiBO,cAAjB,CATyB,CAWzB;;AACAX,MAAAA,KAAK,CACJD,OAAO;AACN;AACAD,MAAAA,EAAE,CAAE,oBAAF,CAFI,EAGNc,QAAQ,CAACR,KAHH,CADH,EAMJ,WANI,CAAL;AAQA;AACD,GA3BQ,EA2BN,CAAEA,KAAF,EAASE,SAAT,EAAoBD,QAApB,CA3BM,CAAT;AA4BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { speak } from '@wordpress/a11y';\nimport { decodeEntities } from '@wordpress/html-entities';\n\n/**\n * Internal dependencies\n */\nimport { useLocation } from './index';\n\nexport default function useTitle( title ) {\n\tconst location = useLocation();\n\tconst siteTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityRecord( 'root', 'site' )?.title,\n\t\t[]\n\t);\n\tconst isInitialLocationRef = useRef( true );\n\n\tuseEffect( () => {\n\t\tisInitialLocationRef.current = false;\n\t}, [ location ] );\n\n\tuseEffect( () => {\n\t\t// Don't update or announce the title for initial page load.\n\t\tif ( isInitialLocationRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( title && siteTitle ) {\n\t\t\t// @see https://github.com/WordPress/wordpress-develop/blob/94849898192d271d533e09756007e176feb80697/src/wp-admin/admin-header.php#L67-L68\n\t\t\tconst formattedTitle = sprintf(\n\t\t\t\t/* translators: Admin screen title. 1: Admin screen name, 2: Network or site name. */\n\t\t\t\t__( '%1$s ‹ %2$s — WordPress' ),\n\t\t\t\tdecodeEntities( title ),\n\t\t\t\tdecodeEntities( siteTitle )\n\t\t\t);\n\n\t\t\tdocument.title = formattedTitle;\n\n\t\t\t// Announce title on route change for screen readers.\n\t\t\tspeak(\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: The page title that is currently displaying. */\n\t\t\t\t\t__( 'Now displaying: %s' ),\n\t\t\t\t\tdocument.title\n\t\t\t\t),\n\t\t\t\t'assertive'\n\t\t\t);\n\t\t}\n\t}, [ title, siteTitle, location ] );\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/routes/use-title.js"],"names":["useEffect","useRef","useSelect","store","coreStore","__","sprintf","speak","decodeEntities","privateApis","routerPrivateApis","unlock","useLocation","useTitle","title","location","siteTitle","select","getEntityRecord","isInitialLocationRef","current","formattedTitle","document"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,oBAAlC;AACA,SAASC,SAAT,QAA0B,iBAA1B;AACA,SAASC,KAAK,IAAIC,SAAlB,QAAmC,sBAAnC;AACA,SAASC,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AACA,SAASC,KAAT,QAAsB,iBAAtB;AACA,SAASC,cAAT,QAA+B,0BAA/B;AACA,SAASC,WAAW,IAAIC,iBAAxB,QAAiD,mBAAjD;AAEA;AACA;AACA;;AACA,SAASC,MAAT,QAAuB,oBAAvB;AAEA,MAAM;AAAEC,EAAAA;AAAF,IAAkBD,MAAM,CAAED,iBAAF,CAA9B;AAEA,eAAe,SAASG,QAAT,CAAmBC,KAAnB,EAA2B;AACzC,QAAMC,QAAQ,GAAGH,WAAW,EAA5B;AACA,QAAMI,SAAS,GAAGd,SAAS,CACxBe,MAAF;AAAA;;AAAA,oCACCA,MAAM,CAAEb,SAAF,CAAN,CAAoBc,eAApB,CAAqC,MAArC,EAA6C,MAA7C,CADD,0DACC,sBAAuDJ,KADxD;AAAA,GAD0B,EAG1B,EAH0B,CAA3B;AAKA,QAAMK,oBAAoB,GAAGlB,MAAM,CAAE,IAAF,CAAnC;AAEAD,EAAAA,SAAS,CAAE,MAAM;AAChBmB,IAAAA,oBAAoB,CAACC,OAArB,GAA+B,KAA/B;AACA,GAFQ,EAEN,CAAEL,QAAF,CAFM,CAAT;AAIAf,EAAAA,SAAS,CAAE,MAAM;AAChB;AACA,QAAKmB,oBAAoB,CAACC,OAA1B,EAAoC;AACnC;AACA;;AAED,QAAKN,KAAK,IAAIE,SAAd,EAA0B;AACzB;AACA,YAAMK,cAAc,GAAGf,OAAO;AAC7B;AACAD,MAAAA,EAAE,CAAE,yBAAF,CAF2B,EAG7BG,cAAc,CAAEM,KAAF,CAHe,EAI7BN,cAAc,CAAEQ,SAAF,CAJe,CAA9B;AAOAM,MAAAA,QAAQ,CAACR,KAAT,GAAiBO,cAAjB,CATyB,CAWzB;;AACAd,MAAAA,KAAK,CACJD,OAAO;AACN;AACAD,MAAAA,EAAE,CAAE,oBAAF,CAFI,EAGNiB,QAAQ,CAACR,KAHH,CADH,EAMJ,WANI,CAAL;AAQA;AACD,GA3BQ,EA2BN,CAAEA,KAAF,EAASE,SAAT,EAAoBD,QAApB,CA3BM,CAAT;AA4BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { speak } from '@wordpress/a11y';\nimport { decodeEntities } from '@wordpress/html-entities';\nimport { privateApis as routerPrivateApis } from '@wordpress/router';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../private-apis';\n\nconst { useLocation } = unlock( routerPrivateApis );\n\nexport default function useTitle( title ) {\n\tconst location = useLocation();\n\tconst siteTitle = useSelect(\n\t\t( select ) =>\n\t\t\tselect( coreStore ).getEntityRecord( 'root', 'site' )?.title,\n\t\t[]\n\t);\n\tconst isInitialLocationRef = useRef( true );\n\n\tuseEffect( () => {\n\t\tisInitialLocationRef.current = false;\n\t}, [ location ] );\n\n\tuseEffect( () => {\n\t\t// Don't update or announce the title for initial page load.\n\t\tif ( isInitialLocationRef.current ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( title && siteTitle ) {\n\t\t\t// @see https://github.com/WordPress/wordpress-develop/blob/94849898192d271d533e09756007e176feb80697/src/wp-admin/admin-header.php#L67-L68\n\t\t\tconst formattedTitle = sprintf(\n\t\t\t\t/* translators: Admin screen title. 1: Admin screen name, 2: Network or site name. */\n\t\t\t\t__( '%1$s ‹ %2$s — WordPress' ),\n\t\t\t\tdecodeEntities( title ),\n\t\t\t\tdecodeEntities( siteTitle )\n\t\t\t);\n\n\t\t\tdocument.title = formattedTitle;\n\n\t\t\t// Announce title on route change for screen readers.\n\t\t\tspeak(\n\t\t\t\tsprintf(\n\t\t\t\t\t/* translators: The page title that is currently displaying. */\n\t\t\t\t\t__( 'Now displaying: %s' ),\n\t\t\t\t\tdocument.title\n\t\t\t\t),\n\t\t\t\t'assertive'\n\t\t\t);\n\t\t}\n\t}, [ title, siteTitle, location ] );\n}\n"]}

package/build-module/components/save-button/index.js

@@ -13,7 +13,14 @@ import { displayShortcut } from '@wordpress/keycodes';
  */
 
 import { store as editSiteStore } from '../../store';
-export default function SaveButton() {
+import { isPreviewingTheme } from '../../utils/is-previewing-theme';
+export default function SaveButton(_ref) {
+  let {
+    className = 'edit-site-save-button__button',
+    variant = 'primary',
+    showTooltip = true,
+    icon
+  } = _ref;
   const {
     isDirty,
     isSaving,
@@ -38,13 +45,27 @@ export default function SaveButton() {
   const {
     setIsSaveViewOpened
   } = useDispatch(editSiteStore);
-  const disabled = !isDirty || isSaving;
+  const activateSaveEnabled = isPreviewingTheme() || isDirty;
+  const disabled = isSaving || !activateSaveEnabled;
 
-  const label = __('Save');
+  const getLabel = () => {
+    if (disabled) {
+      return __('Saved');
+    }
 
+    if (isPreviewingTheme() && isDirty) {
+      return __('Activate & Save');
+    } else if (isPreviewingTheme()) {
+      return __('Activate');
+    }
+
+    return __('Save');
+  };
+
+  const label = getLabel();
   return createElement(Button, {
-    variant: "primary",
-    className: "edit-site-save-button__button",
+    variant: variant,
+    className: className,
     "aria-disabled": disabled,
     "aria-expanded": isSaveViewOpen,
     isBusy: isSaving,
@@ -63,7 +84,8 @@ export default function SaveButton() {
      & the tooltip is always rendered even when there's no keyboard shortcut.
      */
     ,
-    showTooltip: true
+    showTooltip: showTooltip,
+    icon: icon
   }, label);
 }
 //# sourceMappingURL=index.js.map

package/build-module/components/save-button/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/save-button/index.js"],"names":["useSelect","useDispatch","Button","__","store","coreStore","displayShortcut","editSiteStore","SaveButton","isDirty","isSaving","isSaveViewOpen","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","dirtyEntityRecords","isSaveViewOpened","length","some","record","kind","name","key","setIsSaveViewOpened","disabled","label","undefined","primary"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AACA,SAASC,MAAT,QAAuB,uBAAvB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,KAAK,IAAIC,SAAlB,QAAmC,sBAAnC;AACA,SAASC,eAAT,QAAgC,qBAAhC;AAEA;AACA;AACA;;AACA,SAASF,KAAK,IAAIG,aAAlB,QAAuC,aAAvC;AAEA,eAAe,SAASC,UAAT,GAAsB;AACpC,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,QAAX;AAAqBC,IAAAA;AAArB,MAAwCX,SAAS,CAAIY,MAAF,IAAc;AACtE,UAAM;AAAEC,MAAAA,mCAAF;AAAuCC,MAAAA;AAAvC,QACLF,MAAM,CAAEP,SAAF,CADP;;AAEA,UAAMU,kBAAkB,GAAGF,mCAAmC,EAA9D;;AACA,UAAM;AAAEG,MAAAA;AAAF,QAAuBJ,MAAM,CAAEL,aAAF,CAAnC;AACA,WAAO;AACNE,MAAAA,OAAO,EAAEM,kBAAkB,CAACE,MAAnB,GAA4B,CAD/B;AAENP,MAAAA,QAAQ,EAAEK,kBAAkB,CAACG,IAAnB,CAA2BC,MAAF,IAClCL,oBAAoB,CAAEK,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNX,MAAAA,cAAc,EAAEK,gBAAgB;AAL1B,KAAP;AAOA,GAZsD,EAYpD,EAZoD,CAAvD;AAaA,QAAM;AAAEO,IAAAA;AAAF,MAA0BtB,WAAW,CAAEM,aAAF,CAA3C;AAEA,QAAMiB,QAAQ,GAAG,CAAEf,OAAF,IAAaC,QAA9B;;AAEA,QAAMe,KAAK,GAAGtB,EAAE,CAAE,MAAF,CAAhB;;AAEA,SACC,cAAC,MAAD;AACC,IAAA,OAAO,EAAC,SADT;AAEC,IAAA,SAAS,EAAC,+BAFX;AAGC,qBAAgBqB,QAHjB;AAIC,qBAAgBb,cAJjB;AAKC,IAAA,MAAM,EAAGD,QALV;AAMC,IAAA,OAAO,EAAGc,QAAQ,GAAGE,SAAH,GAAe,MAAMH,mBAAmB,CAAE,IAAF,CAN3D;AAOC,IAAA,KAAK,EAAGE;AACR;AACH;AACA;AACA;AAXE;AAYC,IAAA,QAAQ,EAAGD,QAAQ,GAAGE,SAAH,GAAepB,eAAe,CAACqB,OAAhB,CAAyB,GAAzB;AAClC;AACH;AACA;AACA;AACA;AACA;AAlBE;AAmBC,IAAA,WAAW;AAnBZ,KAqBGF,KArBH,CADD;AAyBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\n\nexport default function SaveButton() {\n\tconst { isDirty, isSaving, isSaveViewOpen } = useSelect( ( select ) => {\n\t\tconst { __experimentalGetDirtyEntityRecords, isSavingEntityRecord } =\n\t\t\tselect( coreStore );\n\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\tconst { isSaveViewOpened } = select( editSiteStore );\n\t\treturn {\n\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t),\n\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t};\n\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\n\tconst disabled = ! isDirty || isSaving;\n\n\tconst label = __( 'Save' );\n\n\treturn (\n\t\t<Button\n\t\t\tvariant=\"primary\"\n\t\t\tclassName=\"edit-site-save-button__button\"\n\t\t\taria-disabled={ disabled }\n\t\t\taria-expanded={ isSaveViewOpen }\n\t\t\tisBusy={ isSaving }\n\t\t\tonClick={ disabled ? undefined : () => setIsSaveViewOpened( true ) }\n\t\t\tlabel={ label }\n\t\t\t/*\n\t\t\t * We want the tooltip to show the keyboard shortcut only when the\n\t\t\t * button does something, i.e. when it's not disabled.\n\t\t\t */\n\t\t\tshortcut={ disabled ? undefined : displayShortcut.primary( 's' ) }\n\t\t\t/*\n\t\t\t * Displaying the keyboard shortcut conditionally makes the tooltip\n\t\t\t * itself show conditionally. This would trigger a full-rerendering\n\t\t\t * of the button that we want to avoid. By setting `showTooltip`,\n\t\t\t & the tooltip is always rendered even when there's no keyboard shortcut.\n\t\t\t */\n\t\t\tshowTooltip\n\t\t>\n\t\t\t{ label }\n\t\t</Button>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/save-button/index.js"],"names":["useSelect","useDispatch","Button","__","store","coreStore","displayShortcut","editSiteStore","isPreviewingTheme","SaveButton","className","variant","showTooltip","icon","isDirty","isSaving","isSaveViewOpen","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","dirtyEntityRecords","isSaveViewOpened","length","some","record","kind","name","key","setIsSaveViewOpened","activateSaveEnabled","disabled","getLabel","label","undefined","primary"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AACA,SAASC,MAAT,QAAuB,uBAAvB;AACA,SAASC,EAAT,QAAmB,iBAAnB;AACA,SAASC,KAAK,IAAIC,SAAlB,QAAmC,sBAAnC;AACA,SAASC,eAAT,QAAgC,qBAAhC;AAEA;AACA;AACA;;AACA,SAASF,KAAK,IAAIG,aAAlB,QAAuC,aAAvC;AACA,SAASC,iBAAT,QAAkC,iCAAlC;AAEA,eAAe,SAASC,UAAT,OAKX;AAAA,MALgC;AACnCC,IAAAA,SAAS,GAAG,+BADuB;AAEnCC,IAAAA,OAAO,GAAG,SAFyB;AAGnCC,IAAAA,WAAW,GAAG,IAHqB;AAInCC,IAAAA;AAJmC,GAKhC;AACH,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,QAAX;AAAqBC,IAAAA;AAArB,MAAwChB,SAAS,CAAIiB,MAAF,IAAc;AACtE,UAAM;AAAEC,MAAAA,mCAAF;AAAuCC,MAAAA;AAAvC,QACLF,MAAM,CAAEZ,SAAF,CADP;;AAEA,UAAMe,kBAAkB,GAAGF,mCAAmC,EAA9D;;AACA,UAAM;AAAEG,MAAAA;AAAF,QAAuBJ,MAAM,CAAEV,aAAF,CAAnC;AACA,WAAO;AACNO,MAAAA,OAAO,EAAEM,kBAAkB,CAACE,MAAnB,GAA4B,CAD/B;AAENP,MAAAA,QAAQ,EAAEK,kBAAkB,CAACG,IAAnB,CAA2BC,MAAF,IAClCL,oBAAoB,CAAEK,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNX,MAAAA,cAAc,EAAEK,gBAAgB;AAL1B,KAAP;AAOA,GAZsD,EAYpD,EAZoD,CAAvD;AAaA,QAAM;AAAEO,IAAAA;AAAF,MAA0B3B,WAAW,CAAEM,aAAF,CAA3C;AAEA,QAAMsB,mBAAmB,GAAGrB,iBAAiB,MAAMM,OAAnD;AACA,QAAMgB,QAAQ,GAAGf,QAAQ,IAAI,CAAEc,mBAA/B;;AAEA,QAAME,QAAQ,GAAG,MAAM;AACtB,QAAKD,QAAL,EAAgB;AACf,aAAO3B,EAAE,CAAE,OAAF,CAAT;AACA;;AAED,QAAKK,iBAAiB,MAAMM,OAA5B,EAAsC;AACrC,aAAOX,EAAE,CAAE,iBAAF,CAAT;AACA,KAFD,MAEO,IAAKK,iBAAiB,EAAtB,EAA2B;AACjC,aAAOL,EAAE,CAAE,UAAF,CAAT;AACA;;AAED,WAAOA,EAAE,CAAE,MAAF,CAAT;AACA,GAZD;;AAaA,QAAM6B,KAAK,GAAGD,QAAQ,EAAtB;AAEA,SACC,cAAC,MAAD;AACC,IAAA,OAAO,EAAGpB,OADX;AAEC,IAAA,SAAS,EAAGD,SAFb;AAGC,qBAAgBoB,QAHjB;AAIC,qBAAgBd,cAJjB;AAKC,IAAA,MAAM,EAAGD,QALV;AAMC,IAAA,OAAO,EAAGe,QAAQ,GAAGG,SAAH,GAAe,MAAML,mBAAmB,CAAE,IAAF,CAN3D;AAOC,IAAA,KAAK,EAAGI;AACR;AACH;AACA;AACA;AAXE;AAYC,IAAA,QAAQ,EAAGF,QAAQ,GAAGG,SAAH,GAAe3B,eAAe,CAAC4B,OAAhB,CAAyB,GAAzB;AAClC;AACH;AACA;AACA;AACA;AACA;AAlBE;AAmBC,IAAA,WAAW,EAAGtB,WAnBf;AAoBC,IAAA,IAAI,EAAGC;AApBR,KAsBGmB,KAtBH,CADD;AA0BA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Button } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut } from '@wordpress/keycodes';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\nimport { isPreviewingTheme } from '../../utils/is-previewing-theme';\n\nexport default function SaveButton( {\n\tclassName = 'edit-site-save-button__button',\n\tvariant = 'primary',\n\tshowTooltip = true,\n\ticon,\n} ) {\n\tconst { isDirty, isSaving, isSaveViewOpen } = useSelect( ( select ) => {\n\t\tconst { __experimentalGetDirtyEntityRecords, isSavingEntityRecord } =\n\t\t\tselect( coreStore );\n\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\tconst { isSaveViewOpened } = select( editSiteStore );\n\t\treturn {\n\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t),\n\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t};\n\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\n\tconst activateSaveEnabled = isPreviewingTheme() || isDirty;\n\tconst disabled = isSaving || ! activateSaveEnabled;\n\n\tconst getLabel = () => {\n\t\tif ( disabled ) {\n\t\t\treturn __( 'Saved' );\n\t\t}\n\n\t\tif ( isPreviewingTheme() && isDirty ) {\n\t\t\treturn __( 'Activate & Save' );\n\t\t} else if ( isPreviewingTheme() ) {\n\t\t\treturn __( 'Activate' );\n\t\t}\n\n\t\treturn __( 'Save' );\n\t};\n\tconst label = getLabel();\n\n\treturn (\n\t\t<Button\n\t\t\tvariant={ variant }\n\t\t\tclassName={ className }\n\t\t\taria-disabled={ disabled }\n\t\t\taria-expanded={ isSaveViewOpen }\n\t\t\tisBusy={ isSaving }\n\t\t\tonClick={ disabled ? undefined : () => setIsSaveViewOpened( true ) }\n\t\t\tlabel={ label }\n\t\t\t/*\n\t\t\t * We want the tooltip to show the keyboard shortcut only when the\n\t\t\t * button does something, i.e. when it's not disabled.\n\t\t\t */\n\t\t\tshortcut={ disabled ? undefined : displayShortcut.primary( 's' ) }\n\t\t\t/*\n\t\t\t * Displaying the keyboard shortcut conditionally makes the tooltip\n\t\t\t * itself show conditionally. This would trigger a full-rerendering\n\t\t\t * of the button that we want to avoid. By setting `showTooltip`,\n\t\t\t & the tooltip is always rendered even when there's no keyboard shortcut.\n\t\t\t */\n\t\t\tshowTooltip={ showTooltip }\n\t\t\ticon={ icon }\n\t\t>\n\t\t\t{ label }\n\t\t</Button>\n\t);\n}\n"]}

package/build-module/components/save-hub/index.js

@@ -3,23 +3,22 @@ import { createElement } from "@wordpress/element";
 /**
  * WordPress dependencies
  */
-import { useSelect, useDispatch } from '@wordpress/data';
-import { Button, __experimentalHStack as HStack } from '@wordpress/components';
-import { sprintf, __, _n } from '@wordpress/i18n';
+import { useSelect } from '@wordpress/data';
+import { __experimentalHStack as HStack } from '@wordpress/components';
+import { sprintf, _n } from '@wordpress/i18n';
 import { store as coreStore } from '@wordpress/core-data';
-import { displayShortcut } from '@wordpress/keycodes';
 import { check } from '@wordpress/icons';
 /**
  * Internal dependencies
  */
 
-import { store as editSiteStore } from '../../store';
-export default function SaveButton() {
+import SaveButton from '../save-button';
+import { isPreviewingTheme } from '../../utils/is-previewing-theme';
+export default function SaveHub() {
   const {
     countUnsavedChanges,
     isDirty,
-    isSaving,
-    isSaveViewOpen
+    isSaving
   } = useSelect(select => {
     const {
       __experimentalGetDirtyEntityRecords,
@@ -28,41 +27,23 @@ export default function SaveButton() {
 
     const dirtyEntityRecords = __experimentalGetDirtyEntityRecords();
 
-    const {
-      isSaveViewOpened
-    } = select(editSiteStore);
     return {
       isDirty: dirtyEntityRecords.length > 0,
       isSaving: dirtyEntityRecords.some(record => isSavingEntityRecord(record.kind, record.name, record.key)),
-      isSaveViewOpen: isSaveViewOpened(),
       countUnsavedChanges: dirtyEntityRecords.length
     };
   }, []);
-  const {
-    setIsSaveViewOpened
-  } = useDispatch(editSiteStore);
-  const disabled = !isDirty || isSaving;
-  const label = disabled ? __('Saved') : __('Save');
+  const disabled = isSaving || !isDirty && !isPreviewingTheme();
   return createElement(HStack, {
     className: "edit-site-save-hub",
     alignment: "right",
     spacing: 4
   }, isDirty && createElement("span", null, sprintf( // translators: %d: number of unsaved changes (number).
-  _n('%d unsaved change', '%d unsaved changes', countUnsavedChanges), countUnsavedChanges)), createElement(Button, {
+  _n('%d unsaved change', '%d unsaved changes', countUnsavedChanges), countUnsavedChanges)), createElement(SaveButton, {
     className: "edit-site-save-hub__button",
-    variant: disabled ? undefined : 'primary',
-    "aria-disabled": disabled,
-    "aria-expanded": isSaveViewOpen,
-    isBusy: isSaving,
-    onClick: disabled ? undefined : () => setIsSaveViewOpened(true),
-    label: label
-    /*
-     * We want the tooltip to show the keyboard shortcut only when the
-     * button does something, i.e. when it's not disabled.
-     */
-    ,
-    shortcut: disabled ? undefined : displayShortcut.primary('s'),
-    icon: disabled ? check : undefined
-  }, label));
+    variant: disabled ? null : 'primary',
+    showTooltip: false,
+    icon: disabled ? check : null
+  }));
 }
 //# sourceMappingURL=index.js.map

package/build-module/components/save-hub/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/edit-site/src/components/save-hub/index.js"],"names":["useSelect","useDispatch","Button","__experimentalHStack","HStack","sprintf","__","_n","store","coreStore","displayShortcut","check","editSiteStore","SaveButton","countUnsavedChanges","isDirty","isSaving","isSaveViewOpen","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","dirtyEntityRecords","isSaveViewOpened","length","some","record","kind","name","key","setIsSaveViewOpened","disabled","label","undefined","primary"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,WAApB,QAAuC,iBAAvC;AACA,SAASC,MAAT,EAAiBC,oBAAoB,IAAIC,MAAzC,QAAuD,uBAAvD;AACA,SAASC,OAAT,EAAkBC,EAAlB,EAAsBC,EAAtB,QAAgC,iBAAhC;AACA,SAASC,KAAK,IAAIC,SAAlB,QAAmC,sBAAnC;AACA,SAASC,eAAT,QAAgC,qBAAhC;AACA,SAASC,KAAT,QAAsB,kBAAtB;AAEA;AACA;AACA;;AACA,SAASH,KAAK,IAAII,aAAlB,QAAuC,aAAvC;AAEA,eAAe,SAASC,UAAT,GAAsB;AACpC,QAAM;AAAEC,IAAAA,mBAAF;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA,QAAhC;AAA0CC,IAAAA;AAA1C,MACLjB,SAAS,CAAIkB,MAAF,IAAc;AACxB,UAAM;AACLC,MAAAA,mCADK;AAELC,MAAAA;AAFK,QAGFF,MAAM,CAAET,SAAF,CAHV;;AAIA,UAAMY,kBAAkB,GAAGF,mCAAmC,EAA9D;;AACA,UAAM;AAAEG,MAAAA;AAAF,QAAuBJ,MAAM,CAAEN,aAAF,CAAnC;AACA,WAAO;AACNG,MAAAA,OAAO,EAAEM,kBAAkB,CAACE,MAAnB,GAA4B,CAD/B;AAENP,MAAAA,QAAQ,EAAEK,kBAAkB,CAACG,IAAnB,CAA2BC,MAAF,IAClCL,oBAAoB,CAAEK,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNX,MAAAA,cAAc,EAAEK,gBAAgB,EAL1B;AAMNR,MAAAA,mBAAmB,EAAEO,kBAAkB,CAACE;AANlC,KAAP;AAQA,GAfQ,EAeN,EAfM,CADV;AAiBA,QAAM;AAAEM,IAAAA;AAAF,MAA0B5B,WAAW,CAAEW,aAAF,CAA3C;AAEA,QAAMkB,QAAQ,GAAG,CAAEf,OAAF,IAAaC,QAA9B;AAEA,QAAMe,KAAK,GAAGD,QAAQ,GAAGxB,EAAE,CAAE,OAAF,CAAL,GAAmBA,EAAE,CAAE,MAAF,CAA3C;AAEA,SACC,cAAC,MAAD;AAAQ,IAAA,SAAS,EAAC,oBAAlB;AAAuC,IAAA,SAAS,EAAC,OAAjD;AAAyD,IAAA,OAAO,EAAG;AAAnE,KACGS,OAAO,IACR,4BACGV,OAAO,EACR;AACAE,EAAAA,EAAE,CACD,mBADC,EAED,oBAFC,EAGDO,mBAHC,CAFM,EAORA,mBAPQ,CADV,CAFF,EAcC,cAAC,MAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,OAAO,EAAGgB,QAAQ,GAAGE,SAAH,GAAe,SAFlC;AAGC,qBAAgBF,QAHjB;AAIC,qBAAgBb,cAJjB;AAKC,IAAA,MAAM,EAAGD,QALV;AAMC,IAAA,OAAO,EACNc,QAAQ,GAAGE,SAAH,GAAe,MAAMH,mBAAmB,CAAE,IAAF,CAPlD;AASC,IAAA,KAAK,EAAGE;AACR;AACJ;AACA;AACA;AAbG;AAcC,IAAA,QAAQ,EACPD,QAAQ,GAAGE,SAAH,GAAetB,eAAe,CAACuB,OAAhB,CAAyB,GAAzB,CAfzB;AAiBC,IAAA,IAAI,EAAGH,QAAQ,GAAGnB,KAAH,GAAWqB;AAjB3B,KAmBGD,KAnBH,CAdD,CADD;AAsCA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { Button, __experimentalHStack as HStack } from '@wordpress/components';\nimport { sprintf, __, _n } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { displayShortcut } from '@wordpress/keycodes';\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { store as editSiteStore } from '../../store';\n\nexport default function SaveButton() {\n\tconst { countUnsavedChanges, isDirty, isSaving, isSaveViewOpen } =\n\t\tuseSelect( ( select ) => {\n\t\t\tconst {\n\t\t\t\t__experimentalGetDirtyEntityRecords,\n\t\t\t\tisSavingEntityRecord,\n\t\t\t} = select( coreStore );\n\t\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\t\tconst { isSaveViewOpened } = select( editSiteStore );\n\t\t\treturn {\n\t\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t\t),\n\t\t\t\tisSaveViewOpen: isSaveViewOpened(),\n\t\t\t\tcountUnsavedChanges: dirtyEntityRecords.length,\n\t\t\t};\n\t\t}, [] );\n\tconst { setIsSaveViewOpened } = useDispatch( editSiteStore );\n\n\tconst disabled = ! isDirty || isSaving;\n\n\tconst label = disabled ? __( 'Saved' ) : __( 'Save' );\n\n\treturn (\n\t\t<HStack className=\"edit-site-save-hub\" alignment=\"right\" spacing={ 4 }>\n\t\t\t{ isDirty && (\n\t\t\t\t<span>\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t// translators: %d: number of unsaved changes (number).\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d unsaved change',\n\t\t\t\t\t\t\t'%d unsaved changes',\n\t\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t\t),\n\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t) }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t<Button\n\t\t\t\tclassName=\"edit-site-save-hub__button\"\n\t\t\t\tvariant={ disabled ? undefined : 'primary' }\n\t\t\t\taria-disabled={ disabled }\n\t\t\t\taria-expanded={ isSaveViewOpen }\n\t\t\t\tisBusy={ isSaving }\n\t\t\t\tonClick={\n\t\t\t\t\tdisabled ? undefined : () => setIsSaveViewOpened( true )\n\t\t\t\t}\n\t\t\t\tlabel={ label }\n\t\t\t\t/*\n\t\t\t\t * We want the tooltip to show the keyboard shortcut only when the\n\t\t\t\t * button does something, i.e. when it's not disabled.\n\t\t\t\t */\n\t\t\t\tshortcut={\n\t\t\t\t\tdisabled ? undefined : displayShortcut.primary( 's' )\n\t\t\t\t}\n\t\t\t\ticon={ disabled ? check : undefined }\n\t\t\t>\n\t\t\t\t{ label }\n\t\t\t</Button>\n\t\t</HStack>\n\t);\n}\n"]}
+{"version":3,"sources":["@wordpress/edit-site/src/components/save-hub/index.js"],"names":["useSelect","__experimentalHStack","HStack","sprintf","_n","store","coreStore","check","SaveButton","isPreviewingTheme","SaveHub","countUnsavedChanges","isDirty","isSaving","select","__experimentalGetDirtyEntityRecords","isSavingEntityRecord","dirtyEntityRecords","length","some","record","kind","name","key","disabled"],"mappings":";;AAAA;AACA;AACA;AACA,SAASA,SAAT,QAA0B,iBAA1B;AACA,SAASC,oBAAoB,IAAIC,MAAjC,QAA+C,uBAA/C;AACA,SAASC,OAAT,EAAkBC,EAAlB,QAA4B,iBAA5B;AACA,SAASC,KAAK,IAAIC,SAAlB,QAAmC,sBAAnC;AACA,SAASC,KAAT,QAAsB,kBAAtB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,gBAAvB;AACA,SAASC,iBAAT,QAAkC,iCAAlC;AAEA,eAAe,SAASC,OAAT,GAAmB;AACjC,QAAM;AAAEC,IAAAA,mBAAF;AAAuBC,IAAAA,OAAvB;AAAgCC,IAAAA;AAAhC,MAA6Cb,SAAS,CACzDc,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,mCADK;AAELC,MAAAA;AAFK,QAGFF,MAAM,CAAER,SAAF,CAHV;;AAIA,UAAMW,kBAAkB,GAAGF,mCAAmC,EAA9D;;AACA,WAAO;AACNH,MAAAA,OAAO,EAAEK,kBAAkB,CAACC,MAAnB,GAA4B,CAD/B;AAENL,MAAAA,QAAQ,EAAEI,kBAAkB,CAACE,IAAnB,CAA2BC,MAAF,IAClCJ,oBAAoB,CAAEI,MAAM,CAACC,IAAT,EAAeD,MAAM,CAACE,IAAtB,EAA4BF,MAAM,CAACG,GAAnC,CADX,CAFJ;AAKNZ,MAAAA,mBAAmB,EAAEM,kBAAkB,CAACC;AALlC,KAAP;AAOA,GAd0D,EAe3D,EAf2D,CAA5D;AAkBA,QAAMM,QAAQ,GAAGX,QAAQ,IAAM,CAAED,OAAF,IAAa,CAAEH,iBAAiB,EAA/D;AAEA,SACC,cAAC,MAAD;AAAQ,IAAA,SAAS,EAAC,oBAAlB;AAAuC,IAAA,SAAS,EAAC,OAAjD;AAAyD,IAAA,OAAO,EAAG;AAAnE,KACGG,OAAO,IACR,4BACGT,OAAO,EACR;AACAC,EAAAA,EAAE,CACD,mBADC,EAED,oBAFC,EAGDO,mBAHC,CAFM,EAORA,mBAPQ,CADV,CAFF,EAcC,cAAC,UAAD;AACC,IAAA,SAAS,EAAC,4BADX;AAEC,IAAA,OAAO,EAAGa,QAAQ,GAAG,IAAH,GAAU,SAF7B;AAGC,IAAA,WAAW,EAAG,KAHf;AAIC,IAAA,IAAI,EAAGA,QAAQ,GAAGjB,KAAH,GAAW;AAJ3B,IAdD,CADD;AAuBA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { __experimentalHStack as HStack } from '@wordpress/components';\nimport { sprintf, _n } from '@wordpress/i18n';\nimport { store as coreStore } from '@wordpress/core-data';\nimport { check } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport SaveButton from '../save-button';\nimport { isPreviewingTheme } from '../../utils/is-previewing-theme';\n\nexport default function SaveHub() {\n\tconst { countUnsavedChanges, isDirty, isSaving } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\t__experimentalGetDirtyEntityRecords,\n\t\t\t\tisSavingEntityRecord,\n\t\t\t} = select( coreStore );\n\t\t\tconst dirtyEntityRecords = __experimentalGetDirtyEntityRecords();\n\t\t\treturn {\n\t\t\t\tisDirty: dirtyEntityRecords.length > 0,\n\t\t\t\tisSaving: dirtyEntityRecords.some( ( record ) =>\n\t\t\t\t\tisSavingEntityRecord( record.kind, record.name, record.key )\n\t\t\t\t),\n\t\t\t\tcountUnsavedChanges: dirtyEntityRecords.length,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tconst disabled = isSaving || ( ! isDirty && ! isPreviewingTheme() );\n\n\treturn (\n\t\t<HStack className=\"edit-site-save-hub\" alignment=\"right\" spacing={ 4 }>\n\t\t\t{ isDirty && (\n\t\t\t\t<span>\n\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t// translators: %d: number of unsaved changes (number).\n\t\t\t\t\t\t_n(\n\t\t\t\t\t\t\t'%d unsaved change',\n\t\t\t\t\t\t\t'%d unsaved changes',\n\t\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t\t),\n\t\t\t\t\t\tcountUnsavedChanges\n\t\t\t\t\t) }\n\t\t\t\t</span>\n\t\t\t) }\n\t\t\t<SaveButton\n\t\t\t\tclassName=\"edit-site-save-hub__button\"\n\t\t\t\tvariant={ disabled ? null : 'primary' }\n\t\t\t\tshowTooltip={ false }\n\t\t\t\ticon={ disabled ? check : null }\n\t\t\t/>\n\t\t</HStack>\n\t);\n}\n"]}