UNPKG

@wordpress/block-editor

Version:
90 lines (88 loc) 3.23 kB
"use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // packages/block-editor/src/components/block-vertical-alignment-control/ui.js var ui_exports = {}; __export(ui_exports, { default: () => ui_default }); module.exports = __toCommonJS(ui_exports); var import_i18n = require("@wordpress/i18n"); var import_components = require("@wordpress/components"); var import_icons = require("@wordpress/icons"); var import_jsx_runtime = require("react/jsx-runtime"); var BLOCK_ALIGNMENTS_CONTROLS = { top: { icon: import_icons.justifyTop, title: (0, import_i18n._x)("Align top", "Block vertical alignment setting") }, center: { icon: import_icons.justifyCenterVertical, title: (0, import_i18n._x)("Align middle", "Block vertical alignment setting") }, bottom: { icon: import_icons.justifyBottom, title: (0, import_i18n._x)("Align bottom", "Block vertical alignment setting") }, stretch: { icon: import_icons.justifyStretchVertical, title: (0, import_i18n._x)("Stretch to fill", "Block vertical alignment setting") }, "space-between": { icon: import_icons.justifySpaceBetweenVertical, title: (0, import_i18n._x)("Space between", "Block vertical alignment setting") } }; var DEFAULT_CONTROLS = ["top", "center", "bottom"]; var DEFAULT_CONTROL = "top"; function BlockVerticalAlignmentUI({ value, onChange, controls = DEFAULT_CONTROLS, isCollapsed = true, isToolbar }) { function applyOrUnset(align) { return () => onChange(value === align ? void 0 : align); } const activeAlignment = BLOCK_ALIGNMENTS_CONTROLS[value]; const defaultAlignmentControl = BLOCK_ALIGNMENTS_CONTROLS[DEFAULT_CONTROL]; const UIComponent = isToolbar ? import_components.ToolbarGroup : import_components.ToolbarDropdownMenu; const extraProps = isToolbar ? { isCollapsed } : {}; return /* @__PURE__ */ (0, import_jsx_runtime.jsx)( UIComponent, { icon: activeAlignment ? activeAlignment.icon : defaultAlignmentControl.icon, label: (0, import_i18n._x)( "Change vertical alignment", "Block vertical alignment setting label" ), controls: controls.map((control) => { return { ...BLOCK_ALIGNMENTS_CONTROLS[control], isActive: value === control, role: isCollapsed ? "menuitemradio" : void 0, onClick: applyOrUnset(control) }; }), ...extraProps } ); } var ui_default = BlockVerticalAlignmentUI; //# sourceMappingURL=ui.js.map