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

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

@@ -0,0 +1,270 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import * as react_native from 'react-native';
+import { StyleProp, ViewStyle, ViewProps, View, TextInput } from 'react-native';
+import { V as ViewStyleProps, T as TextStyleProps } from '../../style-props.type-CfnoGEP7.cjs';
+import { b as IconProps } from '../../icon.type-CF4KiMKl.cjs';
+import { I as InputFieldProps } from '../../input.type-BUMDlzL9.cjs';
+import '../../theme.type-C2gNHpEx.cjs';
+
+type InputGroupOwnProps = {
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+/**
+ * R14 — the wrapper `View`'s own props, plus every `ViewStyle` key it does not claim.
+ *
+ * **There is no `variant`, no `size`, no `color` and no `isDisabled` here.** They are the
+ * `Input`'s, and an `InputGroup` is one row inside it: a second `size` on this root would
+ * be a second answer to a question the field has already answered.
+ */
+type InputGroupProps = InputGroupOwnProps & Omit<ViewProps, keyof InputGroupOwnProps> & Omit<ViewStyleProps, keyof InputGroupOwnProps | keyof ViewProps> & {
+    /** R12 — merge into the single child instead of rendering a `View`. */
+    asChild?: boolean;
+};
+type InputGroupDecoratorOwnProps = {
+    /**
+     * The decorator stops taking touches and disappears from the accessibility tree, so a
+     * tap on the glyph focuses the field under it and a screen reader announces the field
+     * rather than a mark it cannot act on.
+     *
+     * Leave it off whenever the decorator holds something to press — a reveal toggle, a
+     * clear button — which is the whole reason it is a prop and not the default.
+     *
+     * @default false
+     */
+    isDecorative?: boolean;
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+type InputGroupDecoratorProps = InputGroupDecoratorOwnProps & Omit<ViewProps, keyof InputGroupDecoratorOwnProps> & Omit<ViewStyleProps, keyof InputGroupDecoratorOwnProps | keyof ViewProps>;
+type InputGroupPrefixProps = InputGroupDecoratorProps;
+type InputGroupSuffixProps = InputGroupDecoratorProps;
+/** Which edge a decorator is pinned to, and therefore which width it reports. */
+type InputGroupSide = 'prefix' | 'suffix';
+/**
+ * Everything `Input.Field` accepts. It **is** that field — the same `TextInput`, the same
+ * focus plumbing, the same styles — with the padding the two decorators measured.
+ */
+type InputGroupFieldProps = InputFieldProps;
+/** Everything `Icon` accepts. `size` and `color` fall back to the field's own. */
+type InputGroupIconProps = IconProps;
+/**
+ * R5 — but the only thing here that is not already resolved on the `Input`'s context: two
+ * widths nobody can know before layout.
+ *
+ * A decorator is out of flow, so it cannot push the text aside the way a sibling in a row
+ * would; the field clears it by padding instead, and the padding is the decorator's own
+ * measured width. That is the same shape `TextArea` uses for `rows` — a raw number the
+ * slot turns into a style, outside the cache.
+ */
+type InputGroupContextValue = {
+    /** `0` while the decorator is absent, and until its first layout. */
+    prefixWidth: number;
+    suffixWidth: number;
+    setPrefixWidth: (width: number) => void;
+    setSuffixWidth: (width: number) => void;
+};
+
+/**
+ * A glyph that takes the field's scale and the placeholder's colour without being told
+ * either:
+ *
+ * ```tsx
+ * <InputGroup.Prefix isDecorative>
+ *   <InputGroup.Icon as={MailIcon} />
+ * </InputGroup.Prefix>
+ * ```
+ *
+ * The size comes from the `Input`'s own `size` — one step above the field's type, as on
+ * the `Button` and the `Chip`, because a 16pt glyph beside 16pt of text reads as the
+ * smaller of the two. The colour is the theme's `fieldPlaceholder`: a mark in a field is
+ * decoration for the text, not text. An explicit `size` or `color` still wins, which is
+ * what `Icon` promises everywhere else in the library — and it is the answer for a tinted
+ * `primary` field, where the fill is the caller's colour and the placeholder grey is no
+ * longer readable over it.
+ *
+ * It is not one of HeroUI's three parts: theirs colour the glyph at the call site. This is
+ * the same slot `Button`, `Chip` and `Alert` all have, and it exists so that a form does
+ * not carry a hard-coded `#888` on every field.
+ */
+declare function InputGroupIcon({ size, color, ...rest }: InputGroupIconProps): react.JSX.Element;
+declare namespace InputGroupIcon {
+    var displayName: string;
+}
+
+/**
+ * A field with something beside it — a glyph, a unit, a reveal toggle.
+ *
+ * ```tsx
+ * <Input>
+ *   <Input.Label>Mot de passe</Input.Label>
+ *   <InputGroup>
+ *     <InputGroup.Prefix isDecorative>
+ *       <InputGroup.Icon as={LockIcon} />
+ *     </InputGroup.Prefix>
+ *     <InputGroup.Field secureTextEntry value={password} onChangeText={setPassword} />
+ *     <InputGroup.Suffix>
+ *       <Pressable onPress={toggle} hitSlop={20}>
+ *         <InputGroup.Icon as={EyeIcon} />
+ *       </Pressable>
+ *     </InputGroup.Suffix>
+ *   </InputGroup>
+ *   <Input.Description>Douze caractères au moins.</Input.Description>
+ * </Input>
+ * ```
+ *
+ * **It goes inside an `Input`, and it replaces nothing but the field.** The column, the
+ * label, the hint, the error, the four variants, the `size`, the `radius`, the tint, the
+ * focus and `isInvalid` are all still the `Input`'s — this root is one row of that column,
+ * and it owns exactly one thing: how wide the two decorators turned out to be.
+ *
+ * That is why the box is still the `TextInput` itself. A wrapper carrying the border, the
+ * fill and the radius would be a second thing to keep in step with `Input`, and the day
+ * one of them gained a shadow the other would not have it. The decorators are laid **over**
+ * the field instead, out of flow, and the field clears them with padding.
+ *
+ * It works under `TextArea` too — the same context, the same field — though a decorator
+ * centred over six lines of text is rarely what a multiline field wants.
+ */
+declare const InputGroupRoot: react.ForwardRefExoticComponent<{
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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"> & {
+    asChild?: boolean;
+} & react.RefAttributes<View>>;
+
+/**
+ * The `TextInput` itself — `Input.Field` with the room the two decorators need.
+ *
+ * ```tsx
+ * <InputGroup.Field value={query} onChangeText={setQuery} placeholder="Rechercher…" />
+ * ```
+ *
+ * It renders the `Input`'s field rather than a second `TextInput`, so the focus plumbing,
+ * the placeholder colour, the label association, `isInvalid` and `isDisabled` are the ones
+ * already written, and every `TextInput` prop is written here for the same reason it is
+ * there.
+ *
+ * The padding is arithmetic rather than a token, the way `TextArea`'s height is: a
+ * decorator's width is not knowable before layout, so it measures itself and this turns
+ * the two numbers into `paddingStart` and `paddingEnd`. They land **after** the recipe's
+ * own `paddingHorizontal`, which is what makes them win, and before the caller's `style`,
+ * which still has the last word.
+ */
+declare const InputGroupField: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<TextInput>>;
+
+/**
+ * What sits before the text — a search glyph, a currency, a country code.
+ *
+ * ```tsx
+ * <InputGroup>
+ *   <InputGroup.Prefix isDecorative>
+ *     <InputGroup.Icon as={SearchIcon} />
+ *   </InputGroup.Prefix>
+ *   <InputGroup.Field placeholder="Rechercher…" />
+ * </InputGroup>
+ * ```
+ *
+ * It is pinned to the **leading** edge and inset by the field's own padding, so the glyph
+ * starts where the text would have. The field then clears it by the width it measured —
+ * which is what lets a `+33` prefix and a 16pt mark both sit right, without either one
+ * being told a number.
+ *
+ * Add `isDecorative` whenever it holds nothing to press. Leave it off for a control.
+ */
+declare const InputGroupPrefix: react.ForwardRefExoticComponent<{
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<View>>;
+
+/**
+ * What sits after the text — a reveal toggle, a clear button, a unit, a counter.
+ *
+ * ```tsx
+ * <InputGroup>
+ *   <InputGroup.Field secureTextEntry value={password} onChangeText={setPassword} />
+ *   <InputGroup.Suffix>
+ *     <Pressable onPress={toggle} hitSlop={20}>
+ *       <InputGroup.Icon as={isVisible ? EyeOffIcon : EyeIcon} />
+ *     </Pressable>
+ *   </InputGroup.Suffix>
+ * </InputGroup>
+ * ```
+ *
+ * The trailing edge is where a suffix is most often a **control**, which is why
+ * `isDecorative` is off by default: a decorator that swallowed its own taps would be a
+ * reveal toggle you cannot press.
+ *
+ * The library ships no button for it. A suffix holds whatever you put in it, and
+ * `Pressable` with a `hitSlop` is the thing to put there — a 16pt glyph is not a touch
+ * target on its own.
+ */
+declare const InputGroupSuffix: react.ForwardRefExoticComponent<{
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<View>>;
+
+declare const useInputGroup: () => InputGroupContextValue;
+
+/**
+ * The room a decorator asks the field to leave it, from the width it measured.
+ *
+ * `start` and `end`, never `left` and `right` (R13): the prefix is the leading edge in
+ * both directions of writing, and RTL mirrors the logical property and only it.
+ *
+ * It returns `undefined` rather than an object of two `undefined`s when there is nothing
+ * to clear, so a group with no decorator adds no entry to the field's style array — and
+ * the `useMemo` around it keeps the same reference until a width actually changes.
+ */
+declare function decoratorPadding(prefixWidth: number, suffixWidth: number): ViewStyle | undefined;
+
+/**
+ * The four parts of a decorated field. The label, the hint and the error are **not** here:
+ * they are the `Input`'s, and an `InputGroup` lives inside one.
+ */
+declare const InputGroup: react.ForwardRefExoticComponent<{
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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"> & {
+    asChild?: boolean;
+} & react.RefAttributes<react_native.View>> & {
+    Prefix: react.ForwardRefExoticComponent<{
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    } & Omit<react_native.ViewProps, keyof {
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    }> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<react_native.View>>;
+    Field: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<react_native.TextInput>>;
+    Suffix: react.ForwardRefExoticComponent<{
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    } & Omit<react_native.ViewProps, keyof {
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    }> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<react_native.View>>;
+    Icon: typeof InputGroupIcon;
+};
+
+export { InputGroup, type InputGroupContextValue, InputGroupField, type InputGroupFieldProps, InputGroupIcon, type InputGroupIconProps, InputGroupPrefix, type InputGroupPrefixProps, type InputGroupProps, InputGroupRoot, type InputGroupSide, InputGroupSuffix, type InputGroupSuffixProps, decoratorPadding, useInputGroup };

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

@@ -0,0 +1,270 @@
+import * as react from 'react';
+import { ReactNode } from 'react';
+import * as react_native from 'react-native';
+import { StyleProp, ViewStyle, ViewProps, View, TextInput } from 'react-native';
+import { V as ViewStyleProps, T as TextStyleProps } from '../../style-props.type-CfnoGEP7.js';
+import { b as IconProps } from '../../icon.type-Dq4_qePa.js';
+import { I as InputFieldProps } from '../../input.type-D2qgi03E.js';
+import '../../theme.type-C2gNHpEx.js';
+
+type InputGroupOwnProps = {
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+/**
+ * R14 — the wrapper `View`'s own props, plus every `ViewStyle` key it does not claim.
+ *
+ * **There is no `variant`, no `size`, no `color` and no `isDisabled` here.** They are the
+ * `Input`'s, and an `InputGroup` is one row inside it: a second `size` on this root would
+ * be a second answer to a question the field has already answered.
+ */
+type InputGroupProps = InputGroupOwnProps & Omit<ViewProps, keyof InputGroupOwnProps> & Omit<ViewStyleProps, keyof InputGroupOwnProps | keyof ViewProps> & {
+    /** R12 — merge into the single child instead of rendering a `View`. */
+    asChild?: boolean;
+};
+type InputGroupDecoratorOwnProps = {
+    /**
+     * The decorator stops taking touches and disappears from the accessibility tree, so a
+     * tap on the glyph focuses the field under it and a screen reader announces the field
+     * rather than a mark it cannot act on.
+     *
+     * Leave it off whenever the decorator holds something to press — a reveal toggle, a
+     * clear button — which is the whole reason it is a prop and not the default.
+     *
+     * @default false
+     */
+    isDecorative?: boolean;
+    style?: StyleProp<ViewStyle>;
+    children?: ReactNode;
+};
+type InputGroupDecoratorProps = InputGroupDecoratorOwnProps & Omit<ViewProps, keyof InputGroupDecoratorOwnProps> & Omit<ViewStyleProps, keyof InputGroupDecoratorOwnProps | keyof ViewProps>;
+type InputGroupPrefixProps = InputGroupDecoratorProps;
+type InputGroupSuffixProps = InputGroupDecoratorProps;
+/** Which edge a decorator is pinned to, and therefore which width it reports. */
+type InputGroupSide = 'prefix' | 'suffix';
+/**
+ * Everything `Input.Field` accepts. It **is** that field — the same `TextInput`, the same
+ * focus plumbing, the same styles — with the padding the two decorators measured.
+ */
+type InputGroupFieldProps = InputFieldProps;
+/** Everything `Icon` accepts. `size` and `color` fall back to the field's own. */
+type InputGroupIconProps = IconProps;
+/**
+ * R5 — but the only thing here that is not already resolved on the `Input`'s context: two
+ * widths nobody can know before layout.
+ *
+ * A decorator is out of flow, so it cannot push the text aside the way a sibling in a row
+ * would; the field clears it by padding instead, and the padding is the decorator's own
+ * measured width. That is the same shape `TextArea` uses for `rows` — a raw number the
+ * slot turns into a style, outside the cache.
+ */
+type InputGroupContextValue = {
+    /** `0` while the decorator is absent, and until its first layout. */
+    prefixWidth: number;
+    suffixWidth: number;
+    setPrefixWidth: (width: number) => void;
+    setSuffixWidth: (width: number) => void;
+};
+
+/**
+ * A glyph that takes the field's scale and the placeholder's colour without being told
+ * either:
+ *
+ * ```tsx
+ * <InputGroup.Prefix isDecorative>
+ *   <InputGroup.Icon as={MailIcon} />
+ * </InputGroup.Prefix>
+ * ```
+ *
+ * The size comes from the `Input`'s own `size` — one step above the field's type, as on
+ * the `Button` and the `Chip`, because a 16pt glyph beside 16pt of text reads as the
+ * smaller of the two. The colour is the theme's `fieldPlaceholder`: a mark in a field is
+ * decoration for the text, not text. An explicit `size` or `color` still wins, which is
+ * what `Icon` promises everywhere else in the library — and it is the answer for a tinted
+ * `primary` field, where the fill is the caller's colour and the placeholder grey is no
+ * longer readable over it.
+ *
+ * It is not one of HeroUI's three parts: theirs colour the glyph at the call site. This is
+ * the same slot `Button`, `Chip` and `Alert` all have, and it exists so that a form does
+ * not carry a hard-coded `#888` on every field.
+ */
+declare function InputGroupIcon({ size, color, ...rest }: InputGroupIconProps): react.JSX.Element;
+declare namespace InputGroupIcon {
+    var displayName: string;
+}
+
+/**
+ * A field with something beside it — a glyph, a unit, a reveal toggle.
+ *
+ * ```tsx
+ * <Input>
+ *   <Input.Label>Mot de passe</Input.Label>
+ *   <InputGroup>
+ *     <InputGroup.Prefix isDecorative>
+ *       <InputGroup.Icon as={LockIcon} />
+ *     </InputGroup.Prefix>
+ *     <InputGroup.Field secureTextEntry value={password} onChangeText={setPassword} />
+ *     <InputGroup.Suffix>
+ *       <Pressable onPress={toggle} hitSlop={20}>
+ *         <InputGroup.Icon as={EyeIcon} />
+ *       </Pressable>
+ *     </InputGroup.Suffix>
+ *   </InputGroup>
+ *   <Input.Description>Douze caractères au moins.</Input.Description>
+ * </Input>
+ * ```
+ *
+ * **It goes inside an `Input`, and it replaces nothing but the field.** The column, the
+ * label, the hint, the error, the four variants, the `size`, the `radius`, the tint, the
+ * focus and `isInvalid` are all still the `Input`'s — this root is one row of that column,
+ * and it owns exactly one thing: how wide the two decorators turned out to be.
+ *
+ * That is why the box is still the `TextInput` itself. A wrapper carrying the border, the
+ * fill and the radius would be a second thing to keep in step with `Input`, and the day
+ * one of them gained a shadow the other would not have it. The decorators are laid **over**
+ * the field instead, out of flow, and the field clears them with padding.
+ *
+ * It works under `TextArea` too — the same context, the same field — though a decorator
+ * centred over six lines of text is rarely what a multiline field wants.
+ */
+declare const InputGroupRoot: react.ForwardRefExoticComponent<{
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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"> & {
+    asChild?: boolean;
+} & react.RefAttributes<View>>;
+
+/**
+ * The `TextInput` itself — `Input.Field` with the room the two decorators need.
+ *
+ * ```tsx
+ * <InputGroup.Field value={query} onChangeText={setQuery} placeholder="Rechercher…" />
+ * ```
+ *
+ * It renders the `Input`'s field rather than a second `TextInput`, so the focus plumbing,
+ * the placeholder colour, the label association, `isInvalid` and `isDisabled` are the ones
+ * already written, and every `TextInput` prop is written here for the same reason it is
+ * there.
+ *
+ * The padding is arithmetic rather than a token, the way `TextArea`'s height is: a
+ * decorator's width is not knowable before layout, so it measures itself and this turns
+ * the two numbers into `paddingStart` and `paddingEnd`. They land **after** the recipe's
+ * own `paddingHorizontal`, which is what makes them win, and before the caller's `style`,
+ * which still has the last word.
+ */
+declare const InputGroupField: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<TextInput>>;
+
+/**
+ * What sits before the text — a search glyph, a currency, a country code.
+ *
+ * ```tsx
+ * <InputGroup>
+ *   <InputGroup.Prefix isDecorative>
+ *     <InputGroup.Icon as={SearchIcon} />
+ *   </InputGroup.Prefix>
+ *   <InputGroup.Field placeholder="Rechercher…" />
+ * </InputGroup>
+ * ```
+ *
+ * It is pinned to the **leading** edge and inset by the field's own padding, so the glyph
+ * starts where the text would have. The field then clears it by the width it measured —
+ * which is what lets a `+33` prefix and a 16pt mark both sit right, without either one
+ * being told a number.
+ *
+ * Add `isDecorative` whenever it holds nothing to press. Leave it off for a control.
+ */
+declare const InputGroupPrefix: react.ForwardRefExoticComponent<{
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<View>>;
+
+/**
+ * What sits after the text — a reveal toggle, a clear button, a unit, a counter.
+ *
+ * ```tsx
+ * <InputGroup>
+ *   <InputGroup.Field secureTextEntry value={password} onChangeText={setPassword} />
+ *   <InputGroup.Suffix>
+ *     <Pressable onPress={toggle} hitSlop={20}>
+ *       <InputGroup.Icon as={isVisible ? EyeOffIcon : EyeIcon} />
+ *     </Pressable>
+ *   </InputGroup.Suffix>
+ * </InputGroup>
+ * ```
+ *
+ * The trailing edge is where a suffix is most often a **control**, which is why
+ * `isDecorative` is off by default: a decorator that swallowed its own taps would be a
+ * reveal toggle you cannot press.
+ *
+ * The library ships no button for it. A suffix holds whatever you put in it, and
+ * `Pressable` with a `hitSlop` is the thing to put there — a 16pt glyph is not a touch
+ * target on its own.
+ */
+declare const InputGroupSuffix: react.ForwardRefExoticComponent<{
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    isDecorative?: boolean;
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<View>>;
+
+declare const useInputGroup: () => InputGroupContextValue;
+
+/**
+ * The room a decorator asks the field to leave it, from the width it measured.
+ *
+ * `start` and `end`, never `left` and `right` (R13): the prefix is the leading edge in
+ * both directions of writing, and RTL mirrors the logical property and only it.
+ *
+ * It returns `undefined` rather than an object of two `undefined`s when there is nothing
+ * to clear, so a group with no decorator adds no entry to the field's style array — and
+ * the `useMemo` around it keeps the same reference until a width actually changes.
+ */
+declare function decoratorPadding(prefixWidth: number, suffixWidth: number): ViewStyle | undefined;
+
+/**
+ * The four parts of a decorated field. The label, the hint and the error are **not** here:
+ * they are the `Input`'s, and an `InputGroup` lives inside one.
+ */
+declare const InputGroup: react.ForwardRefExoticComponent<{
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+} & Omit<react_native.ViewProps, keyof {
+    style?: react_native.StyleProp<react_native.ViewStyle>;
+    children?: react.ReactNode;
+}> & Omit<ViewStyleProps, "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"> & {
+    asChild?: boolean;
+} & react.RefAttributes<react_native.View>> & {
+    Prefix: react.ForwardRefExoticComponent<{
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    } & Omit<react_native.ViewProps, keyof {
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    }> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<react_native.View>>;
+    Field: react.ForwardRefExoticComponent<Omit<react_native.TextInputProps, "editable"> & Omit<TextStyleProps, keyof react_native.TextInputProps> & react.RefAttributes<react_native.TextInput>>;
+    Suffix: react.ForwardRefExoticComponent<{
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    } & Omit<react_native.ViewProps, keyof {
+        isDecorative?: boolean;
+        style?: react_native.StyleProp<react_native.ViewStyle>;
+        children?: react.ReactNode;
+    }> & Omit<ViewStyleProps, "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" | "isDecorative"> & react.RefAttributes<react_native.View>>;
+    Icon: typeof InputGroupIcon;
+};
+
+export { InputGroup, type InputGroupContextValue, InputGroupField, type InputGroupFieldProps, InputGroupIcon, type InputGroupIconProps, InputGroupPrefix, type InputGroupPrefixProps, type InputGroupProps, InputGroupRoot, type InputGroupSide, InputGroupSuffix, type InputGroupSuffixProps, decoratorPadding, useInputGroup };

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

@@ -0,0 +1,26 @@
+import {
+  InputGroup,
+  InputGroupField,
+  InputGroupIcon,
+  InputGroupPrefix,
+  InputGroupRoot,
+  InputGroupSuffix,
+  decoratorPadding,
+  useInputGroup
+} from "../../chunk-WEMZ4VMC.js";
+import "../../chunk-ICR42HHG.js";
+import "../../chunk-V2FQN6ZK.js";
+import "../../chunk-3JATAB7S.js";
+import "../../chunk-PMO62QK4.js";
+import "../../chunk-A3EGFI6T.js";
+import "../../chunk-GGW42MY4.js";
+export {
+  InputGroup,
+  InputGroupField,
+  InputGroupIcon,
+  InputGroupPrefix,
+  InputGroupRoot,
+  InputGroupSuffix,
+  decoratorPadding,
+  useInputGroup
+};

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;