@umituz/react-native-design-system 4.25.99 → 4.25.100

package/dist/molecules/splash/types.d.ts

@@ -0,0 +1,86 @@
+/**
+ * Splash Screen Types
+ * All type definitions for the splash screen package
+ */
+import type { ImageSourcePropType, StyleProp, ViewStyle } from "react-native";
+import type { ReactNode } from "react";
+/**
+ * Splash screen color configuration
+ * All colors should be provided by the main app via design tokens
+ */
+export interface SplashColors {
+    /** Background color */
+    background: string;
+    /** Text color for app name and tagline */
+    text: string;
+    /** Background color for icon placeholder circle */
+    iconPlaceholder?: string;
+}
+/**
+ * Custom colors for SplashThemeProvider
+ */
+export interface SplashCustomColors {
+    /** Text color for app name and tagline */
+    textColor: string;
+    /** Background color */
+    backgroundColor?: string;
+    /** Background color for icon placeholder circle */
+    iconPlaceholderColor?: string;
+}
+/**
+ * SplashThemeProvider props
+ */
+export interface SplashThemeProviderProps {
+    /** Children components */
+    children: ReactNode;
+    /** Custom color configuration */
+    customColors?: SplashCustomColors;
+}
+/**
+ * Splash theme context value
+ */
+export interface SplashThemeContextValue {
+    /** Resolved colors for splash screen */
+    colors: SplashColors;
+}
+/**
+ * Splash screen component props
+ * Can be used standalone with colors prop or with SplashThemeProvider
+ */
+export interface SplashScreenProps {
+    /** App name to display */
+    appName?: string;
+    /** Tagline or subtitle */
+    tagline?: string;
+    /** App icon/logo image source */
+    icon?: ImageSourcePropType;
+    /**
+     * Color configuration (optional - uses design tokens by default)
+     *
+     * If not provided, colors will be automatically derived from the current theme:
+     * - Light mode: dark text on light background
+     * - Dark mode: light text on dark background
+     *
+     * @example
+     * // Auto theme-aware (recommended)
+     * <SplashScreen appName="MyApp" icon={icon} />
+     *
+     * // Custom colors
+     * <SplashScreen
+     *   appName="MyApp"
+     *   icon={icon}
+     *   colors={{ background: '#FF0000', text: '#FFFFFF' }}
+     * />
+     */
+    colors?: SplashColors;
+    /** Control visibility */
+    visible?: boolean;
+    /** Maximum duration before timeout callback */
+    maxDuration?: number;
+    /** Callback when max duration is reached */
+    onTimeout?: () => void;
+    /** Callback when splash is ready/mounted */
+    onReady?: () => void;
+    /** Additional container style */
+    style?: StyleProp<ViewStyle>;
+}

package/dist/molecules/swipe-actions/domain/entities/SwipeAction.d.ts

@@ -0,0 +1,55 @@
+/**
+ * Swipe Actions Domain - Entity Layer
+ *
+ * Core swipe action types and configurations.
+ *
+ * @domain swipe-actions
+ * @layer domain/entities
+ */
+import type { IconName } from '../../../../atoms/icon';
+/**
+ * Pre-built swipe action types
+ */
+export type SwipeActionType = 'delete' | 'archive' | 'edit' | 'share' | 'favorite' | 'more' | 'custom';
+/**
+ * Swipe action configuration
+ */
+export interface SwipeActionConfig {
+    /** Action type */
+    type: SwipeActionType;
+    /** Action label (optional, defaults from type) */
+    label?: string;
+    /** Icon name (optional, defaults from type) */
+    icon?: IconName;
+    /** Custom color (optional, defaults from type) */
+    color?: string;
+    /** Action handler */
+    onPress: () => void | Promise<void>;
+    /** Enable haptic feedback (default: true) */
+    enableHaptics?: boolean;
+}
+/**
+ * Swipe direction
+ */
+export type SwipeDirection = 'left' | 'right';
+/**
+ * Swipeable item configuration
+ */
+export interface SwipeableConfig {
+    /** Actions revealed when swiping right (left side) */
+    leftActions?: SwipeActionConfig[];
+    /** Actions revealed when swiping left (right side) */
+    rightActions?: SwipeActionConfig[];
+    /** Swipe threshold in points (default: 80) */
+    threshold?: number;
+    /** Disable overshoot animation (default: true) */
+    disableOvershoot?: boolean;
+    /** Friction value (default: 2) */
+    friction?: number;
+}
+/**
+ * Default swipe configuration
+ */
+export declare const DEFAULT_SWIPE_CONFIG: Required<Omit<SwipeableConfig, 'leftActions' | 'rightActions'>>;
+export { ACTION_PRESETS, getPreset, getActionLabel, getActionIcon, getActionColorKey, getHapticsIntensity, } from '../utils/swipeActionHelpers';
+export { validateSwipeAction, validateSwipeActions, getValidationError, } from '../utils/swipeActionValidator';

