@webority-technologies/mobile 0.0.7 → 0.0.9

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

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { GradientDefinition } from './types';
+export interface GradientProps {
+    gradient: GradientDefinition;
+    style?: StyleProp<ViewStyle>;
+    children?: React.ReactNode;
+}
+export declare const Gradient: React.FC<GradientProps>;
+export declare const isGradientAvailable: () => boolean;
+//# sourceMappingURL=Gradient.d.ts.map

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

@@ -0,0 +1,21 @@
+import { Animated } from 'react-native';
+/**
+ * Create an `Animated.Value` that survives RN 0.85's dev-mode prop deepFreeze.
+ *
+ * RN's Fabric renderer deep-freezes prop trees on host components. If an
+ * `Animated.Value` is reachable from a `style` prop via interpolation chains
+ * (the `_parent` ref on `AnimatedInterpolation` nodes), the recursive freeze
+ * converts the value's `_animation` slot into a throwing setter — the next
+ * `Animated.timing(v).start()` then crashes with
+ *   "_animation: object that is meant to be immutable".
+ *
+ * Sealing the value at construction makes `Object.isSealed(v) === true`,
+ * which causes `deepFreezeAndThrowOnMutationInDev` to skip-and-return at
+ * its top guard. Existing-property mutation (`_animation`, `_value`,
+ * `_listeners`, `_tracking`) keeps working — seal only blocks adding NEW
+ * properties, and `Animated.Value` doesn't add any post-construction.
+ *
+ * Use everywhere the library would otherwise call `new Animated.Value(...)`.
+ */
+export declare const createAnimatedValue: (initial: number, config?: ConstructorParameters<typeof Animated.Value>[1]) => Animated.Value;
+//# sourceMappingURL=animatedValue.d.ts.map

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

@@ -9,5 +9,10 @@ export { ThemeProvider, useTheme, useThemeMode } from './ThemeContext';
 export type { ThemeProviderProps, ColorSchemePreference } from './ThemeContext';
 export { lightTheme, darkTheme } from './tokens';
 export { mergeTheme } from './merge';
-export type { ColorMode, ColorPalette, RadiusScale, ShadowDefinition, ShadowScale, SpacingScale, Theme, ThemeOverrides, TypographyScale, MotionScale, DeepPartial } from './types';
+export { fontFor } from './textStyle';
+export type { FontWeightKey } from './textStyle';
+export { createAnimatedValue } from './animatedValue';
+export { Gradient, isGradientAvailable } from './Gradient';
+export type { GradientProps } from './Gradient';
+export type { ColorMode, ColorPalette, GradientDefinition, GradientScale, RadiusScale, ShadowDefinition, ShadowScale, SpacingScale, Theme, ThemeOverrides, TypographyScale, MotionScale, DeepPartial } from './types';
 //# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1,18 @@
+import type { TextStyle } from 'react-native';
+import type { Theme, TypographyScale } from './types';
+export type FontWeightKey = keyof TypographyScale['fontWeight'];
+/**
+ * Resolve text-weight style for the active theme.
+ *
+ * When the consumer registers a brand `theme.typography.fontFamily.<weight>`,
+ * we set `fontFamily` and leave `fontWeight` undefined — RN can't combine the
+ * two reliably across iOS/Android once a custom face is in play, so the brand
+ * file controls the weight glyph itself. Falls back to `fontWeight` when no
+ * brand font is registered for that weight.
+ *
+ * Note: the fontWeight scale uses `normal` while FontFamilyScale uses
+ * `regular` (the conventional font-name suffix). The helper maps between
+ * them transparently.
+ */
+export declare const fontFor: (theme: Theme, weight: FontWeightKey) => Pick<TextStyle, "fontFamily" | "fontWeight">;
+//# sourceMappingURL=textStyle.d.ts.map

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

@@ -1,5 +1,32 @@
 import type { TextStyle, ViewStyle } from 'react-native';
 export type ColorMode = 'light' | 'dark';
