@wordpress/block-editor 15.5.0 → 15.5.1-next.47f435fc9.0

package/build/components/iframe/use-scale-canvas.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_element","require","_compose","calculateScale","frameSize","containerWidth","maxContainerWidth","scaleContainerWidth","Math","min","computeScrollHeightNext","transitionFrom","transitionTo","scaleValue","prevScale","scrollHeight","prevScrollHeight","computeScrollTopNext","containerHeight","prevContainerHeight","prevFrameSize","scrollTop","prevScrollTop","scrollTopNext","maxScrollTop","round","max","getAnimationKeyframes","translate","scale","paddingTop","paddingBottom","useScaleCanvas","iframeDocument","contentResizeListener","height","contentHeight","useResizeObserver","containerResizeListener","width","initialContainerWidthRef","useRef","isZoomedOut","prefersReducedMotion","useReducedMotion","isAutoScaled","startAnimationRef","animationRef","useEffect","current","transitionFromRef","transitionToRef","startZoomOutAnimation","useCallback","documentElement","style","setProperty","classList","add","animate","easing","duration","finishZoomOutAnimation","remove","removeProperty","previousIsZoomedOut","trigger","reverse","tempTransitionFrom","tempTransitionTo","clientHeight","onfinish"],"sources":["@wordpress/block-editor/src/components/iframe/use-scale-canvas.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useCallback } from '@wordpress/element';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\n\n/**\n * @typedef {Object} TransitionState\n * @property {number} scaleValue      Scale of the canvas.\n * @property {number} frameSize       Size of the frame/offset around the canvas.\n * @property {number} containerHeight containerHeight of the iframe.\n * @property {number} scrollTop       ScrollTop of the iframe.\n * @property {number} scrollHeight    ScrollHeight of the iframe.\n */\n\n/**\n * Calculate the scale of the canvas.\n *\n * @param {Object} options                     Object of options\n * @param {number} options.frameSize           Size of the frame/offset around the canvas\n * @param {number} options.containerWidth      Actual width of the canvas container\n * @param {number} options.maxContainerWidth   Maximum width of the container to use for the scale calculation. This locks the canvas to a maximum width when zooming out.\n * @param {number} options.scaleContainerWidth Width the of the container wrapping the canvas container\n * @return {number} Scale value between 0 and/or equal to 1\n */\nfunction calculateScale( {\n\tframeSize,\n\tcontainerWidth,\n\tmaxContainerWidth,\n\tscaleContainerWidth,\n} ) {\n\treturn (\n\t\t( Math.min( containerWidth, maxContainerWidth ) - frameSize * 2 ) /\n\t\tscaleContainerWidth\n\t);\n}\n\n/**\n * Compute the next scrollHeight based on the transition states.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo   Ending state of the transition\n * @return {number} Next scrollHeight based on scale and frame value changes.\n */\nfunction computeScrollHeightNext( transitionFrom, transitionTo ) {\n\tconst { scaleValue: prevScale, scrollHeight: prevScrollHeight } =\n\t\ttransitionFrom;\n\tconst { frameSize, scaleValue } = transitionTo;\n\n\treturn prevScrollHeight * ( scaleValue / prevScale ) + frameSize * 2;\n}\n\n/**\n * Compute the next scrollTop position after scaling the iframe content.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo   Ending state of the transition\n * @return {number} Next scrollTop position after scaling the iframe content.\n */\nfunction computeScrollTopNext( transitionFrom, transitionTo ) {\n\tconst {\n\t\tcontainerHeight: prevContainerHeight,\n\t\tframeSize: prevFrameSize,\n\t\tscaleValue: prevScale,\n\t\tscrollTop: prevScrollTop,\n\t} = transitionFrom;\n\tconst { containerHeight, frameSize, scaleValue, scrollHeight } =\n\t\ttransitionTo;\n\t// Step 0: Start with the current scrollTop.\n\tlet scrollTopNext = prevScrollTop;\n\t// Step 1: Undo the effects of the previous scale and frame around the\n\t// midpoint of the visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + prevContainerHeight / 2 - prevFrameSize ) /\n\t\t\tprevScale -\n\t\tprevContainerHeight / 2;\n\n\t// Step 2: Apply the new scale and frame around the midpoint of the\n\t// visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + containerHeight / 2 ) * scaleValue +\n\t\tframeSize -\n\t\tcontainerHeight / 2;\n\n\t// Step 3: Handle an edge case so that you scroll to the top of the\n\t// iframe if the top of the iframe content is visible in the container.\n\t// The same edge case for the bottom is skipped because changing content\n\t// makes calculating it impossible.\n\tscrollTopNext = prevScrollTop <= prevFrameSize ? 0 : scrollTopNext;\n\n\t// This is the scrollTop value if you are scrolled to the bottom of the\n\t// iframe. We can't just let the browser handle it because we need to\n\t// animate the scaling.\n\tconst maxScrollTop = scrollHeight - containerHeight;\n\n\t// Step 4: Clamp the scrollTopNext between the minimum and maximum\n\t// possible scrollTop positions. Round the value to avoid subpixel\n\t// truncation by the browser which sometimes causes a 1px error.\n\treturn Math.round(\n\t\tMath.min( Math.max( 0, scrollTopNext ), Math.max( 0, maxScrollTop ) )\n\t);\n}\n\n/**\n * Generate the keyframes to use for the zoom out animation.\n *\n * @param {TransitionState} transitionFrom Starting transition state.\n * @param {TransitionState} transitionTo   Ending transition state.\n * @return {Object[]} An array of keyframes to use for the animation.\n */\nfunction getAnimationKeyframes( transitionFrom, transitionTo ) {\n\tconst {\n\t\tscaleValue: prevScale,\n\t\tframeSize: prevFrameSize,\n\t\tscrollTop,\n\t} = transitionFrom;\n\tconst { scaleValue, frameSize, scrollTop: scrollTopNext } = transitionTo;\n\n\treturn [\n\t\t{\n\t\t\ttranslate: `0 0`,\n\t\t\tscale: prevScale,\n\t\t\tpaddingTop: `${ prevFrameSize / prevScale }px`,\n\t\t\tpaddingBottom: `${ prevFrameSize / prevScale }px`,\n\t\t},\n\t\t{\n\t\t\ttranslate: `0 ${ scrollTop - scrollTopNext }px`,\n\t\t\tscale: scaleValue,\n\t\t\tpaddingTop: `${ frameSize / scaleValue }px`,\n\t\t\tpaddingBottom: `${ frameSize / scaleValue }px`,\n\t\t},\n\t];\n}\n\n/**\n * @typedef {Object} ScaleCanvasResult\n * @property {boolean} isZoomedOut             A boolean indicating if the canvas is zoomed out.\n * @property {number}  scaleContainerWidth     The width of the container used to calculate the scale.\n * @property {Object}  contentResizeListener   A resize observer for the content.\n * @property {Object}  containerResizeListener A resize observer for the container.\n */\n\n/**\n * Handles scaling the canvas for the zoom out mode and animating between\n * the states.\n *\n * @param {Object}        options                   Object of options.\n * @param {number}        options.frameSize         Size of the frame around the content.\n * @param {Document}      options.iframeDocument    Document of the iframe.\n * @param {number}        options.maxContainerWidth Max width of the canvas to use as the starting scale point. Defaults to 750.\n * @param {number|string} options.scale             Scale of the canvas. Can be an decimal between 0 and 1, 1, or 'auto-scaled'.\n * @return {ScaleCanvasResult} Properties of the result.\n */\nexport function useScaleCanvas( {\n\tframeSize,\n\tiframeDocument,\n\tmaxContainerWidth = 750,\n\tscale,\n} ) {\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [\n\t\tcontainerResizeListener,\n\t\t{ width: containerWidth, height: containerHeight },\n\t] = useResizeObserver();\n\n\tconst initialContainerWidthRef = useRef( 0 );\n\tconst isZoomedOut = scale !== 1;\n\tconst prefersReducedMotion = useReducedMotion();\n\tconst isAutoScaled = scale === 'auto-scaled';\n\t// Track if the animation should start when the useEffect runs.\n\tconst startAnimationRef = useRef( false );\n\t// Track the animation so we know if we have an animation running,\n\t// and can cancel it, reverse it, call a finish event, etc.\n\tconst animationRef = useRef( null );\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 scaleValue = isAutoScaled\n\t\t? calculateScale( {\n\t\t\t\tframeSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth,\n\t\t  } )\n\t\t: scale;\n\n\t/**\n\t * The starting transition state for the zoom out animation.\n\t * @type {import('react').RefObject<TransitionState>}\n\t */\n\tconst transitionFromRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * The ending transition state for the zoom out animation.\n\t * @type {import('react').RefObject<TransitionState>}\n\t */\n\tconst transitionToRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * Start the zoom out animation. This sets the necessary CSS variables\n\t * for animating the canvas and returns the Animation object.\n\t *\n\t * @return {Animation} The animation object for the zoom out animation.\n\t */\n\tconst startZoomOutAnimation = useCallback( () => {\n\t\tconst { scrollTop } = transitionFromRef.current;\n\t\tconst { scrollTop: scrollTopNext } = transitionToRef.current;\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\t// If the container has a scrolllbar, force a scrollbar to prevent the content from shifting while animating.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior',\n\t\t\ttransitionFromRef.current.scrollHeight ===\n\t\t\t\ttransitionFromRef.current.containerHeight\n\t\t\t\t? 'auto'\n\t\t\t\t: 'scroll'\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.add( 'zoom-out-animation' );\n\n\t\treturn iframeDocument.documentElement.animate(\n\t\t\tgetAnimationKeyframes(\n\t\t\t\ttransitionFromRef.current,\n\t\t\t\ttransitionToRef.current\n\t\t\t),\n\t\t\t{\n\t\t\t\teasing: 'cubic-bezier(0.46, 0.03, 0.52, 0.96)',\n\t\t\t\tduration: 400,\n\t\t\t}\n\t\t);\n\t}, [ iframeDocument ] );\n\n\t/**\n\t * Callback when the zoom out animation is finished.\n\t * - Cleans up animations refs.\n\t * - Adds final CSS vars for scale and frame size to preserve the state.\n\t * - Removes the 'zoom-out-animation' class (which has the fixed positioning).\n\t * - Sets the final scroll position after the canvas is no longer in fixed position.\n\t * - Removes CSS vars related to the animation.\n\t * - Sets the transitionFrom to the transitionTo state to be ready for the next animation.\n\t */\n\tconst finishZoomOutAnimation = useCallback( () => {\n\t\tstartAnimationRef.current = false;\n\t\tanimationRef.current = null;\n\n\t\t// Add our final scale and frame size now that the animation is done.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\ttransitionToRef.current.scaleValue\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t`${ transitionToRef.current.frameSize }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.remove( 'zoom-out-animation' );\n\n\t\t// Set the final scroll position that was just animated to.\n\t\t// Disable reason: Eslint isn't smart enough to know that this is a\n\t\t// DOM element. https://github.com/facebook/react/issues/31483\n\t\t// eslint-disable-next-line react-compiler/react-compiler\n\t\tiframeDocument.documentElement.scrollTop =\n\t\t\ttransitionToRef.current.scrollTop;\n\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior'\n\t\t);\n\n\t\t// Update previous values.\n\t\ttransitionFromRef.current = transitionToRef.current;\n\t}, [ iframeDocument ] );\n\n\tconst previousIsZoomedOut = useRef( false );\n\n\t/**\n\t * Runs when zoom out mode is toggled, and sets the startAnimation flag\n\t * so the animation will start when the next useEffect runs. We _only_\n\t * want to animate when the zoom out mode is toggled, not when the scale\n\t * changes due to the container resizing.\n\t */\n\tuseEffect( () => {\n\t\tconst trigger =\n\t\t\tiframeDocument && previousIsZoomedOut.current !== isZoomedOut;\n\n\t\tpreviousIsZoomedOut.current = isZoomedOut;\n\n\t\tif ( ! trigger ) {\n\t\t\treturn;\n\t\t}\n\n\t\tstartAnimationRef.current = true;\n\n\t\tif ( ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t/**\n\t * This handles:\n\t * 1. Setting the correct scale and vars of the canvas when zoomed out\n\t * 2. If zoom out mode has been toggled, runs the animation of zooming in/out\n\t */\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We need to update the appropriate scale to exit from. If sidebars have been opened since setting the\n\t\t// original scale, we will snap to a much smaller scale due to the scale container immediately changing sizes when exiting.\n\t\tif ( isAutoScaled && transitionFromRef.current.scaleValue !== 1 ) {\n\t\t\t// We use containerWidth as the divisor, as scaleContainerWidth will always match the containerWidth when\n\t\t\t// exiting.\n\t\t\ttransitionFromRef.current.scaleValue = calculateScale( {\n\t\t\t\tframeSize: transitionFromRef.current.frameSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth: containerWidth,\n\t\t\t} );\n\t\t}\n\n\t\tif ( scaleValue < 1 ) {\n\t\t\t// If we are not going to animate the transition, set the scale and frame size directly.\n\t\t\t// If we are animating, these values will be set when the animation is finished.\n\t\t\t// Example: Opening sidebars that reduce the scale of the canvas, but we don't want to\n\t\t\t// animate the transition.\n\t\t\tif ( ! startAnimationRef.current ) {\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\t\t\tscaleValue\n\t\t\t\t);\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t\t\t`${ frameSize }px`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t\t`${ contentHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t\t`${ containerHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t\t`${ containerWidth }px`\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t\t`${ scaleContainerWidth }px`\n\t\t\t);\n\t\t}\n\n\t\t/**\n\t\t * Handle the zoom out animation:\n\t\t *\n\t\t * - Get the current scrollTop position.\n\t\t * - Calculate where the same scroll position is after scaling.\n\t\t * - Apply fixed positioning to the canvas with a transform offset\n\t\t *   to keep the canvas centered.\n\t\t * - Animate the scale and padding to the new scale and frame size.\n\t\t * - After the animation is complete, remove the fixed positioning\n\t\t *   and set the scroll position that keeps everything centered.\n\t\t */\n\t\tif ( startAnimationRef.current ) {\n\t\t\t// Don't allow a new transition to start again unless it was started by the zoom out mode changing.\n\t\t\tstartAnimationRef.current = false;\n\n\t\t\t/**\n\t\t\t * If we already have an animation running, reverse it.\n\t\t\t */\n\t\t\tif ( animationRef.current ) {\n\t\t\t\tanimationRef.current.reverse();\n\t\t\t\t// Swap the transition to/from refs so that we set the correct values when\n\t\t\t\t// finishZoomOutAnimation runs.\n\t\t\t\tconst tempTransitionFrom = transitionFromRef.current;\n\t\t\t\tconst tempTransitionTo = transitionToRef.current;\n\t\t\t\ttransitionFromRef.current = tempTransitionTo;\n\t\t\t\ttransitionToRef.current = tempTransitionFrom;\n\t\t\t} else {\n\t\t\t\t/**\n\t\t\t\t * Start a new zoom animation.\n\t\t\t\t */\n\n\t\t\t\t// We can't trust the set value from contentHeight, as it was measured\n\t\t\t\t// before the zoom out mode was changed. After zoom out mode is changed,\n\t\t\t\t// appenders may appear or disappear, so we need to get the height from\n\t\t\t\t// the iframe at this point when we're about to animate the zoom out.\n\t\t\t\t// The iframe scrollTop, scrollHeight, and clientHeight will all be\n\t\t\t\t// the most accurate.\n\t\t\t\ttransitionFromRef.current.scrollTop =\n\t\t\t\t\tiframeDocument.documentElement.scrollTop;\n\t\t\t\ttransitionFromRef.current.scrollHeight =\n\t\t\t\t\tiframeDocument.documentElement.scrollHeight;\n\t\t\t\t// Use containerHeight, as it's the previous container height before the zoom out animation starts.\n\t\t\t\ttransitionFromRef.current.containerHeight = containerHeight;\n\n\t\t\t\ttransitionToRef.current = {\n\t\t\t\t\tscaleValue,\n\t\t\t\t\tframeSize,\n\t\t\t\t\tcontainerHeight:\n\t\t\t\t\t\tiframeDocument.documentElement.clientHeight, // use clientHeight to get the actual height of the new container after zoom state changes have rendered, as it will be the most up-to-date.\n\t\t\t\t};\n\n\t\t\t\ttransitionToRef.current.scrollHeight = computeScrollHeightNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\t\t\t\ttransitionToRef.current.scrollTop = computeScrollTopNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\n\t\t\t\tanimationRef.current = startZoomOutAnimation();\n\n\t\t\t\t// If the user prefers reduced motion, finish the animation immediately and set the final state.\n\t\t\t\tif ( prefersReducedMotion ) {\n\t\t\t\t\tfinishZoomOutAnimation();\n\t\t\t\t} else {\n\t\t\t\t\tanimationRef.current.onfinish = finishZoomOutAnimation;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}, [\n\t\tstartZoomOutAnimation,\n\t\tfinishZoomOutAnimation,\n\t\tprefersReducedMotion,\n\t\tisAutoScaled,\n\t\tscaleValue,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\tcontainerHeight,\n\t\tmaxContainerWidth,\n\t\tscaleContainerWidth,\n\t] );\n\n\treturn {\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t\tcontentResizeListener,\n\t\tcontainerResizeListener,\n\t};\n}\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/iframe/use-scale-canvas.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useCallback } from '@wordpress/element';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\n\n/**\n * @typedef {Object} TransitionState\n * @property {number} scaleValue      Scale of the canvas.\n * @property {number} frameSize       Size of the frame/offset around the canvas.\n * @property {number} containerHeight containerHeight of the iframe.\n * @property {number} scrollTop       ScrollTop of the iframe.\n * @property {number} scrollHeight    ScrollHeight of the iframe.\n */\n\n/**\n * Calculate the scale of the canvas.\n *\n * @param {Object} options                     Object of options\n * @param {number} options.frameSize           Size of the frame/offset around the canvas\n * @param {number} options.containerWidth      Actual width of the canvas container\n * @param {number} options.maxContainerWidth   Maximum width of the container to use for the scale calculation. This locks the canvas to a maximum width when zooming out.\n * @param {number} options.scaleContainerWidth Width the of the container wrapping the canvas container\n * @return {number} Scale value between 0 and/or equal to 1\n */\nfunction calculateScale( {\n\tframeSize,\n\tcontainerWidth,\n\tmaxContainerWidth,\n\tscaleContainerWidth,\n} ) {\n\treturn (\n\t\t( Math.min( containerWidth, maxContainerWidth ) - frameSize * 2 ) /\n\t\tscaleContainerWidth\n\t);\n}\n\n/**\n * Compute the next scrollHeight based on the transition states.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo   Ending state of the transition\n * @return {number} Next scrollHeight based on scale and frame value changes.\n */\nfunction computeScrollHeightNext( transitionFrom, transitionTo ) {\n\tconst { scaleValue: prevScale, scrollHeight: prevScrollHeight } =\n\t\ttransitionFrom;\n\tconst { frameSize, scaleValue } = transitionTo;\n\n\treturn prevScrollHeight * ( scaleValue / prevScale ) + frameSize * 2;\n}\n\n/**\n * Compute the next scrollTop position after scaling the iframe content.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo   Ending state of the transition\n * @return {number} Next scrollTop position after scaling the iframe content.\n */\nfunction computeScrollTopNext( transitionFrom, transitionTo ) {\n\tconst {\n\t\tcontainerHeight: prevContainerHeight,\n\t\tframeSize: prevFrameSize,\n\t\tscaleValue: prevScale,\n\t\tscrollTop: prevScrollTop,\n\t} = transitionFrom;\n\tconst { containerHeight, frameSize, scaleValue, scrollHeight } =\n\t\ttransitionTo;\n\t// Step 0: Start with the current scrollTop.\n\tlet scrollTopNext = prevScrollTop;\n\t// Step 1: Undo the effects of the previous scale and frame around the\n\t// midpoint of the visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + prevContainerHeight / 2 - prevFrameSize ) /\n\t\t\tprevScale -\n\t\tprevContainerHeight / 2;\n\n\t// Step 2: Apply the new scale and frame around the midpoint of the\n\t// visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + containerHeight / 2 ) * scaleValue +\n\t\tframeSize -\n\t\tcontainerHeight / 2;\n\n\t// Step 3: Handle an edge case so that you scroll to the top of the\n\t// iframe if the top of the iframe content is visible in the container.\n\t// The same edge case for the bottom is skipped because changing content\n\t// makes calculating it impossible.\n\tscrollTopNext = prevScrollTop <= prevFrameSize ? 0 : scrollTopNext;\n\n\t// This is the scrollTop value if you are scrolled to the bottom of the\n\t// iframe. We can't just let the browser handle it because we need to\n\t// animate the scaling.\n\tconst maxScrollTop = scrollHeight - containerHeight;\n\n\t// Step 4: Clamp the scrollTopNext between the minimum and maximum\n\t// possible scrollTop positions. Round the value to avoid subpixel\n\t// truncation by the browser which sometimes causes a 1px error.\n\treturn Math.round(\n\t\tMath.min( Math.max( 0, scrollTopNext ), Math.max( 0, maxScrollTop ) )\n\t);\n}\n\n/**\n * Generate the keyframes to use for the zoom out animation.\n *\n * @param {TransitionState} transitionFrom Starting transition state.\n * @param {TransitionState} transitionTo   Ending transition state.\n * @return {Object[]} An array of keyframes to use for the animation.\n */\nfunction getAnimationKeyframes( transitionFrom, transitionTo ) {\n\tconst {\n\t\tscaleValue: prevScale,\n\t\tframeSize: prevFrameSize,\n\t\tscrollTop,\n\t} = transitionFrom;\n\tconst { scaleValue, frameSize, scrollTop: scrollTopNext } = transitionTo;\n\n\treturn [\n\t\t{\n\t\t\ttranslate: `0 0`,\n\t\t\tscale: prevScale,\n\t\t\tpaddingTop: `${ prevFrameSize / prevScale }px`,\n\t\t\tpaddingBottom: `${ prevFrameSize / prevScale }px`,\n\t\t},\n\t\t{\n\t\t\ttranslate: `0 ${ scrollTop - scrollTopNext }px`,\n\t\t\tscale: scaleValue,\n\t\t\tpaddingTop: `${ frameSize / scaleValue }px`,\n\t\t\tpaddingBottom: `${ frameSize / scaleValue }px`,\n\t\t},\n\t];\n}\n\n/**\n * @typedef {Object} ScaleCanvasResult\n * @property {boolean} isZoomedOut             A boolean indicating if the canvas is zoomed out.\n * @property {number}  scaleContainerWidth     The width of the container used to calculate the scale.\n * @property {Object}  contentResizeListener   A resize observer for the content.\n * @property {Object}  containerResizeListener A resize observer for the container.\n */\n\n/**\n * Handles scaling the canvas for the zoom out mode and animating between\n * the states.\n *\n * @param {Object}        options                   Object of options.\n * @param {number}        options.frameSize         Size of the frame around the content.\n * @param {Document}      options.iframeDocument    Document of the iframe.\n * @param {number}        options.maxContainerWidth Max width of the canvas to use as the starting scale point. Defaults to 750.\n * @param {number|string} options.scale             Scale of the canvas. Can be an decimal between 0 and 1, 1, or 'auto-scaled'.\n * @return {ScaleCanvasResult} Properties of the result.\n */\nexport function useScaleCanvas( {\n\tframeSize,\n\tiframeDocument,\n\tmaxContainerWidth = 750,\n\tscale,\n} ) {\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [\n\t\tcontainerResizeListener,\n\t\t{ width: containerWidth, height: containerHeight },\n\t] = useResizeObserver();\n\n\tconst initialContainerWidthRef = useRef( 0 );\n\tconst isZoomedOut = scale !== 1;\n\tconst prefersReducedMotion = useReducedMotion();\n\tconst isAutoScaled = scale === 'auto-scaled';\n\t// Track if the animation should start when the useEffect runs.\n\tconst startAnimationRef = useRef( false );\n\t// Track the animation so we know if we have an animation running,\n\t// and can cancel it, reverse it, call a finish event, etc.\n\tconst animationRef = useRef( null );\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 scaleValue = isAutoScaled\n\t\t? calculateScale( {\n\t\t\t\tframeSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth,\n\t\t  } )\n\t\t: scale;\n\n\t/**\n\t * The starting transition state for the zoom out animation.\n\t * @type {import('react').RefObject<TransitionState>}\n\t */\n\tconst transitionFromRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * The ending transition state for the zoom out animation.\n\t * @type {import('react').RefObject<TransitionState>}\n\t */\n\tconst transitionToRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * Start the zoom out animation. This sets the necessary CSS variables\n\t * for animating the canvas and returns the Animation object.\n\t *\n\t * @return {Animation} The animation object for the zoom out animation.\n\t */\n\tconst startZoomOutAnimation = useCallback( () => {\n\t\tconst { scrollTop } = transitionFromRef.current;\n\t\tconst { scrollTop: scrollTopNext } = transitionToRef.current;\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\t// If the container has a scrolllbar, force a scrollbar to prevent the content from shifting while animating.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior',\n\t\t\ttransitionFromRef.current.scrollHeight ===\n\t\t\t\ttransitionFromRef.current.containerHeight\n\t\t\t\t? 'auto'\n\t\t\t\t: 'scroll'\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.add( 'zoom-out-animation' );\n\n\t\treturn iframeDocument.documentElement.animate(\n\t\t\tgetAnimationKeyframes(\n\t\t\t\ttransitionFromRef.current,\n\t\t\t\ttransitionToRef.current\n\t\t\t),\n\t\t\t{\n\t\t\t\teasing: 'cubic-bezier(0.46, 0.03, 0.52, 0.96)',\n\t\t\t\tduration: 400,\n\t\t\t}\n\t\t);\n\t}, [ iframeDocument ] );\n\n\t/**\n\t * Callback when the zoom out animation is finished.\n\t * - Cleans up animations refs.\n\t * - Adds final CSS vars for scale and frame size to preserve the state.\n\t * - Removes the 'zoom-out-animation' class (which has the fixed positioning).\n\t * - Sets the final scroll position after the canvas is no longer in fixed position.\n\t * - Removes CSS vars related to the animation.\n\t * - Sets the transitionFrom to the transitionTo state to be ready for the next animation.\n\t */\n\tconst finishZoomOutAnimation = useCallback( () => {\n\t\tstartAnimationRef.current = false;\n\t\tanimationRef.current = null;\n\n\t\t// Add our final scale and frame size now that the animation is done.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\ttransitionToRef.current.scaleValue\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t`${ transitionToRef.current.frameSize }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.remove( 'zoom-out-animation' );\n\n\t\t// Set the final scroll position that was just animated to.\n\t\t// Disable reason: Eslint isn't smart enough to know that this is a\n\t\t// DOM element. https://github.com/facebook/react/issues/31483\n\t\t// eslint-disable-next-line react-compiler/react-compiler\n\t\tiframeDocument.documentElement.scrollTop =\n\t\t\ttransitionToRef.current.scrollTop;\n\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior'\n\t\t);\n\n\t\t// Update previous values.\n\t\ttransitionFromRef.current = transitionToRef.current;\n\t}, [ iframeDocument ] );\n\n\tconst previousIsZoomedOut = useRef( false );\n\n\t/**\n\t * Runs when zoom out mode is toggled, and sets the startAnimation flag\n\t * so the animation will start when the next useEffect runs. We _only_\n\t * want to animate when the zoom out mode is toggled, not when the scale\n\t * changes due to the container resizing.\n\t */\n\tuseEffect( () => {\n\t\tconst trigger =\n\t\t\tiframeDocument && previousIsZoomedOut.current !== isZoomedOut;\n\n\t\tpreviousIsZoomedOut.current = isZoomedOut;\n\n\t\tif ( ! trigger ) {\n\t\t\treturn;\n\t\t}\n\n\t\tstartAnimationRef.current = true;\n\n\t\tif ( ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t/**\n\t * This handles:\n\t * 1. Setting the correct scale and vars of the canvas when zoomed out\n\t * 2. If zoom out mode has been toggled, runs the animation of zooming in/out\n\t */\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We need to update the appropriate scale to exit from. If sidebars have been opened since setting the\n\t\t// original scale, we will snap to a much smaller scale due to the scale container immediately changing sizes when exiting.\n\t\tif ( isAutoScaled && transitionFromRef.current.scaleValue !== 1 ) {\n\t\t\t// We use containerWidth as the divisor, as scaleContainerWidth will always match the containerWidth when\n\t\t\t// exiting.\n\t\t\ttransitionFromRef.current.scaleValue = calculateScale( {\n\t\t\t\tframeSize: transitionFromRef.current.frameSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth: containerWidth,\n\t\t\t} );\n\t\t}\n\n\t\tif ( scaleValue < 1 ) {\n\t\t\t// If we are not going to animate the transition, set the scale and frame size directly.\n\t\t\t// If we are animating, these values will be set when the animation is finished.\n\t\t\t// Example: Opening sidebars that reduce the scale of the canvas, but we don't want to\n\t\t\t// animate the transition.\n\t\t\tif ( ! startAnimationRef.current ) {\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\t\t\tscaleValue\n\t\t\t\t);\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t\t\t`${ frameSize }px`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t\t`${ contentHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t\t`${ containerHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t\t`${ containerWidth }px`\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t\t`${ scaleContainerWidth }px`\n\t\t\t);\n\t\t}\n\n\t\t/**\n\t\t * Handle the zoom out animation:\n\t\t *\n\t\t * - Get the current scrollTop position.\n\t\t * - Calculate where the same scroll position is after scaling.\n\t\t * - Apply fixed positioning to the canvas with a transform offset\n\t\t *   to keep the canvas centered.\n\t\t * - Animate the scale and padding to the new scale and frame size.\n\t\t * - After the animation is complete, remove the fixed positioning\n\t\t *   and set the scroll position that keeps everything centered.\n\t\t */\n\t\tif ( startAnimationRef.current ) {\n\t\t\t// Don't allow a new transition to start again unless it was started by the zoom out mode changing.\n\t\t\tstartAnimationRef.current = false;\n\n\t\t\t/**\n\t\t\t * If we already have an animation running, reverse it.\n\t\t\t */\n\t\t\tif ( animationRef.current ) {\n\t\t\t\tanimationRef.current.reverse();\n\t\t\t\t// Swap the transition to/from refs so that we set the correct values when\n\t\t\t\t// finishZoomOutAnimation runs.\n\t\t\t\tconst tempTransitionFrom = transitionFromRef.current;\n\t\t\t\tconst tempTransitionTo = transitionToRef.current;\n\t\t\t\ttransitionFromRef.current = tempTransitionTo;\n\t\t\t\ttransitionToRef.current = tempTransitionFrom;\n\t\t\t} else {\n\t\t\t\t/**\n\t\t\t\t * Start a new zoom animation.\n\t\t\t\t */\n\n\t\t\t\t// We can't trust the set value from contentHeight, as it was measured\n\t\t\t\t// before the zoom out mode was changed. After zoom out mode is changed,\n\t\t\t\t// appenders may appear or disappear, so we need to get the height from\n\t\t\t\t// the iframe at this point when we're about to animate the zoom out.\n\t\t\t\t// The iframe scrollTop, scrollHeight, and clientHeight will all be\n\t\t\t\t// the most accurate.\n\t\t\t\ttransitionFromRef.current.scrollTop =\n\t\t\t\t\tiframeDocument.documentElement.scrollTop;\n\t\t\t\ttransitionFromRef.current.scrollHeight =\n\t\t\t\t\tiframeDocument.documentElement.scrollHeight;\n\t\t\t\t// Use containerHeight, as it's the previous container height before the zoom out animation starts.\n\t\t\t\ttransitionFromRef.current.containerHeight = containerHeight;\n\n\t\t\t\ttransitionToRef.current = {\n\t\t\t\t\tscaleValue,\n\t\t\t\t\tframeSize,\n\t\t\t\t\tcontainerHeight:\n\t\t\t\t\t\tiframeDocument.documentElement.clientHeight, // use clientHeight to get the actual height of the new container after zoom state changes have rendered, as it will be the most up-to-date.\n\t\t\t\t};\n\n\t\t\t\ttransitionToRef.current.scrollHeight = computeScrollHeightNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\t\t\t\ttransitionToRef.current.scrollTop = computeScrollTopNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\n\t\t\t\tanimationRef.current = startZoomOutAnimation();\n\n\t\t\t\t// If the user prefers reduced motion, finish the animation immediately and set the final state.\n\t\t\t\tif ( prefersReducedMotion ) {\n\t\t\t\t\tfinishZoomOutAnimation();\n\t\t\t\t} else {\n\t\t\t\t\tanimationRef.current.onfinish = finishZoomOutAnimation;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}, [\n\t\tstartZoomOutAnimation,\n\t\tfinishZoomOutAnimation,\n\t\tprefersReducedMotion,\n\t\tisAutoScaled,\n\t\tscaleValue,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\tcontainerHeight,\n\t\tmaxContainerWidth,\n\t\tscaleContainerWidth,\n\t] );\n\n\treturn {\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t\tcontentResizeListener,\n\t\tcontainerResizeListener,\n\t};\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/build/components/image-editor/aspect-ratio-dropdown.js

@@ -1,25 +1,34 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var aspect_ratio_dropdown_exports = {};
+__export(aspect_ratio_dropdown_exports, {
+  default: () => AspectRatioDropdown,
+  ratioToNumber: () => ratioToNumber
 });
-exports.default = AspectRatioDropdown;
-exports.ratioToNumber = ratioToNumber;
-var _icons = require("@wordpress/icons");
-var _components = require("@wordpress/components");
-var _i18n = require("@wordpress/i18n");
-var _useSettings = require("../use-settings");
-var _constants = require("./constants");
-var _context = require("./context");
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
+module.exports = __toCommonJS(aspect_ratio_dropdown_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_icons = require("@wordpress/icons");
+var import_components = require("@wordpress/components");
+var import_i18n = require("@wordpress/i18n");
+var import_use_settings = require("../use-settings");
+var import_constants = require("./constants");
+var import_context = require("./context");
 function AspectRatioGroup({
   aspectRatios,
   isDisabled,
@@ -27,109 +36,114 @@ function AspectRatioGroup({
   onClick,
   value
 }) {
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuGroup, {
-    label: label,
-    children: aspectRatios.map(({
-      name,
-      slug,
-      ratio
-    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.MenuItem, {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.MenuGroup, { label, children: aspectRatios.map(({ name, slug, ratio }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_components.MenuItem,
+    {
       disabled: isDisabled,
       onClick: () => {
         onClick(ratio);
       },
       role: "menuitemradio",
       isSelected: ratio === value,
-      icon: ratio === value ? _icons.check : undefined,
+      icon: ratio === value ? import_icons.check : void 0,
       children: name
-    }, slug))
-  });
+    },
+    slug
+  )) });
 }
 function ratioToNumber(str) {
-  // TODO: support two-value aspect ratio?
-  // https://css-tricks.com/almanac/properties/a/aspect-ratio/#aa-it-can-take-two-values
-  const [a, b, ...rest] = str.split('/').map(Number);
+  const [a, b, ...rest] = str.split("/").map(Number);
   if (a <= 0 || b <= 0 || Number.isNaN(a) || Number.isNaN(b) || rest.length) {
     return NaN;
   }
   return b ? a / b : a;
 }
-function presetRatioAsNumber({
-  ratio,
-  ...rest
-}) {
+function presetRatioAsNumber({ ratio, ...rest }) {
   return {
     ratio: ratioToNumber(ratio),
     ...rest
   };
 }
-function AspectRatioDropdown({
-  toggleProps
-}) {
-  const {
-    isInProgress,
-    aspect,
-    setAspect,
-    defaultAspect
-  } = (0, _context.useImageEditingContext)();
-  const [defaultRatios, themeRatios, showDefaultRatios] = (0, _useSettings.useSettings)('dimensions.aspectRatios.default', 'dimensions.aspectRatios.theme', 'dimensions.defaultAspectRatios');
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.DropdownMenu, {
-    icon: _icons.aspectRatio,
-    label: (0, _i18n.__)('Aspect Ratio'),
-    popoverProps: _constants.POPOVER_PROPS,
-    toggleProps: toggleProps,
-    children: ({
-      onClose
-    }) => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(AspectRatioGroup, {
-        isDisabled: isInProgress,
-        onClick: newAspect => {
-          setAspect(newAspect);
-          onClose();
-        },
-        value: aspect,
-        aspectRatios: [
-        // All ratios should be mirrored in AspectRatioTool in @wordpress/block-editor.
-        {
-          slug: 'original',
-          name: (0, _i18n.__)('Original'),
-          ratio: defaultAspect
-        }, ...(showDefaultRatios ? defaultRatios.map(presetRatioAsNumber).filter(({
-          ratio
-        }) => ratio === 1) : [])]
-      }), themeRatios?.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(AspectRatioGroup, {
-        label: (0, _i18n.__)('Theme'),
-        isDisabled: isInProgress,
-        onClick: newAspect => {
-          setAspect(newAspect);
-          onClose();
-        },
-        value: aspect,
-        aspectRatios: themeRatios
-      }), showDefaultRatios && /*#__PURE__*/(0, _jsxRuntime.jsx)(AspectRatioGroup, {
-        label: (0, _i18n.__)('Landscape'),
-        isDisabled: isInProgress,
-        onClick: newAspect => {
-          setAspect(newAspect);
-          onClose();
-        },
-        value: aspect,
-        aspectRatios: defaultRatios.map(presetRatioAsNumber).filter(({
-          ratio
-        }) => ratio > 1)
-      }), showDefaultRatios && /*#__PURE__*/(0, _jsxRuntime.jsx)(AspectRatioGroup, {
-        label: (0, _i18n.__)('Portrait'),
-        isDisabled: isInProgress,
-        onClick: newAspect => {
-          setAspect(newAspect);
-          onClose();
-        },
-        value: aspect,
-        aspectRatios: defaultRatios.map(presetRatioAsNumber).filter(({
-          ratio
-        }) => ratio < 1)
-      })]
-    })
-  });
+function AspectRatioDropdown({ toggleProps }) {
+  const { isInProgress, aspect, setAspect, defaultAspect } = (0, import_context.useImageEditingContext)();
+  const [defaultRatios, themeRatios, showDefaultRatios] = (0, import_use_settings.useSettings)(
+    "dimensions.aspectRatios.default",
+    "dimensions.aspectRatios.theme",
+    "dimensions.defaultAspectRatios"
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    import_components.DropdownMenu,
+    {
+      icon: import_icons.aspectRatio,
+      label: (0, import_i18n.__)("Aspect Ratio"),
+      popoverProps: import_constants.POPOVER_PROPS,
+      toggleProps,
+      children: ({ onClose }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          AspectRatioGroup,
+          {
+            isDisabled: isInProgress,
+            onClick: (newAspect) => {
+              setAspect(newAspect);
+              onClose();
+            },
+            value: aspect,
+            aspectRatios: [
+              // All ratios should be mirrored in AspectRatioTool in @wordpress/block-editor.
+              {
+                slug: "original",
+                name: (0, import_i18n.__)("Original"),
+                ratio: defaultAspect
+              },
+              ...showDefaultRatios ? defaultRatios.map(presetRatioAsNumber).filter(({ ratio }) => ratio === 1) : []
+            ]
+          }
+        ),
+        themeRatios?.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          AspectRatioGroup,
+          {
+            label: (0, import_i18n.__)("Theme"),
+            isDisabled: isInProgress,
+            onClick: (newAspect) => {
+              setAspect(newAspect);
+              onClose();
+            },
+            value: aspect,
+            aspectRatios: themeRatios
+          }
+        ),
+        showDefaultRatios && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          AspectRatioGroup,
+          {
+            label: (0, import_i18n.__)("Landscape"),
+            isDisabled: isInProgress,
+            onClick: (newAspect) => {
+              setAspect(newAspect);
+              onClose();
+            },
+            value: aspect,
+            aspectRatios: defaultRatios.map(presetRatioAsNumber).filter(({ ratio }) => ratio > 1)
+          }
+        ),
+        showDefaultRatios && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          AspectRatioGroup,
+          {
+            label: (0, import_i18n.__)("Portrait"),
+            isDisabled: isInProgress,
+            onClick: (newAspect) => {
+              setAspect(newAspect);
+              onClose();
+            },
+            value: aspect,
+            aspectRatios: defaultRatios.map(presetRatioAsNumber).filter(({ ratio }) => ratio < 1)
+          }
+        )
+      ] })
+    }
+  );
 }
