@wordpress/block-library
Version:
Block library for the WordPress editor.
113 lines (112 loc) • 3.4 kB
JavaScript
// packages/block-library/src/quote/edit.js
import clsx from "clsx";
import { __ } from "@wordpress/i18n";
import {
AlignmentControl,
BlockControls,
useBlockProps,
useInnerBlocksProps,
store as blockEditorStore
} from "@wordpress/block-editor";
import { BlockQuotation } from "@wordpress/components";
import { useDispatch, useRegistry, useSelect } from "@wordpress/data";
import { useEffect } from "@wordpress/element";
import deprecated from "@wordpress/deprecated";
import { verse } from "@wordpress/icons";
import { migrateToQuoteV2 } from "./deprecated.mjs";
import { Caption } from "../utils/caption.mjs";
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
var useMigrateOnLoad = (attributes, clientId) => {
const registry = useRegistry();
const { updateBlockAttributes, replaceInnerBlocks, selectBlock } = useDispatch(blockEditorStore);
useEffect(() => {
if (!attributes.value) {
return;
}
const [newAttributes, newInnerBlocks] = migrateToQuoteV2(attributes);
deprecated("Value attribute on the quote block", {
since: "6.0",
version: "6.5",
alternative: "inner blocks"
});
const shouldReselectBlock = registry.select(blockEditorStore).hasSelectedInnerBlock(clientId, true);
registry.batch(() => {
updateBlockAttributes(clientId, newAttributes);
replaceInnerBlocks(clientId, newInnerBlocks);
if (shouldReselectBlock) {
selectBlock(clientId);
}
});
}, [attributes.value]);
};
function QuoteEdit({
attributes,
setAttributes,
insertBlocksAfter,
clientId,
className,
isSelected
}) {
const { textAlign, allowedBlocks } = attributes;
const { hasInnerBlocks } = useSelect(
(select) => {
const { getBlockCount } = select(blockEditorStore);
return {
hasInnerBlocks: getBlockCount(clientId) > 0
};
},
[clientId]
);
useMigrateOnLoad(attributes, clientId);
const blockProps = useBlockProps({
className: clsx(className, {
[`has-text-align-${textAlign}`]: textAlign
})
});
const innerBlocksProps = useInnerBlocksProps(blockProps, {
__experimentalCaptureToolbars: true,
renderAppender: hasInnerBlocks ? false : void 0,
allowedBlocks
});
return /* @__PURE__ */ jsxs(Fragment, { children: [
/* @__PURE__ */ jsx(BlockControls, { group: "block", children: /* @__PURE__ */ jsx(
AlignmentControl,
{
value: textAlign,
onChange: (nextAlign) => {
setAttributes({ textAlign: nextAlign });
}
}
) }),
/* @__PURE__ */ jsxs(BlockQuotation, { ...innerBlocksProps, children: [
innerBlocksProps.children,
/* @__PURE__ */ jsx(
Caption,
{
attributeKey: "citation",
tagName: "cite",
style: { display: "block" },
isSelected,
attributes,
setAttributes,
icon: verse,
label: __("Quote citation"),
placeholder: (
// translators: placeholder text used for the
// citation
__("Add citation")
),
addLabel: __("Add citation"),
removeLabel: __("Remove citation"),
excludeElementClassName: true,
className: "wp-block-quote__citation",
insertBlocksAfter
}
)
] })
] });
}
export {
QuoteEdit as default
};
//# sourceMappingURL=edit.mjs.map