@umituz/react-native-ai-generation-content 1.17.219 → 1.17.220

package/src/infrastructure/utils/url-extractor/media-extractors.ts

@@ -0,0 +1,78 @@
+/**
+ * Media URL Extractors
+ * Specialized extractors for video, audio, and image URLs
+ */
+
+import { extractOutputUrl } from "./base-extractor";
+
+/**
+ * Extract video URL from AI generation result
+ */
+export function extractVideoUrl(result: unknown): string | undefined {
+  return extractOutputUrl(result, [
+    "video_url",
+    "videoUrl",
+    "video",
+    "url",
+  ]);
+}
+
+/**
+ * Extract audio URL from AI generation result
+ */
+export function extractAudioUrl(result: unknown): string | undefined {
+  return extractOutputUrl(result, [
+    "audio_url",
+    "audioUrl",
+    "audio",
+    "url",
+  ]);
+}
+
+/**
+ * Extract image URLs from AI generation result
+ */
+export function extractImageUrls(result: unknown): string[] {
+  if (!result || typeof result !== "object") {
+    return [];
+  }
+
+  const urls: string[] = [];
+  const resultObj = result as Record<string, unknown>;
+
+  // Check top-level image object (birefnet, rembg format)
+  const topImage = resultObj.image as Record<string, unknown>;
+  if (topImage && typeof topImage === "object" && typeof topImage.url === "string") {
+    urls.push(topImage.url);
+    return urls;
+  }
+
+  // Check images array
+  if (Array.isArray(resultObj.images)) {
+    for (const img of resultObj.images) {
+      if (typeof img === "string" && img.length > 0) {
+        urls.push(img);
+      } else if (img && typeof img === "object") {
+        const imgObj = img as Record<string, unknown>;
+        if (typeof imgObj.url === "string") {
+          urls.push(imgObj.url);
+        }
+      }
+    }
+  }
+
+  // Check single image
+  if (urls.length === 0) {
+    const singleUrl = extractOutputUrl(result, [
+      "image_url",
+      "imageUrl",
+      "image",
+      "url",
+    ]);
+    if (singleUrl) {
+      urls.push(singleUrl);
+    }
+  }
+
+  return urls;
+}

package/src/infrastructure/utils/url-extractor/multi-extractor.ts

@@ -0,0 +1,61 @@
+/**
+ * Multiple URL Extractor
+ * Extracts arrays of URLs from AI generation results
+ */
+
+import { extractOutputUrl } from "./base-extractor";
+
+/**
+ * Extract multiple output URLs from result
+ */
+export function extractOutputUrls(
+  result: unknown,
+  urlFields?: string[],
+): string[] {
+  if (!result || typeof result !== "object") {
+    return [];
+  }
+
+  const urls: string[] = [];
+  const resultObj = result as Record<string, unknown>;
+
+  // Check for arrays
+  const arrayFields = ["images", "videos", "outputs", "results", "urls"];
+  for (const field of arrayFields) {
+    const arr = resultObj[field];
+    if (Array.isArray(arr)) {
+      for (const item of arr) {
+        const url = extractOutputUrl(item, urlFields);
+        if (url) {
+          urls.push(url);
+        }
+      }
+    }
+  }
+
+  // Check nested data/output
+  const nested = resultObj.data || resultObj.output;
+  if (nested && typeof nested === "object") {
+    for (const field of arrayFields) {
+      const arr = (nested as Record<string, unknown>)[field];
+      if (Array.isArray(arr)) {
+        for (const item of arr) {
+          const url = extractOutputUrl(item, urlFields);
+          if (url) {
+            urls.push(url);
+          }
+        }
+      }
+    }
+  }
+
+  // If no array found, try single URL
+  if (urls.length === 0) {
+    const singleUrl = extractOutputUrl(result, urlFields);
+    if (singleUrl) {
+      urls.push(singleUrl);
+    }
+  }
+
+  return urls;
+}

