@rslsp1/fa-app-tools 1.3.8 → 1.3.9

package/dist/index.d.mts

@@ -479,6 +479,6 @@ declare function hfLoadMetadata(token: string): Promise<any[]>;
 declare function hfUploadImage(base64: string, id: string, token: string, mimeType?: string): Promise<void>;
 declare function hfLoadImageAsBase64(id: string, token: string): Promise<string | null>;
 
-declare const LIB_VERSION = "1.3.8";
+declare const LIB_VERSION = "1.3.9";
 
 export { AvatarArchitectApp, type AvatarArchitectAppProps, CollapsibleCard, CompactDropdown, type ExtractedCharacter, FaToolsBadge, type FlowSdk, GLOBAL_STYLES, type Generation, type HFMetadataEntry, HistoryPanel, InspectPanel, LIB_VERSION, LabBlend, LabCompare, type LabFrame, LabImagePicker, type LabItem, LabLoop, LabRemix, type LabServices, LabsTab, ListView, type MediaItem, MediaLibrary, PillButton, type ProjectMeta, type ProjectSettings, ProjectSyncTab, PromptTab, SectionLabel, type SelectedLabImage, type SelectedTag, SetupPanel, type SyncDiff, TagManagerPanel, type TagOption, type WorkspaceTags, autoLabel, buildBlendInstruction, buildCompareInstruction, buildFallbackPrompt, buildGenerationPrompt, buildImageGenerationOptions, buildLoopInstruction, buildPromptTabPayload, buildReferenceImageMediaIds, buildRemixInstruction, buildScanInstruction, cleanAiResponse, createFlowServices, exportProjectToZip, formatTreeToMarkdown, frameToGeneration, getFormattedTimestamp, getHFToken, groupGenerationsToLabItems, hfDeleteProject, hfDownloadProject, hfListProjects, hfLoadImageAsBase64, hfLoadMetadata, hfLoadTags, hfSaveMetadata, hfSaveTags, hfUploadImage, hfUploadProjectForm, importProjectFromZip, injectXMPMetadata, interpretSdkError, parsePromptFile, parsePromptResponse, setHFToken, useKeyboardNavigation, useOnClickOutside };

package/dist/index.d.ts

@@ -479,6 +479,6 @@ declare function hfLoadMetadata(token: string): Promise<any[]>;
 declare function hfUploadImage(base64: string, id: string, token: string, mimeType?: string): Promise<void>;
 declare function hfLoadImageAsBase64(id: string, token: string): Promise<string | null>;
 
-declare const LIB_VERSION = "1.3.8";
+declare const LIB_VERSION = "1.3.9";
 
 export { AvatarArchitectApp, type AvatarArchitectAppProps, CollapsibleCard, CompactDropdown, type ExtractedCharacter, FaToolsBadge, type FlowSdk, GLOBAL_STYLES, type Generation, type HFMetadataEntry, HistoryPanel, InspectPanel, LIB_VERSION, LabBlend, LabCompare, type LabFrame, LabImagePicker, type LabItem, LabLoop, LabRemix, type LabServices, LabsTab, ListView, type MediaItem, MediaLibrary, PillButton, type ProjectMeta, type ProjectSettings, ProjectSyncTab, PromptTab, SectionLabel, type SelectedLabImage, type SelectedTag, SetupPanel, type SyncDiff, TagManagerPanel, type TagOption, type WorkspaceTags, autoLabel, buildBlendInstruction, buildCompareInstruction, buildFallbackPrompt, buildGenerationPrompt, buildImageGenerationOptions, buildLoopInstruction, buildPromptTabPayload, buildReferenceImageMediaIds, buildRemixInstruction, buildScanInstruction, cleanAiResponse, createFlowServices, exportProjectToZip, formatTreeToMarkdown, frameToGeneration, getFormattedTimestamp, getHFToken, groupGenerationsToLabItems, hfDeleteProject, hfDownloadProject, hfListProjects, hfLoadImageAsBase64, hfLoadMetadata, hfLoadTags, hfSaveMetadata, hfSaveTags, hfUploadImage, hfUploadProjectForm, importProjectFromZip, injectXMPMetadata, interpretSdkError, parsePromptFile, parsePromptResponse, setHFToken, useKeyboardNavigation, useOnClickOutside };

package/dist/index.js

@@ -4024,13 +4024,15 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
   (0, import_react21.useEffect)(() => {
     if (activeTab === "setup" || activeTab === "sync") fetchServerProjects();
   }, [activeTab]);
