UNPKG

@wordpress/block-library

Version:
169 lines (165 loc) 5.38 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 _components = require("@wordpress/components"); var _blockEditor = require("@wordpress/block-editor"); var _blocks = require("@wordpress/blocks"); var _icons = require("@wordpress/icons"); var _useEnter = require("./use-enter"); var _jsxRuntime = require("react/jsx-runtime"); /** * External dependencies */ /** * WordPress dependencies */ /** * Internal dependencies */ function ParagraphRTLControl({ direction, setDirection }) { return (0, _i18n.isRTL)() && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToolbarButton, { icon: _icons.formatLtr, title: (0, _i18n._x)('Left to right', 'editor button'), isActive: direction === 'ltr', onClick: () => { setDirection(direction === 'ltr' ? undefined : 'ltr'); } }); } function hasDropCapDisabled(align) { return align === ((0, _i18n.isRTL)() ? 'left' : 'right') || align === 'center'; } function DropCapControl({ clientId, attributes, setAttributes, name }) { // Please do not add a useSelect call to the paragraph block unconditionally. // Every useSelect added to a (frequently used) block will degrade load // and type performance. By moving it within InspectorControls, the subscription is // now only added for the selected block(s). const [isDropCapFeatureEnabled] = (0, _blockEditor.useSettings)('typography.dropCap'); if (!isDropCapFeatureEnabled) { return null; } const { align, dropCap } = attributes; let helpText; if (hasDropCapDisabled(align)) { helpText = (0, _i18n.__)('Not available for aligned text.'); } else if (dropCap) { helpText = (0, _i18n.__)('Showing large initial letter.'); } else { helpText = (0, _i18n.__)('Show a large initial letter.'); } const isDropCapControlEnabledByDefault = (0, _blocks.getBlockSupport)(name, 'typography.defaultControls.dropCap', false); return /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, { group: "typography", children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { hasValue: () => !!dropCap, label: (0, _i18n.__)('Drop cap'), isShownByDefault: isDropCapControlEnabledByDefault, onDeselect: () => setAttributes({ dropCap: undefined }), resetAllFilter: () => ({ dropCap: undefined }), panelId: clientId, children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, { __nextHasNoMarginBottom: true, label: (0, _i18n.__)('Drop cap'), checked: !!dropCap, onChange: () => setAttributes({ dropCap: !dropCap }), help: helpText, disabled: hasDropCapDisabled(align) }) }) }); } function ParagraphBlock({ attributes, mergeBlocks, onReplace, onRemove, setAttributes, clientId, isSelected: isSingleSelected, name }) { const { align, content, direction, dropCap, placeholder } = attributes; const blockProps = (0, _blockEditor.useBlockProps)({ ref: (0, _useEnter.useOnEnter)({ clientId, content }), className: (0, _clsx.default)({ 'has-drop-cap': hasDropCapDisabled(align) ? false : dropCap, [`has-text-align-${align}`]: align }), style: { direction } }); const blockEditingMode = (0, _blockEditor.useBlockEditingMode)(); return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, { children: [blockEditingMode === 'default' && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_blockEditor.BlockControls, { group: "block", children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.AlignmentControl, { value: align, onChange: newAlign => setAttributes({ align: newAlign, dropCap: hasDropCapDisabled(newAlign) ? false : dropCap }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(ParagraphRTLControl, { direction: direction, setDirection: newDirection => setAttributes({ direction: newDirection }) })] }), isSingleSelected && /*#__PURE__*/(0, _jsxRuntime.jsx)(DropCapControl, { name: name, clientId: clientId, attributes: attributes, setAttributes: setAttributes }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText, { identifier: "content", tagName: "p", ...blockProps, value: content, onChange: newContent => setAttributes({ content: newContent }), onMerge: mergeBlocks, onReplace: onReplace, onRemove: onRemove, "aria-label": _blockEditor.RichText.isEmpty(content) ? (0, _i18n.__)('Empty block; start writing or type forward slash to choose a block') : (0, _i18n.__)('Block: Paragraph'), "data-empty": _blockEditor.RichText.isEmpty(content), placeholder: placeholder || (0, _i18n.__)('Type / to choose a block'), "data-custom-placeholder": placeholder ? true : undefined, __unstableEmbedURLOnPaste: true, __unstableAllowPrefixTransformations: true })] }); } var _default = exports.default = ParagraphBlock; //# sourceMappingURL=edit.js.map