package/src/infrastructure/utils/url-extractor/thumbnail-extractor.ts

@@ -0,0 +1,31 @@
+/**
+ * Thumbnail URL Extractor
+ */
+
+/**
+ * Extract thumbnail URL from AI generation result
+ */
+export function extractThumbnailUrl(result: unknown): string | undefined {
+  if (!result || typeof result !== "object") {
+    return undefined;
+  }
+
+  const resultObj = result as Record<string, unknown>;
+
+  // Check direct fields
+  const fields = ["thumbnail_url", "thumbnailUrl", "thumbnail", "poster"];
+  for (const field of fields) {
+    const value = resultObj[field];
+    if (typeof value === "string" && value.length > 0) {
+      return value;
+    }
+    if (value && typeof value === "object") {
+      const nested = value as Record<string, unknown>;
+      if (typeof nested.url === "string") {
+        return nested.url;
+      }
+    }
+  }
+
+  return undefined;
+}

package/src/infrastructure/utils/url-extractor.util.ts

@@ -4,221 +4,11 @@
  * Supports various provider response formats
  */
 
-/**
- * Extract output URL from result
- * Supports various AI provider response formats
- */
-export function extractOutputUrl(
-  result: unknown,
-  urlFields?: string[],
-): string | undefined {
-  if (!result || typeof result !== "object") {
-    return undefined;
-  }
-
-  const fields = urlFields ?? [
-    "url",
-    "image_url",
-    "video_url",
-    "output_url",
-    "result_url",
-  ];
-
-  const resultObj = result as Record<string, unknown>;
-
-  // Check top-level fields
-  for (const field of fields) {
-    const value = resultObj[field];
-    if (typeof value === "string" && value.length > 0) {
-      return value;
-    }
-  }
-
-  // Check top-level image/video objects (for birefnet, rembg, etc.)
-  const topMedia =
-    (resultObj.image as Record<string, unknown>) ||
-    (resultObj.video as Record<string, unknown>);
-  if (topMedia && typeof topMedia === "object" && typeof topMedia.url === "string") {
-    return topMedia.url;
-  }
-
-  // Check nested data/output objects
-  const nested =
-    (resultObj.data as Record<string, unknown>) ||
-    (resultObj.output as Record<string, unknown>) ||
-    (resultObj.result as Record<string, unknown>);
-
-  if (nested && typeof nested === "object") {
-    for (const field of fields) {
-      const value = nested[field];
-      if (typeof value === "string" && value.length > 0) {
-        return value;
-      }
-    }
-
-    // Check for nested image/video objects
-    const media =
-      (nested.image as Record<string, unknown>) ||
-      (nested.video as Record<string, unknown>);
-    if (media && typeof media === "object" && typeof media.url === "string") {
-      return media.url;
-    }
-  }
-
-  return undefined;
-}
-
-/**
- * Extract multiple output URLs from result
- */
-export function extractOutputUrls(
-  result: unknown,
-  urlFields?: string[],
-): string[] {
-  if (!result || typeof result !== "object") {
-    return [];
-  }
-
-  const urls: string[] = [];
-  const resultObj = result as Record<string, unknown>;
-
-  // Check for arrays
-  const arrayFields = ["images", "videos", "outputs", "results", "urls"];
-  for (const field of arrayFields) {
-    const arr = resultObj[field];
-    if (Array.isArray(arr)) {
-      for (const item of arr) {
-        const url = extractOutputUrl(item, urlFields);
-        if (url) {
-          urls.push(url);
-        }
-      }
-    }
-  }
-
-  // Check nested data/output
-  const nested = resultObj.data || resultObj.output;
-  if (nested && typeof nested === "object") {
-    for (const field of arrayFields) {
-      const arr = (nested as Record<string, unknown>)[field];
-      if (Array.isArray(arr)) {
-        for (const item of arr) {
-          const url = extractOutputUrl(item, urlFields);
-          if (url) {
-            urls.push(url);
-          }
-        }
-      }
-    }
-  }
-
-  // If no array found, try single URL
-  if (urls.length === 0) {
-    const singleUrl = extractOutputUrl(result, urlFields);
-    if (singleUrl) {
-      urls.push(singleUrl);
-    }
-  }
-
-  return urls;
-}
-
-/**
- * Extract video URL from AI generation result
- */
-export function extractVideoUrl(result: unknown): string | undefined {
-  return extractOutputUrl(result, [
-    "video_url",
-    "videoUrl",
-    "video",
-    "url",
-  ]);
-}
-
-/**
- * Extract thumbnail URL from AI generation result
- */
-export function extractThumbnailUrl(result: unknown): string | undefined {
-  if (!result || typeof result !== "object") {
-    return undefined;
-  }
-
-  const resultObj = result as Record<string, unknown>;
-
-  // Check direct fields
-  const fields = ["thumbnail_url", "thumbnailUrl", "thumbnail", "poster"];
-  for (const field of fields) {
-    const value = resultObj[field];
-    if (typeof value === "string" && value.length > 0) {
-      return value;
-    }
-    if (value && typeof value === "object") {
-      const nested = value as Record<string, unknown>;
-      if (typeof nested.url === "string") {
-        return nested.url;
-      }
-    }
-  }
-
-  return undefined;
-}
-
-/**
- * Extract audio URL from AI generation result
- */
-export function extractAudioUrl(result: unknown): string | undefined {
-  return extractOutputUrl(result, [
-    "audio_url",
-    "audioUrl",
-    "audio",
-    "url",
-  ]);
-}
-
-/**
- * Extract image URLs from AI generation result
- */
-export function extractImageUrls(result: unknown): string[] {
-  if (!result || typeof result !== "object") {
-    return [];
-  }
-
-  const urls: string[] = [];
-  const resultObj = result as Record<string, unknown>;
-
-  // Check top-level image object (birefnet, rembg format)
-  const topImage = resultObj.image as Record<string, unknown>;
-  if (topImage && typeof topImage === "object" && typeof topImage.url === "string") {
-    urls.push(topImage.url);
-    return urls;
-  }
-
-  // Check images array
-  if (Array.isArray(resultObj.images)) {
-    for (const img of resultObj.images) {
-      if (typeof img === "string" && img.length > 0) {
-        urls.push(img);
-      } else if (img && typeof img === "object") {
-        const imgObj = img as Record<string, unknown>;
-        if (typeof imgObj.url === "string") {
-          urls.push(imgObj.url);
-        }
-      }
-    }
-  }
-
-  // Check single image
-  if (urls.length === 0) {
-    const singleUrl = extractOutputUrl(result, [
-      "image_url",
-      "imageUrl",
-      "image",
-      "url",
-    ]);
-    if (singleUrl) {
-      urls.push(singleUrl);
-    }
-  }
-
-  return urls;
-}
+export {
+  extractOutputUrl,
+  extractVideoUrl,
+  extractAudioUrl,
+  extractImageUrls,
+  extractOutputUrls,
+  extractThumbnailUrl,
+} from "./url-extractor";

