@umituz/react-native-ai-generation-content 1.20.39 → 1.20.40

package/package.json

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

package/src/domain/entities/flow-config.types.ts

@@ -0,0 +1,174 @@
+/**
+ * Flow Configuration Types
+ * Generic multi-step flow system for AI generation
+ */
+
+/** Step Types */
+export enum StepType {
+  CATEGORY_SELECTION = "category_selection",
+  SCENARIO_SELECTION = "scenario_selection",
+  SCENARIO_PREVIEW = "scenario_preview",
+  PARTNER_UPLOAD = "partner_upload",
+  TEXT_INPUT = "text_input",
+  FEATURE_SELECTION = "feature_selection",
+  GENERATING = "generating",
+  RESULT_PREVIEW = "result_preview",
+  CUSTOM = "custom",
+}
+
+/** Partner Configuration */
+export interface PartnerConfig {
+  readonly partnerId: "A" | "B" | "single";
+  readonly showNameInput?: boolean;
+  readonly showFaceDetection?: boolean;
+  readonly showPhotoTips?: boolean;
+  readonly maxNameLength?: number;
+}
+
+/** Category Data - App provides */
+export interface CategoryData {
+  readonly id: string;
+  readonly titleKey: string;
+  readonly descriptionKey?: string;
+  readonly icon: string;
+  readonly imageUrl?: string;
+  readonly subcategories?: readonly CategoryData[];
+}
+
+/** Scenario Data - App provides */
+export interface ScenarioData {
+  readonly id: string;
+  readonly categoryId?: string;
+  readonly titleKey: string;
+  readonly descriptionKey: string;
+  readonly icon: string;
+  readonly imageUrl?: string;
+  readonly previewImageUrl?: string;
+  readonly aiPrompt: string;
+  readonly storyTemplate?: string;
+}
+
+/** Visual Style Option */
+export interface VisualStyleData {
+  readonly id: string;
+  readonly icon: string;
+  readonly labelKey: string;
+  readonly promptModifier?: string;
+}
+
+/** Uploaded Image Data */
+export interface UploadedImageData {
+  readonly uri: string;
+  readonly base64: string;
+  readonly mimeType: string;
+}
+
+/** Step Transition */
+export interface StepTransition {
+  readonly next?: string | ((state: FlowState) => string | null);
+  readonly back?: string;
+  readonly skipIf?: (state: FlowState) => boolean;
+}
+
+/** Step Definition */
+export interface StepDefinition<TConfig = unknown> {
+  readonly id: string;
+  readonly type: StepType;
+  readonly required?: boolean;
+  readonly config?: TConfig;
+  readonly transitions?: StepTransition;
+  readonly component?: React.ComponentType<StepComponentProps>;
+}
+
+/** Flow Generation Status */
+export type FlowGenerationStatus = "idle" | "preparing" | "generating" | "completed" | "failed";
+
+/** Flow State */
+export interface FlowState {
+  readonly currentStepId: string;
+  readonly currentStepIndex: number;
+  readonly completedSteps: readonly string[];
+  readonly selectedCategory?: CategoryData;
+  readonly selectedScenario?: ScenarioData;
+  readonly partners: Record<string, UploadedImageData | undefined>;
+  readonly partnerNames: Record<string, string>;
+  readonly textInput?: string;
+  readonly visualStyle?: string;
+  readonly selectedFeatures: Record<string, readonly string[]>;
+  readonly customData: Record<string, unknown>;
+  readonly generationStatus: FlowGenerationStatus;
+  readonly generationProgress: number;
+  readonly generationResult?: unknown;
+  readonly generationError?: string;
+}
+
+/** Flow Actions */
+export interface FlowActions {
+  goToStep: (stepId: string) => void;
+  nextStep: () => void;
+  previousStep: () => void;
+  setCategory: (category: CategoryData | undefined) => void;
+  setScenario: (scenario: ScenarioData | undefined) => void;
+  setPartnerImage: (partnerId: string, image: UploadedImageData | undefined) => void;
+  setPartnerName: (partnerId: string, name: string) => void;
+  setTextInput: (text: string) => void;
+  setVisualStyle: (styleId: string) => void;
+  setSelectedFeatures: (featureType: string, ids: readonly string[]) => void;
+  setCustomData: (key: string, value: unknown) => void;
+  startGeneration: () => void;
+  updateProgress: (progress: number) => void;
+  setResult: (result: unknown) => void;
+  setError: (error: string) => void;
+  reset: () => void;
+  completeStep: (stepId: string) => void;
+}
+
+/** Step Component Props */
+export interface StepComponentProps {
+  readonly step: StepDefinition;
+  readonly state: FlowState;
+  readonly actions: FlowActions;
+  readonly onNext: () => void;
+  readonly onBack: () => void;
+  readonly isProcessing: boolean;
+  readonly progress: number;
+  readonly error: string | null;
+}
+
+/** Flow Callbacks */
+export interface FlowCallbacks {
+  onAuthRequired?: (resume: () => void) => void;
+  onCreditsExhausted?: () => void;
+  onGenerationStart?: () => void;
+  onGenerationSuccess?: (result: unknown) => void;
+  onGenerationError?: (error: string) => void;
+  onStepChange?: (stepId: string, index: number) => void;
+  onFlowComplete?: (result: unknown) => void;
+}
+
+/** Flow Data Provider - App provides data */
+export interface FlowDataProvider {
+  readonly categories?: readonly CategoryData[];
+  readonly scenarios?: readonly ScenarioData[];
+  readonly visualStyles?: readonly VisualStyleData[];
+  readonly surprisePrompts?: readonly string[];
+}
+
+/** Flow Configuration */
+export interface FlowConfiguration {
+  readonly id: string;
+  readonly steps: readonly StepDefinition[];
+  readonly initialStepId?: string;
+  readonly callbacks?: FlowCallbacks;
+  readonly data?: FlowDataProvider;
+  readonly creditCost?: number;
+  readonly userId?: string;
+}
+
+/** Flow Features */
+export interface FlowFeatures {
+  readonly categorySelection: boolean;
+  readonly partnerCount: 0 | 1 | 2;
+  readonly textInput: boolean;
+  readonly scenarioSelection: boolean;
+}

