UNPKG

@wordpress/block-library

Version:
215 lines (211 loc) 8.19 kB
"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.default = PostNavigationLinkEdit; var _clsx = _interopRequireDefault(require("clsx")); var _components = require("@wordpress/components"); var _blockEditor = require("@wordpress/block-editor"); var _i18n = require("@wordpress/i18n"); var _data = require("@wordpress/data"); var _coreData = require("@wordpress/core-data"); var _hooks = require("../utils/hooks"); var _jsxRuntime = require("react/jsx-runtime"); /** * External dependencies */ /** * WordPress dependencies */ /** * Internal dependencies */ function PostNavigationLinkEdit({ context: { postType }, attributes: { type, label, showTitle, textAlign, linkLabel, arrow, taxonomy }, setAttributes }) { const blockEditingMode = (0, _blockEditor.useBlockEditingMode)(); const showControls = blockEditingMode === 'default'; const isNext = type === 'next'; let placeholder = isNext ? (0, _i18n.__)('Next') : (0, _i18n.__)('Previous'); const arrowMap = { none: '', arrow: isNext ? '→' : '←', chevron: isNext ? '»' : '«' }; const displayArrow = arrowMap[arrow]; if (showTitle) { placeholder = isNext ? /* translators: Label before for next and previous post. There is a space after the colon. */ (0, _i18n.__)('Next: ') // eslint-disable-line @wordpress/i18n-no-flanking-whitespace : /* translators: Label before for next and previous post. There is a space after the colon. */ (0, _i18n.__)('Previous: '); // eslint-disable-line @wordpress/i18n-no-flanking-whitespace } const ariaLabel = isNext ? (0, _i18n.__)('Next post') : (0, _i18n.__)('Previous post'); const blockProps = (0, _blockEditor.useBlockProps)({ className: (0, _clsx.default)({ [`has-text-align-${textAlign}`]: textAlign }) }); const taxonomies = (0, _data.useSelect)(select => { const { getTaxonomies } = select(_coreData.store); const filteredTaxonomies = getTaxonomies({ type: postType, per_page: -1 }); return filteredTaxonomies; }, [postType]); const getTaxonomyOptions = () => { const selectOption = { label: (0, _i18n.__)('Unfiltered'), value: '' }; const taxonomyOptions = (taxonomies !== null && taxonomies !== void 0 ? taxonomies : []).filter(({ visibility }) => !!visibility?.publicly_queryable).map(item => { return { value: item.slug, label: item.name }; }); return [selectOption, ...taxonomyOptions]; }; const dropdownMenuProps = (0, _hooks.useToolsPanelDropdownMenuProps)(); return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, { children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, { children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalToolsPanel, { label: (0, _i18n.__)('Settings'), resetAll: () => { setAttributes({ showTitle: false, linkLabel: false, arrow: 'none' }); }, dropdownMenuProps: dropdownMenuProps, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { label: (0, _i18n.__)('Display the title as a link'), isShownByDefault: true, hasValue: () => showTitle, onDeselect: () => setAttributes({ showTitle: false }), children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, { __nextHasNoMarginBottom: true, label: (0, _i18n.__)('Display the title as a link'), help: (0, _i18n.__)('If you have entered a custom label, it will be prepended before the title.'), checked: !!showTitle, onChange: () => setAttributes({ showTitle: !showTitle }) }) }), showTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { label: (0, _i18n.__)('Include the label as part of the link'), isShownByDefault: true, hasValue: () => !!linkLabel, onDeselect: () => setAttributes({ linkLabel: false }), children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.ToggleControl, { __nextHasNoMarginBottom: true, label: (0, _i18n.__)('Include the label as part of the link'), checked: !!linkLabel, onChange: () => setAttributes({ linkLabel: !linkLabel }) }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { label: (0, _i18n.__)('Arrow'), isShownByDefault: true, hasValue: () => arrow !== 'none', onDeselect: () => setAttributes({ arrow: 'none' }), children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalToggleGroupControl, { __next40pxDefaultSize: true, __nextHasNoMarginBottom: true, label: (0, _i18n.__)('Arrow'), value: arrow, onChange: value => { setAttributes({ arrow: value }); }, help: (0, _i18n.__)('A decorative arrow for the next and previous link.'), isBlock: true, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToggleGroupControlOption, { value: "none", label: (0, _i18n._x)('None', 'Arrow option for Next/Previous link') }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToggleGroupControlOption, { value: "arrow", label: (0, _i18n._x)('Arrow', 'Arrow option for Next/Previous link') }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToggleGroupControlOption, { value: "chevron", label: (0, _i18n._x)('Chevron', 'Arrow option for Next/Previous link') })] }) })] }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, { group: "advanced", children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.SelectControl, { __next40pxDefaultSize: true, __nextHasNoMarginBottom: true, label: (0, _i18n.__)('Filter by taxonomy'), value: taxonomy, options: getTaxonomyOptions(), onChange: value => setAttributes({ taxonomy: value }), help: (0, _i18n.__)('Only link to posts that have the same taxonomy terms as the current post. For example the same tags or categories.') }) }), showControls && /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.BlockControls, { children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.AlignmentToolbar, { value: textAlign, onChange: nextAlign => { setAttributes({ textAlign: nextAlign }); } }) }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", { ...blockProps, children: [!isNext && displayArrow && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", { className: `wp-block-post-navigation-link__arrow-previous is-arrow-${arrow}`, children: displayArrow }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.RichText, { tagName: "a", identifier: "label", "aria-label": ariaLabel, placeholder: placeholder, value: label, withoutInteractiveFormatting: true, onChange: newLabel => setAttributes({ label: newLabel }) }), showTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("a", { href: "#post-navigation-pseudo-link", onClick: event => event.preventDefault(), children: (0, _i18n.__)('An example title') }), isNext && displayArrow && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", { className: `wp-block-post-navigation-link__arrow-next is-arrow-${arrow}`, "aria-hidden": true, children: displayArrow })] })] }); } //# sourceMappingURL=edit.js.map