@xaui/native 0.9.1-alpha.91 → 0.9.1-alpha.92

package/dist/components/number-pad/number-pad.utils.d.ts

@@ -0,0 +1,34 @@
+/**
+ * The three digit rows, top to bottom, then `0` on the bottom one.
+ *
+ * Data rather than markup, and that is the whole reason this component renders its own
+ * grid instead of asking to be composed: `1` through `9` are not a decision a caller
+ * makes, and eleven hand-written cells is a layout that silently disagrees with itself
+ * the moment one of them is edited.
+ */
+export declare const NUMBER_PAD_ROWS: readonly [readonly ["1", "2", "3"], readonly ["4", "5", "6"], readonly ["7", "8", "9"]];
+/** The key on the bottom row, between the free cell and the backspace. */
+export declare const NUMBER_PAD_ZERO = "0";
+export type AppendOptions = {
+    value: string;
+    /** What the pressed key inserts. A digit, but a decimal separator is a key too. */
+    insert: string;
+    /** Unset means unbounded — a pad in front of an amount rather than a PIN. */
+    maxLength?: number;
+};
+/**
+ * The value after a key press.
+ *
+ * It **clamps rather than truncates**: a press past `maxLength` returns the value
+ * unchanged, so the caller's `onChangeText` does not fire and a full PIN cannot be
+ * completed twice by leaning on a key.
+ *
+ * The insert is measured whole rather than as one character, because a key may carry more
+ * than one — a `00` key on a currency pad is a key, and a pad that let it land halfway
+ * over the limit would produce a value one character longer than it promised.
+ */
+export declare function appendKey({ value, insert, maxLength }: AppendOptions): string;
+/** The value after a backspace. Empty stays empty rather than becoming `undefined`. */
+export declare function removeLast(value: string): string;
+/** Whether the value has reached the length the pad was given. */
+export declare function isComplete(value: string, maxLength?: number): boolean;

package/dist/components/pager/index.cjs

@@ -0,0 +1,31 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+
+
+
+
+
+
+var _chunkUR37LVPUcjs = require('../../chunk-UR37LVPU.cjs');
+require('../../chunk-FTPPUTWL.cjs');
+require('../../chunk-WFEMJCXO.cjs');
+require('../../chunk-7EIHHOHP.cjs');
+require('../../chunk-FHNIGHN5.cjs');
+require('../../chunk-SL3V7R2Y.cjs');
+require('../../chunk-TVJXC4HY.cjs');
+require('../../chunk-CDRGTUYF.cjs');
+require('../../chunk-H4E4HDEP.cjs');
+require('../../chunk-EJQCQPET.cjs');
+require('../../chunk-IIAQISBG.cjs');
+require('../../chunk-TK44VBIE.cjs');
+
+
+
+
+
+
+
+
+
+exports.Pager = _chunkUR37LVPUcjs.Pager; exports.PagerContent = _chunkUR37LVPUcjs.PagerContent; exports.PagerDot = _chunkUR37LVPUcjs.PagerDot; exports.PagerIndicator = _chunkUR37LVPUcjs.PagerIndicator; exports.PagerPage = _chunkUR37LVPUcjs.PagerPage; exports.PagerRoot = _chunkUR37LVPUcjs.PagerRoot; exports.pagerRecipe = _chunkUR37LVPUcjs.pagerRecipe; exports.usePager = _chunkUR37LVPUcjs.usePager;

package/dist/components/pager/index.d.cts

@@ -0,0 +1,60 @@
+export declare const Pager: import("react").ForwardRefExoticComponent<{
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & Omit<import("react-native").ViewProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+}> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+}> & import("react").RefAttributes<import("react-native").View>> & {
+    Content: import("react").ForwardRefExoticComponent<Omit<import("react-native").ScrollViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ScrollViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").ScrollView>>;
+    Page: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Indicator: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Dot: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & {
+        index: number;
+    } & import("react").RefAttributes<import("react-native").View>>;
+};
+export { PagerRoot } from './pager';
+export { PagerContent } from './pager-content';
+export { PagerDot, PagerIndicator } from './pager-indicator';
+export { PagerPage } from './pager-page';
+export { usePager } from './pager.context';
+export { pagerRecipe } from './pager.recipe';
+export type { PagerContentProps, PagerContextValue, PagerDotInk, PagerDotProps, PagerOrientation, PagerProps, PagerSize, PagerSlot, PagerTrackSize, PagerVariant, PagerViewSlotProps, } from './pager.type';

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

