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

package/build/components/list-view/block.js

@@ -1,51 +1,64 @@
 "use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var block_exports = {};
+__export(block_exports, {
+  default: () => block_default
 });
-exports.default = void 0;
-var _clsx = _interopRequireDefault(require("clsx"));
-var _blocks = require("@wordpress/blocks");
-var _components = require("@wordpress/components");
-var _compose = require("@wordpress/compose");
-var _icons = require("@wordpress/icons");
-var _element = require("@wordpress/element");
-var _data = require("@wordpress/data");
-var _i18n = require("@wordpress/i18n");
-var _keycodes = require("@wordpress/keycodes");
-var _isShallowEqual = _interopRequireDefault(require("@wordpress/is-shallow-equal"));
-var _keyboardShortcuts = require("@wordpress/keyboard-shortcuts");
-var _a11y = require("@wordpress/a11y");
-var _leaf = _interopRequireDefault(require("./leaf"));
-var _useListViewScrollIntoView = _interopRequireDefault(require("./use-list-view-scroll-into-view"));
-var _button = require("../block-mover/button");
-var _blockContents = _interopRequireDefault(require("./block-contents"));
-var _context = require("./context");
-var _utils = require("./utils");
-var _store = require("../../store");
-var _useBlockDisplayInformation = _interopRequireDefault(require("../use-block-display-information"));
-var _blockLock = require("../block-lock");
-var _ariaReferencedText = _interopRequireDefault(require("./aria-referenced-text"));
-var _lockUnlock = require("../../lock-unlock");
-var _usePasteStyles = _interopRequireDefault(require("../use-paste-styles"));
-var _jsxRuntime = require("react/jsx-runtime");
-/**
- * External dependencies
- */
-
-/**
- * WordPress dependencies
- */
-
-/**
- * Internal dependencies
- */
-
+module.exports = __toCommonJS(block_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_clsx = __toESM(require("clsx"));
+var import_blocks = require("@wordpress/blocks");
+var import_components = require("@wordpress/components");
+var import_compose = require("@wordpress/compose");
+var import_icons = require("@wordpress/icons");
+var import_element = require("@wordpress/element");
+var import_data = require("@wordpress/data");
+var import_i18n = require("@wordpress/i18n");
+var import_keycodes = require("@wordpress/keycodes");
+var import_is_shallow_equal = __toESM(require("@wordpress/is-shallow-equal"));
+var import_keyboard_shortcuts = require("@wordpress/keyboard-shortcuts");
+var import_a11y = require("@wordpress/a11y");
+var import_leaf = __toESM(require("./leaf"));
+var import_use_list_view_scroll_into_view = __toESM(require("./use-list-view-scroll-into-view"));
+var import_button = require("../block-mover/button");
+var import_block_contents = __toESM(require("./block-contents"));
+var import_context = require("./context");
+var import_utils = require("./utils");
+var import_store = require("../../store");
+var import_use_block_display_information = __toESM(require("../use-block-display-information"));
+var import_block_lock = require("../block-lock");
+var import_aria_referenced_text = __toESM(require("./aria-referenced-text"));
+var import_lock_unlock = require("../../lock-unlock");
+var import_use_paste_styles = __toESM(require("../use-paste-styles"));
+var import_utils2 = require("../../hooks/utils");
 function ListViewBlock({
-  block: {
-    clientId
-  },
+  block: { clientId },
   displacement,
   isAfterDraggedBlocks,
   isDragged,
@@ -63,16 +76,12 @@ function ListViewBlock({
   selectedClientIds,
   isSyncedBranch
 }) {
-  const cellRef = (0, _element.useRef)(null);
-  const rowRef = (0, _element.useRef)(null);
-  const settingsRef = (0, _element.useRef)(null);
-  const [isHovered, setIsHovered] = (0, _element.useState)(false);
-  const [settingsAnchorRect, setSettingsAnchorRect] = (0, _element.useState)();
-  const {
-    isLocked,
-    canEdit,
-    canMove
-  } = (0, _blockLock.useBlockLock)(clientId);
+  const cellRef = (0, import_element.useRef)(null);
+  const rowRef = (0, import_element.useRef)(null);
+  const settingsRef = (0, import_element.useRef)(null);
+  const [isHovered, setIsHovered] = (0, import_element.useState)(false);
+  const [settingsAnchorRect, setSettingsAnchorRect] = (0, import_element.useState)();
+  const { isLocked, canEdit, canMove } = (0, import_block_lock.useBlockLock)(clientId);
   const isFirstSelectedBlock = isSelected && selectedClientIds[0] === clientId;
   const isLastSelectedBlock = isSelected && selectedClientIds[selectedClientIds.length - 1] === clientId;
   const {
@@ -83,9 +92,13 @@ function ListViewBlock({
     removeBlocks,
     insertAfterBlock,
     insertBeforeBlock,
-    setOpenedBlockSettingsMenu
-  } = (0, _lockUnlock.unlock)((0, _data.useDispatch)(_store.store));
-  const debouncedToggleBlockHighlight = (0, _compose.useDebounce)(toggleBlockHighlight, 50);
+    setOpenedBlockSettingsMenu,
+    updateBlockAttributes
+  } = (0, import_lock_unlock.unlock)((0, import_data.useDispatch)(import_store.store));
+  const debouncedToggleBlockHighlight = (0, import_compose.useDebounce)(
+    toggleBlockHighlight,
+    50
+  );
   const {
     canInsertBlockType,
     getSelectedBlockClientIds,
@@ -96,39 +109,32 @@ function ListViewBlock({
     getBlocksByClientId,
     canRemoveBlocks,
     isGroupable
-  } = (0, _data.useSelect)(_store.store);
-  const {
-    getGroupingBlockName
-  } = (0, _data.useSelect)(_blocks.store);
-  const blockInformation = (0, _useBlockDisplayInformation.default)(clientId);
-  const pasteStyles = (0, _usePasteStyles.default)();
-  const {
-    block,
-    blockName,
-    allowRightClickOverrides,
-    isBlockHidden
-  } = (0, _data.useSelect)(select => {
-    const {
-      getBlock,
-      getBlockName,
-      getSettings
-    } = select(_store.store);
-    const {
-      isBlockHidden: _isBlockHidden
-    } = (0, _lockUnlock.unlock)(select(_store.store));
-    return {
-      block: getBlock(clientId),
-      blockName: getBlockName(clientId),
-      allowRightClickOverrides: getSettings().allowRightClickOverrides,
-      isBlockHidden: _isBlockHidden(clientId)
-    };
-  }, [clientId]);
-  const showBlockActions =
-  // When a block hides its toolbar it also hides the block settings menu,
-  // since that menu is part of the toolbar in the editor canvas.
-  // List View respects this by also hiding the block settings menu.
-  (0, _blocks.hasBlockSupport)(blockName, '__experimentalToolbar', true);
-  const instanceId = (0, _compose.useInstanceId)(ListViewBlock);
+  } = (0, import_data.useSelect)(import_store.store);
+  const { getGroupingBlockName } = (0, import_data.useSelect)(import_blocks.store);
+  const blockInformation = (0, import_use_block_display_information.default)(clientId);
+  const pasteStyles = (0, import_use_paste_styles.default)();
+  const { block, blockName, allowRightClickOverrides, isBlockHidden } = (0, import_data.useSelect)(
+    (select) => {
+      const { getBlock, getBlockName, getSettings } = select(import_store.store);
+      const { isBlockHidden: _isBlockHidden } = (0, import_lock_unlock.unlock)(
+        select(import_store.store)
+      );
+      return {
+        block: getBlock(clientId),
+        blockName: getBlockName(clientId),
+        allowRightClickOverrides: getSettings().allowRightClickOverrides,
+        isBlockHidden: _isBlockHidden(clientId)
+      };
+    },
+    [clientId]
+  );
+  const showBlockActions = (
+    // When a block hides its toolbar it also hides the block settings menu,
+    // since that menu is part of the toolbar in the editor canvas.
+    // List View respects this by also hiding the block settings menu.
+    (0, import_blocks.hasBlockSupport)(blockName, "__experimentalToolbar", true)
+  );
+  const instanceId = (0, import_compose.useInstanceId)(ListViewBlock);
   const descriptionId = `list-view-block-select-button__description-${instanceId}`;
   const {
     expand,
@@ -140,12 +146,8 @@ function ListViewBlock({
     setInsertedBlock,
     treeGridElementRef,
     rootClientId
-  } = (0, _context.useListViewContext)();
-  const isMatch = (0, _keyboardShortcuts.__unstableUseShortcutEventMatch)();
-
-  // Determine which blocks to update:
-  // If the current (focused) block is part of the block selection, use the whole selection.
-  // If the focused block is not part of the block selection, only update the focused block.
+  } = (0, import_context.useListViewContext)();
+  const isMatch = (0, import_keyboard_shortcuts.__unstableUseShortcutEventMatch)();
   function getBlocksToUpdate() {
     const selectedBlockClientIds = getSelectedBlockClientIds();
     const isUpdatingSelectedBlocks = selectedBlockClientIds.includes(clientId);
@@ -159,215 +161,210 @@ function ListViewBlock({
       selectedBlockClientIds
     };
   }
-
-  /**
-   * @param {KeyboardEvent} event
-   */
   async function onKeyDown(event) {
     if (event.defaultPrevented) {
       return;
     }
-
-    // Do not handle events if it comes from modals;
-    // retain the default behavior for these keys.
-    if (event.target.closest('[role=dialog]')) {
+    if (event.target.closest("[role=dialog]")) {
       return;
     }
-    const isDeleteKey = [_keycodes.BACKSPACE, _keycodes.DELETE].includes(event.keyCode);
-
-    // If multiple blocks are selected, deselect all blocks when the user
-    // presses the escape key.
-    if (isMatch('core/block-editor/unselect', event) && selectedClientIds.length > 0) {
+    const isDeleteKey = [import_keycodes.BACKSPACE, import_keycodes.DELETE].includes(event.keyCode);
+    if (isMatch("core/block-editor/unselect", event) && selectedClientIds.length > 0) {
       event.stopPropagation();
       event.preventDefault();
-      selectBlock(event, undefined);
-    } else if (isDeleteKey || isMatch('core/block-editor/remove', event)) {
-      var _getPreviousBlockClie;
+      selectBlock(event, void 0);
+    } else if (isDeleteKey || isMatch("core/block-editor/remove", event)) {
       const {
         blocksToUpdate: blocksToDelete,
         firstBlockClientId,
         firstBlockRootClientId,
         selectedBlockClientIds
       } = getBlocksToUpdate();
-
-      // Don't update the selection if the blocks cannot be deleted.
       if (!canRemoveBlocks(blocksToDelete)) {
         return;
       }
-      let blockToFocus = (_getPreviousBlockClie = getPreviousBlockClientId(firstBlockClientId)) !== null && _getPreviousBlockClie !== void 0 ? _getPreviousBlockClie :
-      // If the previous block is not found (when the first block is deleted),
+      let blockToFocus = getPreviousBlockClientId(firstBlockClientId) ?? // If the previous block is not found (when the first block is deleted),
       // fallback to focus the parent block.
       firstBlockRootClientId;
       removeBlocks(blocksToDelete, false);
-
-      // Update the selection if the original selection has been removed.
       const shouldUpdateSelection = selectedBlockClientIds.length > 0 && getSelectedBlockClientIds().length === 0;
-
-      // If there's no previous block nor parent block, focus the first block.
       if (!blockToFocus) {
         blockToFocus = getBlockOrder()[0];
       }
       updateFocusAndSelection(blockToFocus, shouldUpdateSelection);
-    } else if (isMatch('core/block-editor/paste-styles', event)) {
+    } else if (isMatch("core/block-editor/paste-styles", event)) {
       event.preventDefault();
-      const {
-        blocksToUpdate
-      } = getBlocksToUpdate();
+      const { blocksToUpdate } = getBlocksToUpdate();
       const blocks = getBlocksByClientId(blocksToUpdate);
       pasteStyles(blocks);
-    } else if (isMatch('core/block-editor/duplicate', event)) {
+    } else if (isMatch("core/block-editor/duplicate", event)) {
       event.preventDefault();
-      const {
-        blocksToUpdate,
-        firstBlockRootClientId
-      } = getBlocksToUpdate();
-      const canDuplicate = getBlocksByClientId(blocksToUpdate).every(blockToUpdate => {
-        return !!blockToUpdate && (0, _blocks.hasBlockSupport)(blockToUpdate.name, 'multiple', true) && canInsertBlockType(blockToUpdate.name, firstBlockRootClientId);
-      });
+      const { blocksToUpdate, firstBlockRootClientId } = getBlocksToUpdate();
+      const canDuplicate = getBlocksByClientId(blocksToUpdate).every(
+        (blockToUpdate) => {
+          return !!blockToUpdate && (0, import_blocks.hasBlockSupport)(
+            blockToUpdate.name,
+            "multiple",
+            true
+          ) && canInsertBlockType(
+            blockToUpdate.name,
+            firstBlockRootClientId
+          );
+        }
+      );
       if (canDuplicate) {
-        const updatedBlocks = await duplicateBlocks(blocksToUpdate, false);
+        const updatedBlocks = await duplicateBlocks(
+          blocksToUpdate,
+          false
+        );
         if (updatedBlocks?.length) {
-          // If blocks have been duplicated, focus the first duplicated block.
           updateFocusAndSelection(updatedBlocks[0], false);
         }
       }
-    } else if (isMatch('core/block-editor/insert-before', event)) {
+    } else if (isMatch("core/block-editor/insert-before", event)) {
       event.preventDefault();
-      const {
-        blocksToUpdate
-      } = getBlocksToUpdate();
+      const { blocksToUpdate } = getBlocksToUpdate();
       await insertBeforeBlock(blocksToUpdate[0]);
       const newlySelectedBlocks = getSelectedBlockClientIds();
-
-      // Focus the first block of the newly inserted blocks, to keep focus within the list view.
-      setOpenedBlockSettingsMenu(undefined);
+      setOpenedBlockSettingsMenu(void 0);
       updateFocusAndSelection(newlySelectedBlocks[0], false);
-    } else if (isMatch('core/block-editor/insert-after', event)) {
+    } else if (isMatch("core/block-editor/insert-after", event)) {
       event.preventDefault();
-      const {
-        blocksToUpdate
-      } = getBlocksToUpdate();
+      const { blocksToUpdate } = getBlocksToUpdate();
       await insertAfterBlock(blocksToUpdate.at(-1));
       const newlySelectedBlocks = getSelectedBlockClientIds();
-
-      // Focus the first block of the newly inserted blocks, to keep focus within the list view.
-      setOpenedBlockSettingsMenu(undefined);
+      setOpenedBlockSettingsMenu(void 0);
       updateFocusAndSelection(newlySelectedBlocks[0], false);
-    } else if (isMatch('core/block-editor/select-all', event)) {
+    } else if (isMatch("core/block-editor/select-all", event)) {
       event.preventDefault();
-      const {
-        firstBlockRootClientId,
-        selectedBlockClientIds
-      } = getBlocksToUpdate();
+      const { firstBlockRootClientId, selectedBlockClientIds } = getBlocksToUpdate();
       const blockClientIds = getBlockOrder(firstBlockRootClientId);
       if (!blockClientIds.length) {
         return;
       }
-
-      // If we have selected all sibling nested blocks, try selecting up a level.
-      // This is a similar implementation to that used by `useSelectAll`.
-      // `isShallowEqual` is used for the list view instead of a length check,
-      // as the array of siblings of the currently focused block may be a different
-      // set of blocks from the current block selection if the user is focused
-      // on a different part of the list view from the block selection.
-      if ((0, _isShallowEqual.default)(selectedBlockClientIds, blockClientIds)) {
-        // Only select up a level if the first block is not the root block.
-        // This ensures that the block selection can't break out of the root block
-        // used by the list view, if the list view is only showing a partial hierarchy.
+      if ((0, import_is_shallow_equal.default)(selectedBlockClientIds, blockClientIds)) {
         if (firstBlockRootClientId && firstBlockRootClientId !== rootClientId) {
           updateFocusAndSelection(firstBlockRootClientId, true);
           return;
         }
       }
-
-      // Select all while passing `null` to skip focusing to the editor canvas,
-      // and retain focus within the list view.
-      multiSelect(blockClientIds[0], blockClientIds[blockClientIds.length - 1], null);
-    } else if (isMatch('core/block-editor/collapse-list-view', event)) {
+      multiSelect(
+        blockClientIds[0],
+        blockClientIds[blockClientIds.length - 1],
+        null
+      );
+    } else if (isMatch("core/block-editor/collapse-list-view", event)) {
       event.preventDefault();
-      const {
-        firstBlockClientId
-      } = getBlocksToUpdate();
+      const { firstBlockClientId } = getBlocksToUpdate();
       const blockParents = getBlockParents(firstBlockClientId, false);
-      // Collapse all blocks.
       collapseAll();
-      // Expand all parents of the current block.
       expand(blockParents);
-    } else if (isMatch('core/block-editor/group', event)) {
-      const {
-        blocksToUpdate
-      } = getBlocksToUpdate();
+    } else if (isMatch("core/block-editor/group", event)) {
+      const { blocksToUpdate } = getBlocksToUpdate();
       if (blocksToUpdate.length > 1 && isGroupable(blocksToUpdate)) {
         event.preventDefault();
         const blocks = getBlocksByClientId(blocksToUpdate);
         const groupingBlockName = getGroupingBlockName();
-        const newBlocks = (0, _blocks.switchToBlockType)(blocks, groupingBlockName);
+        const newBlocks = (0, import_blocks.switchToBlockType)(
+          blocks,
+          groupingBlockName
+        );
         replaceBlocks(blocksToUpdate, newBlocks);
-        (0, _a11y.speak)((0, _i18n.__)('Selected blocks are grouped.'));
+        (0, import_a11y.speak)((0, import_i18n.__)("Selected blocks are grouped."));
         const newlySelectedBlocks = getSelectedBlockClientIds();
-        // Focus the first block of the newly inserted blocks, to keep focus within the list view.
-        setOpenedBlockSettingsMenu(undefined);
+        setOpenedBlockSettingsMenu(void 0);
         updateFocusAndSelection(newlySelectedBlocks[0], false);
       }
+    } else if (isMatch("core/block-editor/toggle-block-visibility", event)) {
+      event.preventDefault();
+      const { blocksToUpdate } = getBlocksToUpdate();
+      const blocks = getBlocksByClientId(blocksToUpdate);
+      const canToggleBlockVisibility = blocks.every(
+        (blockToUpdate) => (0, import_blocks.hasBlockSupport)(blockToUpdate.name, "blockVisibility", true)
+      );
+      if (!canToggleBlockVisibility) {
+        return;
+      }
+      const hasHiddenBlock = blocks.some(
+        (blockToUpdate) => blockToUpdate.attributes.metadata?.blockVisibility === false
+      );
+      const attributesByClientId = Object.fromEntries(
+        blocks.map(({ clientId: mapClientId, attributes }) => [
+          mapClientId,
+          {
+            metadata: (0, import_utils2.cleanEmptyObject)({
+              ...attributes?.metadata,
+              blockVisibility: hasHiddenBlock ? void 0 : false
+            })
+          }
+        ])
+      );
+      updateBlockAttributes(blocksToUpdate, attributesByClientId, {
+        uniqueByBlock: true
+      });
     }
   }
-  const onMouseEnter = (0, _element.useCallback)(() => {
+  const onMouseEnter = (0, import_element.useCallback)(() => {
     setIsHovered(true);
     debouncedToggleBlockHighlight(clientId, true);
   }, [clientId, setIsHovered, debouncedToggleBlockHighlight]);
-  const onMouseLeave = (0, _element.useCallback)(() => {
+  const onMouseLeave = (0, import_element.useCallback)(() => {
     setIsHovered(false);
     debouncedToggleBlockHighlight(clientId, false);
   }, [clientId, setIsHovered, debouncedToggleBlockHighlight]);
-  const selectEditorBlock = (0, _element.useCallback)(event => {
-    selectBlock(event, clientId);
-    event.preventDefault();
-  }, [clientId, selectBlock]);
-  const updateFocusAndSelection = (0, _element.useCallback)((focusClientId, shouldSelectBlock) => {
-    if (shouldSelectBlock) {
-      selectBlock(undefined, focusClientId, null, null);
-    }
-    (0, _utils.focusListItem)(focusClientId, treeGridElementRef?.current);
-  }, [selectBlock, treeGridElementRef]);
-  const toggleExpanded = (0, _element.useCallback)(event => {
-    // Prevent shift+click from opening link in a new window when toggling.
-    event.preventDefault();
-    event.stopPropagation();
-    if (isExpanded === true) {
-      collapse(clientId);
-    } else if (isExpanded === false) {
-      expand(clientId);
-    }
-  }, [clientId, expand, collapse, isExpanded]);
-
-  // Allow right-clicking an item in the List View to open up the block settings dropdown.
-  const onContextMenu = (0, _element.useCallback)(event => {
-    if (showBlockActions && allowRightClickOverrides) {
-      settingsRef.current?.click();
-      // Ensure the position of the settings dropdown is at the cursor.
-      setSettingsAnchorRect(new window.DOMRect(event.clientX, event.clientY, 0, 0));
+  const selectEditorBlock = (0, import_element.useCallback)(
+    (event) => {
+      selectBlock(event, clientId);
       event.preventDefault();
-    }
-  }, [allowRightClickOverrides, settingsRef, showBlockActions]);
-  const onMouseDown = (0, _element.useCallback)(event => {
-    // Prevent right-click from focusing the block,
-    // because focus will be handled when opening the block settings dropdown.
-    if (allowRightClickOverrides && event.button === 2) {
+    },
+    [clientId, selectBlock]
+  );
+  const updateFocusAndSelection = (0, import_element.useCallback)(
+    (focusClientId, shouldSelectBlock) => {
+      if (shouldSelectBlock) {
+        selectBlock(void 0, focusClientId, null, null);
+      }
+      (0, import_utils.focusListItem)(focusClientId, treeGridElementRef?.current);
+    },
+    [selectBlock, treeGridElementRef]
+  );
+  const toggleExpanded = (0, import_element.useCallback)(
+    (event) => {
       event.preventDefault();
-    }
-  }, [allowRightClickOverrides]);
-  const settingsPopoverAnchor = (0, _element.useMemo)(() => {
-    const {
-      ownerDocument
-    } = rowRef?.current || {};
-
-    // If no custom position is set, the settings dropdown will be anchored to the
-    // DropdownMenu toggle button.
+      event.stopPropagation();
+      if (isExpanded === true) {
+        collapse(clientId);
+      } else if (isExpanded === false) {
+        expand(clientId);
+      }
+    },
+    [clientId, expand, collapse, isExpanded]
+  );
+  const onContextMenu = (0, import_element.useCallback)(
+    (event) => {
+      if (showBlockActions && allowRightClickOverrides) {
+        settingsRef.current?.click();
+        setSettingsAnchorRect(
+          new window.DOMRect(event.clientX, event.clientY, 0, 0)
+        );
+        event.preventDefault();
+      }
+    },
+    [allowRightClickOverrides, settingsRef, showBlockActions]
+  );
+  const onMouseDown = (0, import_element.useCallback)(
+    (event) => {
+      if (allowRightClickOverrides && event.button === 2) {
+        event.preventDefault();
+      }
+    },
+    [allowRightClickOverrides]
+  );
+  const settingsPopoverAnchor = (0, import_element.useMemo)(() => {
+    const { ownerDocument } = rowRef?.current || {};
     if (!settingsAnchorRect || !ownerDocument) {
-      return undefined;
+      return void 0;
     }
-
-    // Position the settings dropdown at the cursor when right-clicking a block.
     return {
       ownerDocument,
       getBoundingClientRect() {
@@ -375,179 +372,182 @@ function ListViewBlock({
       }
     };
   }, [settingsAnchorRect]);
-  const clearSettingsAnchorRect = (0, _element.useCallback)(() => {
-    // Clear the custom position for the settings dropdown so that it is restored back
-    // to being anchored to the DropdownMenu toggle button.
-    setSettingsAnchorRect(undefined);
+  const clearSettingsAnchorRect = (0, import_element.useCallback)(() => {
+    setSettingsAnchorRect(void 0);
   }, [setSettingsAnchorRect]);
-
-  // Pass in a ref to the row, so that it can be scrolled
-  // into view when selected. For long lists, the placeholder for the
-  // selected block is also observed, within ListViewLeafPlaceholder.
-  (0, _useListViewScrollIntoView.default)({
+  (0, import_use_list_view_scroll_into_view.default)({
     isSelected,
     rowItemRef: rowRef,
     selectedClientIds
   });
-
-  // When switching between rendering modes (such as template preview and content only),
-  // it is possible for a block to temporarily be unavailable. In this case, we should not
-  // render the leaf, to avoid errors further down the tree.
   if (!block) {
     return null;
   }
-  const blockPositionDescription = (0, _utils.getBlockPositionDescription)(position, siblingBlockCount, level);
-  const blockPropertiesDescription = (0, _utils.getBlockPropertiesDescription)(blockInformation, isLocked);
-  const blockVisibilityDescription = isBlockHidden ? (0, _i18n.__)('Block is hidden.') : null;
+  const blockPositionDescription = (0, import_utils.getBlockPositionDescription)(
+    position,
+    siblingBlockCount,
+    level
+  );
+  const blockPropertiesDescription = (0, import_utils.getBlockPropertiesDescription)(
+    blockInformation,
+    isLocked
+  );
+  const blockVisibilityDescription = isBlockHidden ? (0, import_i18n.__)("Block is hidden.") : null;
   const hasSiblings = siblingBlockCount > 0;
   const hasRenderedMovers = showBlockMovers && hasSiblings;
-  const moverCellClassName = (0, _clsx.default)('block-editor-list-view-block__mover-cell', {
-    'is-visible': isHovered || isSelected
-  });
-  const listViewBlockSettingsClassName = (0, _clsx.default)('block-editor-list-view-block__menu-cell', {
-    'is-visible': isHovered || isFirstSelectedBlock
-  });
+  const moverCellClassName = (0, import_clsx.default)(
+    "block-editor-list-view-block__mover-cell",
+    { "is-visible": isHovered || isSelected }
+  );
+  const listViewBlockSettingsClassName = (0, import_clsx.default)(
+    "block-editor-list-view-block__menu-cell",
+    { "is-visible": isHovered || isFirstSelectedBlock }
+  );
   let colSpan;
   if (hasRenderedMovers) {
     colSpan = 2;
   } else if (!showBlockActions) {
     colSpan = 3;
   }
-  const classes = (0, _clsx.default)({
-    'is-selected': isSelected,
-    'is-first-selected': isFirstSelectedBlock,
-    'is-last-selected': isLastSelectedBlock,
-    'is-branch-selected': isBranchSelected,
-    'is-synced-branch': isSyncedBranch,
-    'is-dragging': isDragged,
-    'has-single-cell': !showBlockActions,
-    'is-synced': blockInformation?.isSynced,
-    'is-draggable': canMove,
-    'is-displacement-normal': displacement === 'normal',
-    'is-displacement-up': displacement === 'up',
-    'is-displacement-down': displacement === 'down',
-    'is-after-dragged-blocks': isAfterDraggedBlocks,
-    'is-nesting': isNesting
+  const classes = (0, import_clsx.default)({
+    "is-selected": isSelected,
+    "is-first-selected": isFirstSelectedBlock,
+    "is-last-selected": isLastSelectedBlock,
+    "is-branch-selected": isBranchSelected,
+    "is-synced-branch": isSyncedBranch,
+    "is-dragging": isDragged,
+    "has-single-cell": !showBlockActions,
+    "is-synced": blockInformation?.isSynced,
+    "is-draggable": canMove,
+    "is-displacement-normal": displacement === "normal",
+    "is-displacement-up": displacement === "up",
+    "is-displacement-down": displacement === "down",
+    "is-after-dragged-blocks": isAfterDraggedBlocks,
+    "is-nesting": isNesting
   });
-
-  // Only include all selected blocks if the currently clicked on block
-  // is one of the selected blocks. This ensures that if a user attempts
-  // to alter a block that isn't part of the selection, they're still able
-  // to do so.
   const dropdownClientIds = selectedClientIds.includes(clientId) ? selectedClientIds : [clientId];
-
-  // Detect if there is a block in the canvas currently being edited and multi-selection is not happening.
   const currentlyEditingBlockInCanvas = isSelected && selectedClientIds.length === 1;
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_leaf.default, {
-    className: classes,
-    isDragged: isDragged,
-    onKeyDown: onKeyDown,
-    onMouseEnter: onMouseEnter,
-    onMouseLeave: onMouseLeave,
-    onFocus: onMouseEnter,
-    onBlur: onMouseLeave,
-    level: level,
-    position: position,
-    rowCount: rowCount,
-    path: path,
-    id: `list-view-${listViewInstanceId}-block-${clientId}`,
-    "data-block": clientId,
-    "data-expanded": canEdit ? isExpanded : undefined,
-    ref: rowRef,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalTreeGridCell, {
-      className: "block-editor-list-view-block__contents-cell",
-      colSpan: colSpan,
-      ref: cellRef,
-      "aria-selected": !!isSelected,
-      children: ({
-        ref,
-        tabIndex,
-        onFocus
-      }) => /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: "block-editor-list-view-block__contents-container",
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockContents.default, {
-          block: block,
-          onClick: selectEditorBlock,
-          onContextMenu: onContextMenu,
-          onMouseDown: onMouseDown,
-          onToggleExpanded: toggleExpanded,
-          isSelected: isSelected,
-          position: position,
-          siblingBlockCount: siblingBlockCount,
-          level: level,
-          ref: ref,
-          tabIndex: currentlyEditingBlockInCanvas ? 0 : tabIndex,
-          onFocus: onFocus,
-          isExpanded: canEdit ? isExpanded : undefined,
-          selectedClientIds: selectedClientIds,
-          ariaDescribedBy: descriptionId
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_ariaReferencedText.default, {
-          id: descriptionId,
-          children: [blockPositionDescription, blockPropertiesDescription, blockVisibilityDescription].filter(Boolean).join(' ')
-        })]
-      })
-    }), hasRenderedMovers && /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
-      children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalTreeGridCell, {
-        className: moverCellClassName,
-        withoutGridItem: true,
-        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalTreeGridItem, {
-          children: ({
-            ref,
-            tabIndex,
-            onFocus
-          }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.BlockMoverUpButton, {
-            orientation: "vertical",
-            clientIds: [clientId],
-            ref: ref,
-            tabIndex: tabIndex,
-            onFocus: onFocus
-          })
-        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalTreeGridItem, {
-          children: ({
-            ref,
-            tabIndex,
-            onFocus
-          }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.BlockMoverDownButton, {
-            orientation: "vertical",
-            clientIds: [clientId],
-            ref: ref,
-            tabIndex: tabIndex,
-            onFocus: onFocus
-          })
-        })]
-      })
-    }), showBlockActions && BlockSettingsMenu && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalTreeGridCell, {
-      className: listViewBlockSettingsClassName,
-      "aria-selected": !!isSelected,
-      ref: settingsRef,
-      children: ({
-        ref,
-        tabIndex,
-        onFocus
-      }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockSettingsMenu, {
-        clientIds: dropdownClientIds,
-        block: block,
-        icon: _icons.moreVertical,
-        label: (0, _i18n.__)('Options'),
-        popoverProps: {
-          anchor: settingsPopoverAnchor // Used to position the settings at the cursor on right-click.
-        },
-        toggleProps: {
-          ref,
-          className: 'block-editor-list-view-block__menu',
-          tabIndex,
-          onClick: clearSettingsAnchorRect,
-          onFocus,
-          size: 'small'
-        },
-        disableOpenOnArrowDown: true,
-        expand: expand,
-        expandedState: expandedState,
-        setInsertedBlock: setInsertedBlock,
-        __experimentalSelectBlock: updateFocusAndSelection
-      })
-    })]
-  });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    import_leaf.default,
+    {
+      className: classes,
+      isDragged,
+      onKeyDown,
+      onMouseEnter,
+      onMouseLeave,
+      onFocus: onMouseEnter,
+      onBlur: onMouseLeave,
+      level,
+      position,
+      rowCount,
+      path,
+      id: `list-view-${listViewInstanceId}-block-${clientId}`,
+      "data-block": clientId,
+      "data-expanded": canEdit ? isExpanded : void 0,
+      ref: rowRef,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.__experimentalTreeGridCell,
+          {
+            className: "block-editor-list-view-block__contents-cell",
+            colSpan,
+            ref: cellRef,
+            "aria-selected": !!isSelected,
+            children: ({ ref, tabIndex, onFocus }) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "block-editor-list-view-block__contents-container", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_block_contents.default,
+                {
+                  block,
+                  onClick: selectEditorBlock,
+                  onContextMenu,
+                  onMouseDown,
+                  onToggleExpanded: toggleExpanded,
+                  isSelected,
+                  position,
+                  siblingBlockCount,
+                  level,
+                  ref,
+                  tabIndex: currentlyEditingBlockInCanvas ? 0 : tabIndex,
+                  onFocus,
+                  isExpanded: canEdit ? isExpanded : void 0,
+                  selectedClientIds,
+                  ariaDescribedBy: descriptionId
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_aria_referenced_text.default, { id: descriptionId, children: [
+                blockPositionDescription,
+                blockPropertiesDescription,
+                blockVisibilityDescription
+              ].filter(Boolean).join(" ") })
+            ] })
+          }
+        ),
+        hasRenderedMovers && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+          import_components.__experimentalTreeGridCell,
+          {
+            className: moverCellClassName,
+            withoutGridItem: true,
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalTreeGridItem, { children: ({ ref, tabIndex, onFocus }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_button.BlockMoverUpButton,
+                {
+                  orientation: "vertical",
+                  clientIds: [clientId],
+                  ref,
+                  tabIndex,
+                  onFocus
+                }
+              ) }),
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.__experimentalTreeGridItem, { children: ({ ref, tabIndex, onFocus }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                import_button.BlockMoverDownButton,
+                {
+                  orientation: "vertical",
+                  clientIds: [clientId],
+                  ref,
+                  tabIndex,
+                  onFocus
+                }
+              ) })
+            ]
+          }
+        ) }),
+        showBlockActions && BlockSettingsMenu && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_components.__experimentalTreeGridCell,
+          {
+            className: listViewBlockSettingsClassName,
+            "aria-selected": !!isSelected,
+            ref: settingsRef,
+            children: ({ ref, tabIndex, onFocus }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+              BlockSettingsMenu,
+              {
+                clientIds: dropdownClientIds,
+                block,
+                icon: import_icons.moreVertical,
+                label: (0, import_i18n.__)("Options"),
+                popoverProps: {
+                  anchor: settingsPopoverAnchor
+                  // Used to position the settings at the cursor on right-click.
+                },
+                toggleProps: {
+                  ref,
+                  className: "block-editor-list-view-block__menu",
+                  tabIndex,
+                  onClick: clearSettingsAnchorRect,
+                  onFocus,
+                  size: "small"
+                },
+                disableOpenOnArrowDown: true,
+                expand,
+                expandedState,
+                setInsertedBlock,
+                __experimentalSelectBlock: updateFocusAndSelection
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
 }
-var _default = exports.default = (0, _element.memo)(ListViewBlock);
-//# sourceMappingURL=block.js.map
+var block_default = (0, import_element.memo)(ListViewBlock);
+//# sourceMappingURL=block.js.map