@wordpress/block-editor 10.4.0 → 10.5.0

package/build-module/components/off-canvas-editor/use-block-selection.js

@@ -0,0 +1,124 @@
+/**
+ * WordPress dependencies
+ */
+import { speak } from '@wordpress/a11y';
+import { __, sprintf } from '@wordpress/i18n';
+import { useDispatch, useSelect } from '@wordpress/data';
+import { useCallback } from '@wordpress/element';
+import { UP, DOWN, HOME, END } from '@wordpress/keycodes';
+import { store as blocksStore } from '@wordpress/blocks';
+/**
+ * Internal dependencies
+ */
+
+import { store as blockEditorStore } from '../../store';
+import { getCommonDepthClientIds } from './utils';
+export default function useBlockSelection() {
+  const {
+    clearSelectedBlock,
+    multiSelect,
+    selectBlock
+  } = useDispatch(blockEditorStore);
+  const {
+    getBlockName,
+    getBlockParents,
+    getBlockSelectionStart,
+    getBlockSelectionEnd,
+    getSelectedBlockClientIds,
+    hasMultiSelection,
+    hasSelectedBlock
+  } = useSelect(blockEditorStore);
+  const {
+    getBlockType
+  } = useSelect(blocksStore);
+  const updateBlockSelection = useCallback(async (event, clientId, destinationClientId) => {
+    if (!(event !== null && event !== void 0 && event.shiftKey)) {
+      selectBlock(clientId);
+      return;
+    } // To handle multiple block selection via the `SHIFT` key, prevent
+    // the browser default behavior of opening the link in a new window.
+
+
+    event.preventDefault();
+    const isKeyPress = event.type === 'keydown' && (event.keyCode === UP || event.keyCode === DOWN || event.keyCode === HOME || event.keyCode === END); // Handle clicking on a block when no blocks are selected, and return early.
+
+    if (!isKeyPress && !hasSelectedBlock() && !hasMultiSelection()) {
+      selectBlock(clientId, null);
+      return;
+    }
+
+    const selectedBlocks = getSelectedBlockClientIds();
+    const clientIdWithParents = [...getBlockParents(clientId), clientId];
+
+    if (isKeyPress && !selectedBlocks.some(blockId => clientIdWithParents.includes(blockId))) {
+      // Ensure that shift-selecting blocks via the keyboard only
+      // expands the current selection if focusing over already
+      // selected blocks. Otherwise, clear the selection so that
+      // a user can create a new selection entirely by keyboard.
+      await clearSelectedBlock();
+    }
+
+    let startTarget = getBlockSelectionStart();
+    let endTarget = clientId; // Handle keyboard behavior for selecting multiple blocks.
+
+    if (isKeyPress) {
+      if (!hasSelectedBlock() && !hasMultiSelection()) {
+        // Set the starting point of the selection to the currently
+        // focused block, if there are no blocks currently selected.
+        // This ensures that as the selection is expanded or contracted,
+        // the starting point of the selection is anchored to that block.
+        startTarget = clientId;
+      }
+
+      if (destinationClientId) {
+        // If the user presses UP or DOWN, we want to ensure that the block they're
+        // moving to is the target for selection, and not the currently focused one.
+        endTarget = destinationClientId;
+      }
+    }
+
+    const startParents = getBlockParents(startTarget);
+    const endParents = getBlockParents(endTarget);
+    const {
+      start,
+      end
+    } = getCommonDepthClientIds(startTarget, endTarget, startParents, endParents);
+    await multiSelect(start, end, null); // Announce deselected block, or number of deselected blocks if
+    // the total number of blocks deselected is greater than one.
+
+    const updatedSelectedBlocks = getSelectedBlockClientIds(); // If the selection is greater than 1 and the Home or End keys
+    // were used to generate the selection, then skip announcing the
+    // deselected blocks.
+
+    if ((event.keyCode === HOME || event.keyCode === END) && updatedSelectedBlocks.length > 1) {
+      return;
+    }
+
+    const selectionDiff = selectedBlocks.filter(blockId => !updatedSelectedBlocks.includes(blockId));
+    let label;
+
+    if (selectionDiff.length === 1) {
+      var _getBlockType;
+
+      const title = (_getBlockType = getBlockType(getBlockName(selectionDiff[0]))) === null || _getBlockType === void 0 ? void 0 : _getBlockType.title;
+
+      if (title) {
+        label = sprintf(
+        /* translators: %s: block name */
+        __('%s deselected.'), title);
+      }
+    } else if (selectionDiff.length > 1) {
+      label = sprintf(
+      /* translators: %s: number of deselected blocks */
+      __('%s blocks deselected.'), selectionDiff.length);
+    }
+
+    if (label) {
+      speak(label);
+    }
+  }, [clearSelectedBlock, getBlockName, getBlockType, getBlockParents, getBlockSelectionStart, getBlockSelectionEnd, getSelectedBlockClientIds, hasMultiSelection, hasSelectedBlock, multiSelect, selectBlock]);
+  return {
+    updateBlockSelection
+  };
+}
+//# sourceMappingURL=use-block-selection.js.map