+/**
+ * A linear gradient definition used by Button, Card and consumer components.
+ * `colors` must have at least 2 entries. `start`/`end` follow the
+ * react-native-linear-gradient convention: { x: 0..1, y: 0..1 }.
+ */
+export interface GradientDefinition {
+    colors: string[];
+    locations?: number[];
+    start?: {
+        x: number;
+        y: number;
+    };
+    end?: {
+        x: number;
+        y: number;
+    };
+}
+export interface GradientScale {
+    /** Brand-primary gradient — used by `Button gradient` and `Card gradient="primary"`. */
+    primary?: GradientDefinition;
+    /** Secondary brand gradient. */
+    secondary?: GradientDefinition;
+    /** Backdrop / banner gradient (for hero sections). */
+    surface?: GradientDefinition;
+    /** Free-form named gradients. Consumer extends as needed. */
+    [key: string]: GradientDefinition | undefined;
+}
 export interface ColorPalette {
     primary: string;
     primaryHover: string;
@@ -44,6 +71,13 @@ export interface ColorPalette {
         highlight: string;
     };
 }
+export interface FontFamilyScale {
+    /** Font family for normal-weight text. Falls back to platform system font when undefined. */
+    regular?: string;
+    medium?: string;
+    semibold?: string;
+    bold?: string;
+}
 export interface TypographyScale {
     fontSize: {
         xs: number;
@@ -61,6 +95,13 @@ export interface TypographyScale {
         semibold: TextStyle['fontWeight'];
         bold: TextStyle['fontWeight'];
     };
+    /**
+     * Optional brand font families. When set, library text components prefer
+     * `fontFamily.<weight>` over `fontWeight.<weight>` to match the consumer
+     * app's typeface. Each key is independently optional — leave undefined to
+     * fall back to the system font for that weight.
+     */
+    fontFamily?: FontFamilyScale;
     lineHeight: {
         tight: number;
         normal: number;
@@ -145,6 +186,135 @@ export interface MotionScale {
         };
     };
 }
+/**
+ * Per-component size tokens. Each component that exposes a `size` prop
+ * resolves dimensions via `theme.components.<name>[size]`. Library ships
+ * sensible defaults; consumer overrides win via `mergeTheme`.
+ *
+ * Keep entries here as components gain themable per-size dimensions —
+ * this is the single home for "X is X tall, has Y radius, uses Z font size".
+ */
+export type ComponentSizeKey = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export interface ButtonSizeTokens {
+    paddingHorizontal: number;
+    paddingVertical: number;
+    minHeight: number;
+    fontSize: number;
+    borderRadius: number;
+}
+export interface InputSizeTokens {
+    paddingHorizontal: number;
+    paddingVertical: number;
+    minHeight: number;
+    multilineMinHeight: number;
+    fontSize: number;
+    borderRadius: number;
+    iconSize: number;
+}
+export interface SearchBarSizeTokens {
+    height: number;
+    paddingHorizontal: number;
+    fontSize: number;
+    iconSize: number;
+    gap: number;
+}
+export interface EmptyStateSizeTokens {
+    iconSize: number;
+    /** Resolves against the active theme's typography.fontSize scale, e.g. "lg", "xl", "2xl". */
+    titleFontSize: keyof TypographyScale['fontSize'];
+    descriptionFontSize: keyof TypographyScale['fontSize'];
+    /** Resolves against the active theme's spacing scale. */
+    paddingVertical: keyof SpacingScale;
+}
+export interface ListItemSizeTokens {
+    /** Resolves against the active theme's spacing scale. */
+    paddingVertical: keyof SpacingScale;
+    titleFontSize: keyof TypographyScale['fontSize'];
+    subtitleFontSize: keyof TypographyScale['fontSize'];
+    minHeight: number;
+}
+export interface BadgeSizeTokens {
+    fontSize: number;
+    minWidth: number;
+    height: number;
+    paddingHorizontal: number;
+    dotSize: number;
+}
+export interface ChipSizeTokens {
+    paddingHorizontal: number;
+    paddingVertical: number;
+    fontSize: number;
+    minHeight: number;
+    closeSize: number;
+    closeFontSize: number;
+    gap: number;
+}
+export interface SwitchSizeTokens {
+    trackWidth: number;
+    trackHeight: number;
+    thumbSize: number;
+    padding: number;
+}
+export interface OTPInputSizeTokens {
+    cell: number;
+    fontSize: number;
+    borderRadius: number;
+    gap: number;
+}
+export interface DialogTokens {
+    iconWrapperSize: number;
+    iconWrapperBorderRadius: number;
+    actionButtonMinHeight: number;
+}
+export interface ToastTokens {
+    iconCircleSize: number;
+    iconCircleBorderRadius: number;
+    iconGlyphFontSize: number;
+    tintBarWidth: number;
+}
+export interface FormFieldTokens {
+    /** Width of the inline label column when `layout="inline"`. Accepts CSS-like string ("35%") or number. */
+    inlineLabelWidth: number | `${number}%`;
+}
+export interface BadgeTokens extends Partial<Record<'sm' | 'md', BadgeSizeTokens>> {
+    borderWidth?: number;
+    anchorOffset?: number;
+}
+export interface CheckboxSizeTokens {
+    boxSize: number;
+}
+export interface CheckboxTokens extends Partial<Record<ComponentSizeKey, CheckboxSizeTokens>> {
+    borderWidth?: number;
+    labelGap?: number;
+}
+export interface RadioSizeTokens {
+    outer: number;
+    inner: number;
+}
+export interface RadioTokens extends Partial<Record<ComponentSizeKey, RadioSizeTokens>> {
+    borderWidth?: number;
+    labelGap?: number;
+}
+export interface ComponentTokens {
+    button?: Partial<Record<ComponentSizeKey, ButtonSizeTokens>>;
+    input?: Partial<Record<ComponentSizeKey, InputSizeTokens>>;
+    searchBar?: Partial<Record<ComponentSizeKey, SearchBarSizeTokens>> & {
+        cancelButtonWidth?: number;
+    };
+    emptyState?: Partial<Record<ComponentSizeKey, EmptyStateSizeTokens>>;
+    listItem?: Partial<Record<ComponentSizeKey, ListItemSizeTokens>>;
+    badge?: BadgeTokens;
+    chip?: Partial<Record<ComponentSizeKey, ChipSizeTokens>>;
+    checkbox?: CheckboxTokens;
+    radio?: RadioTokens;
+    switch?: Partial<Record<ComponentSizeKey, SwitchSizeTokens>> & {
+        thumbColor?: string;
+    };
+    otpInput?: Partial<Record<ComponentSizeKey, OTPInputSizeTokens>>;
+    dialog?: DialogTokens;
+    toast?: ToastTokens;
+    formField?: FormFieldTokens;
+}
 export interface Theme {
     mode: ColorMode;
     colors: ColorPalette;
@@ -153,6 +323,14 @@ export interface Theme {
     radius: RadiusScale;
     shadows: ShadowScale;
     motion: MotionScale;
+    components: ComponentTokens;
+    /**
+     * Optional brand gradient palette. Empty by default — consumers register
+     * their own via theme overrides. Components that accept gradient inputs
+     * (Button, Card) read from here when consumers pass a string token, OR
+     * accept a `GradientDefinition` literal directly.
+     */
+    gradients: GradientScale;
 }
 export type DeepPartial<T> = T extends object ? {
     [K in keyof T]?: DeepPartial<T[K]>;

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

@@ -19,6 +19,7 @@
 import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 export type SnapPoint = number | `${number}%`;
+export type KeyboardBehavior = 'none' | 'shift';
 export interface BottomSheetProps {
     snapPoints: SnapPoint[];
     index?: number;
@@ -27,6 +28,15 @@ export interface BottomSheetProps {
     enablePanDownToClose?: boolean;
     enableBackdropPress?: boolean;
     backdropOpacity?: number;
+    /**
+     * How the sheet reacts to the soft keyboard.
+     * - `'none'` (default): the sheet stays put; keyboard may overlap content.
+     * - `'shift'`: animate the sheet upward by the keyboard height while it's
+     *   visible (clamped so the sheet never extends past the top of the screen)
+     *   and animate back when dismissed. Best for forms that live inside the
+     *   sheet itself.
+     */
+    keyboardBehavior?: KeyboardBehavior;
     handleIndicatorStyle?: StyleProp<ViewStyle>;
     containerStyle?: StyleProp<ViewStyle>;
     children?: React.ReactNode;

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import type { PressableProps, StyleProp, TextStyle, ViewStyle } from 'react-native';
+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';
@@ -23,6 +24,13 @@ export interface ButtonProps extends Omit<PressableProps, 'style' | 'children'>
     rightIcon?: React.ReactNode;
     haptic?: HapticType | false;
     rounded?: boolean;
+    /**
+     * Optional gradient background. Pass either a key from `theme.gradients`
+     * (e.g. `"primary"`) or a `GradientDefinition` literal. Requires
+     * `react-native-linear-gradient` to be installed; without it the button
+     * falls back to flat colour with a dev warning.
+     */
+    gradient?: string | GradientDefinition;
     style?: StyleProp<ViewStyle>;
     textStyle?: StyleProp<TextStyle>;
     pressAnimation?: boolean;

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

@@ -1,6 +1,7 @@
 import React from 'react';
 import { View } from 'react-native';
 import type { GestureResponderEvent, ImageSourcePropType, PressableProps, StyleProp, ViewStyle } from 'react-native';
+import type { GradientDefinition } from '../../theme/types';
 export type CardVariant = 'elevated' | 'outlined' | 'filled';
 export type CardElevation = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
 export type CardRadius = 'sm' | 'md' | 'lg' | 'xl' | '2xl';
@@ -24,6 +25,13 @@ export interface CardProps extends Omit<PressableProps, 'style' | 'children'> {
      * with shimmer blocks. Use this when the data driving the component is still being fetched.
      */
     loading?: boolean;
+    /**
+     * Optional gradient background. Pass a key from `theme.gradients` or a
+     * literal `GradientDefinition`. Layered behind the card's content so
+     * existing variant/elevation/radius continue to work. Requires
+     * `react-native-linear-gradient` to be installed.
+     */
+    gradient?: string | GradientDefinition;
     onPress?: (event: GestureResponderEvent) => void;
     accessibilityLabel?: string;
     style?: StyleProp<ViewStyle>;

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
 export type DialogVariant = 'default' | 'success' | 'warning' | 'danger' | 'info';
 export type DialogActionTone = 'primary' | 'neutral' | 'danger';
 export interface DialogAction {
@@ -17,6 +18,10 @@ export interface DialogProps {
     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>;
     testID?: string;
 }
 declare const Dialog: React.FC<DialogProps>;

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

@@ -20,6 +20,18 @@ export interface InputProps extends Omit<TextInputProps, 'style'> {
     variant?: InputVariant;
     required?: boolean;
     maxLength?: number;
+    /**
+     * Format the raw `value` for display. Common uses: phone-number formatting
+     * ("5551234567" → "(555) 123-4567"), currency, postal codes, masked IDs.
+     * The TextInput shows `format(value)`; user input is passed to `parse` (or
+     * left raw) before reaching `onChangeText`.
+     */
+    format?: (raw: string) => string;
+    /**
+     * Reverse of `format` — strips the formatted display back to the canonical
+     * value the consumer wants in state. If omitted, defaults to identity.
+     */
+    parse?: (formatted: string) => string;
     style?: StyleProp<ViewStyle>;
     inputStyle?: StyleProp<TextStyle>;
     labelStyle?: StyleProp<TextStyle>;

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

@@ -13,6 +13,11 @@ export interface SwitchProps extends Omit<PressableProps, 'style' | 'children' |
     label?: string;
     accessibilityLabel?: string;
     haptic?: HapticType | false;
+    /**
+     * When true, the thumb briefly scales up on value change (1 → 1.15 → 1).
+     * Use for playful/brand-flavored switches; default off for system feel.
+     */
+    bounce?: boolean;
     style?: StyleProp<ViewStyle>;
     trackStyle?: StyleProp<ViewStyle>;
     thumbStyle?: StyleProp<ViewStyle>;

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

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { StyleProp, TextStyle, ViewStyle } from 'react-native';
 import type { HapticType } from '../../utils/hapticUtils';
 export type ToastVariant = 'default' | 'success' | 'error' | 'warning' | 'info';
 export type ToastPosition = 'top' | 'bottom';
@@ -15,6 +16,10 @@ export interface ToastOptions {
     action?: ToastAction;
     haptic?: HapticType | false;
     icon?: React.ReactNode;
+    /** Style applied to the toast container (override radius, padding, shadow per-toast). */
+    style?: StyleProp<ViewStyle>;
+    /** Style applied to the toast message Text. */
+    textStyle?: StyleProp<TextStyle>;
 }
 export interface ToastItem extends ToastOptions {
     id: string;

package/lib/typescript/module/theme/Gradient.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { GradientDefinition } from './types';
+export interface GradientProps {
+    gradient: GradientDefinition;
+    style?: StyleProp<ViewStyle>;
+    children?: React.ReactNode;
+}
+export declare const Gradient: React.FC<GradientProps>;
+export declare const isGradientAvailable: () => boolean;
+//# sourceMappingURL=Gradient.d.ts.map

package/lib/typescript/module/theme/animatedValue.d.ts

@@ -0,0 +1,21 @@
+import { Animated } from 'react-native';
+/**
+ * Create an `Animated.Value` that survives RN 0.85's dev-mode prop deepFreeze.
+ *
+ * RN's Fabric renderer deep-freezes prop trees on host components. If an
+ * `Animated.Value` is reachable from a `style` prop via interpolation chains
+ * (the `_parent` ref on `AnimatedInterpolation` nodes), the recursive freeze
+ * converts the value's `_animation` slot into a throwing setter — the next
+ * `Animated.timing(v).start()` then crashes with
+ *   "_animation: object that is meant to be immutable".
+ *
+ * Sealing the value at construction makes `Object.isSealed(v) === true`,
+ * which causes `deepFreezeAndThrowOnMutationInDev` to skip-and-return at
+ * its top guard. Existing-property mutation (`_animation`, `_value`,
+ * `_listeners`, `_tracking`) keeps working — seal only blocks adding NEW
+ * properties, and `Animated.Value` doesn't add any post-construction.
+ *
+ * Use everywhere the library would otherwise call `new Animated.Value(...)`.
+ */
+export declare const createAnimatedValue: (initial: number, config?: ConstructorParameters<typeof Animated.Value>[1]) => Animated.Value;
+//# sourceMappingURL=animatedValue.d.ts.map

package/lib/typescript/module/theme/index.d.ts

@@ -9,5 +9,10 @@ export { ThemeProvider, useTheme, useThemeMode } from './ThemeContext';
 export type { ThemeProviderProps, ColorSchemePreference } from './ThemeContext';
 export { lightTheme, darkTheme } from './tokens';
 export { mergeTheme } from './merge';
-export type { ColorMode, ColorPalette, RadiusScale, ShadowDefinition, ShadowScale, SpacingScale, Theme, ThemeOverrides, TypographyScale, MotionScale, DeepPartial } from './types';
+export { fontFor } from './textStyle';
+export type { FontWeightKey } from './textStyle';
+export { createAnimatedValue } from './animatedValue';
+export { Gradient, isGradientAvailable } from './Gradient';
+export type { GradientProps } from './Gradient';
+export type { ColorMode, ColorPalette, GradientDefinition, GradientScale, RadiusScale, ShadowDefinition, ShadowScale, SpacingScale, Theme, ThemeOverrides, TypographyScale, MotionScale, DeepPartial } from './types';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/theme/textStyle.d.ts

@@ -0,0 +1,18 @@
+import type { TextStyle } from 'react-native';
+import type { Theme, TypographyScale } from './types';
+export type FontWeightKey = keyof TypographyScale['fontWeight'];
+/**
+ * Resolve text-weight style for the active theme.
+ *
+ * When the consumer registers a brand `theme.typography.fontFamily.<weight>`,
+ * we set `fontFamily` and leave `fontWeight` undefined — RN can't combine the
+ * two reliably across iOS/Android once a custom face is in play, so the brand
+ * file controls the weight glyph itself. Falls back to `fontWeight` when no
+ * brand font is registered for that weight.
+ *
+ * Note: the fontWeight scale uses `normal` while FontFamilyScale uses
+ * `regular` (the conventional font-name suffix). The helper maps between
+ * them transparently.
+ */
+export declare const fontFor: (theme: Theme, weight: FontWeightKey) => Pick<TextStyle, "fontFamily" | "fontWeight">;
+//# sourceMappingURL=textStyle.d.ts.map