@umituz/react-native-ai-generation-content 1.20.43 → 1.20.45

package/package.json

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

package/src/features/wizard/domain/types.ts

@@ -79,3 +79,76 @@ export interface WizardActions {
 }
 
 export type WizardStore = WizardState & WizardActions;
+
+/** Feature mode determines the wizard variant */
+export type FeatureMode = "single_image" | "dual_image" | "text_to_media" | "image_to_video";
+
+/** Pre-built step type */
+export type PrebuiltStepType =
+  | "image_upload"
+  | "partner_a_upload"
+  | "partner_b_upload"
+  | "prompt_input"
+  | "style_selector"
+  | "duration_selector"
+  | "scenario_selection"
+  | "scenario_preview"
+  | "generating"
+  | "result";
+
+/** Feature wizard config */
+export interface FeatureWizardConfig {
+  readonly featureId: string;
+  readonly mode: FeatureMode;
+  readonly creditCost?: number;
+  readonly showPrompt?: boolean;
+  readonly showStyleSelector?: boolean;
+  readonly showDurationSelector?: boolean;
+  readonly showScenarioSelection?: boolean;
+}
+
+/** Pre-configured step flows */
+export const FEATURE_FLOWS: Record<FeatureMode, readonly PrebuiltStepType[]> = {
+  single_image: ["image_upload", "generating"],
+  dual_image: ["partner_a_upload", "partner_b_upload", "generating"],
+  text_to_media: ["prompt_input", "generating"],
+  image_to_video: ["image_upload", "prompt_input", "generating"],
+} as const;
+
+/** Feature mode by feature ID */
+export const FEATURE_MODES: Record<string, FeatureMode> = {
+  // Single Image Features
+  "anime-selfie": "single_image",
+  "hd-touch-up": "single_image",
+  "photo-restoration": "single_image",
+  "remove-background": "single_image",
+  "remove-object": "single_image",
+  "upscaling": "single_image",
+  // Single Image with Prompt
+  "image-to-image": "single_image",
+  "replace-background": "single_image",
+  // Dual Image Features
+  "ai-hug": "dual_image",
+  "ai-kiss": "dual_image",
+  "face-swap": "dual_image",
+  "couple-future": "dual_image",
+  // Text to Media Features
+  "text-to-image": "text_to_media",
+  "text-to-video": "text_to_media",
+  "text-to-voice": "text_to_media",
+  "meme-generator": "text_to_media",
+  "script-generator": "text_to_media",
+  "love-message": "text_to_media",
+  // Image to Video Features
+  "image-to-video": "image_to_video",
+} as const;
+
+/** Get feature mode by feature ID */
+export const getFeatureMode = (featureId: string): FeatureMode => {
+  return FEATURE_MODES[featureId] ?? "single_image";
+};
+
+/** Get flow steps for feature mode */
+export const getFeatureFlow = (mode: FeatureMode): readonly PrebuiltStepType[] => {
+  return FEATURE_FLOWS[mode];
+};

package/src/features/wizard/index.ts

@@ -3,8 +3,14 @@
  * Generic wizard for all AI generation flows
  */
 
-// Component
+// Components
 export { AIGenerationWizard, default as AIGenerationWizardDefault } from "./presentation/components/AIGenerationWizard";
+export { AIFeatureWizard, resetAIFeatureWizard } from "./presentation/components/AIFeatureWizard";
+export type {
+  AIFeatureWizardProps,
+  AIFeatureWizardTranslations,
+  AIFeatureWizardCallbacks,
+} from "./presentation/components/AIFeatureWizard";
 
 // Hooks
 export { useWizard, resetWizardStore } from "./presentation/hooks/useWizard";
@@ -12,7 +18,7 @@ export { useWizard, resetWizardStore } from "./presentation/hooks/useWizard";
 // Store
 export { createWizardStore, type WizardStoreType } from "./presentation/store/useWizardStore";
 
