UNPKG

@wordpress/block-library

Version:
139 lines (134 loc) 4.84 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = Edit; var _clsx = _interopRequireDefault(require("clsx")); var _i18n = require("@wordpress/i18n"); var _data = require("@wordpress/data"); var _blockEditor = require("@wordpress/block-editor"); var _coreData = require("@wordpress/core-data"); var _components = require("@wordpress/components"); var _hooks = require("../utils/hooks"); var _jsxRuntime = require("react/jsx-runtime"); /** * External dependencies */ /** * WordPress dependencies */ /** * Internal dependencies */ /** * Renders the `core/comment-author-name` block on the editor. * * @param {Object} props React props. * @param {Object} props.setAttributes Callback for updating block attributes. * @param {Object} props.attributes Block attributes. * @param {string} props.attributes.isLink Whether the author name should be linked. * @param {string} props.attributes.linkTarget Target of the link. * @param {string} props.attributes.textAlign Text alignment. * @param {Object} props.context Inherited context. * @param {string} props.context.commentId The comment ID. * * @return {JSX.Element} React element. */function Edit({ attributes: { isLink, linkTarget, textAlign }, context: { commentId }, setAttributes }) { const dropdownMenuProps = (0, _hooks.useToolsPanelDropdownMenuProps)(); const blockProps = (0, _blockEditor.useBlockProps)({ className: (0, _clsx.default)({ [`has-text-align-${textAlign}`]: textAlign }) }); let displayName = (0, _data.useSelect)(select => { const { getEntityRecord } = select(_coreData.store); const comment = getEntityRecord('root', 'comment', commentId); const authorName = comment?.author_name; // eslint-disable-line camelcase if (comment && !authorName) { var _user$name; const user = getEntityRecord('root', 'user', comment.author); return (_user$name = user?.name) !== null && _user$name !== void 0 ? _user$name : (0, _i18n.__)('Anonymous'); } return authorName !== null && authorName !== void 0 ? authorName : ''; }, [commentId]); const blockControls = /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.BlockControls, { group: "block", children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.AlignmentControl, { value: textAlign, onChange: newAlign => setAttributes({ textAlign: newAlign }) }) }); const inspectorControls = /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, { children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalToolsPanel, { label: (0, _i18n.__)('Settings'), resetAll: () => { setAttributes({ isLink: true, linkTarget: '_self' }); }, dropdownMenuProps: dropdownMenuProps, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { label: (0, _i18n.__)('Link to authors URL'), isShownByDefault: true, hasValue: () => !isLink, onDeselect: () => setAttributes({ isLink: true }), children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, { __nextHasNoMarginBottom: true, label: (0, _i18n.__)('Link to authors URL'), onChange: () => setAttributes({ isLink: !isLink }), checked: isLink }) }), isLink && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { label: (0, _i18n.__)('Open in new tab'), isShownByDefault: true, hasValue: () => linkTarget !== '_self', onDeselect: () => setAttributes({ linkTarget: '_self' }), children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, { __nextHasNoMarginBottom: true, label: (0, _i18n.__)('Open in new tab'), onChange: value => setAttributes({ linkTarget: value ? '_blank' : '_self' }), checked: linkTarget === '_blank' }) })] }) }); if (!commentId || !displayName) { displayName = (0, _i18n._x)('Comment Author', 'block title'); } const displayAuthor = isLink ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", { href: "#comment-author-pseudo-link", onClick: event => event.preventDefault(), children: displayName }) : displayName; return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, { children: [inspectorControls, blockControls, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", { ...blockProps, children: displayAuthor })] }); } //# sourceMappingURL=edit.js.map