package/src/presentation/components/GenerationProgressContent.styles.ts

@@ -0,0 +1,68 @@
+/**
+ * GenerationProgressContent Styles
+ */
+
+import { StyleSheet } from "react-native";
+
+export const generationProgressContentStyles = StyleSheet.create({
+  modal: {
+    width: "100%",
+    maxWidth: 380,
+    borderRadius: 24,
+    padding: 32,
+    borderWidth: 1,
+    alignItems: "center",
+    position: "relative",
+  },
+  closeButton: {
+    position: "absolute",
+    top: 16,
+    right: 16,
+    width: 32,
+    height: 32,
+    borderRadius: 16,
+    justifyContent: "center",
+    alignItems: "center",
+    zIndex: 1,
+  },
+  iconContainer: {
+    marginBottom: 20,
+  },
+  title: {
+    fontWeight: "700",
+    marginBottom: 8,
+    textAlign: "center",
+  },
+  message: {
+    marginBottom: 28,
+    textAlign: "center",
+    lineHeight: 20,
+  },
+  hint: {
+    textAlign: "center",
+    lineHeight: 18,
+    paddingHorizontal: 8,
+  },
+  backgroundHintButton: {
+    marginTop: 16,
+    paddingVertical: 8,
+    paddingHorizontal: 16,
+  },
+  backgroundHintText: {
+    textAlign: "center",
+    textDecorationLine: "underline",
+  },
+  dismissButton: {
+    marginTop: 16,
+    paddingVertical: 14,
+    paddingHorizontal: 32,
+    borderRadius: 12,
+    minWidth: 140,
+    alignItems: "center",
+  },
+  dismissText: {
+    fontWeight: "600",
+  },
+});
+
+export type GenerationProgressContentStyles = typeof generationProgressContentStyles;