package/dist/molecules/swipe-actions/domain/utils/swipeActionHelpers.d.ts

@@ -0,0 +1,53 @@
+/**
+ * Swipe Action Helpers
+ *
+ * Helper functions for swipe action styling and behavior.
+ */
+import type { IconName } from '../../../../atoms/icon';
+import type { SwipeActionType } from '../entities/SwipeAction';
+/**
+ * Pre-built action type configurations
+ */
+export declare const ACTION_PRESETS: Record<Exclude<SwipeActionType, 'custom'>, {
+    label: string;
+    icon: IconName;
+    colorKey: 'error' | 'success' | 'primary' | 'secondary' | 'warning' | 'textSecondary';
+    hapticsIntensity: 'Light' | 'Medium' | 'Heavy';
+}>;
+/**
+ * Gets preset configuration for action type
+ */
+export declare function getPreset(type: SwipeActionType): {
+    label: string;
+    icon: IconName;
+    colorKey: "error" | "success" | "primary" | "secondary" | "warning" | "textSecondary";
+    hapticsIntensity: "Light" | "Medium" | "Heavy";
+} | null;
+/**
+ * Gets action display label
+ */
+export declare function getActionLabel(action: {
+    type: SwipeActionType;
+    label?: string;
+}): string;
+/**
+ * Gets action icon name
+ */
+export declare function getActionIcon(action: {
+    type: SwipeActionType;
+    icon?: IconName;
+}): IconName;
+/**
+ * Gets action color key for theme
+ */
+export declare function getActionColorKey(action: {
+    type: SwipeActionType;
+    color?: string;
+}): string | null;
+/**
+ * Gets haptics intensity for action
+ */
+export declare function getHapticsIntensity(action: {
+    type: SwipeActionType;
+    enableHaptics?: boolean;
+}): 'Light' | 'Medium' | 'Heavy';

package/dist/molecules/swipe-actions/domain/utils/swipeActionValidator.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Swipe Action Validator
+ *
+ * Validation functions for swipe action configurations.
+ */
+import type { SwipeActionConfig } from '../entities/SwipeAction';
+/**
+ * Validates swipe action configuration
+ */
+export declare function validateSwipeAction(action: SwipeActionConfig): boolean;
+/**
+ * Validates multiple swipe actions
+ */
+export declare function validateSwipeActions(actions: SwipeActionConfig[]): boolean;
+/**
+ * Gets validation error message for an action
+ */
+export declare function getValidationError(action: SwipeActionConfig): string | null;

package/dist/molecules/swipe-actions/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Swipe Actions Domain - Barrel Export
+ */
+export * from './domain/entities/SwipeAction';
+export * from './presentation/components/SwipeActionButton';

package/dist/molecules/swipe-actions/presentation/components/SwipeActionButton.d.ts

@@ -0,0 +1,47 @@
+/**
+ * Swipe Actions Domain - SwipeActionButton Component
+ *
+ * Individual swipe action button with icon and label.
+ * Rendered inside SwipeableItem when swiping.
+ *
+ * @domain swipe-actions
+ * @layer presentation/components
+ */
+import React from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+import type { SwipeActionConfig } from '../../domain/entities/SwipeAction';
+/**
+ * SwipeActionButton component props
+ */
+export interface SwipeActionButtonProps {
+    /** Action configuration */
+    action: SwipeActionConfig;
+    /** Action position (index) */
+    position: number;
+    /** Total actions count */
+    totalActions: number;
+    /** Swipe direction */
+    direction: 'left' | 'right';
+    /** Custom container style */
+    style?: StyleProp<ViewStyle>;
+}
+/**
+ * SwipeActionButton Component
+ *
+ * Displays an individual swipe action with icon and label.
+ * Animates based on swipe progress.
+ *
+ * USAGE:
+ * ```typescript
+ * // Used internally by SwipeableItem
+ * <SwipeActionButton
+ *   action={deleteAction}
+ *   progress={progressValue}
+ *   drag={dragValue}
+ *   position={0}
+ *   totalActions={1}
+ *   direction="right"
+ * />
+ * ```
+ */
+export declare const SwipeActionButton: React.FC<SwipeActionButtonProps>;

