@xaui/native 0.9.1-alpha.24 → 0.9.1-alpha.25

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

@@ -1,148 +1,140 @@
 import * as react from 'react';
-import { ReactNode } from 'react';
 import * as react_native from 'react-native';
-import { StyleProp, TextStyle, TextInputProps, TextProps, ViewStyle, ViewProps } from 'react-native';
-import { T as TextStyleProps, V as ViewStyleProps } from '../../style-props.type-CfnoGEP7.cjs';
-import { S as Size, R as RadiusKey, X as XAUITheme } from '../../theme.type-C2gNHpEx.cjs';
+import { View, Text, TextInput } from 'react-native';
+import { V as ViewStyleProps, T as TextStyleProps } from '../../style-props.type-CfnoGEP7.cjs';
+import { R as RadiusKey, X as XAUITheme } from '../../theme.type-C2gNHpEx.cjs';
+import { i as InputVariant, g as InputSize, e as InputLabelPlacement, b as InputContextValue, h as InputSlot } from '../../input.type-BpJeUIe8.cjs';
+export { c as InputDescriptionProps, d as InputErrorProps, I as InputFieldProps, f as InputLabelProps, a as InputProps } from '../../input.type-BpJeUIe8.cjs';
 import { R as Recipe, g as SlotStyles, j as StyleFn } from '../../create-recipe-dBN_ewZc.cjs';
 
-type InputSlot = 'root' | 'label' | 'field' | 'placeholder' | 'description' | 'error';
 /**
- * The library's four emphasis levels, narrowed like the `Card`'s (§1 bis). A field
- * **reports nothing** — an error is `isInvalid`, which is a state and not a variant — so
- * `success`, `warning` and `danger` are absent here for the same reason they are there.
+ * A text field, with the label, the hint and the error that make it usable.
  *
- * This is where the theme's `field*` family is finally read, and the four names split
- * HeroUI's two-name `primary | secondary` by saying what each of their ends already is:
+ * ```tsx
+ * <Input>
+ *   <Input.Label>Courriel</Input.Label>
+ *   <Input.Field
+ *     value={email}
+ *     onChangeText={setEmail}
+ *     placeholder="nom@exemple.fr"
+ *     keyboardType="email-address"
+ *   />
+ *   <Input.Description>On ne le partage jamais.</Input.Description>
+ * </Input>
  *
- * - **`primary`** — the `fieldBackground` fill plus the theme's `field` shadow. HeroUI's
- *   `primary`, with the elevation their flat token only implies.
- * - **`secondary`** — the neutral `default` fill. HeroUI's `secondary`, and the default
- *   here: on a plain background a white field is its border and nothing else, while on a
- *   card the `fieldBackground` token *is* the card's own colour.
- * - **`tertiary`** — the border alone, no fill. The same drop the `Button`'s `tertiary`
- *   makes.
- * - **`ghost`** — neither. A bare field for a toolbar or an inline edit; it has no border
- *   to move, so its focus shows in the caret alone.
+ * <Input isInvalid={Boolean(error)}>
+ *   <Input.Label>Mot de passe</Input.Label>
+ *   <Input.Field secureTextEntry value={password} onChangeText={setPassword} />
+ *   {error ? <Input.Error>{error}</Input.Error> : null}
+ * </Input>
+ * ```
  *
- * The first three name the `fieldBorder` edge and `ghost` gives it up. Its width is the
- * theme's `borderWidth.field` — HeroUI's `--field-border-width`, which they ship at `0`
- * and we ship at `1`. That is the one shipped default where the two differ;
- * `createTheme({ borderWidth: { field: 0 } })` reproduces theirs.
- */
-type InputVariant = 'primary' | 'secondary' | 'tertiary' | 'ghost';
-/**
- * Where the label sits relative to the field's box.
+ * **The root is the column, not the field.** `Input.Field` is the `TextInput`, which is
+ * what makes the label, the hint and the error slots of one component rather than three
+ * components a form has to keep in step — and it is why `TextInputProps` are on the field
+ * rather than on the root.
  *
- * `outside` is the label above the box, in the column's flow. `inside` lifts it into the
- * box, above the text — the label is taken **out of flow** and placed against the box's
- * own padding, so the JSX is identical either way and nothing is reparented (R4).
- *
- * Because the inside label positions itself against the top of the root, it assumes the
- * field is the first thing in the column's flow: write `Input.Description` and
- * `Input.Error` after the field, which is where they belong anyway.
+ * There is no auto-wrap here (R3): a string child of an input is not a label, a value or
+ * a placeholder in any way the component could guess.
  */
