UNPKG

@wordpress/block-library

Version:
168 lines (167 loc) 4.98 kB
// packages/block-library/src/columns/deprecated.js import clsx from "clsx"; import { createBlock } from "@wordpress/blocks"; import { InnerBlocks, getColorClassName } from "@wordpress/block-editor"; import { jsx } from "react/jsx-runtime"; function getDeprecatedLayoutColumn(originalContent) { let { doc } = getDeprecatedLayoutColumn; if (!doc) { doc = document.implementation.createHTMLDocument(""); getDeprecatedLayoutColumn.doc = doc; } let columnMatch; doc.body.innerHTML = originalContent; for (const classListItem of doc.body.firstChild.classList) { if (columnMatch = classListItem.match(/^layout-column-(\d+)$/)) { return Number(columnMatch[1]) - 1; } } } var migrateCustomColors = (attributes) => { if (!attributes.customTextColor && !attributes.customBackgroundColor) { return attributes; } const style = { color: {} }; if (attributes.customTextColor) { style.color.text = attributes.customTextColor; } if (attributes.customBackgroundColor) { style.color.background = attributes.customBackgroundColor; } const { customTextColor, customBackgroundColor, ...restAttributes } = attributes; return { ...restAttributes, style, isStackedOnMobile: true }; }; var deprecated_default = [ { attributes: { verticalAlignment: { type: "string" }, backgroundColor: { type: "string" }, customBackgroundColor: { type: "string" }, customTextColor: { type: "string" }, textColor: { type: "string" } }, migrate: migrateCustomColors, save({ attributes }) { const { verticalAlignment, backgroundColor, customBackgroundColor, textColor, customTextColor } = attributes; const backgroundClass = getColorClassName( "background-color", backgroundColor ); const textClass = getColorClassName("color", textColor); const className = clsx({ "has-background": backgroundColor || customBackgroundColor, "has-text-color": textColor || customTextColor, [backgroundClass]: backgroundClass, [textClass]: textClass, [`are-vertically-aligned-${verticalAlignment}`]: verticalAlignment }); const style = { backgroundColor: backgroundClass ? void 0 : customBackgroundColor, color: textClass ? void 0 : customTextColor }; return /* @__PURE__ */ jsx( "div", { className: className ? className : void 0, style, children: /* @__PURE__ */ jsx(InnerBlocks.Content, {}) } ); } }, { attributes: { columns: { type: "number", default: 2 } }, isEligible(attributes, innerBlocks) { const isFastPassEligible = innerBlocks.some( (innerBlock) => /layout-column-\d+/.test(innerBlock.originalContent) ); if (!isFastPassEligible) { return false; } return innerBlocks.some( (innerBlock) => getDeprecatedLayoutColumn(innerBlock.originalContent) !== void 0 ); }, migrate(attributes, innerBlocks) { const columns = innerBlocks.reduce((accumulator, innerBlock) => { const { originalContent } = innerBlock; let columnIndex = getDeprecatedLayoutColumn(originalContent); if (columnIndex === void 0) { columnIndex = 0; } if (!accumulator[columnIndex]) { accumulator[columnIndex] = []; } accumulator[columnIndex].push(innerBlock); return accumulator; }, []); const migratedInnerBlocks = columns.map( (columnBlocks) => createBlock("core/column", {}, columnBlocks) ); const { columns: ignoredColumns, ...restAttributes } = attributes; return [ { ...restAttributes, isStackedOnMobile: true }, migratedInnerBlocks ]; }, save({ attributes }) { const { columns } = attributes; return /* @__PURE__ */ jsx("div", { className: `has-${columns}-columns`, children: /* @__PURE__ */ jsx(InnerBlocks.Content, {}) }); } }, { attributes: { columns: { type: "number", default: 2 } }, migrate(attributes, innerBlocks) { const { columns, ...restAttributes } = attributes; attributes = { ...restAttributes, isStackedOnMobile: true }; return [attributes, innerBlocks]; }, save({ attributes }) { const { verticalAlignment, columns } = attributes; const wrapperClasses = clsx(`has-${columns}-columns`, { [`are-vertically-aligned-${verticalAlignment}`]: verticalAlignment }); return /* @__PURE__ */ jsx("div", { className: wrapperClasses, children: /* @__PURE__ */ jsx(InnerBlocks.Content, {}) }); } } ]; export { deprecated_default as default }; //# sourceMappingURL=deprecated.js.map