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

package/build-module/components/block-tools/insertion-point.js

@@ -1,37 +1,28 @@
-/**
- * External dependencies
- */
-import clsx from 'clsx';
-
-/**
- * WordPress dependencies
- */
-import { useSelect, useDispatch } from '@wordpress/data';
-import { useRef, createContext, useContext, useCallback } from '@wordpress/element';
-import { __unstableMotion as motion } from '@wordpress/components';
-import { useReducedMotion } from '@wordpress/compose';
-
-/**
- * Internal dependencies
- */
-import Inserter from '../inserter';
-import { store as blockEditorStore } from '../../store';
-import BlockPopoverInbetween from '../block-popover/inbetween';
-import BlockDropZonePopover from '../block-popover/drop-zone';
-import { unlock } from '../../lock-unlock';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const InsertionPointOpenRef = createContext();
-InsertionPointOpenRef.displayName = 'InsertionPointOpenRefContext';
+import { jsx, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { useSelect, useDispatch } from "@wordpress/data";
+import {
+  useRef,
+  createContext,
+  useContext,
+  useCallback
+} from "@wordpress/element";
+import { __unstableMotion as motion } from "@wordpress/components";
+import { useReducedMotion } from "@wordpress/compose";
+import Inserter from "../inserter";
+import { store as blockEditorStore } from "../../store";
+import BlockPopoverInbetween from "../block-popover/inbetween";
+import BlockDropZonePopover from "../block-popover/drop-zone";
+import { unlock } from "../../lock-unlock";
+const InsertionPointOpenRef = createContext();
+InsertionPointOpenRef.displayName = "InsertionPointOpenRefContext";
 function InbetweenInsertionPointPopover({
   __unstablePopoverSlot,
   __unstableContentRef,
-  operation = 'insert',
-  nearestSide = 'right'
+  operation = "insert",
+  nearestSide = "right"
 }) {
-  const {
-    selectBlock,
-    hideInsertionPoint
-  } = useDispatch(blockEditorStore);
+  const { selectBlock, hideInsertionPoint } = useDispatch(blockEditorStore);
   const openRef = useContext(InsertionPointOpenRef);
   const ref = useRef();
   const {
@@ -42,7 +33,7 @@ function InbetweenInsertionPointPopover({
     isInserterShown,
     isDistractionFree,
     isZoomOutMode
-  } = useSelect(select => {
+  } = useSelect((select) => {
     const {
       getBlockOrder,
       getBlockListSettings,
@@ -70,45 +61,38 @@ function InbetweenInsertionPointPopover({
     return {
       previousClientId: _previousClientId,
       nextClientId: _nextClientId,
-      orientation: getBlockListSettings(insertionPoint.rootClientId)?.orientation || 'vertical',
+      orientation: getBlockListSettings(insertionPoint.rootClientId)?.orientation || "vertical",
       rootClientId: insertionPoint.rootClientId,
       isDistractionFree: settings.isDistractionFree,
       isInserterShown: insertionPoint?.__unstableWithInserter,
       isZoomOutMode: isZoomOut()
     };
   }, []);
-  const {
-    getBlockEditingMode
-  } = useSelect(blockEditorStore);
+  const { getBlockEditingMode } = useSelect(blockEditorStore);
   const disableMotion = useReducedMotion();
   function onClick(event) {
-    if (event.target === ref.current && nextClientId && getBlockEditingMode(nextClientId) !== 'disabled') {
+    if (event.target === ref.current && nextClientId && getBlockEditingMode(nextClientId) !== "disabled") {
       selectBlock(nextClientId, -1);
     }
   }
   function maybeHideInserterPoint(event) {
-    // Only hide the inserter if it's triggered on the wrapper,
-    // and the inserter is not open.
     if (event.target === ref.current && !openRef.current) {
       hideInsertionPoint();
     }
   }
   function onFocus(event) {
-    // Only handle click on the wrapper specifically, and not an event
-    // bubbled from the inserter itself.
     if (event.target !== ref.current) {
       openRef.current = true;
     }
   }
-
-  // Reset the insertion point reference when the Inserter unmounts,
-  // avoids stale references when `onSelectOrClose` is not called.
-  // See: https://github.com/WordPress/gutenberg/issues/65598#issuecomment-3249229264.
-  const maybeResetOpenRef = useCallback(node => {
-    if (!node && openRef.current) {
-      openRef.current = false;
-    }
-  }, [openRef]);
+  const maybeResetOpenRef = useCallback(
+    (node) => {
+      if (!node && openRef.current) {
+        openRef.current = false;
+      }
+    },
+    [openRef]
+  );
   const lineVariants = {
     // Initial position starts from the center and invisible.
     start: {
@@ -120,18 +104,12 @@ function InbetweenInsertionPointPopover({
     rest: {
       opacity: 1,
       scale: 1,
-      transition: {
-        delay: isInserterShown ? 0.5 : 0,
-        type: 'tween'
-      }
+      transition: { delay: isInserterShown ? 0.5 : 0, type: "tween" }
     },
     hover: {
       opacity: 1,
       scale: 1,
-      transition: {
-        delay: 0.5,
-        type: 'tween'
-      }
+      transition: { delay: 0.5, type: "tween" }
     }
   };
   const inserterVariants = {
@@ -140,108 +118,125 @@ function InbetweenInsertionPointPopover({
     },
     rest: {
       scale: 1,
-      transition: {
-        delay: 0.4,
-        type: 'tween'
-      }
+      transition: { delay: 0.4, type: "tween" }
     }
   };
   if (isDistractionFree) {
     return null;
   }
-
-  // Zoom out mode should only show the insertion point for the insert operation.
-  // Other operations such as "group" are when the editor tries to create a row
-  // block by grouping the block being dragged with the block it's being dropped
-  // onto.
-  if (isZoomOutMode && operation !== 'insert') {
+  if (isZoomOutMode && operation !== "insert") {
     return null;
   }
-  const orientationClassname = orientation === 'horizontal' || operation === 'group' ? 'is-horizontal' : 'is-vertical';
-  const className = clsx('block-editor-block-list__insertion-point', orientationClassname);
-  return /*#__PURE__*/_jsx(BlockPopoverInbetween, {
-    previousClientId: previousClientId,
-    nextClientId: nextClientId,
-    __unstablePopoverSlot: __unstablePopoverSlot,
-    __unstableContentRef: __unstableContentRef,
-    operation: operation,
-    nearestSide: nearestSide,
-    children: /*#__PURE__*/_jsxs(motion.div, {
-      layout: !disableMotion,
-      initial: disableMotion ? 'rest' : 'start',
-      animate: "rest",
-      whileHover: "hover",
-      whileTap: "pressed",
-      exit: "start",
-      ref: ref,
-      tabIndex: -1,
-      onClick: onClick,
-      onFocus: onFocus,
-      className: clsx(className, {
-        'is-with-inserter': isInserterShown
-      }),
-      onHoverEnd: maybeHideInserterPoint,
-      children: [/*#__PURE__*/_jsx(motion.div, {
-        variants: lineVariants,
-        className: "block-editor-block-list__insertion-point-indicator",
-        "data-testid": "block-list-insertion-point-indicator"
-      }), isInserterShown && /*#__PURE__*/_jsx(motion.div, {
-        variants: inserterVariants,
-        className: clsx('block-editor-block-list__insertion-point-inserter'),
-        children: /*#__PURE__*/_jsx(Inserter, {
-          ref: maybeResetOpenRef,
-          position: "bottom center",
-          clientId: nextClientId,
-          rootClientId: rootClientId,
-          __experimentalIsQuick: true,
-          onToggle: isOpen => {
-            openRef.current = isOpen;
-          },
-          onSelectOrClose: () => {
-            openRef.current = false;
-          }
-        })
-      })]
-    })
-  });
+  const orientationClassname = orientation === "horizontal" || operation === "group" ? "is-horizontal" : "is-vertical";
+  const className = clsx(
+    "block-editor-block-list__insertion-point",
+    orientationClassname
+  );
+  return /* @__PURE__ */ jsx(
+    BlockPopoverInbetween,
+    {
+      previousClientId,
+      nextClientId,
+      __unstablePopoverSlot,
+      __unstableContentRef,
+      operation,
+      nearestSide,
+      children: /* @__PURE__ */ jsxs(
+        motion.div,
+        {
+          layout: !disableMotion,
+          initial: disableMotion ? "rest" : "start",
+          animate: "rest",
+          whileHover: "hover",
+          whileTap: "pressed",
+          exit: "start",
+          ref,
+          tabIndex: -1,
+          onClick,
+          onFocus,
+          className: clsx(className, {
+            "is-with-inserter": isInserterShown
+          }),
+          onHoverEnd: maybeHideInserterPoint,
+          children: [
+            /* @__PURE__ */ jsx(
+              motion.div,
+              {
+                variants: lineVariants,
+                className: "block-editor-block-list__insertion-point-indicator",
+                "data-testid": "block-list-insertion-point-indicator"
+              }
+            ),
+            isInserterShown && /* @__PURE__ */ jsx(
+              motion.div,
+              {
+                variants: inserterVariants,
+                className: clsx(
+                  "block-editor-block-list__insertion-point-inserter"
+                ),
+                children: /* @__PURE__ */ jsx(
+                  Inserter,
+                  {
+                    ref: maybeResetOpenRef,
+                    position: "bottom center",
+                    clientId: nextClientId,
+                    rootClientId,
+                    __experimentalIsQuick: true,
+                    onToggle: (isOpen) => {
+                      openRef.current = isOpen;
+                    },
+                    onSelectOrClose: () => {
+                      openRef.current = false;
+                    }
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
 }
-export default function InsertionPoint(props) {
-  const {
-    insertionPoint,
-    isVisible,
-    isBlockListEmpty
-  } = useSelect(select => {
-    const {
-      getBlockInsertionPoint,
-      isBlockInsertionPointVisible,
-      getBlockCount
-    } = select(blockEditorStore);
-    const blockInsertionPoint = getBlockInsertionPoint();
-    return {
-      insertionPoint: blockInsertionPoint,
-      isVisible: isBlockInsertionPointVisible(),
-      isBlockListEmpty: getBlockCount(blockInsertionPoint?.rootClientId) === 0
-    };
-  }, []);
-  if (!isVisible ||
-  // Don't render the insertion point if the block list is empty.
+function InsertionPoint(props) {
+  const { insertionPoint, isVisible, isBlockListEmpty } = useSelect(
+    (select) => {
+      const {
+        getBlockInsertionPoint,
+        isBlockInsertionPointVisible,
+        getBlockCount
+      } = select(blockEditorStore);
+      const blockInsertionPoint = getBlockInsertionPoint();
+      return {
+        insertionPoint: blockInsertionPoint,
+        isVisible: isBlockInsertionPointVisible(),
+        isBlockListEmpty: getBlockCount(blockInsertionPoint?.rootClientId) === 0
+      };
+    },
+    []
+  );
+  if (!isVisible || // Don't render the insertion point if the block list is empty.
   // The insertion point will be represented by the appender instead.
   isBlockListEmpty) {
     return null;
   }
-
-  /**
-   * Render a popover that overlays the block when the desired operation is to replace it.
-   * Otherwise, render a popover in between blocks for the indication of inserting between them.
-   */
-  return insertionPoint.operation === 'replace' ? /*#__PURE__*/_jsx(BlockDropZonePopover
-  // Force remount to trigger the animation.
-  , {
-    ...props
-  }, `${insertionPoint.rootClientId}-${insertionPoint.index}`) : /*#__PURE__*/_jsx(InbetweenInsertionPointPopover, {
-    operation: insertionPoint.operation,
-    nearestSide: insertionPoint.nearestSide,
-    ...props
-  });
+  return insertionPoint.operation === "replace" ? /* @__PURE__ */ jsx(
+    BlockDropZonePopover,
+    {
+      ...props
+    },
+    `${insertionPoint.rootClientId}-${insertionPoint.index}`
+  ) : /* @__PURE__ */ jsx(
+    InbetweenInsertionPointPopover,
+    {
+      operation: insertionPoint.operation,
+      nearestSide: insertionPoint.nearestSide,
+      ...props
+    }
+  );
 }
-//# sourceMappingURL=insertion-point.js.map
+export {
+  InsertionPointOpenRef,
+  InsertionPoint as default
+};
+//# sourceMappingURL=insertion-point.js.map

package/build-module/components/block-tools/insertion-point.js.map

@@ -1 +1,7 @@
-{"version":3,"names":["clsx","useSelect","useDispatch","useRef","createContext","useContext","useCallback","__unstableMotion","motion","useReducedMotion","Inserter","store","blockEditorStore","BlockPopoverInbetween","BlockDropZonePopover","unlock","jsx","_jsx","jsxs","_jsxs","InsertionPointOpenRef","displayName","InbetweenInsertionPointPopover","__unstablePopoverSlot","__unstableContentRef","operation","nearestSide","selectBlock","hideInsertionPoint","openRef","ref","orientation","previousClientId","nextClientId","rootClientId","isInserterShown","isDistractionFree","isZoomOutMode","select","getBlockOrder","getBlockListSettings","getBlockInsertionPoint","isBlockBeingDragged","getPreviousBlockClientId","getNextBlockClientId","getSettings","isZoomOut","insertionPoint","order","length","_previousClientId","index","_nextClientId","settings","__unstableWithInserter","getBlockEditingMode","disableMotion","onClick","event","target","current","maybeHideInserterPoint","onFocus","maybeResetOpenRef","node","lineVariants","start","opacity","scale","rest","transition","delay","type","hover","inserterVariants","orientationClassname","className","children","div","layout","initial","animate","whileHover","whileTap","exit","tabIndex","onHoverEnd","variants","position","clientId","__experimentalIsQuick","onToggle","isOpen","onSelectOrClose","InsertionPoint","props","isVisible","isBlockListEmpty","isBlockInsertionPointVisible","getBlockCount","blockInsertionPoint"],"sources":["@wordpress/block-editor/src/components/block-tools/insertion-point.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tuseRef,\n\tcreateContext,\n\tuseContext,\n\tuseCallback,\n} from '@wordpress/element';\nimport { __unstableMotion as motion } from '@wordpress/components';\nimport { useReducedMotion } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Inserter from '../inserter';\nimport { store as blockEditorStore } from '../../store';\nimport BlockPopoverInbetween from '../block-popover/inbetween';\nimport BlockDropZonePopover from '../block-popover/drop-zone';\nimport { unlock } from '../../lock-unlock';\n\nexport const InsertionPointOpenRef = createContext();\nInsertionPointOpenRef.displayName = 'InsertionPointOpenRefContext';\n\nfunction InbetweenInsertionPointPopover( {\n\t__unstablePopoverSlot,\n\t__unstableContentRef,\n\toperation = 'insert',\n\tnearestSide = 'right',\n} ) {\n\tconst { selectBlock, hideInsertionPoint } = useDispatch( blockEditorStore );\n\tconst openRef = useContext( InsertionPointOpenRef );\n\tconst ref = useRef();\n\tconst {\n\t\torientation,\n\t\tpreviousClientId,\n\t\tnextClientId,\n\t\trootClientId,\n\t\tisInserterShown,\n\t\tisDistractionFree,\n\t\tisZoomOutMode,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetBlockOrder,\n\t\t\tgetBlockListSettings,\n\t\t\tgetBlockInsertionPoint,\n\t\t\tisBlockBeingDragged,\n\t\t\tgetPreviousBlockClientId,\n\t\t\tgetNextBlockClientId,\n\t\t\tgetSettings,\n\t\t\tisZoomOut,\n\t\t} = unlock( select( blockEditorStore ) );\n\t\tconst insertionPoint = getBlockInsertionPoint();\n\t\tconst order = getBlockOrder( insertionPoint.rootClientId );\n\n\t\tif ( ! order.length ) {\n\t\t\treturn {};\n\t\t}\n\n\t\tlet _previousClientId = order[ insertionPoint.index - 1 ];\n\t\tlet _nextClientId = order[ insertionPoint.index ];\n\n\t\twhile ( isBlockBeingDragged( _previousClientId ) ) {\n\t\t\t_previousClientId = getPreviousBlockClientId( _previousClientId );\n\t\t}\n\n\t\twhile ( isBlockBeingDragged( _nextClientId ) ) {\n\t\t\t_nextClientId = getNextBlockClientId( _nextClientId );\n\t\t}\n\n\t\tconst settings = getSettings();\n\n\t\treturn {\n\t\t\tpreviousClientId: _previousClientId,\n\t\t\tnextClientId: _nextClientId,\n\t\t\torientation:\n\t\t\t\tgetBlockListSettings( insertionPoint.rootClientId )\n\t\t\t\t\t?.orientation || 'vertical',\n\t\t\trootClientId: insertionPoint.rootClientId,\n\t\t\tisDistractionFree: settings.isDistractionFree,\n\t\t\tisInserterShown: insertionPoint?.__unstableWithInserter,\n\t\t\tisZoomOutMode: isZoomOut(),\n\t\t};\n\t}, [] );\n\tconst { getBlockEditingMode } = useSelect( blockEditorStore );\n\n\tconst disableMotion = useReducedMotion();\n\n\tfunction onClick( event ) {\n\t\tif (\n\t\t\tevent.target === ref.current &&\n\t\t\tnextClientId &&\n\t\t\tgetBlockEditingMode( nextClientId ) !== 'disabled'\n\t\t) {\n\t\t\tselectBlock( nextClientId, -1 );\n\t\t}\n\t}\n\n\tfunction maybeHideInserterPoint( event ) {\n\t\t// Only hide the inserter if it's triggered on the wrapper,\n\t\t// and the inserter is not open.\n\t\tif ( event.target === ref.current && ! openRef.current ) {\n\t\t\thideInsertionPoint();\n\t\t}\n\t}\n\n\tfunction onFocus( event ) {\n\t\t// Only handle click on the wrapper specifically, and not an event\n\t\t// bubbled from the inserter itself.\n\t\tif ( event.target !== ref.current ) {\n\t\t\topenRef.current = true;\n\t\t}\n\t}\n\n\t// Reset the insertion point reference when the Inserter unmounts,\n\t// avoids stale references when `onSelectOrClose` is not called.\n\t// See: https://github.com/WordPress/gutenberg/issues/65598#issuecomment-3249229264.\n\tconst maybeResetOpenRef = useCallback(\n\t\t( node ) => {\n\t\t\tif ( ! node && openRef.current ) {\n\t\t\t\topenRef.current = false;\n\t\t\t}\n\t\t},\n\t\t[ openRef ]\n\t);\n\n\tconst lineVariants = {\n\t\t// Initial position starts from the center and invisible.\n\t\tstart: {\n\t\t\topacity: 0,\n\t\t\tscale: 0,\n\t\t},\n\t\t// The line expands to fill the container. If the inserter is visible it\n\t\t// is delayed so it appears orchestrated.\n\t\trest: {\n\t\t\topacity: 1,\n\t\t\tscale: 1,\n\t\t\ttransition: { delay: isInserterShown ? 0.5 : 0, type: 'tween' },\n\t\t},\n\t\thover: {\n\t\t\topacity: 1,\n\t\t\tscale: 1,\n\t\t\ttransition: { delay: 0.5, type: 'tween' },\n\t\t},\n\t};\n\n\tconst inserterVariants = {\n\t\tstart: {\n\t\t\tscale: disableMotion ? 1 : 0,\n\t\t},\n\t\trest: {\n\t\t\tscale: 1,\n\t\t\ttransition: { delay: 0.4, type: 'tween' },\n\t\t},\n\t};\n\n\tif ( isDistractionFree ) {\n\t\treturn null;\n\t}\n\n\t// Zoom out mode should only show the insertion point for the insert operation.\n\t// Other operations such as \"group\" are when the editor tries to create a row\n\t// block by grouping the block being dragged with the block it's being dropped\n\t// onto.\n\tif ( isZoomOutMode && operation !== 'insert' ) {\n\t\treturn null;\n\t}\n\n\tconst orientationClassname =\n\t\torientation === 'horizontal' || operation === 'group'\n\t\t\t? 'is-horizontal'\n\t\t\t: 'is-vertical';\n\n\tconst className = clsx(\n\t\t'block-editor-block-list__insertion-point',\n\t\torientationClassname\n\t);\n\n\treturn (\n\t\t<BlockPopoverInbetween\n\t\t\tpreviousClientId={ previousClientId }\n\t\t\tnextClientId={ nextClientId }\n\t\t\t__unstablePopoverSlot={ __unstablePopoverSlot }\n\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\toperation={ operation }\n\t\t\tnearestSide={ nearestSide }\n\t\t>\n\t\t\t<motion.div\n\t\t\t\tlayout={ ! disableMotion }\n\t\t\t\tinitial={ disableMotion ? 'rest' : 'start' }\n\t\t\t\tanimate=\"rest\"\n\t\t\t\twhileHover=\"hover\"\n\t\t\t\twhileTap=\"pressed\"\n\t\t\t\texit=\"start\"\n\t\t\t\tref={ ref }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tonFocus={ onFocus }\n\t\t\t\tclassName={ clsx( className, {\n\t\t\t\t\t'is-with-inserter': isInserterShown,\n\t\t\t\t} ) }\n\t\t\t\tonHoverEnd={ maybeHideInserterPoint }\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ lineVariants }\n\t\t\t\t\tclassName=\"block-editor-block-list__insertion-point-indicator\"\n\t\t\t\t\tdata-testid=\"block-list-insertion-point-indicator\"\n\t\t\t\t/>\n\t\t\t\t{ isInserterShown && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tvariants={ inserterVariants }\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'block-editor-block-list__insertion-point-inserter'\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Inserter\n\t\t\t\t\t\t\tref={ maybeResetOpenRef }\n\t\t\t\t\t\t\tposition=\"bottom center\"\n\t\t\t\t\t\t\tclientId={ nextClientId }\n\t\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\t\t__experimentalIsQuick\n\t\t\t\t\t\t\tonToggle={ ( isOpen ) => {\n\t\t\t\t\t\t\t\topenRef.current = isOpen;\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonSelectOrClose={ () => {\n\t\t\t\t\t\t\t\topenRef.current = false;\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</motion.div>\n\t\t</BlockPopoverInbetween>\n\t);\n}\n\nexport default function InsertionPoint( props ) {\n\tconst { insertionPoint, isVisible, isBlockListEmpty } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockInsertionPoint,\n\t\t\t\tisBlockInsertionPointVisible,\n\t\t\t\tgetBlockCount,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst blockInsertionPoint = getBlockInsertionPoint();\n\t\t\treturn {\n\t\t\t\tinsertionPoint: blockInsertionPoint,\n\t\t\t\tisVisible: isBlockInsertionPointVisible(),\n\t\t\t\tisBlockListEmpty:\n\t\t\t\t\tgetBlockCount( blockInsertionPoint?.rootClientId ) === 0,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tif (\n\t\t! isVisible ||\n\t\t// Don't render the insertion point if the block list is empty.\n\t\t// The insertion point will be represented by the appender instead.\n\t\tisBlockListEmpty\n\t) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Render a popover that overlays the block when the desired operation is to replace it.\n\t * Otherwise, render a popover in between blocks for the indication of inserting between them.\n\t */\n\treturn insertionPoint.operation === 'replace' ? (\n\t\t<BlockDropZonePopover\n\t\t\t// Force remount to trigger the animation.\n\t\t\tkey={ `${ insertionPoint.rootClientId }-${ insertionPoint.index }` }\n\t\t\t{ ...props }\n\t\t/>\n\t) : (\n\t\t<InbetweenInsertionPointPopover\n\t\t\toperation={ insertionPoint.operation }\n\t\t\tnearestSide={ insertionPoint.nearestSide }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"],"mappings":"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","ignoreList":[]}
+{
+  "version": 3,
+  "sources": ["../../../src/components/block-tools/insertion-point.js"],
+  "sourcesContent": ["/**\n * External dependencies\n */\nimport clsx from 'clsx';\n\n/**\n * WordPress dependencies\n */\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport {\n\tuseRef,\n\tcreateContext,\n\tuseContext,\n\tuseCallback,\n} from '@wordpress/element';\nimport { __unstableMotion as motion } from '@wordpress/components';\nimport { useReducedMotion } from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport Inserter from '../inserter';\nimport { store as blockEditorStore } from '../../store';\nimport BlockPopoverInbetween from '../block-popover/inbetween';\nimport BlockDropZonePopover from '../block-popover/drop-zone';\nimport { unlock } from '../../lock-unlock';\n\nexport const InsertionPointOpenRef = createContext();\nInsertionPointOpenRef.displayName = 'InsertionPointOpenRefContext';\n\nfunction InbetweenInsertionPointPopover( {\n\t__unstablePopoverSlot,\n\t__unstableContentRef,\n\toperation = 'insert',\n\tnearestSide = 'right',\n} ) {\n\tconst { selectBlock, hideInsertionPoint } = useDispatch( blockEditorStore );\n\tconst openRef = useContext( InsertionPointOpenRef );\n\tconst ref = useRef();\n\tconst {\n\t\torientation,\n\t\tpreviousClientId,\n\t\tnextClientId,\n\t\trootClientId,\n\t\tisInserterShown,\n\t\tisDistractionFree,\n\t\tisZoomOutMode,\n\t} = useSelect( ( select ) => {\n\t\tconst {\n\t\t\tgetBlockOrder,\n\t\t\tgetBlockListSettings,\n\t\t\tgetBlockInsertionPoint,\n\t\t\tisBlockBeingDragged,\n\t\t\tgetPreviousBlockClientId,\n\t\t\tgetNextBlockClientId,\n\t\t\tgetSettings,\n\t\t\tisZoomOut,\n\t\t} = unlock( select( blockEditorStore ) );\n\t\tconst insertionPoint = getBlockInsertionPoint();\n\t\tconst order = getBlockOrder( insertionPoint.rootClientId );\n\n\t\tif ( ! order.length ) {\n\t\t\treturn {};\n\t\t}\n\n\t\tlet _previousClientId = order[ insertionPoint.index - 1 ];\n\t\tlet _nextClientId = order[ insertionPoint.index ];\n\n\t\twhile ( isBlockBeingDragged( _previousClientId ) ) {\n\t\t\t_previousClientId = getPreviousBlockClientId( _previousClientId );\n\t\t}\n\n\t\twhile ( isBlockBeingDragged( _nextClientId ) ) {\n\t\t\t_nextClientId = getNextBlockClientId( _nextClientId );\n\t\t}\n\n\t\tconst settings = getSettings();\n\n\t\treturn {\n\t\t\tpreviousClientId: _previousClientId,\n\t\t\tnextClientId: _nextClientId,\n\t\t\torientation:\n\t\t\t\tgetBlockListSettings( insertionPoint.rootClientId )\n\t\t\t\t\t?.orientation || 'vertical',\n\t\t\trootClientId: insertionPoint.rootClientId,\n\t\t\tisDistractionFree: settings.isDistractionFree,\n\t\t\tisInserterShown: insertionPoint?.__unstableWithInserter,\n\t\t\tisZoomOutMode: isZoomOut(),\n\t\t};\n\t}, [] );\n\tconst { getBlockEditingMode } = useSelect( blockEditorStore );\n\n\tconst disableMotion = useReducedMotion();\n\n\tfunction onClick( event ) {\n\t\tif (\n\t\t\tevent.target === ref.current &&\n\t\t\tnextClientId &&\n\t\t\tgetBlockEditingMode( nextClientId ) !== 'disabled'\n\t\t) {\n\t\t\tselectBlock( nextClientId, -1 );\n\t\t}\n\t}\n\n\tfunction maybeHideInserterPoint( event ) {\n\t\t// Only hide the inserter if it's triggered on the wrapper,\n\t\t// and the inserter is not open.\n\t\tif ( event.target === ref.current && ! openRef.current ) {\n\t\t\thideInsertionPoint();\n\t\t}\n\t}\n\n\tfunction onFocus( event ) {\n\t\t// Only handle click on the wrapper specifically, and not an event\n\t\t// bubbled from the inserter itself.\n\t\tif ( event.target !== ref.current ) {\n\t\t\topenRef.current = true;\n\t\t}\n\t}\n\n\t// Reset the insertion point reference when the Inserter unmounts,\n\t// avoids stale references when `onSelectOrClose` is not called.\n\t// See: https://github.com/WordPress/gutenberg/issues/65598#issuecomment-3249229264.\n\tconst maybeResetOpenRef = useCallback(\n\t\t( node ) => {\n\t\t\tif ( ! node && openRef.current ) {\n\t\t\t\topenRef.current = false;\n\t\t\t}\n\t\t},\n\t\t[ openRef ]\n\t);\n\n\tconst lineVariants = {\n\t\t// Initial position starts from the center and invisible.\n\t\tstart: {\n\t\t\topacity: 0,\n\t\t\tscale: 0,\n\t\t},\n\t\t// The line expands to fill the container. If the inserter is visible it\n\t\t// is delayed so it appears orchestrated.\n\t\trest: {\n\t\t\topacity: 1,\n\t\t\tscale: 1,\n\t\t\ttransition: { delay: isInserterShown ? 0.5 : 0, type: 'tween' },\n\t\t},\n\t\thover: {\n\t\t\topacity: 1,\n\t\t\tscale: 1,\n\t\t\ttransition: { delay: 0.5, type: 'tween' },\n\t\t},\n\t};\n\n\tconst inserterVariants = {\n\t\tstart: {\n\t\t\tscale: disableMotion ? 1 : 0,\n\t\t},\n\t\trest: {\n\t\t\tscale: 1,\n\t\t\ttransition: { delay: 0.4, type: 'tween' },\n\t\t},\n\t};\n\n\tif ( isDistractionFree ) {\n\t\treturn null;\n\t}\n\n\t// Zoom out mode should only show the insertion point for the insert operation.\n\t// Other operations such as \"group\" are when the editor tries to create a row\n\t// block by grouping the block being dragged with the block it's being dropped\n\t// onto.\n\tif ( isZoomOutMode && operation !== 'insert' ) {\n\t\treturn null;\n\t}\n\n\tconst orientationClassname =\n\t\torientation === 'horizontal' || operation === 'group'\n\t\t\t? 'is-horizontal'\n\t\t\t: 'is-vertical';\n\n\tconst className = clsx(\n\t\t'block-editor-block-list__insertion-point',\n\t\torientationClassname\n\t);\n\n\treturn (\n\t\t<BlockPopoverInbetween\n\t\t\tpreviousClientId={ previousClientId }\n\t\t\tnextClientId={ nextClientId }\n\t\t\t__unstablePopoverSlot={ __unstablePopoverSlot }\n\t\t\t__unstableContentRef={ __unstableContentRef }\n\t\t\toperation={ operation }\n\t\t\tnearestSide={ nearestSide }\n\t\t>\n\t\t\t<motion.div\n\t\t\t\tlayout={ ! disableMotion }\n\t\t\t\tinitial={ disableMotion ? 'rest' : 'start' }\n\t\t\t\tanimate=\"rest\"\n\t\t\t\twhileHover=\"hover\"\n\t\t\t\twhileTap=\"pressed\"\n\t\t\t\texit=\"start\"\n\t\t\t\tref={ ref }\n\t\t\t\ttabIndex={ -1 }\n\t\t\t\tonClick={ onClick }\n\t\t\t\tonFocus={ onFocus }\n\t\t\t\tclassName={ clsx( className, {\n\t\t\t\t\t'is-with-inserter': isInserterShown,\n\t\t\t\t} ) }\n\t\t\t\tonHoverEnd={ maybeHideInserterPoint }\n\t\t\t>\n\t\t\t\t<motion.div\n\t\t\t\t\tvariants={ lineVariants }\n\t\t\t\t\tclassName=\"block-editor-block-list__insertion-point-indicator\"\n\t\t\t\t\tdata-testid=\"block-list-insertion-point-indicator\"\n\t\t\t\t/>\n\t\t\t\t{ isInserterShown && (\n\t\t\t\t\t<motion.div\n\t\t\t\t\t\tvariants={ inserterVariants }\n\t\t\t\t\t\tclassName={ clsx(\n\t\t\t\t\t\t\t'block-editor-block-list__insertion-point-inserter'\n\t\t\t\t\t\t) }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Inserter\n\t\t\t\t\t\t\tref={ maybeResetOpenRef }\n\t\t\t\t\t\t\tposition=\"bottom center\"\n\t\t\t\t\t\t\tclientId={ nextClientId }\n\t\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\t\t__experimentalIsQuick\n\t\t\t\t\t\t\tonToggle={ ( isOpen ) => {\n\t\t\t\t\t\t\t\topenRef.current = isOpen;\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\tonSelectOrClose={ () => {\n\t\t\t\t\t\t\t\topenRef.current = false;\n\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t/>\n\t\t\t\t\t</motion.div>\n\t\t\t\t) }\n\t\t\t</motion.div>\n\t\t</BlockPopoverInbetween>\n\t);\n}\n\nexport default function InsertionPoint( props ) {\n\tconst { insertionPoint, isVisible, isBlockListEmpty } = useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetBlockInsertionPoint,\n\t\t\t\tisBlockInsertionPointVisible,\n\t\t\t\tgetBlockCount,\n\t\t\t} = select( blockEditorStore );\n\t\t\tconst blockInsertionPoint = getBlockInsertionPoint();\n\t\t\treturn {\n\t\t\t\tinsertionPoint: blockInsertionPoint,\n\t\t\t\tisVisible: isBlockInsertionPointVisible(),\n\t\t\t\tisBlockListEmpty:\n\t\t\t\t\tgetBlockCount( blockInsertionPoint?.rootClientId ) === 0,\n\t\t\t};\n\t\t},\n\t\t[]\n\t);\n\n\tif (\n\t\t! isVisible ||\n\t\t// Don't render the insertion point if the block list is empty.\n\t\t// The insertion point will be represented by the appender instead.\n\t\tisBlockListEmpty\n\t) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Render a popover that overlays the block when the desired operation is to replace it.\n\t * Otherwise, render a popover in between blocks for the indication of inserting between them.\n\t */\n\treturn insertionPoint.operation === 'replace' ? (\n\t\t<BlockDropZonePopover\n\t\t\t// Force remount to trigger the animation.\n\t\t\tkey={ `${ insertionPoint.rootClientId }-${ insertionPoint.index }` }\n\t\t\t{ ...props }\n\t\t/>\n\t) : (\n\t\t<InbetweenInsertionPointPopover\n\t\t\toperation={ insertionPoint.operation }\n\t\t\tnearestSide={ insertionPoint.nearestSide }\n\t\t\t{ ...props }\n\t\t/>\n\t);\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/build-module/components/block-tools/use-block-toolbar-popover-props.js

@@ -1,139 +1,101 @@
-/**
- * WordPress dependencies
- */
-import { useRefEffect } from '@wordpress/compose';
-import { useSelect } from '@wordpress/data';
-import { getScrollContainer } from '@wordpress/dom';
-import { useCallback, useLayoutEffect, useMemo, useState } from '@wordpress/element';
-
-/**
- * Internal dependencies
- */
-import { store as blockEditorStore } from '../../store';
-import { useBlockElement } from '../block-list/use-block-props/use-block-refs';
-import { hasStickyOrFixedPositionValue } from '../../hooks/position';
-import { getElementBounds } from '../../utils/dom';
+import { useRefEffect } from "@wordpress/compose";
+import { useSelect } from "@wordpress/data";
+import { getScrollContainer } from "@wordpress/dom";
+import {
+  useCallback,
+  useLayoutEffect,
+  useMemo,
+  useState
+} from "@wordpress/element";
+import { store as blockEditorStore } from "../../store";
+import { useBlockElement } from "../block-list/use-block-props/use-block-refs";
+import { hasStickyOrFixedPositionValue } from "../../hooks/position";
+import { getElementBounds } from "../../utils/dom";
 const COMMON_PROPS = {
-  placement: 'top-start'
+  placement: "top-start"
 };
-
-// By default the toolbar sets the `shift` prop. If the user scrolls the page
-// down the toolbar will stay on screen by adopting a sticky position at the
-// top of the viewport.
 const DEFAULT_PROPS = {
   ...COMMON_PROPS,
   flip: false,
   shift: true
 };
-
-// When there isn't enough height between the top of the block and the editor
-// canvas, the `shift` prop is set to `false`, as it will cause the block to be
-// obscured. The `flip` behavior is enabled, which positions the toolbar below
-// the block. This only happens if the block is smaller than the viewport, as
-// otherwise the toolbar will be off-screen.
 const RESTRICTED_HEIGHT_PROPS = {
   ...COMMON_PROPS,
   flip: true,
   shift: false
 };
-
-/**
- * Get the popover props for the block toolbar, determined by the space at the top of the canvas and the toolbar height.
- *
- * @param {Element} contentElement       The DOM element that represents the editor content or canvas.
- * @param {Element} selectedBlockElement The outer DOM element of the first selected block.
- * @param {Element} scrollContainer      The scrollable container for the contentElement.
- * @param {number}  toolbarHeight        The height of the toolbar in pixels.
- * @param {boolean} isSticky             Whether or not the selected block is sticky or fixed.
- *
- * @return {Object} The popover props used to determine the position of the toolbar.
- */
 function getProps(contentElement, selectedBlockElement, scrollContainer, toolbarHeight, isSticky) {
   if (!contentElement || !selectedBlockElement) {
     return DEFAULT_PROPS;
   }
-
-  // Get how far the content area has been scrolled.
   const scrollTop = scrollContainer?.scrollTop || 0;
   const blockRect = getElementBounds(selectedBlockElement);
   const contentRect = contentElement.getBoundingClientRect();
-
-  // Get the vertical position of top of the visible content area.
   const topOfContentElementInViewport = scrollTop + contentRect.top;
-
-  // The document element's clientHeight represents the viewport height.
   const viewportHeight = contentElement.ownerDocument.documentElement.clientHeight;
-
-  // The restricted height area is calculated as the sum of the
-  // vertical position of the visible content area, plus the height
-  // of the block toolbar.
   const restrictedTopArea = topOfContentElementInViewport + toolbarHeight;
   const hasSpaceForToolbarAbove = blockRect.top > restrictedTopArea;
   const isBlockTallerThanViewport = blockRect.height > viewportHeight - toolbarHeight;
-
-  // Sticky blocks are treated as if they will never have enough space for the toolbar above.
   if (!isSticky && (hasSpaceForToolbarAbove || isBlockTallerThanViewport)) {
     return DEFAULT_PROPS;
   }
   return RESTRICTED_HEIGHT_PROPS;
 }
-
-/**
- * Determines the desired popover positioning behavior, returning a set of appropriate props.
- *
- * @param {Object}  elements
- * @param {Element} elements.contentElement The DOM element that represents the editor content or canvas.
- * @param {string}  elements.clientId       The clientId of the first selected block.
- *
- * @return {Object} The popover props used to determine the position of the toolbar.
- */
-export default function useBlockToolbarPopoverProps({
+function useBlockToolbarPopoverProps({
   contentElement,
   clientId
 }) {
   const selectedBlockElement = useBlockElement(clientId);
   const [toolbarHeight, setToolbarHeight] = useState(0);
-  const {
-    blockIndex,
-    isSticky
-  } = useSelect(select => {
-    const {
-      getBlockIndex,
-      getBlockAttributes
-    } = select(blockEditorStore);
-    return {
-      blockIndex: getBlockIndex(clientId),
-      isSticky: hasStickyOrFixedPositionValue(getBlockAttributes(clientId))
-    };
-  }, [clientId]);
+  const { blockIndex, isSticky } = useSelect(
+    (select) => {
+      const { getBlockIndex, getBlockAttributes } = select(blockEditorStore);
+      return {
+        blockIndex: getBlockIndex(clientId),
+        isSticky: hasStickyOrFixedPositionValue(
+          getBlockAttributes(clientId)
+        )
+      };
+    },
+    [clientId]
+  );
   const scrollContainer = useMemo(() => {
     if (!contentElement) {
       return;
     }
     return getScrollContainer(contentElement);
   }, [contentElement]);
-  const [props, setProps] = useState(() => getProps(contentElement, selectedBlockElement, scrollContainer, toolbarHeight, isSticky));
-  const popoverRef = useRefEffect(popoverNode => {
+  const [props, setProps] = useState(
+    () => getProps(
+      contentElement,
+      selectedBlockElement,
+      scrollContainer,
+      toolbarHeight,
+      isSticky
+    )
+  );
+  const popoverRef = useRefEffect((popoverNode) => {
     setToolbarHeight(popoverNode.offsetHeight);
   }, []);
-  const updateProps = useCallback(() => setProps(getProps(contentElement, selectedBlockElement, scrollContainer, toolbarHeight, isSticky)), [contentElement, selectedBlockElement, scrollContainer, toolbarHeight]);
-
-  // Update props when the block is moved. This also ensures the props are
-  // correct on initial mount, and when the selected block or content element
-  // changes (since the callback ref will update).
+  const updateProps = useCallback(
+    () => setProps(
+      getProps(
+        contentElement,
+        selectedBlockElement,
+        scrollContainer,
+        toolbarHeight,
+        isSticky
+      )
+    ),
+    [contentElement, selectedBlockElement, scrollContainer, toolbarHeight]
+  );
   useLayoutEffect(updateProps, [blockIndex, updateProps]);
-
-  // Update props when the viewport is resized or the block is resized.
   useLayoutEffect(() => {
     if (!contentElement || !selectedBlockElement) {
       return;
     }
-
-    // Update the toolbar props on viewport resize.
     const contentView = contentElement?.ownerDocument?.defaultView;
-    contentView?.addEventHandler?.('resize', updateProps);
-
-    // Update the toolbar props on block resize.
+    contentView?.addEventHandler?.("resize", updateProps);
     let resizeObserver;
     const blockView = selectedBlockElement?.ownerDocument?.defaultView;
     if (blockView.ResizeObserver) {
@@ -141,7 +103,7 @@ export default function useBlockToolbarPopoverProps({
       resizeObserver.observe(selectedBlockElement);
     }
     return () => {
-      contentView?.removeEventHandler?.('resize', updateProps);
+      contentView?.removeEventHandler?.("resize", updateProps);
       if (resizeObserver) {
         resizeObserver.disconnect();
       }
@@ -152,4 +114,7 @@ export default function useBlockToolbarPopoverProps({
     ref: popoverRef
   };
 }
-//# sourceMappingURL=use-block-toolbar-popover-props.js.map
+export {
+  useBlockToolbarPopoverProps as default
+};
+//# sourceMappingURL=use-block-toolbar-popover-props.js.map