@wallarm-org/design-system 0.65.0 → 0.66.1-rc-fix-root-package-exports.1

package/dist/components/Pagination/Pagination.d.ts

@@ -0,0 +1,33 @@
+import type { FC, ReactNode, Ref } from 'react';
+import { type TestableProps } from '../../utils/testId';
+import type { PaginationAlign, PaginationPageChangeDetails, PaginationPageSizeChangeDetails, PaginationSize } from './types';
+export interface PaginationProps extends TestableProps {
+    /** Total number of data items (Ark `count`). */
+    count?: number;
+    /** Controlled current page (1-based). */
+    page?: number;
+    /** Uncontrolled initial page. @default 1 */
+    defaultPage?: number;
+    /** Controlled items-per-page. */
+    pageSize?: number;
+    /** Uncontrolled initial items-per-page. @default 10 */
+    defaultPageSize?: number;
+    /** Pages shown beside the active page. @default 1 */
+    siblingCount?: number;
+    /** Pages shown at the start/end. @default 1 */
+    boundaryCount?: number;
+    onPageChange?: (details: PaginationPageChangeDetails) => void;
+    onPageSizeChange?: (details: PaginationPageSizeChangeDetails) => void;
+    /** Trigger element type. @default 'button' */
+    type?: 'button' | 'link';
+    getPageUrl?: (details: PaginationPageChangeDetails) => string;
+    /** Visual size. @default 'medium' */
+    size?: PaginationSize;
+    /** Horizontal alignment of the row. @default 'left' */
+    align?: PaginationAlign;
+    'aria-label'?: string;
+    className?: string;
+    children?: ReactNode;
+    ref?: Ref<HTMLElement>;
+}
+export declare const Pagination: FC<PaginationProps>;

package/dist/components/Pagination/Pagination.js

@@ -0,0 +1,28 @@
+import { jsx } from "react/jsx-runtime";
+import { Pagination } from "@ark-ui/react/pagination";
+import { cn } from "../../utils/cn.js";
+import { TestIdProvider } from "../../utils/testId.js";
+import { paginationVariants } from "./classes.js";
+import { PAGINATION_ROOT_LABEL } from "./constants.js";
+import { PaginationSizeProvider } from "./PaginationContext.js";
+const Pagination_Pagination = ({ size = 'medium', align = 'left', className, children, ref, 'data-testid': testId, 'aria-label': ariaLabel = PAGINATION_ROOT_LABEL, ...arkProps })=>/*#__PURE__*/ jsx(PaginationSizeProvider, {
+        size: size,
+        children: /*#__PURE__*/ jsx(TestIdProvider, {
+            value: testId,
+            children: /*#__PURE__*/ jsx(Pagination.Root, {
+                ...arkProps,
+                ref: ref,
+                translations: {
+                    rootLabel: ariaLabel
+                },
+                className: cn(paginationVariants({
+                    align
+                }), className),
+                "data-slot": "pagination",
+                "data-testid": testId,
+                children: children
+            })
+        })
+    });
+Pagination_Pagination.displayName = 'Pagination';
+export { Pagination_Pagination as Pagination };

package/dist/components/Pagination/PaginationContext.d.ts

@@ -0,0 +1,11 @@
+import { type FC, type ReactNode } from 'react';
+import type { PaginationSize } from './types';
+interface PaginationSizeContextValue {
+    size: PaginationSize;
+}
+export declare const PaginationSizeProvider: FC<{
+    size: PaginationSize;
+    children: ReactNode;
+}>;
+export declare const usePaginationSizeContext: () => PaginationSizeContextValue;
+export {};

package/dist/components/Pagination/PaginationContext.js

@@ -0,0 +1,13 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+const PaginationSizeContext = /*#__PURE__*/ createContext({
+    size: 'medium'
+});
+const PaginationSizeProvider = ({ size, children })=>/*#__PURE__*/ jsx(PaginationSizeContext.Provider, {
+        value: {
+            size
+        },
+        children: children
+    });
+const usePaginationSizeContext = ()=>useContext(PaginationSizeContext);
+export { PaginationSizeProvider, usePaginationSizeContext };

package/dist/components/Pagination/PaginationEllipsis.d.ts

@@ -0,0 +1,7 @@
+import type { FC, HTMLAttributes, Ref } from 'react';
+export interface PaginationEllipsisProps extends HTMLAttributes<HTMLDivElement> {
+    /** Index of this ellipsis within the pages array (required by Ark). */
+    index: number;
+    ref?: Ref<HTMLDivElement>;
+}
+export declare const PaginationEllipsis: FC<PaginationEllipsisProps>;

