@rslsp1/fa-app-tools 1.1.1 → 1.1.3

package/dist/index.d.mts

@@ -93,13 +93,21 @@ declare function parsePromptResponse(raw: string): {
     prompt: string;
     feedback: string | null;
 };
+interface FlowSdkImage {
+    base64: string;
+    mimeType: string;
+}
 interface FlowSdk {
     generate: {
         image: (options: Record<string, any>) => Promise<{
             base64: string;
             mediaId: string;
         }>;
-        text: (prompt: string, options?: Record<string, any>) => Promise<{
+        text: (prompt: string, options?: {
+            systemInstruction?: string;
+            thinkingLevel?: string;
+            images?: FlowSdkImage[];
+        }) => Promise<{
             text: string;
         }>;
     };
@@ -119,7 +127,7 @@ declare function createFlowServices(Flow: FlowSdk): {
         base64: string;
         mediaId: string;
     }>;
-    generateText: (hierarchyText: string, mode?: "literal" | "creative") => Promise<string>;
+    generateText: (hierarchyText: string, mode?: "literal" | "creative" | "scan", images?: FlowSdkImage[]) => Promise<string>;
 };
 declare function interpretSdkError(err: any): Error;
 
@@ -233,7 +241,10 @@ interface AvatarArchitectAppProps {
         base64: string;
         mediaId?: string;
     }>;
-    onGeneratePrompt: (text: string) => Promise<string>;
+    onGeneratePrompt: (text: string, mode?: string, images?: {
+        base64: string;
+        mimeType: string;
+    }[]) => Promise<string>;
     onDownload: (base64: string, mimeType: string, filename: string) => Promise<void>;
     onSelectMedia: () => Promise<MediaItem[]>;
     buildInfo?: string;
@@ -297,6 +308,6 @@ interface ProjectSyncTabProps {
 }
 declare const ProjectSyncTab: React.FC<ProjectSyncTabProps>;
 
-declare const LIB_VERSION = "1.1.1";
+declare const LIB_VERSION = "1.1.3";
 
 export { AvatarArchitectApp, type AvatarArchitectAppProps, CollapsibleCard, CompactDropdown, type ExtractedCharacter, FaToolsBadge, type FlowSdk, GLOBAL_STYLES, type Generation, HistoryPanel, InspectPanel, LIB_VERSION, ListView, type MediaItem, MediaLibrary, PillButton, type ProjectMeta, type ProjectSettings, ProjectSyncTab, PromptTab, SectionLabel, type SelectedTag, SetupPanel, type SyncDiff, type TagOption, type WorkspaceTags, buildFallbackPrompt, buildGenerationPrompt, buildImageGenerationOptions, buildPromptTabPayload, cleanAiResponse, createFlowServices, exportProjectToZip, formatTreeToMarkdown, getFormattedTimestamp, importProjectFromZip, injectXMPMetadata, interpretSdkError, parsePromptFile, parsePromptResponse, useKeyboardNavigation, useOnClickOutside };

package/dist/index.d.ts

@@ -93,13 +93,21 @@ declare function parsePromptResponse(raw: string): {
     prompt: string;
     feedback: string | null;
 };
+interface FlowSdkImage {
+    base64: string;
+    mimeType: string;
+}
 interface FlowSdk {
     generate: {
         image: (options: Record<string, any>) => Promise<{
             base64: string;
             mediaId: string;
         }>;
-        text: (prompt: string, options?: Record<string, any>) => Promise<{
+        text: (prompt: string, options?: {
+            systemInstruction?: string;
+            thinkingLevel?: string;
+            images?: FlowSdkImage[];
+        }) => Promise<{
             text: string;
         }>;
     };
@@ -119,7 +127,7 @@ declare function createFlowServices(Flow: FlowSdk): {
         base64: string;
         mediaId: string;
     }>;
-    generateText: (hierarchyText: string, mode?: "literal" | "creative") => Promise<string>;
+    generateText: (hierarchyText: string, mode?: "literal" | "creative" | "scan", images?: FlowSdkImage[]) => Promise<string>;
 };
 declare function interpretSdkError(err: any): Error;
 
@@ -233,7 +241,10 @@ interface AvatarArchitectAppProps {
         base64: string;
         mediaId?: string;
     }>;
-    onGeneratePrompt: (text: string) => Promise<string>;
+    onGeneratePrompt: (text: string, mode?: string, images?: {
+        base64: string;
+        mimeType: string;
+    }[]) => Promise<string>;
     onDownload: (base64: string, mimeType: string, filename: string) => Promise<void>;
     onSelectMedia: () => Promise<MediaItem[]>;
     buildInfo?: string;
@@ -297,6 +308,6 @@ interface ProjectSyncTabProps {
 }
 declare const ProjectSyncTab: React.FC<ProjectSyncTabProps>;
 
-declare const LIB_VERSION = "1.1.1";
+declare const LIB_VERSION = "1.1.3";
 
 export { AvatarArchitectApp, type AvatarArchitectAppProps, CollapsibleCard, CompactDropdown, type ExtractedCharacter, FaToolsBadge, type FlowSdk, GLOBAL_STYLES, type Generation, HistoryPanel, InspectPanel, LIB_VERSION, ListView, type MediaItem, MediaLibrary, PillButton, type ProjectMeta, type ProjectSettings, ProjectSyncTab, PromptTab, SectionLabel, type SelectedTag, SetupPanel, type SyncDiff, type TagOption, type WorkspaceTags, buildFallbackPrompt, buildGenerationPrompt, buildImageGenerationOptions, buildPromptTabPayload, cleanAiResponse, createFlowServices, exportProjectToZip, formatTreeToMarkdown, getFormattedTimestamp, importProjectFromZip, injectXMPMetadata, interpretSdkError, parsePromptFile, parsePromptResponse, useKeyboardNavigation, useOnClickOutside };

package/dist/index.js

@@ -428,7 +428,24 @@ function createFlowServices(Flow) {
         throw interpretSdkError(err);
       }
     },
-    generateText: async (hierarchyText, mode = "creative") => {
+    generateText: async (hierarchyText, mode = "creative", images) => {
+      if (mode === "scan" && images?.length) {
+        try {
+          const response = await Flow.generate.text(
+            "Analyze this image and create a detailed image generation prompt that would recreate it. Focus on: subject, style, lighting, composition, color palette, mood, and technical quality. Output ONLY the prompt string, no explanations.",
+            {
+              thinkingLevel: "low",
+              systemInstruction: "You are an expert image analyst and prompt engineer. Always return ONLY the generation prompt, no headers, no quotes, no conversational filler.",
+              images
+            }
+          );
+          const result = response?.text?.trim() || "";
+          if (!result) throw new Error("Empty AI response");
+          return cleanAiResponse(result);
+        } catch (err) {
+          throw interpretSdkError(err);
+        }
+      }
       const prompt = buildGenerationPrompt(hierarchyText, mode);
       try {
         const response = await Flow.generate.text(prompt, {
@@ -1717,6 +1734,9 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
       return false;
     }
   });
+  const [activeReferenceId, setActiveReferenceId] = (0, import_react14.useState)(null);
+  const [activeReferenceThumbnail, setActiveReferenceThumbnail] = (0, import_react14.useState)(null);
+  const [isScanningImage, setIsScanningImage] = (0, import_react14.useState)(false);
   const [touchStartX, setTouchStartX] = (0, import_react14.useState)(null);
   const [isFullscreen, setIsFullscreen] = (0, import_react14.useState)(false);
   const [zoomScale, setZoomScale] = (0, import_react14.useState)(1);
@@ -1773,6 +1793,36 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
     } catch {
     }
   };
+  const handleSelectReference = async () => {
+    const media = await onSelectMedia();
+    if (!media?.length) return;
+    const first = media[0];
+    if (first.mediaId) {
+      setActiveReferenceId(first.mediaId);
+      setActiveReferenceThumbnail(`data:${first.mimeType};base64,${first.base64}`);
+    }
+  };
+  const clearReference = () => {
+    setActiveReferenceId(null);
+    setActiveReferenceThumbnail(null);
+  };
+  const handleScanImage = async (file) => {
+    setIsScanningImage(true);
+    try {
+      const base64 = await new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onloadend = () => resolve(reader.result.split(",")[1]);
+        reader.onerror = reject;
+        reader.readAsDataURL(file);
+      });
+      const prompt = await onGeneratePrompt("", "scan", [{ base64, mimeType: file.type || "image/png" }]);
+      setActivePrompt(prompt);
+    } catch (err) {
+      console.error("Scan fehlgeschlagen:", err);
+    } finally {
+      setIsScanningImage(false);
+    }
+  };
   const currentIndex = (0, import_react14.useMemo)(() => history.findIndex((h) => h.id === currentResult?.id), [history, currentResult]);
   const goToPrev = (0, import_react14.useCallback)(() => {
     if (currentIndex > 0) setCurrentResult(history[currentIndex - 1]);
@@ -1814,7 +1864,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
     if (!options.silent) setCurrentResult(newGen);
     if (seedMode === "random") setSeed(activeSeed);
     try {
-      const { base64, mediaId } = await onGenerateImage(buildImageGenerationOptions(promptToUse, aspectRatio, selectedModel, useReferenceId));
+      const { base64, mediaId } = await onGenerateImage(buildImageGenerationOptions(promptToUse, aspectRatio, selectedModel, useReferenceId ?? activeReferenceId ?? void 0));
       const finishedGen = { ...newGen, status: "done", base64: `data:image/png;base64,${base64}`, mediaId };
       setHistory((prev) => prev.map((g) => g.id === genId ? finishedGen : g));
       setGalleryItems((prev) => [finishedGen, ...prev]);
@@ -2205,6 +2255,11 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] }),
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "flex-1" }),
+          activeReferenceThumbnail ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden mr-2", style: { height: 28 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 active:text-white/80 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { onClick: handleSelectReference, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "add_photo_alternate" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { onClick: toggleContrast, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: highContrast ? "light_mode" : "dark_mode" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { onClick: () => setShowStart(true), className: "text-white/20 active:text-white/60 transition-colors mr-1", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "desktop_windows" }) })
         ] }),