-  (0, import_react21.useEffect)(() => {
-    if (!hfToken) return;
-    hfLoadTags(hfToken).then((tags) => {
-      if (tags?.by_category) setWorkspaceTags(tags);
-    }).catch(() => {
-    });
-    hfLoadMetadata(hfToken).then(async (entries) => {
+  const [isHfRefreshing, setIsHfRefreshing] = (0, import_react21.useState)(false);
+  const loadFromHF = (0, import_react21.useCallback)(async (token) => {
+    setIsHfRefreshing(true);
+    try {
+      hfLoadTags(token).then((tags) => {
+        if (tags?.by_category) setWorkspaceTags(tags);
+      }).catch(() => {
+      });
+      const entries = await hfLoadMetadata(token);
       if (!Array.isArray(entries) || entries.length === 0) return;
       setHfMetadata(entries);
       const skeletons = entries.map((e) => ({
@@ -4047,20 +4049,20 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
       setHistory(skeletons);
       if (skeletons.length > 0) setCurrentResult(skeletons[0]);
       for (const entry of entries) {
-        hfLoadImageAsBase64(entry.id, hfToken).then((b64) => {
+        hfLoadImageAsBase64(entry.id, token).then((b64) => {
           if (!b64) return;
           const prefix = `data:${entry.mimeType || "image/jpeg"};base64,`;
-          setGalleryItems((prev) => prev.map(
-            (g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g
-          ));
-          setHistory((prev) => prev.map(
-            (g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g
-          ));
+          setGalleryItems((prev) => prev.map((g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g));
+          setHistory((prev) => prev.map((g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g));
         }).catch(() => {
         });
       }
-    }).catch(() => {
-    });
+    } finally {
+      setIsHfRefreshing(false);
+    }
+  }, []);
+  (0, import_react21.useEffect)(() => {
+    if (hfToken) loadFromHF(hfToken);
   }, [hfToken]);
   (0, import_react21.useEffect)(() => {
     if (!hfToken || !workspaceTags) return;
@@ -4411,7 +4413,10 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
         ] })
       ] }),
       mobileTab === "browse" && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col flex-1 min-h-0", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: ["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => setActiveTab(tab), className: `flex-1 flex items-center justify-center gap-1.5 transition-colors text-[11px] font-bold uppercase tracking-wide ${activeTab === tab ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : "info" }) }, tab)) }),
+        /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
+          ["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => setActiveTab(tab), className: `flex-1 flex items-center justify-center gap-1.5 transition-colors text-[11px] font-bold uppercase tracking-wide ${activeTab === tab ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : "info" }) }, tab)),
+          hfToken && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => loadFromHF(hfToken), disabled: isHfRefreshing, className: "w-12 flex items-center justify-center text-white/20 active:text-white transition-colors disabled:opacity-30", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: `material-symbols-outlined text-[20px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) })
+        ] }),
         /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
           activeTab === "history" && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: (g) => {
             setCurrentResult(g);
@@ -4800,6 +4805,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           setActiveTab(tab);
           setIsRightCollapsed(false);
         }, className: `flex-1 flex items-center justify-center relative transition-colors ${activeTab === tab ? "text-white" : "text-white/20"}`, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : tab === "inspect" ? "info" : tab === "setup" ? "settings" : tab === "sync" ? "cloud_sync" : "label" }) }, tab)) }),
+        hfToken && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => loadFromHF(hfToken), disabled: isHfRefreshing, className: "w-10 flex items-center justify-center text-white/20 hover:text-white/60 transition-colors disabled:opacity-30", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: `material-symbols-outlined text-[18px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) }),
         /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => setIsRightCollapsed(!isRightCollapsed), className: "w-10 flex items-center justify-center text-white/20 hover:text-white", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[18px]", children: isRightCollapsed ? "chevron_left" : "chevron_right" }) })
       ] }),
       !isRightCollapsed && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
@@ -4865,7 +4871,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
 
 // src/index.ts
 init_hfStateService();
-var LIB_VERSION = "1.3.8";
+var LIB_VERSION = "1.3.9";
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   AvatarArchitectApp,

package/dist/index.mjs

@@ -3467,13 +3467,15 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
   useEffect5(() => {
     if (activeTab === "setup" || activeTab === "sync") fetchServerProjects();
   }, [activeTab]);