package/src/presentation/components/GenerationProgressContent.tsx

@@ -5,33 +5,15 @@
  */
 
 import React from "react";
-import { View, TouchableOpacity, StyleSheet } from "react-native";
-import {
-  AtomicText,
-  AtomicIcon,
-  useAppDesignTokens,
-} from "@umituz/react-native-design-system";
+import { View } from "react-native";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { ProgressCloseButton } from "./ProgressCloseButton";
+import { ProgressHeader } from "./ProgressHeader";
+import { ProgressHint } from "./ProgressHint";
+import { ProgressDismissButton } from "./ProgressDismissButton";
 import { GenerationProgressBar } from "./GenerationProgressBar";
-
-export interface GenerationProgressContentProps {
-  readonly progress: number;
-  readonly icon?: string;
-  readonly title?: string;
-  readonly message?: string;
-  readonly hint?: string;
-  readonly dismissLabel?: string;
-  readonly onDismiss?: () => void;
-  /** Close button in top-right corner for background generation */
-  readonly onClose?: () => void;
-  /** Hint text shown near close button (e.g., "Continue in background") */
-  readonly backgroundHint?: string;
-  readonly backgroundColor?: string;
-  readonly textColor?: string;
-  readonly hintColor?: string;
-  readonly progressColor?: string;
-  readonly progressBackgroundColor?: string;
-  readonly dismissButtonColor?: string;
-}
+import { generationProgressContentStyles } from "./GenerationProgressContent.styles";
+import type { GenerationProgressContentProps } from "./GenerationProgressContent.types";
 
 export const GenerationProgressContent: React.FC<
   GenerationProgressContentProps
