@stridge/noctis 1.0.0-beta.4 → 1.0.0-beta.5

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

@@ -0,0 +1,3 @@
+import { PaginationLabels, PaginationSize } from "./pagination.types.js";
+import { Pagination } from "./pagination.js";
+import { PaginationDataAttributes } from "./pagination.slots.js";

package/dist/components/pagination/pagination.context.js

@@ -0,0 +1,16 @@
+"use client";
+import { createContext, use } from "react";
+//#region src/components/pagination/pagination.context.ts
+const PaginationContext = createContext(null);
+const PaginationProvider = PaginationContext.Provider;
+/**
+* Read the enclosing `Pagination.Root` state. Every compound part is meaningless on its own (it needs
+* the page model and shared labels), so this throws a part-named error when used outside the root.
+*/
+function usePaginationContext(part) {
+	const context = use(PaginationContext);
+	if (!context) throw new Error(`Pagination.${part} must be rendered inside a <Pagination.Root>.`);
+	return context;
+}
+//#endregion
+export { PaginationProvider, usePaginationContext };

package/dist/components/pagination/pagination.d.ts

@@ -0,0 +1,217 @@
+import { Button } from "../button/button.js";
+import { PaginationLabels, PaginationSize } from "./pagination.types.js";
+import { PaginationPartProps, PaginationRootPropsArgs, controlsProps, infoProps, pageProps, pageSizeLabelProps, pageSizeProps, rootProps, separatorProps } from "./pagination.props.js";
+import { ComponentProps, ReactElement, ReactNode } from "react";
+
+//#region src/components/pagination/pagination.d.ts
+/**
+ * Page navigation: a row of nav controls (a welded `ButtonGroup` of First/Previous/Next/Last buttons),
+ * an optional editable page field, a "Showing X–Y of Z" info line, and a page-size picker — composed
+ * from the shipped `Button`, `ButtonGroup`, `Input`, and `Select`. `Pagination.Root` is controlled:
+ * pass `page` + `onPageChange`, and `total` + `perPage` (so the info line and the last-page bound can
+ * be computed) or an explicit `pageCount`. Every part reads the shared model through context, so the
+ * bounds-disabling and clamping are handled for you.
+ *
+ * @see {@link Pagination.Root.Props}
+ */
+declare function PaginationRoot({
+  page,
+  onPageChange,
+  total,
+  perPage,
+  pageCount: pageCountProp,
+  size,
+  labels: labelsProp,
+  className,
+  children,
+  ...props
+}: Pagination.Root.Props): ReactElement;
+/** The render-prop state `Pagination.Info` exposes for custom info text. */
+interface PaginationInfoState {
+  /** Current page, 1-indexed. */
+  page: number;
+  /** The last reachable page. */
+  pageCount: number;
+  /** Items per page, when known. */
+  perPage?: number;
+  /** Total item count, when known. */
+  total?: number;
+  /** First item index on the current page (1-indexed), or 0 when the set is empty. */
+  from: number;
+  /** Last item index on the current page. */
+  to: number;
+}
+/**
+ * The "Showing X–Y of Z" status line, announced politely as the page changes. Renders nothing unless
+ * `total` and `perPage` are known on the root — or pass a render function as children for custom text
+ * (e.g. "Page X of Y"). Quieter than the controls by design.
+ */
+declare function PaginationInfo({
+  children,
+  className,
+  ...props
+}: Pagination.Info.Props): ReactElement | null;
+/**
+ * The page-size cluster — a layout wrapper that holds a `Pagination.PageSizeLabel` and a
+ * `Pagination.PageSizeSelect` side by side. Compose them inside; the label and select are separate so
+ * the consumer can reorder, restyle, translate, or drop either independently.
+ */
+declare function PaginationPageSize({
+  className,
+  children,
+  ...props
+}: Pagination.PageSize.Props): ReactElement;
+/**
+ * The label beside the page-size select (visible "Per page" micro-copy). Defaults to the localized
+ * label; pass children to override the text. Purely visual — the select carries its own accessible name.
+ */
+declare function PaginationPageSizeLabel({
+  className,
+  children,
+  ...props
+}: Pagination.PageSizeLabel.Props): ReactElement;
+/**
+ * The page-size `Select` of "items per page" choices. Controlled via `value` + `onValueChange`;
+ * resetting the page to 1 on change is the consumer's call (do it in the handler).
+ */
+declare function PaginationPageSizeSelect({
+  value,
+  onValueChange,
+  options
+}: Pagination.PageSizeSelect.Props): ReactElement;
+/**
+ * The navigation landmark wrapping a welded `ButtonGroup` of nav buttons. Compose `Pagination.First`,
+ * `Pagination.Previous`, `Pagination.Next`, `Pagination.Last`, and/or `Pagination.Page` inside — use
+ * only Previous/Next for a simple control, or add First/Last/Page for the full set.
+ */
+declare function PaginationControls({
+  className,
+  children,
+  ...props
+}: Pagination.Controls.Props): ReactElement;
+/** Jump to the first page. Disabled on page 1. */
+declare function PaginationFirst(props: Pagination.NavButton.Props): ReactElement;
+/** Step to the previous page. Disabled on page 1. */
+declare function PaginationPrevious(props: Pagination.NavButton.Props): ReactElement;
+/** Step to the next page. Disabled on the last page. */
+declare function PaginationNext(props: Pagination.NavButton.Props): ReactElement;
+/** Jump to the last page. Disabled on the last page. */
+declare function PaginationLast(props: Pagination.NavButton.Props): ReactElement;
+/**
+ * An editable page-number field (the "full" affordance). Type a page and press Enter or blur to commit;
+ * the value is clamped to the valid range and snaps back if cleared. Sits beside the nav buttons.
+ */
+declare function PaginationPage({
+  className,
+  ...props
+}: Pagination.Page.Props): ReactElement;
+/** A vertical hairline between pagination clusters. Purely decorative — a quiet visual rule, hidden
+ * from assistive tech (the clusters are already distinct landmarks/labels). */
+declare function PaginationSeparator({
+  className,
+  ...props
+}: Pagination.Separator.Props): ReactElement;
+/**
+ * Page navigation controls. `Pagination.Root` owns the controlled page model and shares it with the
+ * parts: `Pagination.Controls` (the welded nav `ButtonGroup`) hosting `Pagination.First` / `Previous` /
+ * `Next` / `Last` and the editable `Pagination.Page`, plus the `Pagination.Info` status line, the
+ * `Pagination.PageSize` picker, and the `Pagination.Separator` divider.
+ *
+ * The runtime compound is a plain object (kept tree-shakeable); per-part prop types are exposed through
+ * the matching `Pagination` namespace — e.g. `Pagination.Root.Props`.
+ */
+declare const Pagination: {
+  /** Owns the controlled page model + shared context. `Pagination.Root.props({ size })` → its prop bag. */Root: typeof PaginationRoot & {
+    props: typeof rootProps;
+  }; /** The "Showing X–Y of Z" status line. `Pagination.Info.props()` → its prop bag. */
+  Info: typeof PaginationInfo & {
+    props: typeof infoProps;
+  }; /** The page-size cluster (compose `PageSizeLabel` + `PageSizeSelect`). `Pagination.PageSize.props()` → its prop bag. */
+  PageSize: typeof PaginationPageSize & {
+    props: typeof pageSizeProps;
+  }; /** The page-size label. `Pagination.PageSizeLabel.props()` → its prop bag. */
+  PageSizeLabel: typeof PaginationPageSizeLabel & {
+    props: typeof pageSizeLabelProps;
+  }; /** The page-size select control. */
+  PageSizeSelect: typeof PaginationPageSizeSelect; /** The nav landmark + welded `ButtonGroup`. `Pagination.Controls.props()` → its prop bag. */
+  Controls: typeof PaginationControls & {
+    props: typeof controlsProps;
+  }; /** First-page button. */
+  First: typeof PaginationFirst; /** Previous-page button. */
+  Previous: typeof PaginationPrevious; /** Next-page button. */
+  Next: typeof PaginationNext; /** Last-page button. */
+  Last: typeof PaginationLast; /** The editable page-number field. `Pagination.Page.props()` → its prop bag. */
+  Page: typeof PaginationPage & {
+    props: typeof pageProps;
+  }; /** A vertical divider between clusters. `Pagination.Separator.props()` → its prop bag. */
+  Separator: typeof PaginationSeparator & {
+    props: typeof separatorProps;
+  };
+};
+/**
+ * Per-part prop types. Types-only — it emits no runtime code and merges with the `Pagination` object
+ * above, so `Pagination.Root` is the component value while `Pagination.Root.Props` is its prop type.
+ */
+declare namespace Pagination {
+  /** Control scale — `sm` | `md`. */
+  type Size = PaginationSize;
+  /** The accessible-name + micro-copy overrides. */
+  type Labels = PaginationLabels;
+  /** The spreadable data-attribute prop bag every owned `Pagination.*.props()` returns (D12). */
+  type PartProps = PaginationPartProps;
+  namespace Root {
+    type Props = Omit<ComponentProps<"div">, "onChange"> & {
+      /**
+       * Current page, 1-indexed.
+       * @default 1
+       */
+      page?: number; /** Called with the next page (already clamped to `[1, pageCount]`) when the user navigates. */
+      onPageChange?: (page: number) => void; /** Total item count across all pages — drives the info range and the last-page bound. */
+      total?: number; /** Items shown per page — drives the info range and the last-page bound. */
+      perPage?: number; /** The last reachable page, when you'd rather supply it than derive it from `total`/`perPage`. */
+      pageCount?: number;
+      /**
+       * Control scale, fed to the hosted Button/Input/Select.
+       * @default "md"
+       */
+      size?: PaginationSize; /** Per-instance overrides for the accessible names + micro-copy. */
+      labels?: PaginationLabels;
+    };
+    /** Argument to the `Pagination.Root.props(...)` escape-hatch helper. */
+    type PropsArgs = PaginationRootPropsArgs;
+  }
+  namespace Info {
+    type Props = Omit<ComponentProps<"div">, "children"> & {
+      /** Render function for custom info text; omit for the default "Showing X–Y of Z". */children?: (state: PaginationInfoState) => ReactNode;
+    };
+  }
+  namespace PageSize {
+    /** The cluster wrapper — compose `Pagination.PageSizeLabel` and `Pagination.PageSizeSelect` inside. */
+    type Props = ComponentProps<"div">;
+  }
+  namespace PageSizeLabel {
+    /** The visible "Per page" label; children override the default localized text. */
+    type Props = ComponentProps<"span">;
+  }
+  namespace PageSizeSelect {
+    type Props = {
+      /** The current page size. */value: number; /** Called with the chosen page size. */
+      onValueChange: (size: number) => void; /** The available page-size choices. @default [10, 25, 50, 100] */
+      options?: readonly number[];
+    };
+  }
+  namespace Controls {
+    type Props = ComponentProps<"nav">;
+  }
+  namespace NavButton {
+    type Props = Omit<Button.Props, "iconOnly" | "startIcon" | "endIcon" | "onClick" | "children">;
+  }
+  namespace Page {
+    type Props = ComponentProps<"div">;
+  }
+  namespace Separator {
+    type Props = ComponentProps<"div">;
+  }
+}
+//#endregion
+export { Pagination };

package/dist/components/pagination/pagination.js

