"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
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 _multiSelectionInspector = _interopRequireDefault(require("../multi-selection-inspector"));
var _blockVariationTransforms = _interopRequireDefault(require("../block-variation-transforms"));
var _useBlockDisplayInformation = _interopRequireDefault(require("../use-block-display-information"));
var _store = require("../../store");
var _blockStyles = _interopRequireDefault(require("../block-styles"));
var _inspectorControls = _interopRequireDefault(require("../inspector-controls"));
var _inspectorControlsTabs = _interopRequireDefault(require("../inspector-controls-tabs"));
var _useInspectorControlsTabs = _interopRequireDefault(require("../inspector-controls-tabs/use-inspector-controls-tabs"));
var _advancedControlsPanel = _interopRequireDefault(require("../inspector-controls-tabs/advanced-controls-panel"));
var _positionControlsPanel = _interopRequireDefault(require("../inspector-controls-tabs/position-controls-panel"));
var _useBlockInspectorAnimationSettings = _interopRequireDefault(require("./useBlockInspectorAnimationSettings"));
var _blockInfoSlotFill = _interopRequireDefault(require("../block-info-slot-fill"));
var _blockQuickNavigation = _interopRequireDefault(require("../block-quick-navigation"));
var _border = require("../../hooks/border");
var _lockUnlock = require("../../lock-unlock");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