package/dist/offline/index.d.ts

@@ -0,0 +1,16 @@
+/**
+ * @umituz/react-native-offline
+ * Network connectivity state management for React Native apps
+ */
+export type { NetworkState, OfflineState, OfflineStore, OfflineConfig, ConnectionQuality, } from './types';
+export { useOfflineStore } from './infrastructure/storage/OfflineStore';
+export { useOfflineConfigStore } from './infrastructure/storage/OfflineConfigStore';
+export { useOffline, configureOffline } from './presentation/hooks/useOffline';
+export { useOfflineState } from './presentation/hooks/useOfflineState';
+export { useOfflineWithMutations } from './presentation/hooks/useOfflineWithMutations';
+export { OfflineBanner } from './presentation/components/OfflineBanner';
+export type { OfflineBannerProps } from './presentation/components/OfflineBanner';
+export { NetworkProvider } from './presentation/providers/NetworkProvider';
+export { networkEvents } from './infrastructure/events/NetworkEvents';
+export type { NetworkEventListener, NetworkEvents } from './infrastructure/events/NetworkEvents';
+export { HealthCheck } from './infrastructure/utils/healthCheck';

package/dist/offline/infrastructure/events/NetworkEvents.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Network Events
+ * Event emitter for network state changes
+ * Allows subscribing to network events throughout the app
+ */
+import type { NetworkState } from '../../types';
+export type NetworkEventListener = (state: NetworkState) => void;
+export interface NetworkEvents {
+    on(event: 'online', listener: NetworkEventListener): void;
+    on(event: 'offline', listener: NetworkEventListener): void;
+    on(event: 'change', listener: NetworkEventListener): void;
+    off(event: 'online' | 'offline' | 'change', listener: NetworkEventListener): void;
+    emit(event: 'online' | 'offline' | 'change', state: NetworkState): void;
+    removeAllListeners(): void;
+}
+declare class NetworkEventEmitter implements NetworkEvents {
+    private listeners;
+    on(event: 'online' | 'offline' | 'change', listener: NetworkEventListener): void;
+    off(event: 'online' | 'offline' | 'change', listener: NetworkEventListener): void;
+    emit(event: 'online' | 'offline' | 'change', state: NetworkState): void;
+    removeAllListeners(): void;
+}
+export declare const networkEvents: NetworkEventEmitter;
+export {};

package/dist/offline/infrastructure/storage/OfflineConfigStore.d.ts

@@ -0,0 +1,18 @@
+/**
+ * Offline Config Store
+ * Centralized configuration for offline functionality
+ * Replaces module-level mutable state with Zustand store
+ */
+import type { OfflineConfig } from '../../types';
+interface OfflineConfigStore {
+    config: OfflineConfig;
+    setConfig: (config: OfflineConfig) => void;
+    mergeConfig: (partialConfig: OfflineConfig) => void;
+    reset: () => void;
+}
+export declare const useOfflineConfigStore: import("zustand").UseBoundStore<import("zustand").StoreApi<OfflineConfigStore>>;
+/**
+ * Get current config (for non-React contexts)
+ */
+export declare const getOfflineConfig: () => OfflineConfig;
+export {};

package/dist/offline/infrastructure/storage/OfflineStore.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Offline Store
+ * Manages network connectivity state across the application
+ * Uses expo-network for universal network detection
+ */
+import type { OfflineState, OfflineActions } from '../../types';
+export declare const useOfflineStore: import("zustand").UseBoundStore<import("zustand").StoreApi<OfflineState & OfflineActions>>;

package/dist/offline/infrastructure/utils/healthCheck.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Connection Health Check
+ * Periodically checks real internet connectivity by pinging a reliable endpoint
+ */
+import type { OfflineConfig } from '../../types';
+export declare class HealthCheck {
+    private intervalId;
+    private isChecking;
+    private pendingCheck;
+    private config;
+    constructor(config?: OfflineConfig);
+    /**
+     * Perform a single health check
+     */
+    check(): Promise<boolean>;
+    /**
+     * Start periodic health checks
+     */
+    start(callback: (isHealthy: boolean) => void): void;
+    /**
+     * Stop health checks
+     */
+    stop(): void;
+    /**
+     * Clean up resources
+     */
+    destroy(): void;
+}