package/build-module/components/off-canvas-editor/use-block-selection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-block-selection.js"],"names":["speak","__","sprintf","useDispatch","useSelect","useCallback","UP","DOWN","HOME","END","store","blocksStore","blockEditorStore","getCommonDepthClientIds","useBlockSelection","clearSelectedBlock","multiSelect","selectBlock","getBlockName","getBlockParents","getBlockSelectionStart","getBlockSelectionEnd","getSelectedBlockClientIds","hasMultiSelection","hasSelectedBlock","getBlockType","updateBlockSelection","event","clientId","destinationClientId","shiftKey","preventDefault","isKeyPress","type","keyCode","selectedBlocks","clientIdWithParents","some","blockId","includes","startTarget","endTarget","startParents","endParents","start","end","updatedSelectedBlocks","length","selectionDiff","filter","label","title"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { speak } from '@wordpress/a11y';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useDispatch, useSelect } from '@wordpress/data';\nimport { useCallback } from '@wordpress/element';\nimport { UP, DOWN, HOME, END } from '@wordpress/keycodes';\nimport { store as blocksStore } from '@wordpress/blocks';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\nimport { getCommonDepthClientIds } from './utils';\n\nexport default function useBlockSelection() {\n\tconst { clearSelectedBlock, multiSelect, selectBlock } =\n\t\tuseDispatch( blockEditorStore );\n\tconst {\n\t\tgetBlockName,\n\t\tgetBlockParents,\n\t\tgetBlockSelectionStart,\n\t\tgetBlockSelectionEnd,\n\t\tgetSelectedBlockClientIds,\n\t\thasMultiSelection,\n\t\thasSelectedBlock,\n\t} = useSelect( blockEditorStore );\n\n\tconst { getBlockType } = useSelect( blocksStore );\n\n\tconst updateBlockSelection = useCallback(\n\t\tasync ( event, clientId, destinationClientId ) => {\n\t\t\tif ( ! event?.shiftKey ) {\n\t\t\t\tselectBlock( clientId );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// To handle multiple block selection via the `SHIFT` key, prevent\n\t\t\t// the browser default behavior of opening the link in a new window.\n\t\t\tevent.preventDefault();\n\n\t\t\tconst isKeyPress =\n\t\t\t\tevent.type === 'keydown' &&\n\t\t\t\t( event.keyCode === UP ||\n\t\t\t\t\tevent.keyCode === DOWN ||\n\t\t\t\t\tevent.keyCode === HOME ||\n\t\t\t\t\tevent.keyCode === END );\n\n\t\t\t// Handle clicking on a block when no blocks are selected, and return early.\n\t\t\tif (\n\t\t\t\t! isKeyPress &&\n\t\t\t\t! hasSelectedBlock() &&\n\t\t\t\t! hasMultiSelection()\n\t\t\t) {\n\t\t\t\tselectBlock( clientId, null );\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst selectedBlocks = getSelectedBlockClientIds();\n\t\t\tconst clientIdWithParents = [\n\t\t\t\t...getBlockParents( clientId ),\n\t\t\t\tclientId,\n\t\t\t];\n\n\t\t\tif (\n\t\t\t\tisKeyPress &&\n\t\t\t\t! selectedBlocks.some( ( blockId ) =>\n\t\t\t\t\tclientIdWithParents.includes( blockId )\n\t\t\t\t)\n\t\t\t) {\n\t\t\t\t// Ensure that shift-selecting blocks via the keyboard only\n\t\t\t\t// expands the current selection if focusing over already\n\t\t\t\t// selected blocks. Otherwise, clear the selection so that\n\t\t\t\t// a user can create a new selection entirely by keyboard.\n\t\t\t\tawait clearSelectedBlock();\n\t\t\t}\n\n\t\t\tlet startTarget = getBlockSelectionStart();\n\t\t\tlet endTarget = clientId;\n\n\t\t\t// Handle keyboard behavior for selecting multiple blocks.\n\t\t\tif ( isKeyPress ) {\n\t\t\t\tif ( ! hasSelectedBlock() && ! hasMultiSelection() ) {\n\t\t\t\t\t// Set the starting point of the selection to the currently\n\t\t\t\t\t// focused block, if there are no blocks currently selected.\n\t\t\t\t\t// This ensures that as the selection is expanded or contracted,\n\t\t\t\t\t// the starting point of the selection is anchored to that block.\n\t\t\t\t\tstartTarget = clientId;\n\t\t\t\t}\n\t\t\t\tif ( destinationClientId ) {\n\t\t\t\t\t// If the user presses UP or DOWN, we want to ensure that the block they're\n\t\t\t\t\t// moving to is the target for selection, and not the currently focused one.\n\t\t\t\t\tendTarget = destinationClientId;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst startParents = getBlockParents( startTarget );\n\t\t\tconst endParents = getBlockParents( endTarget );\n\n\t\t\tconst { start, end } = getCommonDepthClientIds(\n\t\t\t\tstartTarget,\n\t\t\t\tendTarget,\n\t\t\t\tstartParents,\n\t\t\t\tendParents\n\t\t\t);\n\t\t\tawait multiSelect( start, end, null );\n\n\t\t\t// Announce deselected block, or number of deselected blocks if\n\t\t\t// the total number of blocks deselected is greater than one.\n\t\t\tconst updatedSelectedBlocks = getSelectedBlockClientIds();\n\n\t\t\t// If the selection is greater than 1 and the Home or End keys\n\t\t\t// were used to generate the selection, then skip announcing the\n\t\t\t// deselected blocks.\n\t\t\tif (\n\t\t\t\t( event.keyCode === HOME || event.keyCode === END ) &&\n\t\t\t\tupdatedSelectedBlocks.length > 1\n\t\t\t) {\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst selectionDiff = selectedBlocks.filter(\n\t\t\t\t( blockId ) => ! updatedSelectedBlocks.includes( blockId )\n\t\t\t);\n\n\t\t\tlet label;\n\t\t\tif ( selectionDiff.length === 1 ) {\n\t\t\t\tconst title = getBlockType(\n\t\t\t\t\tgetBlockName( selectionDiff[ 0 ] )\n\t\t\t\t)?.title;\n\t\t\t\tif ( title ) {\n\t\t\t\t\tlabel = sprintf(\n\t\t\t\t\t\t/* translators: %s: block name */\n\t\t\t\t\t\t__( '%s deselected.' ),\n\t\t\t\t\t\ttitle\n\t\t\t\t\t);\n\t\t\t\t}\n\t\t\t} else if ( selectionDiff.length > 1 ) {\n\t\t\t\tlabel = sprintf(\n\t\t\t\t\t/* translators: %s: number of deselected blocks */\n\t\t\t\t\t__( '%s blocks deselected.' ),\n\t\t\t\t\tselectionDiff.length\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tif ( label ) {\n\t\t\t\tspeak( label );\n\t\t\t}\n\t\t},\n\t\t[\n\t\t\tclearSelectedBlock,\n\t\t\tgetBlockName,\n\t\t\tgetBlockType,\n\t\t\tgetBlockParents,\n\t\t\tgetBlockSelectionStart,\n\t\t\tgetBlockSelectionEnd,\n\t\t\tgetSelectedBlockClientIds,\n\t\t\thasMultiSelection,\n\t\t\thasSelectedBlock,\n\t\t\tmultiSelect,\n\t\t\tselectBlock,\n\t\t]\n\t);\n\n\treturn {\n\t\tupdateBlockSelection,\n\t};\n}\n"]}

package/build-module/components/off-canvas-editor/use-list-view-client-ids.js

@@ -0,0 +1,24 @@
+/**
+ * WordPress dependencies
+ */
+import { useSelect } from '@wordpress/data';
+/**
+ * Internal dependencies
+ */
+
+import { store as blockEditorStore } from '../../store';
+export default function useListViewClientIds(blocks) {
+  return useSelect(select => {
+    const {
+      getDraggedBlockClientIds,
+      getSelectedBlockClientIds,
+      __unstableGetClientIdsTree
+    } = select(blockEditorStore);
+    return {
+      selectedClientIds: getSelectedBlockClientIds(),
+      draggedClientIds: getDraggedBlockClientIds(),
+      clientIdsTree: blocks ? blocks : __unstableGetClientIdsTree()
+    };
+  }, [blocks]);
+}
+//# sourceMappingURL=use-list-view-client-ids.js.map

package/build-module/components/off-canvas-editor/use-list-view-client-ids.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-list-view-client-ids.js"],"names":["useSelect","store","blockEditorStore","useListViewClientIds","blocks","select","getDraggedBlockClientIds","getSelectedBlockClientIds","__unstableGetClientIdsTree","selectedClientIds","draggedClientIds","clientIdsTree"],"mappings":"AAAA;AACA;AACA;AAEA,SAASA,SAAT,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,eAAe,SAASC,oBAAT,CAA+BC,MAA/B,EAAwC;AACtD,SAAOJ,SAAS,CACbK,MAAF,IAAc;AACb,UAAM;AACLC,MAAAA,wBADK;AAELC,MAAAA,yBAFK;AAGLC,MAAAA;AAHK,QAIFH,MAAM,CAAEH,gBAAF,CAJV;AAMA,WAAO;AACNO,MAAAA,iBAAiB,EAAEF,yBAAyB,EADtC;AAENG,MAAAA,gBAAgB,EAAEJ,wBAAwB,EAFpC;AAGNK,MAAAA,aAAa,EAAEP,MAAM,GAAGA,MAAH,GAAYI,0BAA0B;AAHrD,KAAP;AAKA,GAbc,EAcf,CAAEJ,MAAF,CAde,CAAhB;AAgBA","sourcesContent":["/**\n * WordPress dependencies\n */\n\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\nexport default function useListViewClientIds( blocks ) {\n\treturn useSelect(\n\t\t( select ) => {\n\t\t\tconst {\n\t\t\t\tgetDraggedBlockClientIds,\n\t\t\t\tgetSelectedBlockClientIds,\n\t\t\t\t__unstableGetClientIdsTree,\n\t\t\t} = select( blockEditorStore );\n\n\t\t\treturn {\n\t\t\t\tselectedClientIds: getSelectedBlockClientIds(),\n\t\t\t\tdraggedClientIds: getDraggedBlockClientIds(),\n\t\t\t\tclientIdsTree: blocks ? blocks : __unstableGetClientIdsTree(),\n\t\t\t};\n\t\t},\n\t\t[ blocks ]\n\t);\n}\n"]}

package/build-module/components/off-canvas-editor/use-list-view-drop-zone.js