package/dist/components/Pagination/PaginationEllipsis.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+import { Pagination } from "@ark-ui/react/pagination";
+import { Ellipsis } from "../../icons/index.js";
+import { cn } from "../../utils/cn.js";
+import { useTestId } from "../../utils/testId.js";
+import { paginationEllipsisVariants } from "./classes.js";
+import { usePaginationSizeContext } from "./PaginationContext.js";
+const PaginationEllipsis = ({ index, className, ref, ...props })=>{
+    const { size } = usePaginationSizeContext();
+    const testId = useTestId('ellipsis');
+    return /*#__PURE__*/ jsx(Pagination.Ellipsis, {
+        ...props,
+        ref: ref,
+        index: index,
+        "aria-hidden": true,
+        className: cn(paginationEllipsisVariants({
+            size
+        }), className),
+        "data-slot": "pagination-ellipsis",
+        "data-testid": testId,
+        children: /*#__PURE__*/ jsx(Ellipsis, {
+            size: "md"
+        })
+    });
+};
+PaginationEllipsis.displayName = 'PaginationEllipsis';
+export { PaginationEllipsis };

package/dist/components/Pagination/PaginationItem.d.ts

@@ -0,0 +1,7 @@
+import type { ButtonHTMLAttributes, FC, Ref } from 'react';
+export interface PaginationItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    /** 1-based page number. */
+    value: number;
+    ref?: Ref<HTMLButtonElement>;
+}
+export declare const PaginationItem: FC<PaginationItemProps>;

package/dist/components/Pagination/PaginationItem.js

@@ -0,0 +1,23 @@
+import { jsx } from "react/jsx-runtime";
+import { Pagination } from "@ark-ui/react/pagination";
+import { cn } from "../../utils/cn.js";
+import { useTestId } from "../../utils/testId.js";
+import { paginationItemVariants } from "./classes.js";
+import { usePaginationSizeContext } from "./PaginationContext.js";
+const PaginationItem = ({ value, className, ref, ...props })=>{
+    const { size } = usePaginationSizeContext();
+    const testId = useTestId('item');
+    return /*#__PURE__*/ jsx(Pagination.Item, {
+        ...props,
+        ref: ref,
+        type: "page",
+        value: value,
+        className: cn(paginationItemVariants({
+            size
+        }), className),
+        "data-slot": "pagination-item",
+        "data-testid": testId
+    });
+};
+PaginationItem.displayName = 'PaginationItem';
+export { PaginationItem };

package/dist/components/Pagination/PaginationList.d.ts

@@ -0,0 +1,9 @@
+import type { FC, ReactNode, Ref } from 'react';
+import type { PaginationPage } from './types';
+export interface PaginationListProps {
+    className?: string;
+    /** Optional override for rendering each page entry. */
+    children?: (page: PaginationPage, index: number) => ReactNode;
+    ref?: Ref<HTMLUListElement>;
+}
+export declare const PaginationList: FC<PaginationListProps>;

package/dist/components/Pagination/PaginationList.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+import { Pagination } from "@ark-ui/react/pagination";
+import { cn } from "../../utils/cn.js";
+import { useTestId } from "../../utils/testId.js";
+import { PaginationEllipsis } from "./PaginationEllipsis.js";
+import { PaginationItem } from "./PaginationItem.js";
+const PaginationList = ({ className, children, ref })=>{
+    const testId = useTestId('list');
+    return /*#__PURE__*/ jsx(Pagination.Context, {
+        children: (api)=>/*#__PURE__*/ jsx("ul", {
+                ref: ref,
+                className: cn('flex items-center gap-2', className),
+                "data-slot": "pagination-list",
+                "data-testid": testId,
+                children: api.pages.map((page, index)=>/*#__PURE__*/ jsx("li", {
+                        children: children ? children(page, index) : 'page' === page.type ? /*#__PURE__*/ jsx(PaginationItem, {
+                            value: page.value,
+                            children: page.value
+                        }) : /*#__PURE__*/ jsx(PaginationEllipsis, {
+                            index: index
+                        })
+                    }, 'page' === page.type ? `page-${page.value}` : `ellipsis-${index}`))
+            })
+    });
+};
+PaginationList.displayName = 'PaginationList';
+export { PaginationList };

package/dist/components/Pagination/PaginationNext.d.ts

@@ -0,0 +1,6 @@
+import type { ButtonHTMLAttributes, FC, ReactNode, Ref } from 'react';
+export interface PaginationNextProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    children?: ReactNode;
+    ref?: Ref<HTMLButtonElement>;
+}
+export declare const PaginationNext: FC<PaginationNextProps>;