@@ -0,0 +1,333 @@
+"use client";
+import { Icon } from "../../icons/icon.js";
+import { ChevronLeftIcon, ChevronRightIcon, ChevronsLeftIcon, ChevronsRightIcon } from "../../icons/glyphs.js";
+import { useInjectedLabels, useNoctisStringFormatter } from "../../core/use-injected-labels.js";
+import { Button } from "../button/button.js";
+import { Input } from "../input/input.js";
+import { Select } from "../select/select.js";
+import { ButtonGroup } from "../button-group/button-group.js";
+import { PaginationProvider, usePaginationContext } from "./pagination.context.js";
+import { PAGINATION_SLOTS } from "./pagination.slots.js";
+import { controlsProps, infoProps, pageProps, pageSizeLabelProps, pageSizeProps, rootProps, separatorProps } from "./pagination.props.js";
+import { useEffect, useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/pagination/pagination.tsx
+/** Default page-size choices, matching the common "rows per page" ladder. */
+const DEFAULT_PAGE_SIZE_OPTIONS = [
+	10,
+	25,
+	50,
+	100
+];
+/** English fallbacks for every accessible name + micro-copy; overridden by locale dict, then per-instance. */
+const DEFAULT_LABELS = {
+	navigation: "Pagination",
+	firstPage: "First page",
+	previousPage: "Previous page",
+	nextPage: "Next page",
+	lastPage: "Last page",
+	pageNumber: "Page number",
+	pageSize: "Page size",
+	perPage: "Per page"
+};
+/** Each label field → its `@stridge/noctis-intl` catalog key. */
+const LABEL_KEYS = {
+	navigation: "pagination.navigation",
+	firstPage: "pagination.firstPage",
+	previousPage: "pagination.previousPage",
+	nextPage: "pagination.nextPage",
+	lastPage: "pagination.lastPage",
+	pageNumber: "pagination.pageNumber",
+	pageSize: "pagination.pageSize",
+	perPage: "pagination.perPage"
+};
+/** Pagination's `sm`/`md` → the hosted Button/Input size (which share the `sm`/`md` rungs). */
+const controlSize = (size) => size;
+/** Pagination's `sm`/`md` → the hosted Icon size. */
+const glyphSize = (size) => size;
+/**
+* Page navigation: a row of nav controls (a welded `ButtonGroup` of First/Previous/Next/Last buttons),
+* an optional editable page field, a "Showing X–Y of Z" info line, and a page-size picker — composed
+* from the shipped `Button`, `ButtonGroup`, `Input`, and `Select`. `Pagination.Root` is controlled:
+* pass `page` + `onPageChange`, and `total` + `perPage` (so the info line and the last-page bound can
+* be computed) or an explicit `pageCount`. Every part reads the shared model through context, so the
+* bounds-disabling and clamping are handled for you.
+*
+* @see {@link Pagination.Root.Props}
+*/
+function PaginationRoot({ page = 1, onPageChange, total, perPage, pageCount: pageCountProp, size = "md", labels: labelsProp, className, children, ...props }) {
+	const labels = useInjectedLabels(DEFAULT_LABELS, LABEL_KEYS, labelsProp);
+	const pageCount = Math.max(1, pageCountProp ?? (total != null && perPage ? Math.ceil(total / perPage) : 1));
+	const value = useMemo(() => {
+		const goToPage = (next) => {
+			const clamped = Math.min(Math.max(Math.trunc(next), 1), pageCount);
+			if (clamped !== page) onPageChange?.(clamped);
+		};
+		return {
+			page,
+			pageCount,
+			perPage,
+			total,
+			size,
+			labels,
+			goToPage
+		};
+	}, [
+		page,
+		pageCount,
+		perPage,
+		total,
+		size,
+		labels,
+		onPageChange
+	]);
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": PAGINATION_SLOTS.root,
+		"data-size": size,
+		className,
+		...props,
+		children: /* @__PURE__ */ jsx(PaginationProvider, {
+			value,
+			children
+		})
+	});
+}
+/**
+* The "Showing X–Y of Z" status line, announced politely as the page changes. Renders nothing unless
+* `total` and `perPage` are known on the root — or pass a render function as children for custom text
+* (e.g. "Page X of Y"). Quieter than the controls by design.
+*/
+function PaginationInfo({ children, className, ...props }) {
+	const { page, pageCount, perPage, total } = usePaginationContext("Info");
+	const formatter = useNoctisStringFormatter();
+	const hasRange = total != null && perPage != null;
+	const from = !hasRange || total === 0 ? 0 : (page - 1) * perPage + 1;
+	const to = hasRange ? Math.min(page * perPage, total) : 0;
+	const content = children ? children({
+		page,
+		pageCount,
+		perPage,
+		total,
+		from,
+		to
+	}) : hasRange ? formatter.format("pagination.showing", {
+		from,
+		to,
+		total
+	}) : null;
+	if (content == null) return null;
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": PAGINATION_SLOTS.info,
+		"aria-live": "polite",
+		"aria-atomic": "true",
+		className,
+		...props,
+		children: content
+	});
+}
+/**
+* The page-size cluster — a layout wrapper that holds a `Pagination.PageSizeLabel` and a
+* `Pagination.PageSizeSelect` side by side. Compose them inside; the label and select are separate so
+* the consumer can reorder, restyle, translate, or drop either independently.
+*/
+function PaginationPageSize({ className, children, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": PAGINATION_SLOTS.pageSize,
+		className,
+		...props,
+		children
+	});
+}
+/**
+* The label beside the page-size select (visible "Per page" micro-copy). Defaults to the localized
+* label; pass children to override the text. Purely visual — the select carries its own accessible name.
+*/
+function PaginationPageSizeLabel({ className, children, ...props }) {
+	const { labels } = usePaginationContext("PageSizeLabel");
+	return /* @__PURE__ */ jsx("span", {
+		"data-slot": PAGINATION_SLOTS.pageSizeLabel,
+		className,
+		...props,
+		children: children ?? labels.perPage
+	});
+}
+/**
+* The page-size `Select` of "items per page" choices. Controlled via `value` + `onValueChange`;
+* resetting the page to 1 on change is the consumer's call (do it in the handler).
+*/
+function PaginationPageSizeSelect({ value, onValueChange, options = DEFAULT_PAGE_SIZE_OPTIONS }) {
+	const { labels } = usePaginationContext("PageSizeSelect");
+	const items = useMemo(() => Object.fromEntries(options.map((option) => [option, String(option)])), [options]);
+	return /* @__PURE__ */ jsxs(Select.Root, {
+		items,
+		value,
+		onValueChange: (next) => onValueChange(next),
+		children: [/* @__PURE__ */ jsxs(Select.Trigger, {
+			"aria-label": labels.pageSize,
+			children: [/* @__PURE__ */ jsx(Select.Value, {}), /* @__PURE__ */ jsx(Select.Icon, {})]
+		}), /* @__PURE__ */ jsx(Select.Popup, { children: options.map((option) => /* @__PURE__ */ jsx(Select.Item, {
+			value: option,
+			children: option
+		}, option)) })]
+	});
+}
+/**
+* The navigation landmark wrapping a welded `ButtonGroup` of nav buttons. Compose `Pagination.First`,
+* `Pagination.Previous`, `Pagination.Next`, `Pagination.Last`, and/or `Pagination.Page` inside — use
+* only Previous/Next for a simple control, or add First/Last/Page for the full set.
+*/
+function PaginationControls({ className, children, ...props }) {
+	const { size, labels } = usePaginationContext("Controls");
+	return /* @__PURE__ */ jsx("nav", {
+		"aria-label": labels.navigation,
+		"data-slot": PAGINATION_SLOTS.controls,
+		className,
+		...props,
+		children: /* @__PURE__ */ jsx(ButtonGroup, {
+			variant: "secondary",
+			size: controlSize(size),
+			children
+		})
+	});
+}
+/** Shared icon-only nav button: bounds-disabled, clamping `goToPage`, RTL-mirrored chevron. */
+function NavButton({ glyph, label, target, disabled, "aria-label": ariaLabel, className, ...props }) {
+	const { size, goToPage } = usePaginationContext("Controls");
+	return /* @__PURE__ */ jsx(Button, {
+		iconOnly: true,
+		"aria-label": ariaLabel ?? label,
+		disabled,
+		className,
+		...props,
+		onClick: () => goToPage(target),
+		children: /* @__PURE__ */ jsx(Icon, {
+			icon: glyph,
+			directional: true,
+			size: glyphSize(size)
+		})
+	});
+}
+/** Jump to the first page. Disabled on page 1. */
+function PaginationFirst(props) {
+	const { page, labels } = usePaginationContext("First");
+	return /* @__PURE__ */ jsx(NavButton, {
+		glyph: ChevronsLeftIcon,
+		label: labels.firstPage,
+		target: 1,
+		disabled: page <= 1,
+		...props
+	});
+}
+/** Step to the previous page. Disabled on page 1. */
+function PaginationPrevious(props) {
+	const { page, labels } = usePaginationContext("Previous");
+	return /* @__PURE__ */ jsx(NavButton, {
+		glyph: ChevronLeftIcon,
+		label: labels.previousPage,
+		target: page - 1,
+		disabled: page <= 1,
+		...props
+	});
+}
+/** Step to the next page. Disabled on the last page. */
+function PaginationNext(props) {
+	const { page, pageCount, labels } = usePaginationContext("Next");
+	return /* @__PURE__ */ jsx(NavButton, {
+		glyph: ChevronRightIcon,
+		label: labels.nextPage,
+		target: page + 1,
+		disabled: page >= pageCount,
+		...props
+	});
+}
+/** Jump to the last page. Disabled on the last page. */
+function PaginationLast(props) {
+	const { page, pageCount, labels } = usePaginationContext("Last");
+	return /* @__PURE__ */ jsx(NavButton, {
+		glyph: ChevronsRightIcon,
+		label: labels.lastPage,
+		target: pageCount,
+		disabled: page >= pageCount,
+		...props
+	});
+}
+/**
+* An editable page-number field (the "full" affordance). Type a page and press Enter or blur to commit;
+* the value is clamped to the valid range and snaps back if cleared. Sits beside the nav buttons.
+*/
+function PaginationPage({ className, ...props }) {
+	const { page, labels, goToPage } = usePaginationContext("Page");
+	const [draft, setDraft] = useState(String(page));
+	useEffect(() => {
+		setDraft(String(page));
+	}, [page]);
+	const commit = () => {
+		const next = Number(draft);
+		if (draft.trim() !== "" && Number.isFinite(next)) goToPage(next);
+		else setDraft(String(page));
+	};
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": PAGINATION_SLOTS.page,
+		"data-button-group-item": "",
+		className,
+		...props,
+		children: /* @__PURE__ */ jsx(Input.Root, { children: /* @__PURE__ */ jsx(Input.Control, {
+			"aria-label": labels.pageNumber,
+			inputMode: "numeric",
+			autoComplete: "off",
+			value: draft,
+			onChange: (event) => setDraft(event.currentTarget.value),
+			onBlur: commit,
+			onKeyDown: (event) => {
+				if (event.key === "Enter") commit();
+			}
+		}) })
+	});
+}
+/** A vertical hairline between pagination clusters. Purely decorative — a quiet visual rule, hidden
+* from assistive tech (the clusters are already distinct landmarks/labels). */
+function PaginationSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": PAGINATION_SLOTS.separator,
+		"aria-hidden": "true",
+		className,
+		...props
+	});
+}
+/**
+* Page navigation controls. `Pagination.Root` owns the controlled page model and shares it with the
+* parts: `Pagination.Controls` (the welded nav `ButtonGroup`) hosting `Pagination.First` / `Previous` /
+* `Next` / `Last` and the editable `Pagination.Page`, plus the `Pagination.Info` status line, the
+* `Pagination.PageSize` picker, and the `Pagination.Separator` divider.
+*
+* The runtime compound is a plain object (kept tree-shakeable); per-part prop types are exposed through
+* the matching `Pagination` namespace — e.g. `Pagination.Root.Props`.
+*/
+const Pagination = {
+	/** Owns the controlled page model + shared context. `Pagination.Root.props({ size })` → its prop bag. */
+	Root: Object.assign(PaginationRoot, { props: rootProps }),
+	/** The "Showing X–Y of Z" status line. `Pagination.Info.props()` → its prop bag. */
+	Info: Object.assign(PaginationInfo, { props: infoProps }),
+	/** The page-size cluster (compose `PageSizeLabel` + `PageSizeSelect`). `Pagination.PageSize.props()` → its prop bag. */
+	PageSize: Object.assign(PaginationPageSize, { props: pageSizeProps }),
+	/** The page-size label. `Pagination.PageSizeLabel.props()` → its prop bag. */
+	PageSizeLabel: Object.assign(PaginationPageSizeLabel, { props: pageSizeLabelProps }),
+	/** The page-size select control. */
+	PageSizeSelect: PaginationPageSizeSelect,
+	/** The nav landmark + welded `ButtonGroup`. `Pagination.Controls.props()` → its prop bag. */
+	Controls: Object.assign(PaginationControls, { props: controlsProps }),
+	/** First-page button. */
+	First: PaginationFirst,
+	/** Previous-page button. */
+	Previous: PaginationPrevious,
+	/** Next-page button. */
+	Next: PaginationNext,
+	/** Last-page button. */
+	Last: PaginationLast,
+	/** The editable page-number field. `Pagination.Page.props()` → its prop bag. */
+	Page: Object.assign(PaginationPage, { props: pageProps }),
+	/** A vertical divider between clusters. `Pagination.Separator.props()` → its prop bag. */
+	Separator: Object.assign(PaginationSeparator, { props: separatorProps })
+};
+//#endregion
+export { Pagination };

package/dist/components/pagination/pagination.props.d.ts

@@ -0,0 +1,51 @@
+import { PaginationSize } from "./pagination.types.js";
+
+//#region src/components/pagination/pagination.props.d.ts
+/** A spreadable data-attribute prop bag — the shape every `Pagination.*.props()` returns. */
+type PaginationPartProps = {
+  /** The slot value the matching `pagination.css` rules anchor on. */"data-slot": string; /** Forwarded verbatim — styling is attribute-driven, so this is an optional consumer passthrough. */
+  className?: string; /** A data-attribute present (string) or absent (`undefined`); never `false`. */
+  [attr: `data-${string}`]: string | undefined;
+};
+interface BasePropsArgs {
+  /** Forwarded verbatim onto the returned prop bag. */
+  className?: string;
+}
+/** Argument to `Pagination.Root.props(...)` — the control scale fed to the hosted controls. */
+interface PaginationRootPropsArgs extends BasePropsArgs {
+  /** Control scale. @default "md" */
+  size?: PaginationSize;
+}
+/** Argument to a stateless Pagination part's `.props(...)`. */
+type PaginationStatelessPropsArgs = BasePropsArgs;
+/** Root prop bag: `data-slot` plus the `data-size` the layout + hosted controls read. */
+declare function rootProps({
+  size,
+  className
+}?: PaginationRootPropsArgs): PaginationPartProps;
+/** Info-line prop bag: just the slot anchor. */
+declare function infoProps({
+  className
+}?: PaginationStatelessPropsArgs): PaginationPartProps;
+/** Page-size cluster prop bag: just the slot anchor. */
+declare function pageSizeProps({
+  className
+}?: PaginationStatelessPropsArgs): PaginationPartProps;
+/** Page-size label prop bag: just the slot anchor. */
+declare function pageSizeLabelProps({
+  className
+}?: PaginationStatelessPropsArgs): PaginationPartProps;
+/** Page-field cluster prop bag: just the slot anchor. */
+declare function pageProps({
+  className
+}?: PaginationStatelessPropsArgs): PaginationPartProps;
+/** Controls cluster prop bag: just the slot anchor. */
+declare function controlsProps({
+  className
+}?: PaginationStatelessPropsArgs): PaginationPartProps;
+/** Separator prop bag: just the slot anchor. */
+declare function separatorProps({
+  className
+}?: PaginationStatelessPropsArgs): PaginationPartProps;
+//#endregion
+export { PaginationPartProps, PaginationRootPropsArgs, controlsProps, infoProps, pageProps, pageSizeLabelProps, pageSizeProps, rootProps, separatorProps };

package/dist/components/pagination/pagination.props.js

@@ -0,0 +1,49 @@
+import { PAGINATION_SLOTS } from "./pagination.slots.js";
+//#region src/components/pagination/pagination.props.ts
+/**
+* The D12 unified variant contract for Pagination — the data-attribute-native styling helpers.
+*
+* Each part Pagination *owns* exposes a `props(...)` builder returning a spreadable
+* `{ "data-slot": "noctis-pagination-<part>", ...dataAttrs }` bag the precompiled `pagination.css` keys
+* off, so spreading it onto a foreign element styles that element as the part. The hosted controls
+* (`Button`/`ButtonGroup`/`Input`/`Select`) are composed in the orchestration and keep their own
+* `.props()`; these helpers cover only Pagination's own layout slots. An optional `className` is
+* forwarded verbatim.
+*/
+const withClassName = (bag, className) => className === void 0 ? bag : {
+	...bag,
+	className
+};
+/** Root prop bag: `data-slot` plus the `data-size` the layout + hosted controls read. */
+function rootProps({ size = "md", className } = {}) {
+	return withClassName({
+		"data-slot": PAGINATION_SLOTS.root,
+		"data-size": size
+	}, className);
+}
+/** Info-line prop bag: just the slot anchor. */
+function infoProps({ className } = {}) {
+	return withClassName({ "data-slot": PAGINATION_SLOTS.info }, className);
+}
+/** Page-size cluster prop bag: just the slot anchor. */
+function pageSizeProps({ className } = {}) {
+	return withClassName({ "data-slot": PAGINATION_SLOTS.pageSize }, className);
+}
+/** Page-size label prop bag: just the slot anchor. */
+function pageSizeLabelProps({ className } = {}) {
+	return withClassName({ "data-slot": PAGINATION_SLOTS.pageSizeLabel }, className);
+}
+/** Page-field cluster prop bag: just the slot anchor. */
+function pageProps({ className } = {}) {
+	return withClassName({ "data-slot": PAGINATION_SLOTS.page }, className);
+}
+/** Controls cluster prop bag: just the slot anchor. */
+function controlsProps({ className } = {}) {
+	return withClassName({ "data-slot": PAGINATION_SLOTS.controls }, className);
+}
+/** Separator prop bag: just the slot anchor. */
+function separatorProps({ className } = {}) {
+	return withClassName({ "data-slot": PAGINATION_SLOTS.separator }, className);
+}
+//#endregion
+export { controlsProps, infoProps, pageProps, pageSizeLabelProps, pageSizeProps, rootProps, separatorProps };

package/dist/components/pagination/pagination.slots.d.ts