function BlockInspectorLockedBlocks({
  topLevelLockedBlock
}) {
  const contentClientIds = (0, _data.useSelect)(select => {
    const {
      getClientIdsOfDescendants,
      getBlockName,
      getBlockEditingMode
    } = select(_store.store);
    return getClientIdsOfDescendants(topLevelLockedBlock).filter(clientId => getBlockName(clientId) !== 'core/list-item' && getBlockEditingMode(clientId) === 'contentOnly');
  }, [topLevelLockedBlock]);
  const blockInformation = (0, _useBlockDisplayInformation.default)(topLevelLockedBlock);
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: "block-editor-block-inspector",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockCard.default, {
      ...blockInformation,
      className: blockInformation.isSynced && 'is-synced'
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockVariationTransforms.default, {
      blockClientId: topLevelLockedBlock
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockInfoSlotFill.default.Slot, {}), contentClientIds.length > 0 && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.PanelBody, {
      title: (0, _i18n.__)('Content'),
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockQuickNavigation.default, {
        clientIds: contentClientIds
      })
    })]
  });
}
const BlockInspector = ({
  showNoBlockSelectedMessage = true
}) => {
  const {
    count,
    selectedBlockName,
    selectedBlockClientId,
    blockType,
    topLevelLockedBlock
  } = (0, _data.useSelect)(select => {
    const {
      getSelectedBlockClientId,
      getSelectedBlockCount,
      getBlockName,
      getContentLockingParent,
      getTemplateLock
    } = (0, _lockUnlock.unlock)(select(_store.store));
    const _selectedBlockClientId = getSelectedBlockClientId();
    const _selectedBlockName = _selectedBlockClientId && getBlockName(_selectedBlockClientId);
    const _blockType = _selectedBlockName && (0, _blocks.getBlockType)(_selectedBlockName);
    return {
      count: getSelectedBlockCount(),
      selectedBlockClientId: _selectedBlockClientId,
      selectedBlockName: _selectedBlockName,
      blockType: _blockType,
      topLevelLockedBlock: getContentLockingParent(_selectedBlockClientId) || (getTemplateLock(_selectedBlockClientId) === 'contentOnly' || _selectedBlockName === 'core/block' ? _selectedBlockClientId : undefined)
    };
  }, []);
  const availableTabs = (0, _useInspectorControlsTabs.default)(blockType?.name);
  const showTabs = availableTabs?.length > 1;

  // The block inspector animation settings will be completely
  // removed in the future to create an API which allows the block
  // inspector to transition between what it
  // displays based on the relationship between the selected block
  // and its parent, and only enable it if the parent is controlling
  // its children blocks.
  const blockInspectorAnimationSettings = (0, _useBlockInspectorAnimationSettings.default)(blockType);
  const borderPanelLabel = (0, _border.useBorderPanelLabel)({
    blockName: selectedBlockName
  });
  if (count > 1) {
    return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
      className: "block-editor-block-inspector",
      children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_multiSelectionInspector.default, {}), showTabs ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControlsTabs.default, {
        tabs: availableTabs
      }) : /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
        children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
          group: "color",
          label: (0, _i18n.__)('Color'),
          className: "color-block-support-panel__inner-wrapper"
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
          group: "background",
          label: (0, _i18n.__)('Background image')
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
          group: "typography",
          label: (0, _i18n.__)('Typography')
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
          group: "dimensions",
          label: (0, _i18n.__)('Dimensions')
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
          group: "border",
          label: borderPanelLabel
        }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
          group: "styles"
        })]
      })]
    });
  }
  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 /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
        className: "block-editor-block-inspector__no-blocks",
        children: (0, _i18n.__)('No block selected.')
      });
    }
    return null;
  }
  if (topLevelLockedBlock) {
    return /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockInspectorLockedBlocks, {
      topLevelLockedBlock: topLevelLockedBlock
    });
  }
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockInspectorSingleBlockWrapper, {
    animate: blockInspectorAnimationSettings,
    wrapper: children => /*#__PURE__*/(0, _jsxRuntime.jsx)(AnimatedContainer, {
      blockInspectorAnimationSettings: blockInspectorAnimationSettings,
      selectedBlockClientId: selectedBlockClientId,
      children: children
    }),
    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(BlockInspectorSingleBlock, {
      clientId: selectedBlockClientId,
      blockName: blockType.name
    })
  });
};
const BlockInspectorSingleBlockWrapper = ({
  animate,
  wrapper,
  children
}) => {
  return animate ? wrapper(children) : children;
};
const AnimatedContainer = ({
  blockInspectorAnimationSettings,
  selectedBlockClientId,
  children
}) => {
  const animationOrigin = blockInspectorAnimationSettings && blockInspectorAnimationSettings.enterDirection === 'leftToRight' ? -50 : 50;
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__unstableMotion.div, {
    animate: {
      x: 0,
      opacity: 1,
      transition: {
        ease: 'easeInOut',
        duration: 0.14
      }
    },
    initial: {
      x: animationOrigin,
      opacity: 0
    },
    children: children
  }, selectedBlockClientId);
};
const BlockInspectorSingleBlock = ({
  clientId,
  blockName
}) => {
  const availableTabs = (0, _useInspectorControlsTabs.default)(blockName);
  const showTabs = availableTabs?.length > 1;
  const hasBlockStyles = (0, _data.useSelect)(select => {
    const {
      getBlockStyles
    } = select(_blocks.store);
    const blockStyles = getBlockStyles(blockName);
    return blockStyles && blockStyles.length > 0;
  }, [blockName]);
  const blockInformation = (0, _useBlockDisplayInformation.default)(clientId);
  const borderPanelLabel = (0, _border.useBorderPanelLabel)({
    blockName
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: "block-editor-block-inspector",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockCard.default, {
      ...blockInformation,
      className: blockInformation.isSynced && 'is-synced'
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockVariationTransforms.default, {
      blockClientId: clientId
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockInfoSlotFill.default.Slot, {}), showTabs && /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControlsTabs.default, {
      hasBlockStyles: hasBlockStyles,
      clientId: clientId,
      blockName: blockName,
      tabs: availableTabs
    }), !showTabs && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
      children: [hasBlockStyles && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.PanelBody, {
          title: (0, _i18n.__)('Styles'),
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockStyles.default, {
            clientId: clientId
          })
        })
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
        group: "list"
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
        group: "color",
        label: (0, _i18n.__)('Color'),
        className: "color-block-support-panel__inner-wrapper"
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
        group: "background",
        label: (0, _i18n.__)('Background image')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
        group: "typography",
        label: (0, _i18n.__)('Typography')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
        group: "dimensions",
        label: (0, _i18n.__)('Dimensions')
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
        group: "border",
        label: borderPanelLabel
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_inspectorControls.default.Slot, {
        group: "styles"
      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_positionControlsPanel.default, {}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_advancedControlsPanel.default, {})
      })]
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_skipToSelectedBlock.default, {}, "back")]
  });
};

/**
 * @see https://github.com/WordPress/gutenberg/blob/HEAD/packages/block-editor/src/components/block-inspector/README.md
 */
var _default = exports.default = BlockInspector;
//# sourceMappingURL=index.js.map