ui Architecture Docs
Home / File/ pagination-example.tsx — ui Source File

pagination-example.tsx — ui Source File

Architecture documentation for pagination-example.tsx, a tsx file in the ui codebase. 4 imports, 0 dependents.

File tsx ComponentRegistry UIPrimitives 4 imports 4 functions

Entity Profile

Dependency Diagram

graph LR
  b6dcfa7f_8b68_7f3e_2b2e_487ac27d6246["pagination-example.tsx"]
  f56be340_a522_c6f7_dec3_5906873d14c8["example"]
  b6dcfa7f_8b68_7f3e_2b2e_487ac27d6246 --> f56be340_a522_c6f7_dec3_5906873d14c8
  8a527dea_9425_3da4_8ceb_ec3058568dc9["field"]
  b6dcfa7f_8b68_7f3e_2b2e_487ac27d6246 --> 8a527dea_9425_3da4_8ceb_ec3058568dc9
  67dadaf4_7361_1608_fbaa_5149e8cce5eb["pagination"]
  b6dcfa7f_8b68_7f3e_2b2e_487ac27d6246 --> 67dadaf4_7361_1608_fbaa_5149e8cce5eb
  d80c6389_7118_33c6_94f6_8ae48c4d9f8b["select"]
  b6dcfa7f_8b68_7f3e_2b2e_487ac27d6246 --> d80c6389_7118_33c6_94f6_8ae48c4d9f8b
  style b6dcfa7f_8b68_7f3e_2b2e_487ac27d6246 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

"use client"

import {
  Example,
  ExampleWrapper,
} from "@/registry/bases/base/components/example"
import { Field, FieldLabel } from "@/registry/bases/base/ui/field"
import {
  Pagination,
  PaginationContent,
  PaginationEllipsis,
  PaginationItem,
  PaginationLink,
  PaginationNext,
  PaginationPrevious,
} from "@/registry/bases/base/ui/pagination"
import {
  Select,
  SelectContent,
  SelectGroup,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/registry/bases/base/ui/select"

export default function PaginationExample() {
  return (
    <ExampleWrapper>
      <PaginationBasic />
      <PaginationSimple />
      <PaginationIconsOnly />
    </ExampleWrapper>
  )
}

function PaginationBasic() {
  return (
    <Example title="Basic">
      <Pagination>
        <PaginationContent>
          <PaginationItem>
            <PaginationPrevious href="#" />
          </PaginationItem>
          <PaginationItem>
            <PaginationLink href="#">1</PaginationLink>
          </PaginationItem>
          <PaginationItem>
            <PaginationLink href="#" isActive>
              2
            </PaginationLink>
          </PaginationItem>
          <PaginationItem>
            <PaginationLink href="#">3</PaginationLink>
          </PaginationItem>
          <PaginationItem>
            <PaginationEllipsis />
          </PaginationItem>
          <PaginationItem>
            <PaginationNext href="#" />
          </PaginationItem>
// ... (69 more lines)

Domain

Subdomains

Functions

Dependencies

  • example
  • field
  • pagination
  • select

Source

Frequently Asked Questions

What does pagination-example.tsx do?
pagination-example.tsx is a source file in the ui codebase, written in tsx. It belongs to the ComponentRegistry domain, UIPrimitives subdomain.
What functions are defined in pagination-example.tsx?
pagination-example.tsx defines 4 function(s): PaginationBasic, PaginationExample, PaginationIconsOnly, PaginationSimple.
What does pagination-example.tsx depend on?
pagination-example.tsx imports 4 module(s): example, field, pagination, select.
Where is pagination-example.tsx in the architecture?
pagination-example.tsx is located at apps/v4/registry/bases/base/examples/pagination-example.tsx (domain: ComponentRegistry, subdomain: UIPrimitives, directory: apps/v4/registry/bases/base/examples).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free