@gechiui/block-editor/build-module/components/duotone-control/index.js

Generic block editor.

import { createElement } from "@gechiui/element";

/**
 * GeChiUI dependencies
 */
import { Dropdown, DuotonePicker, DuotoneSwatch, MenuGroup, ToolbarButton } from '@gechiui/components';
import { __ } from '@gechiui/i18n';
import { DOWN } from '@gechiui/keycodes';

function DuotoneControl(_ref) {
  let {
    colorPalette,
    duotonePalette,
    disableCustomColors,
    disableCustomDuotone,
    value,
    onChange
  } = _ref;
  return createElement(Dropdown, {
    popoverProps: {
      className: 'block-editor-duotone-control__popover',
      headerTitle: __('双色'),
      isAlternate: true
    },
    renderToggle: _ref2 => {
      let {
        isOpen,
        onToggle
      } = _ref2;

      const openOnArrowDown = event => {
        if (!isOpen && event.keyCode === DOWN) {
          event.preventDefault();
          onToggle();
        }
      };

      return createElement(ToolbarButton, {
        showTooltip: true,
        onClick: onToggle,
        "aria-haspopup": "true",
        "aria-expanded": isOpen,
        onKeyDown: openOnArrowDown,
        label: __('应用双色过滤器'),
        icon: createElement(DuotoneSwatch, {
          values: value
        })
      });
    },
    renderContent: () => createElement(MenuGroup, {
      label: __('双色')
    }, createElement("div", {
      className: "block-editor-duotone-control__description"
    }, __('在不丢失原始图像的情况下创建双色调效果。')), createElement(DuotonePicker, {
      colorPalette: colorPalette,
      duotonePalette: duotonePalette,
      disableCustomColors: disableCustomColors,
      disableCustomDuotone: disableCustomDuotone,
      value: value,
      onChange: onChange
    }))
  });
}

export default DuotoneControl;
//# sourceMappingURL=index.js.map