@umituz/react-native-splash 1.6.4 → 1.7.1

package/src/presentation/components/SplashTypography.tsx

@@ -11,14 +11,16 @@ export interface SplashTypographyProps {
   appName: string;
   tagline?: string;
   tokens: DesignTokens;
+  textColor?: string;
 }
 
 export const SplashTypography: React.FC<SplashTypographyProps> = ({
   appName,
   tagline,
   tokens,
+  textColor = "#FFFFFF",
 }) => {
-  const styles = getStyles(tokens);
+  const styles = getStyles(tokens, textColor);
 
   return (
     <View style={styles.container}>
@@ -34,7 +36,7 @@ export const SplashTypography: React.FC<SplashTypographyProps> = ({
   );
 };
 
-const getStyles = (tokens: DesignTokens) => {
+const getStyles = (tokens: DesignTokens, textColor: string) => {
   return StyleSheet.create({
     container: {
       alignItems: "center",
@@ -43,7 +45,7 @@ const getStyles = (tokens: DesignTokens) => {
     appName: {
       fontSize: 48,
       fontWeight: "800" as const,
-      color: "#FFFFFF",
+      color: textColor,
       textAlign: "center" as const,
       marginBottom: tokens.spacing.md,
       letterSpacing: -1.2,
@@ -54,7 +56,7 @@ const getStyles = (tokens: DesignTokens) => {
     },
     tagline: {
       fontSize: 17,
-      color: "#FFFFFF",
+      color: textColor,
       textAlign: "center" as const,
       opacity: 0.95,
       maxWidth: 320,

package/src/presentation/hooks/useSplash.ts

@@ -0,0 +1,70 @@
+/**
+ * Use Splash Hook
+ * Single Responsibility: Manage splash screen state and timing
+ */
+
+import { useEffect, useState, useRef } from "react";
+
+interface UseSplashOptions {
+  minimumDisplayTime?: number;
+  onReady?: () => void | Promise<void>;
+  autoHide?: boolean;
+}
+
+export const useSplash = ({
+  minimumDisplayTime = 1500,
+  onReady,
+  autoHide = true,
+}: UseSplashOptions = {}) => {
+  const [isVisible, setIsVisible] = useState(true);
+  const [isReady, setIsReady] = useState(false);
+  const timerRef = useRef<NodeJS.Timeout>();
+  const isReadyRef = useRef(false);
+
+  const hide = () => {
+    setIsVisible(false);
+  };
+
+  const show = () => {
+    setIsVisible(true);
+  };
+
+  const markReady = async () => {
+    if (isReadyRef.current) return;
+
+    isReadyRef.current = true;
+    setIsReady(true);
+
+    if (onReady) {
+      try {
+        await onReady();
+      } catch (error) {
+        if (__DEV__) {
+          console.error("Splash onReady error:", error);
+        }
+      }
+    }
+
+    if (autoHide) {
+      timerRef.current = setTimeout(() => {
+        hide();
+      }, minimumDisplayTime);
+    }
+  };
+
+  useEffect(() => {
+    return () => {
+      if (timerRef.current) {
+        clearTimeout(timerRef.current);
+      }
+    };
+  }, []);
+
+  return {
+    isVisible,
+    isReady,
+    hide,
+    show,
+    markReady,
+  };
+};

package/src/types/expo-linear-gradient.d.ts

@@ -0,0 +1,12 @@
+declare module 'expo-linear-gradient' {
+  import { View, ViewProps } from 'react-native';
+  
+  export interface LinearGradientProps extends ViewProps {
+    colors: readonly string[];
+    start?: { x: number; y: number };
+    end?: { x: number; y: number };
+    locations?: readonly number[];
+  }
+  
+  export const LinearGradient: React.FC<LinearGradientProps>;
+}