@umituz/react-native-ai-creations 1.2.10 → 1.2.11

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-ai-creations",
-  "version": "1.2.10",
+  "version": "1.2.11",
   "description": "AI-generated creations gallery with filtering, sharing, and management for React Native apps",
   "main": "./src/index.ts",
   "types": "./src/index.ts",

package/src/presentation/components/EmptyState.tsx

@@ -5,18 +5,22 @@
 
 import React, { useMemo } from "react";
 import { View, StyleSheet } from "react-native";
-import { AtomicText, useAppDesignTokens } from "@umituz/react-native-design-system";
+import { AtomicText, AtomicButton, useAppDesignTokens } from "@umituz/react-native-design-system";
 
 interface EmptyStateProps {
   readonly title: string;
   readonly description: string;
   readonly icon?: string;
+  readonly actionLabel?: string;
+  readonly onAction?: () => void;
 }
 
 export function EmptyState({
   title,
   description,
   icon = "🎨",
+  actionLabel,
+  onAction,
 }: EmptyStateProps) {
   const tokens = useAppDesignTokens();
 
@@ -43,9 +47,13 @@ export function EmptyState({
           ...tokens.typography.bodyMedium,
           color: tokens.colors.textSecondary,
           textAlign: "center",
+          marginBottom: onAction ? tokens.spacing.xl : 0,
+        },
+        button: {
+          minWidth: 160,
         },
       }),
-    [tokens],
+    [tokens, onAction],
   );
 
   return (
@@ -53,6 +61,14 @@ export function EmptyState({
       <AtomicText style={styles.icon}>{icon}</AtomicText>
       <AtomicText style={styles.title}>{title}</AtomicText>
       <AtomicText style={styles.description}>{description}</AtomicText>
+      {onAction && actionLabel && (
+        <AtomicButton
+          title={actionLabel}
+          onPress={onAction}
+          variant="primary"
+          style={styles.button}
+        />
+      )}
     </View>
   );
 }

package/src/presentation/screens/CreationsGalleryScreen.tsx

@@ -31,6 +31,8 @@ interface CreationsGalleryScreenProps {
   readonly t: (key: string) => string;
   readonly enableEditing?: boolean;
   readonly onImageEdit?: (uri: string, creationId: string) => void | Promise<void>;
+  readonly onEmptyAction?: () => void;
+  readonly emptyActionLabel?: string;
 }
 
 export function CreationsGalleryScreen({
@@ -40,6 +42,8 @@ export function CreationsGalleryScreen({
   t,
   enableEditing = false,
   onImageEdit,
+  onEmptyAction,
+  emptyActionLabel,
 }: CreationsGalleryScreenProps) {
   const tokens = useAppDesignTokens();
   const insets = useSafeAreaInsets();
@@ -183,6 +187,8 @@ export function CreationsGalleryScreen({
         <EmptyState
           title={t(config.translations.empty)}
           description={t(config.translations.emptyDescription)}
+          actionLabel={emptyActionLabel}
+          onAction={onEmptyAction}
         />
       </View>
     );