package/dist/offline/presentation/components/OfflineBanner.d.ts

@@ -0,0 +1,43 @@
+/**
+ * OfflineBanner Component
+ *
+ * Displays a banner when the device is offline.
+ * Respects safe area insets for proper display on all devices.
+ * Simple conditional rendering - NO animations per CLAUDE.md
+ *
+ * @example
+ * ```tsx
+ * import { OfflineBanner, useOffline } from '@umituz/react-native-design-system';
+ *
+ * const App = () => {
+ *   const { isOffline } = useOffline();
+ *   return (
+ *     <>
+ *       <OfflineBanner visible={isOffline} message="No internet connection" />
+ *       <YourContent />
+ *     </>
+ *   );
+ * };
+ * ```
+ */
+import React from 'react';
+import { type ViewStyle, type TextStyle } from 'react-native';
+export interface OfflineBannerProps {
+    /** Whether the banner is visible */
+    visible: boolean;
+    /** Message to display */
+    message?: string;
+    /** Background color of the banner */
+    backgroundColor?: string;
+    /** Text color */
+    textColor?: string;
+    /** Icon name from design system icons */
+    iconName?: string;
+    /** Position of the banner */
+    position?: 'top' | 'bottom';
+    /** Custom container style */
+    style?: ViewStyle;
+    /** Custom text style */
+    textStyle?: TextStyle;
+}
+export declare const OfflineBanner: React.FC<OfflineBannerProps>;

package/dist/offline/presentation/hooks/useOffline.d.ts

@@ -0,0 +1,22 @@
+/**
+ * useOffline Hook
+ * Primary hook for accessing offline state in components
+ * Automatically subscribes to network changes via expo-network (lazy loaded)
+ */
+import type { OfflineConfig } from '../../types';
+/**
+ * Configure offline settings globally
+ * This is a facade over the config store for backward compatibility
+ */
+export declare const configureOffline: (config: OfflineConfig) => void;
+export declare const useOffline: (config?: OfflineConfig) => {
+    isOnline: boolean;
+    isOffline: boolean;
+    connectionType: string | null;
+    isInternetReachable: boolean | null;
+    lastOnlineAt: Date | null;
+    lastOfflineAt: Date | null;
+    connectionQuality: import("../..").ConnectionQuality;
+    hasConnection: boolean;
+    hasInternet: boolean;
+};

package/dist/offline/presentation/hooks/useOfflineState.d.ts

@@ -0,0 +1,7 @@
+/**
+ * useOfflineState Hook
+ * Raw store access without NetInfo subscription
+ * Use this for selectors and performance optimization
+ */
+import type { OfflineStore } from '../../types';
+export declare const useOfflineState: <T = OfflineStore>(selector?: (state: OfflineStore) => T) => T;

package/dist/offline/presentation/hooks/useOfflineWithMutations.d.ts

@@ -0,0 +1,16 @@
+/**
+ * useOfflineWithMutations Hook
+ * Enhanced version that calls a callback when coming back online
+ * Useful for syncing data or resuming operations
+ */
+export declare const useOfflineWithMutations: (onOnline: () => Promise<void>) => {
+    isOnline: boolean;
+    isOffline: boolean;
+    connectionType: string | null;
+    isInternetReachable: boolean | null;
+    lastOnlineAt: Date | null;
+    lastOfflineAt: Date | null;
+    connectionQuality: import("../..").ConnectionQuality;
+    hasConnection: boolean;
+    hasInternet: boolean;
+};

package/dist/offline/presentation/providers/NetworkProvider.d.ts

@@ -0,0 +1,23 @@
+/**
+ * Network Provider
+ *
+ * Initializes network connectivity listener at app startup.
+ * Wrap your app with this provider to enable offline detection.
+ *
+ * @example
+ * ```tsx
+ * import { NetworkProvider } from '@umituz/react-native-offline';
+ *
+ * const App = () => (
+ *   <NetworkProvider>
+ *     <YourApp />
+ *   </NetworkProvider>
+ * );
+ * ```
+ */
+import React, { ReactNode } from 'react';
+interface NetworkProviderProps {
+    children: ReactNode;
+}
+export declare const NetworkProvider: React.FC<NetworkProviderProps>;
+export {};

