@wordpress/block-editor/build/components/block-tools/index.js

Generic block editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = BlockTools;

var _element = require("@wordpress/element");

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _data = require("@wordpress/data");

var _compose = require("@wordpress/compose");

var _components = require("@wordpress/components");

var _keyboardShortcuts = require("@wordpress/keyboard-shortcuts");

var _insertionPoint = _interopRequireWildcard(require("./insertion-point"));

var _selectedBlockPopover = _interopRequireDefault(require("./selected-block-popover"));

var _store = require("../../store");

var _blockContextualToolbar = _interopRequireDefault(require("./block-contextual-toolbar"));

var _usePopoverScroll = _interopRequireDefault(require("../block-popover/use-popover-scroll"));

var _zoomOutModeInserters = _interopRequireDefault(require("./zoom-out-mode-inserters"));

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
function selector(select) {
  const {
    __unstableGetEditorMode,
    getSettings,
    isTyping
  } = select(_store.store);
  return {
    isZoomOutMode: __unstableGetEditorMode() === 'zoom-out',
    hasFixedToolbar: getSettings().hasFixedToolbar,
    isTyping: isTyping()
  };
}
/**
 * Renders block tools (the block toolbar, select/navigation mode toolbar, the
 * insertion point and a slot for the inline rich text toolbar). Must be wrapped
 * around the block content and editor styles wrapper or iframe.
 *
 * @param {Object} $0                      Props.
 * @param {Object} $0.children             The block content and style container.
 * @param {Object} $0.__unstableContentRef Ref holding the content scroll container.
 */


function BlockTools({
  children,
  __unstableContentRef,
  ...props
}) {
  const isLargeViewport = (0, _compose.useViewportMatch)('medium');
  const {
    hasFixedToolbar,
    isZoomOutMode,
    isTyping
  } = (0, _data.useSelect)(selector, []);
  const isMatch = (0, _keyboardShortcuts.__unstableUseShortcutEventMatch)();
  const {
    getSelectedBlockClientIds,
    getBlockRootClientId
  } = (0, _data.useSelect)(_store.store);
  const {
    duplicateBlocks,
    removeBlocks,
    insertAfterBlock,
    insertBeforeBlock,
    clearSelectedBlock,
    moveBlocksUp,
    moveBlocksDown
  } = (0, _data.useDispatch)(_store.store);

  function onKeyDown(event) {
    if (event.defaultPrevented) return;

    if (isMatch('core/block-editor/move-up', event)) {
      const clientIds = getSelectedBlockClientIds();

      if (clientIds.length) {
        event.preventDefault();
        const rootClientId = getBlockRootClientId(clientIds[0]);
        moveBlocksUp(clientIds, rootClientId);
      }
    } else if (isMatch('core/block-editor/move-down', event)) {
      const clientIds = getSelectedBlockClientIds();

      if (clientIds.length) {
        event.preventDefault();
        const rootClientId = getBlockRootClientId(clientIds[0]);
        moveBlocksDown(clientIds, rootClientId);
      }
    } else if (isMatch('core/block-editor/duplicate', event)) {
      const clientIds = getSelectedBlockClientIds();

      if (clientIds.length) {
        event.preventDefault();
        duplicateBlocks(clientIds);
      }
    } else if (isMatch('core/block-editor/remove', event)) {
      const clientIds = getSelectedBlockClientIds();

      if (clientIds.length) {
        event.preventDefault();
        removeBlocks(clientIds);
      }
    } else if (isMatch('core/block-editor/insert-after', event)) {
      const clientIds = getSelectedBlockClientIds();

      if (clientIds.length) {
        event.preventDefault();
        insertAfterBlock(clientIds[clientIds.length - 1]);
      }
    } else if (isMatch('core/block-editor/insert-before', event)) {
      const clientIds = getSelectedBlockClientIds();

      if (clientIds.length) {
        event.preventDefault();
        insertBeforeBlock(clientIds[0]);
      }
    } else if (isMatch('core/block-editor/unselect', event)) {
      const clientIds = getSelectedBlockClientIds();

      if (clientIds.length) {
        event.preventDefault();
        clearSelectedBlock();
        event.target.ownerDocument.defaultView.getSelection().removeAllRanges();
        __unstableContentRef?.current.focus();
      }
    }
  }

  const blockToolbarRef = (0, _usePopoverScroll.default)(__unstableContentRef);
  const blockToolbarAfterRef = (0, _usePopoverScroll.default)(__unstableContentRef);
  return (// eslint-disable-next-line jsx-a11y/no-static-element-interactions
    (0, _element.createElement)("div", (0, _extends2.default)({}, props, {
      onKeyDown: onKeyDown
    }), (0, _element.createElement)(_insertionPoint.InsertionPointOpenRef.Provider, {
      value: (0, _element.useRef)(false)
    }, !isTyping && (0, _element.createElement)(_insertionPoint.default, {
      __unstableContentRef: __unstableContentRef
    }), !isZoomOutMode && (hasFixedToolbar || !isLargeViewport) && (0, _element.createElement)(_blockContextualToolbar.default, {
      isFixed: true
    }), (0, _element.createElement)(_selectedBlockPopover.default, {
      __unstableContentRef: __unstableContentRef
    }), (0, _element.createElement)(_components.Popover.Slot, {
      name: "block-toolbar",
      ref: blockToolbarRef
    }), children, (0, _element.createElement)(_components.Popover.Slot, {
      name: "__unstable-block-tools-after",
      ref: blockToolbarAfterRef
    }), isZoomOutMode && (0, _element.createElement)(_zoomOutModeInserters.default, {
      __unstableContentRef: __unstableContentRef
    })))
  );
}
//# sourceMappingURL=index.js.map