@wordpress/block-editor/build/components/block-heading-level-dropdown/index.js

Generic block editor.

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = HeadingLevelDropdown;
var _components = require("@wordpress/components");
var _i18n = require("@wordpress/i18n");
var _headingLevelIcon = _interopRequireDefault(require("./heading-level-icon"));
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const HEADING_LEVELS = [1, 2, 3, 4, 5, 6];
const POPOVER_PROPS = {
  className: 'block-library-heading-level-dropdown'
};

/** @typedef {import('react').ComponentType} ComponentType */

/**
 * HeadingLevelDropdown props.
 *
 * @typedef WPHeadingLevelDropdownProps
 *
 * @property {number}     value    The chosen heading level.
 * @property {number[]}   options  An array of supported heading levels.
 * @property {()=>number} onChange Function called with
 *                                 the selected value changes.
 */

/**
 * Dropdown for selecting a heading level (1 through 6) or paragraph (0).
 *
 * @param {WPHeadingLevelDropdownProps} props Component props.
 *
 * @return {ComponentType} The toolbar.
 */
function HeadingLevelDropdown({
  options = HEADING_LEVELS,
  value,
  onChange
}) {
  const validOptions = options.filter(option => option === 0 || HEADING_LEVELS.includes(option)).sort((a, b) => a - b); // Sorts numerically in ascending order;

  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToolbarDropdownMenu, {
    popoverProps: POPOVER_PROPS,
    icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_headingLevelIcon.default, {
      level: value
    }),
    label: (0, _i18n.__)('Change level'),
    controls: validOptions.map(targetLevel => {
      const isActive = targetLevel === value;
      return {
        icon: /*#__PURE__*/(0, _jsxRuntime.jsx)(_headingLevelIcon.default, {
          level: targetLevel
        }),
        title: targetLevel === 0 ? (0, _i18n.__)('Paragraph') : (0, _i18n.sprintf)(
        // translators: %d: heading level e.g: "1", "2", "3"
        (0, _i18n.__)('Heading %d'), targetLevel),
        isActive,
        onClick() {
          onChange(targetLevel);
        },
        role: 'menuitemradio'
      };
    })
  });
}
//# sourceMappingURL=index.js.map