custom-mobile-ui 1.0.1

package/dist/theme.d.mts

@@ -0,0 +1,297 @@
+import { TextStyle, ViewStyle } from 'react-native';
+export { A as AppTheme, B as BaseTheme, D as DarkTheme, L as LightTheme, T as ThemeMode, a as ThemePreference, g as getTheme } from './index-tIixPl5M.mjs';
+
+declare const Colors: {
+    primary: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    primaryColor: string;
+    gray: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    white: string;
+    black: string;
+    green: {
+        500: string;
+    };
+    orange: {
+        500: string;
+    };
+    red: {
+        50: string;
+        500: string;
+    };
+    status: {
+        success: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        warning: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        error: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        info: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        pending: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        disabled: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        SUCCESS: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        WARNING: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        ERROR: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        INFO: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        PENDING: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        DISABLED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        OPEN: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        ASSIGNED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        IN_PROGRESS: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        ON_HOLD: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        RESOLVED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        CLOSED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        REJECTED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        CANCELLED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+    };
+};
+declare const AVATAR_COLORS: string[];
+
+type FontWeight = "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | "normal" | "bold" | "light" | "regular" | "medium" | "semibold" | "heavy" | "black";
+/**
+ * Maps a semantic or numeric font weight to the correct fontFamily.
+ *
+ * **Android quirk**: Android ignores `fontFamily` when `fontWeight` is anything
+ * other than `"normal"` / `undefined`.  So we always set `fontWeight: "normal"`
+ * on Android after resolving the right family file.
+ *
+ * On iOS both `fontFamily` and `fontWeight` are respected, so we keep the
+ * numeric weight for finer control (iOS can synthesise intermediate weights).
+ */
+declare const FontFamily: (style?: TextStyle & {
+    fontWeight?: FontWeight;
+}) => TextStyle;
+
+/**
+ * Centralized spacing scale.
+ * Use these tokens instead of hardcoded pixel values throughout the app.
+ *
+ * Usage: `import { Spacing } from '@/theme/spacing'`
+ *        `padding: Spacing.md`
+ */
+declare const Spacing: {
+    /** 2px — hairline gaps, icon nudges */
+    readonly xxs: 2;
+    /** 4px — tight internal padding */
+    readonly xs: 4;
+    /** 8px — compact spacing between elements */
+    readonly sm: 8;
+    /** 12px — default internal padding */
+    readonly md: 12;
+    /** 16px — section padding, card padding */
+    readonly lg: 16;
+    /** 24px — generous padding between sections */
+    readonly xl: 24;
+    /** 32px — large section gaps */
+    readonly xxl: 32;
+    /** 48px — page-level vertical spacing */
+    readonly xxxl: 48;
+};
+type SpacingKey = keyof typeof Spacing;
+
+/**
+ * Centralized typography scale.
+ * Use these tokens instead of hardcoded font sizes throughout the app.
+ *
+ * Usage: `import { FontSize, LineHeight } from '@/theme/typography'`
+ *        `fontSize: FontSize.md`
+ */
+declare const FontSize: {
+    /** 11px — small badges, captions, overlines */
+    readonly xs: 11;
+    /** 13px — labels, secondary text, button small */
+    readonly sm: 13;
+    /** 15px — body text, default input */
+    readonly md: 15;
+    /** 17px — section headings, large labels */
+    readonly lg: 17;
+    /** 20px — page sub-headings */
+    readonly xl: 20;
+    /** 24px — page headings */
+    readonly xxl: 24;
+    /** 28px — hero / display text */
+    readonly display: 28;
+};
+declare const LineHeight: {
+    /** Tight line-height for xs */
+    readonly xs: 15;
+    /** Tight line-height for sm */
+    readonly sm: 18;
+    /** Default line-height for md */
+    readonly md: 22;
+    /** Line-height for lg */
+    readonly lg: 24;
+    /** Line-height for xl */
+    readonly xl: 28;
+    /** Line-height for xxl */
+    readonly xxl: 32;
+    /** Line-height for display */
+    readonly display: 36;
+};
+type FontSizeKey = keyof typeof FontSize;
+
+/**
+ * Centralized shadow/elevation tokens.
+ * iOS uses shadow* properties, Android uses elevation.
+ *
+ * Usage: `import { Shadow } from '@/theme/shadows'`
+ *        `style={Shadow.md}`
+ */
+declare const Shadow: {
+    /** Subtle shadow — cards, inputs */
+    readonly sm: ViewStyle;
+    /** Medium shadow — dropdowns, popups */
+    readonly md: ViewStyle;
+    /** Strong shadow — modals, floating elements */
+    readonly lg: ViewStyle;
+    /** Extra strong — overlays */
+    readonly xl: ViewStyle;
+    /** No shadow */
+    readonly none: ViewStyle;
+};
+type ShadowLevel = keyof typeof Shadow;
+
+/**
+ * Centralized animation duration and easing tokens.
+ *
+ * Usage: `import { Duration } from '@/theme/animations'`
+ *        `Animated.timing(anim, { duration: Duration.normal, ... })`
+ */
+declare const Duration: {
+    /** 100ms — micro-interactions (press feedback, check toggle) */
+    readonly instant: 100;
+    /** 150ms — quick transitions (button press, icon swap) */
+    readonly fast: 150;
+    /** 250ms — default transitions (modal, popup, focus ring) */
+    readonly normal: 250;
+    /** 350ms — deliberate transitions (page slide, bottom sheet) */
+    readonly slow: 350;
+    /** 500ms — emphasis transitions (celebration, onboarding) */
+    readonly slower: 500;
+};
+type DurationKey = keyof typeof Duration;
+
+/**
+ * Centralized z-index scale for consistent layering.
+ *
+ * Usage: `import { ZIndex } from '@/theme/zindex'`
+ *        `style={{ zIndex: ZIndex.modal }}`
+ */
+declare const ZIndex: {
+    /** Base content layer */
+    readonly base: 0;
+    /** Sticky headers, FABs */
+    readonly sticky: 100;
+    /** Dropdown menus, select popups */
+    readonly dropdown: 1000;
+    /** Bottom sheets, drawers */
+    readonly drawer: 1100;
+    /** Modals, dialogs */
+    readonly modal: 2000;
+    /** Popup menus, tooltips */
+    readonly popup: 2500;
+    /** Toast notifications */
+    readonly toast: 3000;
+    /** Highest priority overlays (loading screens, critical alerts) */
+    readonly overlay: 4000;
+};
+type ZIndexKey = keyof typeof ZIndex;
+
+export { AVATAR_COLORS, Colors, Duration, type DurationKey, FontFamily, FontSize, type FontSizeKey, type FontWeight, LineHeight, Shadow, type ShadowLevel, Spacing, type SpacingKey, ZIndex, type ZIndexKey };

