@wordpress/block-editor 14.7.0 → 14.7.1-next.082ed6819.0

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

@@ -9,7 +9,7 @@ import clsx from 'clsx';
  */
 import { useState, createPortal, forwardRef, useMemo, useEffect, useRef } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
-import { useResizeObserver, useMergeRefs, useRefEffect, useDisabled } from '@wordpress/compose';
+import { useResizeObserver, useMergeRefs, useRefEffect, useDisabled, useReducedMotion } from '@wordpress/compose';
 import { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';
 import { useSelect } from '@wordpress/data';
 
@@ -117,6 +117,7 @@ function Iframe({
     styles = '',
     scripts = ''
   } = resolvedAssets;
+  /** @type {[Document, import('react').Dispatch<Document>]} */
   const [iframeDocument, setIframeDocument] = useState();
   const initialContainerWidthRef = useRef(0);
   const [bodyClasses, setBodyClasses] = useState([]);
@@ -128,6 +129,7 @@ function Iframe({
   const [containerResizeListener, {
     width: containerWidth
   }] = useResizeObserver();
+  const prefersReducedMotion = useReducedMotion();
   const setRef = useRefEffect(node => {
     node._load = () => {
       setIframeDocument(node.contentDocument);
@@ -221,6 +223,12 @@ function Iframe({
     }
   }, [containerWidth, isZoomedOut]);
   const scaleContainerWidth = Math.max(initialContainerWidthRef.current, containerWidth);
+  const frameSizeValue = parseInt(frameSize);
+  const maxWidth = 750;
+  const scaleValue = scale === 'auto-scaled' ? (Math.min(containerWidth, maxWidth) - frameSizeValue * 2) / scaleContainerWidth : scale;
+  const prevScaleRef = useRef(scaleValue);
+  const prevFrameSizeRef = useRef(frameSizeValue);
+  const prevClientHeightRef = useRef(/* Initialized in the useEffect. */);
   const disabledRef = useDisabled({
     isDisabled: !readonly
   });
@@ -266,37 +274,132 @@ function Iframe({
     return [_src, () => URL.revokeObjectURL(_src)];
   }, [html]);
   useEffect(() => cleanup, [cleanup]);
-  const zoomOutAnimationClassnameRef = useRef(null);
+  useEffect(() => {
+    var _prevClientHeightRef$;
+    if (!iframeDocument ||
+    // HACK: Checking if isZoomedOut differs from prevIsZoomedOut here
+    // instead of the dependency array to appease the linter.
+    scaleValue === 1 === (prevScaleRef.current === 1)) {
+      return;
+    }
+
+    // Unscaled height of the current iframe container.
+    const clientHeight = iframeDocument.documentElement.clientHeight;
+
+    // Scaled height of the current iframe content.
+    const scrollHeight = iframeDocument.documentElement.scrollHeight;
+
+    // Previous scale value.
+    const prevScale = prevScaleRef.current;
+
+    // Unscaled size of the previous padding around the iframe content.
+    const prevFrameSize = prevFrameSizeRef.current;
+
+    // Unscaled height of the previous iframe container.
+    const prevClientHeight = (_prevClientHeightRef$ = prevClientHeightRef.current) !== null && _prevClientHeightRef$ !== void 0 ? _prevClientHeightRef$ : clientHeight;
+
+    // We can't trust the set value from contentHeight, as it was measured
+    // before the zoom out mode was changed. After zoom out mode is changed,
+    // appenders may appear or disappear, so we need to get the height from
+    // the iframe at this point when we're about to animate the zoom out.
+    // The iframe scrollTop, scrollHeight, and clientHeight will all be
+    // accurate. The client height also does change when the zoom out mode
+    // is toggled, as the bottom bar about selecting the template is
+    // added/removed when toggling zoom out mode.
+    const scrollTop = iframeDocument.documentElement.scrollTop;
+
+    // Step 0: Start with the current scrollTop.
+    let scrollTopNext = scrollTop;
+
+    // Step 1: Undo the effects of the previous scale and frame around the
+    // midpoint of the visible area.
+    scrollTopNext = (scrollTopNext + prevClientHeight / 2 - prevFrameSize) / prevScale - prevClientHeight / 2;
+
+    // Step 2: Apply the new scale and frame around the midpoint of the
+    // visible area.
+    scrollTopNext = (scrollTopNext + clientHeight / 2) * scaleValue + frameSizeValue - clientHeight / 2;
+
+    // Step 3: Handle an edge case so that you scroll to the top of the
+    // iframe if the top of the iframe content is visible in the container.
+    // The same edge case for the bottom is skipped because changing content
+    // makes calculating it impossible.
+    scrollTopNext = scrollTop <= prevFrameSize ? 0 : scrollTopNext;
+
+    // This is the scrollTop value if you are scrolled to the bottom of the
+    // iframe. We can't just let the browser handle it because we need to
+    // animate the scaling.
+    const maxScrollTop = scrollHeight * (scaleValue / prevScale) + frameSizeValue * 2 - clientHeight;
+
+    // Step 4: Clamp the scrollTopNext between the minimum and maximum
+    // possible scrollTop positions. Round the value to avoid subpixel
+    // truncation by the browser which sometimes causes a 1px error.
+    scrollTopNext = Math.round(Math.min(Math.max(0, scrollTopNext), Math.max(0, maxScrollTop)));
+    iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scroll-top', `${scrollTop}px`);
+    iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scroll-top-next', `${scrollTopNext}px`);
+    iframeDocument.documentElement.classList.add('zoom-out-animation');
+    function onZoomOutTransitionEnd() {
+      // Remove the position fixed for the animation.
+      iframeDocument.documentElement.classList.remove('zoom-out-animation');
+
+      // Update previous values.
+      prevClientHeightRef.current = clientHeight;
+      prevFrameSizeRef.current = frameSizeValue;
+      prevScaleRef.current = scaleValue;
+
+      // Set the final scroll position that was just animated to.
+      // Disable reason: Eslint isn't smart enough to know that this is a
+      // DOM element. https://github.com/facebook/react/issues/31483
+      // eslint-disable-next-line react-compiler/react-compiler
+      iframeDocument.documentElement.scrollTop = scrollTopNext;
+    }
+    let raf;
+    if (prefersReducedMotion) {
+      // Hack: Wait for the window values to recalculate.
+      raf = iframeDocument.defaultView.requestAnimationFrame(onZoomOutTransitionEnd);
+    } else {
+      iframeDocument.documentElement.addEventListener('transitionend', onZoomOutTransitionEnd, {
+        once: true
+      });
+    }
+    return () => {
+      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scroll-top');
+      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scroll-top-next');
+      iframeDocument.documentElement.classList.remove('zoom-out-animation');
+      if (prefersReducedMotion) {
+        iframeDocument.defaultView.cancelAnimationFrame(raf);
+      } else {
+        iframeDocument.documentElement.removeEventListener('transitionend', onZoomOutTransitionEnd);
+      }
+    };
+  }, [iframeDocument, scaleValue, frameSizeValue, prefersReducedMotion]);
 
   // Toggle zoom out CSS Classes only when zoom out mode changes. We could add these into the useEffect
   // that controls settings the CSS variables, but then we would need to do more work to ensure we're
   // only toggling these when the zoom out mode changes, as that useEffect is also triggered by a large
   // number of dependencies.
   useEffect(() => {
-    if (!iframeDocument || !isZoomedOut) {
+    if (!iframeDocument) {
       return;
     }
-    const handleZoomOutAnimationClassname = () => {
-      clearTimeout(zoomOutAnimationClassnameRef.current);
-      iframeDocument.documentElement.classList.add('zoom-out-animation');
-      zoomOutAnimationClassnameRef.current = setTimeout(() => {
-        iframeDocument.documentElement.classList.remove('zoom-out-animation');
-      }, 400); // 400ms should match the animation speed used in components/iframe/content.scss
-    };
-    handleZoomOutAnimationClassname();
-    iframeDocument.documentElement.classList.add('is-zoomed-out');
-    return () => {
-      handleZoomOutAnimationClassname();
+    if (isZoomedOut) {
+      iframeDocument.documentElement.classList.add('is-zoomed-out');
+    } else {
+      // HACK: Since we can't remove this in the cleanup, we need to do it here.
       iframeDocument.documentElement.classList.remove('is-zoomed-out');
+    }
+    return () => {
+      // HACK: Skipping cleanup because it causes issues with the zoom out
+      // animation. More refactoring is needed to fix this properly.
+      // iframeDocument.documentElement.classList.remove( 'is-zoomed-out' );
     };
   }, [iframeDocument, isZoomedOut]);
 
   // Calculate the scaling and CSS variables for the zoom out canvas
   useEffect(() => {
-    if (!iframeDocument || !isZoomedOut) {
+    if (!iframeDocument) {
       return;
     }
-    const maxWidth = 750;
+
     // Note: When we initialize the zoom out when the canvas is smaller (sidebars open),
     // initialContainerWidthRef will be smaller than the full page, and reflow will happen
     // when the canvas area becomes larger due to sidebars closing. This is a known but
@@ -305,7 +408,7 @@ function Iframe({
     // This scaling calculation has to happen within the JS because CSS calc() can
     // only divide and multiply by a unitless value. I.e. calc( 100px / 2 ) is valid
     // but calc( 100px / 2px ) is not.
-    iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale', scale === 'auto-scaled' ? (Math.min(containerWidth, maxWidth) - parseInt(frameSize) * 2) / scaleContainerWidth : scale);
+    iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale', scaleValue);
 
     // frameSize has to be a px value for the scaling and frame size to be computed correctly.
     iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-frame-size', typeof frameSize === 'number' ? `${frameSize}px` : frameSize);
@@ -314,14 +417,28 @@ function Iframe({
     iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-container-width', `${containerWidth}px`);
     iframeDocument.documentElement.style.setProperty('--wp-block-editor-iframe-zoom-out-scale-container-width', `${scaleContainerWidth}px`);
     return () => {
-      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scale');
-      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-frame-size');
-      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-content-height');
-      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-inner-height');
-      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-container-width');
-      iframeDocument.documentElement.style.removeProperty('--wp-block-editor-iframe-zoom-out-scale-container-width');
+      // HACK: Skipping cleanup because it causes issues with the zoom out
+      // animation. More refactoring is needed to fix this properly.
+      // iframeDocument.documentElement.style.removeProperty(
+      // 	'--wp-block-editor-iframe-zoom-out-scale'
+      // );
+      // iframeDocument.documentElement.style.removeProperty(
+      // 	'--wp-block-editor-iframe-zoom-out-frame-size'
+      // );
+      // iframeDocument.documentElement.style.removeProperty(
+      // 	'--wp-block-editor-iframe-zoom-out-content-height'
+      // );
+      // iframeDocument.documentElement.style.removeProperty(
+      // 	'--wp-block-editor-iframe-zoom-out-inner-height'
+      // );
+      // iframeDocument.documentElement.style.removeProperty(
+      // 	'--wp-block-editor-iframe-zoom-out-container-width'
+      // );
+      // iframeDocument.documentElement.style.removeProperty(
+      // 	'--wp-block-editor-iframe-zoom-out-scale-container-width'
+      // );
     };
-  }, [scale, frameSize, iframeDocument, iframeWindowInnerHeight, contentHeight, containerWidth, windowInnerWidth, isZoomedOut, scaleContainerWidth]);
+  }, [scaleValue, frameSize, iframeDocument, iframeWindowInnerHeight, contentHeight, containerWidth, windowInnerWidth, isZoomedOut, scaleContainerWidth]);
 
   // Make sure to not render the before and after focusable div elements in view
   // mode. They're only needed to capture focus in edit mode.

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

@@ -1 +1 @@
-{"version":3,"names":["clsx","useState","createPortal","forwardRef","useMemo","useEffect","useRef","__","useResizeObserver","useMergeRefs","useRefEffect","useDisabled","__experimentalStyleProvider","StyleProvider","useSelect","useBlockSelectionClearer","useWritingFlow","getCompatibilityStyles","store","blockEditorStore","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","bubbleEvent","event","Constructor","frame","init","key","contentDocument","defaultView","MouseEvent","rect","getBoundingClientRect","clientX","left","clientY","top","newEvent","type","defaultPrevented","preventDefault","cancelled","dispatchEvent","useBubbleEvents","iframeDocument","frameElement","html","documentElement","eventTypes","handlers","name","prototype","Object","getPrototypeOf","constructorName","constructor","window","addEventListener","removeEventListener","Iframe","contentRef","children","tabIndex","scale","frameSize","readonly","forwardedRef","ref","title","props","resolvedAssets","isPreviewMode","select","getSettings","settings","__unstableResolvedAssets","styles","scripts","setIframeDocument","initialContainerWidthRef","bodyClasses","setBodyClasses","clearerRef","before","writingFlowRef","after","contentResizeListener","height","contentHeight","containerResizeListener","width","containerWidth","setRef","node","_load","iFrameDocument","preventFileDropDefault","onLoad","ownerDocument","classList","add","Array","from","body","filter","startsWith","dir","compatStyle","getElementById","id","head","appendChild","cloneNode","console","warn","target","tagName","href","getAttribute","location","hash","slice","iframeWindowInnerHeight","setIframeWindowInnerHeight","iframeResizeRef","nodeWindow","innerHeight","onResize","windowInnerWidth","setWindowInnerWidth","windowResizeRef","innerWidth","isZoomedOut","current","scaleContainerWidth","Math","max","disabledRef","isDisabled","bodyRef","origin","src","cleanup","_src","URL","createObjectURL","Blob","revokeObjectURL","zoomOutAnimationClassnameRef","handleZoomOutAnimationClassname","clearTimeout","setTimeout","remove","maxWidth","style","setProperty","min","parseInt","removeProperty","shouldRenderFocusCaptureElements","iframe","border","onKeyDown","currentTarget","stopPropagation","nativeEvent","KeyboardEvent","className","document","IframeIfReady","isInitialised","__internalIsInitialized"],"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tcreatePortal,\n\tforwardRef,\n\tuseMemo,\n\tuseEffect,\n\tuseRef,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseResizeObserver,\n\tuseMergeRefs,\n\tuseRefEffect,\n\tuseDisabled,\n} from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\nimport { getCompatibilityStyles } from './get-compatibility-styles';\nimport { store as blockEditorStore } from '../../store';\n\nfunction bubbleEvent( event, Constructor, frame ) {\n\tconst init = {};\n\n\tfor ( const key in event ) {\n\t\tinit[ key ] = event[ key ];\n\t}\n\n\t// Check if the event is a MouseEvent generated within the iframe.\n\t// If so, adjust the coordinates to be relative to the position of\n\t// the iframe. This ensures that components such as Draggable\n\t// receive coordinates relative to the window, instead of relative\n\t// to the iframe. Without this, the Draggable event handler would\n\t// result in components \"jumping\" position as soon as the user\n\t// drags over the iframe.\n\tif ( event instanceof frame.contentDocument.defaultView.MouseEvent ) {\n\t\tconst rect = frame.getBoundingClientRect();\n\t\tinit.clientX += rect.left;\n\t\tinit.clientY += rect.top;\n\t}\n\n\tconst newEvent = new Constructor( event.type, init );\n\tif ( init.defaultPrevented ) {\n\t\tnewEvent.preventDefault();\n\t}\n\tconst cancelled = ! frame.dispatchEvent( newEvent );\n\n\tif ( cancelled ) {\n\t\tevent.preventDefault();\n\t}\n}\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} iframeDocument Document to attach listeners to.\n */\nfunction useBubbleEvents( iframeDocument ) {\n\treturn useRefEffect( () => {\n\t\tconst { defaultView } = iframeDocument;\n\t\tif ( ! defaultView ) {\n\t\t\treturn;\n\t\t}\n\t\tconst { frameElement } = defaultView;\n\t\tconst html = iframeDocument.documentElement;\n\t\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\t\tconst handlers = {};\n\t\tfor ( const name of eventTypes ) {\n\t\t\thandlers[ name ] = ( event ) => {\n\t\t\t\tconst prototype = Object.getPrototypeOf( event );\n\t\t\t\tconst constructorName = prototype.constructor.name;\n\t\t\t\tconst Constructor = window[ constructorName ];\n\t\t\t\tbubbleEvent( event, Constructor, frameElement );\n\t\t\t};\n\t\t\thtml.addEventListener( name, handlers[ name ] );\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor ( const name of eventTypes ) {\n\t\t\t\thtml.removeEventListener( name, handlers[ name ] );\n\t\t\t}\n\t\t};\n\t} );\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\treadonly,\n\tforwardedRef: ref,\n\ttitle = __( 'Editor canvas' ),\n\t...props\n} ) {\n\tconst { resolvedAssets, isPreviewMode } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst settings = getSettings();\n\t\treturn {\n\t\t\tresolvedAssets: settings.__unstableResolvedAssets,\n\t\t\tisPreviewMode: settings.isPreviewMode,\n\t\t};\n\t}, [] );\n\tconst { styles = '', scripts = '' } = resolvedAssets;\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst initialContainerWidthRef = useRef( 0 );\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [ containerResizeListener, { width: containerWidth } ] =\n\t\tuseResizeObserver();\n\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tnode._load = () => {\n\t\t\tsetIframeDocument( node.contentDocument );\n\t\t};\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\tfunction onLoad() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\n\t\t\tdocumentElement.classList.add( 'block-editor-iframe__html' );\n\n\t\t\tclearerRef( documentElement );\n\n\t\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t\t// the server in the future (which will run the PHP filters).\n\t\t\tsetBodyClasses(\n\t\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t\t( name ) =>\n\t\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\n\t\t\tfor ( const compatStyle of getCompatibilityStyles() ) {\n\t\t\t\tif ( contentDocument.getElementById( compatStyle.id ) ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tcontentDocument.head.appendChild(\n\t\t\t\t\tcompatStyle.cloneNode( true )\n\t\t\t\t);\n\n\t\t\t\tif ( ! isPreviewMode ) {\n\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`${ compatStyle.id } was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`,\n\t\t\t\t\t\tcompatStyle\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\t// Prevent clicks on links from navigating away. Note that links\n\t\t\t// inside `contenteditable` are already disabled by the browser, so\n\t\t\t// this is for links in blocks outside of `contenteditable`.\n\t\t\tiFrameDocument.addEventListener( 'click', ( event ) => {\n\t\t\t\tif ( event.target.tagName === 'A' ) {\n\t\t\t\t\tevent.preventDefault();\n\n\t\t\t\t\t// Appending a hash to the current URL will not reload the\n\t\t\t\t\t// page. This is useful for e.g. footnotes.\n\t\t\t\t\tconst href = event.target.getAttribute( 'href' );\n\t\t\t\t\tif ( href.startsWith( '#' ) ) {\n\t\t\t\t\t\tiFrameDocument.defaultView.location.hash =\n\t\t\t\t\t\t\thref.slice( 1 );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\n\t\tnode.addEventListener( 'load', onLoad );\n\n\t\treturn () => {\n\t\t\tdelete node._load;\n\t\t\tnode.removeEventListener( 'load', onLoad );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t};\n\t}, [] );\n\n\tconst [ iframeWindowInnerHeight, setIframeWindowInnerHeight ] = useState();\n\n\tconst iframeResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\tconst onResize = () => {\n\t\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst [ windowInnerWidth, setWindowInnerWidth ] = useState();\n\n\tconst windowResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\tconst onResize = () => {\n\t\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst isZoomedOut = scale !== 1;\n\n\tuseEffect( () => {\n\t\tif ( ! isZoomedOut ) {\n\t\t\tinitialContainerWidthRef.current = containerWidth;\n\t\t}\n\t}, [ containerWidth, isZoomedOut ] );\n\n\tconst scaleContainerWidth = Math.max(\n\t\tinitialContainerWidthRef.current,\n\t\tcontainerWidth\n\t);\n\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\tconst bodyRef = useMergeRefs( [\n\t\tuseBubbleEvents( iframeDocument ),\n\t\tcontentRef,\n\t\tclearerRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t\t// Avoid resize listeners when not needed, these will trigger\n\t\t// unnecessary re-renders when animating the iframe width, or when\n\t\t// expanding preview iframes.\n\t\tisZoomedOut ? iframeResizeRef : null,\n\t] );\n\n\t// Correct doctype is required to enable rendering in standards\n\t// mode. Also preload the styles to avoid a flash of unstyled\n\t// content.\n\tconst html = `<!doctype html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<base href=\"${ window.location.origin }\">\n\t\t<script>window.frameElement._load()</script>\n\t\t<style>\n\t\t\thtml{\n\t\t\t\theight: auto !important;\n\t\t\t\tmin-height: 100%;\n\t\t\t}\n\t\t\t/* Lowest specificity to not override global styles */\n\t\t\t:where(body) {\n\t\t\t\tmargin: 0;\n\t\t\t\t/* Default background color in case zoom out mode background\n\t\t\t\tcolors the html element */\n\t\t\t\tbackground-color: white;\n\t\t\t}\n\t\t</style>\n\t\t${ styles }\n\t\t${ scripts }\n\t</head>\n\t<body>\n\t\t<script>document.currentScript.parentElement.remove()</script>\n\t</body>\n</html>`;\n\n\tconst [ src, cleanup ] = useMemo( () => {\n\t\tconst _src = URL.createObjectURL(\n\t\t\tnew window.Blob( [ html ], { type: 'text/html' } )\n\t\t);\n\t\treturn [ _src, () => URL.revokeObjectURL( _src ) ];\n\t}, [ html ] );\n\n\tuseEffect( () => cleanup, [ cleanup ] );\n\n\tconst zoomOutAnimationClassnameRef = useRef( null );\n\n\t// Toggle zoom out CSS Classes only when zoom out mode changes. We could add these into the useEffect\n\t// that controls settings the CSS variables, but then we would need to do more work to ensure we're\n\t// only toggling these when the zoom out mode changes, as that useEffect is also triggered by a large\n\t// number of dependencies.\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument || ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst handleZoomOutAnimationClassname = () => {\n\t\t\tclearTimeout( zoomOutAnimationClassnameRef.current );\n\n\t\t\tiframeDocument.documentElement.classList.add(\n\t\t\t\t'zoom-out-animation'\n\t\t\t);\n\n\t\t\tzoomOutAnimationClassnameRef.current = setTimeout( () => {\n\t\t\t\tiframeDocument.documentElement.classList.remove(\n\t\t\t\t\t'zoom-out-animation'\n\t\t\t\t);\n\t\t\t}, 400 ); // 400ms should match the animation speed used in components/iframe/content.scss\n\t\t};\n\n\t\thandleZoomOutAnimationClassname();\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\n\t\treturn () => {\n\t\t\thandleZoomOutAnimationClassname();\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t// Calculate the scaling and CSS variables for the zoom out canvas\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument || ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tconst maxWidth = 750;\n\t\t// Note: When we initialize the zoom out when the canvas is smaller (sidebars open),\n\t\t// initialContainerWidthRef will be smaller than the full page, and reflow will happen\n\t\t// when the canvas area becomes larger due to sidebars closing. This is a known but\n\t\t// minor divergence for now.\n\n\t\t// This scaling calculation has to happen within the JS because CSS calc() can\n\t\t// only divide and multiply by a unitless value. I.e. calc( 100px / 2 ) is valid\n\t\t// but calc( 100px / 2px ) is not.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\tscale === 'auto-scaled'\n\t\t\t\t? ( Math.min( containerWidth, maxWidth ) -\n\t\t\t\t\t\tparseInt( frameSize ) * 2 ) /\n\t\t\t\t\t\tscaleContainerWidth\n\t\t\t\t: scale\n\t\t);\n\n\t\t// frameSize has to be a px value for the scaling and frame size to be computed correctly.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\ttypeof frameSize === 'number' ? `${ frameSize }px` : frameSize\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t`${ contentHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t`${ iframeWindowInnerHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t`${ containerWidth }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t`${ scaleContainerWidth }px`\n\t\t);\n\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width'\n\t\t\t);\n\t\t};\n\t}, [\n\t\tscale,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tiframeWindowInnerHeight,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\twindowInnerWidth,\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t] );\n\n\t// Make sure to not render the before and after focusable div elements in view\n\t// mode. They're only needed to capture focus in edit mode.\n\tconst shouldRenderFocusCaptureElements = tabIndex >= 0 && ! isPreviewMode;\n\n\tconst iframe = (\n\t\t<>\n\t\t\t{ shouldRenderFocusCaptureElements && before }\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: props.style?.height,\n\t\t\t\t\tborder: 0,\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards\n\t\t\t\t// mode. Also preload the styles to avoid a flash of unstyled\n\t\t\t\t// content.\n\t\t\t\tsrc={ src }\n\t\t\t\ttitle={ title }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif ( props.onKeyDown ) {\n\t\t\t\t\t\tprops.onKeyDown( event );\n\t\t\t\t\t}\n\t\t\t\t\t// If the event originates from inside the iframe, it means\n\t\t\t\t\t// it bubbled through the portal, but only with React\n\t\t\t\t\t// events. We need to to bubble native events as well,\n\t\t\t\t\t// though by doing so we also trigger another React event,\n\t\t\t\t\t// so we need to stop the propagation of this event to avoid\n\t\t\t\t\t// duplication.\n\t\t\t\t\tif (\n\t\t\t\t\t\tevent.currentTarget.ownerDocument !==\n\t\t\t\t\t\tevent.target.ownerDocument\n\t\t\t\t\t) {\n\t\t\t\t\t\t// We should only stop propagation of the React event,\n\t\t\t\t\t\t// the native event should further bubble inside the\n\t\t\t\t\t\t// iframe to the document and window.\n\t\t\t\t\t\t// Alternatively, we could consider redispatching the\n\t\t\t\t\t\t// native event in the iframe.\n\t\t\t\t\t\tconst { stopPropagation } = event.nativeEvent;\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = () => {};\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = stopPropagation;\n\t\t\t\t\t\tbubbleEvent(\n\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\twindow.KeyboardEvent,\n\t\t\t\t\t\t\tevent.currentTarget\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t// We want to prevent React events from bubbling throught the iframe\n\t\t\t\t\t\t// we bubble these manually.\n\t\t\t\t\t\t/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */\n\t\t\t\t\t\t<body\n\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ contentResizeListener }\n\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t</body>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ shouldRenderFocusCaptureElements && after }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<div className=\"block-editor-iframe__container\" ref={ windowResizeRef }>\n\t\t\t{ containerResizeListener }\n\t\t\t<div\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-iframe__scale-container',\n\t\t\t\t\tisZoomedOut && 'is-zoomed-out'\n\t\t\t\t) }\n\t\t\t\tstyle={ {\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width':\n\t\t\t\t\t\tisZoomedOut && `${ scaleContainerWidth }px`,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframe }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialised.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"],"mappings":";AAAA;AACA;AACA;AACA,OAAOA,IAAI,MAAM,MAAM;;AAEvB;AACA;AACA;AACA,SACCC,QAAQ,EACRC,YAAY,EACZC,UAAU,EACVC,OAAO,EACPC,SAAS,EACTC,MAAM,QACA,oBAAoB;AAC3B,SAASC,EAAE,QAAQ,iBAAiB;AACpC,SACCC,iBAAiB,EACjBC,YAAY,EACZC,YAAY,EACZC,WAAW,QACL,oBAAoB;AAC3B,SAASC,2BAA2B,IAAIC,aAAa,QAAQ,uBAAuB;AACpF,SAASC,SAAS,QAAQ,iBAAiB;;AAE3C;AACA;AACA;AACA,SAASC,wBAAwB,QAAQ,4BAA4B;AACrE,SAASC,cAAc,QAAQ,iBAAiB;AAChD,SAASC,sBAAsB,QAAQ,4BAA4B;AACnE,SAASC,KAAK,IAAIC,gBAAgB,QAAQ,aAAa;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;AAExD,SAASC,WAAWA,CAAEC,KAAK,EAAEC,WAAW,EAAEC,KAAK,EAAG;EACjD,MAAMC,IAAI,GAAG,CAAC,CAAC;EAEf,KAAM,MAAMC,GAAG,IAAIJ,KAAK,EAAG;IAC1BG,IAAI,CAAEC,GAAG,CAAE,GAAGJ,KAAK,CAAEI,GAAG,CAAE;EAC3B;;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,IAAKJ,KAAK,YAAYE,KAAK,CAACG,eAAe,CAACC,WAAW,CAACC,UAAU,EAAG;IACpE,MAAMC,IAAI,GAAGN,KAAK,CAACO,qBAAqB,CAAC,CAAC;IAC1CN,IAAI,CAACO,OAAO,IAAIF,IAAI,CAACG,IAAI;IACzBR,IAAI,CAACS,OAAO,IAAIJ,IAAI,CAACK,GAAG;EACzB;EAEA,MAAMC,QAAQ,GAAG,IAAIb,WAAW,CAAED,KAAK,CAACe,IAAI,EAAEZ,IAAK,CAAC;EACpD,IAAKA,IAAI,CAACa,gBAAgB,EAAG;IAC5BF,QAAQ,CAACG,cAAc,CAAC,CAAC;EAC1B;EACA,MAAMC,SAAS,GAAG,CAAEhB,KAAK,CAACiB,aAAa,CAAEL,QAAS,CAAC;EAEnD,IAAKI,SAAS,EAAG;IAChBlB,KAAK,CAACiB,cAAc,CAAC,CAAC;EACvB;AACD;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASG,eAAeA,CAAEC,cAAc,EAAG;EAC1C,OAAOtC,YAAY,CAAE,MAAM;IAC1B,MAAM;MAAEuB;IAAY,CAAC,GAAGe,cAAc;IACtC,IAAK,CAAEf,WAAW,EAAG;MACpB;IACD;IACA,MAAM;MAAEgB;IAAa,CAAC,GAAGhB,WAAW;IACpC,MAAMiB,IAAI,GAAGF,cAAc,CAACG,eAAe;IAC3C,MAAMC,UAAU,GAAG,CAAE,UAAU,EAAE,WAAW,CAAE;IAC9C,MAAMC,QAAQ,GAAG,CAAC,CAAC;IACnB,KAAM,MAAMC,IAAI,IAAIF,UAAU,EAAG;MAChCC,QAAQ,CAAEC,IAAI,CAAE,GAAK3B,KAAK,IAAM;QAC/B,MAAM4B,SAAS,GAAGC,MAAM,CAACC,cAAc,CAAE9B,KAAM,CAAC;QAChD,MAAM+B,eAAe,GAAGH,SAAS,CAACI,WAAW,CAACL,IAAI;QAClD,MAAM1B,WAAW,GAAGgC,MAAM,CAAEF,eAAe,CAAE;QAC7ChC,WAAW,CAAEC,KAAK,EAAEC,WAAW,EAAEqB,YAAa,CAAC;MAChD,CAAC;MACDC,IAAI,CAACW,gBAAgB,CAAEP,IAAI,EAAED,QAAQ,CAAEC,IAAI,CAAG,CAAC;IAChD;IAEA,OAAO,MAAM;MACZ,KAAM,MAAMA,IAAI,IAAIF,UAAU,EAAG;QAChCF,IAAI,CAACY,mBAAmB,CAAER,IAAI,EAAED,QAAQ,CAAEC,IAAI,CAAG,CAAC;MACnD;IACD,CAAC;EACF,CAAE,CAAC;AACJ;AAEA,SAASS,MAAMA,CAAE;EAChBC,UAAU;EACVC,QAAQ;EACRC,QAAQ,GAAG,CAAC;EACZC,KAAK,GAAG,CAAC;EACTC,SAAS,GAAG,CAAC;EACbC,QAAQ;EACRC,YAAY,EAAEC,GAAG;EACjBC,KAAK,GAAGjE,EAAE,CAAE,eAAgB,CAAC;EAC7B,GAAGkE;AACJ,CAAC,EAAG;EACH,MAAM;IAAEC,cAAc;IAAEC;EAAc,CAAC,GAAG7D,SAAS,CAAI8D,MAAM,IAAM;IAClE,MAAM;MAAEC;IAAY,CAAC,GAAGD,MAAM,CAAEzD,gBAAiB,CAAC;IAClD,MAAM2D,QAAQ,GAAGD,WAAW,CAAC,CAAC;IAC9B,OAAO;MACNH,cAAc,EAAEI,QAAQ,CAACC,wBAAwB;MACjDJ,aAAa,EAAEG,QAAQ,CAACH;IACzB,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EACP,MAAM;IAAEK,MAAM,GAAG,EAAE;IAAEC,OAAO,GAAG;EAAG,CAAC,GAAGP,cAAc;EACpD,MAAM,CAAE1B,cAAc,EAAEkC,iBAAiB,CAAE,GAAGjF,QAAQ,CAAC,CAAC;EACxD,MAAMkF,wBAAwB,GAAG7E,MAAM,CAAE,CAAE,CAAC;EAC5C,MAAM,CAAE8E,WAAW,EAAEC,cAAc,CAAE,GAAGpF,QAAQ,CAAE,EAAG,CAAC;EACtD,MAAMqF,UAAU,GAAGvE,wBAAwB,CAAC,CAAC;EAC7C,MAAM,CAAEwE,MAAM,EAAEC,cAAc,EAAEC,KAAK,CAAE,GAAGzE,cAAc,CAAC,CAAC;EAC1D,MAAM,CAAE0E,qBAAqB,EAAE;IAAEC,MAAM,EAAEC;EAAc,CAAC,CAAE,GACzDpF,iBAAiB,CAAC,CAAC;EACpB,MAAM,CAAEqF,uBAAuB,EAAE;IAAEC,KAAK,EAAEC;EAAe,CAAC,CAAE,GAC3DvF,iBAAiB,CAAC,CAAC;EAEpB,MAAMwF,MAAM,GAAGtF,YAAY,CAAIuF,IAAI,IAAM;IACxCA,IAAI,CAACC,KAAK,GAAG,MAAM;MAClBhB,iBAAiB,CAAEe,IAAI,CAACjE,eAAgB,CAAC;IAC1C,CAAC;IACD,IAAImE,cAAc;IAClB;IACA,SAASC,sBAAsBA,CAAEzE,KAAK,EAAG;MACxCA,KAAK,CAACiB,cAAc,CAAC,CAAC;IACvB;IACA,SAASyD,MAAMA,CAAA,EAAG;MACjB,MAAM;QAAErE,eAAe;QAAEsE;MAAc,CAAC,GAAGL,IAAI;MAC/C,MAAM;QAAE9C;MAAgB,CAAC,GAAGnB,eAAe;MAC3CmE,cAAc,GAAGnE,eAAe;MAEhCmB,eAAe,CAACoD,SAAS,CAACC,GAAG,CAAE,2BAA4B,CAAC;MAE5DlB,UAAU,CAAEnC,eAAgB,CAAC;;MAE7B;MACA;MACA;MACAkC,cAAc,CACboB,KAAK,CAACC,IAAI,CAAEJ,aAAa,CAACK,IAAI,CAACJ,SAAU,CAAC,CAACK,MAAM,CAC9CtD,IAAI,IACLA,IAAI,CAACuD,UAAU,CAAE,cAAe,CAAC,IACjCvD,IAAI,CAACuD,UAAU,CAAE,YAAa,CAAC,IAC/BvD,IAAI,KAAK,qBACX,CACD,CAAC;MAEDtB,eAAe,CAAC8E,GAAG,GAAGR,aAAa,CAACQ,GAAG;MAEvC,KAAM,MAAMC,WAAW,IAAI9F,sBAAsB,CAAC,CAAC,EAAG;QACrD,IAAKe,eAAe,CAACgF,cAAc,CAAED,WAAW,CAACE,EAAG,CAAC,EAAG;UACvD;QACD;QAEAjF,eAAe,CAACkF,IAAI,CAACC,WAAW,CAC/BJ,WAAW,CAACK,SAAS,CAAE,IAAK,CAC7B,CAAC;QAED,IAAK,CAAEzC,aAAa,EAAG;UACtB;UACA0C,OAAO,CAACC,IAAI,CACX,GAAIP,WAAW,CAACE,EAAE,kHAAmH,EACrIF,WACD,CAAC;QACF;MACD;MAEAZ,cAAc,CAACtC,gBAAgB,CAC9B,UAAU,EACVuC,sBAAsB,EACtB,KACD,CAAC;MACDD,cAAc,CAACtC,gBAAgB,CAC9B,MAAM,EACNuC,sBAAsB,EACtB,KACD,CAAC;MACD;MACA;MACA;MACAD,cAAc,CAACtC,gBAAgB,CAAE,OAAO,EAAIlC,KAAK,IAAM;QACtD,IAAKA,KAAK,CAAC4F,MAAM,CAACC,OAAO,KAAK,GAAG,EAAG;UACnC7F,KAAK,CAACiB,cAAc,CAAC,CAAC;;UAEtB;UACA;UACA,MAAM6E,IAAI,GAAG9F,KAAK,CAAC4F,MAAM,CAACG,YAAY,CAAE,MAAO,CAAC;UAChD,IAAKD,IAAI,CAACZ,UAAU,CAAE,GAAI,CAAC,EAAG;YAC7BV,cAAc,CAAClE,WAAW,CAAC0F,QAAQ,CAACC,IAAI,GACvCH,IAAI,CAACI,KAAK,CAAE,CAAE,CAAC;UACjB;QACD;MACD,CAAE,CAAC;IACJ;IAEA5B,IAAI,CAACpC,gBAAgB,CAAE,MAAM,EAAEwC,MAAO,CAAC;IAEvC,OAAO,MAAM;MACZ,OAAOJ,IAAI,CAACC,KAAK;MACjBD,IAAI,CAACnC,mBAAmB,CAAE,MAAM,EAAEuC,MAAO,CAAC;MAC1CF,cAAc,EAAErC,mBAAmB,CAClC,UAAU,EACVsC,sBACD,CAAC;MACDD,cAAc,EAAErC,mBAAmB,CAClC,MAAM,EACNsC,sBACD,CAAC;IACF,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,MAAM,CAAE0B,uBAAuB,EAAEC,0BAA0B,CAAE,GAAG9H,QAAQ,CAAC,CAAC;EAE1E,MAAM+H,eAAe,GAAGtH,YAAY,CAAIuF,IAAI,IAAM;IACjD,MAAMgC,UAAU,GAAGhC,IAAI,CAACK,aAAa,CAACrE,WAAW;IAEjD8F,0BAA0B,CAAEE,UAAU,CAACC,WAAY,CAAC;IACpD,MAAMC,QAAQ,GAAGA,CAAA,KAAM;MACtBJ,0BAA0B,CAAEE,UAAU,CAACC,WAAY,CAAC;IACrD,CAAC;IACDD,UAAU,CAACpE,gBAAgB,CAAE,QAAQ,EAAEsE,QAAS,CAAC;IACjD,OAAO,MAAM;MACZF,UAAU,CAACnE,mBAAmB,CAAE,QAAQ,EAAEqE,QAAS,CAAC;IACrD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,MAAM,CAAEC,gBAAgB,EAAEC,mBAAmB,CAAE,GAAGpI,QAAQ,CAAC,CAAC;EAE5D,MAAMqI,eAAe,GAAG5H,YAAY,CAAIuF,IAAI,IAAM;IACjD,MAAMgC,UAAU,GAAGhC,IAAI,CAACK,aAAa,CAACrE,WAAW;IAEjDoG,mBAAmB,CAAEJ,UAAU,CAACM,UAAW,CAAC;IAC5C,MAAMJ,QAAQ,GAAGA,CAAA,KAAM;MACtBE,mBAAmB,CAAEJ,UAAU,CAACM,UAAW,CAAC;IAC7C,CAAC;IACDN,UAAU,CAACpE,gBAAgB,CAAE,QAAQ,EAAEsE,QAAS,CAAC;IACjD,OAAO,MAAM;MACZF,UAAU,CAACnE,mBAAmB,CAAE,QAAQ,EAAEqE,QAAS,CAAC;IACrD,CAAC;EACF,CAAC,EAAE,EAAG,CAAC;EAEP,MAAMK,WAAW,GAAGrE,KAAK,KAAK,CAAC;EAE/B9D,SAAS,CAAE,MAAM;IAChB,IAAK,CAAEmI,WAAW,EAAG;MACpBrD,wBAAwB,CAACsD,OAAO,GAAG1C,cAAc;IAClD;EACD,CAAC,EAAE,CAAEA,cAAc,EAAEyC,WAAW,CAAG,CAAC;EAEpC,MAAME,mBAAmB,GAAGC,IAAI,CAACC,GAAG,CACnCzD,wBAAwB,CAACsD,OAAO,EAChC1C,cACD,CAAC;EAED,MAAM8C,WAAW,GAAGlI,WAAW,CAAE;IAAEmI,UAAU,EAAE,CAAEzE;EAAS,CAAE,CAAC;EAC7D,MAAM0E,OAAO,GAAGtI,YAAY,CAAE,CAC7BsC,eAAe,CAAEC,cAAe,CAAC,EACjCgB,UAAU,EACVsB,UAAU,EACVE,cAAc,EACdqD,WAAW;EACX;EACA;EACA;EACAL,WAAW,GAAGR,eAAe,GAAG,IAAI,CACnC,CAAC;;EAEH;EACA;EACA;EACA,MAAM9E,IAAI,GAAG;AACd;AACA;AACA;AACA,gBAAiBU,MAAM,CAAC+D,QAAQ,CAACqB,MAAM;AACvC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAKhE,MAAM;AACX,IAAKC,OAAO;AACZ;AACA;AACA;AACA;AACA,QAAQ;EAEP,MAAM,CAAEgE,GAAG,EAAEC,OAAO,CAAE,GAAG9I,OAAO,CAAE,MAAM;IACvC,MAAM+I,IAAI,GAAGC,GAAG,CAACC,eAAe,CAC/B,IAAIzF,MAAM,CAAC0F,IAAI,CAAE,CAAEpG,IAAI,CAAE,EAAE;MAAER,IAAI,EAAE;IAAY,CAAE,CAClD,CAAC;IACD,OAAO,CAAEyG,IAAI,EAAE,MAAMC,GAAG,CAACG,eAAe,CAAEJ,IAAK,CAAC,CAAE;EACnD,CAAC,EAAE,CAAEjG,IAAI,CAAG,CAAC;EAEb7C,SAAS,CAAE,MAAM6I,OAAO,EAAE,CAAEA,OAAO,CAAG,CAAC;EAEvC,MAAMM,4BAA4B,GAAGlJ,MAAM,CAAE,IAAK,CAAC;;EAEnD;EACA;EACA;EACA;EACAD,SAAS,CAAE,MAAM;IAChB,IAAK,CAAE2C,cAAc,IAAI,CAAEwF,WAAW,EAAG;MACxC;IACD;IAEA,MAAMiB,+BAA+B,GAAGA,CAAA,KAAM;MAC7CC,YAAY,CAAEF,4BAA4B,CAACf,OAAQ,CAAC;MAEpDzF,cAAc,CAACG,eAAe,CAACoD,SAAS,CAACC,GAAG,CAC3C,oBACD,CAAC;MAEDgD,4BAA4B,CAACf,OAAO,GAAGkB,UAAU,CAAE,MAAM;QACxD3G,cAAc,CAACG,eAAe,CAACoD,SAAS,CAACqD,MAAM,CAC9C,oBACD,CAAC;MACF,CAAC,EAAE,GAAI,CAAC,CAAC,CAAC;IACX,CAAC;IAEDH,+BAA+B,CAAC,CAAC;IACjCzG,cAAc,CAACG,eAAe,CAACoD,SAAS,CAACC,GAAG,CAAE,eAAgB,CAAC;IAE/D,OAAO,MAAM;MACZiD,+BAA+B,CAAC,CAAC;MACjCzG,cAAc,CAACG,eAAe,CAACoD,SAAS,CAACqD,MAAM,CAAE,eAAgB,CAAC;IACnE,CAAC;EACF,CAAC,EAAE,CAAE5G,cAAc,EAAEwF,WAAW,CAAG,CAAC;;EAEpC;EACAnI,SAAS,CAAE,MAAM;IAChB,IAAK,CAAE2C,cAAc,IAAI,CAAEwF,WAAW,EAAG;MACxC;IACD;IAEA,MAAMqB,QAAQ,GAAG,GAAG;IACpB;IACA;IACA;IACA;;IAEA;IACA;IACA;IACA7G,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACC,WAAW,CAC/C,yCAAyC,EACzC5F,KAAK,KAAK,aAAa,GACpB,CAAEwE,IAAI,CAACqB,GAAG,CAAEjE,cAAc,EAAE8D,QAAS,CAAC,GACtCI,QAAQ,CAAE7F,SAAU,CAAC,GAAG,CAAC,IACzBsE,mBAAmB,GACnBvE,KACJ,CAAC;;IAED;IACAnB,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACC,WAAW,CAC/C,8CAA8C,EAC9C,OAAO3F,SAAS,KAAK,QAAQ,GAAG,GAAIA,SAAS,IAAK,GAAGA,SACtD,CAAC;IACDpB,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACC,WAAW,CAC/C,kDAAkD,EAClD,GAAInE,aAAa,IAClB,CAAC;IACD5C,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACC,WAAW,CAC/C,gDAAgD,EAChD,GAAIjC,uBAAuB,IAC5B,CAAC;IACD9E,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACC,WAAW,CAC/C,mDAAmD,EACnD,GAAIhE,cAAc,IACnB,CAAC;IACD/C,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACC,WAAW,CAC/C,yDAAyD,EACzD,GAAIrB,mBAAmB,IACxB,CAAC;IAED,OAAO,MAAM;MACZ1F,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACI,cAAc,CAClD,yCACD,CAAC;MACDlH,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACI,cAAc,CAClD,8CACD,CAAC;MACDlH,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACI,cAAc,CAClD,kDACD,CAAC;MACDlH,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACI,cAAc,CAClD,gDACD,CAAC;MACDlH,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACI,cAAc,CAClD,mDACD,CAAC;MACDlH,cAAc,CAACG,eAAe,CAAC2G,KAAK,CAACI,cAAc,CAClD,yDACD,CAAC;IACF,CAAC;EACF,CAAC,EAAE,CACF/F,KAAK,EACLC,SAAS,EACTpB,cAAc,EACd8E,uBAAuB,EACvBlC,aAAa,EACbG,cAAc,EACdqC,gBAAgB,EAChBI,WAAW,EACXE,mBAAmB,CAClB,CAAC;;EAEH;EACA;EACA,MAAMyB,gCAAgC,GAAGjG,QAAQ,IAAI,CAAC,IAAI,CAAES,aAAa;EAEzE,MAAMyF,MAAM,gBACX7I,KAAA,CAAAE,SAAA;IAAAwC,QAAA,GACGkG,gCAAgC,IAAI5E,MAAM,eAE5ClE,IAAA;MAAA,GACMoD,KAAK;MACVqF,KAAK,EAAG;QACP,GAAGrF,KAAK,CAACqF,KAAK;QACdnE,MAAM,EAAElB,KAAK,CAACqF,KAAK,EAAEnE,MAAM;QAC3B0E,MAAM,EAAE;MACT,CAAG;MACH9F,GAAG,EAAG9D,YAAY,CAAE,CAAE8D,GAAG,EAAEyB,MAAM,CAAG,CAAG;MACvC9B,QAAQ,EAAGA;MACX;MACA;MACA;MAAA;MACA+E,GAAG,EAAGA,GAAK;MACXzE,KAAK,EAAGA,KAAO;MACf8F,SAAS,EAAK3I,KAAK,IAAM;QACxB,IAAK8C,KAAK,CAAC6F,SAAS,EAAG;UACtB7F,KAAK,CAAC6F,SAAS,CAAE3I,KAAM,CAAC;QACzB;QACA;QACA;QACA;QACA;QACA;QACA;QACA,IACCA,KAAK,CAAC4I,aAAa,CAACjE,aAAa,KACjC3E,KAAK,CAAC4F,MAAM,CAACjB,aAAa,EACzB;UACD;UACA;UACA;UACA;UACA;UACA,MAAM;YAAEkE;UAAgB,CAAC,GAAG7I,KAAK,CAAC8I,WAAW;UAC7C9I,KAAK,CAAC8I,WAAW,CAACD,eAAe,GAAG,MAAM,CAAC,CAAC;UAC5C7I,KAAK,CAAC6I,eAAe,CAAC,CAAC;UACvB7I,KAAK,CAAC8I,WAAW,CAACD,eAAe,GAAGA,eAAe;UACnD9I,WAAW,CACVC,KAAK,EACLiC,MAAM,CAAC8G,aAAa,EACpB/I,KAAK,CAAC4I,aACP,CAAC;QACF;MACD,CAAG;MAAAtG,QAAA,EAEDjB,cAAc,IACf9C,YAAY;MAAA;MACX;MACA;MACA;MACAqB,KAAA;QACCgD,GAAG,EAAGwE,OAAS;QACf4B,SAAS,EAAG3K,IAAI,CACf,2BAA2B,EAC3B,uBAAuB,EACvB,GAAGoF,WACJ,CAAG;QAAAnB,QAAA,GAEDyB,qBAAqB,eACvBrE,IAAA,CAACR,aAAa;UAAC+J,QAAQ,EAAG5H,cAAgB;UAAAiB,QAAA,EACvCA;QAAQ,CACI,CAAC;MAAA,CACX,CAAC,EACPjB,cAAc,CAACG,eAChB;IAAC,CACK,CAAC,EACPgH,gCAAgC,IAAI1E,KAAK;EAAA,CAC1C,CACF;EAED,oBACClE,KAAA;IAAKoJ,SAAS,EAAC,gCAAgC;IAACpG,GAAG,EAAG+D,eAAiB;IAAArE,QAAA,GACpE4B,uBAAuB,eACzBxE,IAAA;MACCsJ,SAAS,EAAG3K,IAAI,CACf,sCAAsC,EACtCwI,WAAW,IAAI,eAChB,CAAG;MACHsB,KAAK,EAAG;QACP,yDAAyD,EACxDtB,WAAW,IAAI,GAAIE,mBAAmB;MACxC,CAAG;MAAAzE,QAAA,EAEDmG;IAAM,CACJ,CAAC;EAAA,CACF,CAAC;AAER;AAEA,SAASS,aAAaA,CAAEpG,KAAK,EAAEF,GAAG,EAAG;EACpC,MAAMuG,aAAa,GAAGhK,SAAS,CAC5B8D,MAAM,IACPA,MAAM,CAAEzD,gBAAiB,CAAC,CAAC0D,WAAW,CAAC,CAAC,CAACkG,uBAAuB,EACjE,EACD,CAAC;;EAED;EACA;EACA;EACA;EACA;EACA,IAAK,CAAED,aAAa,EAAG;IACtB,OAAO,IAAI;EACZ;EAEA,oBAAOzJ,IAAA,CAAC0C,MAAM;IAAA,GAAMU,KAAK;IAAGH,YAAY,EAAGC;EAAK,CAAE,CAAC;AACpD;AAEA,eAAepE,UAAU,CAAE0K,aAAc,CAAC","ignoreList":[]}
+{"version":3,"names":["clsx","useState","createPortal","forwardRef","useMemo","useEffect","useRef","__","useResizeObserver","useMergeRefs","useRefEffect","useDisabled","useReducedMotion","__experimentalStyleProvider","StyleProvider","useSelect","useBlockSelectionClearer","useWritingFlow","getCompatibilityStyles","store","blockEditorStore","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","bubbleEvent","event","Constructor","frame","init","key","contentDocument","defaultView","MouseEvent","rect","getBoundingClientRect","clientX","left","clientY","top","newEvent","type","defaultPrevented","preventDefault","cancelled","dispatchEvent","useBubbleEvents","iframeDocument","frameElement","html","documentElement","eventTypes","handlers","name","prototype","Object","getPrototypeOf","constructorName","constructor","window","addEventListener","removeEventListener","Iframe","contentRef","children","tabIndex","scale","frameSize","readonly","forwardedRef","ref","title","props","resolvedAssets","isPreviewMode","select","getSettings","settings","__unstableResolvedAssets","styles","scripts","setIframeDocument","initialContainerWidthRef","bodyClasses","setBodyClasses","clearerRef","before","writingFlowRef","after","contentResizeListener","height","contentHeight","containerResizeListener","width","containerWidth","prefersReducedMotion","setRef","node","_load","iFrameDocument","preventFileDropDefault","onLoad","ownerDocument","classList","add","Array","from","body","filter","startsWith","dir","compatStyle","getElementById","id","head","appendChild","cloneNode","console","warn","target","tagName","href","getAttribute","location","hash","slice","iframeWindowInnerHeight","setIframeWindowInnerHeight","iframeResizeRef","nodeWindow","innerHeight","onResize","windowInnerWidth","setWindowInnerWidth","windowResizeRef","innerWidth","isZoomedOut","current","scaleContainerWidth","Math","max","frameSizeValue","parseInt","maxWidth","scaleValue","min","prevScaleRef","prevFrameSizeRef","prevClientHeightRef","disabledRef","isDisabled","bodyRef","origin","src","cleanup","_src","URL","createObjectURL","Blob","revokeObjectURL","_prevClientHeightRef$","clientHeight","scrollHeight","prevScale","prevFrameSize","prevClientHeight","scrollTop","scrollTopNext","maxScrollTop","round","style","setProperty","onZoomOutTransitionEnd","remove","raf","requestAnimationFrame","once","removeProperty","cancelAnimationFrame","shouldRenderFocusCaptureElements","iframe","border","onKeyDown","currentTarget","stopPropagation","nativeEvent","KeyboardEvent","className","document","IframeIfReady","isInitialised","__internalIsInitialized"],"sources":["@wordpress/block-editor/src/components/iframe/index.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport {\n\tuseState,\n\tcreatePortal,\n\tforwardRef,\n\tuseMemo,\n\tuseEffect,\n\tuseRef,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\nimport {\n\tuseResizeObserver,\n\tuseMergeRefs,\n\tuseRefEffect,\n\tuseDisabled,\n\tuseReducedMotion,\n} from '@wordpress/compose';\nimport { __experimentalStyleProvider as StyleProvider } from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { useBlockSelectionClearer } from '../block-selection-clearer';\nimport { useWritingFlow } from '../writing-flow';\nimport { getCompatibilityStyles } from './get-compatibility-styles';\nimport { store as blockEditorStore } from '../../store';\n\nfunction bubbleEvent( event, Constructor, frame ) {\n\tconst init = {};\n\n\tfor ( const key in event ) {\n\t\tinit[ key ] = event[ key ];\n\t}\n\n\t// Check if the event is a MouseEvent generated within the iframe.\n\t// If so, adjust the coordinates to be relative to the position of\n\t// the iframe. This ensures that components such as Draggable\n\t// receive coordinates relative to the window, instead of relative\n\t// to the iframe. Without this, the Draggable event handler would\n\t// result in components \"jumping\" position as soon as the user\n\t// drags over the iframe.\n\tif ( event instanceof frame.contentDocument.defaultView.MouseEvent ) {\n\t\tconst rect = frame.getBoundingClientRect();\n\t\tinit.clientX += rect.left;\n\t\tinit.clientY += rect.top;\n\t}\n\n\tconst newEvent = new Constructor( event.type, init );\n\tif ( init.defaultPrevented ) {\n\t\tnewEvent.preventDefault();\n\t}\n\tconst cancelled = ! frame.dispatchEvent( newEvent );\n\n\tif ( cancelled ) {\n\t\tevent.preventDefault();\n\t}\n}\n\n/**\n * Bubbles some event types (keydown, keypress, and dragover) to parent document\n * document to ensure that the keyboard shortcuts and drag and drop work.\n *\n * Ideally, we should remove event bubbling in the future. Keyboard shortcuts\n * should be context dependent, e.g. actions on blocks like Cmd+A should not\n * work globally outside the block editor.\n *\n * @param {Document} iframeDocument Document to attach listeners to.\n */\nfunction useBubbleEvents( iframeDocument ) {\n\treturn useRefEffect( () => {\n\t\tconst { defaultView } = iframeDocument;\n\t\tif ( ! defaultView ) {\n\t\t\treturn;\n\t\t}\n\t\tconst { frameElement } = defaultView;\n\t\tconst html = iframeDocument.documentElement;\n\t\tconst eventTypes = [ 'dragover', 'mousemove' ];\n\t\tconst handlers = {};\n\t\tfor ( const name of eventTypes ) {\n\t\t\thandlers[ name ] = ( event ) => {\n\t\t\t\tconst prototype = Object.getPrototypeOf( event );\n\t\t\t\tconst constructorName = prototype.constructor.name;\n\t\t\t\tconst Constructor = window[ constructorName ];\n\t\t\t\tbubbleEvent( event, Constructor, frameElement );\n\t\t\t};\n\t\t\thtml.addEventListener( name, handlers[ name ] );\n\t\t}\n\n\t\treturn () => {\n\t\t\tfor ( const name of eventTypes ) {\n\t\t\t\thtml.removeEventListener( name, handlers[ name ] );\n\t\t\t}\n\t\t};\n\t} );\n}\n\nfunction Iframe( {\n\tcontentRef,\n\tchildren,\n\ttabIndex = 0,\n\tscale = 1,\n\tframeSize = 0,\n\treadonly,\n\tforwardedRef: ref,\n\ttitle = __( 'Editor canvas' ),\n\t...props\n} ) {\n\tconst { resolvedAssets, isPreviewMode } = useSelect( ( select ) => {\n\t\tconst { getSettings } = select( blockEditorStore );\n\t\tconst settings = getSettings();\n\t\treturn {\n\t\t\tresolvedAssets: settings.__unstableResolvedAssets,\n\t\t\tisPreviewMode: settings.isPreviewMode,\n\t\t};\n\t}, [] );\n\tconst { styles = '', scripts = '' } = resolvedAssets;\n\t/** @type {[Document, import('react').Dispatch<Document>]} */\n\tconst [ iframeDocument, setIframeDocument ] = useState();\n\tconst initialContainerWidthRef = useRef( 0 );\n\tconst [ bodyClasses, setBodyClasses ] = useState( [] );\n\tconst clearerRef = useBlockSelectionClearer();\n\tconst [ before, writingFlowRef, after ] = useWritingFlow();\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [ containerResizeListener, { width: containerWidth } ] =\n\t\tuseResizeObserver();\n\tconst prefersReducedMotion = useReducedMotion();\n\n\tconst setRef = useRefEffect( ( node ) => {\n\t\tnode._load = () => {\n\t\t\tsetIframeDocument( node.contentDocument );\n\t\t};\n\t\tlet iFrameDocument;\n\t\t// Prevent the default browser action for files dropped outside of dropzones.\n\t\tfunction preventFileDropDefault( event ) {\n\t\t\tevent.preventDefault();\n\t\t}\n\t\tfunction onLoad() {\n\t\t\tconst { contentDocument, ownerDocument } = node;\n\t\t\tconst { documentElement } = contentDocument;\n\t\t\tiFrameDocument = contentDocument;\n\n\t\t\tdocumentElement.classList.add( 'block-editor-iframe__html' );\n\n\t\t\tclearerRef( documentElement );\n\n\t\t\t// Ideally ALL classes that are added through get_body_class should\n\t\t\t// be added in the editor too, which we'll somehow have to get from\n\t\t\t// the server in the future (which will run the PHP filters).\n\t\t\tsetBodyClasses(\n\t\t\t\tArray.from( ownerDocument.body.classList ).filter(\n\t\t\t\t\t( name ) =>\n\t\t\t\t\t\tname.startsWith( 'admin-color-' ) ||\n\t\t\t\t\t\tname.startsWith( 'post-type-' ) ||\n\t\t\t\t\t\tname === 'wp-embed-responsive'\n\t\t\t\t)\n\t\t\t);\n\n\t\t\tcontentDocument.dir = ownerDocument.dir;\n\n\t\t\tfor ( const compatStyle of getCompatibilityStyles() ) {\n\t\t\t\tif ( contentDocument.getElementById( compatStyle.id ) ) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\n\t\t\t\tcontentDocument.head.appendChild(\n\t\t\t\t\tcompatStyle.cloneNode( true )\n\t\t\t\t);\n\n\t\t\t\tif ( ! isPreviewMode ) {\n\t\t\t\t\t// eslint-disable-next-line no-console\n\t\t\t\t\tconsole.warn(\n\t\t\t\t\t\t`${ compatStyle.id } was added to the iframe incorrectly. Please use block.json or enqueue_block_assets to add styles to the iframe.`,\n\t\t\t\t\t\tcompatStyle\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\tiFrameDocument.addEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault,\n\t\t\t\tfalse\n\t\t\t);\n\t\t\t// Prevent clicks on links from navigating away. Note that links\n\t\t\t// inside `contenteditable` are already disabled by the browser, so\n\t\t\t// this is for links in blocks outside of `contenteditable`.\n\t\t\tiFrameDocument.addEventListener( 'click', ( event ) => {\n\t\t\t\tif ( event.target.tagName === 'A' ) {\n\t\t\t\t\tevent.preventDefault();\n\n\t\t\t\t\t// Appending a hash to the current URL will not reload the\n\t\t\t\t\t// page. This is useful for e.g. footnotes.\n\t\t\t\t\tconst href = event.target.getAttribute( 'href' );\n\t\t\t\t\tif ( href.startsWith( '#' ) ) {\n\t\t\t\t\t\tiFrameDocument.defaultView.location.hash =\n\t\t\t\t\t\t\thref.slice( 1 );\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t} );\n\t\t}\n\n\t\tnode.addEventListener( 'load', onLoad );\n\n\t\treturn () => {\n\t\t\tdelete node._load;\n\t\t\tnode.removeEventListener( 'load', onLoad );\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'dragover',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t\tiFrameDocument?.removeEventListener(\n\t\t\t\t'drop',\n\t\t\t\tpreventFileDropDefault\n\t\t\t);\n\t\t};\n\t}, [] );\n\n\tconst [ iframeWindowInnerHeight, setIframeWindowInnerHeight ] = useState();\n\n\tconst iframeResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\tconst onResize = () => {\n\t\t\tsetIframeWindowInnerHeight( nodeWindow.innerHeight );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst [ windowInnerWidth, setWindowInnerWidth ] = useState();\n\n\tconst windowResizeRef = useRefEffect( ( node ) => {\n\t\tconst nodeWindow = node.ownerDocument.defaultView;\n\n\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\tconst onResize = () => {\n\t\t\tsetWindowInnerWidth( nodeWindow.innerWidth );\n\t\t};\n\t\tnodeWindow.addEventListener( 'resize', onResize );\n\t\treturn () => {\n\t\t\tnodeWindow.removeEventListener( 'resize', onResize );\n\t\t};\n\t}, [] );\n\n\tconst isZoomedOut = scale !== 1;\n\n\tuseEffect( () => {\n\t\tif ( ! isZoomedOut ) {\n\t\t\tinitialContainerWidthRef.current = containerWidth;\n\t\t}\n\t}, [ containerWidth, isZoomedOut ] );\n\n\tconst scaleContainerWidth = Math.max(\n\t\tinitialContainerWidthRef.current,\n\t\tcontainerWidth\n\t);\n\n\tconst frameSizeValue = parseInt( frameSize );\n\n\tconst maxWidth = 750;\n\tconst scaleValue =\n\t\tscale === 'auto-scaled'\n\t\t\t? ( Math.min( containerWidth, maxWidth ) - frameSizeValue * 2 ) /\n\t\t\t  scaleContainerWidth\n\t\t\t: scale;\n\n\tconst prevScaleRef = useRef( scaleValue );\n\tconst prevFrameSizeRef = useRef( frameSizeValue );\n\tconst prevClientHeightRef = useRef( /* Initialized in the useEffect. */ );\n\n\tconst disabledRef = useDisabled( { isDisabled: ! readonly } );\n\tconst bodyRef = useMergeRefs( [\n\t\tuseBubbleEvents( iframeDocument ),\n\t\tcontentRef,\n\t\tclearerRef,\n\t\twritingFlowRef,\n\t\tdisabledRef,\n\t\t// Avoid resize listeners when not needed, these will trigger\n\t\t// unnecessary re-renders when animating the iframe width, or when\n\t\t// expanding preview iframes.\n\t\tisZoomedOut ? iframeResizeRef : null,\n\t] );\n\n\t// Correct doctype is required to enable rendering in standards\n\t// mode. Also preload the styles to avoid a flash of unstyled\n\t// content.\n\tconst html = `<!doctype html>\n<html>\n\t<head>\n\t\t<meta charset=\"utf-8\">\n\t\t<base href=\"${ window.location.origin }\">\n\t\t<script>window.frameElement._load()</script>\n\t\t<style>\n\t\t\thtml{\n\t\t\t\theight: auto !important;\n\t\t\t\tmin-height: 100%;\n\t\t\t}\n\t\t\t/* Lowest specificity to not override global styles */\n\t\t\t:where(body) {\n\t\t\t\tmargin: 0;\n\t\t\t\t/* Default background color in case zoom out mode background\n\t\t\t\tcolors the html element */\n\t\t\t\tbackground-color: white;\n\t\t\t}\n\t\t</style>\n\t\t${ styles }\n\t\t${ scripts }\n\t</head>\n\t<body>\n\t\t<script>document.currentScript.parentElement.remove()</script>\n\t</body>\n</html>`;\n\n\tconst [ src, cleanup ] = useMemo( () => {\n\t\tconst _src = URL.createObjectURL(\n\t\t\tnew window.Blob( [ html ], { type: 'text/html' } )\n\t\t);\n\t\treturn [ _src, () => URL.revokeObjectURL( _src ) ];\n\t}, [ html ] );\n\n\tuseEffect( () => cleanup, [ cleanup ] );\n\n\tuseEffect( () => {\n\t\tif (\n\t\t\t! iframeDocument ||\n\t\t\t// HACK: Checking if isZoomedOut differs from prevIsZoomedOut here\n\t\t\t// instead of the dependency array to appease the linter.\n\t\t\t( scaleValue === 1 ) === ( prevScaleRef.current === 1 )\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Unscaled height of the current iframe container.\n\t\tconst clientHeight = iframeDocument.documentElement.clientHeight;\n\n\t\t// Scaled height of the current iframe content.\n\t\tconst scrollHeight = iframeDocument.documentElement.scrollHeight;\n\n\t\t// Previous scale value.\n\t\tconst prevScale = prevScaleRef.current;\n\n\t\t// Unscaled size of the previous padding around the iframe content.\n\t\tconst prevFrameSize = prevFrameSizeRef.current;\n\n\t\t// Unscaled height of the previous iframe container.\n\t\tconst prevClientHeight = prevClientHeightRef.current ?? clientHeight;\n\n\t\t// We can't trust the set value from contentHeight, as it was measured\n\t\t// before the zoom out mode was changed. After zoom out mode is changed,\n\t\t// appenders may appear or disappear, so we need to get the height from\n\t\t// the iframe at this point when we're about to animate the zoom out.\n\t\t// The iframe scrollTop, scrollHeight, and clientHeight will all be\n\t\t// accurate. The client height also does change when the zoom out mode\n\t\t// is toggled, as the bottom bar about selecting the template is\n\t\t// added/removed when toggling zoom out mode.\n\t\tconst scrollTop = iframeDocument.documentElement.scrollTop;\n\n\t\t// Step 0: Start with the current scrollTop.\n\t\tlet scrollTopNext = scrollTop;\n\n\t\t// Step 1: Undo the effects of the previous scale and frame around the\n\t\t// midpoint of the visible area.\n\t\tscrollTopNext =\n\t\t\t( scrollTopNext + prevClientHeight / 2 - prevFrameSize ) /\n\t\t\t\tprevScale -\n\t\t\tprevClientHeight / 2;\n\n\t\t// Step 2: Apply the new scale and frame around the midpoint of the\n\t\t// visible area.\n\t\tscrollTopNext =\n\t\t\t( scrollTopNext + clientHeight / 2 ) * scaleValue +\n\t\t\tframeSizeValue -\n\t\t\tclientHeight / 2;\n\n\t\t// Step 3: Handle an edge case so that you scroll to the top of the\n\t\t// iframe if the top of the iframe content is visible in the container.\n\t\t// The same edge case for the bottom is skipped because changing content\n\t\t// makes calculating it impossible.\n\t\tscrollTopNext = scrollTop <= prevFrameSize ? 0 : scrollTopNext;\n\n\t\t// This is the scrollTop value if you are scrolled to the bottom of the\n\t\t// iframe. We can't just let the browser handle it because we need to\n\t\t// animate the scaling.\n\t\tconst maxScrollTop =\n\t\t\tscrollHeight * ( scaleValue / prevScale ) +\n\t\t\tframeSizeValue * 2 -\n\t\t\tclientHeight;\n\n\t\t// Step 4: Clamp the scrollTopNext between the minimum and maximum\n\t\t// possible scrollTop positions. Round the value to avoid subpixel\n\t\t// truncation by the browser which sometimes causes a 1px error.\n\t\tscrollTopNext = Math.round(\n\t\t\tMath.min(\n\t\t\t\tMath.max( 0, scrollTopNext ),\n\t\t\t\tMath.max( 0, maxScrollTop )\n\t\t\t)\n\t\t);\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top',\n\t\t\t`${ scrollTop }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next',\n\t\t\t`${ scrollTopNext }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.add( 'zoom-out-animation' );\n\n\t\tfunction onZoomOutTransitionEnd() {\n\t\t\t// Remove the position fixed for the animation.\n\t\t\tiframeDocument.documentElement.classList.remove(\n\t\t\t\t'zoom-out-animation'\n\t\t\t);\n\n\t\t\t// Update previous values.\n\t\t\tprevClientHeightRef.current = clientHeight;\n\t\t\tprevFrameSizeRef.current = frameSizeValue;\n\t\t\tprevScaleRef.current = scaleValue;\n\n\t\t\t// Set the final scroll position that was just animated to.\n\t\t\t// Disable reason: Eslint isn't smart enough to know that this is a\n\t\t\t// DOM element. https://github.com/facebook/react/issues/31483\n\t\t\t// eslint-disable-next-line react-compiler/react-compiler\n\t\t\tiframeDocument.documentElement.scrollTop = scrollTopNext;\n\t\t}\n\n\t\tlet raf;\n\t\tif ( prefersReducedMotion ) {\n\t\t\t// Hack: Wait for the window values to recalculate.\n\t\t\traf = iframeDocument.defaultView.requestAnimationFrame(\n\t\t\t\tonZoomOutTransitionEnd\n\t\t\t);\n\t\t} else {\n\t\t\tiframeDocument.documentElement.addEventListener(\n\t\t\t\t'transitionend',\n\t\t\t\tonZoomOutTransitionEnd,\n\t\t\t\t{ once: true }\n\t\t\t);\n\t\t}\n\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next'\n\t\t\t);\n\t\t\tiframeDocument.documentElement.classList.remove(\n\t\t\t\t'zoom-out-animation'\n\t\t\t);\n\t\t\tif ( prefersReducedMotion ) {\n\t\t\t\tiframeDocument.defaultView.cancelAnimationFrame( raf );\n\t\t\t} else {\n\t\t\t\tiframeDocument.documentElement.removeEventListener(\n\t\t\t\t\t'transitionend',\n\t\t\t\t\tonZoomOutTransitionEnd\n\t\t\t\t);\n\t\t\t}\n\t\t};\n\t}, [ iframeDocument, scaleValue, frameSizeValue, prefersReducedMotion ] );\n\n\t// Toggle zoom out CSS Classes only when zoom out mode changes. We could add these into the useEffect\n\t// that controls settings the CSS variables, but then we would need to do more work to ensure we're\n\t// only toggling these when the zoom out mode changes, as that useEffect is also triggered by a large\n\t// number of dependencies.\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument ) {\n\t\t\treturn;\n\t\t}\n\n\t\tif ( isZoomedOut ) {\n\t\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\t\t} else {\n\t\t\t// HACK: Since we can't remove this in the cleanup, we need to do it here.\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t}\n\n\t\treturn () => {\n\t\t\t// HACK: Skipping cleanup because it causes issues with the zoom out\n\t\t\t// animation. More refactoring is needed to fix this properly.\n\t\t\t// iframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t// Calculate the scaling and CSS variables for the zoom out canvas\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// Note: When we initialize the zoom out when the canvas is smaller (sidebars open),\n\t\t// initialContainerWidthRef will be smaller than the full page, and reflow will happen\n\t\t// when the canvas area becomes larger due to sidebars closing. This is a known but\n\t\t// minor divergence for now.\n\n\t\t// This scaling calculation has to happen within the JS because CSS calc() can\n\t\t// only divide and multiply by a unitless value. I.e. calc( 100px / 2 ) is valid\n\t\t// but calc( 100px / 2px ) is not.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\tscaleValue\n\t\t);\n\n\t\t// frameSize has to be a px value for the scaling and frame size to be computed correctly.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\ttypeof frameSize === 'number' ? `${ frameSize }px` : frameSize\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t`${ contentHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t`${ iframeWindowInnerHeight }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t`${ containerWidth }px`\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t`${ scaleContainerWidth }px`\n\t\t);\n\n\t\treturn () => {\n\t\t\t// HACK: Skipping cleanup because it causes issues with the zoom out\n\t\t\t// animation. More refactoring is needed to fix this properly.\n\t\t\t// iframeDocument.documentElement.style.removeProperty(\n\t\t\t// \t'--wp-block-editor-iframe-zoom-out-scale'\n\t\t\t// );\n\t\t\t// iframeDocument.documentElement.style.removeProperty(\n\t\t\t// \t'--wp-block-editor-iframe-zoom-out-frame-size'\n\t\t\t// );\n\t\t\t// iframeDocument.documentElement.style.removeProperty(\n\t\t\t// \t'--wp-block-editor-iframe-zoom-out-content-height'\n\t\t\t// );\n\t\t\t// iframeDocument.documentElement.style.removeProperty(\n\t\t\t// \t'--wp-block-editor-iframe-zoom-out-inner-height'\n\t\t\t// );\n\t\t\t// iframeDocument.documentElement.style.removeProperty(\n\t\t\t// \t'--wp-block-editor-iframe-zoom-out-container-width'\n\t\t\t// );\n\t\t\t// iframeDocument.documentElement.style.removeProperty(\n\t\t\t// \t'--wp-block-editor-iframe-zoom-out-scale-container-width'\n\t\t\t// );\n\t\t};\n\t}, [\n\t\tscaleValue,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tiframeWindowInnerHeight,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\twindowInnerWidth,\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t] );\n\n\t// Make sure to not render the before and after focusable div elements in view\n\t// mode. They're only needed to capture focus in edit mode.\n\tconst shouldRenderFocusCaptureElements = tabIndex >= 0 && ! isPreviewMode;\n\n\tconst iframe = (\n\t\t<>\n\t\t\t{ shouldRenderFocusCaptureElements && before }\n\t\t\t{ /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */ }\n\t\t\t<iframe\n\t\t\t\t{ ...props }\n\t\t\t\tstyle={ {\n\t\t\t\t\t...props.style,\n\t\t\t\t\theight: props.style?.height,\n\t\t\t\t\tborder: 0,\n\t\t\t\t} }\n\t\t\t\tref={ useMergeRefs( [ ref, setRef ] ) }\n\t\t\t\ttabIndex={ tabIndex }\n\t\t\t\t// Correct doctype is required to enable rendering in standards\n\t\t\t\t// mode. Also preload the styles to avoid a flash of unstyled\n\t\t\t\t// content.\n\t\t\t\tsrc={ src }\n\t\t\t\ttitle={ title }\n\t\t\t\tonKeyDown={ ( event ) => {\n\t\t\t\t\tif ( props.onKeyDown ) {\n\t\t\t\t\t\tprops.onKeyDown( event );\n\t\t\t\t\t}\n\t\t\t\t\t// If the event originates from inside the iframe, it means\n\t\t\t\t\t// it bubbled through the portal, but only with React\n\t\t\t\t\t// events. We need to to bubble native events as well,\n\t\t\t\t\t// though by doing so we also trigger another React event,\n\t\t\t\t\t// so we need to stop the propagation of this event to avoid\n\t\t\t\t\t// duplication.\n\t\t\t\t\tif (\n\t\t\t\t\t\tevent.currentTarget.ownerDocument !==\n\t\t\t\t\t\tevent.target.ownerDocument\n\t\t\t\t\t) {\n\t\t\t\t\t\t// We should only stop propagation of the React event,\n\t\t\t\t\t\t// the native event should further bubble inside the\n\t\t\t\t\t\t// iframe to the document and window.\n\t\t\t\t\t\t// Alternatively, we could consider redispatching the\n\t\t\t\t\t\t// native event in the iframe.\n\t\t\t\t\t\tconst { stopPropagation } = event.nativeEvent;\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = () => {};\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tevent.nativeEvent.stopPropagation = stopPropagation;\n\t\t\t\t\t\tbubbleEvent(\n\t\t\t\t\t\t\tevent,\n\t\t\t\t\t\t\twindow.KeyboardEvent,\n\t\t\t\t\t\t\tevent.currentTarget\n\t\t\t\t\t\t);\n\t\t\t\t\t}\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframeDocument &&\n\t\t\t\t\tcreatePortal(\n\t\t\t\t\t\t// We want to prevent React events from bubbling throught the iframe\n\t\t\t\t\t\t// we bubble these manually.\n\t\t\t\t\t\t/* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions */\n\t\t\t\t\t\t<body\n\t\t\t\t\t\t\tref={ bodyRef }\n\t\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t\t'block-editor-iframe__body',\n\t\t\t\t\t\t\t\t'editor-styles-wrapper',\n\t\t\t\t\t\t\t\t...bodyClasses\n\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ contentResizeListener }\n\t\t\t\t\t\t\t<StyleProvider document={ iframeDocument }>\n\t\t\t\t\t\t\t\t{ children }\n\t\t\t\t\t\t\t</StyleProvider>\n\t\t\t\t\t\t</body>,\n\t\t\t\t\t\tiframeDocument.documentElement\n\t\t\t\t\t) }\n\t\t\t</iframe>\n\t\t\t{ shouldRenderFocusCaptureElements && after }\n\t\t</>\n\t);\n\n\treturn (\n\t\t<div className=\"block-editor-iframe__container\" ref={ windowResizeRef }>\n\t\t\t{ containerResizeListener }\n\t\t\t<div\n\t\t\t\tclassName={ clsx(\n\t\t\t\t\t'block-editor-iframe__scale-container',\n\t\t\t\t\tisZoomedOut && 'is-zoomed-out'\n\t\t\t\t) }\n\t\t\t\tstyle={ {\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width':\n\t\t\t\t\t\tisZoomedOut && `${ scaleContainerWidth }px`,\n\t\t\t\t} }\n\t\t\t>\n\t\t\t\t{ iframe }\n\t\t\t</div>\n\t\t</div>\n\t);\n}\n\nfunction IframeIfReady( props, ref ) {\n\tconst isInitialised = useSelect(\n\t\t( select ) =>\n\t\t\tselect( blockEditorStore ).getSettings().__internalIsInitialized,\n\t\t[]\n\t);\n\n\t// We shouldn't render the iframe until the editor settings are initialised.\n\t// The initial settings are needed to get the styles for the srcDoc, which\n\t// cannot be changed after the iframe is mounted. srcDoc is used to to set\n\t// the initial iframe HTML, which is required to avoid a flash of unstyled\n\t// content.\n\tif ( ! isInitialised ) {\n\t\treturn null;\n\t}\n\n\treturn <Iframe { ...props } forwardedRef={ ref } />;\n}\n\nexport default forwardRef( IframeIfReady );\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/inserter/block-patterns-tab/pattern-category-previews.js

@@ -4,7 +4,6 @@
 import { useMemo, useState, useCallback, useRef, useEffect } from '@wordpress/element';
 import { __ } from '@wordpress/i18n';
 import { __experimentalHStack as HStack, __experimentalVStack as VStack, __experimentalHeading as Heading, __experimentalText as Text, FlexBlock } from '@wordpress/components';
-import { useSelect } from '@wordpress/data';
 
 /**
  * Internal dependencies
@@ -15,8 +14,6 @@ import usePatternsPaging from '../hooks/use-patterns-paging';
 import { PatternsFilter } from './patterns-filter';
 import { usePatternCategories } from './use-pattern-categories';
 import { isPatternFiltered, allPatternsCategory, myPatternsCategory, starterPatternsCategory, INSERTER_PATTERN_TYPES } from './utils';
-import { store as blockEditorStore } from '../../../store';
-import { unlock } from '../../../lock-unlock';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 const noop = () => {};
 export function PatternCategoryPreviews({
@@ -26,7 +23,6 @@ export function PatternCategoryPreviews({
   category,
   showTitlesAsTooltip
 }) {
-  const isZoomOutMode = useSelect(select => unlock(select(blockEditorStore)).isZoomOut(), []);
   const [allPatterns,, onClickPattern] = usePatternsState(onInsert, rootClientId, category?.name);
   const [patternSyncFilter, setPatternSyncFilter] = useState('all');
   const [patternSourceFilter, setPatternSourceFilter] = useState('all');
@@ -98,7 +94,7 @@ export function PatternCategoryPreviews({
         children: __('No results found')
       })]
     }), currentCategoryPatterns.length > 0 && /*#__PURE__*/_jsxs(_Fragment, {
-      children: [isZoomOutMode && /*#__PURE__*/_jsx(Text, {
+      children: [/*#__PURE__*/_jsx(Text, {
         size: "12",
         as: "p",
         className: "block-editor-inserter__help-text",

package/build-module/components/inserter/block-patterns-tab/pattern-category-previews.js.map

@@ -1 +1 @@
-{"version":3,"names":["useMemo","useState","useCallback","useRef","useEffect","__","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalHeading","Heading","__experimentalText","Text","FlexBlock","useSelect","usePatternsState","BlockPatternsList","usePatternsPaging","PatternsFilter","usePatternCategories","isPatternFiltered","allPatternsCategory","myPatternsCategory","starterPatternsCategory","INSERTER_PATTERN_TYPES","store","blockEditorStore","unlock","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","noop","PatternCategoryPreviews","rootClientId","onInsert","onHover","category","showTitlesAsTooltip","isZoomOutMode","select","isZoomOut","allPatterns","onClickPattern","name","patternSyncFilter","setPatternSyncFilter","patternSourceFilter","setPatternSourceFilter","availableCategories","scrollContainerRef","currentCategoryPatterns","filter","pattern","type","user","blockTypes","includes","categories","some","catName","c","pagingProps","changePage","onSetPatternSyncFilter","value","onSetPatternSourceFilter","children","spacing","className","size","level","as","label","length","variant","ref","blockPatterns","categoryPatterns","orientation","isDraggable","patternFilter"],"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab/pattern-category-previews.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalHeading as Heading,\n\t__experimentalText as Text,\n\tFlexBlock,\n} from '@wordpress/components';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport usePatternsState from '../hooks/use-patterns-state';\nimport BlockPatternsList from '../../block-patterns-list';\nimport usePatternsPaging from '../hooks/use-patterns-paging';\nimport { PatternsFilter } from './patterns-filter';\nimport { usePatternCategories } from './use-pattern-categories';\nimport {\n\tisPatternFiltered,\n\tallPatternsCategory,\n\tmyPatternsCategory,\n\tstarterPatternsCategory,\n\tINSERTER_PATTERN_TYPES,\n} from './utils';\nimport { store as blockEditorStore } from '../../../store';\nimport { unlock } from '../../../lock-unlock';\n\nconst noop = () => {};\n\nexport function PatternCategoryPreviews( {\n\trootClientId,\n\tonInsert,\n\tonHover = noop,\n\tcategory,\n\tshowTitlesAsTooltip,\n} ) {\n\tconst isZoomOutMode = useSelect(\n\t\t( select ) => unlock( select( blockEditorStore ) ).isZoomOut(),\n\t\t[]\n\t);\n\tconst [ allPatterns, , onClickPattern ] = usePatternsState(\n\t\tonInsert,\n\t\trootClientId,\n\t\tcategory?.name\n\t);\n\tconst [ patternSyncFilter, setPatternSyncFilter ] = useState( 'all' );\n\tconst [ patternSourceFilter, setPatternSourceFilter ] = useState( 'all' );\n\n\tconst availableCategories = usePatternCategories(\n\t\trootClientId,\n\t\tpatternSourceFilter\n\t);\n\tconst scrollContainerRef = useRef();\n\tconst currentCategoryPatterns = useMemo(\n\t\t() =>\n\t\t\tallPatterns.filter( ( pattern ) => {\n\t\t\t\tif (\n\t\t\t\t\tisPatternFiltered(\n\t\t\t\t\t\tpattern,\n\t\t\t\t\t\tpatternSourceFilter,\n\t\t\t\t\t\tpatternSyncFilter\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif ( category.name === allPatternsCategory.name ) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tcategory.name === myPatternsCategory.name &&\n\t\t\t\t\tpattern.type === INSERTER_PATTERN_TYPES.user\n\t\t\t\t) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tcategory.name === starterPatternsCategory.name &&\n\t\t\t\t\tpattern.blockTypes?.includes( 'core/post-content' )\n\t\t\t\t) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif ( category.name === 'uncategorized' ) {\n\t\t\t\t\t// The uncategorized category should show all the patterns without any category...\n\t\t\t\t\tif ( ! pattern.categories ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\n\t\t\t\t\t// ...or with no available category.\n\t\t\t\t\treturn ! pattern.categories.some( ( catName ) =>\n\t\t\t\t\t\tavailableCategories.some( ( c ) => c.name === catName )\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn pattern.categories?.includes( category.name );\n\t\t\t} ),\n\t\t[\n\t\t\tallPatterns,\n\t\t\tavailableCategories,\n\t\t\tcategory.name,\n\t\t\tpatternSourceFilter,\n\t\t\tpatternSyncFilter,\n\t\t]\n\t);\n\n\tconst pagingProps = usePatternsPaging(\n\t\tcurrentCategoryPatterns,\n\t\tcategory,\n\t\tscrollContainerRef\n\t);\n\tconst { changePage } = pagingProps;\n\n\t// Hide block pattern preview on unmount.\n\tuseEffect( () => () => onHover( null ), [] );\n\n\tconst onSetPatternSyncFilter = useCallback(\n\t\t( value ) => {\n\t\t\tsetPatternSyncFilter( value );\n\t\t\tchangePage( 1 );\n\t\t},\n\t\t[ setPatternSyncFilter, changePage ]\n\t);\n\tconst onSetPatternSourceFilter = useCallback(\n\t\t( value ) => {\n\t\t\tsetPatternSourceFilter( value );\n\t\t\tchangePage( 1 );\n\t\t},\n\t\t[ setPatternSourceFilter, changePage ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<VStack\n\t\t\t\tspacing={ 2 }\n\t\t\t\tclassName=\"block-editor-inserter__patterns-category-panel-header\"\n\t\t\t>\n\t\t\t\t<HStack>\n\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-category-panel-title\"\n\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\tlevel={ 4 }\n\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ category.label }\n\t\t\t\t\t\t</Heading>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t<PatternsFilter\n\t\t\t\t\t\tpatternSyncFilter={ patternSyncFilter }\n\t\t\t\t\t\tpatternSourceFilter={ patternSourceFilter }\n\t\t\t\t\t\tsetPatternSyncFilter={ onSetPatternSyncFilter }\n\t\t\t\t\t\tsetPatternSourceFilter={ onSetPatternSourceFilter }\n\t\t\t\t\t\tscrollContainerRef={ scrollContainerRef }\n\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t\t{ ! currentCategoryPatterns.length && (\n\t\t\t\t\t<Text\n\t\t\t\t\t\tvariant=\"muted\"\n\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-category-no-results\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'No results found' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t\t{ currentCategoryPatterns.length > 0 && (\n\t\t\t\t<>\n\t\t\t\t\t{ isZoomOutMode && (\n\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\tsize=\"12\"\n\t\t\t\t\t\t\tas=\"p\"\n\t\t\t\t\t\t\tclassName=\"block-editor-inserter__help-text\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ __( 'Drag and drop patterns into the canvas.' ) }\n\t\t\t\t\t\t</Text>\n\t\t\t\t\t) }\n\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\tref={ scrollContainerRef }\n\t\t\t\t\t\tblockPatterns={ pagingProps.categoryPatterns }\n\t\t\t\t\t\tonClickPattern={ onClickPattern }\n\t\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\t\tlabel={ category.label }\n\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\tcategory={ category.name }\n\t\t\t\t\t\tisDraggable\n\t\t\t\t\t\tshowTitlesAsTooltip={ showTitlesAsTooltip }\n\t\t\t\t\t\tpatternFilter={ patternSourceFilter }\n\t\t\t\t\t\tpagingProps={ pagingProps }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["useMemo","useState","useCallback","useRef","useEffect","__","__experimentalHStack","HStack","__experimentalVStack","VStack","__experimentalHeading","Heading","__experimentalText","Text","FlexBlock","usePatternsState","BlockPatternsList","usePatternsPaging","PatternsFilter","usePatternCategories","isPatternFiltered","allPatternsCategory","myPatternsCategory","starterPatternsCategory","INSERTER_PATTERN_TYPES","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","noop","PatternCategoryPreviews","rootClientId","onInsert","onHover","category","showTitlesAsTooltip","allPatterns","onClickPattern","name","patternSyncFilter","setPatternSyncFilter","patternSourceFilter","setPatternSourceFilter","availableCategories","scrollContainerRef","currentCategoryPatterns","filter","pattern","type","user","blockTypes","includes","categories","some","catName","c","pagingProps","changePage","onSetPatternSyncFilter","value","onSetPatternSourceFilter","children","spacing","className","size","level","as","label","length","variant","ref","blockPatterns","categoryPatterns","orientation","isDraggable","patternFilter"],"sources":["@wordpress/block-editor/src/components/inserter/block-patterns-tab/pattern-category-previews.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\tuseMemo,\n\tuseState,\n\tuseCallback,\n\tuseRef,\n\tuseEffect,\n} from '@wordpress/element';\nimport { __ } from '@wordpress/i18n';\n\nimport {\n\t__experimentalHStack as HStack,\n\t__experimentalVStack as VStack,\n\t__experimentalHeading as Heading,\n\t__experimentalText as Text,\n\tFlexBlock,\n} from '@wordpress/components';\n\n/**\n * Internal dependencies\n */\nimport usePatternsState from '../hooks/use-patterns-state';\nimport BlockPatternsList from '../../block-patterns-list';\nimport usePatternsPaging from '../hooks/use-patterns-paging';\nimport { PatternsFilter } from './patterns-filter';\nimport { usePatternCategories } from './use-pattern-categories';\nimport {\n\tisPatternFiltered,\n\tallPatternsCategory,\n\tmyPatternsCategory,\n\tstarterPatternsCategory,\n\tINSERTER_PATTERN_TYPES,\n} from './utils';\n\nconst noop = () => {};\n\nexport function PatternCategoryPreviews( {\n\trootClientId,\n\tonInsert,\n\tonHover = noop,\n\tcategory,\n\tshowTitlesAsTooltip,\n} ) {\n\tconst [ allPatterns, , onClickPattern ] = usePatternsState(\n\t\tonInsert,\n\t\trootClientId,\n\t\tcategory?.name\n\t);\n\tconst [ patternSyncFilter, setPatternSyncFilter ] = useState( 'all' );\n\tconst [ patternSourceFilter, setPatternSourceFilter ] = useState( 'all' );\n\n\tconst availableCategories = usePatternCategories(\n\t\trootClientId,\n\t\tpatternSourceFilter\n\t);\n\tconst scrollContainerRef = useRef();\n\tconst currentCategoryPatterns = useMemo(\n\t\t() =>\n\t\t\tallPatterns.filter( ( pattern ) => {\n\t\t\t\tif (\n\t\t\t\t\tisPatternFiltered(\n\t\t\t\t\t\tpattern,\n\t\t\t\t\t\tpatternSourceFilter,\n\t\t\t\t\t\tpatternSyncFilter\n\t\t\t\t\t)\n\t\t\t\t) {\n\t\t\t\t\treturn false;\n\t\t\t\t}\n\n\t\t\t\tif ( category.name === allPatternsCategory.name ) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tcategory.name === myPatternsCategory.name &&\n\t\t\t\t\tpattern.type === INSERTER_PATTERN_TYPES.user\n\t\t\t\t) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif (\n\t\t\t\t\tcategory.name === starterPatternsCategory.name &&\n\t\t\t\t\tpattern.blockTypes?.includes( 'core/post-content' )\n\t\t\t\t) {\n\t\t\t\t\treturn true;\n\t\t\t\t}\n\n\t\t\t\tif ( category.name === 'uncategorized' ) {\n\t\t\t\t\t// The uncategorized category should show all the patterns without any category...\n\t\t\t\t\tif ( ! pattern.categories ) {\n\t\t\t\t\t\treturn true;\n\t\t\t\t\t}\n\n\t\t\t\t\t// ...or with no available category.\n\t\t\t\t\treturn ! pattern.categories.some( ( catName ) =>\n\t\t\t\t\t\tavailableCategories.some( ( c ) => c.name === catName )\n\t\t\t\t\t);\n\t\t\t\t}\n\n\t\t\t\treturn pattern.categories?.includes( category.name );\n\t\t\t} ),\n\t\t[\n\t\t\tallPatterns,\n\t\t\tavailableCategories,\n\t\t\tcategory.name,\n\t\t\tpatternSourceFilter,\n\t\t\tpatternSyncFilter,\n\t\t]\n\t);\n\n\tconst pagingProps = usePatternsPaging(\n\t\tcurrentCategoryPatterns,\n\t\tcategory,\n\t\tscrollContainerRef\n\t);\n\tconst { changePage } = pagingProps;\n\n\t// Hide block pattern preview on unmount.\n\tuseEffect( () => () => onHover( null ), [] );\n\n\tconst onSetPatternSyncFilter = useCallback(\n\t\t( value ) => {\n\t\t\tsetPatternSyncFilter( value );\n\t\t\tchangePage( 1 );\n\t\t},\n\t\t[ setPatternSyncFilter, changePage ]\n\t);\n\tconst onSetPatternSourceFilter = useCallback(\n\t\t( value ) => {\n\t\t\tsetPatternSourceFilter( value );\n\t\t\tchangePage( 1 );\n\t\t},\n\t\t[ setPatternSourceFilter, changePage ]\n\t);\n\n\treturn (\n\t\t<>\n\t\t\t<VStack\n\t\t\t\tspacing={ 2 }\n\t\t\t\tclassName=\"block-editor-inserter__patterns-category-panel-header\"\n\t\t\t>\n\t\t\t\t<HStack>\n\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t<Heading\n\t\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-category-panel-title\"\n\t\t\t\t\t\t\tsize={ 13 }\n\t\t\t\t\t\t\tlevel={ 4 }\n\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{ category.label }\n\t\t\t\t\t\t</Heading>\n\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t<PatternsFilter\n\t\t\t\t\t\tpatternSyncFilter={ patternSyncFilter }\n\t\t\t\t\t\tpatternSourceFilter={ patternSourceFilter }\n\t\t\t\t\t\tsetPatternSyncFilter={ onSetPatternSyncFilter }\n\t\t\t\t\t\tsetPatternSourceFilter={ onSetPatternSourceFilter }\n\t\t\t\t\t\tscrollContainerRef={ scrollContainerRef }\n\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t/>\n\t\t\t\t</HStack>\n\t\t\t\t{ ! currentCategoryPatterns.length && (\n\t\t\t\t\t<Text\n\t\t\t\t\t\tvariant=\"muted\"\n\t\t\t\t\t\tclassName=\"block-editor-inserter__patterns-category-no-results\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'No results found' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t) }\n\t\t\t</VStack>\n\t\t\t{ currentCategoryPatterns.length > 0 && (\n\t\t\t\t<>\n\t\t\t\t\t<Text\n\t\t\t\t\t\tsize=\"12\"\n\t\t\t\t\t\tas=\"p\"\n\t\t\t\t\t\tclassName=\"block-editor-inserter__help-text\"\n\t\t\t\t\t>\n\t\t\t\t\t\t{ __( 'Drag and drop patterns into the canvas.' ) }\n\t\t\t\t\t</Text>\n\t\t\t\t\t<BlockPatternsList\n\t\t\t\t\t\tref={ scrollContainerRef }\n\t\t\t\t\t\tblockPatterns={ pagingProps.categoryPatterns }\n\t\t\t\t\t\tonClickPattern={ onClickPattern }\n\t\t\t\t\t\tonHover={ onHover }\n\t\t\t\t\t\tlabel={ category.label }\n\t\t\t\t\t\torientation=\"vertical\"\n\t\t\t\t\t\tcategory={ category.name }\n\t\t\t\t\t\tisDraggable\n\t\t\t\t\t\tshowTitlesAsTooltip={ showTitlesAsTooltip }\n\t\t\t\t\t\tpatternFilter={ patternSourceFilter }\n\t\t\t\t\t\tpagingProps={ pagingProps }\n\t\t\t\t\t/>\n\t\t\t\t</>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/inserter/category-tabs/index.js

@@ -3,7 +3,7 @@
  */
 import { usePrevious, useReducedMotion } from '@wordpress/compose';
 import { privateApis as componentsPrivateApis, __unstableMotion as motion } from '@wordpress/components';
-import { useState, useEffect } from '@wordpress/element';
+import { useState } from '@wordpress/element';
 
 /**
  * Internal dependencies
@@ -31,14 +31,13 @@ function CategoryTabs({
   const selectedTabId = selectedCategory ? selectedCategory.name : null;
   const [activeTabId, setActiveId] = useState();
   const firstTabId = categories?.[0]?.name;
-  useEffect(() => {
-    // If there is no active tab, make the first tab the active tab, so that
-    // when focus is moved to the tablist, the first tab will be focused
-    // despite not being selected
-    if (selectedTabId === null && !activeTabId && firstTabId) {
-      setActiveId(firstTabId);
-    }
-  }, [selectedTabId, activeTabId, firstTabId, setActiveId]);
+
+  // If there is no active tab, make the first tab the active tab, so that
+  // when focus is moved to the tablist, the first tab will be focused
+  // despite not being selected
+  if (selectedTabId === null && !activeTabId && firstTabId) {
+    setActiveId(firstTabId);
+  }
   return /*#__PURE__*/_jsxs(Tabs, {
     selectOnMove: false,
     selectedTabId: selectedTabId,

package/build-module/components/inserter/category-tabs/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["usePrevious","useReducedMotion","privateApis","componentsPrivateApis","__unstableMotion","motion","useState","useEffect","unlock","jsx","_jsx","jsxs","_jsxs","Tabs","CategoryTabs","categories","selectedCategory","onSelectCategory","children","ANIMATION_DURATION","disableMotion","defaultTransition","type","duration","ease","previousSelectedCategory","selectedTabId","name","activeTabId","setActiveId","firstTabId","selectOnMove","orientation","onSelect","categoryId","find","category","onActiveTabIdChange","TabList","className","map","Tab","tabId","label","undefined","TabPanel","focusable","div","initial","animate","variants","open","transform","transitionEnd","zIndex","closed","transition"],"sources":["@wordpress/block-editor/src/components/inserter/category-tabs/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { usePrevious, useReducedMotion } from '@wordpress/compose';\nimport {\n\tprivateApis as componentsPrivateApis,\n\t__unstableMotion as motion,\n} from '@wordpress/components';\nimport { useState, useEffect } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../../lock-unlock';\n\nconst { Tabs } = unlock( componentsPrivateApis );\n\nfunction CategoryTabs( {\n\tcategories,\n\tselectedCategory,\n\tonSelectCategory,\n\tchildren,\n} ) {\n\t// Copied from InterfaceSkeleton.\n\tconst ANIMATION_DURATION = 0.25;\n\tconst disableMotion = useReducedMotion();\n\tconst defaultTransition = {\n\t\ttype: 'tween',\n\t\tduration: disableMotion ? 0 : ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\n\tconst previousSelectedCategory = usePrevious( selectedCategory );\n\n\tconst selectedTabId = selectedCategory ? selectedCategory.name : null;\n\tconst [ activeTabId, setActiveId ] = useState();\n\tconst firstTabId = categories?.[ 0 ]?.name;\n\tuseEffect( () => {\n\t\t// If there is no active tab, make the first tab the active tab, so that\n\t\t// when focus is moved to the tablist, the first tab will be focused\n\t\t// despite not being selected\n\t\tif ( selectedTabId === null && ! activeTabId && firstTabId ) {\n\t\t\tsetActiveId( firstTabId );\n\t\t}\n\t}, [ selectedTabId, activeTabId, firstTabId, setActiveId ] );\n\n\treturn (\n\t\t<Tabs\n\t\t\tselectOnMove={ false }\n\t\t\tselectedTabId={ selectedTabId }\n\t\t\torientation=\"vertical\"\n\t\t\tonSelect={ ( categoryId ) => {\n\t\t\t\t// Pass the full category object\n\t\t\t\tonSelectCategory(\n\t\t\t\t\tcategories.find(\n\t\t\t\t\t\t( category ) => category.name === categoryId\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} }\n\t\t\tactiveTabId={ activeTabId }\n\t\t\tonActiveTabIdChange={ setActiveId }\n\t\t>\n\t\t\t<Tabs.TabList className=\"block-editor-inserter__category-tablist\">\n\t\t\t\t{ categories.map( ( category ) => (\n\t\t\t\t\t<Tabs.Tab\n\t\t\t\t\t\tkey={ category.name }\n\t\t\t\t\t\ttabId={ category.name }\n\t\t\t\t\t\taria-label={ category.label }\n\t\t\t\t\t\taria-current={\n\t\t\t\t\t\t\tcategory === selectedCategory ? 'true' : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ category.label }\n\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t) ) }\n\t\t\t</Tabs.TabList>\n\t\t\t{ categories.map( ( category ) => (\n\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\tkey={ category.name }\n\t\t\t\t\ttabId={ category.name }\n\t\t\t\t\tfocusable={ false }\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tclassName=\"block-editor-inserter__category-panel\"\n\t\t\t\t\t\tinitial={\n\t\t\t\t\t\t\t! previousSelectedCategory ? 'closed' : 'open'\n\t\t\t\t\t\t}\n\t\t\t\t\t\tanimate=\"open\"\n\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\topen: {\n\t\t\t\t\t\t\t\ttransform: 'translateX( 0 )',\n\t\t\t\t\t\t\t\ttransitionEnd: {\n\t\t\t\t\t\t\t\t\tzIndex: '1',\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tclosed: {\n\t\t\t\t\t\t\t\ttransform: 'translateX( -100% )',\n\t\t\t\t\t\t\t\tzIndex: '-1',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</motion.div>\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t) ) }\n\t\t</Tabs>\n\t);\n}\n\nexport default CategoryTabs;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["usePrevious","useReducedMotion","privateApis","componentsPrivateApis","__unstableMotion","motion","useState","unlock","jsx","_jsx","jsxs","_jsxs","Tabs","CategoryTabs","categories","selectedCategory","onSelectCategory","children","ANIMATION_DURATION","disableMotion","defaultTransition","type","duration","ease","previousSelectedCategory","selectedTabId","name","activeTabId","setActiveId","firstTabId","selectOnMove","orientation","onSelect","categoryId","find","category","onActiveTabIdChange","TabList","className","map","Tab","tabId","label","undefined","TabPanel","focusable","div","initial","animate","variants","open","transform","transitionEnd","zIndex","closed","transition"],"sources":["@wordpress/block-editor/src/components/inserter/category-tabs/index.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { usePrevious, useReducedMotion } from '@wordpress/compose';\nimport {\n\tprivateApis as componentsPrivateApis,\n\t__unstableMotion as motion,\n} from '@wordpress/components';\nimport { useState } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport { unlock } from '../../../lock-unlock';\n\nconst { Tabs } = unlock( componentsPrivateApis );\n\nfunction CategoryTabs( {\n\tcategories,\n\tselectedCategory,\n\tonSelectCategory,\n\tchildren,\n} ) {\n\t// Copied from InterfaceSkeleton.\n\tconst ANIMATION_DURATION = 0.25;\n\tconst disableMotion = useReducedMotion();\n\tconst defaultTransition = {\n\t\ttype: 'tween',\n\t\tduration: disableMotion ? 0 : ANIMATION_DURATION,\n\t\tease: [ 0.6, 0, 0.4, 1 ],\n\t};\n\n\tconst previousSelectedCategory = usePrevious( selectedCategory );\n\n\tconst selectedTabId = selectedCategory ? selectedCategory.name : null;\n\tconst [ activeTabId, setActiveId ] = useState();\n\tconst firstTabId = categories?.[ 0 ]?.name;\n\n\t// If there is no active tab, make the first tab the active tab, so that\n\t// when focus is moved to the tablist, the first tab will be focused\n\t// despite not being selected\n\tif ( selectedTabId === null && ! activeTabId && firstTabId ) {\n\t\tsetActiveId( firstTabId );\n\t}\n\n\treturn (\n\t\t<Tabs\n\t\t\tselectOnMove={ false }\n\t\t\tselectedTabId={ selectedTabId }\n\t\t\torientation=\"vertical\"\n\t\t\tonSelect={ ( categoryId ) => {\n\t\t\t\t// Pass the full category object\n\t\t\t\tonSelectCategory(\n\t\t\t\t\tcategories.find(\n\t\t\t\t\t\t( category ) => category.name === categoryId\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t\t} }\n\t\t\tactiveTabId={ activeTabId }\n\t\t\tonActiveTabIdChange={ setActiveId }\n\t\t>\n\t\t\t<Tabs.TabList className=\"block-editor-inserter__category-tablist\">\n\t\t\t\t{ categories.map( ( category ) => (\n\t\t\t\t\t<Tabs.Tab\n\t\t\t\t\t\tkey={ category.name }\n\t\t\t\t\t\ttabId={ category.name }\n\t\t\t\t\t\taria-label={ category.label }\n\t\t\t\t\t\taria-current={\n\t\t\t\t\t\t\tcategory === selectedCategory ? 'true' : undefined\n\t\t\t\t\t\t}\n\t\t\t\t\t>\n\t\t\t\t\t\t{ category.label }\n\t\t\t\t\t</Tabs.Tab>\n\t\t\t\t) ) }\n\t\t\t</Tabs.TabList>\n\t\t\t{ categories.map( ( category ) => (\n\t\t\t\t<Tabs.TabPanel\n\t\t\t\t\tkey={ category.name }\n\t\t\t\t\ttabId={ category.name }\n\t\t\t\t\tfocusable={ false }\n\t\t\t\t>\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tclassName=\"block-editor-inserter__category-panel\"\n\t\t\t\t\t\tinitial={\n\t\t\t\t\t\t\t! previousSelectedCategory ? 'closed' : 'open'\n\t\t\t\t\t\t}\n\t\t\t\t\t\tanimate=\"open\"\n\t\t\t\t\t\tvariants={ {\n\t\t\t\t\t\t\topen: {\n\t\t\t\t\t\t\t\ttransform: 'translateX( 0 )',\n\t\t\t\t\t\t\t\ttransitionEnd: {\n\t\t\t\t\t\t\t\t\tzIndex: '1',\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tclosed: {\n\t\t\t\t\t\t\t\ttransform: 'translateX( -100% )',\n\t\t\t\t\t\t\t\tzIndex: '-1',\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t} }\n\t\t\t\t\t\ttransition={ defaultTransition }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ children }\n\t\t\t\t\t</motion.div>\n\t\t\t\t</Tabs.TabPanel>\n\t\t\t) ) }\n\t\t</Tabs>\n\t);\n}\n\nexport default CategoryTabs;\n"],"mappings":"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","ignoreList":[]}

package/build-module/components/inserter-draggable-blocks/index.js

@@ -24,6 +24,7 @@ const InserterDraggableBlocks = ({
     type: 'inserter',
     blocks
   };
+  const blocksContainMedia = blocks.filter(block => (block.name === 'core/image' || block.name === 'core/audio' || block.name === 'core/video') && (block.attributes.url || block.attributes.src)).length > 0;
   const blockTypeIcon = useSelect(select => {
     const {
       getBlockType
@@ -49,7 +50,7 @@ const InserterDraggableBlocks = ({
       const parsedBlocks = pattern?.type === INSERTER_PATTERN_TYPES.user && pattern?.syncStatus !== 'unsynced' ? [createBlock('core/block', {
         ref: pattern.id
       })] : blocks;
-      event.dataTransfer.setData('text/html', serialize(parsedBlocks));
+      event.dataTransfer.setData(blocksContainMedia ? 'default' : 'text/html', serialize(parsedBlocks));
     },
     onDragEnd: () => {
       stopDragging();