-type InputLabelPlacement = 'outside' | 'inside';
-type InputSize = Size;
-/**
- * What the `Input` itself understands. R14 — a name in here is the component's, so the
- * style prop that shares it is not exposed: `size` is the field's scale and never
- * `ViewStyle`'s, and `color` is R7's tint.
- */
-type InputOwnProps = {
+declare const InputRoot: react.ForwardRefExoticComponent<{
     variant?: InputVariant;
-    /** The field's height, its padding, the gaps and the type. Never width. */
     size?: InputSize;
-    /** Overrides the `field` radius the theme chose for every size. */
     radius?: RadiusKey;
-    /** Above the box, or lifted into it. @default 'outside' */
     labelPlacement?: InputLabelPlacement;
-    /**
-     * A raw tint (`'#7c3aed'`), never a token (R7). It lands where the variant put its
-     * tokens — the fill of a `default`, the border of a `tertiary` — and, because the focus
-     * colour is a role like any other, it is also what the field borders on focus.
-     */
     color?: string;
-    /**
-     * Paints the border, the label and the description in `danger`, and takes the focus
-     * treatment off: an error outranks focus, and a field that is both should read as
-     * wrong rather than as busy.
-     *
-     * It does **not** mount or unmount `Input.Error`. That stays the caller's — a slot that
-     * silently renders nothing is a slot you cannot debug.
-     */
     isInvalid?: boolean;
-    /** Dims the field and makes it uneditable. */
     isDisabled?: boolean;
-    style?: StyleProp<ViewStyle>;
-    children?: ReactNode;
-};
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    variant?: InputVariant;
+    size?: InputSize;
+    radius?: RadiusKey;
+    labelPlacement?: InputLabelPlacement;
+    color?: string;
+    isInvalid?: boolean;
+    isDisabled?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "color" | "pointerEvents" | "style" | "children" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "onLayout" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "collapsableChildren" | "onBlur" | "onFocus" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerUp" | "onPointerUpCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onAccessibilityAction" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "isDisabled" | "radius" | "size" | "variant" | "labelPlacement" | "isInvalid"> & {
+    asChild?: boolean;
+} & react.RefAttributes<View>>;
+
 /**
- * R14 — the input's own props, the wrapper `View`'s, and every `ViewStyle` key neither
- * already claims. **`TextInputProps` are not here**: they belong to `Input.Field`, which
- * is the node that has them.
+ * The hint under the field — the format expected, what the value is used for.
+ *
+ * It carries the id the field points at with `aria-describedby`, so it is read after the
+ * label rather than skipped. It turns `danger` with `isInvalid`, like the label.
+ *
+ * It sits inset by half the field's padding, so the column reads as one block rather than
+ * as a label, a box and a stray line.
  */
-type InputProps = InputOwnProps & Omit<ViewProps, keyof InputOwnProps> & Omit<ViewStyleProps, keyof InputOwnProps | keyof ViewProps> & {
-    /** R12 — merge into the single child instead of rendering a `View`. */
-    asChild?: boolean;
-};
+declare const InputDescription: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
+    children?: react.ReactNode;
+} & react.RefAttributes<Text>>;
+
 /**
- * Everything `TextInput` accepts, plus the `TextStyle` keys as props (R14).
+ * What is wrong with the value, in `danger`.
+ *
+ * **It always renders what it is given.** `isInvalid` paints the border, the label and the
+ * description; it does not mount or unmount this slot, because a slot that silently
+ * renders nothing is a slot you cannot debug — you write the condition yourself and see
+ * it:
+ *
+ * ```tsx
+ * <Input isInvalid={Boolean(error)}>
+ *   <Input.Field value={value} onChangeText={onChange} />
+ *   {error ? <Input.Error>{error}</Input.Error> : null}
+ * </Input>
+ * ```
  *
- * `editable` is absent: it is `disabled` under another name, and R8 keeps that off the
- * public surface — `isDisabled` on the root is what stops the field.
+ * `accessibilityLiveRegion` is deliberately not set: an error that appears while you are
+ * still typing in the field is announced by the field's own `aria-invalid`, and a live
+ * region on top of that reads the message on every keystroke that changes it.
  */