package/dist/components/Pagination/PaginationNext.js

@@ -0,0 +1,28 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Pagination } from "@ark-ui/react/pagination";
+import { ArrowRight } from "../../icons/index.js";
+import { useTestId } from "../../utils/testId.js";
+import { Button } from "../Button/index.js";
+import { PAGINATION_NEXT_LABEL } from "./constants.js";
+import { usePaginationSizeContext } from "./PaginationContext.js";
+const PaginationNext = ({ children, ...props })=>{
+    const { size } = usePaginationSizeContext();
+    const testId = useTestId('next');
+    return /*#__PURE__*/ jsx(Pagination.NextTrigger, {
+        asChild: true,
+        children: /*#__PURE__*/ jsxs(Button, {
+            ...props,
+            variant: "ghost",
+            color: "neutral",
+            size: size,
+            "data-slot": "pagination-next",
+            "data-testid": testId,
+            children: [
+                children ?? PAGINATION_NEXT_LABEL,
+                /*#__PURE__*/ jsx(ArrowRight, {})
+            ]
+        })
+    });
+};
+PaginationNext.displayName = 'PaginationNext';
+export { PaginationNext };

package/dist/components/Pagination/PaginationPageSize.d.ts

@@ -0,0 +1,10 @@
+import { type FC } from 'react';
+export interface PaginationPageSizeProps {
+    /** Selectable items-per-page values. */
+    options: number[];
+    /** Leading label. @default 'Rows per page' */
+    label?: string;
+    className?: string;
+    'data-testid'?: string;
+}
+export declare const PaginationPageSize: FC<PaginationPageSizeProps>;

package/dist/components/Pagination/PaginationPageSize.js

@@ -0,0 +1,64 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { usePaginationContext } from "@ark-ui/react/pagination";
+import { cn } from "../../utils/cn.js";
+import { useTestId } from "../../utils/testId.js";
+import { Select, SelectButton, SelectContent, SelectOption, SelectOptionText, SelectPositioner } from "../Select/index.js";
+import { Separator } from "../Separator/index.js";
+import { Text } from "../Text/index.js";
+import { PAGINATION_PAGE_SIZE_LABEL } from "./constants.js";
+import { createPageSizeCollection } from "./lib/index.js";
+const PaginationPageSize = ({ options, label = PAGINATION_PAGE_SIZE_LABEL, className, 'data-testid': testIdProp })=>{
+    const api = usePaginationContext();
+    const testId = useTestId('page-size', testIdProp);
+    const collection = useMemo(()=>createPageSizeCollection(options), [
+        options
+    ]);
+    return /*#__PURE__*/ jsxs("div", {
+        className: cn('flex items-center gap-6', className),
+        "data-slot": "pagination-page-size",
+        children: [
+            /*#__PURE__*/ jsx(Text, {
+                asChild: true,
+                size: "sm",
+                weight: "medium",
+                color: "primary",
+                children: /*#__PURE__*/ jsx("span", {
+                    className: "whitespace-nowrap",
+                    children: label
+                })
+            }),
+            /*#__PURE__*/ jsx("div", {
+                className: "w-fit",
+                children: /*#__PURE__*/ jsxs(Select, {
+                    collection: collection,
+                    value: [
+                        String(api.pageSize)
+                    ],
+                    onValueChange: ({ value })=>api.setPageSize(Number(value[0])),
+                    "data-testid": testId,
+                    children: [
+                        /*#__PURE__*/ jsx(SelectButton, {
+                            "aria-label": label
+                        }),
+                        /*#__PURE__*/ jsx(SelectPositioner, {
+                            children: /*#__PURE__*/ jsx(SelectContent, {
+                                children: collection.items.map((item)=>/*#__PURE__*/ jsx(SelectOption, {
+                                        item: item,
+                                        children: /*#__PURE__*/ jsx(SelectOptionText, {
+                                            children: item.label
+                                        })
+                                    }, item.value))
+                            })
+                        })
+                    ]
+                })
+            }),
+            /*#__PURE__*/ jsx(Separator, {
+                orientation: "vertical"
+            })
+        ]
+    });
+};
+PaginationPageSize.displayName = 'PaginationPageSize';
+export { PaginationPageSize };

package/dist/components/Pagination/PaginationPrevious.d.ts

@@ -0,0 +1,6 @@
+import type { ButtonHTMLAttributes, FC, ReactNode, Ref } from 'react';
+export interface PaginationPreviousProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    children?: ReactNode;
+    ref?: Ref<HTMLButtonElement>;
+}
+export declare const PaginationPrevious: FC<PaginationPreviousProps>;