@@ -0,0 +1,16 @@
+//#region src/components/pagination/pagination.slots.d.ts
+/**
+ * The `data-*` hooks `Pagination` stamps on its own parts, for host-side styling and tests. The
+ * `data-size` axis (on the root) carries the recipe the precompiled `pagination.css` keys its layout
+ * off and that the orchestration feeds to the hosted controls. The nav buttons render `Button`, so
+ * their bounds-disabled state is the `Button`'s own `data-disabled` (stamped by the underlying control),
+ * not a Pagination attribute.
+ */
+declare enum PaginationDataAttributes {
+  /** The root navigation container. */
+  slot = "data-slot",
+  /** The control scale — `sm` | `md` (default); fed to the hosted Button/Input/Select. */
+  size = "data-size"
+}
+//#endregion
+export { PaginationDataAttributes };

package/dist/components/pagination/pagination.slots.js

@@ -0,0 +1,32 @@
+//#region src/components/pagination/pagination.slots.ts
+/**
+* The slot vocabulary every `Pagination` part stamps as its `data-slot`. The authored source the
+* orchestration file reads from, kebab-cased `{component}[-{part}]` under the `noctis-` prefix;
+* SLOTS.md still generates from the token-graph declarations. The hosted controls (`Button`,
+* `ButtonGroup`, `Input`, `Select`) keep their own slots — these mark only Pagination's own structure.
+*/
+const PAGINATION_SLOTS = {
+	root: "noctis-pagination",
+	info: "noctis-pagination-info",
+	pageSize: "noctis-pagination-page-size",
+	pageSizeLabel: "noctis-pagination-page-size-label",
+	page: "noctis-pagination-page",
+	controls: "noctis-pagination-controls",
+	separator: "noctis-pagination-separator"
+};
+/**
+* The `data-*` hooks `Pagination` stamps on its own parts, for host-side styling and tests. The
+* `data-size` axis (on the root) carries the recipe the precompiled `pagination.css` keys its layout
+* off and that the orchestration feeds to the hosted controls. The nav buttons render `Button`, so
+* their bounds-disabled state is the `Button`'s own `data-disabled` (stamped by the underlying control),
+* not a Pagination attribute.
+*/
+let PaginationDataAttributes = /* @__PURE__ */ function(PaginationDataAttributes) {
+	/** The root navigation container. */
+	PaginationDataAttributes["slot"] = "data-slot";
+	/** The control scale — `sm` | `md` (default); fed to the hosted Button/Input/Select. */
+	PaginationDataAttributes["size"] = "data-size";
+	return PaginationDataAttributes;
+}({});
+//#endregion
+export { PAGINATION_SLOTS, PaginationDataAttributes };

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

@@ -0,0 +1,24 @@
+//#region src/components/pagination/pagination.types.d.ts
+/**
+ * The size vocabulary and the i18n label shape `Pagination` paints. Authored source of truth since
+ * styling is precompiled in `pagination.css`. Types-only: no runtime code.
+ */
+/** The pagination control scale — `sm` (dense rows) or `md` (the default). Fed to the hosted controls. */
+type PaginationSize = "sm" | "md";
+/**
+ * The accessible names and visible micro-copy for `Pagination`. Every field has an English default
+ * (overridden per-instance via the `labels` prop, or globally through `@stridge/noctis-intl`). Declared
+ * as a `type` (not an `interface`) so it carries the implicit index signature `useInjectedLabels` needs.
+ */
+type PaginationLabels = {
+  /** Accessible name for the navigation landmark. @default "Pagination" */navigation?: string; /** Accessible name for the first-page button. @default "First page" */
+  firstPage?: string; /** Accessible name for the previous-page button. @default "Previous page" */
+  previousPage?: string; /** Accessible name for the next-page button. @default "Next page" */
+  nextPage?: string; /** Accessible name for the last-page button. @default "Last page" */
+  lastPage?: string; /** Accessible name for the page-number input. @default "Page number" */
+  pageNumber?: string; /** Accessible name for the page-size select. @default "Page size" */
+  pageSize?: string; /** Visible label before the page-size select. @default "Per page" */
+  perPage?: string;
+};
+//#endregion
+export { PaginationLabels, PaginationSize };

package/dist/icons/glyphs.js

@@ -1,2 +1,2 @@
-import { Check as CheckIcon, ChevronDown as ChevronDownIcon, ChevronRight as ChevronRightIcon, ChevronUp as ChevronUpIcon, ChevronsUpDown as ChevronsUpDownIcon, File as FileIcon, LoaderCircle as SpinnerIcon, Minus as MinusIcon, MoreHorizontal as MoreHorizontalIcon, Pipette as PipetteIcon, Plus as PlusIcon, Search as SearchIcon, Terminal as TerminalIcon, X as XIcon } from "lucide-react";
-export { CheckIcon, ChevronDownIcon, ChevronRightIcon, ChevronUpIcon, ChevronsUpDownIcon, FileIcon, MinusIcon, MoreHorizontalIcon, PipetteIcon, PlusIcon, SearchIcon, SpinnerIcon, TerminalIcon, XIcon };
+import { Check as CheckIcon, ChevronDown as ChevronDownIcon, ChevronLeft as ChevronLeftIcon, ChevronRight as ChevronRightIcon, ChevronUp as ChevronUpIcon, ChevronsLeft as ChevronsLeftIcon, ChevronsRight as ChevronsRightIcon, ChevronsUpDown as ChevronsUpDownIcon, File as FileIcon, LoaderCircle as SpinnerIcon, Minus as MinusIcon, MoreHorizontal as MoreHorizontalIcon, Pipette as PipetteIcon, Plus as PlusIcon, Search as SearchIcon, Terminal as TerminalIcon, X as XIcon } from "lucide-react";
+export { CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, ChevronsLeftIcon, ChevronsRightIcon, ChevronsUpDownIcon, FileIcon, MinusIcon, MoreHorizontalIcon, PipetteIcon, PlusIcon, SearchIcon, SpinnerIcon, TerminalIcon, XIcon };

package/dist/index.d.ts

@@ -74,6 +74,9 @@ import { NumberFieldDataAttributes } from "./components/number-field/number-fiel
 import { OtpFieldSize } from "./components/otp-field/otp-field.props.js";
 import { OtpField } from "./components/otp-field/otp-field.js";
 import { OtpFieldDataAttributes } from "./components/otp-field/otp-field.slots.js";
+import { PaginationLabels, PaginationSize } from "./components/pagination/pagination.types.js";
+import { Pagination } from "./components/pagination/pagination.js";
+import { PaginationDataAttributes } from "./components/pagination/pagination.slots.js";
 import { PreviewCard } from "./components/preview-card/preview-card.js";
 import { PreviewCardDataAttributes } from "./components/preview-card/preview-card.slots.js";
 import { Popover } from "./components/popover/popover.js";
@@ -126,4 +129,4 @@ import { NoctisProvider } from "./core/noctis-provider.js";
 /** Package identifier — the workspace-resolution marker consumed by the app scaffold. */
 declare const UI_PACKAGE: "@stridge/noctis";
 //#endregion
-export { Accordion, AccordionDataAttributes, type AccordionLevel, type AccordionSize, AlertDialog, type AlertDialogActionTone, AlertDialogDataAttributes, Autocomplete, AutocompleteDataAttributes, type AutocompleteSize, Avatar, AvatarDataAttributes, Badge, BadgeDataAttributes, type BadgeSize, type BadgeTone, type BadgeVariant, BrandLogo, Button, ButtonDataAttributes, ButtonGroup, ButtonGroupDataAttributes, Checkbox, CheckboxDataAttributes, CheckboxGroup, type ClassNameProp, CodeBlock, CodeBlockDataAttributes, Collapsible, CollapsibleDataAttributes, type ColorFormat, ColorPicker, type ColorPickerLabels, ColorSwatch, ColorSwatchPicker, Combobox, ComboboxDataAttributes, ContextMenu, ContextMenuDataAttributes, CopyButton, CopyButtonDataAttributes, Dialog, DialogDataAttributes, EMPTY_SHEET_STACK, Field, FieldDataAttributes, Fieldset, Form, Icon, type IconGlyph, InlineCode, Input, type InputAdornmentSide, type InputAdornmentVariant, InputDataAttributes, type InputSize, Kbd, Menu, MenuDataAttributes, Menubar, MenubarDataAttributes, Meter, MeterDataAttributes, NavigationMenu, NavigationMenuDataAttributes, NoctisProvider, NumberField, NumberFieldDataAttributes, OtpField, OtpFieldDataAttributes, type OtpFieldSize, type PackageManager, Popover, PopoverDataAttributes, PreviewCard, PreviewCardDataAttributes, Primitive, Progress, ProgressDataAttributes, type ProgressSize, RADIUS_PRESETS, Radio, RadioDataAttributes, RadiusScope, Rail, RailDataAttributes, ScrollArea, ScrollAreaDataAttributes, SearchDialog, SearchDialogDataAttributes, type SearchResult, Select, SelectDataAttributes, Separator, SeparatorDataAttributes, Sheet, SheetStack, type SheetStackEntry, type SheetStackEntryInput, type SheetStackManager, Slider, SliderDataAttributes, type SliderSize, Surface, Switch, SwitchDataAttributes, Table, Tabs, TabsDataAttributes, Textarea, TextareaDataAttributes, type TextareaSize, Toast, ToastDataAttributes, type ToastManager, type ToastObject, type ToastOptions, type ToastPlacement, type ToastPromiseOptions, type ToastStatusOptions, type ToastType, type ToastUpdateOptions, Toggle, ToggleDataAttributes, ToggleGroup, Toolbar, ToolbarDataAttributes, Tooltip, TooltipDataAttributes, UI_PACKAGE, VisuallyHidden, mergeClassName, mergeProps, sheetStackReducer, useCopy, useReducedMotion, useRender, useSheetStack, useSheetStackContext, useToast };
+export { Accordion, AccordionDataAttributes, type AccordionLevel, type AccordionSize, AlertDialog, type AlertDialogActionTone, AlertDialogDataAttributes, Autocomplete, AutocompleteDataAttributes, type AutocompleteSize, Avatar, AvatarDataAttributes, Badge, BadgeDataAttributes, type BadgeSize, type BadgeTone, type BadgeVariant, BrandLogo, Button, ButtonDataAttributes, ButtonGroup, ButtonGroupDataAttributes, Checkbox, CheckboxDataAttributes, CheckboxGroup, type ClassNameProp, CodeBlock, CodeBlockDataAttributes, Collapsible, CollapsibleDataAttributes, type ColorFormat, ColorPicker, type ColorPickerLabels, ColorSwatch, ColorSwatchPicker, Combobox, ComboboxDataAttributes, ContextMenu, ContextMenuDataAttributes, CopyButton, CopyButtonDataAttributes, Dialog, DialogDataAttributes, EMPTY_SHEET_STACK, Field, FieldDataAttributes, Fieldset, Form, Icon, type IconGlyph, InlineCode, Input, type InputAdornmentSide, type InputAdornmentVariant, InputDataAttributes, type InputSize, Kbd, Menu, MenuDataAttributes, Menubar, MenubarDataAttributes, Meter, MeterDataAttributes, NavigationMenu, NavigationMenuDataAttributes, NoctisProvider, NumberField, NumberFieldDataAttributes, OtpField, OtpFieldDataAttributes, type OtpFieldSize, type PackageManager, Pagination, PaginationDataAttributes, type PaginationLabels, type PaginationSize, Popover, PopoverDataAttributes, PreviewCard, PreviewCardDataAttributes, Primitive, Progress, ProgressDataAttributes, type ProgressSize, RADIUS_PRESETS, Radio, RadioDataAttributes, RadiusScope, Rail, RailDataAttributes, ScrollArea, ScrollAreaDataAttributes, SearchDialog, SearchDialogDataAttributes, type SearchResult, Select, SelectDataAttributes, Separator, SeparatorDataAttributes, Sheet, SheetStack, type SheetStackEntry, type SheetStackEntryInput, type SheetStackManager, Slider, SliderDataAttributes, type SliderSize, Surface, Switch, SwitchDataAttributes, Table, Tabs, TabsDataAttributes, Textarea, TextareaDataAttributes, type TextareaSize, Toast, ToastDataAttributes, type ToastManager, type ToastObject, type ToastOptions, type ToastPlacement, type ToastPromiseOptions, type ToastStatusOptions, type ToastType, type ToastUpdateOptions, Toggle, ToggleDataAttributes, ToggleGroup, Toolbar, ToolbarDataAttributes, Tooltip, TooltipDataAttributes, UI_PACKAGE, VisuallyHidden, mergeClassName, mergeProps, sheetStackReducer, useCopy, useReducedMotion, useRender, useSheetStack, useSheetStackContext, useToast };

package/dist/index.js

@@ -65,6 +65,8 @@ import { NumberFieldDataAttributes } from "./components/number-field/number-fiel
 import { NumberField } from "./components/number-field/number-field.js";
 import { OtpFieldDataAttributes } from "./components/otp-field/otp-field.slots.js";
 import { OtpField } from "./components/otp-field/otp-field.js";
+import { PaginationDataAttributes } from "./components/pagination/pagination.slots.js";
+import { Pagination } from "./components/pagination/pagination.js";
 import { PreviewCardDataAttributes } from "./components/preview-card/preview-card.slots.js";
 import { PreviewCard } from "./components/preview-card/preview-card.js";
 import { PopoverDataAttributes } from "./components/popover/popover.slots.js";
@@ -111,4 +113,4 @@ import { NoctisProvider } from "./core/noctis-provider.js";
 /** Package identifier — the workspace-resolution marker consumed by the app scaffold. */
 const UI_PACKAGE = "@stridge/noctis";
 //#endregion