-type InputFieldProps = Omit<TextInputProps, 'editable'> & Omit<TextStyleProps, keyof TextInputProps>;
-/** `Text`'s own props win over the `TextStyle` keys of the same name (R14). */
-type InputTextProps = TextProps & Omit<TextStyleProps, keyof TextProps> & {
-    children?: ReactNode;
-};
-type InputLabelProps = InputTextProps;
-type InputDescriptionProps = InputTextProps;
-type InputErrorProps = InputTextProps;
+declare const InputError: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
+    children?: react.ReactNode;
+} & react.RefAttributes<Text>>;
+
 /**
- * Read off `TextInput`'s own props rather than spelled out: React Native has renamed the
- * payload of these two more than once, and a hand-written `NativeSyntheticEvent<…>` here
- * would be a second declaration free to drift from the node that actually fires them.
+ * The `TextInput` itself — the one node of this component that the user types into.
+ *
+ * ```tsx
+ * <Input.Field value={email} onChangeText={setEmail} placeholder="nom@exemple.fr" />
+ * ```
+ *
+ * It takes everything `TextInput` takes, which is why `value`, `defaultValue`, `onChange`,
+ * `keyboardType`, `secureTextEntry`, `autoComplete` and `multiline` are written here and
+ * not on the root. There is no `type`: that is an HTML prop, and React Native splits it
+ * into `inputMode`, `keyboardType`, `secureTextEntry` and `autoComplete`.
+ *
+ * What it does *not* take is `editable`: that is `disabled` under another name, and R8
+ * keeps it off the public surface — `isDisabled` on the root is what stops the field.
+ *
+ * It reports focus up rather than styling it (R5): the root's recipe resolves on the
+ * focus state, so the root owns it and this composes the caller's handlers into the two
+ * the context published.
  */
-type FieldFocusEvent = Parameters<NonNullable<TextInputProps['onFocus']>>[0];
-type FieldBlurEvent = Parameters<NonNullable<TextInputProps['onBlur']>>[0];
+declare const InputField: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<TextInput>>;
+
 /**
- * R5 — resolved styles, not props for a slot to resolve a second time. Each entry is the
- * cached `StyleSheet` reference with the uncached tint pass layered over it, so a slot
- * merges its own `style` on top and does no work of its own.
+ * What the field is for. It turns `danger` with `isInvalid`, so the field that is wrong is
+ * findable on a long form without reading every message.
+ *
+ * It carries the id the field points at, which is what makes a screen reader announce
+ * "Courriel, champ de saisie" instead of reading the placeholder and hoping.
+ *
+ * Its colour comes from the theme's `foreground` rather than the variant's: the label sits
+ * outside the box, on the screen behind it, so a tinted field does not tint it.
  */
-type InputContextValue = {
-    labelStyle: StyleProp<TextStyle>;
-    fieldStyle: StyleProp<TextStyle>;
-    descriptionStyle: StyleProp<TextStyle>;
-    errorStyle: StyleProp<TextStyle>;
-    /**
-     * A value and not a style: `placeholderTextColor` is a `TextInput` prop, so the root
-     * flattens its placeholder slot once here rather than in the field.
-     */
-    placeholderTextColor?: string;
-    /**
-     * The focus state lives on the **root**, because the root's recipe resolves on it (R5)
-     * and it needs the value before it renders — but the node that hears the event is
-     * `Input.Field`, three levels down. These are how it reports back. Their identity is
-     * stable, so publishing them costs no re-render of a memoized slot.
-     */
-    onFieldFocus: (event: FieldFocusEvent) => void;
-    onFieldBlur: (event: FieldBlurEvent) => void;
-    /**
-     * The id the label carries and the field points at, so a screen reader reads "Courriel,
-     * champ de saisie" rather than just the placeholder.
-     */
-    labelId: string;
-    descriptionId: string;
-    isDisabled: boolean;
-    isInvalid: boolean;
-};
+declare const InputLabel: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
+    children?: react.ReactNode;
+} & react.RefAttributes<Text>>;
 
 declare const useInput: () => InputContextValue;
 