package/dist/components/Pagination/PaginationPrevious.js

@@ -0,0 +1,28 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Pagination } from "@ark-ui/react/pagination";
+import { ArrowLeft } from "../../icons/index.js";
+import { useTestId } from "../../utils/testId.js";
+import { Button } from "../Button/index.js";
+import { PAGINATION_PREVIOUS_LABEL } from "./constants.js";
+import { usePaginationSizeContext } from "./PaginationContext.js";
+const PaginationPrevious = ({ children, ...props })=>{
+    const { size } = usePaginationSizeContext();
+    const testId = useTestId('previous');
+    return /*#__PURE__*/ jsx(Pagination.PrevTrigger, {
+        asChild: true,
+        children: /*#__PURE__*/ jsxs(Button, {
+            ...props,
+            variant: "ghost",
+            color: "neutral",
+            size: size,
+            "data-slot": "pagination-previous",
+            "data-testid": testId,
+            children: [
+                /*#__PURE__*/ jsx(ArrowLeft, {}),
+                children ?? PAGINATION_PREVIOUS_LABEL
+            ]
+        })
+    });
+};
+PaginationPrevious.displayName = 'PaginationPrevious';
+export { PaginationPrevious };

package/dist/components/Pagination/classes.d.ts

@@ -0,0 +1,9 @@
+export declare const paginationVariants: (props?: ({
+    align?: "center" | "left" | "right" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const paginationItemVariants: (props?: ({
+    size?: "small" | "medium" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const paginationEllipsisVariants: (props?: ({
+    size?: "small" | "medium" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/components/Pagination/classes.js

@@ -0,0 +1,45 @@
+import { cva } from "class-variance-authority";
+const paginationVariants = cva('flex w-full items-center gap-6', {
+    variants: {
+        align: {
+            left: 'justify-start',
+            center: 'justify-center',
+            right: 'justify-end'
+        }
+    },
+    defaultVariants: {
+        align: 'left'
+    }
+});
+const paginationItemVariants = cva([
+    'inline-flex items-center justify-center shrink-0 rounded-8',
+    'text-sm font-medium font-sans text-text-primary',
+    'cursor-pointer transition-colors',
+    'border-1 border-transparent bg-transparent',
+    'hover:bg-states-primary-hover active:bg-states-primary-pressed',
+    'focus-visible:outline-none focus-visible:ring-3 focus-visible:ring-focus-primary',
+    'disabled:opacity-50 disabled:pointer-events-none disabled:hover:bg-transparent',
+    'data-[selected]:bg-states-primary-active'
+], {
+    variants: {
+        size: {
+            medium: 'size-32',
+            small: 'size-24'
+        }
+    },
+    defaultVariants: {
+        size: 'medium'
+    }
+});
+const paginationEllipsisVariants = cva('inline-flex items-center justify-center shrink-0 text-text-secondary opacity-50 [&_svg]:icon-md', {
+    variants: {
+        size: {
+            medium: 'size-32',
+            small: 'size-24'
+        }
+    },
+    defaultVariants: {
+        size: 'medium'
+    }
+});
+export { paginationEllipsisVariants, paginationItemVariants, paginationVariants };

package/dist/components/Pagination/constants.d.ts

@@ -0,0 +1,4 @@
+export declare const PAGINATION_ROOT_LABEL = "Pagination";
+export declare const PAGINATION_PREVIOUS_LABEL = "Previous";
+export declare const PAGINATION_NEXT_LABEL = "Next";
+export declare const PAGINATION_PAGE_SIZE_LABEL = "Rows per page";

package/dist/components/Pagination/constants.js

@@ -0,0 +1,5 @@
+const PAGINATION_ROOT_LABEL = 'Pagination';
+const PAGINATION_PREVIOUS_LABEL = 'Previous';
+const PAGINATION_NEXT_LABEL = 'Next';
+const PAGINATION_PAGE_SIZE_LABEL = 'Rows per page';
+export { PAGINATION_NEXT_LABEL, PAGINATION_PAGE_SIZE_LABEL, PAGINATION_PREVIOUS_LABEL, PAGINATION_ROOT_LABEL };

package/dist/components/Pagination/index.d.ts

@@ -0,0 +1,9 @@
+export { Pagination, type PaginationProps } from './Pagination';
+export { usePaginationSizeContext } from './PaginationContext';
+export { PaginationEllipsis, type PaginationEllipsisProps } from './PaginationEllipsis';
+export { PaginationItem, type PaginationItemProps } from './PaginationItem';
+export { PaginationList, type PaginationListProps } from './PaginationList';
+export { PaginationNext, type PaginationNextProps } from './PaginationNext';
+export { PaginationPageSize, type PaginationPageSizeProps } from './PaginationPageSize';
+export { PaginationPrevious, type PaginationPreviousProps } from './PaginationPrevious';
+export type { PaginationAlign, PaginationPage, PaginationPageChangeDetails, PaginationPageSizeChangeDetails, PaginationSize, } from './types';

package/dist/components/Pagination/index.js

@@ -0,0 +1,9 @@
+import { Pagination } from "./Pagination.js";
+import { usePaginationSizeContext } from "./PaginationContext.js";
+import { PaginationEllipsis } from "./PaginationEllipsis.js";
+import { PaginationItem } from "./PaginationItem.js";
+import { PaginationList } from "./PaginationList.js";
+import { PaginationNext } from "./PaginationNext.js";
+import { PaginationPageSize } from "./PaginationPageSize.js";
+import { PaginationPrevious } from "./PaginationPrevious.js";
+export { Pagination, PaginationEllipsis, PaginationItem, PaginationList, PaginationNext, PaginationPageSize, PaginationPrevious, usePaginationSizeContext };

package/dist/components/Pagination/lib/createPageSizeCollection.d.ts

@@ -0,0 +1,5 @@
+/** Build the Select collection for the "rows per page" control. */
+export declare const createPageSizeCollection: (options: number[]) => import("@ark-ui/react").ListCollection<{
+    label: string;
+    value: string;
+}>;

package/dist/components/Pagination/lib/createPageSizeCollection.js

@@ -0,0 +1,8 @@
+import { createListCollection } from "@ark-ui/react/collection";
+const createPageSizeCollection = (options)=>createListCollection({
+        items: options.map((value)=>({
+                label: String(value),
+                value: String(value)
+            }))
+    });
+export { createPageSizeCollection };

package/dist/components/Pagination/lib/index.d.ts

@@ -0,0 +1 @@
+export { createPageSizeCollection } from './createPageSizeCollection';

package/dist/components/Pagination/lib/index.js

@@ -0,0 +1,2 @@
+import { createPageSizeCollection } from "./createPageSizeCollection.js";
+export { createPageSizeCollection };

package/dist/components/Pagination/types.d.ts

@@ -0,0 +1,16 @@
+export type PaginationSize = 'medium' | 'small';
+export type PaginationAlign = 'left' | 'center' | 'right';
+/** A single entry of Ark's `pages` array. */
+export type PaginationPage = {
+    type: 'page';
+    value: number;
+} | {
+    type: 'ellipsis';
+};
+export interface PaginationPageChangeDetails {
+    page: number;
+    pageSize: number;
+}
+export interface PaginationPageSizeChangeDetails {
+    pageSize: number;
+}

package/dist/index.d.ts

@@ -9,6 +9,7 @@
  * concrete classes (e.g. `useState<CalendarDate | null>`) — TypeScript
  * narrows the union automatically.
  */
+export { usePagination, usePaginationContext } from '@ark-ui/react/pagination';
 export { CalendarDate, CalendarDateTime, getLocalTimeZone, parseDate, parseDateTime, parseTime, parseZonedDateTime, Time, today, ZonedDateTime, } from '@internationalized/date';
 export { Accordion, AccordionActions, type AccordionActionsProps, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type AccordionValueChangeDetails, type AccordionVariant, } from './components/Accordion';
 export { Alert, AlertClose, type AlertCloseProps, type AlertColor, AlertContent, type AlertContentProps, AlertControls, type AlertControlsProps, AlertDescription, type AlertDescriptionProps, AlertIcon, type AlertIconProps, type AlertProps, AlertTitle, type AlertTitleProps, } from './components/Alert';
@@ -49,6 +50,7 @@ export { NumberInput, type NumberInputProps } from './components/NumberInput';
 export { NumericBadge, type NumericBadgeProps, } from './components/NumericBadge';
 export { OverflowTooltip, OverflowTooltipContent, type OverflowTooltipContentProps, type OverflowTooltipProps, } from './components/OverflowTooltip';
 export { Page, PageActions, type PageActionsProps, PageContent, type PageContentProps, PageHeader, type PageHeaderProps, type PageHostContextValue, PageHostProvider, type PageLayoutOptions, type PageProps, PageTitle, type PageTitleProps, usePageHost, } from './components/Page';
+export { Pagination, type PaginationAlign, PaginationEllipsis, type PaginationEllipsisProps, PaginationItem, type PaginationItemProps, PaginationList, type PaginationListProps, PaginationNext, type PaginationNextProps, type PaginationPage, type PaginationPageChangeDetails, PaginationPageSize, type PaginationPageSizeChangeDetails, type PaginationPageSizeProps, PaginationPrevious, type PaginationPreviousProps, type PaginationProps, type PaginationSize, usePaginationSizeContext, } from './components/Pagination';
 export { type CopyFormatData, formatAsFilter, ParameterPath, type ParameterPathProps, } from './components/ParameterPath';
 export { Popover, PopoverContent, PopoverTrigger } from './components/Popover';
 export { Progress, type ProgressColor, type ProgressProps, } from './components/Progress';

package/dist/index.js

@@ -1,3 +1,4 @@
+import { usePagination, usePaginationContext } from "@ark-ui/react/pagination";
 import { CalendarDate, CalendarDateTime, Time, ZonedDateTime, getLocalTimeZone, parseDate, parseDateTime, parseTime, parseZonedDateTime, today } from "@internationalized/date";
 import { Accordion, AccordionActions, AccordionContent, AccordionItem, AccordionTrigger } from "./components/Accordion/index.js";
 import { Alert, AlertClose, AlertContent, AlertControls, AlertDescription, AlertIcon, AlertTitle } from "./components/Alert/index.js";
@@ -38,6 +39,7 @@ import { NumberInput } from "./components/NumberInput/index.js";
 import { NumericBadge } from "./components/NumericBadge/index.js";
 import { OverflowTooltip, OverflowTooltipContent } from "./components/OverflowTooltip/index.js";
 import { Page, PageActions, PageContent, PageHeader, PageHostProvider, PageTitle, usePageHost } from "./components/Page/index.js";
+import { Pagination, PaginationEllipsis, PaginationItem, PaginationList, PaginationNext, PaginationPageSize, PaginationPrevious, usePaginationSizeContext } from "./components/Pagination/index.js";
 import { ParameterPath, formatAsFilter } from "./components/ParameterPath/index.js";
 import { Popover, PopoverContent, PopoverTrigger } from "./components/Popover/index.js";
 import { Progress } from "./components/Progress/index.js";
@@ -70,4 +72,4 @@ import { Tour, beaconStepEffect, useTour, waitForStepEvent } from "./components/
 import { UtilityPage } from "./components/UtilityPage/index.js";
 import { WallyIcon } from "./components/WallyIcon/index.js";
 import { TestIdProvider, useTestId } from "./utils/testId.js";
-export { Accordion, AccordionActions, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertClose, AlertContent, AlertControls, AlertDescription, AlertIcon, AlertTitle, AnimatedBackground, AppShell, AppShellHeader, AppShellRail, AppShellRemote, Attribute, AttributeActions, AttributeActionsContent, AttributeActionsItem, AttributeActionsTarget, AttributeLabel, AttributeLabelDescription, AttributeLabelInfo, AttributeValue, Badge, Banner, BannerClose, BannerContent, BannerControls, BannerDescription, BannerIcon, BannerLink, BannerTitle, Breadcrumbs, BreadcrumbsEllipsis, BreadcrumbsItem, BreadcrumbsScopeSwitcher, BreadcrumbsSeparator, Button, Calendar, CalendarApplyButton, CalendarBody, CalendarContent, CalendarDate, CalendarDateTime, CalendarDayName, CalendarFooter, CalendarFooterControls, CalendarGrid, CalendarGrids, CalendarHeader, CalendarInputHeader, CalendarKeyboardHints, CalendarPresetItem, CalendarPresets, CalendarProvider, CalendarResetButton, CalendarTrigger, Card, CardContent, CardFooter, CardHeader, CardTitle, Checkbox, CheckboxDescription, CheckboxGroup, CheckboxIndicator, CheckboxLabel, Code, Country, CountryFlag, CountryName, DAY_NAMES, DEFAULT_RANGE_PRESETS, DEFAULT_SINGLE_PRESETS, DateFormatProvider, DateInput, DateRangeEndValue, DateRangeInput, DateRangeProvider, DateRangeSeparator, DateRangeStartValue, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerFooter, DrawerFooterControls, DrawerHeader, DrawerPositioner, DrawerResizeHandle, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuContextTrigger, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuInput, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDescription, DropdownMenuItemIcon, DropdownMenuItemText, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuTrigger, DropdownMenuTriggerItem, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIllustration, EmptyStateLink, EmptyStateMessage, EmptyStateTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, FilterInput, FilterInputChip, FilterInputFieldMenu, FilterInputOperatorMenu, Flex, FormatDateTime, HStack, HTTP_METHODS, HTTP_METHOD_COLOR, Heading, HttpMethod, Input, InputGroup, InputGroupAddon, InputGroupText, Ip, IpAddress, IpCountry, IpList, IpPort, IpProvider, Kbd, KbdGroup, Link, Loader, Logo, MONTH_NAMES, NavRail, NavRailBody, NavRailFooter, NavRailItem, NavRailSeparator, NavRailSkeleton, NumberInput, NumericBadge, OTPInput, OverflowTooltip, OverflowTooltipContent, Page, PageActions, PageContent, PageHeader, PageHostProvider, PageTitle, ParameterPath, Popover, PopoverContent, PopoverTrigger, Progress, RESPONSE_CODE_COLOR, Radio, RadioDescription, RadioGroup, RadioIndicator, RadioLabel, RemoteShell, RemoteShellBreadcrumb, RemoteShellContent, RemoteShellPanel, ResponseCode, ScrollArea, ScrollAreaContent, ScrollAreaCorner, ScrollAreaScrollbar, ScrollAreaViewport, SegmentedControl, SegmentedControlButton, SegmentedControlItem, SegmentedControlSeparator, SegmentedTabs, SegmentedTabsButton, SegmentedTabsContent, SegmentedTabsList, SegmentedTabsSeparator, SegmentedTabsTrigger, SegmentedTabsTriggerButton, Select, SelectButton, SelectClearTrigger, SelectContent, SelectFooter, SelectGroup, SelectGroupLabel, SelectHeader, SelectInput, SelectOption, SelectOptionDescription, SelectOptionIndicator, SelectOptionText, SelectPositioner, SelectSearchInput, SelectSeparator, Selection, SelectionAll, SelectionBulkBar, SelectionItem, Separator, Skeleton, SplashScreen, SplitButton, Stack, Switch, SwitchControl, SwitchDescription, SwitchLabel, Table, TableActionBar, TableColumnMenu, TableColumnMenuHideItem, TableColumnMenuMoveLeftItem, TableColumnMenuMoveRightItem, TableColumnMenuPinItem, TableColumnMenuSortItem, TableEmptyState, TableSettingsMenu, TableSortTrigger, Tabs, TabsButton, TabsContent, TabsLineActions, TabsList, TabsSeparator, TabsTrigger, Tag, TagClose, TestIdProvider, Text, Textarea, ThemeProvider, Time, TimeInput, Toast, ToastActions, Toaster, ToggleButton, Tooltip, TooltipContent, TooltipTrigger, TopHeader, TopHeaderActions, TopHeaderLogo, Tour, UtilityPage, VStack, WallyIcon, ZonedDateTime, beaconStepEffect, cardVariants, createTableColumnHelper, datacenters, drawerContentVariants, drawerPositionerVariants, findFirstLinkPath, formatAsFilter, getLocalTimeZone, getResponseCodeCategory, parseDate, parseDateTime, parseTime, parseZonedDateTime, proxyTypes, pushPathname, sourceLabels, toaster, today, useCalendarContext, useDateFormat, useDateRangeContext, useDrawerContext, useLocationPathname, usePageHost, useRemoteShellContext, useSelectionContext, useTestId, useTheme, useTour, waitForStepEvent };
+export { Accordion, AccordionActions, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertClose, AlertContent, AlertControls, AlertDescription, AlertIcon, AlertTitle, AnimatedBackground, AppShell, AppShellHeader, AppShellRail, AppShellRemote, Attribute, AttributeActions, AttributeActionsContent, AttributeActionsItem, AttributeActionsTarget, AttributeLabel, AttributeLabelDescription, AttributeLabelInfo, AttributeValue, Badge, Banner, BannerClose, BannerContent, BannerControls, BannerDescription, BannerIcon, BannerLink, BannerTitle, Breadcrumbs, BreadcrumbsEllipsis, BreadcrumbsItem, BreadcrumbsScopeSwitcher, BreadcrumbsSeparator, Button, Calendar, CalendarApplyButton, CalendarBody, CalendarContent, CalendarDate, CalendarDateTime, CalendarDayName, CalendarFooter, CalendarFooterControls, CalendarGrid, CalendarGrids, CalendarHeader, CalendarInputHeader, CalendarKeyboardHints, CalendarPresetItem, CalendarPresets, CalendarProvider, CalendarResetButton, CalendarTrigger, Card, CardContent, CardFooter, CardHeader, CardTitle, Checkbox, CheckboxDescription, CheckboxGroup, CheckboxIndicator, CheckboxLabel, Code, Country, CountryFlag, CountryName, DAY_NAMES, DEFAULT_RANGE_PRESETS, DEFAULT_SINGLE_PRESETS, DateFormatProvider, DateInput, DateRangeEndValue, DateRangeInput, DateRangeProvider, DateRangeSeparator, DateRangeStartValue, Drawer, DrawerBody, DrawerClose, DrawerContent, DrawerFooter, DrawerFooterControls, DrawerHeader, DrawerPositioner, DrawerResizeHandle, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuContextTrigger, DropdownMenuFooter, DropdownMenuGroup, DropdownMenuInput, DropdownMenuItem, DropdownMenuItemContent, DropdownMenuItemDescription, DropdownMenuItemIcon, DropdownMenuItemText, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuTrigger, DropdownMenuTriggerItem, EmptyState, EmptyStateActions, EmptyStateDescription, EmptyStateIllustration, EmptyStateLink, EmptyStateMessage, EmptyStateTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, FilterInput, FilterInputChip, FilterInputFieldMenu, FilterInputOperatorMenu, Flex, FormatDateTime, HStack, HTTP_METHODS, HTTP_METHOD_COLOR, Heading, HttpMethod, Input, InputGroup, InputGroupAddon, InputGroupText, Ip, IpAddress, IpCountry, IpList, IpPort, IpProvider, Kbd, KbdGroup, Link, Loader, Logo, MONTH_NAMES, NavRail, NavRailBody, NavRailFooter, NavRailItem, NavRailSeparator, NavRailSkeleton, NumberInput, NumericBadge, OTPInput, OverflowTooltip, OverflowTooltipContent, Page, PageActions, PageContent, PageHeader, PageHostProvider, PageTitle, Pagination, PaginationEllipsis, PaginationItem, PaginationList, PaginationNext, PaginationPageSize, PaginationPrevious, ParameterPath, Popover, PopoverContent, PopoverTrigger, Progress, RESPONSE_CODE_COLOR, Radio, RadioDescription, RadioGroup, RadioIndicator, RadioLabel, RemoteShell, RemoteShellBreadcrumb, RemoteShellContent, RemoteShellPanel, ResponseCode, ScrollArea, ScrollAreaContent, ScrollAreaCorner, ScrollAreaScrollbar, ScrollAreaViewport, SegmentedControl, SegmentedControlButton, SegmentedControlItem, SegmentedControlSeparator, SegmentedTabs, SegmentedTabsButton, SegmentedTabsContent, SegmentedTabsList, SegmentedTabsSeparator, SegmentedTabsTrigger, SegmentedTabsTriggerButton, Select, SelectButton, SelectClearTrigger, SelectContent, SelectFooter, SelectGroup, SelectGroupLabel, SelectHeader, SelectInput, SelectOption, SelectOptionDescription, SelectOptionIndicator, SelectOptionText, SelectPositioner, SelectSearchInput, SelectSeparator, Selection, SelectionAll, SelectionBulkBar, SelectionItem, Separator, Skeleton, SplashScreen, SplitButton, Stack, Switch, SwitchControl, SwitchDescription, SwitchLabel, Table, TableActionBar, TableColumnMenu, TableColumnMenuHideItem, TableColumnMenuMoveLeftItem, TableColumnMenuMoveRightItem, TableColumnMenuPinItem, TableColumnMenuSortItem, TableEmptyState, TableSettingsMenu, TableSortTrigger, Tabs, TabsButton, TabsContent, TabsLineActions, TabsList, TabsSeparator, TabsTrigger, Tag, TagClose, TestIdProvider, Text, Textarea, ThemeProvider, Time, TimeInput, Toast, ToastActions, Toaster, ToggleButton, Tooltip, TooltipContent, TooltipTrigger, TopHeader, TopHeaderActions, TopHeaderLogo, Tour, UtilityPage, VStack, WallyIcon, ZonedDateTime, beaconStepEffect, cardVariants, createTableColumnHelper, datacenters, drawerContentVariants, drawerPositionerVariants, findFirstLinkPath, formatAsFilter, getLocalTimeZone, getResponseCodeCategory, parseDate, parseDateTime, parseTime, parseZonedDateTime, proxyTypes, pushPathname, sourceLabels, toaster, today, useCalendarContext, useDateFormat, useDateRangeContext, useDrawerContext, useLocationPathname, usePageHost, usePagination, usePaginationContext, usePaginationSizeContext, useRemoteShellContext, useSelectionContext, useTestId, useTheme, useTour, waitForStepEvent };