{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "pagination-07",
  "title": "Bordered Pagination",
  "description": "A pagination component with bordered styling",
  "registryDependencies": [
    "pagination",
    "button"
  ],
  "files": [
    {
      "path": "src/components/customized/pagination/pagination-07.tsx",
      "content": "import { cn } from \"@/lib/utils\";\nimport { buttonVariants } from \"@/registry/ui/button\";\nimport {\n  Pagination,\n  PaginationContent,\n  PaginationItem,\n  PaginationLink,\n  PaginationNext,\n  PaginationPrevious,\n} from \"@/registry/ui/pagination\";\n\nconst pages = [1, 2, 3];\n\nexport default function PaginationBordered() {\n  return (\n    <Pagination>\n      <PaginationContent className=\"gap-0 divide-x overflow-hidden rounded-lg border\">\n        <PaginationItem>\n          <PaginationPrevious className=\"rounded-none\" href=\"#\" />\n        </PaginationItem>\n        {pages.map((page) => {\n          const isActive = page === 2;\n\n          return (\n            <PaginationItem key={page}>\n              <PaginationLink\n                className={cn(\n                  {\n                    [buttonVariants({\n                      variant: \"default\",\n                      className:\n                        \"hover:text-primary-foreground! dark:bg-primary dark:hover:bg-primary/90\",\n                    })]: isActive,\n                  },\n                  \"rounded-none border-none\"\n                )}\n                href={`#${page}`}\n                isActive={isActive}\n              >\n                {page}\n              </PaginationLink>\n            </PaginationItem>\n          );\n        })}\n        <PaginationItem>\n          <PaginationNext className=\"rounded-none\" href=\"#\" />\n        </PaginationItem>\n      </PaginationContent>\n    </Pagination>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}