@umituz/react-native-design-system 1.3.5 → 1.4.0

package/src/presentation/atoms/AtomicSkeleton.tsx

@@ -1,22 +1,22 @@
 /**
- * AtomicSkeleton - Universal Skeleton Loading Component
+ * AtomicSkeleton - Universal Skeleton Placeholder Component
  *
- * Displays animated skeleton placeholders for loading states
+ * Displays skeleton placeholders for content
  * Theme: {{THEME_NAME}} ({{CATEGORY}} category)
  *
  * Atomic Design Level: ATOM
- * Purpose: Loading state placeholder
+ * Purpose: Content placeholder
  *
  * Usage:
- * - Content loading placeholders
+ * - Content placeholders
  * - List item skeletons
  * - Card skeletons
  * - Text line skeletons
  * - Image placeholders
  */
 
-import React, { useEffect, useRef } from 'react';
-import { View, StyleSheet, ViewStyle, Animated, DimensionValue } from 'react-native';
+import React from 'react';
+import { View, StyleSheet, ViewStyle, DimensionValue } from 'react-native';
 import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
 
 // =============================================================================
@@ -32,14 +32,8 @@ export interface AtomicSkeletonProps {
   shape?: 'rectangle' | 'circle' | 'rounded';
   /** Border radius for rounded shapes */
   borderRadius?: number;
-  /** Animation duration in milliseconds */
-  duration?: number;
-  /** Whether to show animation */
-  animated?: boolean;
   /** Skeleton color */
   color?: string;
-  /** Highlight color for animation */
-  highlightColor?: string;
   /** Style overrides */
   style?: ViewStyle;
   /** Test ID for testing */
@@ -55,43 +49,14 @@ export const AtomicSkeleton: React.FC<AtomicSkeletonProps> = ({
   height = 20,
   shape = 'rectangle',
   borderRadius,
-  duration,
-  animated = true,
   color,
-  highlightColor,
   style,
   testID,
 }) => {
   const tokens = useAppDesignTokens();
-  const animatedValue = useRef(new Animated.Value(0)).current;
 
   // Default values
-  const finalDuration = duration ?? tokens.animations.slowest;
   const skeletonColor = color || tokens.colors.surfaceVariant;
-  const skeletonHighlight = highlightColor || tokens.colors.surface;
-
-  // Animation effect
-  useEffect(() => {
-    if (animated) {
-      const animation = Animated.loop(
-        Animated.sequence([
-          Animated.timing(animatedValue, {
-            toValue: 1,
-            duration: finalDuration,
-            useNativeDriver: false,
-          }),
-          Animated.timing(animatedValue, {
-            toValue: 0,
-            duration: finalDuration,
-            useNativeDriver: false,
-          }),
-        ])
-      );
-      animation.start();
-
-      return () => animation.stop();
-    }
-  }, [animated, finalDuration, animatedValue]);
 
   // Calculate border radius based on shape
   const getBorderRadius = (): number => {
@@ -115,22 +80,6 @@ export const AtomicSkeleton: React.FC<AtomicSkeletonProps> = ({
     borderRadius: getBorderRadius(),
   };
 
-  if (animated) {
-    const animatedStyle = {
-      backgroundColor: animatedValue.interpolate({
-        inputRange: [0, 1],
-        outputRange: [skeletonColor, skeletonHighlight],
-      }),
-    };
-
-    return (
-      <Animated.View
-        style={[skeletonStyle, animatedStyle, style]}
-        testID={testID}
-      />
-    );
-  }
-
   return (
     <View
       style={[skeletonStyle, style]}

package/src/presentation/atoms/AtomicSwitch.tsx

@@ -72,8 +72,8 @@ export const AtomicSwitch: React.FC<AtomicSwitchProps> = ({
   const tokens = useAppDesignTokens();
   const styles = getStyles(tokens);
 
-  const sizeConfig = SIZE_CONFIG[size];
-  const colors = getVariantColors(tokens, variant);
+  const sizeConfig = SIZE_CONFIG[size as 'sm' | 'md' | 'lg'];
+  const colors = getVariantColors(tokens, variant as 'primary' | 'secondary' | 'success' | 'warning' | 'error');
 
   const defaultTrackColor = trackColor || {
     false: colors.trackFalse,

package/src/presentation/atoms/AtomicTouchable.tsx

@@ -1,12 +1,11 @@
 import React from 'react';
-import { Pressable, View, ActivityIndicator, StyleSheet } from 'react-native';
+import { Pressable, StyleSheet } from 'react-native';
 import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
 import { AtomicTouchableProps, TouchableFeedback, FeedbackStrength } from './touchable/types';
 import {
   getOpacityValue,
   getTouchableContainerStyle,
   getDisabledStyle,
-  getLoadingContainerStyle,
   normalizeHitSlop,
 } from './touchable/styles/touchableStyles';
 
@@ -21,7 +20,6 @@ export {
   getOpacityValue,
   getTouchableContainerStyle,
   getDisabledStyle,
-  getLoadingContainerStyle,
   normalizeHitSlop,
 } from './touchable/styles/touchableStyles';
 
@@ -34,7 +32,6 @@ export {
  * Features:
  * - Multiple feedback variants (opacity, highlight, ripple, none)
  * - Configurable feedback strength (subtle, normal, strong)
- * - Loading state with indicator
  * - Disabled state with visual feedback
  * - Hit slop customization for small touch targets
  * - Minimum 48x48 touch target (iOS HIG compliance)
@@ -48,15 +45,6 @@ export {
  *   <AtomicText>Press Me</AtomicText>
  * </AtomicTouchable>
  *
- * // With loading state
- * <AtomicTouchable
- *   onPress={handleSubmit}
- *   loading={isSubmitting}
- *   feedback="highlight"
- * >
- *   <AtomicText>Submit</AtomicText>
- * </AtomicTouchable>
- *
  * // With custom hit slop (extends touch area)
  * <AtomicTouchable
  *   onPress={handlePress}
@@ -76,7 +64,6 @@ export const AtomicTouchable: React.FC<AtomicTouchableProps> = ({
   feedback = 'opacity',
   strength = 'normal',
   disabled = false,
-  loading = false,
   hitSlop,
   style,
   pressedStyle,
@@ -92,10 +79,10 @@ export const AtomicTouchable: React.FC<AtomicTouchableProps> = ({
   const tokens = useAppDesignTokens();
 
   // Determine if touchable should be disabled
-  const isDisabled = disabled || loading;
+  const isDisabled = disabled;
 
   // Get opacity value based on strength
-  const opacityValue = getOpacityValue(strength);
+  const opacityValue = getOpacityValue(strength as 'subtle' | 'normal' | 'strong');
 
   // Normalize hit slop
   const normalizedHitSlop = normalizeHitSlop(hitSlop);
@@ -169,21 +156,10 @@ export const AtomicTouchable: React.FC<AtomicTouchableProps> = ({
       accessibilityRole={accessibilityRole}
       accessibilityState={{
         disabled: isDisabled,
-        busy: loading,
       }}
       testID={testID}
     >
-      {loading ? (
-        <View style={getLoadingContainerStyle()}>
-          <ActivityIndicator
-            size="small"
-            color={tokens.colors.primary}
-            testID={`${testID}-loading`}
-          />
-        </View>
-      ) : (
-        children
-      )}
+      {children}
     </Pressable>
   );
 };

package/src/presentation/atoms/fab/types/index.ts

@@ -65,12 +65,6 @@ export interface AtomicFabProps {
    */
   disabled?: boolean;
 
-  /**
-   * Whether to show loading state
-   * @default false
-   */
-  loading?: boolean;
-
   /**
    * Custom style for the FAB container
    */

package/src/presentation/atoms/touchable/styles/touchableStyles.ts

@@ -35,15 +35,6 @@ export const getDisabledStyle = (): ViewStyle => ({
   opacity: 0.5,
 });
 
-/**
- * Get loading container style
- * Centers the loading indicator
- */
-export const getLoadingContainerStyle = (): ViewStyle => ({
-  justifyContent: 'center',
-  alignItems: 'center',
-});
-
 /**
  * Convert number to HitSlop object
  * If hitSlop is a number, apply it to all sides

package/src/presentation/atoms/touchable/types/index.ts

@@ -40,8 +40,7 @@ export interface HitSlop {
  *   onPress={handlePress}
  *   feedback="opacity"
  *   strength="normal"
- *   disabled={isLoading}
- *   loading={isLoading}
+ *   disabled={isDisabled}
  *   hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
  *   style={styles.touchable}
  * >
@@ -93,12 +92,6 @@ export interface AtomicTouchableProps {
    */
   disabled?: boolean;
 
-  /**
-   * Show loading indicator (disables touch)
-   * @default false
-   */
-  loading?: boolean;
-
   /**
    * Hit slop - extends touchable area
    * Useful for small touch targets

package/src/presentation/molecules/AtomicConfirmationModal.tsx

@@ -40,6 +40,7 @@
 import React from 'react';
 import { View, Modal, TouchableOpacity } from 'react-native';
 import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
+// @ts-ignore - Optional peer dependency
 import { useLocalization } from '@umituz/react-native-localization';
 import { AtomicText } from '../atoms/AtomicText';
 import { AtomicButton } from '../atoms/AtomicButton';
@@ -82,7 +83,7 @@ export const AtomicConfirmationModal: React.FC<AtomicConfirmationModalProps> = (
   const { t } = useLocalization();
 
   // Get variant-specific configuration (icon and color only)
-  const variantConfig = getVariantConfig(variant, tokens);
+  const variantConfig = getVariantConfig(variant as 'default' | 'destructive' | 'warning' | 'success', tokens);
 
   // Get locale-aware default text based on variant
   const getDefaultConfirmText = (): string => {
@@ -116,7 +117,7 @@ export const AtomicConfirmationModal: React.FC<AtomicConfirmationModalProps> = (
     <Modal
       visible={visible}
       transparent
-      animationType="fade"
+      animationType="none"
       onRequestClose={onCancel}
       statusBarTranslucent
       testID={testID}

package/src/presentation/molecules/languageswitcher/hooks/useLanguageNavigation.ts

@@ -1,4 +1,6 @@
+// @ts-ignore - Optional peer dependency
 import { useNavigation } from '@react-navigation/native';
+// @ts-ignore - Optional peer dependency
 import { useLocalization, getLanguageByCode, getDefaultLanguage } from '@umituz/react-native-localization';
 
 export const useLanguageNavigation = (navigationScreen: string) => {

package/src/presentation/organisms/ScreenLayout.tsx

@@ -4,7 +4,6 @@
  * Provides consistent layout structure for all screens:
  * - SafeAreaView with configurable edges
  * - Optional ScrollView for content
- * - Loading state support
  * - Theme-aware background colors
  * - Optional header/footer slots
  * - Consistent spacing and padding
@@ -17,7 +16,6 @@
  * Advanced:
  * <ScreenLayout
  *   scrollable={false}
- *   loading={isLoading}
  *   edges={['top', 'bottom']}
  *   header={<CustomHeader />}
  * >
@@ -29,7 +27,6 @@ import React, { useMemo } from 'react';
 import { View, ScrollView, StyleSheet, ViewStyle } from 'react-native';
 import { SafeAreaView, Edge } from 'react-native-safe-area-context';
 import { useAppDesignTokens } from '../hooks/useAppDesignTokens';
-import { LoadingState } from '../loading/presentation/components/LoadingState';
 
 export interface ScreenLayoutProps {
   /**
@@ -52,22 +49,6 @@ export interface ScreenLayoutProps {
    */
   edges?: Edge[];
 
-  /**
-   * Show loading state
-   * When true, displays LoadingState component
-   */
-  loading?: boolean;
-
-  /**
-   * Loading icon name (default: 'settings')
-   */
-  loadingIcon?: string;
-
-  /**
-   * Loading message (default: 'Loading...')
-   */
-  loadingMessage?: string;
-
   /**
    * Optional header component
    * Rendered above scrollable content
@@ -118,9 +99,6 @@ export const ScreenLayout: React.FC<ScreenLayoutProps> = ({
   children,
   scrollable = true,
   edges = ['top'],
-  loading = false,
-  loadingIcon = 'settings',
-  loadingMessage = 'Loading...',
   header,
   footer,
   backgroundColor,
@@ -136,24 +114,6 @@ export const ScreenLayout: React.FC<ScreenLayoutProps> = ({
 
   const bgColor = backgroundColor || tokens.colors.backgroundPrimary;
 
-  // Show loading state
-  if (loading) {
-    return (
-      <SafeAreaView
-        style={[styles.container, { backgroundColor: bgColor }, containerStyle]}
-        edges={edges}
-        testID={testID}
-      >
-        <LoadingState
-          icon={loadingIcon}
-          message={loadingMessage}
-          size="large"
-          fullScreen
-        />
-      </SafeAreaView>
-    );
-  }
-
   // Non-scrollable layout
   if (!scrollable) {
     return (

package/src/presentation/tokens/AppDesignTokens.ts

@@ -31,14 +31,12 @@ export {
   BASE_TOKENS,
   spacing,
   typography,
-  animations,
   borders,
   iconSizes,
   opacity,
   avatarSizes,
   type Spacing,
   type Typography,
-  type Animations,
   type Borders,
   type IconSizes,
   type Opacity,

package/src/presentation/tokens/commonStyles.ts

@@ -96,7 +96,7 @@ export const useCommonStyles = () => {
 
     /**
      * Centered container - both horizontal and vertical
-     * Perfect for empty states, loading screens, splash screens
+     * Perfect for empty states, splash screens
      */
     centerContainer: {
       flex: 1,

package/src/presentation/tokens/core/BaseTokens.ts

@@ -219,26 +219,6 @@ export const typography = {
   } as TextStyle,
 } as const;
 
-// =============================================================================
-// ANIMATION TOKENS
-// =============================================================================
-
-export const animations = {
-  // Duration scale (milliseconds)
-  fastest: 150,
-  fast: 150,
-  normal: 300,
-  slow: 500,
-  slower: 750,
-  slowest: 1000,
-
-  // Easing functions
-  easeInOut: 'ease-in-out' as const,
-  easeIn: 'ease-in' as const,
-  easeOut: 'ease-out' as const,
-  linear: 'linear' as const,
-} as const;
-
 // =============================================================================
 // OPACITY TOKENS
 // =============================================================================
@@ -371,7 +351,6 @@ export const avatarSizes = {
 export const BASE_TOKENS = {
   spacing,
   typography,
-  animations,
   opacity,
   borders,
   sizes,
@@ -385,7 +364,6 @@ export const BASE_TOKENS = {
 
 export type Spacing = typeof spacing;
 export type Typography = typeof typography;
-export type Animations = typeof animations;
 export type Opacity = typeof opacity;
 export type Borders = typeof borders;
 export type Sizes = typeof sizes;

package/src/presentation/tokens/core/TokenFactory.ts

@@ -18,13 +18,12 @@ import { getColorPalette, withAlpha, type ThemeMode, type ColorPalette } from '.
 
 /**
  * Complete design tokens shape
- * Combines static tokens (spacing, typography, animations, borders) + dynamic colors
+ * Combines static tokens (spacing, typography, borders) + dynamic colors
  */
 export type DesignTokens = {
   colors: ColorPalette;
   spacing: typeof BASE_TOKENS.spacing;
   typography: typeof BASE_TOKENS.typography;
-  animations: typeof BASE_TOKENS.animations;
   iconSizes: typeof BASE_TOKENS.iconSizes;
   opacity: typeof BASE_TOKENS.opacity;
   avatarSizes: typeof BASE_TOKENS.avatarSizes;
@@ -67,7 +66,6 @@ export const createDesignTokens = (mode: ThemeMode): DesignTokens => {
     // ✅ STATIC: These don't change with theme
     spacing: BASE_TOKENS.spacing,
     typography: BASE_TOKENS.typography,
-    animations: BASE_TOKENS.animations,
     iconSizes: BASE_TOKENS.iconSizes,
     opacity: BASE_TOKENS.opacity,
     avatarSizes: BASE_TOKENS.avatarSizes,
@@ -107,7 +105,7 @@ export const createDesignTokens = (mode: ThemeMode): DesignTokens => {
 export const STATIC_DESIGN_TOKENS = createDesignTokens('light');
 
 /**
- * STATIC TOKENS (spacing, typography, animations, borders)
+ * STATIC TOKENS (spacing, typography, borders)
  * These DON'T change with theme - safe to use anywhere
  */
 export const STATIC_TOKENS = BASE_TOKENS;

package/lib/presentation/loading/index.d.ts

@@ -1,23 +0,0 @@
-/**
- * Loading Domain - Public API
- *
- * Domain-Driven Design (DDD) Architecture
- * Theme: {{THEME_NAME}} ({{CATEGORY}} category)
- *
- * This is the SINGLE SOURCE OF TRUTH for the Loading domain.
- * ALL imports from this domain MUST go through this file.
- *
- * Architecture:
- * - presentation/components: UI components (LoadingState, LoadingSpinner)
- * - presentation/hooks: React hooks (useLoading)
- *
- * Usage:
- *   import { LoadingState, LoadingSpinner, useLoading } from '@domains/design-system';
- */
-export { LoadingState } from './presentation/components/LoadingState';
-export type { LoadingStateProps, LoadingStateSize } from './presentation/components/LoadingState';
-export { LoadingSpinner } from './presentation/components/LoadingSpinner';
-export type { LoadingSpinnerProps, LoadingSpinnerSize, LoadingSpinnerColor, } from './presentation/components/LoadingSpinner';
-export { useLoading } from './presentation/hooks/useLoading';
-export type { LoadingConfig, UseLoadingReturn, } from './presentation/hooks/useLoading';
-//# sourceMappingURL=index.d.ts.map

package/lib/presentation/loading/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/presentation/loading/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAMH,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AACtE,YAAY,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAElG,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAC1E,YAAY,EACV,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,GACpB,MAAM,0CAA0C,CAAC;AAMlD,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC;AAC7D,YAAY,EACV,aAAa,EACb,gBAAgB,GACjB,MAAM,iCAAiC,CAAC"}

package/lib/presentation/loading/index.js

@@ -1,26 +0,0 @@
-/**
- * Loading Domain - Public API
- *
- * Domain-Driven Design (DDD) Architecture
- * Theme: {{THEME_NAME}} ({{CATEGORY}} category)
- *
- * This is the SINGLE SOURCE OF TRUTH for the Loading domain.
- * ALL imports from this domain MUST go through this file.
- *
- * Architecture:
- * - presentation/components: UI components (LoadingState, LoadingSpinner)
- * - presentation/hooks: React hooks (useLoading)
- *
- * Usage:
- *   import { LoadingState, LoadingSpinner, useLoading } from '@domains/design-system';
- */
-// =============================================================================
-// PRESENTATION LAYER - Components
-// =============================================================================
-export { LoadingState } from './presentation/components/LoadingState';
-export { LoadingSpinner } from './presentation/components/LoadingSpinner';
-// =============================================================================
-// PRESENTATION LAYER - Hooks
-// =============================================================================
-export { useLoading } from './presentation/hooks/useLoading';
-//# sourceMappingURL=index.js.map

package/lib/presentation/loading/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/presentation/loading/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,gFAAgF;AAChF,kCAAkC;AAClC,gFAAgF;AAEhF,OAAO,EAAE,YAAY,EAAE,MAAM,wCAAwC,CAAC;AAGtE,OAAO,EAAE,cAAc,EAAE,MAAM,0CAA0C,CAAC;AAO1E,gFAAgF;AAChF,6BAA6B;AAC7B,gFAAgF;AAEhF,OAAO,EAAE,UAAU,EAAE,MAAM,iCAAiC,CAAC"}

package/lib/presentation/loading/presentation/components/LoadingSpinner.d.ts

@@ -1,28 +0,0 @@
-/**
- * LoadingSpinner - Theme-Aware Activity Indicator
- *
- * Refactored from AtomicLoadingSpinner - now part of Loading domain
- * Uses central useAppDesignTokens() hook for automatic theme switching
- * Theme: {{THEME_NAME}} ({{CATEGORY}} category)
- *
- * Features:
- * - ✅ AUTOMATIC theme switching via useAppDesignTokens()
- * - ✅ Multiple size variants (small, medium, large)
- * - ✅ Dynamic color customization
- * - ✅ Overlay support
- * - ✅ Message display
- */
-import React from 'react';
-import { ViewStyle } from 'react-native';
-export type LoadingSpinnerSize = 'small' | 'medium' | 'large';
-export type LoadingSpinnerColor = 'primary' | 'secondary' | 'white';
-export interface LoadingSpinnerProps {
-    size?: LoadingSpinnerSize;
-    color?: LoadingSpinnerColor;
-    message?: string;
-    overlay?: boolean;
-    style?: ViewStyle;
-}
-export declare const LoadingSpinner: React.FC<LoadingSpinnerProps>;
-export default LoadingSpinner;
-//# sourceMappingURL=LoadingSpinner.d.ts.map

package/lib/presentation/loading/presentation/components/LoadingSpinner.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"LoadingSpinner.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/loading/presentation/components/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAA2B,SAAS,EAAE,MAAM,cAAc,CAAC;AASlE,MAAM,MAAM,kBAAkB,GAAG,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;AAC9D,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,WAAW,GAAG,OAAO,CAAC;AAEpE,MAAM,WAAW,mBAAmB;IAClC,IAAI,CAAC,EAAE,kBAAkB,CAAC;IAC1B,KAAK,CAAC,EAAE,mBAAmB,CAAC;IAC5B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAgBD,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA+DxD,CAAC;AAEF,eAAe,cAAc,CAAC"}

package/lib/presentation/loading/presentation/components/LoadingSpinner.js

@@ -1,77 +0,0 @@
-/**
- * LoadingSpinner - Theme-Aware Activity Indicator
- *
- * Refactored from AtomicLoadingSpinner - now part of Loading domain
- * Uses central useAppDesignTokens() hook for automatic theme switching
- * Theme: {{THEME_NAME}} ({{CATEGORY}} category)
- *
- * Features:
- * - ✅ AUTOMATIC theme switching via useAppDesignTokens()
- * - ✅ Multiple size variants (small, medium, large)
- * - ✅ Dynamic color customization
- * - ✅ Overlay support
- * - ✅ Message display
- */
-import React from 'react';
-import { View, ActivityIndicator } from 'react-native';
-import { useAppDesignTokens } from '../../../hooks/useAppDesignTokens';
-import { withAlpha } from '../../../tokens/AppDesignTokens';
-import { AtomicText } from '../../../atoms/AtomicText';
-// =============================================================================
-// SIZE VARIANTS
-// =============================================================================
-const sizeVariants = {
-    small: 'small',
-    medium: 'large',
-    large: 'large',
-};
-// =============================================================================
-// COMPONENT IMPLEMENTATION
-// =============================================================================
-export const LoadingSpinner = ({ size = 'medium', color = 'primary', message, overlay = false, style, }) => {
-    // ✅ DYNAMIC tokens from central hook
-    const tokens = useAppDesignTokens();
-    const spinnerSize = sizeVariants[size];
-    /**
-     * Get spinner color from dynamic theme
-     * ✅ Automatically updates when theme changes
-     */
-    const getSpinnerColor = () => {
-        switch (color) {
-            case 'primary':
-                return tokens.colors.primary;
-            case 'secondary':
-                return tokens.colors.secondary;
-            case 'white':
-                return tokens.colors.textInverse;
-            default:
-                return tokens.colors.primary;
-        }
-    };
-    const spinnerColor = getSpinnerColor();
-    const containerStyle = overlay
-        ? {
-            position: 'absolute',
-            top: 0,
-            left: 0,
-            right: 0,
-            bottom: 0,
-            backgroundColor: withAlpha(tokens.colors.black, 0.5),
-            justifyContent: 'center',
-            alignItems: 'center',
-            zIndex: 9999,
-        }
-        : {
-            justifyContent: 'center',
-            alignItems: 'center',
-            padding: tokens.spacing.lg,
-        };
-    return (<View style={[containerStyle, style]}>
-      <ActivityIndicator size={spinnerSize} color={spinnerColor}/>
-      {message && (<AtomicText type="bodyMedium" color={overlay ? 'inverse' : 'primary'} style={{ marginTop: tokens.spacing.md, textAlign: 'center' }}>
-          {message}
-        </AtomicText>)}
-    </View>);
-};
-export default LoadingSpinner;
-//# sourceMappingURL=LoadingSpinner.js.map

package/lib/presentation/loading/presentation/components/LoadingSpinner.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LoadingSpinner.js","sourceRoot":"","sources":["../../../../../src/presentation/loading/presentation/components/LoadingSpinner.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,iBAAiB,EAAa,MAAM,cAAc,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,mCAAmC,CAAC;AACvE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAiBvD,gFAAgF;AAChF,gBAAgB;AAChB,gFAAgF;AAEhF,MAAM,YAAY,GAAkD;IAClE,KAAK,EAAE,OAAO;IACd,MAAM,EAAE,OAAO;IACf,KAAK,EAAE,OAAO;CACf,CAAC;AAEF,gFAAgF;AAChF,2BAA2B;AAC3B,gFAAgF;AAEhF,MAAM,CAAC,MAAM,cAAc,GAAkC,CAAC,EAC5D,IAAI,GAAG,QAAQ,EACf,KAAK,GAAG,SAAS,EACjB,OAAO,EACP,OAAO,GAAG,KAAK,EACf,KAAK,GACN,EAAE,EAAE;IACH,qCAAqC;IACrC,MAAM,MAAM,GAAG,kBAAkB,EAAE,CAAC;IAEpC,MAAM,WAAW,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IAEvC;;;OAGG;IACH,MAAM,eAAe,GAAG,GAAW,EAAE;QACnC,QAAQ,KAAK,EAAE,CAAC;YACd,KAAK,SAAS;gBACZ,OAAO,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC;YAC/B,KAAK,WAAW;gBACd,OAAO,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC;YACjC,KAAK,OAAO;gBACV,OAAO,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC;YACnC;gBACE,OAAO,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC;QACjC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,eAAe,EAAE,CAAC;IAEvC,MAAM,cAAc,GAAc,OAAO;QACvC,CAAC,CAAC;YACE,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,CAAC;YACN,IAAI,EAAE,CAAC;YACP,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;YACT,eAAe,EAAE,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC;YACpD,cAAc,EAAE,QAAQ;YACxB,UAAU,EAAE,QAAQ;YACpB,MAAM,EAAE,IAAI;SACb;QACH,CAAC,CAAC;YACE,cAAc,EAAE,QAAQ;YACxB,UAAU,EAAE,QAAQ;YACpB,OAAO,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE;SAC3B,CAAC;IAEN,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC,CACnC;MAAA,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC,CAAC,KAAK,CAAC,CAAC,YAAY,CAAC,EAC1D;MAAA,CAAC,OAAO,IAAI,CACV,CAAC,UAAU,CACT,IAAI,CAAC,YAAY,CACjB,KAAK,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CACvC,KAAK,CAAC,CAAC,EAAE,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,CAAC,CAE7D;UAAA,CAAC,OAAO,CACV;QAAA,EAAE,UAAU,CAAC,CACd,CACH;IAAA,EAAE,IAAI,CAAC,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,cAAc,CAAC"}