@gechiui/block-editor/build/components/block-variation-transforms/index.js

Generic block editor.

"use strict";

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

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

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

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

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

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

var _icons = require("@gechiui/icons");

var _utils = require("../../utils");

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

/**
 * GeChiUI dependencies
 */

/**
 * Internal dependencies
 */
function __experimentalBlockVariationTransforms(_ref) {
  let {
    blockClientId
  } = _ref;
  const [selectedValue, setSelectedValue] = (0, _element.useState)();
  const {
    updateBlockAttributes
  } = (0, _data.useDispatch)(_store.store);
  const {
    variations,
    blockAttributes
  } = (0, _data.useSelect)(select => {
    const {
      getBlockVariations
    } = select(_blocks.store);
    const {
      getBlockName,
      getBlockAttributes
    } = select(_store.store);
    const blockName = blockClientId && getBlockName(blockClientId);
    return {
      variations: blockName && getBlockVariations(blockName, 'transform'),
      blockAttributes: getBlockAttributes(blockClientId)
    };
  }, [blockClientId]);
  (0, _element.useEffect)(() => {
    var _getMatchingVariation;

    setSelectedValue((_getMatchingVariation = (0, _utils.__experimentalGetMatchingVariation)(blockAttributes, variations)) === null || _getMatchingVariation === void 0 ? void 0 : _getMatchingVariation.name);
  }, [blockAttributes, variations]);
  if (!(variations !== null && variations !== void 0 && variations.length)) return null;
  const selectOptions = variations.map(_ref2 => {
    let {
      name,
      title,
      description
    } = _ref2;
    return {
      value: name,
      label: title,
      info: description
    };
  });

  const onSelectVariation = variationName => {
    updateBlockAttributes(blockClientId, { ...variations.find(_ref3 => {
        let {
          name
        } = _ref3;
        return name === variationName;
      }).attributes
    });
  };

  const baseClass = 'block-editor-block-variation-transforms';
  return (0, _element.createElement)(_components.DropdownMenu, {
    className: baseClass,
    label: (0, _i18n.__)('转换变体'),
    text: (0, _i18n.__)('转换变体'),
    popoverProps: {
      position: 'bottom center',
      className: `${baseClass}__popover`
    },
    icon: _icons.chevronDown,
    toggleProps: {
      iconPosition: 'right'
    }
  }, () => (0, _element.createElement)("div", {
    className: `${baseClass}__container`
  }, (0, _element.createElement)(_components.MenuGroup, null, (0, _element.createElement)(_components.MenuItemsChoice, {
    choices: selectOptions,
    value: selectedValue,
    onSelect: onSelectVariation
  }))));
}

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