@wordpress/block-editor/build-module/components/block-switcher/block-transformations-menu.js

Generic block editor.

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

/**
 * WordPress dependencies
 */
import { __ } from '@wordpress/i18n';
import { MenuGroup, MenuItem } from '@wordpress/components';
import { getBlockMenuDefaultClassName, switchToBlockType } from '@wordpress/blocks';
import { useState } from '@wordpress/element';
/**
 * Internal dependencies
 */

import BlockIcon from '../block-icon';
import PreviewBlockPopover from './preview-block-popover';

const BlockTransformationsMenu = ({
  className,
  possibleBlockTransformations,
  onSelect,
  blocks
}) => {
  const [hoveredTransformItemName, setHoveredTransformItemName] = useState();
  return createElement(MenuGroup, {
    label: __('Transform to'),
    className: className
  }, hoveredTransformItemName && createElement(PreviewBlockPopover, {
    blocks: switchToBlockType(blocks, hoveredTransformItemName)
  }), possibleBlockTransformations.map(item => {
    const {
      name,
      icon,
      title,
      isDisabled
    } = item;
    return createElement(MenuItem, {
      key: name,
      className: getBlockMenuDefaultClassName(name),
      onClick: event => {
        event.preventDefault();
        onSelect(name);
      },
      disabled: isDisabled,
      onMouseLeave: () => setHoveredTransformItemName(null),
      onMouseEnter: () => setHoveredTransformItemName(name)
    }, createElement(BlockIcon, {
      icon: icon,
      showColors: true
    }), title);
  }));
};

export default BlockTransformationsMenu;
//# sourceMappingURL=block-transformations-menu.js.map