UNPKG

@wordpress/block-library

Version:
112 lines (108 loc) 3.98 kB
"use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = QueryPaginationEdit; var _i18n = require("@wordpress/i18n"); var _blockEditor = require("@wordpress/block-editor"); var _data = require("@wordpress/data"); var _components = require("@wordpress/components"); var _element = require("@wordpress/element"); var _queryPaginationArrowControls = require("./query-pagination-arrow-controls"); var _queryPaginationLabelControl = require("./query-pagination-label-control"); var _hooks = require("../utils/hooks"); var _jsxRuntime = require("react/jsx-runtime"); /** * WordPress dependencies */ /** * Internal dependencies */ const TEMPLATE = [['core/query-pagination-previous'], ['core/query-pagination-numbers'], ['core/query-pagination-next']]; function QueryPaginationEdit({ attributes: { paginationArrow, showLabel }, setAttributes, clientId }) { const hasNextPreviousBlocks = (0, _data.useSelect)(select => { const { getBlocks } = select(_blockEditor.store); const innerBlocks = getBlocks(clientId); /** * Show the `paginationArrow` and `showLabel` controls only if a * `QueryPaginationNext/Previous` block exists. */ return innerBlocks?.find(innerBlock => { return ['core/query-pagination-next', 'core/query-pagination-previous'].includes(innerBlock.name); }); }, [clientId]); const { __unstableMarkNextChangeAsNotPersistent } = (0, _data.useDispatch)(_blockEditor.store); const dropdownMenuProps = (0, _hooks.useToolsPanelDropdownMenuProps)(); const blockProps = (0, _blockEditor.useBlockProps)(); const innerBlocksProps = (0, _blockEditor.useInnerBlocksProps)(blockProps, { template: TEMPLATE }); // Always show label text if paginationArrow is set to 'none'. (0, _element.useEffect)(() => { if (paginationArrow === 'none' && !showLabel) { __unstableMarkNextChangeAsNotPersistent(); setAttributes({ showLabel: true }); } }, [paginationArrow, setAttributes, showLabel, __unstableMarkNextChangeAsNotPersistent]); return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, { children: [hasNextPreviousBlocks && /*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, { children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_components.__experimentalToolsPanel, { label: (0, _i18n.__)('Settings'), resetAll: () => { setAttributes({ paginationArrow: 'none', showLabel: true }); }, dropdownMenuProps: dropdownMenuProps, children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { hasValue: () => paginationArrow !== 'none', label: (0, _i18n.__)('Pagination arrow'), onDeselect: () => setAttributes({ paginationArrow: 'none' }), isShownByDefault: true, children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_queryPaginationArrowControls.QueryPaginationArrowControls, { value: paginationArrow, onChange: value => { setAttributes({ paginationArrow: value }); } }) }), paginationArrow !== 'none' && /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, { hasValue: () => !showLabel, label: (0, _i18n.__)('Show text'), onDeselect: () => setAttributes({ showLabel: true }), isShownByDefault: true, children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_queryPaginationLabelControl.QueryPaginationLabelControl, { value: showLabel, onChange: value => { setAttributes({ showLabel: value }); } }) })] }) }), /*#__PURE__*/(0, _jsxRuntime.jsx)("nav", { ...innerBlocksProps })] }); } //# sourceMappingURL=edit.js.map