UNPKG

@wordpress/block-library

Version:
155 lines (146 loc) 4.37 kB
import { createElement, Fragment } from "@wordpress/element"; /** * External dependencies */ import classnames from 'classnames'; /** * WordPress dependencies */ import { AlignmentControl, BlockControls, InspectorControls, RichText, useBlockProps } from '@wordpress/block-editor'; import { PanelBody, SelectControl, ToggleControl } from '@wordpress/components'; import { useSelect, useDispatch } from '@wordpress/data'; import { __ } from '@wordpress/i18n'; import { store as coreStore } from '@wordpress/core-data'; function PostAuthorEdit(_ref) { let { isSelected, context: { postType, postId, queryId }, attributes, setAttributes } = _ref; const isDescendentOfQueryLoop = Number.isFinite(queryId); const { authorId, authorDetails, authors } = useSelect(select => { var _getEditedEntityRecor; const { getEditedEntityRecord, getUser, getUsers } = select(coreStore); const _authorId = (_getEditedEntityRecor = getEditedEntityRecord('postType', postType, postId)) === null || _getEditedEntityRecor === void 0 ? void 0 : _getEditedEntityRecor.author; return { authorId: _authorId, authorDetails: _authorId ? getUser(_authorId) : null, authors: getUsers({ who: 'authors' }) }; }, [postType, postId]); const { editEntityRecord } = useDispatch(coreStore); const { textAlign, showAvatar, showBio, byline } = attributes; const avatarSizes = []; if (authorDetails) { Object.keys(authorDetails.avatar_urls).forEach(size => { avatarSizes.push({ value: size, label: `${size} x ${size}` }); }); } const blockProps = useBlockProps({ className: classnames({ [`has-text-align-${textAlign}`]: textAlign }) }); return createElement(Fragment, null, createElement(InspectorControls, null, createElement(PanelBody, { title: __('Settings') }, !!postId && !isDescendentOfQueryLoop && !!(authors !== null && authors !== void 0 && authors.length) && createElement(SelectControl, { label: __('Author'), value: authorId, options: authors.map(_ref2 => { let { id, name } = _ref2; return { value: id, label: name }; }), onChange: nextAuthorId => { editEntityRecord('postType', postType, postId, { author: nextAuthorId }); } }), createElement(ToggleControl, { label: __('Show avatar'), checked: showAvatar, onChange: () => setAttributes({ showAvatar: !showAvatar }) }), showAvatar && createElement(SelectControl, { label: __('Avatar size'), value: attributes.avatarSize, options: avatarSizes, onChange: size => { setAttributes({ avatarSize: Number(size) }); } }), createElement(ToggleControl, { label: __('Show bio'), checked: showBio, onChange: () => setAttributes({ showBio: !showBio }) }))), createElement(BlockControls, { group: "block" }, createElement(AlignmentControl, { value: textAlign, onChange: nextAlign => { setAttributes({ textAlign: nextAlign }); } })), createElement("div", blockProps, showAvatar && authorDetails && createElement("div", { className: "wp-block-post-author__avatar" }, createElement("img", { width: attributes.avatarSize, src: authorDetails.avatar_urls[attributes.avatarSize], alt: authorDetails.name })), createElement("div", { className: "wp-block-post-author__content" }, (!RichText.isEmpty(byline) || isSelected) && createElement(RichText, { className: "wp-block-post-author__byline", multiline: false, "aria-label": __('Post author byline text'), placeholder: __('Write byline…'), value: byline, onChange: value => setAttributes({ byline: value }) }), createElement("p", { className: "wp-block-post-author__name" }, (authorDetails === null || authorDetails === void 0 ? void 0 : authorDetails.name) || __('Post Author')), showBio && createElement("p", { className: "wp-block-post-author__bio", dangerouslySetInnerHTML: { __html: authorDetails === null || authorDetails === void 0 ? void 0 : authorDetails.description } })))); } export default PostAuthorEdit; //# sourceMappingURL=edit.js.map