@@ -0,0 +1,60 @@
+export declare const Pager: import("react").ForwardRefExoticComponent<{
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & Omit<import("react-native").ViewProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+}> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+}> & import("react").RefAttributes<import("react-native").View>> & {
+    Content: import("react").ForwardRefExoticComponent<Omit<import("react-native").ScrollViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ScrollViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").ScrollView>>;
+    Page: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Indicator: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Dot: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+        children?: import("react").ReactNode;
+    } & {
+        index: number;
+    } & import("react").RefAttributes<import("react-native").View>>;
+};
+export { PagerRoot } from './pager';
+export { PagerContent } from './pager-content';
+export { PagerDot, PagerIndicator } from './pager-indicator';
+export { PagerPage } from './pager-page';
+export { usePager } from './pager.context';
+export { pagerRecipe } from './pager.recipe';
+export type { PagerContentProps, PagerContextValue, PagerDotInk, PagerDotProps, PagerOrientation, PagerProps, PagerSize, PagerSlot, PagerTrackSize, PagerVariant, PagerViewSlotProps, } from './pager.type';

package/dist/components/pager/index.js

@@ -0,0 +1,31 @@
+import {
+  Pager,
+  PagerContent,
+  PagerDot,
+  PagerIndicator,
+  PagerPage,
+  PagerRoot,
+  pagerRecipe,
+  usePager
+} from "../../chunk-KPKEZWZM.js";
+import "../../chunk-3A5RK2R7.js";
+import "../../chunk-NCTOTTVW.js";
+import "../../chunk-F6W3JQ7K.js";
+import "../../chunk-WFZDAXDI.js";
+import "../../chunk-DKVXTMIJ.js";
+import "../../chunk-3Q42X6EQ.js";
+import "../../chunk-TTZOIXKE.js";
+import "../../chunk-36PRYGAM.js";
+import "../../chunk-EGLLDKN6.js";
+import "../../chunk-Z6JBWRPL.js";
+import "../../chunk-M63GFNKV.js";
+export {
+  Pager,
+  PagerContent,
+  PagerDot,
+  PagerIndicator,
+  PagerPage,
+  PagerRoot,
+  pagerRecipe,
+  usePager
+};

package/dist/components/pager/pager-content.d.cts

@@ -0,0 +1,24 @@
+import type { ScrollView } from 'react-native';
+/**
+ * The track: the pages, and the swiping of them.
+ *
+ * **It pages.** `pagingEnabled` is React Native's own whole-viewport paging — the thing this
+ * component is, and the thing the `Carousel` cannot use because its slides are a division of
+ * the track rather than the whole of it.
+ *
+ * **It measures itself**, and that is why the measurement is here rather than on the root:
+ * the indicator sits in the flow under the pages, so the root is taller than the box a page
+ * has to fill by exactly the height of the dots.
+ *
+ * **It counts its own children**, which is how the dots know how many pages there are
+ * without the caller passing a number that can go stale. The count is published upwards
+ * because the indicator is the track's *sibling*, not its child.
+ *
+ * **It reports its offset on the UI thread**, and the settled index from the same handler.
+ * Nothing re-renders while a finger is down except at the moment the nearest page changes,
+ * which is once per page crossed.
+ */
+export declare const PagerContent: import("react").ForwardRefExoticComponent<Omit<import("react-native").ScrollViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ScrollViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<ScrollView>>;

package/dist/components/pager/pager-content.d.ts

@@ -0,0 +1,24 @@
+import type { ScrollView } from 'react-native';
+/**
+ * The track: the pages, and the swiping of them.
+ *
+ * **It pages.** `pagingEnabled` is React Native's own whole-viewport paging — the thing this
+ * component is, and the thing the `Carousel` cannot use because its slides are a division of
+ * the track rather than the whole of it.
+ *
+ * **It measures itself**, and that is why the measurement is here rather than on the root:
+ * the indicator sits in the flow under the pages, so the root is taller than the box a page
+ * has to fill by exactly the height of the dots.
+ *
+ * **It counts its own children**, which is how the dots know how many pages there are
+ * without the caller passing a number that can go stale. The count is published upwards
+ * because the indicator is the track's *sibling*, not its child.
+ *
+ * **It reports its offset on the UI thread**, and the settled index from the same handler.
+ * Nothing re-renders while a finger is down except at the moment the nearest page changes,
+ * which is once per page crossed.
+ */
+export declare const PagerContent: import("react").ForwardRefExoticComponent<Omit<import("react-native").ScrollViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ScrollViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<ScrollView>>;

