@wordpress/block-editor/build/components/inserter/pattern-panel.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 _classnames = _interopRequireDefault(require("classnames"));

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

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

/**
 * External dependencies
 */

/**
 * WordPress dependencies
 */
function PatternInserterPanel({
  selectedCategory,
  patternCategories,
  onClickCategory,
  children
}) {
  const categoryOptions = () => {
    const options = [];
    patternCategories.map(patternCategory => {
      return options.push({
        value: patternCategory.name,
        label: patternCategory.label
      });
    });
    return options;
  };

  const onChangeSelect = selected => {
    onClickCategory(patternCategories.find(patternCategory => selected === patternCategory.name));
  };

  const getPanelHeaderClassName = () => {
    return (0, _classnames.default)('block-editor-inserter__panel-header', 'block-editor-inserter__panel-header-patterns');
  }; // In iOS-based mobile devices, the onBlur will fire when selecting an option
  // from a Select element. To prevent closing the useDialog on iOS devices, we
  // stop propagating the onBlur event if there is no relatedTarget, which means
  // that the user most likely did not click on an element within the editor canvas.


  const onBlur = event => {
    if (!(event !== null && event !== void 0 && event.relatedTarget)) {
      event.stopPropagation();
    }
  };

  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)("div", {
    className: getPanelHeaderClassName()
  }, (0, _element.createElement)(_components.SelectControl, {
    className: "block-editor-inserter__panel-dropdown",
    label: (0, _i18n.__)('Filter patterns'),
    hideLabelFromVision: true,
    value: selectedCategory.name,
    onChange: onChangeSelect,
    onBlur: onBlur,
    options: categoryOptions()
  })), (0, _element.createElement)("div", {
    className: "block-editor-inserter__panel-content"
  }, children));
}

var _default = PatternInserterPanel;
exports.default = _default;
//# sourceMappingURL=pattern-panel.js.map