@@ -2387,7 +2442,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           leftTab === "prompt" && workspaceTags && activeTab !== "setup" && activeTab !== "sync" && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => {
             handleGenerateImage(prompt);
             setMobileTab("stage");
-          }, onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete }),
+          }, onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage }),
           activeTab === "setup" && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
           activeTab === "sync" && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
             ProjectSyncTab,
@@ -2563,7 +2618,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
             isGeneratingNodeId: (id) => isSynthesizing && focusedNodeId === id
           }
         ) }),
-        leftTab === "prompt" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => handleGenerateImage(prompt), onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete })
+        leftTab === "prompt" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => handleGenerateImage(prompt), onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage })
       ] })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex-1 flex flex-col bg-[#0b0b0b] overflow-hidden", children: [
@@ -2573,6 +2628,14 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-2", children: [
+          activeReferenceThumbnail ? /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden", style: { height: 28 }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 hover:text-white/80 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
+          ] }) : /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("button", { onClick: handleSelectReference, className: "flex items-center gap-1 h-7 px-2 rounded-lg border border-white/10 text-white/30 hover:text-white/60 hover:border-white/20 transition-colors text-[10px] font-bold uppercase tracking-wide", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "add_photo_alternate" }),
+            /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: "Ref" })
+          ] }),
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("button", { onClick: () => setIsPromptCollapsed(!isPromptCollapsed), className: "text-white/40 hover:text-white transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { className: "material-symbols-outlined", children: isPromptCollapsed ? "expand_more" : "expand_less" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(PillButton, { variant: "solid", icon: "bolt", loading: isGenerating, disabled: !activePrompt.trim(), onClick: () => handleGenerateImage(), children: "Generieren" })
         ] })
