UNPKG

@wordpress/block-library

Version:
129 lines (123 loc) 3.83 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = void 0; var _clsx = _interopRequireDefault(require("clsx")); var _i18n = require("@wordpress/i18n"); var _element = require("@wordpress/element"); var _data = require("@wordpress/data"); var _blockEditor = require("@wordpress/block-editor"); var _autogenerateAnchors = require("./autogenerate-anchors"); var _jsxRuntime = require("react/jsx-runtime"); /** * External dependencies */ /** * WordPress dependencies */ /** * Internal dependencies */ function HeadingEdit({ attributes, setAttributes, mergeBlocks, onReplace, style, clientId }) { const { textAlign, content, level, levelOptions, placeholder, anchor } = attributes; const tagName = 'h' + level; const blockProps = (0, _blockEditor.useBlockProps)({ className: (0, _clsx.default)({ [`has-text-align-${textAlign}`]: textAlign }), style }); const blockEditingMode = (0, _blockEditor.useBlockEditingMode)(); const { canGenerateAnchors } = (0, _data.useSelect)(select => { const { getGlobalBlockCount, getSettings } = select(_blockEditor.store); const settings = getSettings(); return { canGenerateAnchors: !!settings.generateAnchors || getGlobalBlockCount('core/table-of-contents') > 0 }; }, []); const { __unstableMarkNextChangeAsNotPersistent } = (0, _data.useDispatch)(_blockEditor.store); // Initially set anchor for headings that have content but no anchor set. // This is used when transforming a block to heading, or for legacy anchors. (0, _element.useEffect)(() => { if (!canGenerateAnchors) { return; } if (!anchor && content) { // This side-effect should not create an undo level. __unstableMarkNextChangeAsNotPersistent(); setAttributes({ anchor: (0, _autogenerateAnchors.generateAnchor)(clientId, content) }); } (0, _autogenerateAnchors.setAnchor)(clientId, anchor); // Remove anchor map when block unmounts. return () => (0, _autogenerateAnchors.setAnchor)(clientId, null); }, [anchor, content, clientId, canGenerateAnchors]); const onContentChange = value => { const newAttrs = { content: value }; if (canGenerateAnchors && (!anchor || !value || (0, _autogenerateAnchors.generateAnchor)(clientId, content) === anchor)) { newAttrs.anchor = (0, _autogenerateAnchors.generateAnchor)(clientId, value); } setAttributes(newAttrs); }; return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, { children: [blockEditingMode === 'default' && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_blockEditor.BlockControls, { group: "block", children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.HeadingLevelDropdown, { value: level, options: levelOptions, onChange: newLevel => setAttributes({ level: newLevel }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.AlignmentControl, { value: textAlign, onChange: nextAlign => { setAttributes({ textAlign: nextAlign }); } })] }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText, { identifier: "content", tagName: tagName, value: content, onChange: onContentChange, onMerge: mergeBlocks, onReplace: onReplace, onRemove: () => onReplace([]), placeholder: placeholder || (0, _i18n.__)('Heading'), textAlign: textAlign, ...(_element.Platform.isNative && { deleteEnter: true }), ...blockProps })] }); } var _default = exports.default = HeadingEdit; //# sourceMappingURL=edit.js.map