50:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 51:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 52:T5e8,.cr-pagination { display: flex; flex-wrap: wrap; align-items: center; gap: var(--cr-space-1); color: var(--cr-color-text-default); font-family: var(--cr-font-family-sans); } .cr-pagination[data-variant='compact'] { gap: var(--cr-space-3); } .cr-pagination__page, .cr-pagination__step { display: grid; place-items: center; min-width: 40px; height: 40px; padding: 0 10px; border: 0; border-radius: var(--cr-radius-full); background: transparent; color: inherit; font: inherit; font-size: var(--cr-font-size-sm); font-weight: var(--cr-font-weight-semibold); font-variant-numeric: tabular-nums; cursor: pointer; } .cr-pagination[data-variant='compact'] .cr-pagination__step { background: var(--cr-color-glass-control); box-shadow: var(--cr-shadow-sm); } .cr-pagination__page:hover, .cr-pagination__step:hover:not(:disabled) { background: var(--cr-color-bg-subtle); } .cr-pagination__page[aria-current='page'] { background: var(--cr-color-ink-bg); color: var(--cr-color-ink-fg); } .cr-pagination__step:disabled { cursor: not-allowed; opacity: 0.4; } .cr-pagination__page:focus-visible, .cr-pagination__step:focus-visible { outline: var(--cr-focus-width) solid var(--cr-color-focus); outline-offset: var(--cr-focus-offset); } .cr-pagination__gap { padding: 0 6px; color: var(--cr-color-text-muted); } .cr-pagination__summary { color: var(--cr-color-text-secondary); font-size: var(--cr-font-size-md); font-variant-numeric: tabular-nums; } 53:Tacc,'use client'; import type { ReactNode } from 'react'; import { cx } from '@/lib/creance/cx'; import { ChevronIcon, ChevronLeftIcon } from '@/lib/creance/icons'; import './Pagination.css'; export interface PaginationProps { /** 1-based. */ page: number; pageCount: number; onPageChange: (page: number) => void; /** Pages shown either side of the current one. Default 1. */ siblings?: number; /** `compact` shows only previous, next and `summary`. */ variant?: 'numbered' | 'compact'; /** For compact: "Runs 41–60 of 230". */ summary?: ReactNode; /** Accessible name of the nav, such as "Runs pages". Default "Pagination". */ label?: string; className?: string; } /** Page numbers with the current page in ink; gaps fold into an ellipsis. */ export function pageItems(page: number, count: number, siblings: number): (number | 'gap')[] { const keep = new Set([1, count]); for (let p = page - siblings; p <= page + siblings; p++) if (p >= 1 && p <= count) keep.add(p); const sorted = [...keep].sort((a, b) => a - b); const out: (number | 'gap')[] = []; sorted.forEach((p, i) => { const prev = sorted[i - 1]; if (prev !== undefined && p - prev === 2) out.push(prev + 1); else if (prev !== undefined && p - prev > 2) out.push('gap'); out.push(p); }); return out; } export function Pagination({ page, pageCount, onPageChange, siblings = 1, variant = 'numbered', summary, label = 'Pagination', className }: PaginationProps) { const prev = ( ); const next = ( ); return ( ); } 4f:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L50",null,{"namespace":"@creance","registryDependencies":["https://creance.pages.dev/r/creance-base.json"]}]]}],null]}],["$","$L51",null,{"files":[{"path":"pagination/Pagination.css","content":"$52","type":"registry:file","target":"@components/creance/pagination/Pagination.css"},{"path":"pagination/Pagination.tsx","content":"$53","type":"registry:ui","target":"@components/creance/pagination/Pagination.tsx"}],"className":"h-[70svh] min-h-80"}]]}]