-declare const inputRecipe: Recipe<"label" | "field" | "description" | "root" | "placeholder" | "error", InputVariant, {
+declare const inputRecipe: Recipe<"label" | "field" | "description" | "root" | "textArea" | "placeholder" | "error", InputVariant, {
     readonly size: {
         readonly xs: (theme: XAUITheme) => SlotStyles<InputSlot>;
         readonly sm: (theme: XAUITheme) => SlotStyles<InputSlot>;
@@ -210,4 +202,4 @@ declare const Input: react.ForwardRefExoticComponent<{
     } & react.RefAttributes<react_native.Text>>;
 };
 
-export { Input, type InputContextValue, type InputDescriptionProps, type InputErrorProps, type InputFieldProps, type InputLabelPlacement, type InputLabelProps, type InputProps, type InputSize, type InputSlot, type InputVariant, inputRecipe, useInput };
+export { Input, InputContextValue, InputDescription, InputError, InputField, InputLabel, InputLabelPlacement, InputRoot, InputSize, InputSlot, InputVariant, inputRecipe, useInput };

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

@@ -1,148 +1,140 @@
 import * as react from 'react';
-import { ReactNode } from 'react';
 import * as react_native from 'react-native';
-import { StyleProp, TextStyle, TextInputProps, TextProps, ViewStyle, ViewProps } from 'react-native';
-import { T as TextStyleProps, V as ViewStyleProps } from '../../style-props.type-CfnoGEP7.js';
-import { S as Size, R as RadiusKey, X as XAUITheme } from '../../theme.type-C2gNHpEx.js';
+import { View, Text, TextInput } from 'react-native';
+import { V as ViewStyleProps, T as TextStyleProps } from '../../style-props.type-CfnoGEP7.js';
+import { R as RadiusKey, X as XAUITheme } from '../../theme.type-C2gNHpEx.js';
+import { i as InputVariant, g as InputSize, e as InputLabelPlacement, b as InputContextValue, h as InputSlot } from '../../input.type-DjyZ6P2C.js';
+export { c as InputDescriptionProps, d as InputErrorProps, I as InputFieldProps, f as InputLabelProps, a as InputProps } from '../../input.type-DjyZ6P2C.js';
 import { R as Recipe, g as SlotStyles, j as StyleFn } from '../../create-recipe-C4JkINrA.js';
 
-type InputSlot = 'root' | 'label' | 'field' | 'placeholder' | 'description' | 'error';
 /**
- * The library's four emphasis levels, narrowed like the `Card`'s (§1 bis). A field
- * **reports nothing** — an error is `isInvalid`, which is a state and not a variant — so
- * `success`, `warning` and `danger` are absent here for the same reason they are there.
+ * A text field, with the label, the hint and the error that make it usable.
  *
- * This is where the theme's `field*` family is finally read, and the four names split
- * HeroUI's two-name `primary | secondary` by saying what each of their ends already is:
+ * ```tsx
+ * <Input>
+ *   <Input.Label>Courriel</Input.Label>
+ *   <Input.Field
+ *     value={email}
+ *     onChangeText={setEmail}
+ *     placeholder="nom@exemple.fr"
+ *     keyboardType="email-address"
+ *   />
+ *   <Input.Description>On ne le partage jamais.</Input.Description>
+ * </Input>
  *
- * - **`primary`** — the `fieldBackground` fill plus the theme's `field` shadow. HeroUI's
- *   `primary`, with the elevation their flat token only implies.
- * - **`secondary`** — the neutral `default` fill. HeroUI's `secondary`, and the default
- *   here: on a plain background a white field is its border and nothing else, while on a
- *   card the `fieldBackground` token *is* the card's own colour.
- * - **`tertiary`** — the border alone, no fill. The same drop the `Button`'s `tertiary`
- *   makes.
- * - **`ghost`** — neither. A bare field for a toolbar or an inline edit; it has no border
- *   to move, so its focus shows in the caret alone.
+ * <Input isInvalid={Boolean(error)}>
+ *   <Input.Label>Mot de passe</Input.Label>
+ *   <Input.Field secureTextEntry value={password} onChangeText={setPassword} />
+ *   {error ? <Input.Error>{error}</Input.Error> : null}
+ * </Input>
+ * ```
  *
- * The first three name the `fieldBorder` edge and `ghost` gives it up. Its width is the
- * theme's `borderWidth.field` — HeroUI's `--field-border-width`, which they ship at `0`
- * and we ship at `1`. That is the one shipped default where the two differ;
- * `createTheme({ borderWidth: { field: 0 } })` reproduces theirs.
- */
-type InputVariant = 'primary' | 'secondary' | 'tertiary' | 'ghost';
-/**
- * Where the label sits relative to the field's box.
+ * **The root is the column, not the field.** `Input.Field` is the `TextInput`, which is
+ * what makes the label, the hint and the error slots of one component rather than three
+ * components a form has to keep in step — and it is why `TextInputProps` are on the field
+ * rather than on the root.
  *
- * `outside` is the label above the box, in the column's flow. `inside` lifts it into the
- * box, above the text — the label is taken **out of flow** and placed against the box's
- * own padding, so the JSX is identical either way and nothing is reparented (R4).
- *
- * Because the inside label positions itself against the top of the root, it assumes the
- * field is the first thing in the column's flow: write `Input.Description` and
- * `Input.Error` after the field, which is where they belong anyway.
+ * There is no auto-wrap here (R3): a string child of an input is not a label, a value or
+ * a placeholder in any way the component could guess.
  */
-type InputLabelPlacement = 'outside' | 'inside';
-type InputSize = Size;
-/**
- * What the `Input` itself understands. R14 — a name in here is the component's, so the
- * style prop that shares it is not exposed: `size` is the field's scale and never
- * `ViewStyle`'s, and `color` is R7's tint.
- */
-type InputOwnProps = {
+declare const InputRoot: react.ForwardRefExoticComponent<{
     variant?: InputVariant;
-    /** The field's height, its padding, the gaps and the type. Never width. */
     size?: InputSize;
-    /** Overrides the `field` radius the theme chose for every size. */
     radius?: RadiusKey;
-    /** Above the box, or lifted into it. @default 'outside' */
     labelPlacement?: InputLabelPlacement;
-    /**
-     * A raw tint (`'#7c3aed'`), never a token (R7). It lands where the variant put its
-     * tokens — the fill of a `default`, the border of a `tertiary` — and, because the focus
-     * colour is a role like any other, it is also what the field borders on focus.
-     */
     color?: string;
-    /**
-     * Paints the border, the label and the description in `danger`, and takes the focus
-     * treatment off: an error outranks focus, and a field that is both should read as
-     * wrong rather than as busy.
-     *
-     * It does **not** mount or unmount `Input.Error`. That stays the caller's — a slot that
-     * silently renders nothing is a slot you cannot debug.
-     */
     isInvalid?: boolean;
-    /** Dims the field and makes it uneditable. */
     isDisabled?: boolean;
-    style?: StyleProp<ViewStyle>;
-    children?: ReactNode;
-};
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    variant?: InputVariant;
+    size?: InputSize;
+    radius?: RadiusKey;
+    labelPlacement?: InputLabelPlacement;
+    color?: string;
+    isInvalid?: boolean;
+    isDisabled?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "color" | "pointerEvents" | "style" | "children" | "hitSlop" | "id" | "needsOffscreenAlphaCompositing" | "onLayout" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "collapsableChildren" | "onBlur" | "onFocus" | "renderToHardwareTextureAndroid" | "focusable" | "tabIndex" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerUp" | "onPointerUpCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "aria-label" | "accessibilityRole" | "accessibilityState" | "aria-busy" | "aria-checked" | "aria-disabled" | "aria-expanded" | "aria-selected" | "accessibilityHint" | "accessibilityValue" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "onAccessibilityAction" | "importantForAccessibility" | "aria-hidden" | "aria-modal" | "role" | "accessibilityLabelledBy" | "aria-labelledby" | "accessibilityLiveRegion" | "aria-live" | "screenReaderFocusable" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "accessibilityLanguage" | "accessibilityShowsLargeContentViewer" | "accessibilityLargeContentTitle" | "accessibilityRespondsToUserInteraction" | "isDisabled" | "radius" | "size" | "variant" | "labelPlacement" | "isInvalid"> & {
+    asChild?: boolean;
+} & react.RefAttributes<View>>;
+
 /**
- * R14 — the input's own props, the wrapper `View`'s, and every `ViewStyle` key neither
- * already claims. **`TextInputProps` are not here**: they belong to `Input.Field`, which
- * is the node that has them.
+ * The hint under the field — the format expected, what the value is used for.
+ *
+ * It carries the id the field points at with `aria-describedby`, so it is read after the
+ * label rather than skipped. It turns `danger` with `isInvalid`, like the label.
+ *
+ * It sits inset by half the field's padding, so the column reads as one block rather than
+ * as a label, a box and a stray line.
  */
-type InputProps = InputOwnProps & Omit<ViewProps, keyof InputOwnProps> & Omit<ViewStyleProps, keyof InputOwnProps | keyof ViewProps> & {
-    /** R12 — merge into the single child instead of rendering a `View`. */
-    asChild?: boolean;
-};
+declare const InputDescription: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
+    children?: react.ReactNode;
+} & react.RefAttributes<Text>>;
+
 /**
- * Everything `TextInput` accepts, plus the `TextStyle` keys as props (R14).
+ * What is wrong with the value, in `danger`.
+ *
+ * **It always renders what it is given.** `isInvalid` paints the border, the label and the
+ * description; it does not mount or unmount this slot, because a slot that silently
+ * renders nothing is a slot you cannot debug — you write the condition yourself and see
+ * it:
+ *
+ * ```tsx
+ * <Input isInvalid={Boolean(error)}>
+ *   <Input.Field value={value} onChangeText={onChange} />
+ *   {error ? <Input.Error>{error}</Input.Error> : null}
+ * </Input>
+ * ```
  *
- * `editable` is absent: it is `disabled` under another name, and R8 keeps that off the
- * public surface — `isDisabled` on the root is what stops the field.
+ * `accessibilityLiveRegion` is deliberately not set: an error that appears while you are
+ * still typing in the field is announced by the field's own `aria-invalid`, and a live
+ * region on top of that reads the message on every keystroke that changes it.
  */
-type InputFieldProps = Omit<TextInputProps, 'editable'> & Omit<TextStyleProps, keyof TextInputProps>;
-/** `Text`'s own props win over the `TextStyle` keys of the same name (R14). */
-type InputTextProps = TextProps & Omit<TextStyleProps, keyof TextProps> & {
-    children?: ReactNode;
-};
-type InputLabelProps = InputTextProps;
-type InputDescriptionProps = InputTextProps;
-type InputErrorProps = InputTextProps;
+declare const InputError: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
+    children?: react.ReactNode;
+} & react.RefAttributes<Text>>;
+
 /**
- * Read off `TextInput`'s own props rather than spelled out: React Native has renamed the
- * payload of these two more than once, and a hand-written `NativeSyntheticEvent<…>` here
- * would be a second declaration free to drift from the node that actually fires them.
+ * The `TextInput` itself — the one node of this component that the user types into.
+ *
+ * ```tsx
+ * <Input.Field value={email} onChangeText={setEmail} placeholder="nom@exemple.fr" />
+ * ```
+ *
+ * It takes everything `TextInput` takes, which is why `value`, `defaultValue`, `onChange`,
+ * `keyboardType`, `secureTextEntry`, `autoComplete` and `multiline` are written here and
+ * not on the root. There is no `type`: that is an HTML prop, and React Native splits it
+ * into `inputMode`, `keyboardType`, `secureTextEntry` and `autoComplete`.
+ *
+ * What it does *not* take is `editable`: that is `disabled` under another name, and R8
+ * keeps it off the public surface — `isDisabled` on the root is what stops the field.
+ *
+ * It reports focus up rather than styling it (R5): the root's recipe resolves on the
+ * focus state, so the root owns it and this composes the caller's handlers into the two
+ * the context published.
  */
-type FieldFocusEvent = Parameters<NonNullable<TextInputProps['onFocus']>>[0];
-type FieldBlurEvent = Parameters<NonNullable<TextInputProps['onBlur']>>[0];
+declare const InputField: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<TextInput>>;
+
 /**
- * R5 — resolved styles, not props for a slot to resolve a second time. Each entry is the
- * cached `StyleSheet` reference with the uncached tint pass layered over it, so a slot
- * merges its own `style` on top and does no work of its own.
+ * What the field is for. It turns `danger` with `isInvalid`, so the field that is wrong is
+ * findable on a long form without reading every message.
+ *
+ * It carries the id the field points at, which is what makes a screen reader announce
+ * "Courriel, champ de saisie" instead of reading the placeholder and hoping.
+ *
+ * Its colour comes from the theme's `foreground` rather than the variant's: the label sits
+ * outside the box, on the screen behind it, so a tinted field does not tint it.
  */
-type InputContextValue = {
-    labelStyle: StyleProp<TextStyle>;
-    fieldStyle: StyleProp<TextStyle>;
-    descriptionStyle: StyleProp<TextStyle>;
-    errorStyle: StyleProp<TextStyle>;
-    /**
-     * A value and not a style: `placeholderTextColor` is a `TextInput` prop, so the root
-     * flattens its placeholder slot once here rather than in the field.
-     */
-    placeholderTextColor?: string;
-    /**
-     * The focus state lives on the **root**, because the root's recipe resolves on it (R5)
-     * and it needs the value before it renders — but the node that hears the event is
-     * `Input.Field`, three levels down. These are how it reports back. Their identity is
-     * stable, so publishing them costs no re-render of a memoized slot.
-     */
-    onFieldFocus: (event: FieldFocusEvent) => void;
-    onFieldBlur: (event: FieldBlurEvent) => void;
-    /**
-     * The id the label carries and the field points at, so a screen reader reads "Courriel,
-     * champ de saisie" rather than just the placeholder.
-     */
-    labelId: string;
-    descriptionId: string;
-    isDisabled: boolean;
-    isInvalid: boolean;
-};
+declare const InputLabel: react.ForwardRefExoticComponent<react_native.TextProps & Omit<TextStyleProps, keyof react_native.TextProps> & {
+    children?: react.ReactNode;
+} & react.RefAttributes<Text>>;
 
 declare const useInput: () => InputContextValue;
 
-declare const inputRecipe: Recipe<"label" | "field" | "description" | "root" | "placeholder" | "error", InputVariant, {
+declare const inputRecipe: Recipe<"label" | "field" | "description" | "root" | "textArea" | "placeholder" | "error", InputVariant, {
     readonly size: {
         readonly xs: (theme: XAUITheme) => SlotStyles<InputSlot>;
         readonly sm: (theme: XAUITheme) => SlotStyles<InputSlot>;
@@ -210,4 +202,4 @@ declare const Input: react.ForwardRefExoticComponent<{
     } & react.RefAttributes<react_native.Text>>;
 };
 
-export { Input, type InputContextValue, type InputDescriptionProps, type InputErrorProps, type InputFieldProps, type InputLabelPlacement, type InputLabelProps, type InputProps, type InputSize, type InputSlot, type InputVariant, inputRecipe, useInput };
+export { Input, InputContextValue, InputDescription, InputError, InputField, InputLabel, InputLabelPlacement, InputRoot, InputSize, InputSlot, InputVariant, inputRecipe, useInput };

package/dist/components/input/index.js

@@ -1,14 +1,24 @@
 import {
   Input,
+  InputDescription,
+  InputError,
+  InputField,
+  InputLabel,
+  InputRoot,
   inputRecipe,
   useInput
-} from "../../chunk-6RO26ORT.js";
+} from "../../chunk-2OY76YNB.js";
 import "../../chunk-3JATAB7S.js";
 import "../../chunk-PMO62QK4.js";
 import "../../chunk-A3EGFI6T.js";
 import "../../chunk-GGW42MY4.js";
 export {
   Input,
+  InputDescription,
+  InputError,
+  InputField,
+  InputLabel,
+  InputRoot,
   inputRecipe,
   useInput
 };

package/dist/components/input-otp/index.cjs

@@ -8,7 +8,7 @@
 
 
 
-var _chunkLIQTGAI7cjs = require('../../chunk-LIQTGAI7.cjs');
+var _chunkBULNTP5Ncjs = require('../../chunk-BULNTP5N.cjs');
 require('../../chunk-EJQCQPET.cjs');
 require('../../chunk-YXVKQMCK.cjs');
 require('../../chunk-HUZ4AUM2.cjs');
@@ -24,4 +24,4 @@ require('../../chunk-MC7SY2QH.cjs');
 
 
 
-exports.InputOTP = _chunkLIQTGAI7cjs.InputOTP; exports.OTP_ALPHANUMERIC = _chunkLIQTGAI7cjs.OTP_ALPHANUMERIC; exports.OTP_DIGITS = _chunkLIQTGAI7cjs.OTP_DIGITS; exports.OTP_LETTERS = _chunkLIQTGAI7cjs.OTP_LETTERS; exports.buildSlots = _chunkLIQTGAI7cjs.buildSlots; exports.extractPastedCode = _chunkLIQTGAI7cjs.extractPastedCode; exports.inputOTPRecipe = _chunkLIQTGAI7cjs.inputOTPRecipe; exports.useInputOTP = _chunkLIQTGAI7cjs.useInputOTP; exports.useInputOTPBox = _chunkLIQTGAI7cjs.useInputOTPBox;
+exports.InputOTP = _chunkBULNTP5Ncjs.InputOTP; exports.OTP_ALPHANUMERIC = _chunkBULNTP5Ncjs.OTP_ALPHANUMERIC; exports.OTP_DIGITS = _chunkBULNTP5Ncjs.OTP_DIGITS; exports.OTP_LETTERS = _chunkBULNTP5Ncjs.OTP_LETTERS; exports.buildSlots = _chunkBULNTP5Ncjs.buildSlots; exports.extractPastedCode = _chunkBULNTP5Ncjs.extractPastedCode; exports.inputOTPRecipe = _chunkBULNTP5Ncjs.inputOTPRecipe; exports.useInputOTP = _chunkBULNTP5Ncjs.useInputOTP; exports.useInputOTPBox = _chunkBULNTP5Ncjs.useInputOTPBox;

package/dist/components/input-otp/index.js

@@ -8,7 +8,7 @@ import {
   inputOTPRecipe,
   useInputOTP,
   useInputOTPBox
-} from "../../chunk-J4QE34AU.js";
+} from "../../chunk-I6UCYAO2.js";
 import "../../chunk-EGLLDKN6.js";
 import "../../chunk-3JATAB7S.js";
 import "../../chunk-PMO62QK4.js";

package/dist/components/text-area/index.cjs

@@ -0,0 +1,13 @@
+"use strict";Object.defineProperty(exports, "__esModule", {value: true});
+
+
+var _chunkGSEK6OCYcjs = require('../../chunk-GSEK6OCY.cjs');
+require('../../chunk-YEW5LPWL.cjs');
+require('../../chunk-YXVKQMCK.cjs');
+require('../../chunk-HUZ4AUM2.cjs');
+require('../../chunk-57SJ4LJF.cjs');
+require('../../chunk-MC7SY2QH.cjs');
+
+
+
+exports.TextArea = _chunkGSEK6OCYcjs.TextArea; exports.useTextArea = _chunkGSEK6OCYcjs.useTextArea;