@umituz/react-native-ai-generation-content 1.17.122 → 1.17.124

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@umituz/react-native-ai-generation-content",
-  "version": "1.17.122",
+  "version": "1.17.124",
   "description": "Provider-agnostic AI generation orchestration for React Native",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/domain/interfaces/ai-provider.interface.ts

@@ -49,6 +49,8 @@ export interface ProviderCapabilities {
   imageToVideo: boolean;
   /** Supports text-to-voice generation */
   textToVoice: boolean;
+  /** Supports text-to-text (LLM) generation */
+  textToText: boolean;
 }
 
 export interface JobSubmission {

package/src/domains/creations/domain/entities/Creation.ts

@@ -89,6 +89,6 @@ export function mapDocumentToCreation(
     isShared: data.isShared ?? false,
     isFavorite: data.isFavorite ?? false,
     status: data.status as CreationStatus | undefined,
-    output: data.output,
+    output: data.output ?? undefined,
   };
 }

package/src/features/meme-generator/index.ts

@@ -1 +1,2 @@
 export * from "./presentation/screens";
+export * from "./infrastructure/services/MemeGenerationService";

package/src/features/meme-generator/infrastructure/services/MemeGenerationService.ts

@@ -0,0 +1,82 @@
+import { providerRegistry } from "../../../../infrastructure/services/provider.registry";
+
+export interface MemeGenerationParams {
+  prompt: string;
+  styleId?: string;
+}
+
+export class MemeGenerationService {
+  /**
+   * Enhance a simple user prompt into a rich image generation prompt
+   */
+  async enhancePrompt(prompt: string, modelId?: string): Promise<string> {
+    try {
+      const provider = providerRegistry.getActiveProvider();
+      if (!provider) {
+        throw new Error("AI provider not available");
+      }
+
+      const systemPrompt = `You are an AI art director. Take the user's simple meme idea and transform it into a visually rich, detailed, and funny image generation prompt. Your response should be only the new prompt, no explanations. Idea: "${prompt}"`;
+
+      // Use provided modelId or try to find a default text-to-text model
+      const model = modelId || "fal-ai/llama-3-8cl-instruct";
+
+      const result = await provider.run<{ text?: string, data?: { text: string } }>(
+        model,
+        { prompt: systemPrompt }
+      );
+
+      // Handle different provider response formats
+      const text = result.text || result.data?.text || prompt;
+      return text;
+    } catch (error) {
+      if (__DEV__) {
+        // eslint-disable-next-line no-console
+        console.error("[MemeGenerationService] Enhance prompt error:", error);
+      }
+      return prompt;
+    }
+  }
+
+  /**
+   * Generate a meme image
+   */
+  async generateMeme(prompt: string, modelId?: string): Promise<string> {
+    try {
+      const provider = providerRegistry.getActiveProvider();
+      if (!provider) {
+        throw new Error("AI provider not available");
+      }
+
+      const enhancedPrompt = await this.enhancePrompt(prompt, modelId);
+      const finalPrompt = `High-quality, funny meme: ${enhancedPrompt}. Cinematic, vibrant, clean subject, NO TEXT in image.`;
+
+      const model = modelId || "fal-ai/flux/schnell";
+
+      // For Fal, we usually use subscribe or run
+      // provider.run should be enough for quick models like flux/schnell
+      const result = await provider.run<{ images: { url: string }[] }>(
+        model,
+        { 
+          prompt: finalPrompt,
+          image_size: "square",
+          num_inference_steps: 4
+        }
+      );
+
+      if (result.images && result.images.length > 0) {
+        return result.images[0].url;
+      }
+
+      throw new Error("No image generated");
+    } catch (error) {
+      if (__DEV__) {
+        // eslint-disable-next-line no-console
+        console.error("[MemeGenerationService] Generate meme error:", error);
+      }
+      throw error;
+    }
+  }
+}
+
+export const memeGenerationService = new MemeGenerationService();

package/src/index.ts

@@ -321,6 +321,7 @@ export {
   // Headers
   FeatureHeader,
   AIGenScreenHeader,
+  CreditBadge,
 
   // Photo Upload
   PhotoUploadCard,
@@ -380,6 +381,7 @@ export type {
   FeatureHeaderProps,
   AIGenScreenHeaderProps,
   NavigationButtonType,
+  CreditBadgeProps,
 
   // Photo Upload
   PhotoUploadCardProps,

package/src/presentation/components/headers/CreditBadge.tsx

@@ -0,0 +1,58 @@
+import React from "react";
+import { View, StyleSheet } from "react-native";
+import {
+  AtomicText,
+  AtomicIcon,
+  useAppDesignTokens,
+} from "@umituz/react-native-design-system";
+
+export interface CreditBadgeProps {
+  readonly credits: number;
+  readonly iconName?: string;
+  readonly compact?: boolean;
+}
+
+export const CreditBadge: React.FC<CreditBadgeProps> = ({
+  credits,
+  iconName = "flash",
+  compact = false,
+}) => {
+  const tokens = useAppDesignTokens();
+
+  return (
+    <View
+      style={[
+        styles.container,
+        compact && styles.compact,
+        { backgroundColor: tokens.colors.surface },
+      ]}
+    >
+      <AtomicIcon name={iconName} size="sm" color="warning" />
+      <AtomicText
+        type={compact ? "labelSmall" : "labelMedium"}
+        style={[styles.text, { color: tokens.colors.textPrimary }]}
+      >
+        {credits}
+      </AtomicText>
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingHorizontal: 10,
+    paddingVertical: 6,
+    borderRadius: 16,
+    gap: 4,
+  },
+  compact: {
+    paddingHorizontal: 8,
+    paddingVertical: 4,
+    borderRadius: 12,
+  },
+  text: {
+    fontWeight: "600",
+  },
+});

package/src/presentation/components/headers/index.ts

@@ -1,2 +1,3 @@
 export * from "./FeatureHeader";
 export * from "./AIGenScreenHeader";
+export * from "./CreditBadge";