@wordpress/block-editor/build/components/block-tools/block-toolbar-popover.js

Generic block editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = BlockToolbarPopover;
var _clsx = _interopRequireDefault(require("clsx"));
var _data = require("@wordpress/data");
var _element = require("@wordpress/element");
var _keyboardShortcuts = require("@wordpress/keyboard-shortcuts");
var _blockPopover = require("../block-popover");
var _useBlockToolbarPopoverProps = _interopRequireDefault(require("./use-block-toolbar-popover-props"));
var _useSelectedBlockToolProps = _interopRequireDefault(require("./use-selected-block-tool-props"));
var _store = require("../../store");
var _blockToolbar = require("../block-toolbar");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

function BlockToolbarPopover({
  clientId,
  isTyping,
  __unstableContentRef
}) {
  const {
    capturingClientId,
    isInsertionPointVisible,
    lastClientId
  } = (0, _useSelectedBlockToolProps.default)(clientId);

  // Stores the active toolbar item index so the block toolbar can return focus
  // to it when re-mounting.
  const initialToolbarItemIndexRef = (0, _element.useRef)();
  (0, _element.useEffect)(() => {
    // Resets the index whenever the active block changes so this is not
    // persisted. See https://github.com/WordPress/gutenberg/pull/25760#issuecomment-717906169
    initialToolbarItemIndexRef.current = undefined;
  }, [clientId]);
  const {
    stopTyping
  } = (0, _data.useDispatch)(_store.store);
  const isToolbarForcedRef = (0, _element.useRef)(false);
  (0, _keyboardShortcuts.useShortcut)('core/block-editor/focus-toolbar', () => {
    isToolbarForcedRef.current = true;
    stopTyping(true);
  });
  (0, _element.useEffect)(() => {
    isToolbarForcedRef.current = false;
  });

  // If the block has a parent with __experimentalCaptureToolbars enabled,
  // the toolbar should be positioned over the topmost capturing parent.
  const clientIdToPositionOver = capturingClientId || clientId;
  const popoverProps = (0, _useBlockToolbarPopoverProps.default)({
    contentElement: __unstableContentRef?.current,
    clientId: clientIdToPositionOver
  });
  return !isTyping && /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockPopover.PrivateBlockPopover, {
    clientId: clientIdToPositionOver,
    bottomClientId: lastClientId,
    className: (0, _clsx.default)('block-editor-block-list__block-popover', {
      'is-insertion-point-visible': isInsertionPointVisible
    }),
    resize: false,
    ...popoverProps,
    __unstableContentRef: __unstableContentRef,
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockToolbar.PrivateBlockToolbar
    // If the toolbar is being shown because of being forced
    // it should focus the toolbar right after the mount.
    , {
      focusOnMount: isToolbarForcedRef.current,
      __experimentalInitialIndex: initialToolbarItemIndexRef.current,
      __experimentalOnIndexChange: index => {
        initialToolbarItemIndexRef.current = index;
      },
      variant: "toolbar"
    })
  });
}
//# sourceMappingURL=block-toolbar-popover.js.map