{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"ui-pagination","type":"registry:component","title":"Pagination","description":"Page navigation primitive with previous/next and ellipsis states.","version":"1.0.0","status":"ga","files":[{"path":"src/components/ui/pagination.tsx","type":"registry:component","content":"import * as React from 'react'\n\nimport { ChevronLeftIcon, ChevronRightIcon, MoreHorizontalIcon } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\nimport type { Button } from '@/components/ui/button'\nimport { buttonVariants } from '@/components/ui/button'\n\nfunction Pagination({ className, ...props }: React.ComponentProps<'nav'>) {\n  return (\n    <nav\n      role='navigation'\n      aria-label='pagination'\n      data-slot='pagination'\n      className={cn('mx-auto flex w-full justify-center', className)}\n      {...props}\n    />\n  )\n}\n\nfunction PaginationContent({ className, ...props }: React.ComponentProps<'ul'>) {\n  return <ul data-slot='pagination-content' className={cn('flex flex-row items-center gap-1', className)} {...props} />\n}\n\nfunction PaginationItem({ ...props }: React.ComponentProps<'li'>) {\n  return <li data-slot='pagination-item' {...props} />\n}\n\ntype PaginationLinkProps = {\n  isActive?: boolean\n} & Pick<React.ComponentProps<typeof Button>, 'size'> &\n  React.ComponentProps<'a'>\n\nfunction PaginationLink({ className, isActive, size = 'icon', ...props }: PaginationLinkProps) {\n  return (\n    <a\n      aria-current={isActive ? 'page' : undefined}\n      data-slot='pagination-link'\n      data-active={isActive}\n      className={cn(\n        buttonVariants({\n          variant: isActive ? 'outline' : 'ghost',\n          size\n        }),\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction PaginationPrevious({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label='Go to previous page'\n      size='default'\n      className={cn('gap-1 px-2.5 sm:pl-2.5', className)}\n      {...props}\n    >\n      <ChevronLeftIcon />\n      <span className='hidden sm:block'>Previous</span>\n    </PaginationLink>\n  )\n}\n\nfunction PaginationNext({ className, ...props }: React.ComponentProps<typeof PaginationLink>) {\n  return (\n    <PaginationLink\n      aria-label='Go to next page'\n      size='default'\n      className={cn('gap-1 px-2.5 sm:pr-2.5', className)}\n      {...props}\n    >\n      <span className='hidden sm:block'>Next</span>\n      <ChevronRightIcon />\n    </PaginationLink>\n  )\n}\n\nfunction PaginationEllipsis({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      aria-hidden\n      data-slot='pagination-ellipsis'\n      className={cn('flex size-9 items-center justify-center', className)}\n      {...props}\n    >\n      <MoreHorizontalIcon className='size-4' />\n      <span className='sr-only'>More pages</span>\n    </span>\n  )\n}\n\nexport {\n  Pagination,\n  PaginationContent,\n  PaginationLink,\n  PaginationItem,\n  PaginationPrevious,\n  PaginationNext,\n  PaginationEllipsis\n}\n"}]}