@wordpress/block-editor/build-module/components/spacing-sizes-control/sides-dropdown/index.js

Generic block editor.

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

/**
 * WordPress dependencies
 */
import { DropdownMenu, Icon, MenuGroup, MenuItem } from '@wordpress/components';
import { check } from '@wordpress/icons';
/**
 * Internal dependencies
 */

import { getSupportedMenuItems, VIEWS } from '../utils';
const checkIcon = createElement(Icon, {
  icon: check,
  size: 24
});
export default function SidesDropdown({
  label: labelProp,
  onChange,
  sides,
  value
}) {
  if (!sides || !sides.length) {
    return;
  }

  const supportedItems = getSupportedMenuItems(sides);
  const sideIcon = supportedItems[value].icon;
  const {
    custom: customItem,
    ...menuItems
  } = supportedItems;
  return createElement(DropdownMenu, {
    icon: sideIcon,
    label: labelProp,
    className: "spacing-sizes-control__dropdown",
    toggleProps: {
      isSmall: true
    }
  }, ({
    onClose
  }) => {
    return createElement(Fragment, null, createElement(MenuGroup, null, Object.entries(menuItems).map(([slug, {
      label,
      icon
    }]) => {
      const isSelected = value === slug;
      return createElement(MenuItem, {
        key: slug,
        icon: icon,
        iconPosition: "left",
        isSelected: isSelected,
        role: "menuitemradio",
        onClick: () => {
          onChange(slug);
          onClose();
        },
        suffix: isSelected ? checkIcon : undefined
      }, label);
    })), !!customItem && createElement(MenuGroup, null, createElement(MenuItem, {
      icon: customItem.icon,
      iconPosition: "left",
      isSelected: value === VIEWS.custom,
      role: "menuitemradio",
      onClick: () => {
        onChange(VIEWS.custom);
        onClose();
      },
      suffix: value === VIEWS.custom ? checkIcon : undefined
    }, customItem.label)));
  });
}
//# sourceMappingURL=index.js.map