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

Generic block editor.

import { createElement, Fragment } from "@wordpress/element";

/**
 * WordPress dependencies
 */
import { ToolbarButton, DuotoneSwatch } from '@wordpress/components';
import { useState } from '@wordpress/element';
import { __ } from '@wordpress/i18n';
import { DOWN } from '@wordpress/keycodes';
/**
 * Internal dependencies
 */

import DuotonePickerPopover from './duotone-picker-popover';

function DuotoneControl({
  colorPalette,
  duotonePalette,
  value,
  onChange
}) {
  const [isOpen, setIsOpen] = useState(false);

  const onToggle = () => {
    setIsOpen(prev => !prev);
  };

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

  return createElement(Fragment, null, createElement(ToolbarButton, {
    showTooltip: true,
    onClick: onToggle,
    "aria-haspopup": "true",
    "aria-expanded": isOpen,
    onKeyDown: openOnArrowDown,
    label: __('Apply duotone filter'),
    icon: createElement(DuotoneSwatch, {
      values: value
    })
  }), isOpen && createElement(DuotonePickerPopover, {
    value: value,
    onChange: onChange,
    onToggle: onToggle,
    duotonePalette: duotonePalette,
    colorPalette: colorPalette
  }));
}

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