package/src/domain/entities/index.ts

@@ -10,3 +10,4 @@ export * from "./progress.types";
 export * from "./middleware.types";
 export * from "./job.types";
 export * from "./processing-modes.types";
+export * from "./flow-config.types";

package/src/index.ts

@@ -194,3 +194,25 @@ export type {
 
 // AIGenerationWizard - Generic wizard for all AI generation flows
 export * from "./features/wizard";
+
+// Flow System - Dynamic multi-step flow management
+export { createFlowStore, useFlow, resetFlowStore } from "./infrastructure/flow";
+export type { FlowStoreType } from "./infrastructure/flow";
+export { StepType } from "./domain/entities/flow-config.types";
+export type {
+  StepDefinition,
+  FlowState,
+  FlowActions,
+  FlowConfiguration,
+  FlowCallbacks,
+  FlowDataProvider,
+  FlowFeatures,
+  StepComponentProps,
+  StepTransition,
+  PartnerConfig,
+  CategoryData,
+  ScenarioData,
+  VisualStyleData,
+  UploadedImageData,
+  FlowGenerationStatus,
+} from "./domain/entities/flow-config.types";

package/src/infrastructure/flow/index.ts

@@ -0,0 +1,7 @@
+/**
+ * Flow Infrastructure
+ * Multi-step flow management system
+ */
+
+export { createFlowStore, type FlowStoreType } from "./useFlowStore";
+export { useFlow, resetFlowStore } from "./useFlow";

package/src/infrastructure/flow/useFlow.ts

@@ -0,0 +1,87 @@
+/**
+ * useFlow Hook
+ * Main hook for accessing flow state and actions
+ */
+
+import { useRef, useCallback, useMemo } from "react";
+import { createFlowStore, type FlowStoreType } from "./useFlowStore";
+import type { FlowState, FlowActions, StepDefinition } from "../../domain/entities/flow-config.types";
+
+interface UseFlowConfig {
+  steps: readonly StepDefinition[];
+  initialStepId?: string;
+}
+
+interface UseFlowReturn extends FlowState, FlowActions {
+  canGoNext: boolean;
+  canGoBack: boolean;
+  currentStep: StepDefinition | undefined;
+  totalSteps: number;
+  isFirstStep: boolean;
+  isLastStep: boolean;
+  hasPartner: (partnerId: string) => boolean;
+  getPartnerImage: (partnerId: string) => FlowState["partners"][string];
+  getPartnerName: (partnerId: string) => string;
+}
+
+let flowStoreInstance: FlowStoreType | null = null;
+
+export const useFlow = (config: UseFlowConfig): UseFlowReturn => {
+  const storeRef = useRef<FlowStoreType | null>(null);
+
+  if (!storeRef.current) {
+    if (!flowStoreInstance) {
+      flowStoreInstance = createFlowStore(config);
+    }
+    storeRef.current = flowStoreInstance;
+  }
+
+  const store = storeRef.current;
+  const state = store();
+  const totalSteps = config.steps.length;
+
+  const canGoNext = state.currentStepIndex < totalSteps - 1;
+  const canGoBack = state.currentStepIndex > 0;
+  const isFirstStep = state.currentStepIndex === 0;
+  const isLastStep = state.currentStepIndex === totalSteps - 1;
+
+  const currentStep = useMemo(
+    () => config.steps[state.currentStepIndex],
+    [config.steps, state.currentStepIndex],
+  );
+
+  const hasPartner = useCallback(
+    (partnerId: string) => state.partners[partnerId] != null,
+    [state.partners],
+  );
+
+  const getPartnerImage = useCallback(
+    (partnerId: string) => state.partners[partnerId],
+    [state.partners],
+  );
+
+  const getPartnerName = useCallback(
+    (partnerId: string) => state.partnerNames[partnerId] ?? "",
+    [state.partnerNames],
+  );
+
+  return {
+    ...state,
+    canGoNext,
+    canGoBack,
+    currentStep,
+    totalSteps,
+    isFirstStep,
+    isLastStep,
+    hasPartner,
+    getPartnerImage,
+    getPartnerName,
+  };
+};
+
+export const resetFlowStore = () => {
+  if (flowStoreInstance) {
+    flowStoreInstance.getState().reset();
+  }
+  flowStoreInstance = null;
+};

package/src/infrastructure/flow/useFlowStore.ts

@@ -0,0 +1,145 @@
+/**
+ * useFlowStore
+ * Zustand store for multi-step flow state management
+ */
+
+import { createStore } from "@umituz/react-native-design-system";
+import type {
+  FlowState,
+  FlowActions,
+  CategoryData,
+  ScenarioData,
+  UploadedImageData,
+  StepDefinition,
+} from "../../domain/entities/flow-config.types";
+
+interface FlowStoreState extends FlowState {
+  stepDefinitions: readonly StepDefinition[];
+}
+
+const createInitialState = (): FlowState => ({
+  currentStepId: "",
+  currentStepIndex: 0,
+  completedSteps: [],
+  selectedCategory: undefined,
+  selectedScenario: undefined,
+  partners: {},
+  partnerNames: {},
+  textInput: undefined,
+  visualStyle: undefined,
+  selectedFeatures: {},
+  customData: {},
+  generationStatus: "idle",
+  generationProgress: 0,
+  generationResult: undefined,
+  generationError: undefined,
+});
+
+interface FlowStoreConfig {
+  steps: readonly StepDefinition[];
+  initialStepId?: string;
+}
+
+export const createFlowStore = (config: FlowStoreConfig) => {
+  const initialStepId = config.initialStepId ?? config.steps[0]?.id ?? "";
+  const initialIndex = Math.max(0, config.steps.findIndex((s) => s.id === initialStepId));
+
+  const initialState: FlowStoreState = {
+    ...createInitialState(),
+    currentStepId: initialStepId,
+    currentStepIndex: initialIndex,
+    stepDefinitions: config.steps,
+  };
+
+  return createStore<FlowStoreState, FlowActions>({
+    name: "flow_store",
+    initialState,
+    persist: false,
+    actions: (set, get) => ({
+      goToStep: (stepId: string) => {
+        const { stepDefinitions } = get();
+        const index = stepDefinitions.findIndex((s) => s.id === stepId);
+        if (index >= 0) {
+          set({ currentStepId: stepId, currentStepIndex: index, generationError: undefined });
+        }
+      },
+
+      nextStep: () => {
+        const { stepDefinitions, currentStepIndex, completedSteps, currentStepId } = get();
+        const nextIndex = currentStepIndex + 1;
+        if (nextIndex < stepDefinitions.length) {
+          const nextStep = stepDefinitions[nextIndex];
+          const newCompleted = completedSteps.includes(currentStepId)
+            ? completedSteps
+            : [...completedSteps, currentStepId];
+          set({ currentStepId: nextStep.id, currentStepIndex: nextIndex, completedSteps: newCompleted });
+        }
+      },
+
+      previousStep: () => {
+        const { stepDefinitions, currentStepIndex } = get();
+        if (currentStepIndex > 0) {
+          const prevStep = stepDefinitions[currentStepIndex - 1];
+          set({ currentStepId: prevStep.id, currentStepIndex: currentStepIndex - 1 });
+        }
+      },
+
+      setCategory: (category: CategoryData | undefined) => set({ selectedCategory: category }),
+      setScenario: (scenario: ScenarioData | undefined) => set({ selectedScenario: scenario }),
+
+      setPartnerImage: (partnerId: string, image: UploadedImageData | undefined) => {
+        const { partners } = get();
+        set({ partners: { ...partners, [partnerId]: image } });
+      },
+
+      setPartnerName: (partnerId: string, name: string) => {
+        const { partnerNames } = get();
+        set({ partnerNames: { ...partnerNames, [partnerId]: name } });
+      },
+
+      setTextInput: (text: string) => set({ textInput: text }),
+      setVisualStyle: (styleId: string) => set({ visualStyle: styleId }),
+
+      setSelectedFeatures: (featureType: string, ids: readonly string[]) => {
+        const { selectedFeatures } = get();
+        set({ selectedFeatures: { ...selectedFeatures, [featureType]: ids } });
+      },
+
+      setCustomData: (key: string, value: unknown) => {
+        const { customData } = get();
+        set({ customData: { ...customData, [key]: value } });
+      },
+
+      startGeneration: () => {
+        set({ generationStatus: "preparing", generationProgress: 0, generationError: undefined });
+      },
+
+      updateProgress: (progress: number) => {
+        set({ generationProgress: progress, generationStatus: progress > 0 ? "generating" : "preparing" });
+      },
+
+      setResult: (result: unknown) => {
+        set({ generationResult: result, generationStatus: "completed", generationProgress: 100 });
+      },
+
+      setError: (error: string) => {
+        set({ generationError: error, generationStatus: "failed", generationProgress: 0 });
+      },
+
+      reset: () => {
+        const { stepDefinitions } = get();
+        const firstStepId = stepDefinitions[0]?.id ?? "";
+        set({ ...createInitialState(), currentStepId: firstStepId, stepDefinitions });
+      },
+
+      completeStep: (stepId: string) => {
+        const { completedSteps } = get();
+        if (!completedSteps.includes(stepId)) {
+          set({ completedSteps: [...completedSteps, stepId] });
+        }
+      },
+    }),
+  });
+};
+
+export type FlowStoreType = ReturnType<typeof createFlowStore>;