UNPKG

@wordpress/block-library

Version:
113 lines (102 loc) 4.26 kB
import { createElement, Fragment } from "@wordpress/element"; /** * WordPress dependencies */ import { __ } from '@wordpress/i18n'; import { AlignmentControl, BlockControls, RichText, useBlockProps, getColorObjectByAttributeValues, __experimentalGetColorClassesAndStyles as getColorClassesAndStyles } from '@wordpress/block-editor'; import { createBlock, getDefaultBlockName } from '@wordpress/blocks'; /** * Internal dependencies */ import { Figure } from './figure'; import { BlockQuote } from './blockquote'; const getBackgroundColor = _ref => { var _colorProps$style, _colorProps$style2; let { attributes, colors, style } = _ref; const { backgroundColor } = attributes; const colorProps = getColorClassesAndStyles(attributes); const colorObject = getColorObjectByAttributeValues(colors, backgroundColor); return (colorObject === null || colorObject === void 0 ? void 0 : colorObject.color) || ((_colorProps$style = colorProps.style) === null || _colorProps$style === void 0 ? void 0 : _colorProps$style.backgroundColor) || ((_colorProps$style2 = colorProps.style) === null || _colorProps$style2 === void 0 ? void 0 : _colorProps$style2.background) || (style === null || style === void 0 ? void 0 : style.backgroundColor); }; const getTextColor = _ref2 => { var _colorProps$style3, _style$baseColors, _style$baseColors$col; let { attributes, colors, style } = _ref2; const colorProps = getColorClassesAndStyles(attributes); const colorObject = getColorObjectByAttributeValues(colors, attributes.textColor); return (colorObject === null || colorObject === void 0 ? void 0 : colorObject.color) || ((_colorProps$style3 = colorProps.style) === null || _colorProps$style3 === void 0 ? void 0 : _colorProps$style3.color) || (style === null || style === void 0 ? void 0 : style.color) || (style === null || style === void 0 ? void 0 : (_style$baseColors = style.baseColors) === null || _style$baseColors === void 0 ? void 0 : (_style$baseColors$col = _style$baseColors.color) === null || _style$baseColors$col === void 0 ? void 0 : _style$baseColors$col.text); }; const getBorderColor = props => { var _wrapperProps$style; const { wrapperProps } = props; const defaultColor = getTextColor(props); return (wrapperProps === null || wrapperProps === void 0 ? void 0 : (_wrapperProps$style = wrapperProps.style) === null || _wrapperProps$style === void 0 ? void 0 : _wrapperProps$style.borderColor) || defaultColor; }; /** * Internal dependencies */ function PullQuoteEdit(props) { const { attributes, setAttributes, isSelected, insertBlocksAfter } = props; const { textAlign, citation, value } = attributes; const blockProps = useBlockProps({ backgroundColor: getBackgroundColor(props), borderColor: getBorderColor(props) }); const shouldShowCitation = !RichText.isEmpty(citation) || isSelected; return createElement(Fragment, null, createElement(BlockControls, { group: "block" }, createElement(AlignmentControl, { value: textAlign, onChange: nextAlign => { setAttributes({ textAlign: nextAlign }); } })), createElement(Figure, blockProps, createElement(BlockQuote, { textColor: getTextColor(props) }, createElement(RichText, { identifier: "value", value: value, onChange: nextValue => setAttributes({ value: nextValue }), "aria-label": __('Pullquote text'), placeholder: // translators: placeholder text used for the quote __('Add quote'), textAlign: textAlign !== null && textAlign !== void 0 ? textAlign : 'center' }), shouldShowCitation && createElement(RichText, { identifier: "citation", value: citation, "aria-label": __('Pullquote citation text'), placeholder: // translators: placeholder text used for the citation __('Add citation'), onChange: nextCitation => setAttributes({ citation: nextCitation }), __unstableMobileNoFocusOnMount: true, textAlign: textAlign !== null && textAlign !== void 0 ? textAlign : 'center', __unstableOnSplitAtEnd: () => insertBlocksAfter(createBlock(getDefaultBlockName())) })))); } export default PullQuoteEdit; //# sourceMappingURL=edit.native.js.map