package/dist/offline/types/index.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Type Definitions
+ * Network connectivity state types for React Native apps
+ */
+/**
+ * Network state from expo-network
+ */
+export interface NetworkState {
+    readonly type: string;
+    readonly isConnected: boolean | null;
+    readonly isInternetReachable: boolean | null;
+    readonly details: unknown;
+}
+/**
+ * Configuration for offline behavior
+ */
+export interface OfflineConfig {
+    /** Enable persistent storage of network state */
+    persist?: boolean;
+    /** Enable debug logging */
+    debug?: boolean;
+    /** Health check interval in ms (0 = disabled) */
+    healthCheckInterval?: number;
+    /** Health check timeout in ms */
+    healthCheckTimeout?: number;
+    /** Health check URL to ping */
+    healthCheckUrl?: string;
+}
+/**
+ * Connection quality metrics
+ */
+export interface ConnectionQuality {
+    readonly latency: number | null;
+    readonly effectiveType: '2g' | '3g' | '4g' | '5g' | 'unknown' | null;
+    readonly isSlow: boolean;
+}
+/**
+ * Offline state representation
+ */
+export interface OfflineState {
+    readonly isOnline: boolean;
+    readonly isOffline: boolean;
+    readonly connectionType: string | null;
+    readonly isInternetReachable: boolean | null;
+    readonly lastOnlineAt: Date | null;
+    readonly lastOfflineAt: Date | null;
+    readonly connectionQuality: ConnectionQuality;
+}
+/**
+ * Offline store actions
+ */
+export interface OfflineActions {
+    readonly updateNetworkState: (state: NetworkState) => void;
+    readonly setOnline: () => void;
+    readonly setOffline: () => void;
+    readonly reset: () => void;
+}
+/**
+ * Offline store with state and actions
+ */
+export interface OfflineStore extends OfflineState, OfflineActions {
+}

package/dist/onboarding/domain/entities/OnboardingOptions.d.ts

@@ -0,0 +1,85 @@
+/**
+ * Onboarding Options
+ *
+ * Configuration options for onboarding flow
+ */
+import type { OnboardingSlide } from "./OnboardingSlide";
+/**
+ * Onboarding Options
+ * Customize the onboarding experience
+ */
+export interface OnboardingOptions {
+    /**
+     * Array of slides to display
+     */
+    slides: OnboardingSlide[];
+    /**
+     * Callback when onboarding is completed
+     */
+    onComplete?: () => void | Promise<void>;
+    /**
+     * Callback when onboarding is skipped
+     */
+    onSkip?: () => void | Promise<void>;
+    /**
+     * Custom skip button text (default: "Skip")
+     */
+    skipButtonText?: string;
+    /**
+     * Custom next button text (default: "Next")
+     */
+    nextButtonText?: string;
+    /**
+     * Custom get started button text (default: "Get Started")
+     */
+    getStartedButtonText?: string;
+    /**
+     * Show skip button (default: true)
+     */
+    showSkipButton?: boolean;
+    /**
+     * Show back button (default: true)
+     */
+    showBackButton?: boolean;
+    /**
+     * Show progress bar (default: true)
+     */
+    showProgressBar?: boolean;
+    /**
+     * Show dots indicator (default: true)
+     */
+    showDots?: boolean;
+    /**
+     * Show progress text (default: true)
+     */
+    showProgressText?: boolean;
+    /**
+     * Storage key for completion state (default: "@onboarding_completed")
+     */
+    storageKey?: string;
+    /**
+     * Auto-complete onboarding on last slide (default: false)
+     */
+    autoComplete?: boolean;
+    /**
+     * Callback when user wants to upgrade from onboarding
+     */
+    onUpgrade?: () => void;
+    /**
+     * Show paywall modal on onboarding completion (default: false)
+     */
+    showPaywallOnComplete?: boolean;
+    /**
+     * Use custom background for all slides (default: false)
+     * When true, all slides will use custom backgrounds if available
+     */
+    useCustomBackground?: boolean;
+    /**
+     * Visual theme variant (default: "default")
+     * - default: Standard layout
+     * - card: Content in a card with shadow
+     * - minimal: Clean, text-focused layout
+     * - fullscreen: Immersive fullscreen layout
+     */
+    themeVariant?: "default" | "card" | "minimal" | "fullscreen";
+}