@@ -2659,7 +2722,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
 }
 
 // src/index.ts
-var LIB_VERSION = "1.1.1";
+var LIB_VERSION = "1.1.3";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AvatarArchitectApp,

package/dist/index.mjs

@@ -362,7 +362,24 @@ function createFlowServices(Flow) {
         throw interpretSdkError(err);
       }
     },
-    generateText: async (hierarchyText, mode = "creative") => {
+    generateText: async (hierarchyText, mode = "creative", images) => {
+      if (mode === "scan" && images?.length) {
+        try {
+          const response = await Flow.generate.text(
+            "Analyze this image and create a detailed image generation prompt that would recreate it. Focus on: subject, style, lighting, composition, color palette, mood, and technical quality. Output ONLY the prompt string, no explanations.",
+            {
+              thinkingLevel: "low",
+              systemInstruction: "You are an expert image analyst and prompt engineer. Always return ONLY the generation prompt, no headers, no quotes, no conversational filler.",
+              images
+            }
+          );
+          const result = response?.text?.trim() || "";
+          if (!result) throw new Error("Empty AI response");
+          return cleanAiResponse(result);
+        } catch (err) {
+          throw interpretSdkError(err);
+        }
+      }
       const prompt = buildGenerationPrompt(hierarchyText, mode);
       try {
         const response = await Flow.generate.text(prompt, {
@@ -1651,6 +1668,9 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
       return false;
     }
   });
+  const [activeReferenceId, setActiveReferenceId] = useState6(null);
+  const [activeReferenceThumbnail, setActiveReferenceThumbnail] = useState6(null);
+  const [isScanningImage, setIsScanningImage] = useState6(false);
   const [touchStartX, setTouchStartX] = useState6(null);
   const [isFullscreen, setIsFullscreen] = useState6(false);
   const [zoomScale, setZoomScale] = useState6(1);
@@ -1707,6 +1727,36 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
     } catch {
     }
   };
