tdesign-react/cjs/pagination/hooks/usePageNumber.js

TDesign Component for React

/**
 * tdesign v1.13.2
 * (c) 2025 tdesign
 * @license MIT
 */

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var defineProperty = require('../../_chunks/dep-cc768e34.js');
var slicedToArray = require('../../_chunks/dep-e17e2d31.js');
var React = require('react');
var classNames = require('classnames');
var tdesignIconsReact = require('tdesign-icons-react');
var hooks_useConfig = require('../../hooks/useConfig.js');
var hooks_useGlobalIcon = require('../../hooks/useGlobalIcon.js');
require('../../_chunks/dep-6d4d8660.js');
require('../../_chunks/dep-b7d577ac.js');
require('../../config-provider/ConfigContext.js');
require('../../_chunks/dep-3a869b87.js');
require('../../_chunks/dep-ac58e1cc.js');
require('dayjs');
require('../../_chunks/dep-7da96a57.js');
require('../../_chunks/dep-07b911d8.js');
require('../../_chunks/dep-4b02d669.js');
require('../../_chunks/dep-f0379c5f.js');
require('../../_chunks/dep-ddacd27a.js');
require('../../_chunks/dep-028b759d.js');
require('../../_chunks/dep-8a116183.js');
require('../../_chunks/dep-4671b9bd.js');
require('../../_chunks/dep-bed9d73e.js');
require('../../_chunks/dep-780eda7b.js');
require('../../_chunks/dep-47bdc05f.js');
require('../../_chunks/dep-cab13149.js');
require('../../_chunks/dep-a30819a4.js');
require('../../_chunks/dep-6a7ba247.js');
require('../../_chunks/dep-c87d9752.js');
require('../../_chunks/dep-bd956a2d.js');
require('../../_chunks/dep-0cdb3286.js');
require('../../_chunks/dep-865c186c.js');
require('../../_chunks/dep-f4e58639.js');
require('../../_chunks/dep-781a2854.js');
require('../../_chunks/dep-1ef213f8.js');
require('../../_chunks/dep-e2c832a5.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);

function usePageNumber(props) {
  var _useConfig = hooks_useConfig["default"](),
    classPrefix = _useConfig.classPrefix;
  var _useGlobalIcon = hooks_useGlobalIcon["default"]({
      EllipsisIcon: tdesignIconsReact.EllipsisIcon,
      ChevronLeftDoubleIcon: tdesignIconsReact.ChevronLeftDoubleIcon,
      ChevronRightDoubleIcon: tdesignIconsReact.ChevronRightDoubleIcon
    }),
    EllipsisIcon = _useGlobalIcon.EllipsisIcon,
    ChevronLeftDoubleIcon = _useGlobalIcon.ChevronLeftDoubleIcon,
    ChevronRightDoubleIcon = _useGlobalIcon.ChevronRightDoubleIcon;
  var name = "".concat(classPrefix, "-pagination");
  var _useState = React.useState(false),
    _useState2 = slicedToArray._slicedToArray(_useState, 2),
    hoverPreMore = _useState2[0],
    toggleHoverPreMore = _useState2[1];
  var _useState3 = React.useState(false),
    _useState4 = slicedToArray._slicedToArray(_useState3, 2),
    hoverNextMore = _useState4[0],
    toggleHoverNextMore = _useState4[1];
  var showPageNumber = props.showPageNumber,
    maxPageBtn = props.maxPageBtn,
    disabled = props.disabled,
    current = props.current,
    pageCount = props.pageCount,
    foldedMaxPageBtn = props.foldedMaxPageBtn,
    changeCurrent = props.changeCurrent,
    pageEllipsisMode = props.pageEllipsisMode;
  var isMidEllipsis = pageEllipsisMode === "mid";
  var pivot = Math.ceil((foldedMaxPageBtn - 1) / 2);
  var pageList = React.useMemo(function () {
    var isPrevMoreShow = 2 + pivot < current;
    var isNextMoreShow = pageCount - 1 - pivot > current;
    var array = [];
    var start;
    var end;
    if (pageCount > maxPageBtn) {
      if (isPrevMoreShow && isNextMoreShow) {
        start = current - pivot;
        end = current + pivot;
      } else {
        var foldedStart = isMidEllipsis ? 2 : 1;
        var foldedEnd = isMidEllipsis ? pageCount - 1 : pageCount;
        start = isPrevMoreShow ? pageCount - foldedMaxPageBtn + 1 : foldedStart;
        end = isPrevMoreShow ? foldedEnd : foldedMaxPageBtn;
      }
    } else {
      start = 1;
      end = pageCount;
    }
    for (var i = start; i <= end; i++) {
      array.push(i);
    }
    return array;
  }, [current, pageCount, foldedMaxPageBtn, isMidEllipsis, maxPageBtn, pivot]);
  var isFolded = pageCount > maxPageBtn;
  var pageNumberControl = showPageNumber && /* @__PURE__ */React__default["default"].createElement("ul", {
    className: "".concat(name, "__pager")
  }, isFolded && isMidEllipsis && /* @__PURE__ */React__default["default"].createElement(React__default["default"].Fragment, null, /* @__PURE__ */React__default["default"].createElement("li", {
    key: 1,
    className: classNames__default["default"]("".concat(name, "__number"), defineProperty._defineProperty(defineProperty._defineProperty({}, "".concat(classPrefix, "-is-disabled"), disabled), "".concat(classPrefix, "-is-current"), current === 1)),
    onClick: function onClick() {
      return changeCurrent(1);
    }
  }, "1"), 2 + pivot < current && /* @__PURE__ */React__default["default"].createElement("li", {
    className: classNames__default["default"]("".concat(name, "__number"), "".concat(name, "__number--more"), defineProperty._defineProperty({}, "".concat(classPrefix, "-is-disabled"), disabled)),
    onMouseEnter: function onMouseEnter() {
      return toggleHoverPreMore(true);
    },
    onMouseLeave: function onMouseLeave() {
      return toggleHoverPreMore(false);
    },
    onClick: function onClick() {
      return changeCurrent(current - foldedMaxPageBtn);
    }
  }, !hoverPreMore ? /* @__PURE__ */React__default["default"].createElement(EllipsisIcon, null) : /* @__PURE__ */React__default["default"].createElement(ChevronLeftDoubleIcon, null))), pageList.map(function (item) {
    return /* @__PURE__ */React__default["default"].createElement("li", {
      key: item,
      className: classNames__default["default"]("".concat(name, "__number"), defineProperty._defineProperty(defineProperty._defineProperty({}, "".concat(classPrefix, "-is-disabled"), disabled), "".concat(classPrefix, "-is-current"), current === item)),
      onClick: function onClick() {
        return changeCurrent(item);
      }
    }, item);
  }), isFolded && isMidEllipsis && /* @__PURE__ */React__default["default"].createElement(React__default["default"].Fragment, null, pageCount - 1 - pivot > current && /* @__PURE__ */React__default["default"].createElement("li", {
    className: classNames__default["default"]("".concat(name, "__number"), "".concat(name, "__number--more"), defineProperty._defineProperty({}, "".concat(classPrefix, "-is-disabled"), disabled)),
    onMouseEnter: function onMouseEnter() {
      return toggleHoverNextMore(true);
    },
    onMouseLeave: function onMouseLeave() {
      return toggleHoverNextMore(false);
    },
    onClick: function onClick() {
      return changeCurrent(current + foldedMaxPageBtn);
    }
  }, !hoverNextMore ? /* @__PURE__ */React__default["default"].createElement(EllipsisIcon, null) : /* @__PURE__ */React__default["default"].createElement(ChevronRightDoubleIcon, null)), /* @__PURE__ */React__default["default"].createElement("li", {
    key: pageCount,
    className: classNames__default["default"]("".concat(name, "__number"), defineProperty._defineProperty(defineProperty._defineProperty({}, "".concat(classPrefix, "-is-disabled"), disabled), "".concat(classPrefix, "-is-current"), current === pageCount)),
    onClick: function onClick() {
      return changeCurrent(pageCount);
    }
  }, pageCount)));
  return {
    pageNumberControl: pageNumberControl
  };
}

exports["default"] = usePageNumber;
//# sourceMappingURL=usePageNumber.js.map