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

package/dist/components/morph-button/morph-button.type.d.ts

@@ -0,0 +1,99 @@
+import type { ReactNode } from 'react';
+import type { PressableStateCallbackType, StyleProp, TextProps, TextStyle, ViewProps, ViewStyle } from 'react-native';
+import type { IconContextValue, IconProps } from '../../system/icon';
+import type { PressableFeedbackProps } from '../../system/pressable-feedback';
+import type { TextStyleProps, ViewStyleProps } from '../../system/style-props';
+import type { RadiusKey } from '../../theme/theme.type';
+export type MorphButtonSlot = 'root' | 'collapsed' | 'expanded' | 'label' | 'title' | 'description' | 'icon';
+/**
+ * The `Button`'s union, unchanged: a `MorphButton` is a button, and the emphasis ladder it
+ * sits on is the same one. `success` and `warning` are absent here for the reason they are
+ * absent there — neither is an action, and a button is something you press.
+ */
+export type MorphButtonVariant = 'primary' | 'secondary' | 'default' | 'tertiary' | 'ghost' | 'danger' | 'danger-soft';
+/**
+ * Three steps, not four. `xs` is a 32-point control, and a card that opens out of one has
+ * less room for its own padding than the padding it would need — the shape it morphs into
+ * would be a pill with two lines crammed in it.
+ */
+export type MorphButtonSize = 'sm' | 'md' | 'lg';
+/**
+ * How the box travels between the two shapes. Three knobs, because that is what a spring
+ * is; anything past them is a different animation and therefore a different component.
+ */
+export type MorphSpring = {
+    stiffness?: number;
+    damping?: number;
+    mass?: number;
+};
+type MorphButtonOwnProps = {
+    variant?: MorphButtonVariant;
+    /** The collapsed height, the paddings, the gaps, the corner and the type. Never width. */
+    size?: MorphButtonSize;
+    /**
+     * Overrides the corner both shapes share. Unset, it is half the collapsed height — which
+     * is what makes the collapsed shape a pill and the expanded one a card, from one value.
+     */
+    radius?: RadiusKey;
+    /** A raw tint (R7), landing where the variant put its tokens. */
+    color?: string;
+    /** Which shape it is in. Present means controlled. */
+    isExpanded?: boolean;
+    /** Which shape it is in at first mount. @default false */
+    defaultExpanded?: boolean;
+    onExpandedChange?: (isExpanded: boolean) => void;
+    /**
+     * `false` puts it in the other shape with no travel at all — the box jumps and the faces
+     * swap without a fade.
+     */
+    animation?: boolean | MorphSpring;
+    isDisabled?: boolean;
+    /** R12 — merge into the single child instead of rendering a pressable. */
+    asChild?: boolean;
+    /** R9 — `Pressable`'s function form as much as an object or an array. */
+    style?: StyleProp<ViewStyle> | ((state: PressableStateCallbackType) => StyleProp<ViewStyle>);
+    children?: ReactNode;
+};
+/** R14 — it renders a `PressableFeedback`, so it carries that node's style keys through it. */
+export type MorphButtonProps = MorphButtonOwnProps & Omit<PressableFeedbackProps, 'isPressed' | 'layout' | 'style' | 'children' | keyof MorphButtonOwnProps>;
+/** `View`'s own props win over the `ViewStyle` keys of the same name (R14). */
+export type MorphButtonFaceProps = ViewProps & Omit<ViewStyleProps, keyof ViewProps> & {
+    children?: ReactNode;
+};
+/** `Text`'s own props win over the `TextStyle` keys of the same name (R14). */
+export type MorphButtonTextProps = TextProps & Omit<TextStyleProps, keyof TextProps> & {
+    children?: ReactNode;
+};
+export type MorphButtonIconProps = IconProps;
+/**
+ * R5 — resolved styles, not props for a slot to resolve a second time. The two faces are
+ * in here for the same reason the label is: each one is a cached `StyleSheet` reference
+ * the root already computed, and a face merges its own `style` on top of it.
+ */
+export type MorphButtonContextValue = {
+    collapsedStyle: StyleProp<ViewStyle>;
+    expandedStyle: StyleProp<ViewStyle>;
+    labelStyle: StyleProp<TextStyle>;
+    titleStyle: StyleProp<TextStyle>;
+    descriptionStyle: StyleProp<TextStyle>;
+    /**
+     * Values, not a style: `Icon` hands `size` and `color` to a third-party component, so
+     * the root flattens its icon slot once here rather than in every icon it contains.
+     */
+    icon: IconContextValue;
+    /** Which face is mounted — the faces read it rather than being told by a prop. */
+    isExpanded: boolean;
+    /** Morphs it. A control inside a face is written against this, and it costs no state. */
+    toggle: () => void;
+    isDisabled: boolean;
+    /**
+     * Whether the faces fade as they swap. `animation={false}` has to reach them too, or the
+     * box would jump while the content still took a hundred and forty milliseconds to arrive.
+     *
+     * It is also `false` until the button has changed shape once, because Reanimated runs an
+     * `entering` animation on the first mount as well: without that, every button on a screen
+     * would fade its collapsed face in as the screen arrived.
+     */
+    animation: boolean;
+};
+export {};