-//# sourceMappingURL=aspect-ratio-dropdown.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ratioToNumber
+});
+//# sourceMappingURL=aspect-ratio-dropdown.js.map

package/build/components/image-editor/aspect-ratio-dropdown.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_icons","require","_components","_i18n","_useSettings","_constants","_context","_jsxRuntime","AspectRatioGroup","aspectRatios","isDisabled","label","onClick","value","jsx","MenuGroup","children","map","name","slug","ratio","MenuItem","disabled","role","isSelected","icon","check","undefined","ratioToNumber","str","a","b","rest","split","Number","isNaN","length","NaN","presetRatioAsNumber","AspectRatioDropdown","toggleProps","isInProgress","aspect","setAspect","defaultAspect","useImageEditingContext","defaultRatios","themeRatios","showDefaultRatios","useSettings","DropdownMenu","aspectRatioIcon","__","popoverProps","POPOVER_PROPS","onClose","jsxs","Fragment","newAspect","filter"],"sources":["@wordpress/block-editor/src/components/image-editor/aspect-ratio-dropdown.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { check, aspectRatio as aspectRatioIcon } from '@wordpress/icons';\nimport { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\nimport { POPOVER_PROPS } from './constants';\nimport { useImageEditingContext } from './context';\n\nfunction AspectRatioGroup( {\n\taspectRatios,\n\tisDisabled,\n\tlabel,\n\tonClick,\n\tvalue,\n} ) {\n\treturn (\n\t\t<MenuGroup label={ label }>\n\t\t\t{ aspectRatios.map( ( { name, slug, ratio } ) => (\n\t\t\t\t<MenuItem\n\t\t\t\t\tkey={ slug }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonClick( ratio );\n\t\t\t\t\t} }\n\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\tisSelected={ ratio === value }\n\t\t\t\t\ticon={ ratio === value ? check : undefined }\n\t\t\t\t>\n\t\t\t\t\t{ name }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</MenuGroup>\n\t);\n}\n\nexport function ratioToNumber( str ) {\n\t// TODO: support two-value aspect ratio?\n\t// https://css-tricks.com/almanac/properties/a/aspect-ratio/#aa-it-can-take-two-values\n\tconst [ a, b, ...rest ] = str.split( '/' ).map( Number );\n\tif (\n\t\ta <= 0 ||\n\t\tb <= 0 ||\n\t\tNumber.isNaN( a ) ||\n\t\tNumber.isNaN( b ) ||\n\t\trest.length\n\t) {\n\t\treturn NaN;\n\t}\n\treturn b ? a / b : a;\n}\n\nfunction presetRatioAsNumber( { ratio, ...rest } ) {\n\treturn {\n\t\tratio: ratioToNumber( ratio ),\n\t\t...rest,\n\t};\n}\n\nexport default function AspectRatioDropdown( { toggleProps } ) {\n\tconst { isInProgress, aspect, setAspect, defaultAspect } =\n\t\tuseImageEditingContext();\n\n\tconst [ defaultRatios, themeRatios, showDefaultRatios ] = useSettings(\n\t\t'dimensions.aspectRatios.default',\n\t\t'dimensions.aspectRatios.theme',\n\t\t'dimensions.defaultAspectRatios'\n\t);\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\ticon={ aspectRatioIcon }\n\t\t\tlabel={ __( 'Aspect Ratio' ) }\n\t\t\tpopoverProps={ POPOVER_PROPS }\n\t\t\ttoggleProps={ toggleProps }\n\t\t>\n\t\t\t{ ( { onClose } ) => (\n\t\t\t\t<>\n\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t// All ratios should be mirrored in AspectRatioTool in @wordpress/block-editor.\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tslug: 'original',\n\t\t\t\t\t\t\t\tname: __( 'Original' ),\n\t\t\t\t\t\t\t\tratio: defaultAspect,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t...( showDefaultRatios\n\t\t\t\t\t\t\t\t? defaultRatios\n\t\t\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio === 1 )\n\t\t\t\t\t\t\t\t: [] ),\n\t\t\t\t\t\t] }\n\t\t\t\t\t/>\n\t\t\t\t\t{ themeRatios?.length > 0 && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Theme' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ themeRatios }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showDefaultRatios && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Landscape' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ defaultRatios\n\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio > 1 ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showDefaultRatios && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Portrait' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ defaultRatios\n\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio < 1 ) }\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</DropdownMenu>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/image-editor/aspect-ratio-dropdown.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { check, aspectRatio as aspectRatioIcon } from '@wordpress/icons';\nimport { DropdownMenu, MenuGroup, MenuItem } from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { useSettings } from '../use-settings';\nimport { POPOVER_PROPS } from './constants';\nimport { useImageEditingContext } from './context';\n\nfunction AspectRatioGroup( {\n\taspectRatios,\n\tisDisabled,\n\tlabel,\n\tonClick,\n\tvalue,\n} ) {\n\treturn (\n\t\t<MenuGroup label={ label }>\n\t\t\t{ aspectRatios.map( ( { name, slug, ratio } ) => (\n\t\t\t\t<MenuItem\n\t\t\t\t\tkey={ slug }\n\t\t\t\t\tdisabled={ isDisabled }\n\t\t\t\t\tonClick={ () => {\n\t\t\t\t\t\tonClick( ratio );\n\t\t\t\t\t} }\n\t\t\t\t\trole=\"menuitemradio\"\n\t\t\t\t\tisSelected={ ratio === value }\n\t\t\t\t\ticon={ ratio === value ? check : undefined }\n\t\t\t\t>\n\t\t\t\t\t{ name }\n\t\t\t\t</MenuItem>\n\t\t\t) ) }\n\t\t</MenuGroup>\n\t);\n}\n\nexport function ratioToNumber( str ) {\n\t// TODO: support two-value aspect ratio?\n\t// https://css-tricks.com/almanac/properties/a/aspect-ratio/#aa-it-can-take-two-values\n\tconst [ a, b, ...rest ] = str.split( '/' ).map( Number );\n\tif (\n\t\ta <= 0 ||\n\t\tb <= 0 ||\n\t\tNumber.isNaN( a ) ||\n\t\tNumber.isNaN( b ) ||\n\t\trest.length\n\t) {\n\t\treturn NaN;\n\t}\n\treturn b ? a / b : a;\n}\n\nfunction presetRatioAsNumber( { ratio, ...rest } ) {\n\treturn {\n\t\tratio: ratioToNumber( ratio ),\n\t\t...rest,\n\t};\n}\n\nexport default function AspectRatioDropdown( { toggleProps } ) {\n\tconst { isInProgress, aspect, setAspect, defaultAspect } =\n\t\tuseImageEditingContext();\n\n\tconst [ defaultRatios, themeRatios, showDefaultRatios ] = useSettings(\n\t\t'dimensions.aspectRatios.default',\n\t\t'dimensions.aspectRatios.theme',\n\t\t'dimensions.defaultAspectRatios'\n\t);\n\n\treturn (\n\t\t<DropdownMenu\n\t\t\ticon={ aspectRatioIcon }\n\t\t\tlabel={ __( 'Aspect Ratio' ) }\n\t\t\tpopoverProps={ POPOVER_PROPS }\n\t\t\ttoggleProps={ toggleProps }\n\t\t>\n\t\t\t{ ( { onClose } ) => (\n\t\t\t\t<>\n\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t} }\n\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\taspectRatios={ [\n\t\t\t\t\t\t\t// All ratios should be mirrored in AspectRatioTool in @wordpress/block-editor.\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tslug: 'original',\n\t\t\t\t\t\t\t\tname: __( 'Original' ),\n\t\t\t\t\t\t\t\tratio: defaultAspect,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t...( showDefaultRatios\n\t\t\t\t\t\t\t\t? defaultRatios\n\t\t\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio === 1 )\n\t\t\t\t\t\t\t\t: [] ),\n\t\t\t\t\t\t] }\n\t\t\t\t\t/>\n\t\t\t\t\t{ themeRatios?.length > 0 && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Theme' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ themeRatios }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showDefaultRatios && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Landscape' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ defaultRatios\n\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio > 1 ) }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t\t{ showDefaultRatios && (\n\t\t\t\t\t\t<AspectRatioGroup\n\t\t\t\t\t\t\tlabel={ __( 'Portrait' ) }\n\t\t\t\t\t\t\tisDisabled={ isInProgress }\n\t\t\t\t\t\t\tonClick={ ( newAspect ) => {\n\t\t\t\t\t\t\t\tsetAspect( newAspect );\n\t\t\t\t\t\t\t\tonClose();\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tvalue={ aspect }\n\t\t\t\t\t\t\taspectRatios={ defaultRatios\n\t\t\t\t\t\t\t\t.map( presetRatioAsNumber )\n\t\t\t\t\t\t\t\t.filter( ( { ratio } ) => ratio < 1 ) }\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</DropdownMenu>\n\t);\n}\n"],
+  "mappings": "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",
+  "names": ["aspectRatioIcon"]
+}

package/build/components/image-editor/constants.js

@@ -1,12 +1,37 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var constants_exports = {};
+__export(constants_exports, {
+  MAX_ZOOM: () => MAX_ZOOM,
+  MIN_ZOOM: () => MIN_ZOOM,
+  POPOVER_PROPS: () => POPOVER_PROPS
 });
-exports.POPOVER_PROPS = exports.MIN_ZOOM = exports.MAX_ZOOM = void 0;
-const MIN_ZOOM = exports.MIN_ZOOM = 100;
-const MAX_ZOOM = exports.MAX_ZOOM = 300;
-const POPOVER_PROPS = exports.POPOVER_PROPS = {
-  placement: 'bottom-start'
+module.exports = __toCommonJS(constants_exports);
+const MIN_ZOOM = 100;
+const MAX_ZOOM = 300;
+const POPOVER_PROPS = {
+  placement: "bottom-start"
 };
-//# sourceMappingURL=constants.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MAX_ZOOM,
+  MIN_ZOOM,
+  POPOVER_PROPS
+});
+//# sourceMappingURL=constants.js.map

package/build/components/image-editor/constants.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["MIN_ZOOM","exports","MAX_ZOOM","POPOVER_PROPS","placement"],"sources":["@wordpress/block-editor/src/components/image-editor/constants.js"],"sourcesContent":["export const MIN_ZOOM = 100;\nexport const MAX_ZOOM = 300;\nexport const POPOVER_PROPS = {\n\tplacement: 'bottom-start',\n};\n"],"mappings":";;;;;;AAAO,MAAMA,QAAQ,GAAAC,OAAA,CAAAD,QAAA,GAAG,GAAG;AACpB,MAAME,QAAQ,GAAAD,OAAA,CAAAC,QAAA,GAAG,GAAG;AACpB,MAAMC,aAAa,GAAAF,OAAA,CAAAE,aAAA,GAAG;EAC5BC,SAAS,EAAE;AACZ,CAAC","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/image-editor/constants.js"],
+  "sourcesContent": ["export const MIN_ZOOM = 100;\nexport const MAX_ZOOM = 300;\nexport const POPOVER_PROPS = {\n\tplacement: 'bottom-start',\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAO,MAAM,WAAW;AACjB,MAAM,WAAW;AACjB,MAAM,gBAAgB;AAAA,EAC5B,WAAW;AACZ;",
+  "names": []
+}