+  const handleSelectReference = async () => {
+    const media = await onSelectMedia();
+    if (!media?.length) return;
+    const first = media[0];
+    if (first.mediaId) {
+      setActiveReferenceId(first.mediaId);
+      setActiveReferenceThumbnail(`data:${first.mimeType};base64,${first.base64}`);
+    }
+  };
+  const clearReference = () => {
+    setActiveReferenceId(null);
+    setActiveReferenceThumbnail(null);
+  };
+  const handleScanImage = async (file) => {
+    setIsScanningImage(true);
+    try {
+      const base64 = await new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.onloadend = () => resolve(reader.result.split(",")[1]);
+        reader.onerror = reject;
+        reader.readAsDataURL(file);
+      });
+      const prompt = await onGeneratePrompt("", "scan", [{ base64, mimeType: file.type || "image/png" }]);
+      setActivePrompt(prompt);
+    } catch (err) {
+      console.error("Scan fehlgeschlagen:", err);
+    } finally {
+      setIsScanningImage(false);
+    }
+  };
   const currentIndex = useMemo2(() => history.findIndex((h) => h.id === currentResult?.id), [history, currentResult]);
   const goToPrev = useCallback(() => {
     if (currentIndex > 0) setCurrentResult(history[currentIndex - 1]);
@@ -1748,7 +1798,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
     if (!options.silent) setCurrentResult(newGen);
     if (seedMode === "random") setSeed(activeSeed);
     try {
-      const { base64, mediaId } = await onGenerateImage(buildImageGenerationOptions(promptToUse, aspectRatio, selectedModel, useReferenceId));
+      const { base64, mediaId } = await onGenerateImage(buildImageGenerationOptions(promptToUse, aspectRatio, selectedModel, useReferenceId ?? activeReferenceId ?? void 0));
       const finishedGen = { ...newGen, status: "done", base64: `data:image/png;base64,${base64}`, mediaId };
       setHistory((prev) => prev.map((g) => g.id === genId ? finishedGen : g));
       setGalleryItems((prev) => [finishedGen, ...prev]);
@@ -2139,6 +2189,11 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           /* @__PURE__ */ jsx13(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
           /* @__PURE__ */ jsx13(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] }),
           /* @__PURE__ */ jsx13("div", { className: "flex-1" }),
+          activeReferenceThumbnail ? /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden mr-2", style: { height: 28 }, children: [
+            /* @__PURE__ */ jsx13("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
+            /* @__PURE__ */ jsx13("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
+            /* @__PURE__ */ jsx13("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 active:text-white/80 transition-colors", children: /* @__PURE__ */ jsx13("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
+          ] }) : /* @__PURE__ */ jsx13("button", { onClick: handleSelectReference, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ jsx13("span", { className: "material-symbols-outlined text-[20px]", children: "add_photo_alternate" }) }),
           /* @__PURE__ */ jsx13("button", { onClick: toggleContrast, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ jsx13("span", { className: "material-symbols-outlined text-[20px]", children: highContrast ? "light_mode" : "dark_mode" }) }),
           /* @__PURE__ */ jsx13("button", { onClick: () => setShowStart(true), className: "text-white/20 active:text-white/60 transition-colors mr-1", children: /* @__PURE__ */ jsx13("span", { className: "material-symbols-outlined text-[20px]", children: "desktop_windows" }) })
         ] }),