package/dist/theme.d.ts

@@ -0,0 +1,297 @@
+import { TextStyle, ViewStyle } from 'react-native';
+export { A as AppTheme, B as BaseTheme, D as DarkTheme, L as LightTheme, T as ThemeMode, a as ThemePreference, g as getTheme } from './index-tIixPl5M.js';
+
+declare const Colors: {
+    primary: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    primaryColor: string;
+    gray: {
+        50: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    white: string;
+    black: string;
+    green: {
+        500: string;
+    };
+    orange: {
+        500: string;
+    };
+    red: {
+        50: string;
+        500: string;
+    };
+    status: {
+        success: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        warning: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        error: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        info: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        pending: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        disabled: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        SUCCESS: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        WARNING: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        ERROR: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        INFO: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        PENDING: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        DISABLED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        OPEN: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        ASSIGNED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        IN_PROGRESS: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        ON_HOLD: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        RESOLVED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        CLOSED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        REJECTED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+        CANCELLED: {
+            light: string;
+            default: string;
+            dark: string;
+        };
+    };
+};
+declare const AVATAR_COLORS: string[];
+
+type FontWeight = "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | "normal" | "bold" | "light" | "regular" | "medium" | "semibold" | "heavy" | "black";
+/**
+ * Maps a semantic or numeric font weight to the correct fontFamily.
+ *
+ * **Android quirk**: Android ignores `fontFamily` when `fontWeight` is anything
+ * other than `"normal"` / `undefined`.  So we always set `fontWeight: "normal"`
+ * on Android after resolving the right family file.
+ *
+ * On iOS both `fontFamily` and `fontWeight` are respected, so we keep the
+ * numeric weight for finer control (iOS can synthesise intermediate weights).
+ */
+declare const FontFamily: (style?: TextStyle & {
+    fontWeight?: FontWeight;
+}) => TextStyle;
+
+/**
+ * Centralized spacing scale.
+ * Use these tokens instead of hardcoded pixel values throughout the app.
+ *
+ * Usage: `import { Spacing } from '@/theme/spacing'`
+ *        `padding: Spacing.md`
+ */
+declare const Spacing: {
+    /** 2px — hairline gaps, icon nudges */
+    readonly xxs: 2;
+    /** 4px — tight internal padding */
+    readonly xs: 4;
+    /** 8px — compact spacing between elements */
+    readonly sm: 8;
+    /** 12px — default internal padding */
+    readonly md: 12;
+    /** 16px — section padding, card padding */
+    readonly lg: 16;
+    /** 24px — generous padding between sections */
+    readonly xl: 24;
+    /** 32px — large section gaps */
+    readonly xxl: 32;
+    /** 48px — page-level vertical spacing */
+    readonly xxxl: 48;
+};
+type SpacingKey = keyof typeof Spacing;
+
+/**
+ * Centralized typography scale.
+ * Use these tokens instead of hardcoded font sizes throughout the app.
+ *
+ * Usage: `import { FontSize, LineHeight } from '@/theme/typography'`
+ *        `fontSize: FontSize.md`
+ */
+declare const FontSize: {
+    /** 11px — small badges, captions, overlines */
+    readonly xs: 11;
+    /** 13px — labels, secondary text, button small */
+    readonly sm: 13;
+    /** 15px — body text, default input */
+    readonly md: 15;
+    /** 17px — section headings, large labels */
+    readonly lg: 17;
+    /** 20px — page sub-headings */
+    readonly xl: 20;
+    /** 24px — page headings */
+    readonly xxl: 24;
+    /** 28px — hero / display text */
+    readonly display: 28;
+};
+declare const LineHeight: {
+    /** Tight line-height for xs */
+    readonly xs: 15;
+    /** Tight line-height for sm */
+    readonly sm: 18;
+    /** Default line-height for md */
+    readonly md: 22;
+    /** Line-height for lg */
+    readonly lg: 24;
+    /** Line-height for xl */
+    readonly xl: 28;
+    /** Line-height for xxl */
+    readonly xxl: 32;
+    /** Line-height for display */
+    readonly display: 36;
+};
+type FontSizeKey = keyof typeof FontSize;
+
+/**
+ * Centralized shadow/elevation tokens.
+ * iOS uses shadow* properties, Android uses elevation.
+ *
+ * Usage: `import { Shadow } from '@/theme/shadows'`
+ *        `style={Shadow.md}`
+ */
+declare const Shadow: {
+    /** Subtle shadow — cards, inputs */
+    readonly sm: ViewStyle;
+    /** Medium shadow — dropdowns, popups */
+    readonly md: ViewStyle;
+    /** Strong shadow — modals, floating elements */
+    readonly lg: ViewStyle;
+    /** Extra strong — overlays */
+    readonly xl: ViewStyle;
+    /** No shadow */
+    readonly none: ViewStyle;
+};
+type ShadowLevel = keyof typeof Shadow;
+
+/**
+ * Centralized animation duration and easing tokens.
+ *
+ * Usage: `import { Duration } from '@/theme/animations'`
+ *        `Animated.timing(anim, { duration: Duration.normal, ... })`
+ */
+declare const Duration: {
+    /** 100ms — micro-interactions (press feedback, check toggle) */
+    readonly instant: 100;
+    /** 150ms — quick transitions (button press, icon swap) */
+    readonly fast: 150;
+    /** 250ms — default transitions (modal, popup, focus ring) */
+    readonly normal: 250;
+    /** 350ms — deliberate transitions (page slide, bottom sheet) */
+    readonly slow: 350;
+    /** 500ms — emphasis transitions (celebration, onboarding) */
+    readonly slower: 500;
+};
+type DurationKey = keyof typeof Duration;
+
+/**
+ * Centralized z-index scale for consistent layering.
+ *
+ * Usage: `import { ZIndex } from '@/theme/zindex'`
+ *        `style={{ zIndex: ZIndex.modal }}`
+ */
+declare const ZIndex: {
+    /** Base content layer */
+    readonly base: 0;
+    /** Sticky headers, FABs */
+    readonly sticky: 100;
+    /** Dropdown menus, select popups */
+    readonly dropdown: 1000;
+    /** Bottom sheets, drawers */
+    readonly drawer: 1100;
+    /** Modals, dialogs */
+    readonly modal: 2000;
+    /** Popup menus, tooltips */
+    readonly popup: 2500;
+    /** Toast notifications */
+    readonly toast: 3000;
+    /** Highest priority overlays (loading screens, critical alerts) */
+    readonly overlay: 4000;
+};
+type ZIndexKey = keyof typeof ZIndex;
+
+export { AVATAR_COLORS, Colors, Duration, type DurationKey, FontFamily, FontSize, type FontSizeKey, type FontWeight, LineHeight, Shadow, type ShadowLevel, Spacing, type SpacingKey, ZIndex, type ZIndexKey };