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

TDesign Component for React

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

'use strict';

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

var defineProperty = require('../../_chunks/dep-0fe55884.js');
var slicedToArray = require('../../_chunks/dep-5cb0d66d.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-b325182b.js');
require('../../_chunks/dep-737b8bd8.js');
require('../../config-provider/ConfigContext.js');
require('../../_chunks/dep-17dea53e.js');
require('../../_chunks/dep-a0cbf081.js');
require('dayjs');
require('../../_chunks/dep-481a1ecc.js');
require('../../_chunks/dep-474eb386.js');
require('../../_chunks/dep-3b256bc0.js');
require('../../_chunks/dep-4ce0670e.js');
require('../../_chunks/dep-3448f35f.js');
require('../../_chunks/dep-b6a3ada9.js');
require('../../_chunks/dep-967e785f.js');
require('../../_chunks/dep-5c8525ea.js');
require('../../_chunks/dep-735cd5b9.js');
require('../../_chunks/dep-bdafd287.js');
require('../../_chunks/dep-4d300b8f.js');
require('../../_chunks/dep-3332ad6f.js');
require('../../_chunks/dep-98783318.js');
require('../../_chunks/dep-fc884a8e.js');
require('../../_chunks/dep-008b21d4.js');
require('../../_chunks/dep-9193eded.js');
require('../../_chunks/dep-afe817f9.js');
require('../../_chunks/dep-0b70c7ec.js');
require('../../_chunks/dep-a1e3e59b.js');
require('../../_chunks/dep-24ab8f68.js');
require('../../_chunks/dep-753b7d52.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 showPrevMore = 2 + pivot < current;
  var showNextMore = pageCount - 1 - pivot > current;
  React.useEffect(function () {
    if (!showPrevMore) toggleHoverPreMore(false);
    if (!showNextMore) toggleHoverNextMore(false);
  }, [showNextMore, showPrevMore]);
  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"), showPrevMore && /* @__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, showNextMore && /* @__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