-export { Accordion, AccordionDataAttributes, AlertDialog, AlertDialogDataAttributes, Autocomplete, AutocompleteDataAttributes, Avatar, AvatarDataAttributes, Badge, BadgeDataAttributes, BrandLogo, Button, ButtonDataAttributes, ButtonGroup, ButtonGroupDataAttributes, Checkbox, CheckboxDataAttributes, CheckboxGroup, CodeBlock, CodeBlockDataAttributes, Collapsible, CollapsibleDataAttributes, ColorPicker, ColorSwatch, ColorSwatchPicker, Combobox, ComboboxDataAttributes, ContextMenu, ContextMenuDataAttributes, CopyButton, CopyButtonDataAttributes, Dialog, DialogDataAttributes, EMPTY_SHEET_STACK, Field, FieldDataAttributes, Fieldset, Form, Icon, InlineCode, Input, InputDataAttributes, Kbd, Menu, MenuDataAttributes, Menubar, MenubarDataAttributes, Meter, MeterDataAttributes, NavigationMenu, NavigationMenuDataAttributes, NoctisProvider, NumberField, NumberFieldDataAttributes, OtpField, OtpFieldDataAttributes, Popover, PopoverDataAttributes, PreviewCard, PreviewCardDataAttributes, Primitive, Progress, ProgressDataAttributes, RADIUS_PRESETS, Radio, RadioDataAttributes, RadiusScope, Rail, RailDataAttributes, ScrollArea, ScrollAreaDataAttributes, SearchDialog, SearchDialogDataAttributes, Select, SelectDataAttributes, Separator, SeparatorDataAttributes, Sheet, SheetStack, Slider, SliderDataAttributes, Surface, Switch, SwitchDataAttributes, Table, Tabs, TabsDataAttributes, Textarea, TextareaDataAttributes, Toast, ToastDataAttributes, Toggle, ToggleDataAttributes, ToggleGroup, Toolbar, ToolbarDataAttributes, Tooltip, TooltipDataAttributes, UI_PACKAGE, VisuallyHidden, mergeClassName, mergeProps, sheetStackReducer, useCopy, useReducedMotion, useRender, useSheetStack, useSheetStackContext, useToast };
+export { Accordion, AccordionDataAttributes, AlertDialog, AlertDialogDataAttributes, Autocomplete, AutocompleteDataAttributes, Avatar, AvatarDataAttributes, Badge, BadgeDataAttributes, BrandLogo, Button, ButtonDataAttributes, ButtonGroup, ButtonGroupDataAttributes, Checkbox, CheckboxDataAttributes, CheckboxGroup, CodeBlock, CodeBlockDataAttributes, Collapsible, CollapsibleDataAttributes, ColorPicker, ColorSwatch, ColorSwatchPicker, Combobox, ComboboxDataAttributes, ContextMenu, ContextMenuDataAttributes, CopyButton, CopyButtonDataAttributes, Dialog, DialogDataAttributes, EMPTY_SHEET_STACK, Field, FieldDataAttributes, Fieldset, Form, Icon, InlineCode, Input, InputDataAttributes, Kbd, Menu, MenuDataAttributes, Menubar, MenubarDataAttributes, Meter, MeterDataAttributes, NavigationMenu, NavigationMenuDataAttributes, NoctisProvider, NumberField, NumberFieldDataAttributes, OtpField, OtpFieldDataAttributes, Pagination, PaginationDataAttributes, Popover, PopoverDataAttributes, PreviewCard, PreviewCardDataAttributes, Primitive, Progress, ProgressDataAttributes, RADIUS_PRESETS, Radio, RadioDataAttributes, RadiusScope, Rail, RailDataAttributes, ScrollArea, ScrollAreaDataAttributes, SearchDialog, SearchDialogDataAttributes, Select, SelectDataAttributes, Separator, SeparatorDataAttributes, Sheet, SheetStack, Slider, SliderDataAttributes, Surface, Switch, SwitchDataAttributes, Table, Tabs, TabsDataAttributes, Textarea, TextareaDataAttributes, Toast, ToastDataAttributes, Toggle, ToggleDataAttributes, ToggleGroup, Toolbar, ToolbarDataAttributes, Tooltip, TooltipDataAttributes, UI_PACKAGE, VisuallyHidden, mergeClassName, mergeProps, sheetStackReducer, useCopy, useReducedMotion, useRender, useSheetStack, useSheetStackContext, useToast };

package/dist/props.d.ts