package/dist/components/pager/pager-indicator.d.cts

@@ -0,0 +1,47 @@
+import { View } from 'react-native';
+/**
+ * Which page the reader is on.
+ *
+ * With no children it draws one dot per page, which is what it is for. Children are the long
+ * form — a subset, a label beside them, a shape of your own:
+ *
+ * ```tsx
+ * <Pager.Indicator>
+ *   {steps.map((step, index) => (
+ *     <Pager.Dot key={step.id} index={index} />
+ *   ))}
+ * </Pager.Indicator>
+ * ```
+ *
+ * It sits **in the flow**, under the pages. A caller who wants it over them says so —
+ * `position="absolute" bottom={16} start={0} end={0}` — which is what the style props are
+ * for; absolute by default would have made the common case the one that needs undoing.
+ */
+export declare const PagerIndicator: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;
+/**
+ * One dot.
+ *
+ * **It changes colour, it does not stretch.** That is the difference from
+ * `Carousel.Dot`, and it is deliberate rather than a simplification: a page control is a
+ * fixed row of marks saying how many screens there are and which one you are on, and a mark
+ * that grows makes the row's arithmetic move under a reader who is counting it. The
+ * carousel's pill is a *progress* indicator over a series; this is a position among screens.
+ *
+ * **It follows the drag rather than the settle.** The colour is interpolated from the live
+ * scroll offset on the UI thread, so it travels while the finger is still down — which is
+ * what makes a reader believe the dots are attached to the thing they are moving. Reading
+ * the settled index instead would make it jump once per gesture, after the fact.
+ *
+ * **A screen reader hears "3 of 5" rather than a label**, through `accessibilityValue`. A dot
+ * has no text of its own, and inventing one would be picking a language on behalf of every
+ * app that installs this.
+ */
+export declare const PagerDot: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & {
+    index: number;
+} & import("react").RefAttributes<View>>;

package/dist/components/pager/pager-indicator.d.ts

@@ -0,0 +1,47 @@
+import { View } from 'react-native';
+/**
+ * Which page the reader is on.
+ *
+ * With no children it draws one dot per page, which is what it is for. Children are the long
+ * form — a subset, a label beside them, a shape of your own:
+ *
+ * ```tsx
+ * <Pager.Indicator>
+ *   {steps.map((step, index) => (
+ *     <Pager.Dot key={step.id} index={index} />
+ *   ))}
+ * </Pager.Indicator>
+ * ```
+ *
+ * It sits **in the flow**, under the pages. A caller who wants it over them says so —
+ * `position="absolute" bottom={16} start={0} end={0}` — which is what the style props are
+ * for; absolute by default would have made the common case the one that needs undoing.
+ */
+export declare const PagerIndicator: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;
+/**
+ * One dot.
+ *
+ * **It changes colour, it does not stretch.** That is the difference from
+ * `Carousel.Dot`, and it is deliberate rather than a simplification: a page control is a
+ * fixed row of marks saying how many screens there are and which one you are on, and a mark
+ * that grows makes the row's arithmetic move under a reader who is counting it. The
+ * carousel's pill is a *progress* indicator over a series; this is a position among screens.
+ *
+ * **It follows the drag rather than the settle.** The colour is interpolated from the live
+ * scroll offset on the UI thread, so it travels while the finger is still down — which is
+ * what makes a reader believe the dots are attached to the thing they are moving. Reading
+ * the settled index instead would make it jump once per gesture, after the fact.
+ *
+ * **A screen reader hears "3 of 5" rather than a label**, through `accessibilityValue`. A dot
+ * has no text of its own, and inventing one would be picking a language on behalf of every
+ * app that installs this.
+ */
+export declare const PagerDot: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & {
+    index: number;
+} & import("react").RefAttributes<View>>;

package/dist/components/pager/pager-page.d.cts

