@webority/mobile-ui 0.0.0-stage → 0.0.33

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

@@ -0,0 +1,69 @@
+import type { View as RNView, 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 {
+    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;
+    value: DateRange;
+    onChange?: (range: {
+        start: Date;
+        end: Date;
+    }) => 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[];
+    locale?: string;
+    weekStartsOn?: WeekStart;
+    title?: string;
+    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>;
+    /** 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: import("react").ForwardRefExoticComponent<DateRangePickerProps & import("react").RefAttributes<RNView>>;
+export { DateRangePicker };
+export default DateRangePicker;
+//# sourceMappingURL=DateRangePicker.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { DateRange, DateRangePickerProps, WeekStart } from './DateRangePicker';
+export { DateRangePicker, default } from './DateRangePicker';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,30 @@
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+export type DescriptionsSize = 'sm' | 'md';
+export interface DescriptionItem {
+    label: string;
+    /** A string renders as text; a node renders as-is. Empty renders as an em-dash. */
+    value?: React.ReactNode;
+    /** Make this row span both columns. Ignored when `columns` is 1. */
+    full?: boolean;
+    key?: string;
+}
+export interface DescriptionsProps {
+    items: ReadonlyArray<DescriptionItem>;
+    /** 1 stacks label above value; 2 puts them side by side. Default 1 — phone widths are narrow. */
+    columns?: 1 | 2;
+    size?: DescriptionsSize;
+    /** Hairlines between rows. */
+    bordered?: boolean;
+    title?: string;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * A labelled key-value list for record detail — the "what are this thing's
+ * fields" view that every detail screen needs and that ListItem (a tappable row
+ * with a title) is the wrong shape for.
+ */
+export declare const Descriptions: React.FC<DescriptionsProps>;
+export default Descriptions;
+//# sourceMappingURL=Descriptions.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { DescriptionItem, DescriptionsProps, DescriptionsSize } from './Descriptions';
+export { Descriptions, default } from './Descriptions';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,45 @@
+import React from 'react';
+import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
+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;
+    tone?: DialogActionTone;
+    loading?: boolean;
+}
+export interface DialogProps {
+    visible: boolean;
+    onClose: () => void;
+    title?: string;
+    message?: string | React.ReactNode;
+    icon?: React.ReactNode;
+    variant?: DialogVariant;
+    actions?: DialogAction[];
+    dismissOnAction?: boolean;
+    accessibilityLabel?: string;
+    /** Style applied to the underlying Modal sheet (consumer may override radius, padding, etc.). */
+    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>;
+    /** 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>;
+export { Dialog };
+export default Dialog;
+//# sourceMappingURL=Dialog.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { DialogAction, DialogActionTone, DialogProps, DialogVariant } from './Dialog';
+export { Dialog, default } from './Dialog';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,19 @@
+import type { View as RNView, StyleProp, ViewStyle } from 'react-native';
+export type DividerOrientation = 'horizontal' | 'vertical';
+export type DividerSpacing = 'none' | 'sm' | 'md' | 'lg';
+export type DividerLabelPosition = 'start' | 'center' | 'end';
+export interface DividerProps {
+    orientation?: DividerOrientation;
+    thickness?: number;
+    color?: string;
+    spacing?: DividerSpacing;
+    inset?: number;
+    label?: string;
+    labelPosition?: DividerLabelPosition;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+declare const Divider: import("react").ForwardRefExoticComponent<DividerProps & import("react").RefAttributes<RNView>>;
+export { Divider };
+export default Divider;
+//# sourceMappingURL=Divider.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { DividerLabelPosition, DividerOrientation, DividerProps, DividerSpacing } from './Divider';
+export { Divider, default } from './Divider';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,56 @@
+/**
+ * Drawer — slide-in side drawer (left / right / top / bottom).
+ *
+ * Built on Reanimated 3 + Gesture Handler 2 — gestures and animations run on the
+ * UI thread for buttery 60/120fps motion. Mirrors the BottomSheet ergonomics:
+ * imperative ref API, controlled/uncontrolled visibility, swipe-to-dismiss,
+ * tap-backdrop-to-dismiss, full a11y (modal dialog).
+ *
+ * USAGE:
+ *
+ * const ref = useRef<DrawerRef>(null);
+ * <Drawer ref={ref} side="left" width={300}>
+ *   <YourMenu />
+ * </Drawer>
+ *
+ * ref.current?.open();
+ * ref.current?.close();
+ * ref.current?.toggle();
+ */
+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. */
+    visible?: boolean;
+    /** Initial visibility for uncontrolled usage. */
+    defaultVisible?: boolean;
+    /** Fired whenever the drawer transitions open/closed. */
+    onChange?: (visible: boolean) => void;
+    /** Edge the drawer slides in from. */
+    side?: DrawerSide;
+    /** Drawer dimension along the slide axis (width for left/right, height for top/bottom). */
+    width?: number | `${number}%`;
+    /** Allow drag-to-dismiss in the natural close direction. */
+    enableSwipe?: boolean;
+    /** Allow tapping the backdrop to dismiss. */
+    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;
+    testID?: string;
+}
+export interface DrawerRef {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+}
+declare const Drawer: React.ForwardRefExoticComponent<DrawerProps & React.RefAttributes<DrawerRef>>;
+export { Drawer };
+export default Drawer;
+//# sourceMappingURL=Drawer.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { DrawerProps, DrawerRef, DrawerSide } from './Drawer';
+export { Drawer, default } from './Drawer';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,24 @@
+import React from 'react';
+import type { View as RNView, StyleProp, ViewStyle } from 'react-native';
+export type EmptyStateSize = 'sm' | 'md' | 'lg';
+export interface EmptyStateAction {
+    label: string;
+    onPress: () => void;
+    accessibilityLabel?: string;
+    accessibilityHint?: string;
+    testID?: string;
+}
+export interface EmptyStateProps {
+    icon?: React.ReactNode;
+    title: string;
+    description?: string;
+    action?: EmptyStateAction;
+    secondaryAction?: EmptyStateAction;
+    size?: EmptyStateSize;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+declare const EmptyState: React.ForwardRefExoticComponent<EmptyStateProps & React.RefAttributes<RNView>>;
+export { EmptyState };
+export default EmptyState;
+//# sourceMappingURL=EmptyState.d.ts.map

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

@@ -0,0 +1,3 @@
+export type { EmptyStateAction, EmptyStateProps, EmptyStateSize } from './EmptyState';
+export { default, EmptyState } from './EmptyState';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,38 @@
+import React from 'react';
+export interface ErrorBoundaryInfo {
+    componentStack: string;
+}
+export interface ErrorBoundaryProps {
+    children: React.ReactNode;
+    /** Custom fallback. Receives the error and a reset callback. Defaults to a themed EmptyState with a retry action. */
+    fallback?: React.ReactNode | ((error: Error, reset: () => void) => React.ReactNode);
+    /** Called on every caught error, after the error is recorded to the Logger. */
+    onError?: (error: Error, info: ErrorBoundaryInfo) => void;
+    /** Changing any value in this array resets the boundary. Standard escape hatch for route changes. */
+    resetKeys?: unknown[];
+    /** Called when the boundary resets, however it was triggered. */
+    onReset?: () => void;
+    /** Title and message for the default fallback. */
+    title?: string;
+    message?: string;
+    testID?: string;
+}
+interface ErrorBoundaryState {
+    error: Error | null;
+}
+/**
+ * Catches render errors in its subtree and shows a themed fallback instead of
+ * a white screen. Mount this once near the navigation root per the fleet
+ * convention, and optionally again around any subtree that should recover
+ * independently (a single failed card should not blank the whole screen).
+ */
+export declare class ErrorBoundary extends React.Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    state: ErrorBoundaryState;
+    static getDerivedStateFromError(error: Error): ErrorBoundaryState;
+    componentDidUpdate(prevProps: ErrorBoundaryProps): void;
+    componentDidCatch(error: Error, info: ErrorBoundaryInfo): void;
+    reset: () => void;
+    render(): React.ReactNode;
+}
+export {};
+//# sourceMappingURL=ErrorBoundary.d.ts.map

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