@@ -0,0 +1,220 @@
+/**
+ * WordPress dependencies
+ */
+import { useSelect } from '@wordpress/data';
+import { useState, useCallback } from '@wordpress/element';
+import { useThrottle, __experimentalUseDropZone as useDropZone } from '@wordpress/compose';
+/**
+ * Internal dependencies
+ */
+
+import { getDistanceToNearestEdge, isPointContainedByRect } from '../../utils/math';
+import useOnBlockDrop from '../use-on-block-drop';
+import { store as blockEditorStore } from '../../store';
+/** @typedef {import('../../utils/math').WPPoint} WPPoint */
+
+/**
+ * The type of a drag event.
+ *
+ * @typedef {'default'|'file'|'html'} WPDragEventType
+ */
+
+/**
+ * An array representing data for blocks in the DOM used by drag and drop.
+ *
+ * @typedef {Object} WPListViewDropZoneBlocks
+ * @property {string}  clientId                        The client id for the block.
+ * @property {string}  rootClientId                    The root client id for the block.
+ * @property {number}  blockIndex                      The block's index.
+ * @property {Element} element                         The DOM element representing the block.
+ * @property {number}  innerBlockCount                 The number of inner blocks the block has.
+ * @property {boolean} isDraggedBlock                  Whether the block is currently being dragged.
+ * @property {boolean} canInsertDraggedBlocksAsSibling Whether the dragged block can be a sibling of this block.
+ * @property {boolean} canInsertDraggedBlocksAsChild   Whether the dragged block can be a child of this block.
+ */
+
+/**
+ * An object containing details of a drop target.
+ *
+ * @typedef {Object} WPListViewDropZoneTarget
+ * @property {string}                  blockIndex   The insertion index.
+ * @property {string}                  rootClientId The root client id for the block.
+ * @property {string|undefined}        clientId     The client id for the block.
+ * @property {'top'|'bottom'|'inside'} dropPosition The position relative to the block that the user is dropping to.
+ *                                                  'inside' refers to nesting as an inner block.
+ */
+
+/**
+ * Determines whether the user positioning the dragged block to nest as an
+ * inner block.
+ *
+ * Presently this is determined by whether the cursor is on the right hand side
+ * of the block.
+ *
+ * @param {WPPoint} point The point representing the cursor position when dragging.
+ * @param {DOMRect} rect  The rectangle.
+ */
+
+function isNestingGesture(point, rect) {
+  const blockCenterX = rect.left + rect.width / 2;
+  return point.x > blockCenterX;
+} // Block navigation is always a vertical list, so only allow dropping
+// to the above or below a block.
+
+
+const ALLOWED_DROP_EDGES = ['top', 'bottom'];
+/**
+ * Given blocks data and the cursor position, compute the drop target.
+ *
+ * @param {WPListViewDropZoneBlocks} blocksData Data about the blocks in list view.
+ * @param {WPPoint}                  position   The point representing the cursor position when dragging.
+ *
+ * @return {WPListViewDropZoneTarget} An object containing data about the drop target.
+ */
+
+function getListViewDropTarget(blocksData, position) {
+  let candidateEdge;
+  let candidateBlockData;
+  let candidateDistance;
+  let candidateRect;
+
+  for (const blockData of blocksData) {
+    if (blockData.isDraggedBlock) {
+      continue;
+    }
+
+    const rect = blockData.element.getBoundingClientRect();
+    const [distance, edge] = getDistanceToNearestEdge(position, rect, ALLOWED_DROP_EDGES);
+    const isCursorWithinBlock = isPointContainedByRect(position, rect);
+
+    if (candidateDistance === undefined || distance < candidateDistance || isCursorWithinBlock) {
+      candidateDistance = distance;
+      const index = blocksData.indexOf(blockData);
+      const previousBlockData = blocksData[index - 1]; // If dragging near the top of a block and the preceding block
+      // is at the same level, use the preceding block as the candidate
+      // instead, as later it makes determining a nesting drop easier.
+
+      if (edge === 'top' && previousBlockData && previousBlockData.rootClientId === blockData.rootClientId && !previousBlockData.isDraggedBlock) {
+        candidateBlockData = previousBlockData;
+        candidateEdge = 'bottom';
+        candidateRect = previousBlockData.element.getBoundingClientRect();
+      } else {
+        candidateBlockData = blockData;
+        candidateEdge = edge;
+        candidateRect = rect;
+      } // If the mouse position is within the block, break early
+      // as the user would intend to drop either before or after
+      // this block.
+      //
+      // This solves an issue where some rows in the list view
+      // tree overlap slightly due to sub-pixel rendering.
+
+
+      if (isCursorWithinBlock) {
+        break;
+      }
+    }
+  }
+
+  if (!candidateBlockData) {
+    return;
+  }
+
+  const isDraggingBelow = candidateEdge === 'bottom'; // If the user is dragging towards the bottom of the block check whether
+  // they might be trying to nest the block as a child.
+  // If the block already has inner blocks, this should always be treated
+  // as nesting since the next block in the tree will be the first child.
+
+  if (isDraggingBelow && candidateBlockData.canInsertDraggedBlocksAsChild && (candidateBlockData.innerBlockCount > 0 || isNestingGesture(position, candidateRect))) {
+    return {
+      rootClientId: candidateBlockData.clientId,
+      blockIndex: 0,
+      dropPosition: 'inside'
+    };
+  } // If dropping as a sibling, but block cannot be inserted in
+  // this context, return early.
+
+
+  if (!candidateBlockData.canInsertDraggedBlocksAsSibling) {
+    return;
+  }
+
+  const offset = isDraggingBelow ? 1 : 0;
+  return {
+    rootClientId: candidateBlockData.rootClientId,
+    clientId: candidateBlockData.clientId,
+    blockIndex: candidateBlockData.blockIndex + offset,
+    dropPosition: candidateEdge
+  };
+}
+/**
+ * A react hook for implementing a drop zone in list view.
+ *
+ * @return {WPListViewDropZoneTarget} The drop target.
+ */
+
+
+export default function useListViewDropZone() {
+  const {
+    getBlockRootClientId,
+    getBlockIndex,
+    getBlockCount,
+    getDraggedBlockClientIds,
+    canInsertBlocks
+  } = useSelect(blockEditorStore);
+  const [target, setTarget] = useState();
+  const {
+    rootClientId: targetRootClientId,
+    blockIndex: targetBlockIndex
+  } = target || {};
+  const onBlockDrop = useOnBlockDrop(targetRootClientId, targetBlockIndex);
+  const draggedBlockClientIds = getDraggedBlockClientIds();
+  const throttled = useThrottle(useCallback((event, currentTarget) => {
+    const position = {
+      x: event.clientX,
+      y: event.clientY
+    };
+    const isBlockDrag = !!(draggedBlockClientIds !== null && draggedBlockClientIds !== void 0 && draggedBlockClientIds.length);
+    const blockElements = Array.from(currentTarget.querySelectorAll('[data-block]'));
+    const blocksData = blockElements.map(blockElement => {
+      const clientId = blockElement.dataset.block;
+      const rootClientId = getBlockRootClientId(clientId);
+      return {
+        clientId,
+        rootClientId,
+        blockIndex: getBlockIndex(clientId),
+        element: blockElement,
+        isDraggedBlock: isBlockDrag ? draggedBlockClientIds.includes(clientId) : false,
+        innerBlockCount: getBlockCount(clientId),
+        canInsertDraggedBlocksAsSibling: isBlockDrag ? canInsertBlocks(draggedBlockClientIds, rootClientId) : true,
+        canInsertDraggedBlocksAsChild: isBlockDrag ? canInsertBlocks(draggedBlockClientIds, clientId) : true
+      };
+    });
+    const newTarget = getListViewDropTarget(blocksData, position);
+
+    if (newTarget) {
+      setTarget(newTarget);
+    }
+  }, [draggedBlockClientIds]), 200);
+  const ref = useDropZone({
+    onDrop: onBlockDrop,
+
+    onDragOver(event) {
+      // `currentTarget` is only available while the event is being
+      // handled, so get it now and pass it to the thottled function.
+      // https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget
+      throttled(event, event.currentTarget);
+    },
+
+    onDragEnd() {
+      throttled.cancel();
+      setTarget(null);
+    }
+
+  });
+  return {
+    ref,
+    target
+  };
+}
+//# sourceMappingURL=use-list-view-drop-zone.js.map