-  useEffect5(() => {
-    if (!hfToken) return;
-    hfLoadTags(hfToken).then((tags) => {
-      if (tags?.by_category) setWorkspaceTags(tags);
-    }).catch(() => {
-    });
-    hfLoadMetadata(hfToken).then(async (entries) => {
+  const [isHfRefreshing, setIsHfRefreshing] = useState14(false);
+  const loadFromHF = useCallback(async (token) => {
+    setIsHfRefreshing(true);
+    try {
+      hfLoadTags(token).then((tags) => {
+        if (tags?.by_category) setWorkspaceTags(tags);
+      }).catch(() => {
+      });
+      const entries = await hfLoadMetadata(token);
       if (!Array.isArray(entries) || entries.length === 0) return;
       setHfMetadata(entries);
       const skeletons = entries.map((e) => ({
@@ -3490,20 +3492,20 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
       setHistory(skeletons);
       if (skeletons.length > 0) setCurrentResult(skeletons[0]);
       for (const entry of entries) {
-        hfLoadImageAsBase64(entry.id, hfToken).then((b64) => {
+        hfLoadImageAsBase64(entry.id, token).then((b64) => {
           if (!b64) return;
           const prefix = `data:${entry.mimeType || "image/jpeg"};base64,`;
-          setGalleryItems((prev) => prev.map(
-            (g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g
-          ));
-          setHistory((prev) => prev.map(
-            (g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g
-          ));
+          setGalleryItems((prev) => prev.map((g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g));
+          setHistory((prev) => prev.map((g) => g.id === entry.id ? { ...g, base64: prefix + b64 } : g));
         }).catch(() => {
         });
       }
-    }).catch(() => {
-    });
+    } finally {
+      setIsHfRefreshing(false);
+    }
+  }, []);
+  useEffect5(() => {
+    if (hfToken) loadFromHF(hfToken);
   }, [hfToken]);
   useEffect5(() => {
     if (!hfToken || !workspaceTags) return;
@@ -3854,7 +3856,10 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
         ] })
       ] }),
       mobileTab === "browse" && /* @__PURE__ */ jsxs18("div", { className: "flex flex-col flex-1 min-h-0", children: [
-        /* @__PURE__ */ jsx20("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: ["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */ jsx20("button", { onClick: () => setActiveTab(tab), className: `flex-1 flex items-center justify-center gap-1.5 transition-colors text-[11px] font-bold uppercase tracking-wide ${activeTab === tab ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : "info" }) }, tab)) }),
+        /* @__PURE__ */ jsxs18("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
+          ["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */ jsx20("button", { onClick: () => setActiveTab(tab), className: `flex-1 flex items-center justify-center gap-1.5 transition-colors text-[11px] font-bold uppercase tracking-wide ${activeTab === tab ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : "info" }) }, tab)),
+          hfToken && /* @__PURE__ */ jsx20("button", { onClick: () => loadFromHF(hfToken), disabled: isHfRefreshing, className: "w-12 flex items-center justify-center text-white/20 active:text-white transition-colors disabled:opacity-30", children: /* @__PURE__ */ jsx20("span", { className: `material-symbols-outlined text-[20px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) })
+        ] }),
         /* @__PURE__ */ jsxs18("div", { className: "flex-1 overflow-hidden relative", children: [
           activeTab === "history" && /* @__PURE__ */ jsx20(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: (g) => {
             setCurrentResult(g);
@@ -4243,6 +4248,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
           setActiveTab(tab);
           setIsRightCollapsed(false);
         }, className: `flex-1 flex items-center justify-center relative transition-colors ${activeTab === tab ? "text-white" : "text-white/20"}`, children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : tab === "inspect" ? "info" : tab === "setup" ? "settings" : tab === "sync" ? "cloud_sync" : "label" }) }, tab)) }),
+        hfToken && /* @__PURE__ */ jsx20("button", { onClick: () => loadFromHF(hfToken), disabled: isHfRefreshing, className: "w-10 flex items-center justify-center text-white/20 hover:text-white/60 transition-colors disabled:opacity-30", children: /* @__PURE__ */ jsx20("span", { className: `material-symbols-outlined text-[18px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) }),
         /* @__PURE__ */ jsx20("button", { onClick: () => setIsRightCollapsed(!isRightCollapsed), className: "w-10 flex items-center justify-center text-white/20 hover:text-white", children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[18px]", children: isRightCollapsed ? "chevron_left" : "chevron_right" }) })
       ] }),
       !isRightCollapsed && /* @__PURE__ */ jsxs18("div", { className: "flex-1 overflow-hidden relative", children: [
@@ -4307,7 +4313,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
 }
 
 // src/index.ts
-var LIB_VERSION = "1.3.8";
+var LIB_VERSION = "1.3.9";
 export {
   AvatarArchitectApp,
   CollapsibleCard,

package/package.json

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