@@ -0,0 +1,5 @@
+export type { ErrorBoundaryInfo, ErrorBoundaryProps } from './ErrorBoundary';
+export { ErrorBoundary } from './ErrorBoundary';
+export { useErrorHandler } from './useErrorHandler';
+export { withErrorBoundary } from './withErrorBoundary';
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/commonjs/components/ErrorBoundary/useErrorHandler.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Returns a stable callback for surfacing an error caught outside React's
+ * render/commit cycle (an async callback, a rejected promise, a native event
+ * handler) to the nearest ErrorBoundary. React only catches synchronous
+ * render errors on its own; re-throwing during a state update is the
+ * documented way to route an async error into that same path.
+ */
+export declare const useErrorHandler: () => ((error: unknown) => void);
+//# sourceMappingURL=useErrorHandler.d.ts.map

package/lib/typescript/commonjs/components/ErrorBoundary/withErrorBoundary.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { ErrorBoundaryProps } from './ErrorBoundary';
+/**
+ * Wraps a component in an `ErrorBoundary`. Prefer this over hand-wrapping a
+ * screen at every call site when the same fallback/reset behaviour applies
+ * everywhere that component is rendered.
+ */
+export declare const withErrorBoundary: <P extends object>(Component: React.ComponentType<P>, boundaryProps?: Omit<ErrorBoundaryProps, "children">) => React.ComponentType<P>;
+//# sourceMappingURL=withErrorBoundary.d.ts.map

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