package/build-module/components/off-canvas-editor/use-list-view-drop-zone.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-list-view-drop-zone.js"],"names":["useSelect","useState","useCallback","useThrottle","__experimentalUseDropZone","useDropZone","getDistanceToNearestEdge","isPointContainedByRect","useOnBlockDrop","store","blockEditorStore","isNestingGesture","point","rect","blockCenterX","left","width","x","ALLOWED_DROP_EDGES","getListViewDropTarget","blocksData","position","candidateEdge","candidateBlockData","candidateDistance","candidateRect","blockData","isDraggedBlock","element","getBoundingClientRect","distance","edge","isCursorWithinBlock","undefined","index","indexOf","previousBlockData","rootClientId","isDraggingBelow","canInsertDraggedBlocksAsChild","innerBlockCount","clientId","blockIndex","dropPosition","canInsertDraggedBlocksAsSibling","offset","useListViewDropZone","getBlockRootClientId","getBlockIndex","getBlockCount","getDraggedBlockClientIds","canInsertBlocks","target","setTarget","targetRootClientId","targetBlockIndex","onBlockDrop","draggedBlockClientIds","throttled","event","currentTarget","clientX","y","clientY","isBlockDrag","length","blockElements","Array","from","querySelectorAll","map","blockElement","dataset","block","includes","newTarget","ref","onDrop","onDragOver","onDragEnd","cancel"],"mappings":"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","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useSelect } from '@wordpress/data';\nimport { useState, useCallback } from '@wordpress/element';\nimport {\n\tuseThrottle,\n\t__experimentalUseDropZone as useDropZone,\n} from '@wordpress/compose';\n\n/**\n * Internal dependencies\n */\nimport {\n\tgetDistanceToNearestEdge,\n\tisPointContainedByRect,\n} from '../../utils/math';\nimport useOnBlockDrop from '../use-on-block-drop';\nimport { store as blockEditorStore } from '../../store';\n\n/** @typedef {import('../../utils/math').WPPoint} WPPoint */\n\n/**\n * The type of a drag event.\n *\n * @typedef {'default'|'file'|'html'} WPDragEventType\n */\n\n/**\n * An array representing data for blocks in the DOM used by drag and drop.\n *\n * @typedef {Object} WPListViewDropZoneBlocks\n * @property {string}  clientId                        The client id for the block.\n * @property {string}  rootClientId                    The root client id for the block.\n * @property {number}  blockIndex                      The block's index.\n * @property {Element} element                         The DOM element representing the block.\n * @property {number}  innerBlockCount                 The number of inner blocks the block has.\n * @property {boolean} isDraggedBlock                  Whether the block is currently being dragged.\n * @property {boolean} canInsertDraggedBlocksAsSibling Whether the dragged block can be a sibling of this block.\n * @property {boolean} canInsertDraggedBlocksAsChild   Whether the dragged block can be a child of this block.\n */\n\n/**\n * An object containing details of a drop target.\n *\n * @typedef {Object} WPListViewDropZoneTarget\n * @property {string}                  blockIndex   The insertion index.\n * @property {string}                  rootClientId The root client id for the block.\n * @property {string|undefined}        clientId     The client id for the block.\n * @property {'top'|'bottom'|'inside'} dropPosition The position relative to the block that the user is dropping to.\n *                                                  'inside' refers to nesting as an inner block.\n */\n\n/**\n * Determines whether the user positioning the dragged block to nest as an\n * inner block.\n *\n * Presently this is determined by whether the cursor is on the right hand side\n * of the block.\n *\n * @param {WPPoint} point The point representing the cursor position when dragging.\n * @param {DOMRect} rect  The rectangle.\n */\nfunction isNestingGesture( point, rect ) {\n\tconst blockCenterX = rect.left + rect.width / 2;\n\treturn point.x > blockCenterX;\n}\n\n// Block navigation is always a vertical list, so only allow dropping\n// to the above or below a block.\nconst ALLOWED_DROP_EDGES = [ 'top', 'bottom' ];\n\n/**\n * Given blocks data and the cursor position, compute the drop target.\n *\n * @param {WPListViewDropZoneBlocks} blocksData Data about the blocks in list view.\n * @param {WPPoint}                  position   The point representing the cursor position when dragging.\n *\n * @return {WPListViewDropZoneTarget} An object containing data about the drop target.\n */\nfunction getListViewDropTarget( blocksData, position ) {\n\tlet candidateEdge;\n\tlet candidateBlockData;\n\tlet candidateDistance;\n\tlet candidateRect;\n\n\tfor ( const blockData of blocksData ) {\n\t\tif ( blockData.isDraggedBlock ) {\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst rect = blockData.element.getBoundingClientRect();\n\t\tconst [ distance, edge ] = getDistanceToNearestEdge(\n\t\t\tposition,\n\t\t\trect,\n\t\t\tALLOWED_DROP_EDGES\n\t\t);\n\n\t\tconst isCursorWithinBlock = isPointContainedByRect( position, rect );\n\t\tif (\n\t\t\tcandidateDistance === undefined ||\n\t\t\tdistance < candidateDistance ||\n\t\t\tisCursorWithinBlock\n\t\t) {\n\t\t\tcandidateDistance = distance;\n\n\t\t\tconst index = blocksData.indexOf( blockData );\n\t\t\tconst previousBlockData = blocksData[ index - 1 ];\n\n\t\t\t// If dragging near the top of a block and the preceding block\n\t\t\t// is at the same level, use the preceding block as the candidate\n\t\t\t// instead, as later it makes determining a nesting drop easier.\n\t\t\tif (\n\t\t\t\tedge === 'top' &&\n\t\t\t\tpreviousBlockData &&\n\t\t\t\tpreviousBlockData.rootClientId === blockData.rootClientId &&\n\t\t\t\t! previousBlockData.isDraggedBlock\n\t\t\t) {\n\t\t\t\tcandidateBlockData = previousBlockData;\n\t\t\t\tcandidateEdge = 'bottom';\n\t\t\t\tcandidateRect =\n\t\t\t\t\tpreviousBlockData.element.getBoundingClientRect();\n\t\t\t} else {\n\t\t\t\tcandidateBlockData = blockData;\n\t\t\t\tcandidateEdge = edge;\n\t\t\t\tcandidateRect = rect;\n\t\t\t}\n\n\t\t\t// If the mouse position is within the block, break early\n\t\t\t// as the user would intend to drop either before or after\n\t\t\t// this block.\n\t\t\t//\n\t\t\t// This solves an issue where some rows in the list view\n\t\t\t// tree overlap slightly due to sub-pixel rendering.\n\t\t\tif ( isCursorWithinBlock ) {\n\t\t\t\tbreak;\n\t\t\t}\n\t\t}\n\t}\n\n\tif ( ! candidateBlockData ) {\n\t\treturn;\n\t}\n\n\tconst isDraggingBelow = candidateEdge === 'bottom';\n\n\t// If the user is dragging towards the bottom of the block check whether\n\t// they might be trying to nest the block as a child.\n\t// If the block already has inner blocks, this should always be treated\n\t// as nesting since the next block in the tree will be the first child.\n\tif (\n\t\tisDraggingBelow &&\n\t\tcandidateBlockData.canInsertDraggedBlocksAsChild &&\n\t\t( candidateBlockData.innerBlockCount > 0 ||\n\t\t\tisNestingGesture( position, candidateRect ) )\n\t) {\n\t\treturn {\n\t\t\trootClientId: candidateBlockData.clientId,\n\t\t\tblockIndex: 0,\n\t\t\tdropPosition: 'inside',\n\t\t};\n\t}\n\n\t// If dropping as a sibling, but block cannot be inserted in\n\t// this context, return early.\n\tif ( ! candidateBlockData.canInsertDraggedBlocksAsSibling ) {\n\t\treturn;\n\t}\n\n\tconst offset = isDraggingBelow ? 1 : 0;\n\treturn {\n\t\trootClientId: candidateBlockData.rootClientId,\n\t\tclientId: candidateBlockData.clientId,\n\t\tblockIndex: candidateBlockData.blockIndex + offset,\n\t\tdropPosition: candidateEdge,\n\t};\n}\n\n/**\n * A react hook for implementing a drop zone in list view.\n *\n * @return {WPListViewDropZoneTarget} The drop target.\n */\nexport default function useListViewDropZone() {\n\tconst {\n\t\tgetBlockRootClientId,\n\t\tgetBlockIndex,\n\t\tgetBlockCount,\n\t\tgetDraggedBlockClientIds,\n\t\tcanInsertBlocks,\n\t} = useSelect( blockEditorStore );\n\tconst [ target, setTarget ] = useState();\n\tconst { rootClientId: targetRootClientId, blockIndex: targetBlockIndex } =\n\t\ttarget || {};\n\n\tconst onBlockDrop = useOnBlockDrop( targetRootClientId, targetBlockIndex );\n\n\tconst draggedBlockClientIds = getDraggedBlockClientIds();\n\tconst throttled = useThrottle(\n\t\tuseCallback(\n\t\t\t( event, currentTarget ) => {\n\t\t\t\tconst position = { x: event.clientX, y: event.clientY };\n\t\t\t\tconst isBlockDrag = !! draggedBlockClientIds?.length;\n\n\t\t\t\tconst blockElements = Array.from(\n\t\t\t\t\tcurrentTarget.querySelectorAll( '[data-block]' )\n\t\t\t\t);\n\n\t\t\t\tconst blocksData = blockElements.map( ( blockElement ) => {\n\t\t\t\t\tconst clientId = blockElement.dataset.block;\n\t\t\t\t\tconst rootClientId = getBlockRootClientId( clientId );\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\tclientId,\n\t\t\t\t\t\trootClientId,\n\t\t\t\t\t\tblockIndex: getBlockIndex( clientId ),\n\t\t\t\t\t\telement: blockElement,\n\t\t\t\t\t\tisDraggedBlock: isBlockDrag\n\t\t\t\t\t\t\t? draggedBlockClientIds.includes( clientId )\n\t\t\t\t\t\t\t: false,\n\t\t\t\t\t\tinnerBlockCount: getBlockCount( clientId ),\n\t\t\t\t\t\tcanInsertDraggedBlocksAsSibling: isBlockDrag\n\t\t\t\t\t\t\t? canInsertBlocks(\n\t\t\t\t\t\t\t\t\tdraggedBlockClientIds,\n\t\t\t\t\t\t\t\t\trootClientId\n\t\t\t\t\t\t\t  )\n\t\t\t\t\t\t\t: true,\n\t\t\t\t\t\tcanInsertDraggedBlocksAsChild: isBlockDrag\n\t\t\t\t\t\t\t? canInsertBlocks( draggedBlockClientIds, clientId )\n\t\t\t\t\t\t\t: true,\n\t\t\t\t\t};\n\t\t\t\t} );\n\n\t\t\t\tconst newTarget = getListViewDropTarget( blocksData, position );\n\n\t\t\t\tif ( newTarget ) {\n\t\t\t\t\tsetTarget( newTarget );\n\t\t\t\t}\n\t\t\t},\n\t\t\t[ draggedBlockClientIds ]\n\t\t),\n\t\t200\n\t);\n\n\tconst ref = useDropZone( {\n\t\tonDrop: onBlockDrop,\n\t\tonDragOver( event ) {\n\t\t\t// `currentTarget` is only available while the event is being\n\t\t\t// handled, so get it now and pass it to the thottled function.\n\t\t\t// https://developer.mozilla.org/en-US/docs/Web/API/Event/currentTarget\n\t\t\tthrottled( event, event.currentTarget );\n\t\t},\n\t\tonDragEnd() {\n\t\t\tthrottled.cancel();\n\t\t\tsetTarget( null );\n\t\t},\n\t} );\n\n\treturn { ref, target };\n}\n"]}