@@ -2321,7 +2376,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           leftTab === "prompt" && workspaceTags && activeTab !== "setup" && activeTab !== "sync" && /* @__PURE__ */ jsx13(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => {
             handleGenerateImage(prompt);
             setMobileTab("stage");
-          }, onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete }),
+          }, onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage }),
           activeTab === "setup" && /* @__PURE__ */ jsx13(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
           activeTab === "sync" && /* @__PURE__ */ jsx13(
             ProjectSyncTab,
@@ -2497,7 +2552,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
             isGeneratingNodeId: (id) => isSynthesizing && focusedNodeId === id
           }
         ) }),
-        leftTab === "prompt" && workspaceTags && /* @__PURE__ */ jsx13(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => handleGenerateImage(prompt), onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete })
+        leftTab === "prompt" && workspaceTags && /* @__PURE__ */ jsx13(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => handleGenerateImage(prompt), onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage })
       ] })
     ] }),
     /* @__PURE__ */ jsxs11("div", { className: "flex-1 flex flex-col bg-[#0b0b0b] overflow-hidden", children: [
@@ -2507,6 +2562,14 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           /* @__PURE__ */ jsx13(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] })
         ] }),
         /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-2", children: [
+          activeReferenceThumbnail ? /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden", style: { height: 28 }, children: [
+            /* @__PURE__ */ jsx13("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
+            /* @__PURE__ */ jsx13("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
+            /* @__PURE__ */ jsx13("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 hover:text-white/80 transition-colors", children: /* @__PURE__ */ jsx13("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
+          ] }) : /* @__PURE__ */ jsxs11("button", { onClick: handleSelectReference, className: "flex items-center gap-1 h-7 px-2 rounded-lg border border-white/10 text-white/30 hover:text-white/60 hover:border-white/20 transition-colors text-[10px] font-bold uppercase tracking-wide", children: [
+            /* @__PURE__ */ jsx13("span", { className: "material-symbols-outlined text-[14px]", children: "add_photo_alternate" }),
+            /* @__PURE__ */ jsx13("span", { children: "Ref" })
+          ] }),
           /* @__PURE__ */ jsx13("button", { onClick: () => setIsPromptCollapsed(!isPromptCollapsed), className: "text-white/40 hover:text-white transition-colors", children: /* @__PURE__ */ jsx13("span", { className: "material-symbols-outlined", children: isPromptCollapsed ? "expand_more" : "expand_less" }) }),
           /* @__PURE__ */ jsx13(PillButton, { variant: "solid", icon: "bolt", loading: isGenerating, disabled: !activePrompt.trim(), onClick: () => handleGenerateImage(), children: "Generieren" })
         ] })
@@ -2593,7 +2656,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
 }
 
 // src/index.ts
-var LIB_VERSION = "1.1.1";
+var LIB_VERSION = "1.1.3";
 export {
   AvatarArchitectApp,
   CollapsibleCard,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rslsp1/fa-app-tools",
-  "version": "1.1.1",
+  "version": "1.1.3",
   "description": "Shared tools and hooks for Fine Art flow apps",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",