Pagination

Navigation component for paginated content

Example

pagination

Loading preview…

Pagination

Navigation component for paginated content

Source: packages/appkit-ui/src/react/ui/pagination.tsx

Props

This component extends standard HTML element attributes.

Usage

import { Pagination } from '@databricks/appkit-ui';

<Pagination /* props */ />

PaginationContent

Container for pagination items

Source: packages/appkit-ui/src/react/ui/pagination.tsx

Props

This component extends standard HTML element attributes.

Usage

import { PaginationContent } from '@databricks/appkit-ui';

<PaginationContent /* props */ />

PaginationEllipsis

Ellipsis indicator for skipped page numbers

Source: packages/appkit-ui/src/react/ui/pagination.tsx

Props

This component extends standard HTML element attributes.

Usage

import { PaginationEllipsis } from '@databricks/appkit-ui';

<PaginationEllipsis /* props */ />

PaginationItem

Individual pagination item wrapper

Source: packages/appkit-ui/src/react/ui/pagination.tsx

Props

This component extends standard HTML element attributes.

Usage

import { PaginationItem } from '@databricks/appkit-ui';

<PaginationItem /* props */ />

PaginationLink

Clickable link for navigating to a specific page

Source: packages/appkit-ui/src/react/ui/pagination.tsx

Props

Prop	Type	Required	Default	Description
isActive	boolean		-	-
size	"default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null		icon	-

Usage

import { PaginationLink } from '@databricks/appkit-ui';

<PaginationLink /* props */ />

PaginationNext

Button for navigating to the next page

Source: packages/appkit-ui/src/react/ui/pagination.tsx

Props

Prop	Type	Required	Default	Description
isActive	boolean		-	-
size	"default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null		-	-

Usage

import { PaginationNext } from '@databricks/appkit-ui';

<PaginationNext /* props */ />

PaginationPrevious

Button for navigating to the previous page

Source: packages/appkit-ui/src/react/ui/pagination.tsx

Props

Prop	Type	Required	Default	Description
isActive	boolean		-	-
size	"default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null		-	-

Usage

import { PaginationPrevious } from '@databricks/appkit-ui';

<PaginationPrevious /* props */ />