package/build-module/components/off-canvas-editor/use-list-view-expand-selected-item.js

@@ -0,0 +1,50 @@
+/**
+ * WordPress dependencies
+ */
+import { useEffect, useState } from '@wordpress/element';
+import { useSelect } from '@wordpress/data';
+/**
+ * Internal dependencies
+ */
+
+import { store as blockEditorStore } from '../../store';
+export default function useListViewExpandSelectedItem(_ref) {
+  let {
+    firstSelectedBlockClientId,
+    setExpandedState
+  } = _ref;
+  const [selectedTreeId, setSelectedTreeId] = useState(null);
+  const {
+    selectedBlockParentClientIds
+  } = useSelect(select => {
+    const {
+      getBlockParents
+    } = select(blockEditorStore);
+    return {
+      selectedBlockParentClientIds: getBlockParents(firstSelectedBlockClientId, false)
+    };
+  }, [firstSelectedBlockClientId]);
+  const parentClientIds = Array.isArray(selectedBlockParentClientIds) && selectedBlockParentClientIds.length ? selectedBlockParentClientIds : null; // Expand tree when a block is selected.
+
+  useEffect(() => {
+    // If the selectedTreeId is the same as the selected block,
+    // it means that the block was selected using the block list tree.
+    if (selectedTreeId === firstSelectedBlockClientId) {
+      return;
+    } // If the selected block has parents, get the top-level parent.
+
+
+    if (parentClientIds) {
+      // If the selected block has parents,
+      // expand the tree branch.
+      setExpandedState({
+        type: 'expand',
+        clientIds: selectedBlockParentClientIds
+      });
+    }
+  }, [firstSelectedBlockClientId]);
+  return {
+    setSelectedTreeId
+  };
+}
+//# sourceMappingURL=use-list-view-expand-selected-item.js.map

package/build-module/components/off-canvas-editor/use-list-view-expand-selected-item.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/use-list-view-expand-selected-item.js"],"names":["useEffect","useState","useSelect","store","blockEditorStore","useListViewExpandSelectedItem","firstSelectedBlockClientId","setExpandedState","selectedTreeId","setSelectedTreeId","selectedBlockParentClientIds","select","getBlockParents","parentClientIds","Array","isArray","length","type","clientIds"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,SAAT,EAAoBC,QAApB,QAAoC,oBAApC;AACA,SAASC,SAAT,QAA0B,iBAA1B;AAEA;AACA;AACA;;AACA,SAASC,KAAK,IAAIC,gBAAlB,QAA0C,aAA1C;AAEA,eAAe,SAASC,6BAAT,OAGX;AAAA,MAHmD;AACtDC,IAAAA,0BADsD;AAEtDC,IAAAA;AAFsD,GAGnD;AACH,QAAM,CAAEC,cAAF,EAAkBC,iBAAlB,IAAwCR,QAAQ,CAAE,IAAF,CAAtD;AACA,QAAM;AAAES,IAAAA;AAAF,MAAmCR,SAAS,CAC/CS,MAAF,IAAc;AACb,UAAM;AAAEC,MAAAA;AAAF,QAAsBD,MAAM,CAAEP,gBAAF,CAAlC;AACA,WAAO;AACNM,MAAAA,4BAA4B,EAAEE,eAAe,CAC5CN,0BAD4C,EAE5C,KAF4C;AADvC,KAAP;AAMA,GATgD,EAUjD,CAAEA,0BAAF,CAViD,CAAlD;AAaA,QAAMO,eAAe,GACpBC,KAAK,CAACC,OAAN,CAAeL,4BAAf,KACAA,4BAA4B,CAACM,MAD7B,GAEGN,4BAFH,GAGG,IAJJ,CAfG,CAqBH;;AACAV,EAAAA,SAAS,CAAE,MAAM;AAChB;AACA;AACA,QAAKQ,cAAc,KAAKF,0BAAxB,EAAqD;AACpD;AACA,KALe,CAOhB;;;AACA,QAAKO,eAAL,EAAuB;AACtB;AACA;AACAN,MAAAA,gBAAgB,CAAE;AACjBU,QAAAA,IAAI,EAAE,QADW;AAEjBC,QAAAA,SAAS,EAAER;AAFM,OAAF,CAAhB;AAIA;AACD,GAhBQ,EAgBN,CAAEJ,0BAAF,CAhBM,CAAT;AAkBA,SAAO;AACNG,IAAAA;AADM,GAAP;AAGA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useEffect, useState } from '@wordpress/element';\nimport { useSelect } from '@wordpress/data';\n\n/**\n * Internal dependencies\n */\nimport { store as blockEditorStore } from '../../store';\n\nexport default function useListViewExpandSelectedItem( {\n\tfirstSelectedBlockClientId,\n\tsetExpandedState,\n} ) {\n\tconst [ selectedTreeId, setSelectedTreeId ] = useState( null );\n\tconst { selectedBlockParentClientIds } = useSelect(\n\t\t( select ) => {\n\t\t\tconst { getBlockParents } = select( blockEditorStore );\n\t\t\treturn {\n\t\t\t\tselectedBlockParentClientIds: getBlockParents(\n\t\t\t\t\tfirstSelectedBlockClientId,\n\t\t\t\t\tfalse\n\t\t\t\t),\n\t\t\t};\n\t\t},\n\t\t[ firstSelectedBlockClientId ]\n\t);\n\n\tconst parentClientIds =\n\t\tArray.isArray( selectedBlockParentClientIds ) &&\n\t\tselectedBlockParentClientIds.length\n\t\t\t? selectedBlockParentClientIds\n\t\t\t: null;\n\n\t// Expand tree when a block is selected.\n\tuseEffect( () => {\n\t\t// If the selectedTreeId is the same as the selected block,\n\t\t// it means that the block was selected using the block list tree.\n\t\tif ( selectedTreeId === firstSelectedBlockClientId ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// If the selected block has parents, get the top-level parent.\n\t\tif ( parentClientIds ) {\n\t\t\t// If the selected block has parents,\n\t\t\t// expand the tree branch.\n\t\t\tsetExpandedState( {\n\t\t\t\ttype: 'expand',\n\t\t\t\tclientIds: selectedBlockParentClientIds,\n\t\t\t} );\n\t\t}\n\t}, [ firstSelectedBlockClientId ] );\n\n\treturn {\n\t\tsetSelectedTreeId,\n\t};\n}\n"]}

