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

Generic block editor.

"use strict";

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

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

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

var _i18n = require("@wordpress/i18n");

var _blocks = require("@wordpress/blocks");

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

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

var _skipToSelectedBlock = _interopRequireDefault(require("../skip-to-selected-block"));

var _blockCard = _interopRequireDefault(require("../block-card"));

var _inspectorControls = _interopRequireDefault(require("../inspector-controls"));

var _inspectorAdvancedControls = _interopRequireDefault(require("../inspector-advanced-controls"));

var _blockStyles = _interopRequireDefault(require("../block-styles"));

var _multiSelectionInspector = _interopRequireDefault(require("../multi-selection-inspector"));

var _defaultStylePicker = _interopRequireDefault(require("../default-style-picker"));

var _blockVariationTransforms = _interopRequireDefault(require("../block-variation-transforms"));

var _useBlockDisplayInformation = _interopRequireDefault(require("../use-block-display-information"));

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

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */
const BlockInspector = ({
  showNoBlockSelectedMessage = true,
  bubblesVirtually = true
}) => {
  const {
    count,
    hasBlockStyles,
    selectedBlockName,
    selectedBlockClientId,
    blockType
  } = (0, _data.useSelect)(select => {
    const {
      getSelectedBlockClientId,
      getSelectedBlockCount,
      getBlockName
    } = select(_store.store);
    const {
      getBlockStyles
    } = select(_blocks.store);

    const _selectedBlockClientId = getSelectedBlockClientId();

    const _selectedBlockName = _selectedBlockClientId && getBlockName(_selectedBlockClientId);

    const _blockType = _selectedBlockName && (0, _blocks.getBlockType)(_selectedBlockName);

    const blockStyles = _selectedBlockName && getBlockStyles(_selectedBlockName);

    return {
      count: getSelectedBlockCount(),
      selectedBlockClientId: _selectedBlockClientId,
      selectedBlockName: _selectedBlockName,
      blockType: _blockType,
      hasBlockStyles: blockStyles && blockStyles.length > 0
    };
  }, []);

  if (count > 1) {
    return (0, _element.createElement)("div", {
      className: "block-editor-block-inspector"
    }, (0, _element.createElement)(_multiSelectionInspector.default, null), (0, _element.createElement)(_inspectorControls.default.Slot, {
      bubblesVirtually: bubblesVirtually
    }));
  }

  const isSelectedBlockUnregistered = selectedBlockName === (0, _blocks.getUnregisteredTypeHandlerName)();
  /*
   * If the selected block is of an unregistered type, avoid showing it as an actual selection
   * because we want the user to focus on the unregistered block warning, not block settings.
   */

  if (!blockType || !selectedBlockClientId || isSelectedBlockUnregistered) {
    if (showNoBlockSelectedMessage) {
      return (0, _element.createElement)("span", {
        className: "block-editor-block-inspector__no-blocks"
      }, (0, _i18n.__)('No block selected.'));
    }

    return null;
  }

  return (0, _element.createElement)(BlockInspectorSingleBlock, {
    clientId: selectedBlockClientId,
    blockName: blockType.name,
    hasBlockStyles: hasBlockStyles,
    bubblesVirtually: bubblesVirtually
  });
};

const BlockInspectorSingleBlock = ({
  clientId,
  blockName,
  hasBlockStyles,
  bubblesVirtually
}) => {
  const blockInformation = (0, _useBlockDisplayInformation.default)(clientId);
  return (0, _element.createElement)("div", {
    className: "block-editor-block-inspector"
  }, (0, _element.createElement)(_blockCard.default, blockInformation), (0, _element.createElement)(_blockVariationTransforms.default, {
    blockClientId: clientId
  }), hasBlockStyles && (0, _element.createElement)("div", null, (0, _element.createElement)(_components.PanelBody, {
    title: (0, _i18n.__)('Styles')
  }, (0, _element.createElement)(_blockStyles.default, {
    clientId: clientId
  }), (0, _blocks.hasBlockSupport)(blockName, 'defaultStylePicker', true) && (0, _element.createElement)(_defaultStylePicker.default, {
    blockName: blockName
  }))), (0, _element.createElement)(_inspectorControls.default.Slot, {
    bubblesVirtually: bubblesVirtually
  }), (0, _element.createElement)("div", null, (0, _element.createElement)(AdvancedControls, {
    slotName: _inspectorAdvancedControls.default.slotName,
    bubblesVirtually: bubblesVirtually
  })), (0, _element.createElement)(_skipToSelectedBlock.default, {
    key: "back"
  }));
};

const AdvancedControls = ({
  slotName,
  bubblesVirtually
}) => {
  const slot = (0, _components.__experimentalUseSlot)(slotName);
  const hasFills = Boolean(slot.fills && slot.fills.length);

  if (!hasFills) {
    return null;
  }

  return (0, _element.createElement)(_components.PanelBody, {
    className: "block-editor-block-inspector__advanced",
    title: (0, _i18n.__)('Advanced'),
    initialOpen: false
  }, (0, _element.createElement)(_inspectorAdvancedControls.default.Slot, {
    bubblesVirtually: bubblesVirtually
  }));
};

var _default = BlockInspector;
exports.default = _default;
//# sourceMappingURL=index.js.map