@@ -4,7 +4,7 @@ import { actionProps, backdropProps, bodyProps, cancelProps, closeProps, descrip
 import { fallbackProps, imageProps, rootProps as rootProps$1 } from "./components/avatar/avatar.props.js";
 import { dotProps, iconProps as iconProps$1, rootProps as rootProps$2 } from "./components/badge/badge.props.js";
 import { buttonProps } from "./components/button/button.props.js";
-import { rootProps as rootProps$21 } from "./components/surface/surface.props.js";
+import { rootProps as rootProps$22 } from "./components/surface/surface.props.js";
 import { alphaSliderProps, areaProps, eyeDropperProps, formatTabsProps, hueSliderProps, inputProps as inputProps$1, panelProps as panelProps$2, swatchProps } from "./components/color-picker/color-picker.props.js";
 import { pickerItemProps, pickerProps, swatchProps as swatchProps$1 } from "./components/color-swatch/color-swatch.props.js";
 import { fieldProps, groupProps as groupProps$1, indicatorProps, labelProps, rootProps as rootProps$4 } from "./components/checkbox/checkbox.props.js";
@@ -18,30 +18,31 @@ import { actionProps as actionProps$1, controlProps, countProps, descriptionProp
 import { rootProps as rootProps$8 } from "./components/inline-code/inline-code.props.js";
 import { adornmentProps, controlProps as controlProps$1, rootProps as rootProps$9 } from "./components/input/input.props.js";
 import { chordProps, glyphProps, keyProps, rootProps as rootProps$10 } from "./components/kbd/kbd.props.js";
-import { footerProps as footerProps$3, inputProps as inputProps$5, itemProps as itemProps$5, resultsProps, rootProps as rootProps$19 } from "./components/search-dialog/search-dialog.props.js";
-import { backdropProps as backdropProps$2, groupLabelProps as groupLabelProps$3, groupProps as groupProps$5, iconProps as iconProps$3, itemDescriptionProps, itemIconProps, itemIndicatorProps, itemProps as itemProps$6, itemTextProps, listProps as listProps$3, popupProps as popupProps$4, scrollDownArrowProps, scrollUpArrowProps, separatorProps as separatorProps$5, triggerProps as triggerProps$11, valueProps as valueProps$2 } from "./components/select/select.props.js";
-import { separatorProps as separatorProps$6 } from "./components/separator/separator.props.js";
-import { bodyProps as bodyProps$3, closeProps as closeProps$3, contentProps as contentProps$4, headerProps as headerProps$3, layoutProps, panelProps as panelProps$3, rootProps as rootProps$17, surfaceProps, titleProps as titleProps$5, triggerProps as triggerProps$10 } from "./components/rail/rail.props.js";
+import { footerProps as footerProps$3, inputProps as inputProps$5, itemProps as itemProps$5, resultsProps, rootProps as rootProps$20 } from "./components/search-dialog/search-dialog.props.js";
+import { backdropProps as backdropProps$2, groupLabelProps as groupLabelProps$3, groupProps as groupProps$5, iconProps as iconProps$3, itemDescriptionProps, itemIconProps, itemIndicatorProps, itemProps as itemProps$6, itemTextProps, listProps as listProps$3, popupProps as popupProps$4, scrollDownArrowProps, scrollUpArrowProps, separatorProps as separatorProps$6, triggerProps as triggerProps$11, valueProps as valueProps$2 } from "./components/select/select.props.js";
+import { separatorProps as separatorProps$7 } from "./components/separator/separator.props.js";
+import { bodyProps as bodyProps$3, closeProps as closeProps$3, contentProps as contentProps$4, headerProps as headerProps$3, layoutProps, panelProps as panelProps$3, rootProps as rootProps$18, surfaceProps, titleProps as titleProps$5, triggerProps as triggerProps$10 } from "./components/rail/rail.props.js";
 import { backdropProps as backdropProps$3, bodyProps as bodyProps$4, closeProps as closeProps$4, descriptionProps as descriptionProps$5, footerProps as footerProps$4, headerProps as headerProps$4, popupProps as popupProps$5, titleProps as titleProps$6, triggerProps as triggerProps$12, viewportProps as viewportProps$3 } from "./components/sheet/sheet.props.js";
-import { controlProps as controlProps$2, indicatorProps as indicatorProps$4, labelProps as labelProps$4, rootProps as rootProps$20, thumbProps as thumbProps$1, trackProps as trackProps$2, valueProps as valueProps$3 } from "./components/slider/slider.props.js";
+import { controlProps as controlProps$2, indicatorProps as indicatorProps$4, labelProps as labelProps$4, rootProps as rootProps$21, thumbProps as thumbProps$1, trackProps as trackProps$2, valueProps as valueProps$3 } from "./components/slider/slider.props.js";
 import { rootProps as rootProps$3 } from "./components/button-group/button-group.props.js";
 import { backdropProps as backdropProps$1, bodyProps as bodyProps$2, closeProps as closeProps$1, descriptionProps as descriptionProps$1, footerProps as footerProps$1, headerProps as headerProps$2, popupProps as popupProps$1, titleProps as titleProps$2, triggerProps as triggerProps$4 } from "./components/dialog/dialog.props.js";
 import { rootProps as rootProps$11, triggerProps as triggerProps$6 } from "./components/menubar/menubar.props.js";
 import { indicatorProps as indicatorProps$1, labelProps as labelProps$2, rootProps as rootProps$12, trackProps, valueProps } from "./components/meter/meter.props.js";
 import { decrementProps, groupProps as groupProps$3, incrementProps, inputProps as inputProps$3, prefixProps, rootProps as rootProps$14, scrubAreaCursorProps, scrubAreaProps, suffixProps } from "./components/number-field/number-field.props.js";
 import { inputProps as inputProps$4, rootProps as rootProps$15, separatorProps as separatorProps$4 } from "./components/otp-field/otp-field.props.js";
+import { controlsProps, infoProps, pageProps, pageSizeLabelProps, pageSizeProps, rootProps as rootProps$16, separatorProps as separatorProps$5 } from "./components/pagination/pagination.props.js";
 import { descriptionProps as descriptionProps$4, mediaProps, metaProps, popupProps as popupProps$3, titleProps as titleProps$4, triggerProps as triggerProps$9 } from "./components/preview-card/preview-card.props.js";
 import { closeProps as closeProps$2, descriptionProps as descriptionProps$3, popupProps as popupProps$2, titleProps as titleProps$3, triggerProps as triggerProps$8 } from "./components/popover/popover.props.js";
-import { indicatorProps as indicatorProps$2, labelProps as labelProps$3, rootProps as rootProps$16, trackProps as trackProps$1, valueProps as valueProps$1 } from "./components/progress/progress.props.js";
+import { indicatorProps as indicatorProps$2, labelProps as labelProps$3, rootProps as rootProps$17, trackProps as trackProps$1, valueProps as valueProps$1 } from "./components/progress/progress.props.js";
 import { groupProps as groupProps$4, indicatorProps as indicatorProps$3, radioProps } from "./components/radio/radio.props.js";
 import { contentProps as contentProps$3, footerProps as footerProps$2, itemProps as itemProps$4, linkDescriptionProps, linkProps, linkTitleProps, listProps as listProps$2, rootProps as rootProps$13, sectionProps, sectionTitleProps, separatorProps as separatorProps$3, triggerProps as triggerProps$7, viewportProps as viewportProps$1 } from "./components/navigation-menu/navigation-menu.props.js";
-import { bodyProps as bodyProps$5, cellProps, headProps, headerProps as headerProps$5, rootProps as rootProps$22, rowProps } from "./components/table/table.props.js";
-import { indicatorProps as indicatorProps$5, listProps as listProps$4, panelProps as panelProps$4, rootProps as rootProps$23, tabProps } from "./components/tabs/tabs.props.js";
-import { groupProps as groupProps$6, rootProps as rootProps$26 } from "./components/toggle/toggle.props.js";
-import { groupProps as groupProps$7, inputProps as inputProps$6, rootProps as rootProps$27, separatorProps as separatorProps$7, spacerProps } from "./components/toolbar/toolbar.props.js";
-import { controlProps as controlProps$3, rootProps as rootProps$24, toolbarProps } from "./components/textarea/textarea.props.js";
-import { actionProps as actionProps$2, closeProps as closeProps$5, contentProps as contentProps$6, descriptionProps as descriptionProps$6, rootProps as rootProps$25, titleProps as titleProps$7, viewportProps as viewportProps$4 } from "./components/toast/toast.props.js";
+import { bodyProps as bodyProps$5, cellProps, headProps, headerProps as headerProps$5, rootProps as rootProps$23, rowProps } from "./components/table/table.props.js";
+import { indicatorProps as indicatorProps$5, listProps as listProps$4, panelProps as panelProps$4, rootProps as rootProps$24, tabProps } from "./components/tabs/tabs.props.js";
+import { groupProps as groupProps$6, rootProps as rootProps$27 } from "./components/toggle/toggle.props.js";
+import { groupProps as groupProps$7, inputProps as inputProps$6, rootProps as rootProps$28, separatorProps as separatorProps$8, spacerProps } from "./components/toolbar/toolbar.props.js";
+import { controlProps as controlProps$3, rootProps as rootProps$25, toolbarProps } from "./components/textarea/textarea.props.js";
+import { actionProps as actionProps$2, closeProps as closeProps$5, contentProps as contentProps$6, descriptionProps as descriptionProps$6, rootProps as rootProps$26, titleProps as titleProps$7, viewportProps as viewportProps$4 } from "./components/toast/toast.props.js";
 import { popupProps as popupProps$6, triggerProps as triggerProps$13 } from "./components/tooltip/tooltip.props.js";
-import { contentProps as contentProps$5, cornerProps, rootProps as rootProps$18, scrollbarProps, thumbProps, viewportProps as viewportProps$2 } from "./components/scroll-area/scroll-area.props.js";
+import { contentProps as contentProps$5, cornerProps, rootProps as rootProps$19, scrollbarProps, thumbProps, viewportProps as viewportProps$2 } from "./components/scroll-area/scroll-area.props.js";
 import { fieldProps as fieldProps$1, labelProps as labelProps$5, switchProps, thumbProps as thumbProps$2 } from "./components/switch/switch.props.js";
-export { itemProps as accordionItemProps, panelProps as accordionPanelProps, rootProps as accordionProps, triggerProps as accordionTriggerProps, actionProps as alertDialogActionProps, backdropProps as alertDialogBackdropProps, bodyProps as alertDialogBodyProps, cancelProps as alertDialogCancelProps, closeProps as alertDialogCloseProps, descriptionProps as alertDialogDescriptionProps, footerProps as alertDialogFooterProps, headerProps as alertDialogHeaderProps, popupProps as alertDialogPopupProps, titleProps as alertDialogTitleProps, triggerProps$1 as alertDialogTriggerProps, viewportProps as alertDialogViewportProps, contentProps as autocompleteContentProps, emptyProps as autocompleteEmptyProps, groupLabelProps as autocompleteGroupLabelProps, groupProps as autocompleteGroupProps, iconProps as autocompleteIconProps, inputProps as autocompleteInputProps, itemProps$1 as autocompleteItemProps, listProps as autocompleteListProps, loadingProps as autocompleteLoadingProps, separatorProps as autocompleteSeparatorProps, statusProps as autocompleteStatusProps, fallbackProps as avatarFallbackProps, imageProps as avatarImageProps, rootProps$1 as avatarRootProps, dotProps as badgeDotProps, iconProps$1 as badgeIconProps, rootProps$2 as badgeRootProps, rootProps$3 as buttonGroupProps, buttonProps, fieldProps as checkboxFieldProps, groupProps$1 as checkboxGroupProps, indicatorProps as checkboxIndicatorProps, labelProps as checkboxLabelProps, rootProps$4 as checkboxRootProps, bodyProps$1 as codeBlockBodyProps, floatingCopyProps as codeBlockFloatingCopyProps, frameProps as codeBlockFrameProps, headerProps$1 as codeBlockHeaderProps, logoProps as codeBlockLogoProps, managerGlyphProps as codeBlockManagerGlyphProps, titleProps$1 as codeBlockTitleProps, panelProps$1 as collapsiblePanelProps, rootProps$5 as collapsibleRootProps, triggerProps$2 as collapsibleTriggerProps, alphaSliderProps as colorPickerAlphaSliderProps, areaProps as colorPickerAreaProps, eyeDropperProps as colorPickerEyeDropperProps, formatTabsProps as colorPickerFormatTabsProps, hueSliderProps as colorPickerHueSliderProps, inputProps$1 as colorPickerInputProps, panelProps$2 as colorPickerPanelProps, swatchProps as colorPickerSwatchProps, pickerItemProps as colorSwatchPickerItemProps, pickerProps as colorSwatchPickerProps, swatchProps$1 as colorSwatchSwatchProps, chipProps as comboboxChipProps, chipsInputProps as comboboxChipsInputProps, emptyProps$1 as comboboxEmptyProps, groupLabelProps$1 as comboboxGroupLabelProps, iconProps$2 as comboboxIconProps, inputProps$2 as comboboxInputProps, itemProps$2 as comboboxItemProps, listProps$1 as comboboxListProps, separatorProps$1 as comboboxSeparatorProps, statusProps$1 as comboboxStatusProps, contentProps$1 as contextMenuContentProps, triggerProps$3 as contextMenuTriggerProps, rootProps$6 as copyButtonProps, backdropProps$1 as dialogBackdropProps, bodyProps$2 as dialogBodyProps, closeProps$1 as dialogCloseProps, descriptionProps$1 as dialogDescriptionProps, footerProps$1 as dialogFooterProps, headerProps$2 as dialogHeaderProps, popupProps$1 as dialogPopupProps, titleProps$2 as dialogTitleProps, triggerProps$4 as dialogTriggerProps, actionProps$1 as fieldActionProps, controlProps as fieldControlProps, countProps as fieldCountProps, descriptionProps$2 as fieldDescriptionProps, errorProps as fieldErrorProps, labelProps$1 as fieldLabelProps, rootProps$7 as fieldRootProps, legendProps as fieldsetLegendProps, fieldsetProps as fieldsetRootProps, formProps as formRootProps, rootProps$8 as inlineCodeRootProps, adornmentProps as inputAdornmentProps, controlProps$1 as inputControlProps, rootProps$9 as inputRootProps, chordProps as kbdChordProps, glyphProps as kbdGlyphProps, keyProps as kbdKeyProps, rootProps$10 as kbdRootProps, checkboxItemProps as menuCheckboxItemProps, contentProps$2 as menuContentProps, groupLabelProps$2 as menuGroupLabelProps, groupProps$2 as menuGroupProps, itemProps$3 as menuItemProps, radioGroupProps as menuRadioGroupProps, radioItemProps as menuRadioItemProps, separatorProps$2 as menuSeparatorProps, shortcutProps as menuShortcutProps, submenuTriggerProps as menuSubmenuTriggerProps, triggerProps$5 as menuTriggerProps, rootProps$11 as menubarRootProps, triggerProps$6 as menubarTriggerProps, indicatorProps$1 as meterIndicatorProps, labelProps$2 as meterLabelProps, rootProps$12 as meterRootProps, trackProps as meterTrackProps, valueProps as meterValueProps, contentProps$3 as navigationMenuContentProps, footerProps$2 as navigationMenuFooterProps, itemProps$4 as navigationMenuItemProps, linkDescriptionProps as navigationMenuLinkDescriptionProps, linkProps as navigationMenuLinkProps, linkTitleProps as navigationMenuLinkTitleProps, listProps$2 as navigationMenuListProps, rootProps$13 as navigationMenuRootProps, sectionProps as navigationMenuSectionProps, sectionTitleProps as navigationMenuSectionTitleProps, separatorProps$3 as navigationMenuSeparatorProps, triggerProps$7 as navigationMenuTriggerProps, viewportProps$1 as navigationMenuViewportProps, decrementProps as numberFieldDecrementProps, groupProps$3 as numberFieldGroupProps, incrementProps as numberFieldIncrementProps, inputProps$3 as numberFieldInputProps, prefixProps as numberFieldPrefixProps, rootProps$14 as numberFieldRootProps, scrubAreaCursorProps as numberFieldScrubAreaCursorProps, scrubAreaProps as numberFieldScrubAreaProps, suffixProps as numberFieldSuffixProps, inputProps$4 as otpFieldInputProps, rootProps$15 as otpFieldRootProps, separatorProps$4 as otpFieldSeparatorProps, closeProps$2 as popoverCloseProps, descriptionProps$3 as popoverDescriptionProps, popupProps$2 as popoverPopupProps, titleProps$3 as popoverTitleProps, triggerProps$8 as popoverTriggerProps, descriptionProps$4 as previewCardDescriptionProps, mediaProps as previewCardMediaProps, metaProps as previewCardMetaProps, popupProps$3 as previewCardPopupProps, titleProps$4 as previewCardTitleProps, triggerProps$9 as previewCardTriggerProps, indicatorProps$2 as progressIndicatorProps, labelProps$3 as progressLabelProps, rootProps$16 as progressRootProps, trackProps$1 as progressTrackProps, valueProps$1 as progressValueProps, groupProps$4 as radioGroupProps, indicatorProps$3 as radioIndicatorProps, radioProps, bodyProps$3 as railBodyProps, closeProps$3 as railCloseProps, contentProps$4 as railContentProps, headerProps$3 as railHeaderProps, layoutProps as railLayoutProps, panelProps$3 as railPanelProps, rootProps$17 as railRootProps, surfaceProps as railSurfaceProps, titleProps$5 as railTitleProps, triggerProps$10 as railTriggerProps, contentProps$5 as scrollAreaContentProps, cornerProps as scrollAreaCornerProps, rootProps$18 as scrollAreaRootProps, scrollbarProps as scrollAreaScrollbarProps, thumbProps as scrollAreaThumbProps, viewportProps$2 as scrollAreaViewportProps, footerProps$3 as searchDialogFooterProps, inputProps$5 as searchDialogInputProps, itemProps$5 as searchDialogItemProps, resultsProps as searchDialogResultsProps, rootProps$19 as searchDialogRootProps, backdropProps$2 as selectBackdropProps, groupLabelProps$3 as selectGroupLabelProps, groupProps$5 as selectGroupProps, iconProps$3 as selectIconProps, itemDescriptionProps as selectItemDescriptionProps, itemIconProps as selectItemIconProps, itemIndicatorProps as selectItemIndicatorProps, itemProps$6 as selectItemProps, itemTextProps as selectItemTextProps, listProps$3 as selectListProps, popupProps$4 as selectPopupProps, scrollDownArrowProps as selectScrollDownArrowProps, scrollUpArrowProps as selectScrollUpArrowProps, separatorProps$5 as selectSeparatorProps, triggerProps$11 as selectTriggerProps, valueProps$2 as selectValueProps, separatorProps$6 as separatorProps, backdropProps$3 as sheetBackdropProps, bodyProps$4 as sheetBodyProps, closeProps$4 as sheetCloseProps, descriptionProps$5 as sheetDescriptionProps, footerProps$4 as sheetFooterProps, headerProps$4 as sheetHeaderProps, popupProps$5 as sheetPopupProps, titleProps$6 as sheetTitleProps, triggerProps$12 as sheetTriggerProps, viewportProps$3 as sheetViewportProps, controlProps$2 as sliderControlProps, indicatorProps$4 as sliderIndicatorProps, labelProps$4 as sliderLabelProps, rootProps$20 as sliderRootProps, thumbProps$1 as sliderThumbProps, trackProps$2 as sliderTrackProps, valueProps$3 as sliderValueProps, rootProps$21 as surfaceRootProps, fieldProps$1 as switchFieldProps, labelProps$5 as switchLabelProps, switchProps, thumbProps$2 as switchThumbProps, bodyProps$5 as tableBodyProps, cellProps as tableCellProps, headProps as tableHeadProps, headerProps$5 as tableHeaderProps, rootProps$22 as tableRootProps, rowProps as tableRowProps, indicatorProps$5 as tabsIndicatorProps, listProps$4 as tabsListProps, panelProps$4 as tabsPanelProps, rootProps$23 as tabsRootProps, tabProps as tabsTabProps, controlProps$3 as textareaControlProps, rootProps$24 as textareaRootProps, toolbarProps as textareaToolbarProps, actionProps$2 as toastActionProps, closeProps$5 as toastCloseProps, contentProps$6 as toastContentProps, descriptionProps$6 as toastDescriptionProps, rootProps$25 as toastRootProps, titleProps$7 as toastTitleProps, viewportProps$4 as toastViewportProps, groupProps$6 as toggleGroupProps, rootProps$26 as toggleProps, groupProps$7 as toolbarGroupProps, inputProps$6 as toolbarInputProps, rootProps$27 as toolbarRootProps, separatorProps$7 as toolbarSeparatorProps, spacerProps as toolbarSpacerProps, popupProps$6 as tooltipPopupProps, triggerProps$13 as tooltipTriggerProps };
+export { itemProps as accordionItemProps, panelProps as accordionPanelProps, rootProps as accordionProps, triggerProps as accordionTriggerProps, actionProps as alertDialogActionProps, backdropProps as alertDialogBackdropProps, bodyProps as alertDialogBodyProps, cancelProps as alertDialogCancelProps, closeProps as alertDialogCloseProps, descriptionProps as alertDialogDescriptionProps, footerProps as alertDialogFooterProps, headerProps as alertDialogHeaderProps, popupProps as alertDialogPopupProps, titleProps as alertDialogTitleProps, triggerProps$1 as alertDialogTriggerProps, viewportProps as alertDialogViewportProps, contentProps as autocompleteContentProps, emptyProps as autocompleteEmptyProps, groupLabelProps as autocompleteGroupLabelProps, groupProps as autocompleteGroupProps, iconProps as autocompleteIconProps, inputProps as autocompleteInputProps, itemProps$1 as autocompleteItemProps, listProps as autocompleteListProps, loadingProps as autocompleteLoadingProps, separatorProps as autocompleteSeparatorProps, statusProps as autocompleteStatusProps, fallbackProps as avatarFallbackProps, imageProps as avatarImageProps, rootProps$1 as avatarRootProps, dotProps as badgeDotProps, iconProps$1 as badgeIconProps, rootProps$2 as badgeRootProps, rootProps$3 as buttonGroupProps, buttonProps, fieldProps as checkboxFieldProps, groupProps$1 as checkboxGroupProps, indicatorProps as checkboxIndicatorProps, labelProps as checkboxLabelProps, rootProps$4 as checkboxRootProps, bodyProps$1 as codeBlockBodyProps, floatingCopyProps as codeBlockFloatingCopyProps, frameProps as codeBlockFrameProps, headerProps$1 as codeBlockHeaderProps, logoProps as codeBlockLogoProps, managerGlyphProps as codeBlockManagerGlyphProps, titleProps$1 as codeBlockTitleProps, panelProps$1 as collapsiblePanelProps, rootProps$5 as collapsibleRootProps, triggerProps$2 as collapsibleTriggerProps, alphaSliderProps as colorPickerAlphaSliderProps, areaProps as colorPickerAreaProps, eyeDropperProps as colorPickerEyeDropperProps, formatTabsProps as colorPickerFormatTabsProps, hueSliderProps as colorPickerHueSliderProps, inputProps$1 as colorPickerInputProps, panelProps$2 as colorPickerPanelProps, swatchProps as colorPickerSwatchProps, pickerItemProps as colorSwatchPickerItemProps, pickerProps as colorSwatchPickerProps, swatchProps$1 as colorSwatchSwatchProps, chipProps as comboboxChipProps, chipsInputProps as comboboxChipsInputProps, emptyProps$1 as comboboxEmptyProps, groupLabelProps$1 as comboboxGroupLabelProps, iconProps$2 as comboboxIconProps, inputProps$2 as comboboxInputProps, itemProps$2 as comboboxItemProps, listProps$1 as comboboxListProps, separatorProps$1 as comboboxSeparatorProps, statusProps$1 as comboboxStatusProps, contentProps$1 as contextMenuContentProps, triggerProps$3 as contextMenuTriggerProps, rootProps$6 as copyButtonProps, backdropProps$1 as dialogBackdropProps, bodyProps$2 as dialogBodyProps, closeProps$1 as dialogCloseProps, descriptionProps$1 as dialogDescriptionProps, footerProps$1 as dialogFooterProps, headerProps$2 as dialogHeaderProps, popupProps$1 as dialogPopupProps, titleProps$2 as dialogTitleProps, triggerProps$4 as dialogTriggerProps, actionProps$1 as fieldActionProps, controlProps as fieldControlProps, countProps as fieldCountProps, descriptionProps$2 as fieldDescriptionProps, errorProps as fieldErrorProps, labelProps$1 as fieldLabelProps, rootProps$7 as fieldRootProps, legendProps as fieldsetLegendProps, fieldsetProps as fieldsetRootProps, formProps as formRootProps, rootProps$8 as inlineCodeRootProps, adornmentProps as inputAdornmentProps, controlProps$1 as inputControlProps, rootProps$9 as inputRootProps, chordProps as kbdChordProps, glyphProps as kbdGlyphProps, keyProps as kbdKeyProps, rootProps$10 as kbdRootProps, checkboxItemProps as menuCheckboxItemProps, contentProps$2 as menuContentProps, groupLabelProps$2 as menuGroupLabelProps, groupProps$2 as menuGroupProps, itemProps$3 as menuItemProps, radioGroupProps as menuRadioGroupProps, radioItemProps as menuRadioItemProps, separatorProps$2 as menuSeparatorProps, shortcutProps as menuShortcutProps, submenuTriggerProps as menuSubmenuTriggerProps, triggerProps$5 as menuTriggerProps, rootProps$11 as menubarRootProps, triggerProps$6 as menubarTriggerProps, indicatorProps$1 as meterIndicatorProps, labelProps$2 as meterLabelProps, rootProps$12 as meterRootProps, trackProps as meterTrackProps, valueProps as meterValueProps, contentProps$3 as navigationMenuContentProps, footerProps$2 as navigationMenuFooterProps, itemProps$4 as navigationMenuItemProps, linkDescriptionProps as navigationMenuLinkDescriptionProps, linkProps as navigationMenuLinkProps, linkTitleProps as navigationMenuLinkTitleProps, listProps$2 as navigationMenuListProps, rootProps$13 as navigationMenuRootProps, sectionProps as navigationMenuSectionProps, sectionTitleProps as navigationMenuSectionTitleProps, separatorProps$3 as navigationMenuSeparatorProps, triggerProps$7 as navigationMenuTriggerProps, viewportProps$1 as navigationMenuViewportProps, decrementProps as numberFieldDecrementProps, groupProps$3 as numberFieldGroupProps, incrementProps as numberFieldIncrementProps, inputProps$3 as numberFieldInputProps, prefixProps as numberFieldPrefixProps, rootProps$14 as numberFieldRootProps, scrubAreaCursorProps as numberFieldScrubAreaCursorProps, scrubAreaProps as numberFieldScrubAreaProps, suffixProps as numberFieldSuffixProps, inputProps$4 as otpFieldInputProps, rootProps$15 as otpFieldRootProps, separatorProps$4 as otpFieldSeparatorProps, controlsProps as paginationControlsProps, infoProps as paginationInfoProps, pageProps as paginationPageProps, pageSizeLabelProps as paginationPageSizeLabelProps, pageSizeProps as paginationPageSizeProps, rootProps$16 as paginationRootProps, separatorProps$5 as paginationSeparatorProps, closeProps$2 as popoverCloseProps, descriptionProps$3 as popoverDescriptionProps, popupProps$2 as popoverPopupProps, titleProps$3 as popoverTitleProps, triggerProps$8 as popoverTriggerProps, descriptionProps$4 as previewCardDescriptionProps, mediaProps as previewCardMediaProps, metaProps as previewCardMetaProps, popupProps$3 as previewCardPopupProps, titleProps$4 as previewCardTitleProps, triggerProps$9 as previewCardTriggerProps, indicatorProps$2 as progressIndicatorProps, labelProps$3 as progressLabelProps, rootProps$17 as progressRootProps, trackProps$1 as progressTrackProps, valueProps$1 as progressValueProps, groupProps$4 as radioGroupProps, indicatorProps$3 as radioIndicatorProps, radioProps, bodyProps$3 as railBodyProps, closeProps$3 as railCloseProps, contentProps$4 as railContentProps, headerProps$3 as railHeaderProps, layoutProps as railLayoutProps, panelProps$3 as railPanelProps, rootProps$18 as railRootProps, surfaceProps as railSurfaceProps, titleProps$5 as railTitleProps, triggerProps$10 as railTriggerProps, contentProps$5 as scrollAreaContentProps, cornerProps as scrollAreaCornerProps, rootProps$19 as scrollAreaRootProps, scrollbarProps as scrollAreaScrollbarProps, thumbProps as scrollAreaThumbProps, viewportProps$2 as scrollAreaViewportProps, footerProps$3 as searchDialogFooterProps, inputProps$5 as searchDialogInputProps, itemProps$5 as searchDialogItemProps, resultsProps as searchDialogResultsProps, rootProps$20 as searchDialogRootProps, backdropProps$2 as selectBackdropProps, groupLabelProps$3 as selectGroupLabelProps, groupProps$5 as selectGroupProps, iconProps$3 as selectIconProps, itemDescriptionProps as selectItemDescriptionProps, itemIconProps as selectItemIconProps, itemIndicatorProps as selectItemIndicatorProps, itemProps$6 as selectItemProps, itemTextProps as selectItemTextProps, listProps$3 as selectListProps, popupProps$4 as selectPopupProps, scrollDownArrowProps as selectScrollDownArrowProps, scrollUpArrowProps as selectScrollUpArrowProps, separatorProps$6 as selectSeparatorProps, triggerProps$11 as selectTriggerProps, valueProps$2 as selectValueProps, separatorProps$7 as separatorProps, backdropProps$3 as sheetBackdropProps, bodyProps$4 as sheetBodyProps, closeProps$4 as sheetCloseProps, descriptionProps$5 as sheetDescriptionProps, footerProps$4 as sheetFooterProps, headerProps$4 as sheetHeaderProps, popupProps$5 as sheetPopupProps, titleProps$6 as sheetTitleProps, triggerProps$12 as sheetTriggerProps, viewportProps$3 as sheetViewportProps, controlProps$2 as sliderControlProps, indicatorProps$4 as sliderIndicatorProps, labelProps$4 as sliderLabelProps, rootProps$21 as sliderRootProps, thumbProps$1 as sliderThumbProps, trackProps$2 as sliderTrackProps, valueProps$3 as sliderValueProps, rootProps$22 as surfaceRootProps, fieldProps$1 as switchFieldProps, labelProps$5 as switchLabelProps, switchProps, thumbProps$2 as switchThumbProps, bodyProps$5 as tableBodyProps, cellProps as tableCellProps, headProps as tableHeadProps, headerProps$5 as tableHeaderProps, rootProps$23 as tableRootProps, rowProps as tableRowProps, indicatorProps$5 as tabsIndicatorProps, listProps$4 as tabsListProps, panelProps$4 as tabsPanelProps, rootProps$24 as tabsRootProps, tabProps as tabsTabProps, controlProps$3 as textareaControlProps, rootProps$25 as textareaRootProps, toolbarProps as textareaToolbarProps, actionProps$2 as toastActionProps, closeProps$5 as toastCloseProps, contentProps$6 as toastContentProps, descriptionProps$6 as toastDescriptionProps, rootProps$26 as toastRootProps, titleProps$7 as toastTitleProps, viewportProps$4 as toastViewportProps, groupProps$6 as toggleGroupProps, rootProps$27 as toggleProps, groupProps$7 as toolbarGroupProps, inputProps$6 as toolbarInputProps, rootProps$28 as toolbarRootProps, separatorProps$8 as toolbarSeparatorProps, spacerProps as toolbarSpacerProps, popupProps$6 as tooltipPopupProps, triggerProps$13 as tooltipTriggerProps };

package/dist/props.js

@@ -1,5 +1,5 @@
 import { itemProps, panelProps, rootProps, triggerProps } from "./components/accordion/accordion.props.js";
-import { rootProps as rootProps$21 } from "./components/surface/surface.props.js";
+import { rootProps as rootProps$22 } from "./components/surface/surface.props.js";
 import { contentProps, emptyProps, groupLabelProps, groupProps, iconProps, inputProps, itemProps as itemProps$1, listProps, loadingProps, separatorProps, statusProps } from "./components/autocomplete/autocomplete.props.js";
 import { actionProps, backdropProps, bodyProps, cancelProps, closeProps, descriptionProps, footerProps, headerProps, popupProps, titleProps, triggerProps as triggerProps$1, viewportProps } from "./components/alert-dialog/alert-dialog.props.js";
 import { fallbackProps, imageProps, rootProps as rootProps$1 } from "./components/avatar/avatar.props.js";
@@ -19,29 +19,30 @@ import { actionProps as actionProps$1, controlProps, countProps, descriptionProp
 import { rootProps as rootProps$8 } from "./components/inline-code/inline-code.props.js";
 import { adornmentProps, controlProps as controlProps$1, rootProps as rootProps$9 } from "./components/input/input.props.js";
 import { backdropProps as backdropProps$1, bodyProps as bodyProps$2, closeProps as closeProps$1, descriptionProps as descriptionProps$1, footerProps as footerProps$1, headerProps as headerProps$2, popupProps as popupProps$1, titleProps as titleProps$2, triggerProps as triggerProps$4 } from "./components/dialog/dialog.props.js";
-import { footerProps as footerProps$3, inputProps as inputProps$5, itemProps as itemProps$5, resultsProps, rootProps as rootProps$19 } from "./components/search-dialog/search-dialog.props.js";
-import { backdropProps as backdropProps$2, groupLabelProps as groupLabelProps$3, groupProps as groupProps$5, iconProps as iconProps$3, itemDescriptionProps, itemIconProps, itemIndicatorProps, itemProps as itemProps$6, itemTextProps, listProps as listProps$3, popupProps as popupProps$4, scrollDownArrowProps, scrollUpArrowProps, separatorProps as separatorProps$5, triggerProps as triggerProps$11, valueProps as valueProps$2 } from "./components/select/select.props.js";
-import { separatorProps as separatorProps$6 } from "./components/separator/separator.props.js";
-import { bodyProps as bodyProps$3, closeProps as closeProps$3, contentProps as contentProps$4, headerProps as headerProps$3, layoutProps, panelProps as panelProps$3, rootProps as rootProps$17, surfaceProps, titleProps as titleProps$5, triggerProps as triggerProps$10 } from "./components/rail/rail.props.js";
+import { footerProps as footerProps$3, inputProps as inputProps$5, itemProps as itemProps$5, resultsProps, rootProps as rootProps$20 } from "./components/search-dialog/search-dialog.props.js";
+import { backdropProps as backdropProps$2, groupLabelProps as groupLabelProps$3, groupProps as groupProps$5, iconProps as iconProps$3, itemDescriptionProps, itemIconProps, itemIndicatorProps, itemProps as itemProps$6, itemTextProps, listProps as listProps$3, popupProps as popupProps$4, scrollDownArrowProps, scrollUpArrowProps, separatorProps as separatorProps$6, triggerProps as triggerProps$11, valueProps as valueProps$2 } from "./components/select/select.props.js";
+import { separatorProps as separatorProps$7 } from "./components/separator/separator.props.js";
+import { bodyProps as bodyProps$3, closeProps as closeProps$3, contentProps as contentProps$4, headerProps as headerProps$3, layoutProps, panelProps as panelProps$3, rootProps as rootProps$18, surfaceProps, titleProps as titleProps$5, triggerProps as triggerProps$10 } from "./components/rail/rail.props.js";
 import { backdropProps as backdropProps$3, bodyProps as bodyProps$4, closeProps as closeProps$4, descriptionProps as descriptionProps$5, footerProps as footerProps$4, headerProps as headerProps$4, popupProps as popupProps$5, titleProps as titleProps$6, triggerProps as triggerProps$12, viewportProps as viewportProps$3 } from "./components/sheet/sheet.props.js";
-import { controlProps as controlProps$2, indicatorProps as indicatorProps$4, labelProps as labelProps$4, rootProps as rootProps$20, thumbProps as thumbProps$1, trackProps as trackProps$2, valueProps as valueProps$3 } from "./components/slider/slider.props.js";
+import { controlProps as controlProps$2, indicatorProps as indicatorProps$4, labelProps as labelProps$4, rootProps as rootProps$21, thumbProps as thumbProps$1, trackProps as trackProps$2, valueProps as valueProps$3 } from "./components/slider/slider.props.js";
 import { rootProps as rootProps$3 } from "./components/button-group/button-group.props.js";
 import { rootProps as rootProps$11, triggerProps as triggerProps$6 } from "./components/menubar/menubar.props.js";
 import { indicatorProps as indicatorProps$1, labelProps as labelProps$2, rootProps as rootProps$12, trackProps, valueProps } from "./components/meter/meter.props.js";
 import { decrementProps, groupProps as groupProps$3, incrementProps, inputProps as inputProps$3, prefixProps, rootProps as rootProps$14, scrubAreaCursorProps, scrubAreaProps, suffixProps } from "./components/number-field/number-field.props.js";
 import { inputProps as inputProps$4, rootProps as rootProps$15, separatorProps as separatorProps$4 } from "./components/otp-field/otp-field.props.js";
+import { controlsProps, infoProps, pageProps, pageSizeLabelProps, pageSizeProps, rootProps as rootProps$16, separatorProps as separatorProps$5 } from "./components/pagination/pagination.props.js";
 import { descriptionProps as descriptionProps$4, mediaProps, metaProps, popupProps as popupProps$3, titleProps as titleProps$4, triggerProps as triggerProps$9 } from "./components/preview-card/preview-card.props.js";
 import { closeProps as closeProps$2, descriptionProps as descriptionProps$3, popupProps as popupProps$2, titleProps as titleProps$3, triggerProps as triggerProps$8 } from "./components/popover/popover.props.js";
-import { indicatorProps as indicatorProps$2, labelProps as labelProps$3, rootProps as rootProps$16, trackProps as trackProps$1, valueProps as valueProps$1 } from "./components/progress/progress.props.js";
+import { indicatorProps as indicatorProps$2, labelProps as labelProps$3, rootProps as rootProps$17, trackProps as trackProps$1, valueProps as valueProps$1 } from "./components/progress/progress.props.js";
 import { groupProps as groupProps$4, indicatorProps as indicatorProps$3, radioProps } from "./components/radio/radio.props.js";
 import { contentProps as contentProps$3, footerProps as footerProps$2, itemProps as itemProps$4, linkDescriptionProps, linkProps, linkTitleProps, listProps as listProps$2, rootProps as rootProps$13, sectionProps, sectionTitleProps, separatorProps as separatorProps$3, triggerProps as triggerProps$7, viewportProps as viewportProps$1 } from "./components/navigation-menu/navigation-menu.props.js";
-import { bodyProps as bodyProps$5, cellProps, headProps, headerProps as headerProps$5, rootProps as rootProps$22, rowProps } from "./components/table/table.props.js";
-import { indicatorProps as indicatorProps$5, listProps as listProps$4, panelProps as panelProps$4, rootProps as rootProps$23, tabProps } from "./components/tabs/tabs.props.js";
-import { groupProps as groupProps$6, rootProps as rootProps$26 } from "./components/toggle/toggle.props.js";
-import { groupProps as groupProps$7, inputProps as inputProps$6, rootProps as rootProps$27, separatorProps as separatorProps$7, spacerProps } from "./components/toolbar/toolbar.props.js";
-import { controlProps as controlProps$3, rootProps as rootProps$24, toolbarProps } from "./components/textarea/textarea.props.js";
-import { actionProps as actionProps$2, closeProps as closeProps$5, contentProps as contentProps$6, descriptionProps as descriptionProps$6, rootProps as rootProps$25, titleProps as titleProps$7, viewportProps as viewportProps$4 } from "./components/toast/toast.props.js";
+import { bodyProps as bodyProps$5, cellProps, headProps, headerProps as headerProps$5, rootProps as rootProps$23, rowProps } from "./components/table/table.props.js";
+import { indicatorProps as indicatorProps$5, listProps as listProps$4, panelProps as panelProps$4, rootProps as rootProps$24, tabProps } from "./components/tabs/tabs.props.js";
+import { groupProps as groupProps$6, rootProps as rootProps$27 } from "./components/toggle/toggle.props.js";
+import { groupProps as groupProps$7, inputProps as inputProps$6, rootProps as rootProps$28, separatorProps as separatorProps$8, spacerProps } from "./components/toolbar/toolbar.props.js";
+import { controlProps as controlProps$3, rootProps as rootProps$25, toolbarProps } from "./components/textarea/textarea.props.js";
+import { actionProps as actionProps$2, closeProps as closeProps$5, contentProps as contentProps$6, descriptionProps as descriptionProps$6, rootProps as rootProps$26, titleProps as titleProps$7, viewportProps as viewportProps$4 } from "./components/toast/toast.props.js";
 import { popupProps as popupProps$6, triggerProps as triggerProps$13 } from "./components/tooltip/tooltip.props.js";
-import { contentProps as contentProps$5, cornerProps, rootProps as rootProps$18, scrollbarProps, thumbProps, viewportProps as viewportProps$2 } from "./components/scroll-area/scroll-area.props.js";
+import { contentProps as contentProps$5, cornerProps, rootProps as rootProps$19, scrollbarProps, thumbProps, viewportProps as viewportProps$2 } from "./components/scroll-area/scroll-area.props.js";
 import { fieldProps as fieldProps$1, labelProps as labelProps$5, switchProps, thumbProps as thumbProps$2 } from "./components/switch/switch.props.js";
-export { itemProps as accordionItemProps, panelProps as accordionPanelProps, rootProps as accordionProps, triggerProps as accordionTriggerProps, actionProps as alertDialogActionProps, backdropProps as alertDialogBackdropProps, bodyProps as alertDialogBodyProps, cancelProps as alertDialogCancelProps, closeProps as alertDialogCloseProps, descriptionProps as alertDialogDescriptionProps, footerProps as alertDialogFooterProps, headerProps as alertDialogHeaderProps, popupProps as alertDialogPopupProps, titleProps as alertDialogTitleProps, triggerProps$1 as alertDialogTriggerProps, viewportProps as alertDialogViewportProps, contentProps as autocompleteContentProps, emptyProps as autocompleteEmptyProps, groupLabelProps as autocompleteGroupLabelProps, groupProps as autocompleteGroupProps, iconProps as autocompleteIconProps, inputProps as autocompleteInputProps, itemProps$1 as autocompleteItemProps, listProps as autocompleteListProps, loadingProps as autocompleteLoadingProps, separatorProps as autocompleteSeparatorProps, statusProps as autocompleteStatusProps, fallbackProps as avatarFallbackProps, imageProps as avatarImageProps, rootProps$1 as avatarRootProps, dotProps as badgeDotProps, iconProps$1 as badgeIconProps, rootProps$2 as badgeRootProps, rootProps$3 as buttonGroupProps, buttonProps, fieldProps as checkboxFieldProps, groupProps$1 as checkboxGroupProps, indicatorProps as checkboxIndicatorProps, labelProps as checkboxLabelProps, rootProps$4 as checkboxRootProps, bodyProps$1 as codeBlockBodyProps, floatingCopyProps as codeBlockFloatingCopyProps, frameProps as codeBlockFrameProps, headerProps$1 as codeBlockHeaderProps, logoProps as codeBlockLogoProps, managerGlyphProps as codeBlockManagerGlyphProps, titleProps$1 as codeBlockTitleProps, panelProps$1 as collapsiblePanelProps, rootProps$5 as collapsibleRootProps, triggerProps$2 as collapsibleTriggerProps, alphaSliderProps as colorPickerAlphaSliderProps, areaProps as colorPickerAreaProps, eyeDropperProps as colorPickerEyeDropperProps, formatTabsProps as colorPickerFormatTabsProps, hueSliderProps as colorPickerHueSliderProps, inputProps$1 as colorPickerInputProps, panelProps$2 as colorPickerPanelProps, swatchProps as colorPickerSwatchProps, pickerItemProps as colorSwatchPickerItemProps, pickerProps as colorSwatchPickerProps, swatchProps$1 as colorSwatchSwatchProps, chipProps as comboboxChipProps, chipsInputProps as comboboxChipsInputProps, emptyProps$1 as comboboxEmptyProps, groupLabelProps$1 as comboboxGroupLabelProps, iconProps$2 as comboboxIconProps, inputProps$2 as comboboxInputProps, itemProps$2 as comboboxItemProps, listProps$1 as comboboxListProps, separatorProps$1 as comboboxSeparatorProps, statusProps$1 as comboboxStatusProps, contentProps$1 as contextMenuContentProps, triggerProps$3 as contextMenuTriggerProps, rootProps$6 as copyButtonProps, backdropProps$1 as dialogBackdropProps, bodyProps$2 as dialogBodyProps, closeProps$1 as dialogCloseProps, descriptionProps$1 as dialogDescriptionProps, footerProps$1 as dialogFooterProps, headerProps$2 as dialogHeaderProps, popupProps$1 as dialogPopupProps, titleProps$2 as dialogTitleProps, triggerProps$4 as dialogTriggerProps, actionProps$1 as fieldActionProps, controlProps as fieldControlProps, countProps as fieldCountProps, descriptionProps$2 as fieldDescriptionProps, errorProps as fieldErrorProps, labelProps$1 as fieldLabelProps, rootProps$7 as fieldRootProps, legendProps as fieldsetLegendProps, fieldsetProps as fieldsetRootProps, formProps as formRootProps, rootProps$8 as inlineCodeRootProps, adornmentProps as inputAdornmentProps, controlProps$1 as inputControlProps, rootProps$9 as inputRootProps, chordProps as kbdChordProps, glyphProps as kbdGlyphProps, keyProps as kbdKeyProps, rootProps$10 as kbdRootProps, checkboxItemProps as menuCheckboxItemProps, contentProps$2 as menuContentProps, groupLabelProps$2 as menuGroupLabelProps, groupProps$2 as menuGroupProps, itemProps$3 as menuItemProps, radioGroupProps as menuRadioGroupProps, radioItemProps as menuRadioItemProps, separatorProps$2 as menuSeparatorProps, shortcutProps as menuShortcutProps, submenuTriggerProps as menuSubmenuTriggerProps, triggerProps$5 as menuTriggerProps, rootProps$11 as menubarRootProps, triggerProps$6 as menubarTriggerProps, indicatorProps$1 as meterIndicatorProps, labelProps$2 as meterLabelProps, rootProps$12 as meterRootProps, trackProps as meterTrackProps, valueProps as meterValueProps, contentProps$3 as navigationMenuContentProps, footerProps$2 as navigationMenuFooterProps, itemProps$4 as navigationMenuItemProps, linkDescriptionProps as navigationMenuLinkDescriptionProps, linkProps as navigationMenuLinkProps, linkTitleProps as navigationMenuLinkTitleProps, listProps$2 as navigationMenuListProps, rootProps$13 as navigationMenuRootProps, sectionProps as navigationMenuSectionProps, sectionTitleProps as navigationMenuSectionTitleProps, separatorProps$3 as navigationMenuSeparatorProps, triggerProps$7 as navigationMenuTriggerProps, viewportProps$1 as navigationMenuViewportProps, decrementProps as numberFieldDecrementProps, groupProps$3 as numberFieldGroupProps, incrementProps as numberFieldIncrementProps, inputProps$3 as numberFieldInputProps, prefixProps as numberFieldPrefixProps, rootProps$14 as numberFieldRootProps, scrubAreaCursorProps as numberFieldScrubAreaCursorProps, scrubAreaProps as numberFieldScrubAreaProps, suffixProps as numberFieldSuffixProps, inputProps$4 as otpFieldInputProps, rootProps$15 as otpFieldRootProps, separatorProps$4 as otpFieldSeparatorProps, closeProps$2 as popoverCloseProps, descriptionProps$3 as popoverDescriptionProps, popupProps$2 as popoverPopupProps, titleProps$3 as popoverTitleProps, triggerProps$8 as popoverTriggerProps, descriptionProps$4 as previewCardDescriptionProps, mediaProps as previewCardMediaProps, metaProps as previewCardMetaProps, popupProps$3 as previewCardPopupProps, titleProps$4 as previewCardTitleProps, triggerProps$9 as previewCardTriggerProps, indicatorProps$2 as progressIndicatorProps, labelProps$3 as progressLabelProps, rootProps$16 as progressRootProps, trackProps$1 as progressTrackProps, valueProps$1 as progressValueProps, groupProps$4 as radioGroupProps, indicatorProps$3 as radioIndicatorProps, radioProps, bodyProps$3 as railBodyProps, closeProps$3 as railCloseProps, contentProps$4 as railContentProps, headerProps$3 as railHeaderProps, layoutProps as railLayoutProps, panelProps$3 as railPanelProps, rootProps$17 as railRootProps, surfaceProps as railSurfaceProps, titleProps$5 as railTitleProps, triggerProps$10 as railTriggerProps, contentProps$5 as scrollAreaContentProps, cornerProps as scrollAreaCornerProps, rootProps$18 as scrollAreaRootProps, scrollbarProps as scrollAreaScrollbarProps, thumbProps as scrollAreaThumbProps, viewportProps$2 as scrollAreaViewportProps, footerProps$3 as searchDialogFooterProps, inputProps$5 as searchDialogInputProps, itemProps$5 as searchDialogItemProps, resultsProps as searchDialogResultsProps, rootProps$19 as searchDialogRootProps, backdropProps$2 as selectBackdropProps, groupLabelProps$3 as selectGroupLabelProps, groupProps$5 as selectGroupProps, iconProps$3 as selectIconProps, itemDescriptionProps as selectItemDescriptionProps, itemIconProps as selectItemIconProps, itemIndicatorProps as selectItemIndicatorProps, itemProps$6 as selectItemProps, itemTextProps as selectItemTextProps, listProps$3 as selectListProps, popupProps$4 as selectPopupProps, scrollDownArrowProps as selectScrollDownArrowProps, scrollUpArrowProps as selectScrollUpArrowProps, separatorProps$5 as selectSeparatorProps, triggerProps$11 as selectTriggerProps, valueProps$2 as selectValueProps, separatorProps$6 as separatorProps, backdropProps$3 as sheetBackdropProps, bodyProps$4 as sheetBodyProps, closeProps$4 as sheetCloseProps, descriptionProps$5 as sheetDescriptionProps, footerProps$4 as sheetFooterProps, headerProps$4 as sheetHeaderProps, popupProps$5 as sheetPopupProps, titleProps$6 as sheetTitleProps, triggerProps$12 as sheetTriggerProps, viewportProps$3 as sheetViewportProps, controlProps$2 as sliderControlProps, indicatorProps$4 as sliderIndicatorProps, labelProps$4 as sliderLabelProps, rootProps$20 as sliderRootProps, thumbProps$1 as sliderThumbProps, trackProps$2 as sliderTrackProps, valueProps$3 as sliderValueProps, rootProps$21 as surfaceRootProps, fieldProps$1 as switchFieldProps, labelProps$5 as switchLabelProps, switchProps, thumbProps$2 as switchThumbProps, bodyProps$5 as tableBodyProps, cellProps as tableCellProps, headProps as tableHeadProps, headerProps$5 as tableHeaderProps, rootProps$22 as tableRootProps, rowProps as tableRowProps, indicatorProps$5 as tabsIndicatorProps, listProps$4 as tabsListProps, panelProps$4 as tabsPanelProps, rootProps$23 as tabsRootProps, tabProps as tabsTabProps, controlProps$3 as textareaControlProps, rootProps$24 as textareaRootProps, toolbarProps as textareaToolbarProps, actionProps$2 as toastActionProps, closeProps$5 as toastCloseProps, contentProps$6 as toastContentProps, descriptionProps$6 as toastDescriptionProps, rootProps$25 as toastRootProps, titleProps$7 as toastTitleProps, viewportProps$4 as toastViewportProps, groupProps$6 as toggleGroupProps, rootProps$26 as toggleProps, groupProps$7 as toolbarGroupProps, inputProps$6 as toolbarInputProps, rootProps$27 as toolbarRootProps, separatorProps$7 as toolbarSeparatorProps, spacerProps as toolbarSpacerProps, popupProps$6 as tooltipPopupProps, triggerProps$13 as tooltipTriggerProps };
+export { itemProps as accordionItemProps, panelProps as accordionPanelProps, rootProps as accordionProps, triggerProps as accordionTriggerProps, actionProps as alertDialogActionProps, backdropProps as alertDialogBackdropProps, bodyProps as alertDialogBodyProps, cancelProps as alertDialogCancelProps, closeProps as alertDialogCloseProps, descriptionProps as alertDialogDescriptionProps, footerProps as alertDialogFooterProps, headerProps as alertDialogHeaderProps, popupProps as alertDialogPopupProps, titleProps as alertDialogTitleProps, triggerProps$1 as alertDialogTriggerProps, viewportProps as alertDialogViewportProps, contentProps as autocompleteContentProps, emptyProps as autocompleteEmptyProps, groupLabelProps as autocompleteGroupLabelProps, groupProps as autocompleteGroupProps, iconProps as autocompleteIconProps, inputProps as autocompleteInputProps, itemProps$1 as autocompleteItemProps, listProps as autocompleteListProps, loadingProps as autocompleteLoadingProps, separatorProps as autocompleteSeparatorProps, statusProps as autocompleteStatusProps, fallbackProps as avatarFallbackProps, imageProps as avatarImageProps, rootProps$1 as avatarRootProps, dotProps as badgeDotProps, iconProps$1 as badgeIconProps, rootProps$2 as badgeRootProps, rootProps$3 as buttonGroupProps, buttonProps, fieldProps as checkboxFieldProps, groupProps$1 as checkboxGroupProps, indicatorProps as checkboxIndicatorProps, labelProps as checkboxLabelProps, rootProps$4 as checkboxRootProps, bodyProps$1 as codeBlockBodyProps, floatingCopyProps as codeBlockFloatingCopyProps, frameProps as codeBlockFrameProps, headerProps$1 as codeBlockHeaderProps, logoProps as codeBlockLogoProps, managerGlyphProps as codeBlockManagerGlyphProps, titleProps$1 as codeBlockTitleProps, panelProps$1 as collapsiblePanelProps, rootProps$5 as collapsibleRootProps, triggerProps$2 as collapsibleTriggerProps, alphaSliderProps as colorPickerAlphaSliderProps, areaProps as colorPickerAreaProps, eyeDropperProps as colorPickerEyeDropperProps, formatTabsProps as colorPickerFormatTabsProps, hueSliderProps as colorPickerHueSliderProps, inputProps$1 as colorPickerInputProps, panelProps$2 as colorPickerPanelProps, swatchProps as colorPickerSwatchProps, pickerItemProps as colorSwatchPickerItemProps, pickerProps as colorSwatchPickerProps, swatchProps$1 as colorSwatchSwatchProps, chipProps as comboboxChipProps, chipsInputProps as comboboxChipsInputProps, emptyProps$1 as comboboxEmptyProps, groupLabelProps$1 as comboboxGroupLabelProps, iconProps$2 as comboboxIconProps, inputProps$2 as comboboxInputProps, itemProps$2 as comboboxItemProps, listProps$1 as comboboxListProps, separatorProps$1 as comboboxSeparatorProps, statusProps$1 as comboboxStatusProps, contentProps$1 as contextMenuContentProps, triggerProps$3 as contextMenuTriggerProps, rootProps$6 as copyButtonProps, backdropProps$1 as dialogBackdropProps, bodyProps$2 as dialogBodyProps, closeProps$1 as dialogCloseProps, descriptionProps$1 as dialogDescriptionProps, footerProps$1 as dialogFooterProps, headerProps$2 as dialogHeaderProps, popupProps$1 as dialogPopupProps, titleProps$2 as dialogTitleProps, triggerProps$4 as dialogTriggerProps, actionProps$1 as fieldActionProps, controlProps as fieldControlProps, countProps as fieldCountProps, descriptionProps$2 as fieldDescriptionProps, errorProps as fieldErrorProps, labelProps$1 as fieldLabelProps, rootProps$7 as fieldRootProps, legendProps as fieldsetLegendProps, fieldsetProps as fieldsetRootProps, formProps as formRootProps, rootProps$8 as inlineCodeRootProps, adornmentProps as inputAdornmentProps, controlProps$1 as inputControlProps, rootProps$9 as inputRootProps, chordProps as kbdChordProps, glyphProps as kbdGlyphProps, keyProps as kbdKeyProps, rootProps$10 as kbdRootProps, checkboxItemProps as menuCheckboxItemProps, contentProps$2 as menuContentProps, groupLabelProps$2 as menuGroupLabelProps, groupProps$2 as menuGroupProps, itemProps$3 as menuItemProps, radioGroupProps as menuRadioGroupProps, radioItemProps as menuRadioItemProps, separatorProps$2 as menuSeparatorProps, shortcutProps as menuShortcutProps, submenuTriggerProps as menuSubmenuTriggerProps, triggerProps$5 as menuTriggerProps, rootProps$11 as menubarRootProps, triggerProps$6 as menubarTriggerProps, indicatorProps$1 as meterIndicatorProps, labelProps$2 as meterLabelProps, rootProps$12 as meterRootProps, trackProps as meterTrackProps, valueProps as meterValueProps, contentProps$3 as navigationMenuContentProps, footerProps$2 as navigationMenuFooterProps, itemProps$4 as navigationMenuItemProps, linkDescriptionProps as navigationMenuLinkDescriptionProps, linkProps as navigationMenuLinkProps, linkTitleProps as navigationMenuLinkTitleProps, listProps$2 as navigationMenuListProps, rootProps$13 as navigationMenuRootProps, sectionProps as navigationMenuSectionProps, sectionTitleProps as navigationMenuSectionTitleProps, separatorProps$3 as navigationMenuSeparatorProps, triggerProps$7 as navigationMenuTriggerProps, viewportProps$1 as navigationMenuViewportProps, decrementProps as numberFieldDecrementProps, groupProps$3 as numberFieldGroupProps, incrementProps as numberFieldIncrementProps, inputProps$3 as numberFieldInputProps, prefixProps as numberFieldPrefixProps, rootProps$14 as numberFieldRootProps, scrubAreaCursorProps as numberFieldScrubAreaCursorProps, scrubAreaProps as numberFieldScrubAreaProps, suffixProps as numberFieldSuffixProps, inputProps$4 as otpFieldInputProps, rootProps$15 as otpFieldRootProps, separatorProps$4 as otpFieldSeparatorProps, controlsProps as paginationControlsProps, infoProps as paginationInfoProps, pageProps as paginationPageProps, pageSizeLabelProps as paginationPageSizeLabelProps, pageSizeProps as paginationPageSizeProps, rootProps$16 as paginationRootProps, separatorProps$5 as paginationSeparatorProps, closeProps$2 as popoverCloseProps, descriptionProps$3 as popoverDescriptionProps, popupProps$2 as popoverPopupProps, titleProps$3 as popoverTitleProps, triggerProps$8 as popoverTriggerProps, descriptionProps$4 as previewCardDescriptionProps, mediaProps as previewCardMediaProps, metaProps as previewCardMetaProps, popupProps$3 as previewCardPopupProps, titleProps$4 as previewCardTitleProps, triggerProps$9 as previewCardTriggerProps, indicatorProps$2 as progressIndicatorProps, labelProps$3 as progressLabelProps, rootProps$17 as progressRootProps, trackProps$1 as progressTrackProps, valueProps$1 as progressValueProps, groupProps$4 as radioGroupProps, indicatorProps$3 as radioIndicatorProps, radioProps, bodyProps$3 as railBodyProps, closeProps$3 as railCloseProps, contentProps$4 as railContentProps, headerProps$3 as railHeaderProps, layoutProps as railLayoutProps, panelProps$3 as railPanelProps, rootProps$18 as railRootProps, surfaceProps as railSurfaceProps, titleProps$5 as railTitleProps, triggerProps$10 as railTriggerProps, contentProps$5 as scrollAreaContentProps, cornerProps as scrollAreaCornerProps, rootProps$19 as scrollAreaRootProps, scrollbarProps as scrollAreaScrollbarProps, thumbProps as scrollAreaThumbProps, viewportProps$2 as scrollAreaViewportProps, footerProps$3 as searchDialogFooterProps, inputProps$5 as searchDialogInputProps, itemProps$5 as searchDialogItemProps, resultsProps as searchDialogResultsProps, rootProps$20 as searchDialogRootProps, backdropProps$2 as selectBackdropProps, groupLabelProps$3 as selectGroupLabelProps, groupProps$5 as selectGroupProps, iconProps$3 as selectIconProps, itemDescriptionProps as selectItemDescriptionProps, itemIconProps as selectItemIconProps, itemIndicatorProps as selectItemIndicatorProps, itemProps$6 as selectItemProps, itemTextProps as selectItemTextProps, listProps$3 as selectListProps, popupProps$4 as selectPopupProps, scrollDownArrowProps as selectScrollDownArrowProps, scrollUpArrowProps as selectScrollUpArrowProps, separatorProps$6 as selectSeparatorProps, triggerProps$11 as selectTriggerProps, valueProps$2 as selectValueProps, separatorProps$7 as separatorProps, backdropProps$3 as sheetBackdropProps, bodyProps$4 as sheetBodyProps, closeProps$4 as sheetCloseProps, descriptionProps$5 as sheetDescriptionProps, footerProps$4 as sheetFooterProps, headerProps$4 as sheetHeaderProps, popupProps$5 as sheetPopupProps, titleProps$6 as sheetTitleProps, triggerProps$12 as sheetTriggerProps, viewportProps$3 as sheetViewportProps, controlProps$2 as sliderControlProps, indicatorProps$4 as sliderIndicatorProps, labelProps$4 as sliderLabelProps, rootProps$21 as sliderRootProps, thumbProps$1 as sliderThumbProps, trackProps$2 as sliderTrackProps, valueProps$3 as sliderValueProps, rootProps$22 as surfaceRootProps, fieldProps$1 as switchFieldProps, labelProps$5 as switchLabelProps, switchProps, thumbProps$2 as switchThumbProps, bodyProps$5 as tableBodyProps, cellProps as tableCellProps, headProps as tableHeadProps, headerProps$5 as tableHeaderProps, rootProps$23 as tableRootProps, rowProps as tableRowProps, indicatorProps$5 as tabsIndicatorProps, listProps$4 as tabsListProps, panelProps$4 as tabsPanelProps, rootProps$24 as tabsRootProps, tabProps as tabsTabProps, controlProps$3 as textareaControlProps, rootProps$25 as textareaRootProps, toolbarProps as textareaToolbarProps, actionProps$2 as toastActionProps, closeProps$5 as toastCloseProps, contentProps$6 as toastContentProps, descriptionProps$6 as toastDescriptionProps, rootProps$26 as toastRootProps, titleProps$7 as toastTitleProps, viewportProps$4 as toastViewportProps, groupProps$6 as toggleGroupProps, rootProps$27 as toggleProps, groupProps$7 as toolbarGroupProps, inputProps$6 as toolbarInputProps, rootProps$28 as toolbarRootProps, separatorProps$8 as toolbarSeparatorProps, spacerProps as toolbarSpacerProps, popupProps$6 as tooltipPopupProps, triggerProps$13 as tooltipTriggerProps };

package/dist/styles.css

@@ -1705,6 +1705,29 @@
         --_toolbar-input-height: var(--noctis-toolbar-input-height, var(--noctis-size-control-xs));
         --_toolbar-input-padding-inline: var(--noctis-toolbar-input-padding-inline, var(--noctis-space-1\.5));
     }
+    [data-slot="noctis-pagination"] {
+        --_pagination-gap: var(--noctis-pagination-gap, var(--noctis-space-3));
+    }
+    [data-slot="noctis-pagination-info"] {
+        --_pagination-info-font-size: var(--noctis-pagination-info-font-size, var(--noctis-text-small));
+        --_pagination-info-color: var(--noctis-pagination-info-color, var(--noctis-color-muted));
+    }
+    [data-slot="noctis-pagination-page-size"] {
+        --_pagination-page-size-gap: var(--noctis-pagination-page-size-gap, var(--noctis-space-2));
+    }
+    [data-slot="noctis-pagination-page"] {
+        --_pagination-page-gap: var(--noctis-pagination-page-gap, var(--noctis-space-2));
+        --_pagination-page-inline-size: var(--noctis-pagination-page-inline-size, 3.5rem);
+        --_pagination-page-block-size: var(--noctis-pagination-page-block-size, var(--noctis-size-control-md));
+    }
+    [data-slot="noctis-pagination-separator"] {
+        --_pagination-separator-color: var(--noctis-pagination-separator-color, var(--noctis-color-border));
+        --_pagination-separator-inline-size: var(--noctis-pagination-separator-inline-size, 1px);
+        --_pagination-separator-block-size: var(--noctis-pagination-separator-block-size, 1.5rem);
+    }
+    [data-slot="noctis-pagination"][data-size="sm"] [data-slot="noctis-pagination-page"] {
+        --_pagination-page-block-size: var(--noctis-pagination-page-block-size, var(--noctis-size-control-sm));
+    }
     [data-slot="noctis-accordion-trigger"] {
         --_accordion-trigger-padding-inline: var(--noctis-accordion-trigger-padding-inline, 0);
         --_accordion-trigger-padding-block: var(--noctis-accordion-trigger-padding-block, var(--noctis-space-4));
@@ -4312,8 +4335,9 @@
      * menu trigger's popup is open (and a `Menu.Trigger` rendered as a `Button` carries
      * `data-slot="noctis-menu-trigger"`, not `"noctis-button"`), so keying on the marker is what keeps the
      * seam on exactly the real segments. The general-sibling (`~`) and `:has()` selectors look through any
-     * guard between two segments. Logical properties throughout (`margin-inline-start`, `inset-inline-start`),
-     * so the whole thing mirrors under RTL. The divider's width and colour flow through the
+     * guard between two segments. Logical properties throughout (`border-inline-start-width`,
+     * `inset-inline-start`), so the whole thing mirrors under RTL. The divider's width and colour flow
+     * through the
      * `--_button-group-seam-*` internals declared on the group slot in the generated layer, so
      * `--noctis-button-group-seam-*` retunes it; the high-contrast `strong` border token reads clearly
      * across every button variant.
@@ -4347,19 +4371,24 @@
     }
 
     /*
-     * Square each later segment's inner-start corner, and pull it onto the previous segment's border so
-     * the two share one edge. Anchored on the group root, reaching only its direct-child marked segments.
+     * Weld the segments: square each junction's corners and DROP the touching (inner) borders, so the
+     * seam drawn below is the single divider. A bordered variant (secondary/outline) used to keep its
+     * own 1px border at the junction *and* get the seam on top — two lines, a doubled divider; dropping
+     * the inner borders leaves exactly the seam. Segments sit flush (no negative margin); a borderless
+     * variant (primary/ghost/…) has no inner border to drop, so it is unaffected and the seam still
+     * divides it. Anchored on the group root, reaching only its direct-child marked segments.
      */
     [data-slot="noctis-button-group"] > [data-button-group-item] ~ [data-button-group-item] {
-        margin-inline-start: -1px;
         border-start-start-radius: 0;
         border-end-start-radius: 0;
+        border-inline-start-width: 0;
     }
 
-    /* Square the inner-end corner of every segment that has a later sibling segment. */
+    /* Square the inner-end corner of every segment that has a later sibling, and drop its inner-end border. */
     [data-slot="noctis-button-group"] > [data-button-group-item]:has(~ [data-button-group-item]) {
         border-start-end-radius: 0;
         border-end-end-radius: 0;
+        border-inline-end-width: 0;
     }
 
     /*
@@ -7761,6 +7790,97 @@
     }
 }
 
+@layer noctis.components {
+    /*
+     * Pagination is a self-contained CONTAINER, so every rule keys off its own `data-slot`. It hosts
+     * real Noctis controls — the nav buttons render `Button` welded by a `ButtonGroup`, the page field
+     * renders `Input`, the page-size picker renders `Select` — and those keep their own slots, paint,
+     * and per-size metrics: Pagination styles only its own layout (the row + cluster gaps), the info
+     * line's type, the page field's width, and the hairline separator. The control `size` is fed to the
+     * hosted controls through React context in the orchestration, not a token re-point here. Identity
+     * values flow through the generated `--_pagination-*` internals; the rest is structural layout.
+     */
+
+    /* root — the navigation row. Wraps when narrow; the consumer adds their own justify if they want
+     * the info line and controls pushed apart. */
+    [data-slot="noctis-pagination"] {
+        display: flex;
+        flex-wrap: wrap;
+        align-items: center;
+        gap: var(--_pagination-gap);
+    }
+
+    /* info — the “Showing X–Y of Z” status line, quieter than the controls. */
+    [data-slot="noctis-pagination-info"] {
+        font-size: var(--_pagination-info-font-size);
+        color: var(--_pagination-info-color);
+    }
+
+    /* page-size — the cluster laying out the “Per page” label beside its select. Layout only; the label
+     * carries its own quiet type/colour and the hosted Select keeps its own. */
+    [data-slot="noctis-pagination-page-size"] {
+        display: inline-flex;
+        align-items: center;
+        gap: var(--_pagination-page-size-gap);
+    }
+
+    [data-slot="noctis-pagination-page-size-label"] {
+        font-size: var(--noctis-text-small);
+        color: var(--noctis-color-muted);
+    }
+
+    /* page — the “Page [n] of N” cluster. The hosted Input is clamped to the page-field width and its
+     * value is centred. */
+    [data-slot="noctis-pagination-page"] {
+        display: inline-flex;
+        align-items: center;
+        gap: var(--_pagination-page-gap);
+        font-size: var(--noctis-text-small);
+        color: var(--noctis-color-muted);
+    }
+
+    [data-slot="noctis-pagination-page"] [data-slot="noctis-input"] {
+        inline-size: var(--_pagination-page-inline-size);
+    }
+
+    [data-slot="noctis-pagination-page"] input {
+        text-align: center;
+    }
+
+    /*
+     * Inside the controls `ButtonGroup`, the page field welds flush like a button segment: the wrapper is
+     * positioned so the group's seam pseudo-element anchors on it, and the inner Input is flattened — a
+     * squared radius (it must NOT follow the pill `radius-control`), its inner borders dropped so the
+     * group's seams are the only dividers (no doubled line), and its rest shadow removed so it sits level
+     * with the flattened buttons. The top/bottom field border stays, lining up with the buttons' edges.
+     */
+    [data-slot="noctis-pagination-controls"] [data-slot="noctis-pagination-page"] {
+        position: relative;
+    }
+
+    [data-slot="noctis-pagination-controls"] [data-slot="noctis-pagination-page"] [data-slot="noctis-input"] {
+        block-size: var(--_pagination-page-block-size);
+        border-inline-start-width: 0;
+        border-inline-end-width: 0;
+        border-radius: 0;
+        box-shadow: none;
+    }
+
+    /* controls — the navigation landmark wrapping the welded ButtonGroup of nav buttons. */
+    [data-slot="noctis-pagination-controls"] {
+        display: inline-flex;
+        align-items: center;
+    }
+
+    /* separator — a vertical hairline between clusters (its own minted rule, like Toolbar's). */
+    [data-slot="noctis-pagination-separator"] {
+        flex-shrink: 0;
+        inline-size: var(--_pagination-separator-inline-size);
+        block-size: var(--_pagination-separator-block-size);
+        background-color: var(--_pagination-separator-color);
+    }
+}
+
 @layer noctis.components {
     /*
      * PreviewCard is precompiled: every rule keys off the prefixed `data-slot` anchor (no `:where()`, so

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stridge/noctis",
-  "version": "1.0.0-beta.4",
+  "version": "1.0.0-beta.5",
   "license": "MIT",
   "type": "module",
   "sideEffects": [
@@ -69,9 +69,9 @@
     "culori": "4.0.2",
     "lucide-react": "1.17.0",
     "simple-icons": "16.23.0",
-    "@stridge/noctis-intl": "1.0.0-beta.4",
-    "@stridge/noctis-theme-engine": "1.0.0-beta.4",
-    "@stridge/noctis-design-tokens": "1.0.0-beta.4"
+    "@stridge/noctis-intl": "1.0.0-beta.5",
+    "@stridge/noctis-design-tokens": "1.0.0-beta.5",
+    "@stridge/noctis-theme-engine": "1.0.0-beta.5"
   },
   "peerDependencies": {
     "react": "19.2.7",