package/build-module/components/off-canvas-editor/utils.js

@@ -0,0 +1,44 @@
+/**
+ * WordPress dependencies
+ */
+import { __, sprintf } from '@wordpress/i18n';
+export const getBlockPositionDescription = (position, siblingCount, level) => sprintf(
+/* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */
+__('Block %1$d of %2$d, Level %3$d'), position, siblingCount, level);
+/**
+ * Returns true if the client ID occurs within the block selection or multi-selection,
+ * or false otherwise.
+ *
+ * @param {string}          clientId               Block client ID.
+ * @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs.
+ *
+ * @return {boolean} Whether the block is in multi-selection set.
+ */
+
+export const isClientIdSelected = (clientId, selectedBlockClientIds) => Array.isArray(selectedBlockClientIds) && selectedBlockClientIds.length ? selectedBlockClientIds.indexOf(clientId) !== -1 : selectedBlockClientIds === clientId;
+/**
+ * From a start and end clientId of potentially different nesting levels,
+ * return the nearest-depth ids that have a common level of depth in the
+ * nesting hierarchy. For multiple block selection, this ensure that the
+ * selection is always at the same nesting level, and not split across
+ * separate levels.
+ *
+ * @param {string}   startId      The first id of a selection.
+ * @param {string}   endId        The end id of a selection, usually one that has been clicked on.
+ * @param {string[]} startParents An array of ancestor ids for the start id, in descending order.
+ * @param {string[]} endParents   An array of ancestor ids for the end id, in descending order.
+ * @return {Object} An object containing the start and end ids.
+ */
+
+export function getCommonDepthClientIds(startId, endId, startParents, endParents) {
+  const startPath = [...startParents, startId];
+  const endPath = [...endParents, endId];
+  const depth = Math.min(startPath.length, endPath.length) - 1;
+  const start = startPath[depth];
+  const end = endPath[depth];
+  return {
+    start,
+    end
+  };
+}
+//# sourceMappingURL=utils.js.map

package/build-module/components/off-canvas-editor/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["@wordpress/block-editor/src/components/off-canvas-editor/utils.js"],"names":["__","sprintf","getBlockPositionDescription","position","siblingCount","level","isClientIdSelected","clientId","selectedBlockClientIds","Array","isArray","length","indexOf","getCommonDepthClientIds","startId","endId","startParents","endParents","startPath","endPath","depth","Math","min","start","end"],"mappings":"AAAA;AACA;AACA;AACA,SAASA,EAAT,EAAaC,OAAb,QAA4B,iBAA5B;AAEA,OAAO,MAAMC,2BAA2B,GAAG,CAAEC,QAAF,EAAYC,YAAZ,EAA0BC,KAA1B,KAC1CJ,OAAO;AACN;AACAD,EAAE,CAAE,gCAAF,CAFI,EAGNG,QAHM,EAINC,YAJM,EAKNC,KALM,CADD;AASP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,kBAAkB,GAAG,CAAEC,QAAF,EAAYC,sBAAZ,KACjCC,KAAK,CAACC,OAAN,CAAeF,sBAAf,KAA2CA,sBAAsB,CAACG,MAAlE,GACGH,sBAAsB,CAACI,OAAvB,CAAgCL,QAAhC,MAA+C,CAAC,CADnD,GAEGC,sBAAsB,KAAKD,QAHxB;AAKP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,SAASM,uBAAT,CACNC,OADM,EAENC,KAFM,EAGNC,YAHM,EAINC,UAJM,EAKL;AACD,QAAMC,SAAS,GAAG,CAAE,GAAGF,YAAL,EAAmBF,OAAnB,CAAlB;AACA,QAAMK,OAAO,GAAG,CAAE,GAAGF,UAAL,EAAiBF,KAAjB,CAAhB;AACA,QAAMK,KAAK,GAAGC,IAAI,CAACC,GAAL,CAAUJ,SAAS,CAACP,MAApB,EAA4BQ,OAAO,CAACR,MAApC,IAA+C,CAA7D;AACA,QAAMY,KAAK,GAAGL,SAAS,CAAEE,KAAF,CAAvB;AACA,QAAMI,GAAG,GAAGL,OAAO,CAAEC,KAAF,CAAnB;AAEA,SAAO;AACNG,IAAAA,KADM;AAENC,IAAAA;AAFM,GAAP;AAIA","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __, sprintf } from '@wordpress/i18n';\n\nexport const getBlockPositionDescription = ( position, siblingCount, level ) =>\n\tsprintf(\n\t\t/* translators: 1: The numerical position of the block. 2: The total number of blocks. 3. The level of nesting for the block. */\n\t\t__( 'Block %1$d of %2$d, Level %3$d' ),\n\t\tposition,\n\t\tsiblingCount,\n\t\tlevel\n\t);\n\n/**\n * Returns true if the client ID occurs within the block selection or multi-selection,\n * or false otherwise.\n *\n * @param {string}          clientId               Block client ID.\n * @param {string|string[]} selectedBlockClientIds Selected block client ID, or an array of multi-selected blocks client IDs.\n *\n * @return {boolean} Whether the block is in multi-selection set.\n */\nexport const isClientIdSelected = ( clientId, selectedBlockClientIds ) =>\n\tArray.isArray( selectedBlockClientIds ) && selectedBlockClientIds.length\n\t\t? selectedBlockClientIds.indexOf( clientId ) !== -1\n\t\t: selectedBlockClientIds === clientId;\n\n/**\n * From a start and end clientId of potentially different nesting levels,\n * return the nearest-depth ids that have a common level of depth in the\n * nesting hierarchy. For multiple block selection, this ensure that the\n * selection is always at the same nesting level, and not split across\n * separate levels.\n *\n * @param {string}   startId      The first id of a selection.\n * @param {string}   endId        The end id of a selection, usually one that has been clicked on.\n * @param {string[]} startParents An array of ancestor ids for the start id, in descending order.\n * @param {string[]} endParents   An array of ancestor ids for the end id, in descending order.\n * @return {Object} An object containing the start and end ids.\n */\nexport function getCommonDepthClientIds(\n\tstartId,\n\tendId,\n\tstartParents,\n\tendParents\n) {\n\tconst startPath = [ ...startParents, startId ];\n\tconst endPath = [ ...endParents, endId ];\n\tconst depth = Math.min( startPath.length, endPath.length ) - 1;\n\tconst start = startPath[ depth ];\n\tconst end = endPath[ depth ];\n\n\treturn {\n\t\tstart,\n\t\tend,\n\t};\n}\n"]}

package/build-module/components/url-popover/index.js

