@wordpress/block-editor/build/components/block-list/use-block-props/use-block-class-names.js

Generic block editor.

"use strict";

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

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

var _classnames = _interopRequireDefault(require("classnames"));

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

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

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

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

/**
 * Returns the class names used for the different states of the block.
 *
 * @param {string} clientId The block client ID.
 *
 * @return {string} The class names.
 */
function useBlockClassNames(clientId) {
  return (0, _data.useSelect)(select => {
    const {
      isBlockBeingDragged,
      isBlockHighlighted,
      isBlockSelected,
      isBlockMultiSelected,
      getBlockName,
      getSettings,
      hasSelectedInnerBlock,
      __experimentalGetActiveBlockIdByBlockNames: getActiveBlockIdByBlockNames
    } = select(_store.store);
    const {
      __experimentalSpotlightEntityBlocks: spotlightEntityBlocks
    } = getSettings();
    const isDragging = isBlockBeingDragged(clientId);
    const isSelected = isBlockSelected(clientId);
    const name = getBlockName(clientId);
    const checkDeep = true; // "ancestor" is the more appropriate label due to "deep" check

    const isAncestorOfSelectedBlock = hasSelectedInnerBlock(clientId, checkDeep);
    const activeEntityBlockId = getActiveBlockIdByBlockNames(spotlightEntityBlocks);
    return (0, _classnames.default)('block-editor-block-list__block', {
      'is-selected': isSelected,
      'is-highlighted': isBlockHighlighted(clientId),
      'is-multi-selected': isBlockMultiSelected(clientId),
      'is-reusable': (0, _blocks.isReusableBlock)((0, _blocks.getBlockType)(name)),
      'is-dragging': isDragging,
      'has-child-selected': isAncestorOfSelectedBlock,
      'has-active-entity': activeEntityBlockId,
      // Determine if there is an active entity area to spotlight.
      'is-active-entity': activeEntityBlockId === clientId
    });
  }, [clientId]);
}
//# sourceMappingURL=use-block-class-names.js.map