@wordpress/block-library
Version:
Block library for the WordPress editor.
156 lines (155 loc) • 4.52 kB
JavaScript
// packages/block-library/src/heading/transforms.js
import { createBlock, getBlockAttributes } from "@wordpress/blocks";
import { __, sprintf } from "@wordpress/i18n";
import { getLevelFromHeadingNodeName } from "./shared.mjs";
import { getTransformedAttributes } from "../utils/get-transformed-attributes.mjs";
var transforms = {
from: [
{
type: "block",
isMultiBlock: true,
blocks: ["core/paragraph"],
// The level shortcuts are declared here as well as on the
// variations, so that they reach a paragraph and not only a
// heading. Both declarations describe the same shortcut, and only
// one of them can apply to any given selection.
shortcuts: [1, 2, 3, 4, 5, 6].map((level) => ({
name: `core/block-editor/transform-to-heading-${level}`,
description: sprintf(
/* translators: %d: heading level e.g: "1", "2", "3" */
__("Transform the selected block into a heading %d."),
level
),
keyCombination: {
modifier: "access",
character: `${level}`
},
variationName: `h${level}`
})),
transform: (attributes) => attributes.map((_attributes) => {
const { content, anchor, style } = _attributes;
const textAlign = style?.typography?.textAlign;
return createBlock("core/heading", {
...getTransformedAttributes(
_attributes,
"core/heading",
({ content: contentBinding }) => ({
content: contentBinding
})
),
content,
anchor,
...textAlign && {
style: {
typography: {
textAlign
}
}
}
});
})
},
{
type: "raw",
selector: "h1,h2,h3,h4,h5,h6",
schema: ({ phrasingContentSchema, isPaste }) => {
const schema = {
children: phrasingContentSchema,
attributes: isPaste ? [] : ["style", "id"]
};
return {
h1: schema,
h2: schema,
h3: schema,
h4: schema,
h5: schema,
h6: schema
};
},
transform(node) {
const attributes = getBlockAttributes(
"core/heading",
node.outerHTML
);
const { textAlign } = node.style || {};
attributes.level = getLevelFromHeadingNodeName(node.nodeName);
if (textAlign === "left" || textAlign === "center" || textAlign === "right") {
attributes.style = {
...attributes.style,
typography: {
...attributes.style?.typography,
textAlign
}
};
}
return createBlock("core/heading", attributes);
}
},
...[1, 2, 3, 4, 5, 6].map((level) => ({
type: "prefix",
prefix: Array(level + 1).join("#"),
transform(content) {
return createBlock("core/heading", {
level,
content
});
}
})),
...[1, 2, 3, 4, 5, 6].map((level) => ({
type: "enter",
regExp: new RegExp(`^/(h|H)${level}$`),
transform: () => createBlock("core/heading", { level })
}))
],
to: [
{
type: "block",
isMultiBlock: true,
blocks: ["core/paragraph"],
shortcuts: [
{
name: "core/block-editor/transform-heading-to-paragraph",
description: __(
"Transform the selected heading into a paragraph."
),
keyCombination: {
modifier: "access",
character: "0"
},
aliases: [
{
modifier: "access",
character: "7"
}
]
}
],
transform: (attributes) => attributes.map((_attributes) => {
const { content, style } = _attributes;
const textAlign = style?.typography?.textAlign;
return createBlock("core/paragraph", {
...getTransformedAttributes(
_attributes,
"core/paragraph",
({ content: contentBinding }) => ({
content: contentBinding
})
),
content,
...textAlign && {
style: {
typography: {
textAlign
}
}
}
});
})
}
]
};
var transforms_default = transforms;
export {
transforms_default as default
};
//# sourceMappingURL=transforms.mjs.map