@@ -6,24 +6,51 @@ import { createElement } from "@wordpress/element";
  */
 import { __ } from '@wordpress/i18n';
 import { useState } from '@wordpress/element';
-import { Button, Popover } from '@wordpress/components';
+import { Button, Popover, __experimentalPopoverPositionToPlacement as positionToPlacement } from '@wordpress/components';
 import { chevronDown } from '@wordpress/icons';
+import deprecated from '@wordpress/deprecated';
 /**
  * Internal dependencies
  */
 
 import LinkViewer from './link-viewer';
 import LinkEditor from './link-editor';
+const DEFAULT_PLACEMENT = 'bottom';
 
 function URLPopover(_ref) {
   let {
     additionalControls,
     children,
     renderSettings,
-    position = 'bottom center',
+    // The DEFAULT_PLACEMENT value is assigned inside the function's body
+    placement,
     focusOnMount = 'firstElement',
+    // Deprecated
+    position,
+    // Rest
     ...popoverProps
   } = _ref;
+
+  if (position !== undefined) {
+    deprecated('`position` prop in wp.blockEditor.URLPopover', {
+      since: '6.2',
+      alternative: '`placement` prop'
+    });
+  } // Compute popover's placement:
+  // - give priority to `placement` prop, if defined
+  // - otherwise, compute it from the legacy `position` prop (if defined)
+  // - finally, fallback to the DEFAULT_PLACEMENT.
+
+
+  let computedPlacement;
+
+  if (placement !== undefined) {
+    computedPlacement = placement;
+  } else if (position !== undefined) {
+    computedPlacement = positionToPlacement(position);
+  }
+
+  computedPlacement = computedPlacement || DEFAULT_PLACEMENT;
   const [isSettingsExpanded, setIsSettingsExpanded] = useState(false);
   const showSettings = !!renderSettings && isSettingsExpanded;
 
@@ -34,7 +61,7 @@ function URLPopover(_ref) {
   return createElement(Popover, _extends({
     className: "block-editor-url-popover",
     focusOnMount: focusOnMount,
-    position: position,
+    placement: computedPlacement,
     shift: true
   }, popoverProps), createElement("div", {
     className: "block-editor-url-popover__input-container"

package/build-module/components/url-popover/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["@wordpress/block-editor/src/components/url-popover/index.js"],"names":["__","useState","Button","Popover","chevronDown","LinkViewer","LinkEditor","URLPopover","additionalControls","children","renderSettings","position","focusOnMount","popoverProps","isSettingsExpanded","setIsSettingsExpanded","showSettings","toggleSettingsVisibility"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,QAAT,QAAyB,oBAAzB;AACA,SAASC,MAAT,EAAiBC,OAAjB,QAAgC,uBAAhC;AACA,SAASC,WAAT,QAA4B,kBAA5B;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,OAAOC,UAAP,MAAuB,eAAvB;;AAEA,SAASC,UAAT,OAOI;AAAA,MAPiB;AACpBC,IAAAA,kBADoB;AAEpBC,IAAAA,QAFoB;AAGpBC,IAAAA,cAHoB;AAIpBC,IAAAA,QAAQ,GAAG,eAJS;AAKpBC,IAAAA,YAAY,GAAG,cALK;AAMpB,OAAGC;AANiB,GAOjB;AACH,QAAM,CAAEC,kBAAF,EAAsBC,qBAAtB,IAAgDd,QAAQ,CAAE,KAAF,CAA9D;AAEA,QAAMe,YAAY,GAAG,CAAC,CAAEN,cAAH,IAAqBI,kBAA1C;;AAEA,QAAMG,wBAAwB,GAAG,MAAM;AACtCF,IAAAA,qBAAqB,CAAE,CAAED,kBAAJ,CAArB;AACA,GAFD;;AAIA,SACC,cAAC,OAAD;AACC,IAAA,SAAS,EAAC,0BADX;AAEC,IAAA,YAAY,EAAGF,YAFhB;AAGC,IAAA,QAAQ,EAAGD,QAHZ;AAIC,IAAA,KAAK;AAJN,KAKME,YALN,GAOC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGJ,QADH,EAEG,CAAC,CAAEC,cAAH,IACD,cAAC,MAAD;AACC,IAAA,SAAS,EAAC,2CADX;AAEC,IAAA,IAAI,EAAGN,WAFR;AAGC,IAAA,KAAK,EAAGJ,EAAE,CAAE,eAAF,CAHX;AAIC,IAAA,OAAO,EAAGiB,wBAJX;AAKC,qBAAgBH;AALjB,IAHF,CADD,EAaGE,YAAY,IACb;AAAK,IAAA,SAAS,EAAC;AAAf,KACGN,cAAc,EADjB,CAdF,CAPD,EA0BGF,kBAAkB,IAAI,CAAEQ,YAAxB,IACD;AAAK,IAAA,SAAS,EAAC;AAAf,KACGR,kBADH,CA3BF,CADD;AAkCA;;AAEDD,UAAU,CAACD,UAAX,GAAwBA,UAAxB;AAEAC,UAAU,CAACF,UAAX,GAAwBA,UAAxB;AAEA;AACA;AACA;;AACA,eAAeE,UAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport { Button, Popover } from '@wordpress/components';\nimport { chevronDown } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport LinkViewer from './link-viewer';\nimport LinkEditor from './link-editor';\n\nfunction URLPopover( {\n\tadditionalControls,\n\tchildren,\n\trenderSettings,\n\tposition = 'bottom center',\n\tfocusOnMount = 'firstElement',\n\t...popoverProps\n} ) {\n\tconst [ isSettingsExpanded, setIsSettingsExpanded ] = useState( false );\n\n\tconst showSettings = !! renderSettings && isSettingsExpanded;\n\n\tconst toggleSettingsVisibility = () => {\n\t\tsetIsSettingsExpanded( ! isSettingsExpanded );\n\t};\n\n\treturn (\n\t\t<Popover\n\t\t\tclassName=\"block-editor-url-popover\"\n\t\t\tfocusOnMount={ focusOnMount }\n\t\t\tposition={ position }\n\t\t\tshift\n\t\t\t{ ...popoverProps }\n\t\t>\n\t\t\t<div className=\"block-editor-url-popover__input-container\">\n\t\t\t\t<div className=\"block-editor-url-popover__row\">\n\t\t\t\t\t{ children }\n\t\t\t\t\t{ !! renderSettings && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"block-editor-url-popover__settings-toggle\"\n\t\t\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\t\t\tlabel={ __( 'Link settings' ) }\n\t\t\t\t\t\t\tonClick={ toggleSettingsVisibility }\n\t\t\t\t\t\t\taria-expanded={ isSettingsExpanded }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t\t{ showSettings && (\n\t\t\t\t\t<div className=\"block-editor-url-popover__row block-editor-url-popover__settings\">\n\t\t\t\t\t\t{ renderSettings() }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ additionalControls && ! showSettings && (\n\t\t\t\t<div className=\"block-editor-url-popover__additional-controls\">\n\t\t\t\t\t{ additionalControls }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Popover>\n\t);\n}\n\nURLPopover.LinkEditor = LinkEditor;\n\nURLPopover.LinkViewer = LinkViewer;\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-popover/README.md\n */\nexport default URLPopover;\n"]}
+{"version":3,"sources":["@wordpress/block-editor/src/components/url-popover/index.js"],"names":["__","useState","Button","Popover","__experimentalPopoverPositionToPlacement","positionToPlacement","chevronDown","deprecated","LinkViewer","LinkEditor","DEFAULT_PLACEMENT","URLPopover","additionalControls","children","renderSettings","placement","focusOnMount","position","popoverProps","undefined","since","alternative","computedPlacement","isSettingsExpanded","setIsSettingsExpanded","showSettings","toggleSettingsVisibility"],"mappings":";;;AAAA;AACA;AACA;AACA,SAASA,EAAT,QAAmB,iBAAnB;AACA,SAASC,QAAT,QAAyB,oBAAzB;AACA,SACCC,MADD,EAECC,OAFD,EAGCC,wCAAwC,IAAIC,mBAH7C,QAIO,uBAJP;AAKA,SAASC,WAAT,QAA4B,kBAA5B;AACA,OAAOC,UAAP,MAAuB,uBAAvB;AAEA;AACA;AACA;;AACA,OAAOC,UAAP,MAAuB,eAAvB;AACA,OAAOC,UAAP,MAAuB,eAAvB;AAEA,MAAMC,iBAAiB,GAAG,QAA1B;;AAEA,SAASC,UAAT,OAWI;AAAA,MAXiB;AACpBC,IAAAA,kBADoB;AAEpBC,IAAAA,QAFoB;AAGpBC,IAAAA,cAHoB;AAIpB;AACAC,IAAAA,SALoB;AAMpBC,IAAAA,YAAY,GAAG,cANK;AAOpB;AACAC,IAAAA,QARoB;AASpB;AACA,OAAGC;AAViB,GAWjB;;AACH,MAAKD,QAAQ,KAAKE,SAAlB,EAA8B;AAC7BZ,IAAAA,UAAU,CAAE,8CAAF,EAAkD;AAC3Da,MAAAA,KAAK,EAAE,KADoD;AAE3DC,MAAAA,WAAW,EAAE;AAF8C,KAAlD,CAAV;AAIA,GANE,CAQH;AACA;AACA;AACA;;;AACA,MAAIC,iBAAJ;;AACA,MAAKP,SAAS,KAAKI,SAAnB,EAA+B;AAC9BG,IAAAA,iBAAiB,GAAGP,SAApB;AACA,GAFD,MAEO,IAAKE,QAAQ,KAAKE,SAAlB,EAA8B;AACpCG,IAAAA,iBAAiB,GAAGjB,mBAAmB,CAAEY,QAAF,CAAvC;AACA;;AACDK,EAAAA,iBAAiB,GAAGA,iBAAiB,IAAIZ,iBAAzC;AAEA,QAAM,CAAEa,kBAAF,EAAsBC,qBAAtB,IAAgDvB,QAAQ,CAAE,KAAF,CAA9D;AAEA,QAAMwB,YAAY,GAAG,CAAC,CAAEX,cAAH,IAAqBS,kBAA1C;;AAEA,QAAMG,wBAAwB,GAAG,MAAM;AACtCF,IAAAA,qBAAqB,CAAE,CAAED,kBAAJ,CAArB;AACA,GAFD;;AAIA,SACC,cAAC,OAAD;AACC,IAAA,SAAS,EAAC,0BADX;AAEC,IAAA,YAAY,EAAGP,YAFhB;AAGC,IAAA,SAAS,EAAGM,iBAHb;AAIC,IAAA,KAAK;AAJN,KAKMJ,YALN,GAOC;AAAK,IAAA,SAAS,EAAC;AAAf,KACC;AAAK,IAAA,SAAS,EAAC;AAAf,KACGL,QADH,EAEG,CAAC,CAAEC,cAAH,IACD,cAAC,MAAD;AACC,IAAA,SAAS,EAAC,2CADX;AAEC,IAAA,IAAI,EAAGR,WAFR;AAGC,IAAA,KAAK,EAAGN,EAAE,CAAE,eAAF,CAHX;AAIC,IAAA,OAAO,EAAG0B,wBAJX;AAKC,qBAAgBH;AALjB,IAHF,CADD,EAaGE,YAAY,IACb;AAAK,IAAA,SAAS,EAAC;AAAf,KACGX,cAAc,EADjB,CAdF,CAPD,EA0BGF,kBAAkB,IAAI,CAAEa,YAAxB,IACD;AAAK,IAAA,SAAS,EAAC;AAAf,KACGb,kBADH,CA3BF,CADD;AAkCA;;AAEDD,UAAU,CAACF,UAAX,GAAwBA,UAAxB;AAEAE,UAAU,CAACH,UAAX,GAAwBA,UAAxB;AAEA;AACA;AACA;;AACA,eAAeG,UAAf","sourcesContent":["/**\n * WordPress dependencies\n */\nimport { __ } from '@wordpress/i18n';\nimport { useState } from '@wordpress/element';\nimport {\n\tButton,\n\tPopover,\n\t__experimentalPopoverPositionToPlacement as positionToPlacement,\n} from '@wordpress/components';\nimport { chevronDown } from '@wordpress/icons';\nimport deprecated from '@wordpress/deprecated';\n\n/**\n * Internal dependencies\n */\nimport LinkViewer from './link-viewer';\nimport LinkEditor from './link-editor';\n\nconst DEFAULT_PLACEMENT = 'bottom';\n\nfunction URLPopover( {\n\tadditionalControls,\n\tchildren,\n\trenderSettings,\n\t// The DEFAULT_PLACEMENT value is assigned inside the function's body\n\tplacement,\n\tfocusOnMount = 'firstElement',\n\t// Deprecated\n\tposition,\n\t// Rest\n\t...popoverProps\n} ) {\n\tif ( position !== undefined ) {\n\t\tdeprecated( '`position` prop in wp.blockEditor.URLPopover', {\n\t\t\tsince: '6.2',\n\t\t\talternative: '`placement` prop',\n\t\t} );\n\t}\n\n\t// Compute popover's placement:\n\t// - give priority to `placement` prop, if defined\n\t// - otherwise, compute it from the legacy `position` prop (if defined)\n\t// - finally, fallback to the DEFAULT_PLACEMENT.\n\tlet computedPlacement;\n\tif ( placement !== undefined ) {\n\t\tcomputedPlacement = placement;\n\t} else if ( position !== undefined ) {\n\t\tcomputedPlacement = positionToPlacement( position );\n\t}\n\tcomputedPlacement = computedPlacement || DEFAULT_PLACEMENT;\n\n\tconst [ isSettingsExpanded, setIsSettingsExpanded ] = useState( false );\n\n\tconst showSettings = !! renderSettings && isSettingsExpanded;\n\n\tconst toggleSettingsVisibility = () => {\n\t\tsetIsSettingsExpanded( ! isSettingsExpanded );\n\t};\n\n\treturn (\n\t\t<Popover\n\t\t\tclassName=\"block-editor-url-popover\"\n\t\t\tfocusOnMount={ focusOnMount }\n\t\t\tplacement={ computedPlacement }\n\t\t\tshift\n\t\t\t{ ...popoverProps }\n\t\t>\n\t\t\t<div className=\"block-editor-url-popover__input-container\">\n\t\t\t\t<div className=\"block-editor-url-popover__row\">\n\t\t\t\t\t{ children }\n\t\t\t\t\t{ !! renderSettings && (\n\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\tclassName=\"block-editor-url-popover__settings-toggle\"\n\t\t\t\t\t\t\ticon={ chevronDown }\n\t\t\t\t\t\t\tlabel={ __( 'Link settings' ) }\n\t\t\t\t\t\t\tonClick={ toggleSettingsVisibility }\n\t\t\t\t\t\t\taria-expanded={ isSettingsExpanded }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</div>\n\t\t\t\t{ showSettings && (\n\t\t\t\t\t<div className=\"block-editor-url-popover__row block-editor-url-popover__settings\">\n\t\t\t\t\t\t{ renderSettings() }\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</div>\n\t\t\t{ additionalControls && ! showSettings && (\n\t\t\t\t<div className=\"block-editor-url-popover__additional-controls\">\n\t\t\t\t\t{ additionalControls }\n\t\t\t\t</div>\n\t\t\t) }\n\t\t</Popover>\n\t);\n}\n\nURLPopover.LinkEditor = LinkEditor;\n\nURLPopover.LinkViewer = LinkViewer;\n\n/**\n * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/url-popover/README.md\n */\nexport default URLPopover;\n"]}

package/build-module/components/use-setting/index.js

@@ -14,7 +14,7 @@ import { __EXPERIMENTAL_PATHS_WITH_MERGE as PATHS_WITH_MERGE, hasBlockSupport }
 
 import { useBlockEditContext } from '../block-edit';
 import { store as blockEditorStore } from '../../store';
-const blockedPaths = ['color', 'border', 'typography', 'spacing'];
+const blockedPaths = ['color', 'border', 'dimensions', 'typography', 'spacing'];
 const deprecatedFlags = {
   'color.palette': settings => settings.colors,
   'color.gradients': settings => settings.gradients,