@@ -0,0 +1,22 @@
+/**
+ * Chevron — the shared dropdown indicator for the field family.
+ *
+ * One glyph for Select, InlineSelect, PickerTrigger and PhoneNumberInput so
+ * the indicator never drifts between trigger components. It is the design
+ * system's line chevron (AppIcon `chevron-down`), reached through the icon
+ * registry so an app can swap it with `theme.icons.chevronDown`; it used to
+ * be a filled triangle drawn with view borders. Pass `open` to get the 180°
+ * rotate-on-open animation; omit it for a static chevron.
+ */
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+export interface ChevronProps {
+    color: string;
+    size: number;
+    /** When provided, the chevron animates between 0° (closed) and 180° (open). */
+    open?: boolean;
+    style?: StyleProp<ViewStyle>;
+}
+export declare const Chevron: React.FC<ChevronProps>;
+export default Chevron;
+//# sourceMappingURL=Chevron.d.ts.map

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

@@ -0,0 +1,275 @@
+/**
+ * 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 { Animated } from 'react-native';
+import type { FieldSide, FieldVariantTokens, ResolvedFieldSizeTokens, 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;
+    /**
+     * Draw the spec's hairline rule between the leading slot and the content
+     * (icon | text). Only Input's leading icon wants it; SearchBar's magnifier,
+     * Select's prefix and the pickers leave it off. No-op without `leading`.
+     */
+    leadingDivider?: boolean;
+    /** Slot to the right of `children`. Rendered inside the padded row. */
+    trailing?: React.ReactNode;
+    /**
+     * Where the slots (and the divider) sit against the content. `'center'`
+     * (default) for a single-line field. `'top'` for a multi-line one, so the
+     * icon stays level with the first line however tall the box grows; pass
+     * `slotLineHeight` (the content's first-line height) so the icon is centred
+     * on that line rather than pinned to the padding edge.
+     */
+    slotAlign?: 'center' | 'top';
+    /** First-line height of the content, used only with `slotAlign="top"`. */
+    slotLineHeight?: number;
+    /**
+     * Cut a gap in the top border, in the box's outer coordinates: a floated
+     * outlined label sits in it so the rule never runs behind the text and the
+     * label needs no masking background. `width` may be animated so the gap
+     * opens as the label rises. Ignored when the top border has no width.
+     */
+    topNotch?: {
+        left: number;
+        width: number | Animated.AnimatedInterpolation<number>;
+    };
+    /** 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;
+    /**
+     * Whether a press reads as pressing a button: the pressed fill and the
+     * `button` role. Default `true`, the trigger fields (Select, PickerTrigger).
+     * `false` for a field that hosts a TextInput and uses `onPress` only to
+     * focus it: a tap on the padding or an icon then reaches the input the
+     * same as a tap on its text, with no flash and no extra accessible node.
+     * The accessibility props stay on the box, so the hosted input remains the
+     * element a screen reader lands on.
+     */
+    pressFeedback?: boolean;
+    /** 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 left padding. Wins over `paddingHorizontal`. */
+    paddingLeft?: number;
+    /** Override right padding. Wins over `paddingHorizontal`. */
+    paddingRight?: 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.md` (the spec's 12px). */
+    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}`
+ * first, then the field palette (`theme.colors.field`); brand fonts wired via
+ * `typography.fontFamily` apply via the shared `fontFor` helper.
+ */
+export declare const resolveFieldTextStyle: (theme: Theme, options?: FieldTextStyleResolverOptions) => FieldTextStyle;
+/**
+ * The required-field marker appended to a field's label. Single source of
+ * truth for the whole field family (Input, Select, FormField, PickerTrigger →
+ * Date/Time/DateRange pickers). Themeable via
+ * `theme.components.field.{requiredMarker,requiredMarkerColor}`; font family /
+ * weight / size are inherited from the parent label `<Text>`.
+ */
+export declare const RequiredMark: React.FC;
+/**
+ * The placeholder of a required field that has no static label, drawn by the
+ * field itself with the required marker after it ("Enter your email *"). It
+ * is laid over the empty TextInput, whose own placeholder the field
+ * suppresses, in the same type as the input text, and the field removes it
+ * the moment it has a value: the star belongs to the hint, so it leaves with
+ * the hint rather than standing beside what the user typed. Inert to touch.
+ */
+export declare const RequiredPlaceholder: React.FC<{
+    text: string;
+    color: string;
+    fontSize: number;
+    weightStyle: TextStyle;
+    /** `'top'` for a multi-line field, whose text starts at the top of the box. */
+    align?: 'center' | 'top';
+    /** Vertical offset for the `'top'` case (the input's own optical nudge). */
+    paddingTop?: number;
+    textAlign?: TextStyle['textAlign'];
+}>;
+/**
+ * The circled-exclamation glyph that leads a field's error message. Uses the
+ * theme's `icons.error` renderer when one is registered; otherwise draws a
+ * ring-and-bang from views so the message never renders bare. Shared by
+ * every field component that shows an error line (Input, Select, FormField,
+ * the pickers) so the message row reads identically across the family.
+ */
+export declare const FieldErrorGlyph: React.FC<{
+    size: number;
+    color: string;
+}>;
+/**
+ * The static label above a field, per the design spec: `field.label` ink,
+ * the size ladder's `labelFontSize`, semibold, `labelGap` below. It stays on
+ * that ink through focus and error (the ring and the message row carry the
+ * error). Shared by Select, PickerTrigger, NumberInput; Input renders the
+ * same styling inline because it also owns the floating-label variant.
+ */
+export declare const FieldLabel: React.FC<{
+    children: React.ReactNode;
+    size?: FieldBaseSize;
+    required?: boolean;
+    style?: StyleProp<TextStyle>;
+}>;
+/**
+ * The helper / error line under a field: `messageFontSize`, `messageGap`
+ * from the box, `field.message` red with the circled-exclamation glyph when
+ * `error`, `text.secondary` otherwise. Renders nothing without text.
+ */
+export declare const FieldMessage: React.FC<{
+    text?: string;
+    error?: boolean;
+    size?: FieldBaseSize;
+    style?: StyleProp<TextStyle>;
+}>;
+/**
+ * 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) => ResolvedFieldSizeTokens;
+/**
+ * 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,5 @@
+export type { FieldBaseProps, FieldBaseSize, FieldBaseVariant, FieldTextStyle, FieldTextStyleResolverOptions } from './FieldBase';
+export { default, FieldBase, FieldErrorGlyph, FieldLabel, FieldMessage, RequiredMark, RequiredPlaceholder, resolveFieldSize, resolveFieldTextStyle } from './FieldBase';
+export type { UseFloatingLabelOptions, UseFloatingLabelResult } from './useFloatingLabel';
+export { FLOATED_LABEL_SCALE, useFloatingLabel } from './useFloatingLabel';
+//# sourceMappingURL=index.d.ts.map