{
"$schema": "https://ui.shadcn.com/schema/registry-item.json",
"name": "pagination",
"type": "registry:ui",
"title": "Pagination",
"description": "여러 페이지로 나뉜 목록에서 볼 페이지를 고르는 컨트롤입니다.",
"registryDependencies": [
"@atom/tokens",
"@atom/lib-bem",
"@atom/lib-cn",
"@atom/lib-pagination-window",
"@atom/lib-use-controllable-state"
],
"files": [
{
"path": "poc/design-system/implement/src/components/pagination.tsx",
"content": "\"use client\";\n\nimport { type HTMLAttributes, type MouseEvent, type Ref } from \"react\";\nimport { mod } from \"../lib/bem\";\nimport { cn } from \"../lib/cn\";\nimport { useControllableState } from \"../lib/use-controllable-state\";\nimport { clampPageIndex, getPageWindow, normalizePageCount } from \"../lib/pagination-window\";\n\n/* -------------------------------------------------------------------------- */\n/* Pagination (components/pagination.md, styles/atom/elements/pagination.css) */\n/* */\n/* */\n/* pageIndex 는 0부터, 화면 번호는 1부터. Grid Footer 에서도 그대로 씁니다. */\n/* -------------------------------------------------------------------------- */\n\nexport type PaginationSize = \"small\" | \"medium\";\n\nconst B = \"atom-pagination\";\n\nexport type PaginationProps = Omit, \"onChange\"> & {\n ref?: Ref;\n /** 현재 페이지 인덱스입니다. 0부터 시작합니다. 주면 controlled 입니다. */\n pageIndex?: number;\n /** uncontrolled 일 때의 처음 페이지 인덱스입니다. 0부터 시작합니다. */\n defaultPageIndex?: number;\n /** 전체 페이지 수입니다. 0이면 1로 봅니다. */\n pageCount: number;\n /** 한 번에 노출할 번호 개수입니다. */\n maxPageButtons?: number;\n /** 컨트롤 높이와 폰트 크기를 결정합니다. */\n size?: PaginationSize;\n /** `