@@ -0,0 +1,16 @@
+import { View } from 'react-native';
+/**
+ * One page.
+ *
+ * Its size is the **track's**, on both axes, measured rather than given — which is the whole
+ * difference between this and a `Carousel.Item`, whose width is a *division* of the track by
+ * `itemsPerView` and the gaps. A page given a size in points is a page that is wrong on the
+ * next screen.
+ *
+ * It clips, so content drawn to its edges stops at them instead of bleeding onto the page
+ * beside it while the track is mid-travel.
+ */
+export declare const PagerPage: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

package/dist/components/pager/pager-page.d.ts

@@ -0,0 +1,16 @@
+import { View } from 'react-native';
+/**
+ * One page.
+ *
+ * Its size is the **track's**, on both axes, measured rather than given — which is the whole
+ * difference between this and a `Carousel.Item`, whose width is a *division* of the track by
+ * `itemsPerView` and the gaps. A page given a size in points is a page that is wrong on the
+ * next screen.
+ *
+ * It clips, so content drawn to its edges stops at them instead of bleeding onto the page
+ * beside it while the track is mid-travel.
+ */
+export declare const PagerPage: import("react").ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "style"> & Omit<import("../..").ViewStyleProps, keyof import("react-native").ViewProps> & {
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

package/dist/components/pager/pager.context.d.cts

@@ -0,0 +1,7 @@
+import type { PagerContextValue } from './pager.type';
+/**
+ * R10 — `usePager` is exported so a control beside the pager can drive it (`goTo`) or read
+ * where it is, and so a caller can write their own indicator against the same live `offset`
+ * the built-in dots read. Outside a `<Pager>` it throws by name.
+ */
+export declare const PagerProvider: import("react").Provider<PagerContextValue | null>, usePager: () => PagerContextValue;

package/dist/components/pager/pager.context.d.ts

@@ -0,0 +1,7 @@
+import type { PagerContextValue } from './pager.type';
+/**
+ * R10 — `usePager` is exported so a control beside the pager can drive it (`goTo`) or read
+ * where it is, and so a caller can write their own indicator against the same live `offset`
+ * the built-in dots read. Outside a `<Pager>` it throws by name.
+ */
+export declare const PagerProvider: import("react").Provider<PagerContextValue | null>, usePager: () => PagerContextValue;

package/dist/components/pager/pager.d.cts

@@ -0,0 +1,71 @@
+import { View } from 'react-native';
+import type { ViewStyle } from 'react-native';
+/**
+ * Whole pages, one at a time — the onboarding flow, the full-screen feed, the gallery a
+ * reader swipes through.
+ *
+ * ```tsx
+ * <Pager>
+ *   <Pager.Content>
+ *     <Pager.Page><Welcome /></Pager.Page>
+ *     <Pager.Page><Permissions /></Pager.Page>
+ *     <Pager.Page><Done /></Pager.Page>
+ *   </Pager.Content>
+ *
+ *   <Pager.Indicator />
+ * </Pager>
+ * ```
+ *
+ * **A page is the track, measured.** Not a prop, and not a fraction of one: a pager's page
+ * is the viewport it sits in, on both axes, so it is measured once and handed down. That is
+ * also what separates this from the `Carousel`, whose slides are a *division* of the track
+ * and which therefore has `itemsPerView`, `peek` and a gap to divide it by.
+ *
+ * **It has no height of its own** — give it one, `flex={1}` to fill a screen or
+ * `height={320}` inside a scroll view. A `flex: 1` in the recipe would have overridden an
+ * explicit `height` through RN's zero flex-basis, which is the trap the recipe explains.
+ *
+ * **It pages rather than snapping.** `pagingEnabled` is React Native's own whole-viewport
+ * paging, which is exactly this component's job and exactly what the `Carousel` cannot use.
+ *
+ * **The pages are yours and the dots are the library's.** `variant`, `color` and `size`
+ * reach the dots and nothing else — a pager of screens and a pager of photographs want
+ * opposite things inside a page, and the caller is the one who knows which this is.
+ *
+ * `usePager()` publishes `goTo`, the settled `index` and the live `offset`, so a "Skip"
+ * button beside the pager costs no state and an indicator of your own follows the drag.
+ */
+export declare const PagerRoot: import("react").ForwardRefExoticComponent<{
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<ViewStyle>;
+    children?: import("react").ReactNode;
+} & Omit<import("react-native").ViewProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<ViewStyle>;
+    children?: import("react").ReactNode;
+}> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<ViewStyle>;
+    children?: import("react").ReactNode;
+}> & import("react").RefAttributes<View>>;