package/dist/components/number-pad/index.cjs

@@ -0,0 +1,40 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+
+
+
+
+
+
+
+
+
+
+var _chunkLKRQUQZQcjs = require('../../chunk-LKRQUQZQ.cjs');
+require('../../chunk-7EIHHOHP.cjs');
+require('../../chunk-OW4N2C3M.cjs');
+require('../../chunk-7DPL3ZDS.cjs');
+require('../../chunk-GSZDN6EZ.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.NUMBER_PAD_ROWS = _chunkLKRQUQZQcjs.NUMBER_PAD_ROWS; exports.NUMBER_PAD_ZERO = _chunkLKRQUQZQcjs.NUMBER_PAD_ZERO; exports.NumberPad = _chunkLKRQUQZQcjs.NumberPad; exports.NumberPadAction = _chunkLKRQUQZQcjs.NumberPadAction; exports.NumberPadBackspace = _chunkLKRQUQZQcjs.NumberPadBackspace; exports.NumberPadIcon = _chunkLKRQUQZQcjs.NumberPadIcon; exports.NumberPadKey = _chunkLKRQUQZQcjs.NumberPadKey; exports.NumberPadLabel = _chunkLKRQUQZQcjs.NumberPadLabel; exports.NumberPadRoot = _chunkLKRQUQZQcjs.NumberPadRoot; exports.numberPadRecipe = _chunkLKRQUQZQcjs.numberPadRecipe; exports.useNumberPad = _chunkLKRQUQZQcjs.useNumberPad; exports.useNumberPadCell = _chunkLKRQUQZQcjs.useNumberPadCell;

package/dist/components/number-pad/index.d.cts

@@ -0,0 +1,60 @@
+import { NumberPadIcon } from './number-pad-icon';
+export declare const NumberPad: import("react").ForwardRefExoticComponent<{
+    variant?: import("./number-pad.type").NumberPadVariant;
+    size?: import("./number-pad.type").NumberPadSize;
+    radius?: import("../..").RadiusKey;
+    color?: string;
+    value?: string;
+    defaultValue?: string;
+    onChangeText?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    maxLength?: number;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./number-pad.type").NumberPadVariant;
+    size?: import("./number-pad.type").NumberPadSize;
+    radius?: import("../..").RadiusKey;
+    color?: string;
+    value?: string;
+    defaultValue?: string;
+    onChangeText?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    maxLength?: number;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+}> & import("react").RefAttributes<import("react-native").View>> & {
+    Key: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        isDisabled?: boolean;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & {
+        value: string;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Backspace: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        isDisabled?: boolean;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Action: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        isDisabled?: boolean;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Label: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").Text>>;
+    Icon: typeof NumberPadIcon;
+};
+export { NumberPadRoot } from './number-pad';
+export { NumberPadAction } from './number-pad-action';
+export { NumberPadBackspace } from './number-pad-backspace';
+export { NumberPadIcon } from './number-pad-icon';
+export { NumberPadKey } from './number-pad-key';
+export { NumberPadLabel } from './number-pad-label';
+export { useNumberPad, useNumberPadCell } from './number-pad.context';
+export { numberPadRecipe } from './number-pad.recipe';
+export { NUMBER_PAD_ROWS, NUMBER_PAD_ZERO } from './number-pad.utils';
+export type { NumberPadActionProps, NumberPadBackspaceProps, NumberPadCellContextValue, NumberPadContextValue, NumberPadIconProps, NumberPadKeyProps, NumberPadLabelProps, NumberPadProps, NumberPadSize, NumberPadSlot, NumberPadVariant, } from './number-pad.type';

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

@@ -0,0 +1,60 @@
+import { NumberPadIcon } from './number-pad-icon';
+export declare const NumberPad: import("react").ForwardRefExoticComponent<{
+    variant?: import("./number-pad.type").NumberPadVariant;
+    size?: import("./number-pad.type").NumberPadSize;
+    radius?: import("../..").RadiusKey;
+    color?: string;
+    value?: string;
+    defaultValue?: string;
+    onChangeText?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    maxLength?: number;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./number-pad.type").NumberPadVariant;
+    size?: import("./number-pad.type").NumberPadSize;
+    radius?: import("../..").RadiusKey;
+    color?: string;
+    value?: string;
+    defaultValue?: string;
+    onChangeText?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    maxLength?: number;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+}> & import("react").RefAttributes<import("react-native").View>> & {
+    Key: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        isDisabled?: boolean;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & {
+        value: string;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Backspace: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        isDisabled?: boolean;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Action: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+        isDisabled?: boolean;
+        style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").View>>;
+    Label: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
+        children?: import("react").ReactNode;
+    } & import("react").RefAttributes<import("react-native").Text>>;
+    Icon: typeof NumberPadIcon;
+};
+export { NumberPadRoot } from './number-pad';
+export { NumberPadAction } from './number-pad-action';
+export { NumberPadBackspace } from './number-pad-backspace';
+export { NumberPadIcon } from './number-pad-icon';
+export { NumberPadKey } from './number-pad-key';
+export { NumberPadLabel } from './number-pad-label';
+export { useNumberPad, useNumberPadCell } from './number-pad.context';
+export { numberPadRecipe } from './number-pad.recipe';
+export { NUMBER_PAD_ROWS, NUMBER_PAD_ZERO } from './number-pad.utils';
+export type { NumberPadActionProps, NumberPadBackspaceProps, NumberPadCellContextValue, NumberPadContextValue, NumberPadIconProps, NumberPadKeyProps, NumberPadLabelProps, NumberPadProps, NumberPadSize, NumberPadSlot, NumberPadVariant, } from './number-pad.type';

package/dist/components/number-pad/index.js

@@ -0,0 +1,40 @@
+import {
+  NUMBER_PAD_ROWS,
+  NUMBER_PAD_ZERO,
+  NumberPad,
+  NumberPadAction,
+  NumberPadBackspace,
+  NumberPadIcon,
+  NumberPadKey,
+  NumberPadLabel,
+  NumberPadRoot,
+  numberPadRecipe,
+  useNumberPad,
+  useNumberPadCell
+} from "../../chunk-GGP2ERSV.js";
+import "../../chunk-F6W3JQ7K.js";
+import "../../chunk-2AFA5HA2.js";
+import "../../chunk-423RQBOX.js";
+import "../../chunk-JN6IRT2M.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 {
+  NUMBER_PAD_ROWS,
+  NUMBER_PAD_ZERO,
+  NumberPad,
+  NumberPadAction,
+  NumberPadBackspace,
+  NumberPadIcon,
+  NumberPadKey,
+  NumberPadLabel,
+  NumberPadRoot,
+  numberPadRecipe,
+  useNumberPad,
+  useNumberPadCell
+};

package/dist/components/number-pad/number-pad-action.d.cts

@@ -0,0 +1,24 @@
+import type { View } from 'react-native';
+/**
+ * The free corner of the bottom row, opposite the backspace.
+ *
+ * It does nothing on its own — the press is the caller's, because what belongs there is
+ * theirs: a fingerprint that unlocks, a `Clear`, the pad's own decimal separator. Bare like
+ * the backspace, so the two corners read as a pair around the `0`.
+ *
+ * ```tsx
+ * <NumberPad>
+ *   <NumberPad.Action onPress={unlock} accessibilityLabel="Unlock with Face ID">
+ *     <NumberPad.Icon as={FaceIdIcon} color={theme.colors.accent} />
+ *   </NumberPad.Action>
+ * </NumberPad>
+ * ```
+ *
+ * A key that inserts goes there as a `NumberPad.Key` instead; this one is for everything
+ * that is not a character.
+ */
+export declare const NumberPadAction: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

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

@@ -0,0 +1,24 @@
+import type { View } from 'react-native';
+/**
+ * The free corner of the bottom row, opposite the backspace.
+ *
+ * It does nothing on its own — the press is the caller's, because what belongs there is
+ * theirs: a fingerprint that unlocks, a `Clear`, the pad's own decimal separator. Bare like
+ * the backspace, so the two corners read as a pair around the `0`.
+ *
+ * ```tsx
+ * <NumberPad>
+ *   <NumberPad.Action onPress={unlock} accessibilityLabel="Unlock with Face ID">
+ *     <NumberPad.Icon as={FaceIdIcon} color={theme.colors.accent} />
+ *   </NumberPad.Action>
+ * </NumberPad>
+ * ```
+ *
+ * A key that inserts goes there as a `NumberPad.Key` instead; this one is for everything
+ * that is not a character.
+ */
+export declare const NumberPadAction: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

package/dist/components/number-pad/number-pad-backspace.d.cts

@@ -0,0 +1,18 @@
+import type { View } from 'react-native';
+/**
+ * The delete key, on the end of the bottom row. Bare rather than filled: it is not a digit,
+ * and eleven identical fills is a pad where the one key that removes looks like the ten that
+ * add.
+ *
+ * **A long press clears the whole value.** It is the gesture every platform's own keypad
+ * carries, and without it a mistyped sixteen-digit card is sixteen presses to undo.
+ *
+ * The arrow is a **character**, not an icon, so the pad needs no SVG peer for the one glyph
+ * it draws itself. It flips under RTL, because a backspace points at what it removes and
+ * that is the other way round in a right-to-left layout. `NumberPad.Icon` replaces it.
+ */
+export declare const NumberPadBackspace: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

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

@@ -0,0 +1,18 @@
+import type { View } from 'react-native';
+/**
+ * The delete key, on the end of the bottom row. Bare rather than filled: it is not a digit,
+ * and eleven identical fills is a pad where the one key that removes looks like the ten that
+ * add.
+ *
+ * **A long press clears the whole value.** It is the gesture every platform's own keypad
+ * carries, and without it a mistyped sixteen-digit card is sixteen presses to undo.
+ *
+ * The arrow is a **character**, not an icon, so the pad needs no SVG peer for the one glyph
+ * it draws itself. It flips under RTL, because a backspace points at what it removes and
+ * that is the other way round in a right-to-left layout. `NumberPad.Icon` replaces it.
+ */
+export declare const NumberPadBackspace: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<View>>;

package/dist/components/number-pad/number-pad-cell.d.cts

@@ -0,0 +1,7 @@
+import type { View } from 'react-native';
+import type { NumberPadCellTone, NumberPadKeyProps } from './number-pad.type';
+export declare const NumberPadCell: import("react").ForwardRefExoticComponent<Omit<NumberPadKeyProps, "value"> & {
+    tone: NumberPadCellTone;
+    /** What the press does to the value. Composed after the caller's own `onPress`. */
+    onActivate?: () => void;
+} & import("react").RefAttributes<View>>;

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

@@ -0,0 +1,7 @@
+import type { View } from 'react-native';
+import type { NumberPadCellTone, NumberPadKeyProps } from './number-pad.type';
+export declare const NumberPadCell: import("react").ForwardRefExoticComponent<Omit<NumberPadKeyProps, "value"> & {
+    tone: NumberPadCellTone;
+    /** What the press does to the value. Composed after the caller's own `onPress`. */
+    onActivate?: () => void;
+} & import("react").RefAttributes<View>>;

package/dist/components/number-pad/number-pad-icon.d.cts

@@ -0,0 +1,13 @@
+import type { NumberPadIconProps } from './number-pad.type';
+/**
+ * A glyph on a cell, taking the pad's size and the cell's colour without being told either
+ * — the fingerprint in the free corner, or a drawn backspace in place of the character one.
+ *
+ * The colour follows the cell it is in for the reason the label's does: a filled key reads
+ * the variant's foreground and a bare corner the page's. An explicit `color` still wins,
+ * which is what makes the accent-coloured biometric key one prop.
+ */
+export declare function NumberPadIcon({ size, color, ...rest }: NumberPadIconProps): import("react").JSX.Element;
+export declare namespace NumberPadIcon {
+    var displayName: string;
+}

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

@@ -0,0 +1,13 @@
+import type { NumberPadIconProps } from './number-pad.type';
+/**
+ * A glyph on a cell, taking the pad's size and the cell's colour without being told either
+ * — the fingerprint in the free corner, or a drawn backspace in place of the character one.
+ *
+ * The colour follows the cell it is in for the reason the label's does: a filled key reads
+ * the variant's foreground and a bare corner the page's. An explicit `color` still wins,
+ * which is what makes the accent-coloured biometric key one prop.
+ */
+export declare function NumberPadIcon({ size, color, ...rest }: NumberPadIconProps): import("react").JSX.Element;
+export declare namespace NumberPadIcon {
+    var displayName: string;
+}

package/dist/components/number-pad/number-pad-key.d.cts

@@ -0,0 +1,24 @@
+import type { View } from 'react-native';
+/**
+ * One filled key.
+ *
+ * The root renders ten of these and names none of them, because the digits are data. This
+ * is exported for the eleventh — a decimal separator or a `00` on a currency pad, dropped
+ * into the free cell:
+ *
+ * ```tsx
+ * <NumberPad>
+ *   <NumberPad.Key value="," />
+ * </NumberPad>
+ * ```
+ *
+ * With nothing composed inside it, it shows what it inserts. R3 otherwise: a stringifiable
+ * tree becomes the label, anything else is the caller's own content.
+ */
+export declare const NumberPadKey: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & {
+    value: string;
+} & import("react").RefAttributes<View>>;

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

@@ -0,0 +1,24 @@
+import type { View } from 'react-native';
+/**
+ * One filled key.
+ *
+ * The root renders ten of these and names none of them, because the digits are data. This
+ * is exported for the eleventh — a decimal separator or a `00` on a currency pad, dropped
+ * into the free cell:
+ *
+ * ```tsx
+ * <NumberPad>
+ *   <NumberPad.Key value="," />
+ * </NumberPad>
+ * ```
+ *
+ * With nothing composed inside it, it shows what it inserts. R3 otherwise: a stringifiable
+ * tree becomes the label, anything else is the caller's own content.
+ */
+export declare const NumberPadKey: import("react").ForwardRefExoticComponent<Omit<import("../..").PressableFeedbackProps, "isPressed" | "style" | "children" | "layout"> & {
+    isDisabled?: boolean;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle> | ((state: import("react-native").PressableStateCallbackType) => import("react-native").StyleProp<import("react-native").ViewStyle>);
+    children?: import("react").ReactNode;
+} & {
+    value: string;
+} & import("react").RefAttributes<View>>;

package/dist/components/number-pad/number-pad-label.d.cts

@@ -0,0 +1,14 @@
+import { Text } from 'react-native';
+/**
+ * The character on a cell — the digit on a key, the arrow on the backspace.
+ *
+ * Which foreground it takes is the **cell's** answer rather than a prop of its own: a
+ * filled key's is the variant's, a bare corner's is the page's. Three lines, because the
+ * root already resolved both (R5).
+ *
+ * Single-line by default. A key has a fixed height, so a label too long for it truncates
+ * rather than deforming the row it is in.
+ */
+export declare const NumberPadLabel: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<Text>>;

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

@@ -0,0 +1,14 @@
+import { Text } from 'react-native';
+/**
+ * The character on a cell — the digit on a key, the arrow on the backspace.
+ *
+ * Which foreground it takes is the **cell's** answer rather than a prop of its own: a
+ * filled key's is the variant's, a bare corner's is the page's. Three lines, because the
+ * root already resolved both (R5).
+ *
+ * Single-line by default. A key has a fixed height, so a label too long for it truncates
+ * rather than deforming the row it is in.
+ */
+export declare const NumberPadLabel: import("react").ForwardRefExoticComponent<import("react-native").TextProps & Omit<import("../..").TextStyleProps, keyof import("react-native").TextProps> & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<Text>>;

package/dist/components/number-pad/number-pad.context.d.cts

@@ -0,0 +1,18 @@
+import type { NumberPadCellContextValue, NumberPadContextValue } from './number-pad.type';
+/**
+ * R10 — `useNumberPad` is exported so a control beside the pad can read the value it is
+ * building, and so a caller can write their own cell (a `00` key on a currency pad)
+ * against the same `insert` the built-in ones call. Outside a `<NumberPad>` it throws by
+ * name.
+ */
+export declare const NumberPadProvider: import("react").Provider<NumberPadContextValue | null>, useNumberPad: () => NumberPadContextValue;
+/**
+ * Which cell a label or a glyph is inside.
+ *
+ * It exists so `NumberPad.Icon` needs no prop to know whether it sits on a filled key or in
+ * a bare corner — the cell it is in already knows, and the two want different foregrounds:
+ * a `primary` pad's digits are `accentForeground`, and a backspace with no ground of its own
+ * would take white on white. A `tone` prop would have made that the caller's problem, and
+ * the caller cannot see the variant from inside the cell.
+ */
+export declare const NumberPadCellProvider: import("react").Provider<NumberPadCellContextValue | null>, useNumberPadCell: () => NumberPadCellContextValue;

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

@@ -0,0 +1,18 @@
+import type { NumberPadCellContextValue, NumberPadContextValue } from './number-pad.type';
+/**
+ * R10 — `useNumberPad` is exported so a control beside the pad can read the value it is
+ * building, and so a caller can write their own cell (a `00` key on a currency pad)
+ * against the same `insert` the built-in ones call. Outside a `<NumberPad>` it throws by
+ * name.
+ */
+export declare const NumberPadProvider: import("react").Provider<NumberPadContextValue | null>, useNumberPad: () => NumberPadContextValue;
+/**
+ * Which cell a label or a glyph is inside.
+ *
+ * It exists so `NumberPad.Icon` needs no prop to know whether it sits on a filled key or in
+ * a bare corner — the cell it is in already knows, and the two want different foregrounds:
+ * a `primary` pad's digits are `accentForeground`, and a backspace with no ground of its own
+ * would take white on white. A `tone` prop would have made that the caller's problem, and
+ * the caller cannot see the variant from inside the cell.
+ */
+export declare const NumberPadCellProvider: import("react").Provider<NumberPadCellContextValue | null>, useNumberPadCell: () => NumberPadCellContextValue;

package/dist/components/number-pad/number-pad.d.cts

@@ -0,0 +1,57 @@
+import { View } from 'react-native';
+/**
+ * The keypad a PIN, a code and an amount are typed on.
+ *
+ * ```tsx
+ * <NumberPad maxLength={4} onComplete={unlock} />
+ *
+ * <NumberPad maxLength={4} value={pin} onChangeText={setPin}>
+ *   <NumberPad.Action onPress={faceId} accessibilityLabel="Unlock with Face ID">
+ *     <NumberPad.Icon as={FaceIdIcon} color={theme.colors.accent} />
+ *   </NumberPad.Action>
+ * </NumberPad>
+ * ```
+ *
+ * **The grid is data, not markup.** `1` through `9`, the `0` and the backspace are not a
+ * decision a caller makes, so the root renders them — eleven hand-written cells is a layout
+ * that disagrees with itself the moment one of them is edited. What *is* composed is the one
+ * free corner of the bottom row, and that is what `children` is.
+ *
+ * **The pad owns the value as one string**, controlled or not, and clamps it to `maxLength`:
+ * a press past the limit changes nothing at all, so `onChangeText` does not fire and a full
+ * PIN cannot be completed twice by leaning on a key.
+ *
+ * **It draws no display.** What the value looks like is the screen's — an `InputOTP`'s boxes,
+ * a row of dots, an amount in a `Typography`. A pad that also rendered the value would be
+ * two components that have to agree on a string.
+ *
+ * `useNumberPad()` publishes `insert`, `backspace` and `clear`, so a control beside the pad
+ * drives it with no state of its own.
+ */
+export declare const NumberPadRoot: import("react").ForwardRefExoticComponent<{
+    variant?: import("./number-pad.type").NumberPadVariant;
+    size?: import("./number-pad.type").NumberPadSize;
+    radius?: import("../..").RadiusKey;
+    color?: string;
+    value?: string;
+    defaultValue?: string;
+    onChangeText?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    maxLength?: number;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+} & Omit<import("react-native").ViewProps, "style" | "children"> & Omit<import("../..").ViewStyleProps, keyof {
+    variant?: import("./number-pad.type").NumberPadVariant;
+    size?: import("./number-pad.type").NumberPadSize;
+    radius?: import("../..").RadiusKey;
+    color?: string;
+    value?: string;
+    defaultValue?: string;
+    onChangeText?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    maxLength?: number;
+    isDisabled?: boolean;
+    children?: import("react").ReactNode;
+    style?: import("react-native").StyleProp<import("react-native").ViewStyle>;
+}> & import("react").RefAttributes<View>>;