@webority-technologies/mobile 0.0.15 → 0.0.21

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

@@ -1,12 +1,27 @@
 import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
+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`)
+ *    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
+ * where the consumer may not need either callback. In controlled-modal mode
+ * they remain semantically required.
+ */
 export interface DatePickerProps {
-    visible: boolean;
+    visible?: boolean;
     value?: Date | null;
-    onSelect: (date: Date) => void;
-    onClose: () => void;
+    onSelect?: (date: Date) => void;
+    onClose?: () => void;
     minDate?: Date;
     maxDate?: Date;
     disabledDates?: Date[];
@@ -17,7 +32,27 @@ export interface DatePickerProps {
     confirmLabel?: string;
     cancelLabel?: string;
     style?: StyleProp<ViewStyle>;
+    /** Outer container style applied to the calendar card. */
+    containerStyle?: StyleProp<ViewStyle>;
+    /** Style override for the header label text wrapper (month/year). */
+    headerLabelStyle?: StyleProp<ViewStyle>;
+    /** Style override for the previous/next navigation buttons. */
+    navButtonStyle?: StyleProp<ViewStyle>;
+    /** Style override for the cancel/confirm footer buttons. */
+    footerButtonStyle?: StyleProp<ViewStyle>;
     testID?: string;
+    label?: string;
+    placeholder?: string;
+    helperText?: string;
+    error?: string;
+    required?: boolean;
+    disabled?: boolean;
+    size?: PickerTriggerSize;
+    variant?: PickerTriggerVariant;
+    clearable?: boolean;
+    onClear?: () => void;
+    formatValue?: (date: Date) => string;
+    triggerStyle?: StyleProp<ViewStyle>;
 }
 declare const DatePicker: React.FC<DatePickerProps>;
 export { DatePicker };

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

@@ -1,19 +1,44 @@
 import React from 'react';
 import { View } from 'react-native';
 import type { StyleProp, ViewStyle } from 'react-native';
+import type { PickerTriggerSize, PickerTriggerVariant } from '../PickerTrigger';
 export type WeekStart = 0 | 1 | 6;
 export interface DateRange {
     start: Date | null;
     end: Date | null;
 }
+/**
+ * DateRangePicker — supports two usage modes:
+ *
+ *   1. Controlled-modal mode (pass `visible` + `onClose`): renders only the
+ *      modal; parent owns open/close state.
+ *   2. Trigger mode (omit `visible`): renders a built-in `PickerTrigger`
+ *      field that opens an internally-managed modal on tap. Confirm fires
+ *      `onChange?.(...)` and closes.
+ */
 export interface DateRangePickerProps {
-    visible: boolean;
+    visible?: boolean;
     value: DateRange;
-    onChange: (range: {
+    onChange?: (range: {
         start: Date;
         end: Date;
     }) => void;
-    onClose: () => void;
+    onClose?: () => void;
+    label?: string;
+    placeholder?: string;
+    helperText?: string;
+    error?: string;
+    required?: boolean;
+    disabled?: boolean;
+    size?: PickerTriggerSize;
+    variant?: PickerTriggerVariant;
+    clearable?: boolean;
+    onClear?: () => void;
+    formatValue?: (range: {
+        start: Date;
+        end: Date;
+    }) => string;
+    triggerStyle?: StyleProp<ViewStyle>;
     minDate?: Date;
     maxDate?: Date;
     disabledDates?: Date[];
@@ -24,6 +49,14 @@ export interface DateRangePickerProps {
     cancelLabel?: string;
     maxRange?: number;
     style?: StyleProp<ViewStyle>;
+    /** Outer container style applied to the calendar card. */
+    containerStyle?: StyleProp<ViewStyle>;
+    /** Style override for the header label (month/year) wrapper. */
+    headerLabelStyle?: StyleProp<ViewStyle>;
+    /** Style override for the previous/next navigation buttons. */
+    navButtonStyle?: StyleProp<ViewStyle>;
+    /** Style override for the cancel/confirm footer buttons. */
+    footerButtonStyle?: StyleProp<ViewStyle>;
     testID?: string;
 }
 declare const DateRangePicker: React.ForwardRefExoticComponent<DateRangePickerProps & React.RefAttributes<View>>;

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { StyleProp, ViewStyle } from 'react-native';
+import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
 export type DialogVariant = 'default' | 'success' | 'warning' | 'danger' | 'info';
 export type DialogActionTone = 'primary' | 'neutral' | 'danger';
 export interface DialogAction {
@@ -22,6 +22,18 @@ export interface DialogProps {
     contentStyle?: StyleProp<ViewStyle>;
     /** Style applied to the dialog inner container (above icon/title/message). */
     containerStyle?: StyleProp<ViewStyle>;
+    /** Style override for the title text. */
+    titleStyle?: StyleProp<TextStyle>;
+    /** Style override for the message text (only applied when message is a string). */
+    messageStyle?: StyleProp<TextStyle>;
+    /** Style override for the icon wrapper view. */
+    iconWrapperStyle?: StyleProp<ViewStyle>;
+    /** Style override for the actions row container. */
+    actionsRowStyle?: StyleProp<ViewStyle>;
+    /** Style override applied to every action button pressable. */
+    actionButtonStyle?: StyleProp<ViewStyle>;
+    /** Style override applied to every action button label text. */
+    actionTextStyle?: StyleProp<TextStyle>;
     testID?: string;
 }
 declare const Dialog: React.FC<DialogProps>;

package/lib/typescript/commonjs/components/FieldBase/FieldBase.d.ts

@@ -0,0 +1,172 @@
+/**
+ * FieldBase — the unified field-box primitive.
+ *
+ * Every input-like control in the library (Input, Select, SearchBar,
+ * NumberInput, OTPInput cell, PickerTrigger) composes FieldBase so the
+ * height / radius / padding / border / fill / focus + disabled + error
+ * states stay identical across the library. Differences (pill SearchBar,
+ * OTP underline, NumberInput steppers) become explicit overrides via
+ * props or via theme tokens — never accidental drift.
+ *
+ * Responsibilities:
+ *   - Resolve size / variant dimensions from `theme.components.field`.
+ *   - Animate the border + background between idle / focused / error.
+ *   - Render leading + trailing slots either side of `children`.
+ *   - Become Pressable when `onPress` is set (Select, PickerTrigger).
+ *   - Apply disabled fill + cursor semantics.
+ *
+ * Non-responsibilities (the parent owns these):
+ *   - The actual TextInput / Text / nested editor.
+ *   - Floating / static labels rendered above the field.
+ *   - Helper / error / counter text rendered below the field.
+ *   - Shake-on-error or any cross-field animation.
+ */
+import React from 'react';
+import type { AccessibilityRole, AccessibilityState, StyleProp, TextStyle, ViewStyle } from 'react-native';
+import type { FieldSide, FieldSizeTokens, FieldVariantTokens, Theme } from '../../theme/types';
+export type FieldBaseSize = 'sm' | 'md' | 'lg';
+export type FieldBaseVariant = 'outlined' | 'filled' | 'underline';
+/**
+ * Pick the most "representative" side colour from a 4-side record. Used by
+ * consumers (Input's selectionColor, focus rings, etc.) that need a single
+ * colour to mirror the visible focus indicator. Priority: bottom → top →
+ * left → right, skipping `'transparent'`. The bottom-first order means
+ * underline variants pick their underline colour automatically.
+ */
+export declare const pickRepresentativeBorderColor: (sides: Record<FieldSide, string>) => string;
+export interface FieldBaseProps {
+    /** Resolves to dimension tokens at `theme.components.field[size]`. Default `'md'`. */
+    size?: FieldBaseSize;
+    /**
+     * Controls the resting fill + border treatment. Override the theme default
+     * (`theme.components.field.defaultVariant`) via this prop. Default `'outlined'`.
+     */
+    variant?: FieldBaseVariant;
+    /** Parent-controlled focus state — drives the border + fill animation. */
+    focused?: boolean;
+    /** Disabled state — wins over `focused` / `error`. */
+    disabled?: boolean;
+    /** Error state — visually wins over `focused`. */
+    error?: boolean;
+    /** Whether the field currently holds a value. Affects idle-empty vs idle-filled fill. */
+    filled?: boolean;
+    /** Slot to the left of `children`. Rendered inside the padded row. */
+    leading?: React.ReactNode;
+    /** Slot to the right of `children`. Rendered inside the padded row. */
+    trailing?: React.ReactNode;
+    /** The editable / displayed content. TextInput, Text, OTP, anything. */
+    children?: React.ReactNode;
+    /**
+     * When provided, the entire field becomes Pressable. Use for Select /
+     * PickerTrigger / any non-text-input field. Disabled when `disabled` is true.
+     */
+    onPress?: () => void;
+    /** Override `minHeight` (multiline Input). */
+    minHeight?: number;
+    /** Override `maxHeight` (rarely needed). */
+    maxHeight?: number;
+    /** Fixed pixel width — used by OTP cells. Suppresses default `flex: 1`. */
+    width?: number;
+    /** Fixed pixel height — used by OTP cells. Wins over `minHeight`. */
+    height?: number;
+    /** Override horizontal padding. */
+    paddingHorizontal?: number;
+    /** Override vertical padding (single-line). Multiline parents usually leave this default. */
+    paddingVertical?: number;
+    /** Override corner radius (shorthand — all four corners). SearchBar pill uses this to apply `radius.full`. */
+    borderRadius?: number;
+    /** Top-left corner radius. Wins over `borderRadius`. */
+    borderTopLeftRadius?: number;
+    /** Top-right corner radius. Wins over `borderRadius`. */
+    borderTopRightRadius?: number;
+    /** Bottom-left corner radius. Wins over `borderRadius`. */
+    borderBottomLeftRadius?: number;
+    /** Bottom-right corner radius. Wins over `borderRadius`. */
+    borderBottomRightRadius?: number;
+    /** Override border width (shorthand — all four sides). OTP uses 1.5; everything else inherits `colors.border.width`. */
+    borderWidth?: number;
+    /** Top border width. Wins over `borderWidth`. */
+    borderTopWidth?: number;
+    /** Right border width. Wins over `borderWidth`. */
+    borderRightWidth?: number;
+    /** Bottom border width. Wins over `borderWidth`. */
+    borderBottomWidth?: number;
+    /** Left border width. Wins over `borderWidth`. */
+    borderLeftWidth?: number;
+    /** Gap between leading / children / trailing. Defaults to `theme.spacing.sm`. */
+    gap?: number;
+    fillOverrides?: Partial<FieldVariantTokens>;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+    accessibilityRole?: AccessibilityRole;
+    accessibilityLabel?: string;
+    accessibilityState?: AccessibilityState;
+    accessibilityHint?: string;
+}
+/**
+ * Resolved text styling for the editable / displayed content inside a field.
+ * Single source of truth so every field component (Input, NumberInput,
+ * Select, SearchBar, PickerTrigger) renders identical colour + weight +
+ * fontFamily for value text — and reads the placeholder colour from the
+ * same place. OTPInput intentionally overrides this with its own semibold
+ * display weight.
+ */
+export interface FieldTextStyleResolverOptions {
+    /** When true, returns the disabled foreground colour. */
+    disabled?: boolean;
+}
+export interface FieldTextStyle {
+    /** Foreground colour for the value text. */
+    color: string;
+    /** Placeholder foreground colour (TextInput's `placeholderTextColor` prop). */
+    placeholderColor: string;
+    /** `fontFamily` (when a brand font is registered) or `fontWeight` (otherwise). */
+    weightStyle: Pick<TextStyle, 'fontFamily' | 'fontWeight'>;
+}
+/**
+ * Resolve the canonical text style chunk for a field's value. Reads from
+ * `theme.components.field.{textColor,disabledTextColor,placeholderColor,fontWeight}`
+ * with library-default fallbacks; brand fonts wired via `typography.fontFamily`
+ * apply via the shared `fontFor` helper.
+ */
+export declare const resolveFieldTextStyle: (theme: Theme, options?: FieldTextStyleResolverOptions) => FieldTextStyle;
+/**
+ * Public re-export of the resolved size tokens — components that need to
+ * compute their own padding adjustments (e.g. multiline Input, icon-slot
+ * sizing) read from this rather than re-hardcoding the size table.
+ */
+export declare const resolveFieldSize: (theme: Theme, size: FieldBaseSize) => FieldSizeTokens;
+/**
+ * Strict, fully-resolved colour set used internally. Mirrors `FieldVariantTokens`
+ * but every border colour / width is expanded to a 4-side record by the time
+ * the box renders, so the animation pipeline can treat per-side and shorthand
+ * the same way. `borderFocusedRepresentative` is a single colour pulled from
+ * the focused sides — exposed for consumers (Input's selectionColor) that
+ * need to mirror the visible focus indicator without re-resolving per side.
+ */
+interface ResolvedFieldColors {
+    backgroundIdleEmpty: string;
+    backgroundIdleFilled: string;
+    /** Optional override fill while focused — when undefined, focus animates from idle to idle (no fill change). */
+    backgroundFocused: string | undefined;
+    /** Optional override fill while in error — when undefined, error animates from idle to idle. */
+    backgroundError: string | undefined;
+    backgroundDisabled: string;
+    borderIdle: Record<FieldSide, string>;
+    borderFocused: Record<FieldSide, string>;
+    borderError: Record<FieldSide, string>;
+    borderDisabled: Record<FieldSide, string>;
+    borderWidth: Record<FieldSide, number>;
+    /** Single representative colour from `borderFocused` — first non-transparent side, bottom-priority. */
+    borderFocusedRepresentative: string;
+}
+/**
+ * Resolve the full set of state-aware fill + border colours for a given
+ * variant. Order: explicit override → theme token → library default. Border
+ * colour + width are normalized to per-side records here; callers that need
+ * a single colour read `borderFocusedRepresentative`.
+ */
+export declare const resolveVariantColors: (theme: Theme, variant: FieldBaseVariant, override?: Partial<FieldVariantTokens>) => ResolvedFieldColors;
+export declare const FieldBase: React.FC<FieldBaseProps>;
+export default FieldBase;
+//# sourceMappingURL=FieldBase.d.ts.map

package/lib/typescript/commonjs/components/FieldBase/index.d.ts

@@ -0,0 +1,3 @@
+export { FieldBase, resolveFieldSize, resolveFieldTextStyle, default } from './FieldBase';
+export type { FieldBaseProps, FieldBaseSize, FieldBaseVariant, FieldTextStyle, FieldTextStyleResolverOptions } from './FieldBase';
+//# sourceMappingURL=index.d.ts.map

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

@@ -1,16 +1,12 @@
 import React from 'react';
 import { View } from 'react-native';
 import type { StyleProp, ViewStyle } from 'react-native';
-import type { IconFamily } from '../AppIcon';
 export type FloatingActionButtonSize = 'sm' | 'md' | 'lg';
 export type FloatingActionButtonTone = 'primary' | 'success' | 'warning' | 'error' | 'neutral';
 export type FloatingActionButtonPosition = 'bottomRight' | 'bottomLeft' | 'bottomCenter';
-export interface FloatingActionButtonIconConfig {
-    name: string;
-    family?: IconFamily;
-}
 export interface FloatingActionButtonProps {
-    icon: React.ReactNode | FloatingActionButtonIconConfig;
+    /** JSX element for the icon. The FAB sizes it via the `size` prop's iconSize token. */
+    icon: React.ReactNode;
     onPress: () => void;
     label?: string;
     size?: FloatingActionButtonSize;
@@ -23,6 +19,8 @@ export interface FloatingActionButtonProps {
     accessibilityLabel: string;
     accessibilityHint?: string;
     style?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
+    labelStyle?: StyleProp<ViewStyle>;
     testID?: string;
 }
 declare const FloatingActionButton: React.ForwardRefExoticComponent<FloatingActionButtonProps & React.RefAttributes<View>>;
@@ -45,6 +43,10 @@ export interface FloatingActionButtonGroupProps {
     bottomOffset?: number;
     size?: FloatingActionButtonSize;
     accessibilityLabel?: string;
+    containerStyle?: StyleProp<ViewStyle>;
+    secondaryActionStyle?: StyleProp<ViewStyle>;
+    labelPillStyle?: StyleProp<ViewStyle>;
+    labelStyle?: StyleProp<ViewStyle>;
     testID?: string;
 }
 declare const FloatingActionButtonGroup: React.FC<FloatingActionButtonGroupProps>;

package/lib/typescript/commonjs/components/FloatingActionButton/index.d.ts

@@ -1,3 +1,3 @@
 export { FloatingActionButton, FloatingActionButtonGroup, default } from './FloatingActionButton';
-export type { FloatingActionButtonProps, FloatingActionButtonSize, FloatingActionButtonTone, FloatingActionButtonPosition, FloatingActionButtonIconConfig, FloatingActionButtonGroupProps, FloatingActionButtonGroupAction } from './FloatingActionButton';
+export type { FloatingActionButtonProps, FloatingActionButtonSize, FloatingActionButtonTone, FloatingActionButtonPosition, FloatingActionButtonGroupProps, FloatingActionButtonGroupAction } from './FloatingActionButton';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/commonjs/components/ForceUpdateDialog/ForceUpdateDialog.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
 export interface ForceUpdateDialogProps {
     /** Whether the dialog is visible. */
     visible: boolean;
@@ -19,6 +20,12 @@ export interface ForceUpdateDialogProps {
     updateLabel?: string;
     /** Custom label for the dismiss action. Hidden when `mandatory`. */
     laterLabel?: string;
+    /** Forwarded to the underlying Dialog container. */
+    containerStyle?: StyleProp<ViewStyle>;
+    /** Forwarded to the underlying Dialog title Text. */
+    titleStyle?: StyleProp<TextStyle>;
+    /** Forwarded to the underlying Dialog message Text. */
+    messageStyle?: StyleProp<TextStyle>;
 }
 /**
  * Drop-in update prompt that opens the App Store / Play Store on tap.

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

@@ -19,6 +19,13 @@ export interface FormFieldProps {
     helperStyle?: StyleProp<TextStyle>;
     errorStyle?: StyleProp<TextStyle>;
     containerStyle?: StyleProp<ViewStyle>;
+    /**
+     * Style override for the wrapper View that hosts `children` (the input slot).
+     * Useful for the `inline` layout when callers need to tweak the right-hand
+     * column (e.g., set a max width, align differently). Additive only — the
+     * library's base style still applies underneath.
+     */
+    inputContainerStyle?: StyleProp<ViewStyle>;
     accessibilityLabel?: string;
     testID?: string;
 }

package/lib/typescript/commonjs/components/ImageGallery/ImageGallery.d.ts

@@ -32,16 +32,18 @@ export interface ImageGalleryProps {
     enablePinchZoom?: boolean;
     onIndexChange?: (idx: number) => void;
     /**
-     * When true, renders the component as a skeleton placeholder via SkeletonContent's auto walker.
-     * Component still renders its normal layout — the walker replaces Text/Image/sized View leaves
-     * with shimmer blocks. Use this when the data driving the component is still being fetched.
+     * When true, renders the component as its authored skeleton placeholder shape.
+     * The placeholder mirrors the real layout's footprint so the UI doesn't reflow
+     * when data arrives. Use this while the data driving the component is being fetched.
      */
     loading?: boolean;
     accessibilityLabel?: string;
     containerStyle?: StyleProp<ViewStyle>;
     testID?: string;
 }
-declare const ImageGallery: React.FC<ImageGalleryProps>;
+declare const ImageGallery: React.FC<ImageGalleryProps> & {
+    Skeleton: React.FC<ImageGalleryProps>;
+};
 export { ImageGallery };
 export default ImageGallery;
 //# sourceMappingURL=ImageGallery.d.ts.map

package/lib/typescript/commonjs/components/Input/Input.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { TextInput } from 'react-native';
 import type { BlurEvent, FocusEvent, StyleProp, TextInputProps, TextStyle, ViewStyle } from 'react-native';
 export type InputSize = 'sm' | 'md' | 'lg';
-export type InputVariant = 'outlined' | 'filled';
+export type InputVariant = 'outlined' | 'filled' | 'underline';
 export type InputLabelMode = 'float' | 'top';
 export interface InputProps extends Omit<TextInputProps, 'style'> {
     label?: string;
@@ -43,8 +43,14 @@ export interface InputProps extends Omit<TextInputProps, 'style'> {
      */
     parse?: (formatted: string) => string;
     style?: StyleProp<ViewStyle>;
+    /** Style applied to the bordered field wrapper (the bit you'd colour or pad). Distinct from `style`, which targets the outermost container. */
+    containerStyle?: StyleProp<ViewStyle>;
     inputStyle?: StyleProp<TextStyle>;
     labelStyle?: StyleProp<TextStyle>;
+    /** Style applied to the helper/error text below the field. */
+    messageStyle?: StyleProp<TextStyle>;
+    /** Per-instance override for the field's corner radius. Wins over `theme.components.input.borderRadius` and size defaults. */
+    borderRadius?: number;
     onFocus?: (e: FocusEvent) => void;
     onBlur?: (e: BlurEvent) => void;
     accessibilityLabel?: string;

package/lib/typescript/commonjs/components/ListItem/ListItem.d.ts

@@ -1,14 +1,13 @@
 import React from 'react';
-import { View } from 'react-native';
-import type { GestureResponderEvent, StyleProp, ViewStyle } from 'react-native';
+import type { GestureResponderEvent, StyleProp, TextStyle, View as RNView, ViewStyle } from 'react-native';
 import type { SwipeableAction } from '../Swipeable';
 export type ListItemSize = 'sm' | 'md' | 'lg';
 export interface ListItemProps {
     title: string;
     /**
-     * When true, renders the component as a skeleton placeholder via SkeletonContent's auto walker.
-     * Component still renders its normal layout — the walker replaces Text/Image/sized View leaves
-     * with shimmer blocks. Use this when the data driving the component is still being fetched.
+     * When true, renders the component as its authored skeleton placeholder shape.
+     * The placeholder mirrors the real layout's footprint so the UI doesn't reflow
+     * when data arrives. Use this while the data driving the component is being fetched.
      */
     loading?: boolean;
     subtitle?: string;
@@ -28,9 +27,17 @@ export interface ListItemProps {
     accessibilityLabel?: string;
     accessibilityHint?: string;
     style?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
+    titleStyle?: StyleProp<TextStyle>;
+    subtitleStyle?: StyleProp<TextStyle>;
+    descriptionStyle?: StyleProp<TextStyle>;
+    leftSlotStyle?: StyleProp<ViewStyle>;
+    rightSlotStyle?: StyleProp<ViewStyle>;
     testID?: string;
 }
-declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<View>>;
+declare const ListItem: React.ForwardRefExoticComponent<ListItemProps & React.RefAttributes<RNView>> & {
+    Skeleton: React.FC<ListItemProps>;
+};
 export { ListItem };
 export default ListItem;
 //# sourceMappingURL=ListItem.d.ts.map

package/lib/typescript/commonjs/components/NumberInput/NumberInput.d.ts

@@ -24,7 +24,10 @@ export interface NumberInputProps {
     unit?: string;
     accessibilityLabel?: string;
     style?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
     inputStyle?: StyleProp<TextStyle>;
+    buttonStyle?: StyleProp<ViewStyle>;
+    unitStyle?: StyleProp<TextStyle>;
     labelStyle?: StyleProp<TextStyle>;
     textInputProps?: Omit<TextInputProps, 'value' | 'onChangeText' | 'onBlur' | 'keyboardType' | 'editable'>;
     testID?: string;

package/lib/typescript/commonjs/components/PickerTrigger/PickerTrigger.d.ts

@@ -0,0 +1,57 @@
+/**
+ * PickerTrigger — the tappable input field that opens a modal picker.
+ *
+ * Standalone read-only field built on FieldBase, used by DatePicker,
+ * TimePicker and DateRangePicker (and any consumer-built picker) to render
+ * the closed-state row that matches Input / Select pixel-for-pixel.
+ *
+ * The component is purely visual + interactive — it does not own picker
+ * state. Consumers either:
+ *   - Use the built-in trigger mode on a picker, which composes this
+ *     internally and manages its own open/close.
+ *   - Render PickerTrigger themselves alongside a controlled picker.
+ */
+import React from 'react';
+import { View } from 'react-native';
+import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
+import type { FieldBaseSize, FieldBaseVariant } from '../FieldBase';
+export type PickerTriggerSize = FieldBaseSize;
+export type PickerTriggerVariant = FieldBaseVariant;
+export interface PickerTriggerProps {
+    /** The currently selected value rendered as the trigger's primary text. */
+    value?: string;
+    /** Shown when `value` is empty. Falls back to "Select…". */
+    placeholder?: string;
+    /** Static label rendered above the field. */
+    label?: string;
+    /** Helper text shown below the field. Hidden when `error` is set. */
+    helperText?: string;
+    /** Error message shown below the field (and red-borders the field). */
+    error?: string;
+    /** Adds a red asterisk after the label. */
+    required?: boolean;
+    /** Tap handler — typically opens the modal picker. */
+    onPress: () => void;
+    /** Render a clear (×) affordance when `value` is non-empty. */
+    clearable?: boolean;
+    /** Called when the clear affordance is pressed. */
+    onClear?: () => void;
+    /** Leading icon slot (e.g. calendar / clock). */
+    leadingIcon?: React.ReactNode;
+    /** Trailing slot — defaults to a chevron when unset. Pass `null` to suppress. */
+    trailing?: React.ReactNode;
+    disabled?: boolean;
+    size?: PickerTriggerSize;
+    variant?: PickerTriggerVariant;
+    style?: StyleProp<ViewStyle>;
+    triggerStyle?: StyleProp<ViewStyle>;
+    valueStyle?: StyleProp<TextStyle>;
+    labelStyle?: StyleProp<TextStyle>;
+    messageStyle?: StyleProp<TextStyle>;
+    accessibilityLabel?: string;
+    testID?: string;
+}
+declare const PickerTrigger: React.ForwardRefExoticComponent<PickerTriggerProps & React.RefAttributes<View>>;
+export { PickerTrigger };
+export default PickerTrigger;
+//# sourceMappingURL=PickerTrigger.d.ts.map

package/lib/typescript/commonjs/components/PickerTrigger/index.d.ts

@@ -0,0 +1,3 @@
+export { PickerTrigger, default } from './PickerTrigger';
+export type { PickerTriggerProps, PickerTriggerSize, PickerTriggerVariant } from './PickerTrigger';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/commonjs/components/ProgressBar/ProgressBar.d.ts

@@ -12,6 +12,8 @@ export interface ProgressBarProps {
     barColor?: string;
     animated?: boolean;
     style?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
+    barStyle?: StyleProp<ViewStyle>;
     accessibilityLabel?: string;
     testID?: string;
 }

package/lib/typescript/commonjs/components/Radio/Radio.d.ts

@@ -23,7 +23,10 @@ export interface RadioProps extends Omit<PressableProps, 'style' | 'children' |
     accessibilityLabel?: string;
     haptic?: HapticType | false;
     style?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
     circleStyle?: StyleProp<ViewStyle>;
+    dotStyle?: StyleProp<ViewStyle>;
+    labelStyle?: StyleProp<ViewStyle>;
     testID?: string;
 }
 declare const Radio: React.ForwardRefExoticComponent<RadioProps & React.RefAttributes<View>>;

package/lib/typescript/commonjs/components/Rating/Rating.d.ts

@@ -1,6 +1,5 @@
 import React from 'react';
-import { View } from 'react-native';
-import type { StyleProp, ViewStyle } from 'react-native';
+import type { StyleProp, View as RNView, ViewStyle } from 'react-native';
 export type RatingTone = 'primary' | 'warning';
 export type RatingSize = 'sm' | 'md' | 'lg' | number;
 export interface RatingProps {
@@ -13,16 +12,20 @@ export interface RatingProps {
     tone?: RatingTone;
     label?: string;
     /**
-     * When true, renders the component as a skeleton placeholder via SkeletonContent's auto walker.
-     * Component still renders its normal layout — the walker replaces Text/Image/sized View leaves
-     * with shimmer blocks. Use this when the data driving the component is still being fetched.
+     * When true, renders the component as its authored skeleton placeholder shape.
+     * The placeholder mirrors the real layout's footprint so the UI doesn't reflow
+     * when data arrives. Use this while the data driving the component is being fetched.
      */
     loading?: boolean;
     accessibilityLabel?: string;
     style?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
+    starContainerStyle?: StyleProp<ViewStyle>;
     testID?: string;
 }
-declare const Rating: React.ForwardRefExoticComponent<RatingProps & React.RefAttributes<View>>;
+declare const Rating: React.ForwardRefExoticComponent<RatingProps & React.RefAttributes<RNView>> & {
+    Skeleton: React.FC<RatingProps>;
+};
 export { Rating };
 export default Rating;
 //# sourceMappingURL=Rating.d.ts.map

package/lib/typescript/commonjs/components/SegmentedControl/SegmentedControl.d.ts

@@ -26,8 +26,11 @@ export interface SegmentedControlProps {
     tone?: SegmentedControlTone;
     accessibilityLabel?: string;
     style?: StyleProp<ViewStyle>;
+    containerStyle?: StyleProp<ViewStyle>;
     segmentStyle?: StyleProp<ViewStyle>;
+    selectedIndicatorStyle?: StyleProp<ViewStyle>;
     textStyle?: StyleProp<TextStyle>;
+    labelStyle?: StyleProp<TextStyle>;
     testID?: string;
 }
 declare const SegmentedControl: React.ForwardRefExoticComponent<SegmentedControlProps & React.RefAttributes<View>>;