package/build/components/image-editor/context.js

@@ -1,27 +1,44 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var context_exports = {};
+__export(context_exports, {
+  default: () => ImageEditingProvider,
+  useImageEditingContext: () => useImageEditingContext
 });
-exports.default = ImageEditingProvider;
-exports.useImageEditingContext = void 0;
-var _element = require("@wordpress/element");
-var _useSaveImage = _interopRequireDefault(require("./use-save-image"));
-var _useTransformImage = _interopRequireDefault(require("./use-transform-image"));
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
-const ImageEditingContext = (0, _element.createContext)({});
-ImageEditingContext.displayName = 'ImageEditingContext';
-const useImageEditingContext = () => (0, _element.useContext)(ImageEditingContext);
-exports.useImageEditingContext = useImageEditingContext;
+module.exports = __toCommonJS(context_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_element = require("@wordpress/element");
+var import_use_save_image = __toESM(require("./use-save-image"));
+var import_use_transform_image = __toESM(require("./use-transform-image"));
+const ImageEditingContext = (0, import_element.createContext)({});
+ImageEditingContext.displayName = "ImageEditingContext";
+const useImageEditingContext = () => (0, import_element.useContext)(ImageEditingContext);
 function ImageEditingProvider({
   id,
   url,
@@ -31,25 +48,29 @@ function ImageEditingProvider({
   onSaveImage,
   children
 }) {
-  const transformImage = (0, _useTransformImage.default)({
+  const transformImage = (0, import_use_transform_image.default)({
     url,
     naturalWidth,
     naturalHeight
   });
-  const saveImage = (0, _useSaveImage.default)({
+  const saveImage = (0, import_use_save_image.default)({
     id,
     url,
     onSaveImage,
     onFinishEditing,
     ...transformImage
   });
-  const providerValue = (0, _element.useMemo)(() => ({
-    ...transformImage,
-    ...saveImage
-  }), [transformImage, saveImage]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(ImageEditingContext.Provider, {
-    value: providerValue,
-    children: children
-  });
+  const providerValue = (0, import_element.useMemo)(
+    () => ({
+      ...transformImage,
+      ...saveImage
+    }),
+    [transformImage, saveImage]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ImageEditingContext.Provider, { value: providerValue, children });
 }
-//# sourceMappingURL=context.js.map
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useImageEditingContext
+});
+//# sourceMappingURL=context.js.map

package/build/components/image-editor/context.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["_element","require","_useSaveImage","_interopRequireDefault","_useTransformImage","_jsxRuntime","ImageEditingContext","createContext","displayName","useImageEditingContext","useContext","exports","ImageEditingProvider","id","url","naturalWidth","naturalHeight","onFinishEditing","onSaveImage","children","transformImage","useTransformImage","saveImage","useSaveImage","providerValue","useMemo","jsx","Provider","value"],"sources":["@wordpress/block-editor/src/components/image-editor/context.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createContext, useContext, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useSaveImage from './use-save-image';\nimport useTransformImage from './use-transform-image';\n\nconst ImageEditingContext = createContext( {} );\nImageEditingContext.displayName = 'ImageEditingContext';\n\nexport const useImageEditingContext = () => useContext( ImageEditingContext );\n\nexport default function ImageEditingProvider( {\n\tid,\n\turl,\n\tnaturalWidth,\n\tnaturalHeight,\n\tonFinishEditing,\n\tonSaveImage,\n\tchildren,\n} ) {\n\tconst transformImage = useTransformImage( {\n\t\turl,\n\t\tnaturalWidth,\n\t\tnaturalHeight,\n\t} );\n\n\tconst saveImage = useSaveImage( {\n\t\tid,\n\t\turl,\n\t\tonSaveImage,\n\t\tonFinishEditing,\n\t\t...transformImage,\n\t} );\n\n\tconst providerValue = useMemo(\n\t\t() => ( {\n\t\t\t...transformImage,\n\t\t\t...saveImage,\n\t\t} ),\n\t\t[ transformImage, saveImage ]\n\t);\n\n\treturn (\n\t\t<ImageEditingContext.Provider value={ providerValue }>\n\t\t\t{ children }\n\t\t</ImageEditingContext.Provider>\n\t);\n}\n"],"mappings":";;;;;;;;AAGA,IAAAA,QAAA,GAAAC,OAAA;AAKA,IAAAC,aAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,kBAAA,GAAAD,sBAAA,CAAAF,OAAA;AAAsD,IAAAI,WAAA,GAAAJ,OAAA;AATtD;AACA;AACA;;AAGA;AACA;AACA;;AAIA,MAAMK,mBAAmB,GAAG,IAAAC,sBAAa,EAAE,CAAC,CAAE,CAAC;AAC/CD,mBAAmB,CAACE,WAAW,GAAG,qBAAqB;AAEhD,MAAMC,sBAAsB,GAAGA,CAAA,KAAM,IAAAC,mBAAU,EAAEJ,mBAAoB,CAAC;AAACK,OAAA,CAAAF,sBAAA,GAAAA,sBAAA;AAE/D,SAASG,oBAAoBA,CAAE;EAC7CC,EAAE;EACFC,GAAG;EACHC,YAAY;EACZC,aAAa;EACbC,eAAe;EACfC,WAAW;EACXC;AACD,CAAC,EAAG;EACH,MAAMC,cAAc,GAAG,IAAAC,0BAAiB,EAAE;IACzCP,GAAG;IACHC,YAAY;IACZC;EACD,CAAE,CAAC;EAEH,MAAMM,SAAS,GAAG,IAAAC,qBAAY,EAAE;IAC/BV,EAAE;IACFC,GAAG;IACHI,WAAW;IACXD,eAAe;IACf,GAAGG;EACJ,CAAE,CAAC;EAEH,MAAMI,aAAa,GAAG,IAAAC,gBAAO,EAC5B,OAAQ;IACP,GAAGL,cAAc;IACjB,GAAGE;EACJ,CAAC,CAAE,EACH,CAAEF,cAAc,EAAEE,SAAS,CAC5B,CAAC;EAED,oBACC,IAAAjB,WAAA,CAAAqB,GAAA,EAACpB,mBAAmB,CAACqB,QAAQ;IAACC,KAAK,EAAGJ,aAAe;IAAAL,QAAA,EAClDA;EAAQ,CACmB,CAAC;AAEjC","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/image-editor/context.js"],
+  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createContext, useContext, useMemo } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useSaveImage from './use-save-image';\nimport useTransformImage from './use-transform-image';\n\nconst ImageEditingContext = createContext( {} );\nImageEditingContext.displayName = 'ImageEditingContext';\n\nexport const useImageEditingContext = () => useContext( ImageEditingContext );\n\nexport default function ImageEditingProvider( {\n\tid,\n\turl,\n\tnaturalWidth,\n\tnaturalHeight,\n\tonFinishEditing,\n\tonSaveImage,\n\tchildren,\n} ) {\n\tconst transformImage = useTransformImage( {\n\t\turl,\n\t\tnaturalWidth,\n\t\tnaturalHeight,\n\t} );\n\n\tconst saveImage = useSaveImage( {\n\t\tid,\n\t\turl,\n\t\tonSaveImage,\n\t\tonFinishEditing,\n\t\t...transformImage,\n\t} );\n\n\tconst providerValue = useMemo(\n\t\t() => ( {\n\t\t\t...transformImage,\n\t\t\t...saveImage,\n\t\t} ),\n\t\t[ transformImage, saveImage ]\n\t);\n\n\treturn (\n\t\t<ImageEditingContext.Provider value={ providerValue }>\n\t\t\t{ children }\n\t\t</ImageEditingContext.Provider>\n\t);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgDE;AA7CF,qBAAmD;AAKnD,4BAAyB;AACzB,iCAA8B;AAE9B,MAAM,0BAAsB,8BAAe,CAAC,CAAE;AAC9C,oBAAoB,cAAc;AAE3B,MAAM,yBAAyB,UAAM,2BAAY,mBAAoB;AAE7D,SAAR,qBAAuC;AAAA,EAC7C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACD,GAAI;AACH,QAAM,qBAAiB,2BAAAA,SAAmB;AAAA,IACzC;AAAA,IACA;AAAA,IACA;AAAA,EACD,CAAE;AAEF,QAAM,gBAAY,sBAAAC,SAAc;AAAA,IAC/B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACJ,CAAE;AAEF,QAAM,oBAAgB;AAAA,IACrB,OAAQ;AAAA,MACP,GAAG;AAAA,MACH,GAAG;AAAA,IACJ;AAAA,IACA,CAAE,gBAAgB,SAAU;AAAA,EAC7B;AAEA,SACC,4CAAC,oBAAoB,UAApB,EAA6B,OAAQ,eACnC,UACH;AAEF;",
+  "names": ["useTransformImage", "useSaveImage"]
+}