-// Types (UploadedImage is already exported from partner-upload)
+// Types
 export type {
   WizardStepId,
   WizardStep,
@@ -23,4 +29,15 @@ export type {
   AIGenerationWizardConfig,
   AIGenerationWizardCallbacks,
   AIGenerationWizardProps,
+  FeatureMode,
+  PrebuiltStepType,
+  FeatureWizardConfig,
+} from "./domain/types";
+
+// Feature mode utilities
+export {
+  FEATURE_MODES,
+  FEATURE_FLOWS,
+  getFeatureMode,
+  getFeatureFlow,
 } from "./domain/types";

package/src/features/wizard/presentation/components/AIFeatureWizard.tsx

@@ -0,0 +1,231 @@
+/**
+ * AIFeatureWizard
+ * Auto-configured wizard based on feature mode
+ */
+
+import React, { useCallback, useMemo } from "react";
+import { View, StyleSheet } from "react-native";
+import { useAppDesignTokens } from "@umituz/react-native-design-system";
+import { useFlow, resetFlowStore } from "../../../../infrastructure/flow";
+import { StepType } from "../../../../domain/entities/flow-config.types";
+import type { StepDefinition } from "../../../../domain/entities/flow-config.types";
+import { PartnerStepScreen } from "../../../partner-upload";
+import { GeneratingStepContent } from "../../../couple-future/presentation/components/GeneratingStepContent";
+import {
+  getFeatureMode,
+  getFeatureFlow,
+  type FeatureMode,
+  type PrebuiltStepType,
+  type FeatureWizardConfig,
+} from "../../domain/types";
+
+/** Wizard translations interface */
+export interface AIFeatureWizardTranslations {
+  readonly generator: {
+    readonly title: string;
+    readonly waitMessage: string;
+    readonly hint?: string;
+  };
+  readonly imageUpload?: {
+    readonly title: string;
+    readonly subtitle: string;
+    readonly continue: string;
+    readonly tapToUpload: string;
+    readonly selectPhoto: string;
+    readonly change: string;
+  };
+  readonly partnerA?: {
+    readonly title: string;
+    readonly subtitle: string;
+    readonly continue: string;
+    readonly tapToUpload: string;
+    readonly selectPhoto: string;
+    readonly change: string;
+  };
+  readonly partnerB?: {
+    readonly title: string;
+    readonly subtitle: string;
+    readonly continue: string;
+    readonly tapToUpload: string;
+    readonly selectPhoto: string;
+    readonly change: string;
+  };
+  readonly prompt?: {
+    readonly title?: string;
+    readonly placeholder: string;
+    readonly label?: string;
+  };
+}
+
+/** Wizard callbacks */
+export interface AIFeatureWizardCallbacks {
+  readonly onGenerationStart?: () => void;
+  readonly onGenerationSuccess?: (result: unknown) => void;
+  readonly onGenerationError?: (error: string) => void;
+  readonly onImageUpload?: (image: { uri: string; base64: string; mimeType: string }) => void;
+  readonly onPartnerAUpload?: (image: { uri: string; base64: string; mimeType: string }) => void;
+  readonly onPartnerBUpload?: (image: { uri: string; base64: string; mimeType: string }) => void;
+  readonly requireFeature?: (callback: () => void) => boolean;
+}
+
+/** Wizard props */
+export interface AIFeatureWizardProps {
+  readonly featureId: string;
+  readonly config?: Partial<FeatureWizardConfig>;
+  readonly translations: AIFeatureWizardTranslations;
+  readonly callbacks?: AIFeatureWizardCallbacks;
+  readonly t: (key: string) => string;
+}
+
+const mapPrebuiltStepToStepType = (step: PrebuiltStepType): StepType => {
+  const mapping: Record<PrebuiltStepType, StepType> = {
+    image_upload: StepType.PARTNER_UPLOAD,
+    partner_a_upload: StepType.PARTNER_UPLOAD,
+    partner_b_upload: StepType.PARTNER_UPLOAD,
+    prompt_input: StepType.TEXT_INPUT,
+    style_selector: StepType.FEATURE_SELECTION,
+    duration_selector: StepType.FEATURE_SELECTION,
+    scenario_selection: StepType.SCENARIO_SELECTION,
+    scenario_preview: StepType.SCENARIO_PREVIEW,
+    generating: StepType.GENERATING,
+    result: StepType.RESULT_PREVIEW,
+  };
+  return mapping[step];
+};
+
+const createStepDefinitions = (
+  featureId: string,
+  mode: FeatureMode,
+): readonly StepDefinition[] => {
+  const flow = getFeatureFlow(mode);
+  return flow.map((step) => ({
+    id: step.toUpperCase(),
+    type: mapPrebuiltStepToStepType(step),
+    required: true,
+  }));
+};
+
+export const AIFeatureWizard: React.FC<AIFeatureWizardProps> = ({
+  featureId,
+  config,
+  translations,
+  callbacks,
+  t,
+}) => {
+  const tokens = useAppDesignTokens();
+  const mode = config?.mode ?? getFeatureMode(featureId);
+
+  const stepDefinitions = useMemo(
+    () => createStepDefinitions(featureId, mode),
+    [featureId, mode],
+  );
+
+  const flow = useFlow({ steps: stepDefinitions });
+
+  const handleImageContinue = useCallback(
+    (image: { uri: string; base64: string; mimeType: string }, _name?: string) => {
+      flow.setPartnerImage("single", image);
+      callbacks?.onImageUpload?.(image);
+      flow.startGeneration();
+      callbacks?.onGenerationStart?.();
+    },
+    [flow, callbacks],
+  );
+
+  const handlePartnerAContinue = useCallback(
+    (image: { uri: string; base64: string; mimeType: string }, _name?: string) => {
+      flow.setPartnerImage("A", image);
+      callbacks?.onPartnerAUpload?.(image);
+      flow.nextStep();
+    },
+    [flow, callbacks],
+  );
+
+  const handlePartnerBContinue = useCallback(
+    (image: { uri: string; base64: string; mimeType: string }, _name?: string) => {
+      flow.setPartnerImage("B", image);
+      callbacks?.onPartnerBUpload?.(image);
+      flow.startGeneration();
+      callbacks?.onGenerationStart?.();
+    },
+    [flow, callbacks],
+  );
+
+  const renderCurrentStep = useCallback(() => {
+    const step = flow.currentStep;
+    if (!step) return null;
+
+    switch (step.id) {
+      case "IMAGE_UPLOAD":
+        return (
+          <PartnerStepScreen
+            key="image"
+            translations={translations.imageUpload as never}
+            t={t}
+            initialName=""
+            config={{ showPhotoTips: true, maxFileSizeMB: 10, maxNameLength: 30 }}
+            onBack={flow.previousStep}
+            onContinue={handleImageContinue as never}
+          />
+        );
+
+      case "PARTNER_A_UPLOAD":
+        return (
+          <PartnerStepScreen
+            key="a"
+            translations={translations.partnerA as never}
+            t={t}
+            initialName=""
+            config={{ showPhotoTips: true, maxFileSizeMB: 10, maxNameLength: 30 }}
+            onBack={flow.previousStep}
+            onContinue={handlePartnerAContinue as never}
+          />
+        );
+
+      case "PARTNER_B_UPLOAD":
+        return (
+          <PartnerStepScreen
+            key="b"
+            translations={translations.partnerB as never}
+            t={t}
+            initialName=""
+            config={{ showPhotoTips: true, maxFileSizeMB: 10, maxNameLength: 30 }}
+            onBack={flow.previousStep}
+            onContinue={handlePartnerBContinue as never}
+          />
+        );
+
+      case "GENERATING":
+        return (
+          <GeneratingStepContent
+            progress={flow.generationProgress}
+            title={translations.generator.title}
+            message={translations.generator.waitMessage}
+            hint={translations.generator.hint}
+          />
+        );
+
+      default:
+        return null;
+    }
+  }, [
+    flow,
+    translations,
+    t,
+    handleImageContinue,
+    handlePartnerAContinue,
+    handlePartnerBContinue,
+  ]);
+
+  return (
+    <View style={[styles.container, { backgroundColor: tokens.colors.backgroundPrimary }]}>
+      {renderCurrentStep()}
+    </View>
+  );
+};
+
+export { resetFlowStore as resetAIFeatureWizard };
+
+const styles = StyleSheet.create({
+  container: { flex: 1 },
+});