UNPKG

@wordpress/block-editor

Version:
164 lines (162 loc) 6.08 kB
"use strict"; var __create = Object.create; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __getProtoOf = Object.getPrototypeOf; 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 __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps( // If the importer is in node compatibility mode or this is not an ESM // file that has been converted to a CommonJS file using a Babel- // compatible transform (i.e. "__esModule" has not been set), then set // "default" to the CommonJS "module.exports" for node compatibility. isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod )); var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // packages/block-editor/src/hooks/align.js var align_exports = {}; __export(align_exports, { addAssignedAlign: () => addAssignedAlign, addAttribute: () => addAttribute, default: () => align_default, getValidAlignments: () => getValidAlignments }); module.exports = __toCommonJS(align_exports); var import_clsx = __toESM(require("clsx")); var import_hooks = require("@wordpress/hooks"); var import_blocks = require("@wordpress/blocks"); var import_components = require("../components"); var import_use_available_alignments = __toESM(require("../components/block-alignment-control/use-available-alignments")); var import_block_editing_mode = require("../components/block-editing-mode"); var import_jsx_runtime = require("react/jsx-runtime"); var ALL_ALIGNMENTS = ["left", "center", "right", "wide", "full"]; var WIDE_ALIGNMENTS = ["wide", "full"]; function getValidAlignments(blockAlign, hasWideBlockSupport = true, hasWideEnabled = true) { let validAlignments; if (Array.isArray(blockAlign)) { validAlignments = ALL_ALIGNMENTS.filter( (value) => blockAlign.includes(value) ); } else if (blockAlign === true) { validAlignments = [...ALL_ALIGNMENTS]; } else { validAlignments = []; } if (!hasWideEnabled || blockAlign === true && !hasWideBlockSupport) { return validAlignments.filter( (alignment) => !WIDE_ALIGNMENTS.includes(alignment) ); } return validAlignments; } function addAttribute(settings) { if ("type" in (settings.attributes?.align ?? {})) { return settings; } if ((0, import_blocks.hasBlockSupport)(settings, "align")) { settings.attributes = { ...settings.attributes, align: { type: "string", // Allow for '' since it is used by the `updateAlignment` function // in toolbar controls for special cases with defined default values. enum: [...ALL_ALIGNMENTS, ""] } }; } return settings; } function BlockEditAlignmentToolbarControlsPure({ name: blockName, align, setAttributes }) { const blockAllowedAlignments = getValidAlignments( (0, import_blocks.getBlockSupport)(blockName, "align"), (0, import_blocks.hasBlockSupport)(blockName, "alignWide", true) ); const validAlignments = (0, import_use_available_alignments.default)( blockAllowedAlignments ).map(({ name }) => name); const blockEditingMode = (0, import_block_editing_mode.useBlockEditingMode)(); if (!validAlignments.length || blockEditingMode !== "default") { return null; } const updateAlignment = (nextAlign) => { if (!nextAlign) { const blockType = (0, import_blocks.getBlockType)(blockName); const blockDefaultAlign = blockType?.attributes?.align?.default; if (blockDefaultAlign) { nextAlign = ""; } } setAttributes({ align: nextAlign }); }; return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.BlockControls, { group: "block", __experimentalShareWithChildBlocks: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)( import_components.BlockAlignmentControl, { value: align, onChange: updateAlignment, controls: validAlignments } ) }); } var align_default = { shareWithChildBlocks: true, edit: BlockEditAlignmentToolbarControlsPure, useBlockProps, addSaveProps: addAssignedAlign, attributeKeys: ["align"], hasSupport(name) { return (0, import_blocks.hasBlockSupport)(name, "align", false); } }; function useBlockProps({ name, align }) { const blockAllowedAlignments = getValidAlignments( (0, import_blocks.getBlockSupport)(name, "align"), (0, import_blocks.hasBlockSupport)(name, "alignWide", true) ); const validAlignments = (0, import_use_available_alignments.default)(blockAllowedAlignments); if (validAlignments.some((alignment) => alignment.name === align)) { return { "data-align": align }; } return {}; } function addAssignedAlign(props, blockType, attributes) { const { align } = attributes; const blockAlign = (0, import_blocks.getBlockSupport)(blockType, "align"); const hasWideBlockSupport = (0, import_blocks.hasBlockSupport)(blockType, "alignWide", true); const isAlignValid = getValidAlignments( blockAlign, hasWideBlockSupport ).includes(align); if (isAlignValid) { props.className = (0, import_clsx.default)(`align${align}`, props.className); } return props; } (0, import_hooks.addFilter)( "blocks.registerBlockType", "core/editor/align/addAttribute", addAttribute ); // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { addAssignedAlign, addAttribute, getValidAlignments }); //# sourceMappingURL=align.js.map