package/dist/components/pager/pager.d.ts

@@ -0,0 +1,71 @@
+import { View } from 'react-native';
+import type { ViewStyle } from 'react-native';
+/**
+ * Whole pages, one at a time — the onboarding flow, the full-screen feed, the gallery a
+ * reader swipes through.
+ *
+ * ```tsx
+ * <Pager>
+ *   <Pager.Content>
+ *     <Pager.Page><Welcome /></Pager.Page>
+ *     <Pager.Page><Permissions /></Pager.Page>
+ *     <Pager.Page><Done /></Pager.Page>
+ *   </Pager.Content>
+ *
+ *   <Pager.Indicator />
+ * </Pager>
+ * ```
+ *
+ * **A page is the track, measured.** Not a prop, and not a fraction of one: a pager's page
+ * is the viewport it sits in, on both axes, so it is measured once and handed down. That is
+ * also what separates this from the `Carousel`, whose slides are a *division* of the track
+ * and which therefore has `itemsPerView`, `peek` and a gap to divide it by.
+ *
+ * **It has no height of its own** — give it one, `flex={1}` to fill a screen or
+ * `height={320}` inside a scroll view. A `flex: 1` in the recipe would have overridden an
+ * explicit `height` through RN's zero flex-basis, which is the trap the recipe explains.
+ *
+ * **It pages rather than snapping.** `pagingEnabled` is React Native's own whole-viewport
+ * paging, which is exactly this component's job and exactly what the `Carousel` cannot use.
+ *
+ * **The pages are yours and the dots are the library's.** `variant`, `color` and `size`
+ * reach the dots and nothing else — a pager of screens and a pager of photographs want
+ * opposite things inside a page, and the caller is the one who knows which this is.
+ *
+ * `usePager()` publishes `goTo`, the settled `index` and the live `offset`, so a "Skip"
+ * button beside the pager costs no state and an indicator of your own follows the drag.
+ */
+export declare const PagerRoot: import("react").ForwardRefExoticComponent<{
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<ViewStyle>;
+    children?: import("react").ReactNode;
+} & Omit<import("react-native").ViewProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<ViewStyle>;
+    children?: import("react").ReactNode;
+}> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./pager.type").PagerVariant;
+    size?: import("./pager.type").PagerSize;
+    color?: string;
+    orientation?: import("./pager.type").PagerOrientation;
+    index?: number;
+    defaultIndex?: number;
+    onIndexChange?: (index: number) => void;
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<ViewStyle>;
+    children?: import("react").ReactNode;
+}> & import("react").RefAttributes<View>>;

package/dist/components/pager/pager.recipe.d.cts

@@ -0,0 +1,15 @@
+import type { SlotStyles } from '../../system/recipe';
+import type { XAUITheme } from '../../theme/theme.type';
+import type { PagerSlot, PagerVariant } from './pager.type';
+export declare const pagerRecipe: import("../..").Recipe<"content" | "root" | "dot" | "indicator" | "page" | "dotActive", PagerVariant, {
+    readonly size: {
+        readonly xs: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+        readonly sm: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+        readonly md: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+        readonly lg: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+    };
+    readonly orientation: {
+        readonly horizontal: () => SlotStyles<PagerSlot>;
+        readonly vertical: () => SlotStyles<PagerSlot>;
+    };
+}>;

package/dist/components/pager/pager.recipe.d.ts

@@ -0,0 +1,15 @@
+import type { SlotStyles } from '../../system/recipe';
+import type { XAUITheme } from '../../theme/theme.type';
+import type { PagerSlot, PagerVariant } from './pager.type';
+export declare const pagerRecipe: import("../..").Recipe<"content" | "root" | "dot" | "indicator" | "page" | "dotActive", PagerVariant, {
+    readonly size: {
+        readonly xs: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+        readonly sm: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+        readonly md: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+        readonly lg: (theme: XAUITheme) => SlotStyles<PagerSlot>;
+    };
+    readonly orientation: {
+        readonly horizontal: () => SlotStyles<PagerSlot>;
+        readonly vertical: () => SlotStyles<PagerSlot>;
+    };
+}>;