tdesign-react
Version:
TDesign Component for React
166 lines (158 loc) • 7.81 kB
JavaScript
/**
* tdesign v1.15.1
* (c) 2025 tdesign
* @license MIT
*/
;
Object.defineProperty(exports, '__esModule', { value: true });
var defineProperty = require('../../_chunks/dep-0006fcfa.js');
var slicedToArray = require('../../_chunks/dep-8e4d656d.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-667ac7af.js');
require('../../_chunks/dep-00b49251.js');
require('../../config-provider/ConfigContext.js');
require('../../_chunks/dep-1df1dad8.js');
require('../../_chunks/dep-5b5ab11b.js');
require('dayjs');
require('../../_chunks/dep-f32c03f1.js');
require('../../_chunks/dep-31c4bc3d.js');
require('../../_chunks/dep-eea2872a.js');
require('../../_chunks/dep-25585736.js');
require('../../_chunks/dep-62e73936.js');
require('../../_chunks/dep-64577888.js');
require('../../_chunks/dep-71455db7.js');
require('../../_chunks/dep-9e5a468d.js');
require('../../_chunks/dep-ec8d2dca.js');
require('../../_chunks/dep-fc596d16.js');
require('../../_chunks/dep-f26edb7b.js');
require('../../_chunks/dep-f33c1939.js');
require('../../_chunks/dep-21ece627.js');
require('../../_chunks/dep-25e4aa84.js');
require('../../_chunks/dep-e1fbe1c3.js');
require('../../_chunks/dep-df2b541f.js');
require('../../_chunks/dep-edd366db.js');
require('../../_chunks/dep-a56c4939.js');
require('../../_chunks/dep-6c297e20.js');
require('../../_chunks/dep-b7ad4d54.js');
require('../../_chunks/dep-a2cb9299.js');
require('../../_chunks/dep-f981815b.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