@@ -53,55 +35,26 @@ export const GenerationProgressContent: React.FC<
   dismissButtonColor,
 }) => {
   const tokens = useAppDesignTokens();
-
-  const activeTextColor = textColor || tokens.colors.textPrimary;
   const activeBgColor = backgroundColor || tokens.colors.surface;
-  const activeHintColor = hintColor || tokens.colors.textTertiary;
 
   return (
     <View
       style={[
-        styles.modal,
+        generationProgressContentStyles.modal,
         {
           backgroundColor: activeBgColor,
           borderColor: tokens.colors.borderLight,
         },
       ]}
     >
-      {/* Close button in top-right corner */}
-      {onClose && (
-        <TouchableOpacity
-          style={styles.closeButton}
-          onPress={onClose}
-          hitSlop={{ top: 10, bottom: 10, left: 10, right: 10 }}
-        >
-          <AtomicIcon name="close" size="md" color="secondary" />
-        </TouchableOpacity>
-      )}
-
-      {icon && (
-        <View style={styles.iconContainer}>
-          <AtomicIcon name={icon} size="xl" color="primary" />
-        </View>
-      )}
-
-      {title && (
-        <AtomicText
-          type="headlineSmall"
-          style={[styles.title, { color: activeTextColor }]}
-        >
-          {title}
-        </AtomicText>
-      )}
+      {onClose && <ProgressCloseButton onPress={onClose} />}
 
-      {message && (
-        <AtomicText
-          type="bodyMedium"
-          style={[styles.message, { color: tokens.colors.textSecondary }]}
-        >
-          {message}
-        </AtomicText>
-      )}
+      <ProgressHeader
+        icon={icon}
+        title={title}
+        message={message}
+        textColor={textColor}
+      />
 
       <GenerationProgressBar
         progress={progress}
@@ -110,107 +63,22 @@ export const GenerationProgressContent: React.FC<
         backgroundColor={progressBackgroundColor}
       />
 
-      {hint && (
-        <AtomicText
-          type="bodySmall"
-          style={[styles.hint, { color: activeHintColor }]}
-        >
-          {hint}
-        </AtomicText>
-      )}
-
-      {/* Background hint - clickable to close and continue in background */}
-      {onClose && backgroundHint && (
-        <TouchableOpacity
-          style={styles.backgroundHintButton}
-          onPress={onClose}
-        >
-          <AtomicText
-            type="bodySmall"
-            style={[styles.backgroundHintText, { color: tokens.colors.primary }]}
-          >
-            {backgroundHint}
-          </AtomicText>
-        </TouchableOpacity>
-      )}
+      <ProgressHint
+        hint={hint}
+        backgroundHint={backgroundHint}
+        hintColor={hintColor}
+        onBackgroundHintPress={onClose}
+      />
 
       {onDismiss && (
-        <TouchableOpacity
-          style={[
-            styles.dismissButton,
-            { backgroundColor: dismissButtonColor || tokens.colors.primary },
-          ]}
-          onPress={onDismiss}
-        >
-          <AtomicText
-            type="bodyMedium"
-            style={[styles.dismissText, { color: tokens.colors.textInverse }]}
-          >
-            {dismissLabel || "OK"}
-          </AtomicText>
-        </TouchableOpacity>
+        <ProgressDismissButton
+          dismissLabel={dismissLabel}
+          dismissButtonColor={dismissButtonColor}
+          onDismiss={onDismiss}
+        />
       )}
     </View>
   );
 };
 
-const styles = StyleSheet.create({
-  modal: {
-    width: "100%",
-    maxWidth: 380,
-    borderRadius: 24,
-    padding: 32,
-    borderWidth: 1,
-    alignItems: "center",
-    position: "relative",
-  },
-  closeButton: {
-    position: "absolute",
-    top: 16,
-    right: 16,
-    width: 32,
-    height: 32,
-    borderRadius: 16,
-    justifyContent: "center",
-    alignItems: "center",
-    zIndex: 1,
-  },
-  iconContainer: {
-    marginBottom: 20,
-  },
-  title: {
-    fontWeight: "700",
-    marginBottom: 8,
-    textAlign: "center",
-  },
-  message: {
-    marginBottom: 28,
-    textAlign: "center",
-    lineHeight: 20,
-  },
-  hint: {
-    textAlign: "center",
-    lineHeight: 18,
-    paddingHorizontal: 8,
-  },
-  backgroundHintButton: {
-    marginTop: 16,
-    paddingVertical: 8,
-    paddingHorizontal: 16,
-  },
-  backgroundHintText: {
-    textAlign: "center",
-    textDecorationLine: "underline",
-  },
-  dismissButton: {
-    marginTop: 16,
-    paddingVertical: 14,
-    paddingHorizontal: 32,
-    borderRadius: 12,
-    minWidth: 140,
-    alignItems: "center",
-  },
-  dismissText: {
-    fontWeight: "600",
-  },
-});
+export type { GenerationProgressContentProps } from "./GenerationProgressContent.types";