UNPKG

@yamada-ui/pagination

Version:

Yamada UI pagination component

123 lines (122 loc) 4.32 kB
"use client" "use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/use-pagination.ts var use_pagination_exports = {}; __export(use_pagination_exports, { PaginationProvider: () => PaginationProvider, computedRange: () => computedRange, usePagination: () => usePagination, usePaginationContext: () => usePaginationContext }); module.exports = __toCommonJS(use_pagination_exports); var import_use_controllable_state = require("@yamada-ui/use-controllable-state"); var import_use_value = require("@yamada-ui/use-value"); var import_utils = require("@yamada-ui/utils"); var import_react = require("react"); var [PaginationProvider, usePaginationContext] = (0, import_utils.createContext)({ name: "PaginationContext", errorMessage: `usePaginationContext returned is 'undefined'. Seems you forgot to wrap the components in "<Pagination />"` }); var computedRange = (start, end) => Array.from({ length: end - start + 1 }, (_, index) => index + start); var usePagination = ({ boundaries: _boundaries = 1, defaultPage = 1, isDisabled = false, disabled = isDisabled, page, siblings: _siblings = 1, total, onChange: onChangeProp }) => { const siblings = (0, import_use_value.useValue)(_siblings); const boundaries = (0, import_use_value.useValue)(_boundaries); const [currentPage, setCurrentPage] = (0, import_use_controllable_state.useControllableState)({ defaultValue: defaultPage, value: page, onChange: onChangeProp }); const range = (0, import_react.useMemo)(() => { const minimumTotal = siblings * 2 + 3 + boundaries * 2; if (minimumTotal >= total) return computedRange(1, total); const prevSiblings = Math.max(currentPage - siblings, boundaries); const nextSiblings = Math.min(currentPage + siblings, total - boundaries); const prevDots = prevSiblings > boundaries + 2; const nextDots = nextSiblings < total - (boundaries + 1); if (!prevDots && nextDots) { const prevPages = siblings * 2 + boundaries + 2; return [ ...computedRange(1, prevPages), "ellipsis", ...computedRange(total - (boundaries - 1), total) ]; } if (prevDots && !nextDots) { const nextPages = boundaries + 1 + 2 * siblings; return [ ...computedRange(1, boundaries), "ellipsis", ...computedRange(total - nextPages, total) ]; } return [ ...computedRange(1, boundaries), "ellipsis", ...computedRange(prevSiblings, nextSiblings), "ellipsis", ...computedRange(total - boundaries + 1, total) ]; }, [boundaries, siblings, currentPage, total]); const onFirst = (0, import_react.useCallback)(() => setCurrentPage(1), [setCurrentPage]); const onLast = (0, import_react.useCallback)( () => setCurrentPage(total), [setCurrentPage, total] ); const onPrev = (0, import_react.useCallback)( () => setCurrentPage((prev) => prev === 1 ? prev : prev - 1), [setCurrentPage] ); const onNext = (0, import_react.useCallback)( () => setCurrentPage((prev) => prev === total ? prev : prev + 1), [setCurrentPage, total] ); const onChange = (0, import_react.useCallback)( (page2) => setCurrentPage(page2), [setCurrentPage] ); return { currentPage, disabled, range, total, onChange, onFirst, onLast, onNext, onPrev }; }; // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { PaginationProvider, computedRange, usePagination, usePaginationContext }); //# sourceMappingURL=use-pagination.js.map