@wordpress/block-library/build/query-pagination-numbers/edit.js

Block library for the WordPress editor.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = QueryPaginationNumbersEdit;
var _i18n = require("@wordpress/i18n");
var _blockEditor = require("@wordpress/block-editor");
var _components = require("@wordpress/components");
var _hooks = require("../utils/hooks");
var _jsxRuntime = require("react/jsx-runtime");
/**
 * WordPress dependencies
 */

/**
 * Internal dependencies
 */

const createPaginationItem = (content, Tag = 'a', extraClass = '') => /*#__PURE__*/(0, _jsxRuntime.jsx)(Tag, {
  className: `page-numbers ${extraClass}`,
  children: content
}, content);
const previewPaginationNumbers = midSize => {
  const paginationItems = [];

  // First set of pagination items.
  for (let i = 1; i <= midSize; i++) {
    paginationItems.push(createPaginationItem(i));
  }

  // Current pagination item.
  paginationItems.push(createPaginationItem(midSize + 1, 'span', 'current'));

  // Second set of pagination items.
  for (let i = 1; i <= midSize; i++) {
    paginationItems.push(createPaginationItem(midSize + 1 + i));
  }

  // Dots.
  paginationItems.push(createPaginationItem('...', 'span', 'dots'));

  // Last pagination item.
  paginationItems.push(createPaginationItem(midSize * 2 + 3));
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
    children: paginationItems
  });
};
function QueryPaginationNumbersEdit({
  attributes,
  setAttributes
}) {
  const {
    midSize
  } = attributes;
  const paginationNumbers = previewPaginationNumbers(parseInt(midSize, 10));
  const dropdownMenuProps = (0, _hooks.useToolsPanelDropdownMenuProps)();
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_blockEditor.InspectorControls, {
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanel, {
        label: (0, _i18n.__)('Settings'),
        resetAll: () => setAttributes({
          midSize: 2
        }),
        dropdownMenuProps: dropdownMenuProps,
        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.__experimentalToolsPanelItem, {
          label: (0, _i18n.__)('Number of links'),
          hasValue: () => midSize !== 2,
          onDeselect: () => setAttributes({
            midSize: 2
          }),
          isShownByDefault: true,
          children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_components.RangeControl, {
            __next40pxDefaultSize: true,
            __nextHasNoMarginBottom: true,
            label: (0, _i18n.__)('Number of links'),
            help: (0, _i18n.__)('Specify how many links can appear before and after the current page number. Links to the first, current and last page are always visible.'),
            value: midSize,
            onChange: value => {
              setAttributes({
                midSize: parseInt(value, 10)
              });
            },
            min: 0,
            max: 5,
            withInputField: false
          })
        })
      })
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
      ...(0, _blockEditor.useBlockProps)(),
      children: paginationNumbers
    })]
  });
}
//# sourceMappingURL=edit.js.map