@webority-technologies/mobile 0.0.22 → 0.0.24

package/lib/typescript/commonjs/theme/types.d.ts

@@ -39,6 +39,21 @@ export interface ColorPalette {
     warning: string;
     error: string;
     info: string;
+    /**
+     * Foreground (text/icon) colour to render ON a solid fill of each semantic
+     * tone. Solid Button / Badge / Chip / Banner backgrounds read these instead
+     * of assuming `text.inverse` (white) — white-on-pale (notably `warning`
+     * amber) fails contrast. Library defaults keep the historical white for
+     * primary/success/error/info, use dark ink for `warning`, and `text.primary`
+     * for the surface-like `secondary` tone. Override per-brand to match your
+     * palette's luminance.
+     */
+    onPrimary: string;
+    onSecondary: string;
+    onSuccess: string;
+    onWarning: string;
+    onError: string;
+    onInfo: string;
     text: {
         primary: string;
         secondary: string;
@@ -280,8 +295,6 @@ export interface DialogTokens {
     iconWrapperSize: number;
     iconWrapperBorderRadius: number;
     actionButtonMinHeight: number;
-    /** When true, fires a selection haptic on action-button press. Library default: false. */
-    actionHaptic?: boolean;
 }
 export interface ToastTokens {
     iconCircleSize: number;
@@ -322,43 +335,25 @@ export interface CheckboxSizeTokens {
 }
 export interface CheckboxTokens extends Partial<Record<ComponentSizeKey, CheckboxSizeTokens>> {
     labelGap?: number;
-    /** When true, fires a selection haptic on press by default. Library default: false. */
-    pressHaptic?: boolean;
-}
-export interface ChipTokens extends Partial<Record<ComponentSizeKey, ChipSizeTokens>> {
-    /** When true, fires a selection haptic when the chip itself is pressed. Library default: false. */
-    pressHaptic?: boolean;
-    /** When true, fires a selection haptic when the close (×) button is pressed. Library default: false. */
-    closeHaptic?: boolean;
-}
-export interface ListItemTokens extends Partial<Record<ComponentSizeKey, ListItemSizeTokens>> {
-    /** When true, fires a selection haptic on press. Library default: false. */
-    pressHaptic?: boolean;
 }
+export type ChipTokens = Partial<Record<ComponentSizeKey, ChipSizeTokens>>;
+export type ListItemTokens = Partial<Record<ComponentSizeKey, ListItemSizeTokens>>;
 export interface RadioSizeTokens {
     outer: number;
     inner: number;
 }
 export interface RadioTokens extends Partial<Record<ComponentSizeKey, RadioSizeTokens>> {
     labelGap?: number;
-    /** When true, fires a selection haptic on press by default. Library default: false. */
-    pressHaptic?: boolean;
 }
 export interface NumberInputTokens {
     /** Milliseconds before long-press auto-repeat kicks in. Library default: 500. */
     longPressDelayMs?: number;
     /** Milliseconds between auto-repeated step ticks while long-pressed. Library default: 80. */
     longPressIntervalMs?: number;
-    /** When true, fires a light impact haptic on every +/- press. Library default: false. */
-    pressHaptic?: boolean;
 }
 export interface OTPInputTokens extends Partial<Record<ComponentSizeKey, OTPInputSizeTokens>> {
     /** When true, the row shakes horizontally on first error transition. Library default: false. */
     shakeOnError?: boolean;
-    /** When true, fires an error haptic on first error transition. Library default: false. */
-    errorHaptic?: boolean;
-    /** When true, fires a selection haptic on each value change. Library default: false. */
-    selectionHaptic?: boolean;
 }
 export interface ProgressBarTokens {
     /** Duration in ms of the indeterminate-loop animation cycle. Library default: 1500. */
@@ -373,8 +368,6 @@ export interface RatingTokens {
     pulseOnPress?: boolean;
     /** Peak scale of the pulse animation. Library default: 1.2. */
     pulseScale?: number;
-    /** When true, fires a selection haptic on each rating change. Library default: false. */
-    pressHaptic?: boolean;
 }
 /**
  * Per-size dimensions for the unified field box (FieldBase). Every
@@ -515,8 +508,6 @@ export interface BottomNavigationTokens {
     underlineHeight?: number;
 }
 export interface DatePickerTokens {
-    /** Opt-in haptic feedback on month/year navigation and selection. Default: false. */
-    haptic?: boolean;
     /** Pixel offset for the month-slide animation. Default: 32. */
     monthSlideDistance?: number;
     /** Outgoing month-slide animation duration (ms). Default: theme.motion.duration.fast or 140. */
@@ -549,8 +540,6 @@ export interface DatePickerTokens {
     footerButtonMinHeight?: number;
 }
 export interface DateRangePickerTokens {
-    /** Opt-in haptic feedback on month navigation and selection. Default: false. */
-    haptic?: boolean;
     /** Pixel offset for the month-slide animation. Default: 32. */
     monthSlideDistance?: number;
     /** Outgoing month-slide animation duration (ms). Default: theme.motion.duration.fast or 140. */
@@ -567,8 +556,6 @@ export interface DateRangePickerTokens {
     footerButtonMinHeight?: number;
 }
 export interface TimePickerTokens {
-    /** Opt-in haptic feedback on wheel scroll and confirm/cancel. Default: false. */
-    haptic?: boolean;
     /** Debounce window between scroll-haptic ticks (ms). Default: 35. */
     hapticDebounceMs?: number;
     /** Width of the bottom-sheet drag handle. Default: 36. */
@@ -601,14 +588,10 @@ export interface AvatarTokens {
     fontWeight?: keyof TypographyScale['fontWeight'];
 }
 export interface AccordionTokens {
-    /** When true, fires a selection haptic on header press. Library default: false. */
-    pressHaptic?: boolean;
     /** Vertical padding inside the `card` variant container. Library default: 4. */
     cardPaddingVertical?: number;
 }
 export interface AppBarTokens {
-    /** When true, fires a selection haptic on action-button press. Library default: false. */
-    pressHaptic?: boolean;
     /** Min-width of the left/right side action slots. Library default: 48. */
     sideSlotMinWidth?: number;
     /** Translate-Y distance (px, negative) the large title travels when collapsing. Library default: -20. */
@@ -649,17 +632,11 @@ export interface BannerTokens {
     actionButtonPaddingVertical?: number;
     actionButtonRadius?: number;
 }
-export interface CardTokens {
-    /** When true, fires a selection haptic on interactive card press. Library default: false. */
-    pressHaptic?: boolean;
-}
 export interface DrawerTokens {
     /** Pixel velocity above which a fling closes the drawer. Library default: 1000. */
     closeVelocityThreshold?: number;
     /** Pixel drag distance before the gesture is recognised. Library default: 10. */
     dragActivationOffset?: number;
-    /** When true, fires a selection haptic on backdrop press. Library default: false. */
-    backdropPressHaptic?: boolean;
 }
 export interface FloatingActionButtonTokens {
     /** Horizontal inset from screen edge for bottomLeft/bottomRight positions. Library default: 24. */
@@ -670,8 +647,6 @@ export interface FloatingActionButtonTokens {
     secondaryGap?: number;
     /** Per-item stagger delay in ms when opening/closing the group. Library default: 50. */
     staggerMs?: number;
-    /** When true, fires impactLight on press / open / action. Library default: false. */
-    pressHaptic?: boolean;
 }
 export interface ImageGalleryTokens {
     /** Maximum pinch-zoom scale. Library default: 4. */
@@ -680,14 +655,10 @@ export interface ImageGalleryTokens {
     minScale?: number;
     /** Scale applied on double-tap at rest. Library default: 2. */
     doubleTapScale?: number;
-    /** When true, fires haptics on open/close/swipe/double-tap. Library default: false. */
-    pressHaptic?: boolean;
 }
 export interface ModalTokens {
     /** Initial scale value for the centred presentation enter animation. Library default: 0.9. */
     scaleStartValue?: number;
-    /** When true, fires a selection haptic on backdrop dismiss. Library default: false. */
-    backdropHaptic?: boolean;
 }
 export interface SegmentedControlSizeTokens {
     height?: number;
@@ -697,8 +668,6 @@ export interface SegmentedControlSizeTokens {
 export interface SegmentedControlTokens extends Partial<Record<'sm' | 'md', SegmentedControlSizeTokens>> {
     /** Padding between the track edge and the selected indicator. Library default: 2. */
     trackPadding?: number;
-    /** When true, fires a selection haptic on segment change. Library default: false. */
-    changeHaptic?: boolean;
 }
 export interface SliderSizeTokens {
     trackHeight?: number;
@@ -713,14 +682,6 @@ export interface SliderTokens extends Partial<Record<ComponentSizeKey, SliderSiz
     labelShowDuration?: number;
     /** Final opacity of the bubble label when visible. Library default: 1. */
     labelOpacity?: number;
-    /** When true, fires a selection haptic while dragging. Library default: false. */
-    dragHaptic?: boolean;
-    /** When true, fires a selection haptic each time the value crosses a step boundary. Library default: false. */
-    stepHaptic?: boolean;
-    /** When true, fires a selection haptic on track tap. Library default: false. */
-    tapHaptic?: boolean;
-    /** When true, fires a selection haptic on accessibility increment/decrement. Library default: false. */
-    a11yHaptic?: boolean;
 }
 export interface StepperTokens {
     /** Diameter of each step circle. Library default: 24. */
@@ -731,8 +692,6 @@ export interface StepperTokens {
     pulseDuration?: number;
     /** When true, the active step animates a continuous pulse ring. Library default: false. */
     pulseAnimation?: boolean;
-    /** When true, fires a selection haptic on step press. Library default: false. */
-    pressHaptic?: boolean;
 }
 export interface SwipeableTokens {
     /** Pixel distance after which a partial-swipe action commits on release. Library default: 64. */
@@ -751,12 +710,6 @@ export interface SwipeableTokens {
     springStiffness?: number;
     /** Spring mass for snap-back animation. */
     springMass?: number;
-    /** When true, fires a notification haptic on full-swipe commit. Library default: true. */
-    fullSwipeHaptic?: boolean;
-    /** When true, fires a selection haptic on action button press. Library default: true. */
-    actionPressHaptic?: boolean;
-    /** When true, fires a selection haptic on accessibility action. Library default: true. */
-    a11yActionHaptic?: boolean;
 }
 export interface TabsTokens {
     /** Horizontal padding of each tab. Library default: theme.spacing.lg. */
@@ -773,8 +726,6 @@ export interface TabsTokens {
     disabledOpacity?: number;
     /** Gap between label and inline badge. Library default: 6. */
     badgeGap?: number;
-    /** When true, fires a selection haptic on tab press. Library default: false. */
-    hapticOnPress?: boolean;
 }
 export interface TooltipTokens {
     /** Gap between trigger and tooltip card. Library default: 8. */
@@ -807,7 +758,6 @@ export interface ComponentTokens {
     badge?: BadgeTokens;
     bottomNavigation?: BottomNavigationTokens;
     bottomSheet?: BottomSheetTokens;
-    card?: CardTokens;
     checkbox?: CheckboxTokens;
     chip?: ChipTokens;
     datePicker?: DatePickerTokens;

package/lib/typescript/commonjs/utils/hapticUtils.d.ts

@@ -1,4 +1,12 @@
 export type HapticType = 'selection' | 'impactLight' | 'impactMedium' | 'impactHeavy' | 'notificationSuccess' | 'notificationWarning' | 'notificationError';
 export declare const triggerHaptic: (type?: HapticType) => void;
 export declare const setHapticImplementation: (impl: ((type: HapticType) => void) | null) => void;
+/**
+ * Resolves a component's `haptic` prop to the type that should fire, or null
+ * when haptics are off. `false` disables; a `HapticType` overrides; `undefined`
+ * falls back to the component's sensible default. Pair with `triggerHaptic`:
+ *   const h = resolveHaptic(haptic, 'selection');
+ *   if (h) triggerHaptic(h);
+ */
+export declare const resolveHaptic: (haptic: HapticType | false | undefined, fallbackType: HapticType) => HapticType | null;
 //# sourceMappingURL=hapticUtils.d.ts.map

package/lib/typescript/commonjs/utils/index.d.ts

@@ -2,7 +2,7 @@ export { ScreenDimensions, Breakpoints, Responsive, isScreenSize, isTablet } fro
 export type { BreakpointKey } from './responsive';
 export { Spacing, Padding, Margin } from './spacing';
 export type { SpacingToken } from './spacing';
-export { triggerHaptic, setHapticImplementation } from './hapticUtils';
+export { triggerHaptic, setHapticImplementation, resolveHaptic } from './hapticUtils';
 export type { HapticType } from './hapticUtils';
 export { shadowStyle } from './shadows';
 export { compressImage } from './imageCompression';

package/lib/typescript/module/components/Accordion/Accordion.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils';
 export type AccordionVariant = 'plain' | 'card';
 export interface AccordionProps {
     title: string;
@@ -26,6 +27,8 @@ export interface AccordionProps {
      * accordion so the layout doesn't shift when data arrives.
      */
     loading?: boolean;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
 }
 export interface AccordionGroupProps {
     children: React.ReactNode;

package/lib/typescript/module/components/AnimatePresence/AnimatePresence.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+export type PresencePreset = 'fade' | 'scale' | 'slide-up' | 'slide-down';
+export interface AnimatePresenceProps {
+    /**
+     * Render conditionally. When this goes null / undefined / false the exit
+     * animation plays before the content unmounts; when it returns the enter
+     * animation plays. Drive it like `{visible ? <Panel /> : null}`.
+     */
+    children?: React.ReactNode;
+    /** Enter/exit preset. Default `'fade'`. */
+    preset?: PresencePreset;
+    /** Animation duration (ms). Defaults to `theme.motion.duration.base`. */
+    duration?: number;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * Animates a single child in on mount and out on unmount. Thin, theme-aware
+ * wrapper over Reanimated's `entering`/`exiting` — Reanimated keeps the view
+ * alive to play the exit, so the parent only toggles a condition. Honors the OS
+ * Reduce Motion setting (renders instantly when reduced).
+ *
+ * For animating items inside a list, use Reanimated's `itemLayoutAnimation`
+ * on `Animated.FlatList` instead — this wrapper targets single conditional nodes.
+ */
+declare const AnimatePresence: React.FC<AnimatePresenceProps>;
+export { AnimatePresence };
+export default AnimatePresence;
+//# sourceMappingURL=AnimatePresence.d.ts.map

package/lib/typescript/module/components/AnimatePresence/index.d.ts

@@ -0,0 +1,3 @@
+export { AnimatePresence } from './AnimatePresence';
+export type { AnimatePresenceProps, PresencePreset } from './AnimatePresence';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/AppBar/AppBar.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Animated, View } from 'react-native';
 import type { StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils';
 export type AppBarVariant = 'default' | 'large' | 'compact';
 export type AppBarTitleAlignment = 'left' | 'center';
 export interface AppBarAction {
@@ -36,6 +37,11 @@ export interface AppBarProps {
     subtitleStyle?: StyleProp<ViewStyle>;
     /** Style applied to the right-action badge bubble. */
     badgeStyle?: StyleProp<ViewStyle>;
+    /**
+     * Haptic feedback for interactions. Pass false to disable; pass a HapticType
+     * to override the default.
+     */
+    haptic?: HapticType | false;
     testID?: string;
 }
 declare const AppBar: React.ForwardRefExoticComponent<AppBarProps & React.RefAttributes<View>>;

package/lib/typescript/module/components/Banner/Banner.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import type { StyleProp, View as RNView, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils';
 export type BannerVariant = 'info' | 'success' | 'warning' | 'error' | 'neutral';
 export interface BannerAction {
     label: string;
@@ -14,6 +15,8 @@ export interface BannerProps {
     actions?: BannerAction[];
     dismissible?: boolean;
     onDismiss?: () => void;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     visible?: boolean;
     animateMount?: boolean;
     /**

package/lib/typescript/module/components/BottomNavigation/BottomNavigation.d.ts

@@ -20,7 +20,7 @@ export interface TabConfig {
 export interface BottomNavigationProps {
     tabs: TabConfig[];
     activeTab: string;
-    onTabPress: (tabKey: string) => void;
+    onChange: (tabKey: string) => void;
     haptic?: HapticType | false;
     showLabels?: boolean;
     variant?: BottomNavigationVariant;

package/lib/typescript/module/components/Box/Box.d.ts

@@ -0,0 +1,60 @@
+import React from 'react';
+import { View } from 'react-native';
+import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
+import type { ColorPalette, RadiusScale, SpacingScale, Theme } from '../../theme/types';
+export type SpacingToken = keyof SpacingScale;
+export type RadiusToken = keyof RadiusScale;
+export type BackgroundToken = keyof ColorPalette['background'];
+export interface BoxProps extends ViewProps {
+    /** padding (all sides) */
+    p?: SpacingToken;
+    /** paddingHorizontal */
+    px?: SpacingToken;
+    /** paddingVertical */
+    py?: SpacingToken;
+    pt?: SpacingToken;
+    pr?: SpacingToken;
+    pb?: SpacingToken;
+    pl?: SpacingToken;
+    /** margin (all sides) */
+    m?: SpacingToken;
+    mx?: SpacingToken;
+    my?: SpacingToken;
+    mt?: SpacingToken;
+    mr?: SpacingToken;
+    mb?: SpacingToken;
+    ml?: SpacingToken;
+    /** Flexbox gap between children (spacing token). */
+    gap?: SpacingToken;
+    /** Background — a `colors.background.*` token or a raw colour string. */
+    bg?: BackgroundToken | (string & {});
+    radius?: RadiusToken;
+    /** Draw a hairline border in `colors.border.primary`. */
+    border?: boolean;
+    flex?: number;
+    align?: ViewStyle['alignItems'];
+    justify?: ViewStyle['justifyContent'];
+    direction?: ViewStyle['flexDirection'];
+    wrap?: boolean;
+    style?: StyleProp<ViewStyle>;
+}
+type LayoutProps = Omit<BoxProps, 'style' | 'children'>;
+export declare const resolveBoxStyle: (theme: Theme, p: LayoutProps) => ViewStyle;
+declare const Box: React.ForwardRefExoticComponent<BoxProps & React.RefAttributes<View>>;
+export type StackProps = Omit<BoxProps, 'direction'>;
+/** Vertical flex container with token spacing between children (default gap `md`). */
+declare const Stack: React.ForwardRefExoticComponent<StackProps & React.RefAttributes<View>>;
+export type RowProps = Omit<BoxProps, 'direction'>;
+/** Horizontal flex container (default `align="center"`, gap `sm`). */
+declare const Row: React.ForwardRefExoticComponent<RowProps & React.RefAttributes<View>>;
+export interface SpacerProps {
+    /** Fixed spacer of this spacing token. Omit for a flexible spacer (`flex: 1`). */
+    size?: SpacingToken;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/** Fixed gap (`size`) or a flexible push (`flex: 1`) between siblings. */
+declare const Spacer: React.FC<SpacerProps>;
+export { Box, Stack, Row, Spacer };
+export default Box;
+//# sourceMappingURL=Box.d.ts.map

package/lib/typescript/module/components/Box/index.d.ts

@@ -0,0 +1,3 @@
+export { Box, Stack, Row, Spacer, resolveBoxStyle } from './Box';
+export type { BoxProps, StackProps, RowProps, SpacerProps } from './Box';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/components/Button/Button.d.ts

@@ -4,7 +4,7 @@ import type { PressableProps, StyleProp, TextStyle, ViewStyle } from 'react-nati
 import type { GradientDefinition } from '../../theme/types';
 import type { HapticType } from '../../utils/hapticUtils';
 export type ButtonVariant = 'solid' | 'outline' | 'ghost' | 'link';
-export type ButtonTone = 'primary' | 'secondary' | 'success' | 'warning' | 'danger' | 'neutral';
+export type ButtonTone = 'primary' | 'secondary' | 'success' | 'warning' | 'error' | 'neutral';
 export type ButtonSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 export interface ButtonProps extends Omit<PressableProps, 'style' | 'children'> {
     title?: string;

package/lib/typescript/module/components/Card/Card.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import type { GestureResponderEvent, ImageSourcePropType, PressableProps, StyleProp, View as RNView, ViewStyle } from 'react-native';
 import type { GradientDefinition } from '../../theme/types';
+import type { HapticType } from '../../utils/hapticUtils';
 export type CardVariant = 'elevated' | 'outlined' | 'filled';
 export type CardElevation = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
 export type CardRadius = 'sm' | 'md' | 'lg' | 'xl' | '2xl';
@@ -32,6 +33,8 @@ export interface CardProps extends Omit<PressableProps, 'style' | 'children'> {
      */
     gradient?: string | GradientDefinition;
     onPress?: (event: GestureResponderEvent) => void;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     accessibilityLabel?: string;
     style?: StyleProp<ViewStyle>;
     /** Alias for `style` — applied to the outer card element. */

package/lib/typescript/module/components/Checkbox/Checkbox.d.ts

@@ -5,14 +5,16 @@ import type { HapticType } from '../../utils/hapticUtils';
 export type CheckboxSize = 'sm' | 'md' | 'lg';
 export type CheckboxTone = 'primary' | 'success' | 'warning' | 'error';
 export interface CheckboxProps extends Omit<PressableProps, 'style' | 'children' | 'onPress'> {
-    checked: boolean;
-    onChange: (checked: boolean) => void;
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onChange?: (checked: boolean) => void;
     indeterminate?: boolean;
     disabled?: boolean;
     label?: string;
     size?: CheckboxSize;
     tone?: CheckboxTone;
     accessibilityLabel?: string;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
     haptic?: HapticType | false;
     style?: StyleProp<ViewStyle>;
     boxStyle?: StyleProp<ViewStyle>;

package/lib/typescript/module/components/Chip/Chip.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import type { StyleProp, TextStyle, View as RNView, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils';
 export type ChipVariant = 'filled' | 'outlined';
 export type ChipTone = 'primary' | 'neutral' | 'success' | 'warning' | 'error' | 'info';
 export type ChipSize = 'sm' | 'md';
@@ -20,6 +21,8 @@ export interface ChipProps {
      */
     loading?: boolean;
     accessibilityLabel?: string;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     style?: StyleProp<ViewStyle>;
     textStyle?: StyleProp<TextStyle>;
     /** Style override for the chip outer container (alias to style, applied after). */

package/lib/typescript/module/components/DatePicker/DatePicker.d.ts

@@ -1,26 +1,27 @@
 import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils';
 import type { PickerTriggerSize, PickerTriggerVariant } from '../PickerTrigger';
 export type DatePickerMode = 'modal' | 'inline';
 export type WeekStart = 0 | 1 | 6;
 /**
  * DatePicker operates in two modes:
  *
- * 1. **Controlled-modal mode** — pass `visible` (plus `onSelect` / `onClose`)
+ * 1. **Controlled-modal mode** — pass `visible` (plus `onChange` / `onClose`)
  *    and own the open state externally. The component renders only the modal.
  * 2. **Trigger mode** — omit `visible`. The component renders a built-in
  *    PickerTrigger field (label / value / placeholder / chevron / clear /
  *    helper / error / size / variant) and manages its own open state. The
  *    field opens the modal on press and closes it on confirm/cancel.
  *
- * `onSelect` / `onClose` are typed optional to support trigger-only usage
+ * `onChange` / `onClose` are typed optional to support trigger-only usage
  * where the consumer may not need either callback. In controlled-modal mode
  * they remain semantically required.
  */
 export interface DatePickerProps {
     visible?: boolean;
     value?: Date | null;
-    onSelect?: (date: Date) => void;
+    onChange?: (date: Date) => void;
     onClose?: () => void;
     minDate?: Date;
     maxDate?: Date;
@@ -40,6 +41,8 @@ export interface DatePickerProps {
     navButtonStyle?: StyleProp<ViewStyle>;
     /** Style override for the cancel/confirm footer buttons. */
     footerButtonStyle?: StyleProp<ViewStyle>;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     testID?: string;
     label?: string;
     placeholder?: string;

package/lib/typescript/module/components/DateRangePicker/DateRangePicker.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import type { StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils';
 import type { PickerTriggerSize, PickerTriggerVariant } from '../PickerTrigger';
 export type WeekStart = 0 | 1 | 6;
 export interface DateRange {
@@ -48,6 +49,11 @@ export interface DateRangePickerProps {
     confirmLabel?: string;
     cancelLabel?: string;
     maxRange?: number;
+    /**
+     * Haptic feedback for interactions. Pass false to disable; pass a HapticType
+     * to override the default.
+     */
+    haptic?: HapticType | false;
     style?: StyleProp<ViewStyle>;
     /** Outer container style applied to the calendar card. */
     containerStyle?: StyleProp<ViewStyle>;

package/lib/typescript/module/components/Dialog/Dialog.d.ts

@@ -1,7 +1,8 @@
 import React from 'react';
 import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
-export type DialogVariant = 'default' | 'success' | 'warning' | 'danger' | 'info';
-export type DialogActionTone = 'primary' | 'neutral' | 'danger';
+import type { HapticType } from '../../utils/hapticUtils';
+export type DialogVariant = 'default' | 'success' | 'warning' | 'error' | 'info';
+export type DialogActionTone = 'primary' | 'neutral' | 'error';
 export interface DialogAction {
     label: string;
     onPress: () => void;
@@ -34,6 +35,8 @@ export interface DialogProps {
     actionButtonStyle?: StyleProp<ViewStyle>;
     /** Style override applied to every action button label text. */
     actionTextStyle?: StyleProp<TextStyle>;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     testID?: string;
 }
 declare const Dialog: React.FC<DialogProps>;

package/lib/typescript/module/components/Drawer/Drawer.d.ts

@@ -19,6 +19,7 @@
  */
 import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils';
 export type DrawerSide = 'left' | 'right' | 'top' | 'bottom';
 export interface DrawerProps {
     /** Controlled visibility. Omit to use internal state. */
@@ -37,6 +38,8 @@ export interface DrawerProps {
     enableBackdropPress?: boolean;
     /** Backdrop opacity at fully-open state (0..1). */
     backdropOpacity?: number;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     containerStyle?: StyleProp<ViewStyle>;
     children?: React.ReactNode;
     accessibilityLabel?: string;

package/lib/typescript/module/components/FloatingActionButton/FloatingActionButton.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import type { StyleProp, ViewStyle } from 'react-native';
+import type { HapticType } from '../../utils/hapticUtils';
 export type FloatingActionButtonSize = 'sm' | 'md' | 'lg';
 export type FloatingActionButtonTone = 'primary' | 'success' | 'warning' | 'error' | 'neutral';
 export type FloatingActionButtonPosition = 'bottomRight' | 'bottomLeft' | 'bottomCenter';
@@ -18,6 +19,8 @@ export interface FloatingActionButtonProps {
     isScrolling?: boolean;
     accessibilityLabel: string;
     accessibilityHint?: string;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     style?: StyleProp<ViewStyle>;
     containerStyle?: StyleProp<ViewStyle>;
     labelStyle?: StyleProp<ViewStyle>;
@@ -43,6 +46,8 @@ export interface FloatingActionButtonGroupProps {
     bottomOffset?: number;
     size?: FloatingActionButtonSize;
     accessibilityLabel?: string;
+    /** Haptic feedback for interactions. Pass false to disable; pass a HapticType to override the default. */
+    haptic?: HapticType | false;
     containerStyle?: StyleProp<ViewStyle>;
     secondaryActionStyle?: StyleProp<ViewStyle>;
     labelPillStyle?: StyleProp<ViewStyle>;

package/lib/typescript/module/components/FormField/FormField.d.ts

@@ -1,18 +1,29 @@
 import React from 'react';
 import { View } from 'react-native';
 import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
+import type { FieldInputProps } from '../../form/types';
 export type FormFieldLayout = 'stacked' | 'inline';
 export interface FormFieldProps {
     label?: string;
     helperText?: string;
     /**
      * When truthy: helperText is hidden, error is shown in the error colour,
-     * and the container reports `accessibilityState.invalid = true`.
+     * and the container reports the invalid state to assistive tech.
+     * Ignored when `name` connects to a <Form> with an element child (the child
+     * renders its own error then).
      */
     error?: string;
     /** Appends ' *' (in theme.colors.error) to the label. */
     required?: boolean;
-    children: React.ReactNode;
+    /**
+     * Connect this field to the surrounding `<Form>` by name. With an element
+     * child (e.g. `<Input/>`) the field's value/onChangeText/onBlur/error are
+     * injected automatically — best for text inputs. For non-text controls
+     * (Select, Switch, DatePicker…) use the render-prop form:
+     * `<FormField name="x">{(f) => <Select value={f.value} onChange={f.onChange} />}</FormField>`.
+     */
+    name?: string;
+    children: React.ReactNode | ((field: FieldInputProps) => React.ReactNode);
     /** 'stacked' (default): label above input. 'inline': label left, input right. */
     layout?: FormFieldLayout;
     labelStyle?: StyleProp<TextStyle>;