@rslsp1/fa-app-tools 2.0.21 → 2.0.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{chunk-I73HODO5.mjs → chunk-UCEQOGPT.mjs} +23 -19
- package/dist/{hfStateService-PDBVLFML.mjs → hfStateService-TC65WQXK.mjs} +1 -1
- package/dist/index.d.mts +17 -3
- package/dist/index.d.ts +17 -3
- package/dist/index.js +791 -519
- package/dist/index.mjs +761 -494
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -21,7 +21,7 @@ import {
|
|
|
21
21
|
setHFToken,
|
|
22
22
|
tsFromEventPath,
|
|
23
23
|
writeHFEvent
|
|
24
|
-
} from "./chunk-
|
|
24
|
+
} from "./chunk-UCEQOGPT.mjs";
|
|
25
25
|
|
|
26
26
|
// src/hooks/useOnClickOutside.ts
|
|
27
27
|
import { useEffect } from "react";
|
|
@@ -681,7 +681,10 @@ var MediaLibrary = ({ items, onImport, onDelete, onSelect, onToggleSelection, on
|
|
|
681
681
|
/* @__PURE__ */ jsx8("p", { className: "text-[10px] italic", children: "Importiere Assets aus deinem Projekt." })
|
|
682
682
|
] })
|
|
683
683
|
] }) : /* @__PURE__ */ jsx8("div", { className: "grid grid-cols-2 gap-3 pb-10", children: items.map((item) => /* @__PURE__ */ jsxs6(motion4.div, { initial: { opacity: 0, scale: 0.9 }, animate: { opacity: 1, scale: 1 }, className: `relative aspect-square group/item rounded-xl overflow-hidden border transition-all bg-white/5 cursor-pointer shadow-lg ${item.selectedForExport ? "border-blue-500 shadow-[0_0_15px_rgba(59,130,246,0.2)]" : "border-white/10 opacity-70 hover:opacity-100"}`, onClick: () => onSelect?.(item), children: [
|
|
684
|
-
|
|
684
|
+
item.status === "processing" ? /* @__PURE__ */ jsxs6("div", { className: "w-full h-full flex flex-col items-center justify-center gap-2 bg-black/40", children: [
|
|
685
|
+
/* @__PURE__ */ jsx8("div", { className: "w-6 h-6 border-t-2 border-white rounded-full animate-spin" }),
|
|
686
|
+
/* @__PURE__ */ jsx8("span", { className: "text-[8px] text-white/40 uppercase font-bold tracking-widest", children: "Generiere\u2026" })
|
|
687
|
+
] }) : /* @__PURE__ */ jsx8("img", { src: item.base64 ? item.base64.startsWith("data:") ? item.base64 : `data:image/png;base64,${item.base64}` : "", className: "w-full h-full object-cover transition-transform duration-500 group-hover/item:scale-110", alt: item.prompt }),
|
|
685
688
|
/* @__PURE__ */ jsx8("button", { type: "button", className: `absolute top-2 left-2 w-5 h-5 rounded-md border flex items-center justify-center transition-all z-30 pointer-events-auto ${item.selectedForExport ? "bg-blue-500 border-blue-400" : "bg-black/60 border-white/20"}`, onClick: (e) => {
|
|
686
689
|
e.stopPropagation();
|
|
687
690
|
onToggleSelection?.(item.id);
|
|
@@ -798,7 +801,7 @@ function ListView({ nodes, edges, onNodeChange, onAddChild, onDeleteNode, onMove
|
|
|
798
801
|
}
|
|
799
802
|
|
|
800
803
|
// src/components/AvatarArchitectApp.tsx
|
|
801
|
-
import { useState as
|
|
804
|
+
import { useState as useState17, useCallback as useCallback3, useMemo as useMemo2, useEffect as useEffect6, useRef as useRef8 } from "react";
|
|
802
805
|
|
|
803
806
|
// src/components/PromptTab.tsx
|
|
804
807
|
import { useRef as useRef4, useState as useState5 } from "react";
|
|
@@ -1598,7 +1601,7 @@ var ProjectSyncTab = ({
|
|
|
1598
1601
|
{
|
|
1599
1602
|
onClick: async () => {
|
|
1600
1603
|
try {
|
|
1601
|
-
const { hfDownloadProject: hfDownloadProject2 } = await import("./hfStateService-
|
|
1604
|
+
const { hfDownloadProject: hfDownloadProject2 } = await import("./hfStateService-TC65WQXK.mjs");
|
|
1602
1605
|
const file = await hfDownloadProject2(p.path, hfToken);
|
|
1603
1606
|
onHfLoad(file);
|
|
1604
1607
|
} catch (e) {
|
|
@@ -2082,7 +2085,7 @@ function useHFState(token, namespace) {
|
|
|
2082
2085
|
}
|
|
2083
2086
|
|
|
2084
2087
|
// src/components/labs/LabsTab.tsx
|
|
2085
|
-
import { useState as
|
|
2088
|
+
import { useState as useState14 } from "react";
|
|
2086
2089
|
|
|
2087
2090
|
// src/components/labs/LabRemix.tsx
|
|
2088
2091
|
import { useState as useState9 } from "react";
|
|
@@ -2920,52 +2923,313 @@ var LabLoop = ({ services, onResult }) => {
|
|
|
2920
2923
|
] });
|
|
2921
2924
|
};
|
|
2922
2925
|
|
|
2923
|
-
// src/components/labs/
|
|
2926
|
+
// src/components/labs/LabFrameExtractor.tsx
|
|
2927
|
+
import { useRef as useRef7, useState as useState13, useCallback as useCallback2 } from "react";
|
|
2924
2928
|
import { jsx as jsx18, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2925
|
-
var
|
|
2929
|
+
var formatTime = (s) => {
|
|
2930
|
+
const m = Math.floor(s / 60);
|
|
2931
|
+
const sec = (s % 60).toFixed(1);
|
|
2932
|
+
return `${m}:${sec.padStart(4, "0")}`;
|
|
2933
|
+
};
|
|
2934
|
+
var MAX_FRAMES = 40;
|
|
2935
|
+
var INTERVAL_OPTIONS = ["0.5", "1", "2", "5", "10"];
|
|
2936
|
+
var LabFrameExtractor = ({
|
|
2937
|
+
videoItems,
|
|
2938
|
+
onResult,
|
|
2939
|
+
resolveVideoUrl
|
|
2940
|
+
}) => {
|
|
2941
|
+
const videoRef = useRef7(null);
|
|
2942
|
+
const canvasRef = useRef7(null);
|
|
2943
|
+
const cancelledRef = useRef7(false);
|
|
2944
|
+
const [selectedItem, setSelectedItem] = useState13(null);
|
|
2945
|
+
const [videoSrc, setVideoSrc] = useState13(null);
|
|
2946
|
+
const [videoReady, setVideoReady] = useState13(false);
|
|
2947
|
+
const [frames, setFrames] = useState13([]);
|
|
2948
|
+
const [isExtracting, setIsExtracting] = useState13(false);
|
|
2949
|
+
const [intervalSec, setIntervalSec] = useState13("1");
|
|
2950
|
+
const handleVideoSelect = (item) => {
|
|
2951
|
+
const mediaId = item.frames[0]?.mediaId;
|
|
2952
|
+
if (!mediaId) return;
|
|
2953
|
+
setSelectedItem(item);
|
|
2954
|
+
setVideoSrc(resolveVideoUrl(mediaId));
|
|
2955
|
+
setFrames([]);
|
|
2956
|
+
setVideoReady(false);
|
|
2957
|
+
cancelledRef.current = false;
|
|
2958
|
+
};
|
|
2959
|
+
const captureAt = useCallback2(
|
|
2960
|
+
(t, label) => new Promise((resolve) => {
|
|
2961
|
+
const video = videoRef.current;
|
|
2962
|
+
const canvas = canvasRef.current;
|
|
2963
|
+
if (!video || !canvas || !isFinite(video.duration)) return resolve(null);
|
|
2964
|
+
const onSeeked = () => {
|
|
2965
|
+
canvas.width = video.videoWidth;
|
|
2966
|
+
canvas.height = video.videoHeight;
|
|
2967
|
+
const ctx = canvas.getContext("2d");
|
|
2968
|
+
if (!ctx) return resolve(null);
|
|
2969
|
+
ctx.drawImage(video, 0, 0);
|
|
2970
|
+
resolve({
|
|
2971
|
+
id: `fe-${Date.now()}-${Math.random().toString(36).slice(2, 5)}`,
|
|
2972
|
+
dataUrl: canvas.toDataURL("image/png"),
|
|
2973
|
+
timeSeconds: t,
|
|
2974
|
+
label
|
|
2975
|
+
});
|
|
2976
|
+
};
|
|
2977
|
+
video.addEventListener("seeked", onSeeked, { once: true });
|
|
2978
|
+
video.currentTime = t;
|
|
2979
|
+
}),
|
|
2980
|
+
[]
|
|
2981
|
+
);
|
|
2982
|
+
const extractSingle = async (mode) => {
|
|
2983
|
+
const v = videoRef.current;
|
|
2984
|
+
if (!v || !videoReady) return;
|
|
2985
|
+
const t = mode === "start" ? 0 : mode === "end" ? Math.max(0, v.duration - 0.01) : v.currentTime;
|
|
2986
|
+
const frame = await captureAt(t, mode === "start" ? "Start" : mode === "end" ? "End" : formatTime(t));
|
|
2987
|
+
if (frame) setFrames((prev) => [frame, ...prev]);
|
|
2988
|
+
};
|
|
2989
|
+
const extractInterval = async () => {
|
|
2990
|
+
const v = videoRef.current;
|
|
2991
|
+
if (!v || !videoReady || isExtracting) return;
|
|
2992
|
+
const every = parseFloat(intervalSec);
|
|
2993
|
+
if (!isFinite(every) || every <= 0) return;
|
|
2994
|
+
const ts = [];
|
|
2995
|
+
for (let t = 0; t <= v.duration; t += every) {
|
|
2996
|
+
ts.push(Math.min(t, v.duration - 0.01));
|
|
2997
|
+
if (ts.length >= MAX_FRAMES) break;
|
|
2998
|
+
}
|
|
2999
|
+
setIsExtracting(true);
|
|
3000
|
+
cancelledRef.current = false;
|
|
3001
|
+
setFrames([]);
|
|
3002
|
+
const collected = [];
|
|
3003
|
+
for (const t of ts) {
|
|
3004
|
+
if (cancelledRef.current) break;
|
|
3005
|
+
const f = await captureAt(t, formatTime(t));
|
|
3006
|
+
if (f) {
|
|
3007
|
+
collected.push(f);
|
|
3008
|
+
setFrames([...collected]);
|
|
3009
|
+
}
|
|
3010
|
+
}
|
|
3011
|
+
setIsExtracting(false);
|
|
3012
|
+
};
|
|
3013
|
+
const useFrame = (frame) => {
|
|
3014
|
+
if (!onResult || !selectedItem) return;
|
|
3015
|
+
const base64 = frame.dataUrl.replace(/^data:image\/png;base64,/, "");
|
|
3016
|
+
const labFrame = {
|
|
3017
|
+
id: frame.id,
|
|
3018
|
+
base64,
|
|
3019
|
+
source: "flow-gallery"
|
|
3020
|
+
};
|
|
3021
|
+
onResult({
|
|
3022
|
+
id: frame.id,
|
|
3023
|
+
prompt: selectedItem.prompt,
|
|
3024
|
+
label: `Frame ${frame.label} \u2013 ${selectedItem.label ?? selectedItem.id}`,
|
|
3025
|
+
tags: selectedItem.tags ?? [],
|
|
3026
|
+
frames: [labFrame]
|
|
3027
|
+
});
|
|
3028
|
+
};
|
|
3029
|
+
return /* @__PURE__ */ jsxs16("div", { style: { display: "flex", flexDirection: "column", gap: 12, padding: 12, height: "100%", overflow: "auto" }, children: [
|
|
3030
|
+
/* @__PURE__ */ jsxs16("div", { style: { display: "flex", flexWrap: "wrap", gap: 6 }, children: [
|
|
3031
|
+
videoItems.length === 0 && /* @__PURE__ */ jsx18("span", { style: { fontSize: 11, color: "#666", fontStyle: "italic" }, children: "No video items available" }),
|
|
3032
|
+
videoItems.map((item) => /* @__PURE__ */ jsx18(
|
|
3033
|
+
"button",
|
|
3034
|
+
{
|
|
3035
|
+
onClick: () => handleVideoSelect(item),
|
|
3036
|
+
style: {
|
|
3037
|
+
padding: "4px 8px",
|
|
3038
|
+
fontSize: 11,
|
|
3039
|
+
background: selectedItem?.id === item.id ? "rgba(168,85,247,0.2)" : "rgba(255,255,255,0.05)",
|
|
3040
|
+
border: `1px solid ${selectedItem?.id === item.id ? "#a855f7" : "rgba(255,255,255,0.1)"}`,
|
|
3041
|
+
borderRadius: 4,
|
|
3042
|
+
color: "#fff",
|
|
3043
|
+
cursor: "pointer"
|
|
3044
|
+
},
|
|
3045
|
+
children: item.label ?? item.id
|
|
3046
|
+
},
|
|
3047
|
+
item.id
|
|
3048
|
+
))
|
|
3049
|
+
] }),
|
|
3050
|
+
videoSrc && /* @__PURE__ */ jsx18(
|
|
3051
|
+
"video",
|
|
3052
|
+
{
|
|
3053
|
+
ref: videoRef,
|
|
3054
|
+
src: videoSrc,
|
|
3055
|
+
controls: true,
|
|
3056
|
+
crossOrigin: "anonymous",
|
|
3057
|
+
onLoadedMetadata: () => setVideoReady(true),
|
|
3058
|
+
style: { width: "100%", maxHeight: 280, background: "#000", borderRadius: 6, display: "block" }
|
|
3059
|
+
}
|
|
3060
|
+
),
|
|
3061
|
+
/* @__PURE__ */ jsx18("canvas", { ref: canvasRef, style: { display: "none" } }),
|
|
3062
|
+
/* @__PURE__ */ jsxs16("div", { style: { display: "flex", flexWrap: "wrap", gap: 6, alignItems: "center" }, children: [
|
|
3063
|
+
["start", "current", "end"].map((mode) => /* @__PURE__ */ jsx18(
|
|
3064
|
+
"button",
|
|
3065
|
+
{
|
|
3066
|
+
disabled: !videoReady,
|
|
3067
|
+
onClick: () => extractSingle(mode),
|
|
3068
|
+
style: {
|
|
3069
|
+
padding: "4px 10px",
|
|
3070
|
+
fontSize: 11,
|
|
3071
|
+
borderRadius: 4,
|
|
3072
|
+
background: "rgba(255,255,255,0.08)",
|
|
3073
|
+
border: "1px solid rgba(255,255,255,0.15)",
|
|
3074
|
+
color: "#fff",
|
|
3075
|
+
cursor: videoReady ? "pointer" : "not-allowed",
|
|
3076
|
+
opacity: videoReady ? 1 : 0.4
|
|
3077
|
+
},
|
|
3078
|
+
children: mode === "start" ? "Start Frame" : mode === "end" ? "End Frame" : "Current Frame"
|
|
3079
|
+
},
|
|
3080
|
+
mode
|
|
3081
|
+
)),
|
|
3082
|
+
/* @__PURE__ */ jsx18("span", { style: { fontSize: 11, color: "#aaa" }, children: "every" }),
|
|
3083
|
+
/* @__PURE__ */ jsx18(
|
|
3084
|
+
"select",
|
|
3085
|
+
{
|
|
3086
|
+
value: intervalSec,
|
|
3087
|
+
onChange: (e) => setIntervalSec(e.target.value),
|
|
3088
|
+
disabled: !videoReady || isExtracting,
|
|
3089
|
+
style: { fontSize: 11, background: "#111", border: "1px solid #333", color: "#fff", borderRadius: 4, padding: "2px 4px" },
|
|
3090
|
+
children: INTERVAL_OPTIONS.map((v) => /* @__PURE__ */ jsxs16("option", { value: v, children: [
|
|
3091
|
+
v,
|
|
3092
|
+
"s"
|
|
3093
|
+
] }, v))
|
|
3094
|
+
}
|
|
3095
|
+
),
|
|
3096
|
+
/* @__PURE__ */ jsx18(
|
|
3097
|
+
"button",
|
|
3098
|
+
{
|
|
3099
|
+
disabled: !videoReady,
|
|
3100
|
+
onClick: isExtracting ? () => {
|
|
3101
|
+
cancelledRef.current = true;
|
|
3102
|
+
} : extractInterval,
|
|
3103
|
+
style: {
|
|
3104
|
+
padding: "4px 10px",
|
|
3105
|
+
fontSize: 11,
|
|
3106
|
+
borderRadius: 4,
|
|
3107
|
+
background: isExtracting ? "rgba(239,68,68,0.2)" : "rgba(255,255,255,0.08)",
|
|
3108
|
+
border: `1px solid ${isExtracting ? "#ef4444" : "rgba(255,255,255,0.15)"}`,
|
|
3109
|
+
color: isExtracting ? "#f87171" : "#fff",
|
|
3110
|
+
cursor: videoReady ? "pointer" : "not-allowed",
|
|
3111
|
+
opacity: videoReady ? 1 : 0.4
|
|
3112
|
+
},
|
|
3113
|
+
children: isExtracting ? "Cancel" : "Extract All"
|
|
3114
|
+
}
|
|
3115
|
+
)
|
|
3116
|
+
] }),
|
|
3117
|
+
/* @__PURE__ */ jsxs16("div", { style: { display: "flex", gap: 8, overflowX: "auto", paddingBottom: 4 }, children: [
|
|
3118
|
+
frames.map((frame) => /* @__PURE__ */ jsxs16(
|
|
3119
|
+
"div",
|
|
3120
|
+
{
|
|
3121
|
+
style: {
|
|
3122
|
+
flexShrink: 0,
|
|
3123
|
+
width: 100,
|
|
3124
|
+
border: "1px solid rgba(255,255,255,0.1)",
|
|
3125
|
+
borderRadius: 6,
|
|
3126
|
+
overflow: "hidden",
|
|
3127
|
+
background: "rgba(255,255,255,0.03)"
|
|
3128
|
+
},
|
|
3129
|
+
children: [
|
|
3130
|
+
/* @__PURE__ */ jsx18("img", { src: frame.dataUrl, style: { width: "100%", aspectRatio: "16/9", objectFit: "cover", display: "block" }, alt: frame.label }),
|
|
3131
|
+
/* @__PURE__ */ jsx18("div", { style: { fontSize: 9, color: "#888", textAlign: "center", padding: "2px 4px", fontFamily: "monospace" }, children: frame.label }),
|
|
3132
|
+
/* @__PURE__ */ jsxs16("div", { style: { display: "flex", gap: 2, padding: "0 4px 4px", justifyContent: "center" }, children: [
|
|
3133
|
+
/* @__PURE__ */ jsx18(
|
|
3134
|
+
"button",
|
|
3135
|
+
{
|
|
3136
|
+
onClick: () => useFrame(frame),
|
|
3137
|
+
style: {
|
|
3138
|
+
flex: 1,
|
|
3139
|
+
padding: "2px 0",
|
|
3140
|
+
fontSize: 9,
|
|
3141
|
+
borderRadius: 3,
|
|
3142
|
+
background: "rgba(168,85,247,0.2)",
|
|
3143
|
+
border: "1px solid #a855f7",
|
|
3144
|
+
color: "#c084fc",
|
|
3145
|
+
cursor: "pointer"
|
|
3146
|
+
},
|
|
3147
|
+
children: "Use"
|
|
3148
|
+
}
|
|
3149
|
+
),
|
|
3150
|
+
/* @__PURE__ */ jsx18(
|
|
3151
|
+
"button",
|
|
3152
|
+
{
|
|
3153
|
+
onClick: () => setFrames((prev) => prev.filter((f) => f.id !== frame.id)),
|
|
3154
|
+
style: {
|
|
3155
|
+
padding: "2px 4px",
|
|
3156
|
+
fontSize: 9,
|
|
3157
|
+
borderRadius: 3,
|
|
3158
|
+
background: "rgba(255,255,255,0.05)",
|
|
3159
|
+
border: "1px solid rgba(255,255,255,0.1)",
|
|
3160
|
+
color: "#666",
|
|
3161
|
+
cursor: "pointer"
|
|
3162
|
+
},
|
|
3163
|
+
children: "\u2715"
|
|
3164
|
+
}
|
|
3165
|
+
)
|
|
3166
|
+
] })
|
|
3167
|
+
]
|
|
3168
|
+
},
|
|
3169
|
+
frame.id
|
|
3170
|
+
)),
|
|
3171
|
+
frames.length === 0 && /* @__PURE__ */ jsx18("span", { style: { fontSize: 11, color: "#444", fontStyle: "italic", padding: "16px 0" }, children: isExtracting ? "Extracting frames\u2026" : "No frames yet" })
|
|
3172
|
+
] })
|
|
3173
|
+
] });
|
|
3174
|
+
};
|
|
3175
|
+
|
|
3176
|
+
// src/components/labs/LabsTab.tsx
|
|
3177
|
+
import { jsx as jsx19, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
3178
|
+
var BASE_TABS = [
|
|
2926
3179
|
{ key: "remix", label: "Remix", icon: "auto_fix_high" },
|
|
2927
3180
|
{ key: "blend", label: "Blend", icon: "merge" },
|
|
2928
3181
|
{ key: "compare", label: "Compare", icon: "compare" },
|
|
2929
3182
|
{ key: "loop", label: "Loop", icon: "loop" }
|
|
2930
3183
|
];
|
|
2931
|
-
var
|
|
2932
|
-
|
|
2933
|
-
|
|
2934
|
-
|
|
3184
|
+
var FRAMES_TAB = { key: "frames", label: "Frames", icon: "crop_original" };
|
|
3185
|
+
var LabsTab = ({ services, onResult, videoItems, resolveVideoUrl }) => {
|
|
3186
|
+
const [activeTab, setActiveTab] = useState14("remix");
|
|
3187
|
+
const showFrames = !!(videoItems && resolveVideoUrl);
|
|
3188
|
+
const tabs = showFrames ? [...BASE_TABS, FRAMES_TAB] : BASE_TABS;
|
|
3189
|
+
return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col h-full overflow-hidden", children: [
|
|
3190
|
+
/* @__PURE__ */ jsx19("div", { className: "flex border-b border-white/5 shrink-0", children: tabs.map((tab) => /* @__PURE__ */ jsxs17(
|
|
2935
3191
|
"button",
|
|
2936
3192
|
{
|
|
2937
3193
|
onClick: () => setActiveTab(tab.key),
|
|
2938
3194
|
className: `flex-1 flex items-center justify-center gap-1 h-10 text-[9px] font-bold uppercase tracking-wide transition-colors ${activeTab === tab.key ? "text-white border-b-2 border-white" : "text-white/30 hover:text-white/60"}`,
|
|
2939
3195
|
children: [
|
|
2940
|
-
/* @__PURE__ */
|
|
3196
|
+
/* @__PURE__ */ jsx19("span", { className: "material-symbols-outlined text-[14px]", children: tab.icon }),
|
|
2941
3197
|
tab.label
|
|
2942
3198
|
]
|
|
2943
3199
|
},
|
|
2944
3200
|
tab.key
|
|
2945
3201
|
)) }),
|
|
2946
|
-
/* @__PURE__ */
|
|
2947
|
-
activeTab === "remix" && /* @__PURE__ */
|
|
2948
|
-
activeTab === "blend" && /* @__PURE__ */
|
|
2949
|
-
activeTab === "compare" && /* @__PURE__ */
|
|
2950
|
-
activeTab === "loop" && /* @__PURE__ */
|
|
3202
|
+
/* @__PURE__ */ jsxs17("div", { className: "flex-1 overflow-hidden", children: [
|
|
3203
|
+
activeTab === "remix" && /* @__PURE__ */ jsx19(LabRemix, { services, onResult }),
|
|
3204
|
+
activeTab === "blend" && /* @__PURE__ */ jsx19(LabBlend, { services, onResult }),
|
|
3205
|
+
activeTab === "compare" && /* @__PURE__ */ jsx19(LabCompare, { services, onResult }),
|
|
3206
|
+
activeTab === "loop" && /* @__PURE__ */ jsx19(LabLoop, { services, onResult }),
|
|
3207
|
+
activeTab === "frames" && showFrames && /* @__PURE__ */ jsx19(
|
|
3208
|
+
LabFrameExtractor,
|
|
3209
|
+
{
|
|
3210
|
+
videoItems,
|
|
3211
|
+
onResult,
|
|
3212
|
+
resolveVideoUrl
|
|
3213
|
+
}
|
|
3214
|
+
)
|
|
2951
3215
|
] })
|
|
2952
3216
|
] });
|
|
2953
3217
|
};
|
|
2954
3218
|
|
|
2955
3219
|
// src/components/TagManagerPanel.tsx
|
|
2956
|
-
import { useState as
|
|
2957
|
-
import { jsx as
|
|
3220
|
+
import { useState as useState15 } from "react";
|
|
3221
|
+
import { jsx as jsx20, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2958
3222
|
function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete, onTagReorder, onTagMove }) {
|
|
2959
3223
|
const categories = Object.keys(workspaceTags.by_category).filter(
|
|
2960
3224
|
(cat) => (workspaceTags.by_category[cat] || []).some((t) => !t.is_deleted)
|
|
2961
3225
|
);
|
|
2962
|
-
const [selectedCategory, setSelectedCategory] =
|
|
3226
|
+
const [selectedCategory, setSelectedCategory] = useState15(categories[0] || "");
|
|
2963
3227
|
const effectiveCategory = categories.includes(selectedCategory) ? selectedCategory : categories[0] || "";
|
|
2964
|
-
const [editingLabel, setEditingLabel] =
|
|
2965
|
-
const [editState, setEditState] =
|
|
2966
|
-
const [newTag, setNewTag] =
|
|
2967
|
-
const [movingLabel, setMovingLabel] =
|
|
2968
|
-
const [moveTarget, setMoveTarget] =
|
|
3228
|
+
const [editingLabel, setEditingLabel] = useState15(null);
|
|
3229
|
+
const [editState, setEditState] = useState15({ label: "", value: "" });
|
|
3230
|
+
const [newTag, setNewTag] = useState15({ label: "", value: "" });
|
|
3231
|
+
const [movingLabel, setMovingLabel] = useState15(null);
|
|
3232
|
+
const [moveTarget, setMoveTarget] = useState15("");
|
|
2969
3233
|
const tags = (workspaceTags.by_category[effectiveCategory] || []).filter((t) => !t.is_deleted);
|
|
2970
3234
|
const otherCategories = categories.filter((c) => c !== effectiveCategory);
|
|
2971
3235
|
const startEdit = (tag) => {
|
|
@@ -3008,10 +3272,10 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3008
3272
|
if (!confirm(`Tag "${tag.label}" l\xF6schen?`)) return;
|
|
3009
3273
|
onTagDelete(tag.label, effectiveCategory);
|
|
3010
3274
|
};
|
|
3011
|
-
return /* @__PURE__ */
|
|
3012
|
-
/* @__PURE__ */
|
|
3013
|
-
/* @__PURE__ */
|
|
3014
|
-
categories.map((cat) => /* @__PURE__ */
|
|
3275
|
+
return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col h-full overflow-hidden", children: [
|
|
3276
|
+
/* @__PURE__ */ jsx20("div", { className: "px-3 py-2 border-b border-white/5 shrink-0", children: /* @__PURE__ */ jsx20("span", { className: "text-[10px] font-bold uppercase tracking-widest text-white/40", children: "Tag Manager" }) }),
|
|
3277
|
+
/* @__PURE__ */ jsx20("div", { className: "px-3 py-2 shrink-0 overflow-x-auto", children: /* @__PURE__ */ jsxs18("div", { className: "flex gap-1.5 flex-nowrap", children: [
|
|
3278
|
+
categories.map((cat) => /* @__PURE__ */ jsxs18(
|
|
3015
3279
|
"button",
|
|
3016
3280
|
{
|
|
3017
3281
|
onClick: () => {
|
|
@@ -3023,17 +3287,17 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3023
3287
|
children: [
|
|
3024
3288
|
cat,
|
|
3025
3289
|
" ",
|
|
3026
|
-
/* @__PURE__ */
|
|
3290
|
+
/* @__PURE__ */ jsx20("span", { className: "ml-1 opacity-50", children: (workspaceTags.by_category[cat] || []).filter((t) => !t.is_deleted).length })
|
|
3027
3291
|
]
|
|
3028
3292
|
},
|
|
3029
3293
|
cat
|
|
3030
3294
|
)),
|
|
3031
|
-
categories.length === 0 && /* @__PURE__ */
|
|
3295
|
+
categories.length === 0 && /* @__PURE__ */ jsx20("span", { className: "text-[10px] text-white/20", children: "Erst Workspace importieren" })
|
|
3032
3296
|
] }) }),
|
|
3033
|
-
/* @__PURE__ */
|
|
3034
|
-
tags.map((tag, i) => /* @__PURE__ */
|
|
3035
|
-
editingLabel === tag.label ? /* @__PURE__ */
|
|
3036
|
-
/* @__PURE__ */
|
|
3297
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex-1 overflow-y-auto dark-scrollbar px-3 pb-2 space-y-1", children: [
|
|
3298
|
+
tags.map((tag, i) => /* @__PURE__ */ jsxs18("div", { children: [
|
|
3299
|
+
editingLabel === tag.label ? /* @__PURE__ */ jsxs18("div", { className: "bg-white/5 border border-blue-600/40 rounded-lg p-2.5 space-y-1.5", children: [
|
|
3300
|
+
/* @__PURE__ */ jsx20(
|
|
3037
3301
|
"input",
|
|
3038
3302
|
{
|
|
3039
3303
|
value: editState.label,
|
|
@@ -3044,7 +3308,7 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3044
3308
|
onKeyDown: (e) => e.key === "Enter" && saveEdit(tag.label)
|
|
3045
3309
|
}
|
|
3046
3310
|
),
|
|
3047
|
-
/* @__PURE__ */
|
|
3311
|
+
/* @__PURE__ */ jsx20(
|
|
3048
3312
|
"textarea",
|
|
3049
3313
|
{
|
|
3050
3314
|
value: editState.value,
|
|
@@ -3054,24 +3318,24 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3054
3318
|
placeholder: "Prompt-Wert (leer = Label)"
|
|
3055
3319
|
}
|
|
3056
3320
|
),
|
|
3057
|
-
/* @__PURE__ */
|
|
3058
|
-
/* @__PURE__ */
|
|
3059
|
-
/* @__PURE__ */
|
|
3321
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex gap-1.5 justify-end", children: [
|
|
3322
|
+
/* @__PURE__ */ jsx20("button", { onClick: () => saveEdit(tag.label), className: "px-2.5 py-1 bg-blue-700 hover:bg-blue-600 text-white text-[10px] font-bold rounded transition", children: "SPEICHERN" }),
|
|
3323
|
+
/* @__PURE__ */ jsx20("button", { onClick: () => setEditingLabel(null), className: "px-2.5 py-1 bg-white/5 hover:bg-white/10 text-white/50 text-[10px] font-bold rounded transition", children: "ABBRUCH" })
|
|
3060
3324
|
] })
|
|
3061
|
-
] }) : /* @__PURE__ */
|
|
3062
|
-
/* @__PURE__ */
|
|
3063
|
-
/* @__PURE__ */
|
|
3064
|
-
/* @__PURE__ */
|
|
3325
|
+
] }) : /* @__PURE__ */ jsxs18("div", { className: "group flex items-center gap-1.5 bg-white/3 hover:bg-white/6 border border-white/5 rounded-lg px-2 py-1.5 transition", children: [
|
|
3326
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-0 shrink-0", children: [
|
|
3327
|
+
/* @__PURE__ */ jsx20("button", { onClick: () => handleMoveUp(i), disabled: i === 0, className: "text-white/20 hover:text-white/60 disabled:opacity-10 transition leading-none", children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[14px]", children: "arrow_drop_up" }) }),
|
|
3328
|
+
/* @__PURE__ */ jsx20("button", { onClick: () => handleMoveDown(i), disabled: i === tags.length - 1, className: "text-white/20 hover:text-white/60 disabled:opacity-10 transition leading-none", children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[14px]", children: "arrow_drop_down" }) })
|
|
3065
3329
|
] }),
|
|
3066
|
-
/* @__PURE__ */
|
|
3067
|
-
/* @__PURE__ */
|
|
3068
|
-
tag.value && tag.value !== tag.label && /* @__PURE__ */
|
|
3330
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex-1 min-w-0", children: [
|
|
3331
|
+
/* @__PURE__ */ jsx20("div", { className: "text-[12px] text-white/80 font-medium truncate", children: tag.label }),
|
|
3332
|
+
tag.value && tag.value !== tag.label && /* @__PURE__ */ jsxs18("div", { className: "text-[10px] text-white/30 truncate", children: [
|
|
3069
3333
|
tag.value.slice(0, 60),
|
|
3070
3334
|
tag.value.length > 60 ? "\u2026" : ""
|
|
3071
3335
|
] })
|
|
3072
3336
|
] }),
|
|
3073
|
-
/* @__PURE__ */
|
|
3074
|
-
otherCategories.length > 0 && /* @__PURE__ */
|
|
3337
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex gap-1 opacity-0 group-hover:opacity-100 transition shrink-0", children: [
|
|
3338
|
+
otherCategories.length > 0 && /* @__PURE__ */ jsx20(
|
|
3075
3339
|
"button",
|
|
3076
3340
|
{
|
|
3077
3341
|
onClick: () => {
|
|
@@ -3081,29 +3345,29 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3081
3345
|
},
|
|
3082
3346
|
className: "p-1 rounded text-white/30 hover:text-purple-400 transition",
|
|
3083
3347
|
title: "Kategorie wechseln",
|
|
3084
|
-
children: /* @__PURE__ */
|
|
3348
|
+
children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[16px]", children: "drive_file_move" })
|
|
3085
3349
|
}
|
|
3086
3350
|
),
|
|
3087
|
-
/* @__PURE__ */
|
|
3088
|
-
/* @__PURE__ */
|
|
3351
|
+
/* @__PURE__ */ jsx20("button", { onClick: () => startEdit(tag), className: "p-1 rounded text-white/30 hover:text-blue-400 transition", title: "Bearbeiten", children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[16px]", children: "edit" }) }),
|
|
3352
|
+
/* @__PURE__ */ jsx20("button", { onClick: () => handleDelete(tag), className: "p-1 rounded text-white/30 hover:text-red-400 transition", title: "L\xF6schen", children: /* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[16px]", children: "delete" }) })
|
|
3089
3353
|
] })
|
|
3090
3354
|
] }),
|
|
3091
|
-
movingLabel === tag.label && /* @__PURE__ */
|
|
3092
|
-
/* @__PURE__ */
|
|
3093
|
-
/* @__PURE__ */
|
|
3355
|
+
movingLabel === tag.label && /* @__PURE__ */ jsxs18("div", { className: "mt-1 bg-purple-900/20 border border-purple-700/30 rounded-lg p-2.5 space-y-1.5", children: [
|
|
3356
|
+
/* @__PURE__ */ jsx20("div", { className: "text-[9px] font-bold uppercase tracking-widest text-purple-400/70", children: "Verschieben nach Kategorie" }),
|
|
3357
|
+
/* @__PURE__ */ jsxs18(
|
|
3094
3358
|
"select",
|
|
3095
3359
|
{
|
|
3096
3360
|
value: moveTarget,
|
|
3097
3361
|
onChange: (e) => setMoveTarget(e.target.value),
|
|
3098
3362
|
className: "w-full bg-black/40 border border-white/10 rounded px-2 py-1 text-[11px] text-white/70 outline-none",
|
|
3099
3363
|
children: [
|
|
3100
|
-
/* @__PURE__ */
|
|
3101
|
-
otherCategories.map((cat) => /* @__PURE__ */
|
|
3364
|
+
/* @__PURE__ */ jsx20("option", { value: "", children: "\u2014 Kategorie w\xE4hlen \u2014" }),
|
|
3365
|
+
otherCategories.map((cat) => /* @__PURE__ */ jsx20("option", { value: cat, children: cat }, cat))
|
|
3102
3366
|
]
|
|
3103
3367
|
}
|
|
3104
3368
|
),
|
|
3105
|
-
/* @__PURE__ */
|
|
3106
|
-
/* @__PURE__ */
|
|
3369
|
+
/* @__PURE__ */ jsxs18("div", { className: "flex gap-1.5 justify-end", children: [
|
|
3370
|
+
/* @__PURE__ */ jsx20(
|
|
3107
3371
|
"button",
|
|
3108
3372
|
{
|
|
3109
3373
|
onClick: () => handleMove(tag),
|
|
@@ -3112,19 +3376,19 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3112
3376
|
children: "VERSCHIEBEN"
|
|
3113
3377
|
}
|
|
3114
3378
|
),
|
|
3115
|
-
/* @__PURE__ */
|
|
3379
|
+
/* @__PURE__ */ jsx20("button", { onClick: () => setMovingLabel(null), className: "px-2.5 py-1 bg-white/5 hover:bg-white/10 text-white/50 text-[10px] font-bold rounded transition", children: "ABBRUCH" })
|
|
3116
3380
|
] })
|
|
3117
3381
|
] })
|
|
3118
3382
|
] }, `${effectiveCategory}-${i}`)),
|
|
3119
|
-
tags.length === 0 && effectiveCategory && /* @__PURE__ */
|
|
3383
|
+
tags.length === 0 && effectiveCategory && /* @__PURE__ */ jsx20("div", { className: "text-center text-[11px] text-white/20 py-6", children: "Keine Tags in dieser Kategorie." })
|
|
3120
3384
|
] }),
|
|
3121
|
-
effectiveCategory && /* @__PURE__ */
|
|
3122
|
-
/* @__PURE__ */
|
|
3385
|
+
effectiveCategory && /* @__PURE__ */ jsxs18("div", { className: "px-3 py-2 border-t border-white/5 shrink-0 space-y-1.5", children: [
|
|
3386
|
+
/* @__PURE__ */ jsxs18("div", { className: "text-[9px] font-bold uppercase tracking-widest text-white/30", children: [
|
|
3123
3387
|
"Neuer Tag in \u201E",
|
|
3124
3388
|
effectiveCategory,
|
|
3125
3389
|
'"'
|
|
3126
3390
|
] }),
|
|
3127
|
-
/* @__PURE__ */
|
|
3391
|
+
/* @__PURE__ */ jsx20(
|
|
3128
3392
|
"input",
|
|
3129
3393
|
{
|
|
3130
3394
|
value: newTag.label,
|
|
@@ -3134,7 +3398,7 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3134
3398
|
className: "w-full bg-black/40 border border-white/10 rounded px-2 py-1.5 text-[12px] text-white outline-none focus:border-white/20"
|
|
3135
3399
|
}
|
|
3136
3400
|
),
|
|
3137
|
-
/* @__PURE__ */
|
|
3401
|
+
/* @__PURE__ */ jsx20(
|
|
3138
3402
|
"textarea",
|
|
3139
3403
|
{
|
|
3140
3404
|
value: newTag.value,
|
|
@@ -3144,14 +3408,14 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3144
3408
|
className: "w-full bg-black/40 border border-white/10 rounded px-2 py-1 text-[11px] text-white/60 outline-none focus:border-white/20 resize-none"
|
|
3145
3409
|
}
|
|
3146
3410
|
),
|
|
3147
|
-
/* @__PURE__ */
|
|
3411
|
+
/* @__PURE__ */ jsxs18(
|
|
3148
3412
|
"button",
|
|
3149
3413
|
{
|
|
3150
3414
|
onClick: handleCreate,
|
|
3151
3415
|
disabled: !newTag.label.trim(),
|
|
3152
3416
|
className: "w-full py-1.5 bg-white/5 border border-white/10 text-white/60 text-[10px] font-bold rounded hover:bg-white/10 hover:text-white transition disabled:opacity-30 flex items-center justify-center gap-1.5",
|
|
3153
3417
|
children: [
|
|
3154
|
-
/* @__PURE__ */
|
|
3418
|
+
/* @__PURE__ */ jsx20("span", { className: "material-symbols-outlined text-[14px]", children: "add" }),
|
|
3155
3419
|
"TAG ERSTELLEN"
|
|
3156
3420
|
]
|
|
3157
3421
|
}
|
|
@@ -3161,8 +3425,8 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
|
|
|
3161
3425
|
}
|
|
3162
3426
|
|
|
3163
3427
|
// src/components/HFTestTab.tsx
|
|
3164
|
-
import { useState as
|
|
3165
|
-
import { jsx as
|
|
3428
|
+
import { useState as useState16 } from "react";
|
|
3429
|
+
import { jsx as jsx21, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
3166
3430
|
var HF_BASE = "https://huggingface.co";
|
|
3167
3431
|
var HF_REPO = "RolandSch/fa-app-state";
|
|
3168
3432
|
var TEST_DIR = "test";
|
|
@@ -3354,8 +3618,8 @@ function tryFmt(s) {
|
|
|
3354
3618
|
}
|
|
3355
3619
|
}
|
|
3356
3620
|
function CopyBtn({ text }) {
|
|
3357
|
-
const [done, setDone] =
|
|
3358
|
-
return /* @__PURE__ */
|
|
3621
|
+
const [done, setDone] = useState16(false);
|
|
3622
|
+
return /* @__PURE__ */ jsxs19(
|
|
3359
3623
|
"button",
|
|
3360
3624
|
{
|
|
3361
3625
|
onClick: () => {
|
|
@@ -3366,7 +3630,7 @@ function CopyBtn({ text }) {
|
|
|
3366
3630
|
},
|
|
3367
3631
|
style: { background: "none", border: "1px solid rgba(255,255,255,0.15)", borderRadius: 5, color: done ? "#4ade80" : "rgba(255,255,255,0.45)", fontSize: 10, padding: "3px 8px", cursor: "pointer", fontFamily: "inherit", display: "flex", alignItems: "center", gap: 3 },
|
|
3368
3632
|
children: [
|
|
3369
|
-
/* @__PURE__ */
|
|
3633
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: done ? "check" : "content_copy" }),
|
|
3370
3634
|
done ? "Kopiert" : "Copy"
|
|
3371
3635
|
]
|
|
3372
3636
|
}
|
|
@@ -3374,35 +3638,35 @@ function CopyBtn({ text }) {
|
|
|
3374
3638
|
}
|
|
3375
3639
|
function StepView({ step }) {
|
|
3376
3640
|
const isSpecial = step.method === "-" || step.method === "import()" || step.method === "import()+call";
|
|
3377
|
-
return /* @__PURE__ */
|
|
3378
|
-
/* @__PURE__ */
|
|
3379
|
-
/* @__PURE__ */
|
|
3380
|
-
/* @__PURE__ */
|
|
3381
|
-
step.durationMs !== void 0 && /* @__PURE__ */
|
|
3641
|
+
return /* @__PURE__ */ jsxs19("div", { style: { marginBottom: 6, background: "rgba(0,0,0,0.3)", borderRadius: 7, padding: "7px 9px", border: `1px solid ${step.ok === false ? "rgba(248,113,113,0.2)" : "rgba(255,255,255,0.05)"}` }, children: [
|
|
3642
|
+
/* @__PURE__ */ jsxs19("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 4 }, children: [
|
|
3643
|
+
/* @__PURE__ */ jsx21("span", { style: { fontSize: 11, fontWeight: 700, color: step.ok === false ? "#f87171" : "#4ade80" }, children: step.ok === false ? "\u2717" : "\u2713" }),
|
|
3644
|
+
/* @__PURE__ */ jsx21("span", { style: { fontSize: 11, fontWeight: 600, color: "rgba(255,255,255,0.7)", flex: 1 }, children: step.label }),
|
|
3645
|
+
step.durationMs !== void 0 && /* @__PURE__ */ jsxs19("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)" }, children: [
|
|
3382
3646
|
step.durationMs,
|
|
3383
3647
|
"ms"
|
|
3384
3648
|
] }),
|
|
3385
|
-
/* @__PURE__ */
|
|
3649
|
+
/* @__PURE__ */ jsx21(CopyBtn, { text: JSON.stringify(step, null, 2) })
|
|
3386
3650
|
] }),
|
|
3387
|
-
!isSpecial && /* @__PURE__ */
|
|
3388
|
-
/* @__PURE__ */
|
|
3651
|
+
!isSpecial && /* @__PURE__ */ jsxs19("div", { style: { marginBottom: 5 }, children: [
|
|
3652
|
+
/* @__PURE__ */ jsxs19("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.25)", marginBottom: 2 }, children: [
|
|
3389
3653
|
"\u2192 ",
|
|
3390
3654
|
step.method,
|
|
3391
3655
|
" ",
|
|
3392
3656
|
step.url
|
|
3393
3657
|
] }),
|
|
3394
|
-
Object.keys(step.reqHeaders).length > 0 && /* @__PURE__ */
|
|
3395
|
-
step.reqBody && /* @__PURE__ */
|
|
3658
|
+
Object.keys(step.reqHeaders).length > 0 && /* @__PURE__ */ jsx21("pre", { style: { fontSize: 9, color: "rgba(255,255,255,0.35)", margin: "2px 0", padding: "3px 5px", background: "rgba(255,255,255,0.03)", borderRadius: 3, whiteSpace: "pre-wrap", wordBreak: "break-all", maxHeight: 60, overflow: "auto" }, children: Object.entries(step.reqHeaders).map(([k, v]) => `${k}: ${v}`).join("\n") }),
|
|
3659
|
+
step.reqBody && /* @__PURE__ */ jsx21("pre", { style: { fontSize: 9, color: "rgba(255,255,255,0.35)", margin: "2px 0", padding: "3px 5px", background: "rgba(255,255,255,0.03)", borderRadius: 3, whiteSpace: "pre-wrap", wordBreak: "break-all", maxHeight: 80, overflow: "auto" }, children: step.reqBody })
|
|
3396
3660
|
] }),
|
|
3397
|
-
step.error && /* @__PURE__ */
|
|
3398
|
-
!step.error && (step.resStatus !== void 0 || step.resBody) && /* @__PURE__ */
|
|
3399
|
-
step.resStatus !== void 0 && /* @__PURE__ */
|
|
3661
|
+
step.error && /* @__PURE__ */ jsx21("pre", { style: { fontSize: 11, color: "#f87171", margin: 0, padding: "3px 5px", background: "rgba(248,113,113,0.05)", borderRadius: 3, whiteSpace: "pre-wrap", wordBreak: "break-all" }, children: step.error }),
|
|
3662
|
+
!step.error && (step.resStatus !== void 0 || step.resBody) && /* @__PURE__ */ jsxs19("div", { children: [
|
|
3663
|
+
step.resStatus !== void 0 && /* @__PURE__ */ jsxs19("div", { style: { fontSize: 11, fontWeight: 700, color: (step.resStatus || 0) < 300 ? "#4ade80" : "#f87171", marginBottom: 3 }, children: [
|
|
3400
3664
|
"\u2190 ",
|
|
3401
3665
|
step.resStatus,
|
|
3402
3666
|
" ",
|
|
3403
3667
|
step.resStatusText
|
|
3404
3668
|
] }),
|
|
3405
|
-
step.resBody && /* @__PURE__ */
|
|
3669
|
+
step.resBody && /* @__PURE__ */ jsx21("pre", { style: { fontSize: 9, color: "rgba(255,255,255,0.55)", margin: 0, padding: "3px 5px", background: "rgba(255,255,255,0.03)", borderRadius: 3, whiteSpace: "pre-wrap", wordBreak: "break-all", maxHeight: 180, overflow: "auto" }, children: tryFmt(step.resBody) })
|
|
3406
3670
|
] })
|
|
3407
3671
|
] });
|
|
3408
3672
|
}
|
|
@@ -3418,15 +3682,15 @@ function TestCard({
|
|
|
3418
3682
|
onToggle
|
|
3419
3683
|
}) {
|
|
3420
3684
|
const hasResult = state && state.status !== "idle";
|
|
3421
|
-
return /* @__PURE__ */
|
|
3422
|
-
/* @__PURE__ */
|
|
3423
|
-
/* @__PURE__ */
|
|
3424
|
-
/* @__PURE__ */
|
|
3425
|
-
/* @__PURE__ */
|
|
3426
|
-
/* @__PURE__ */
|
|
3685
|
+
return /* @__PURE__ */ jsxs19("div", { style: { marginBottom: 8, background: "rgba(255,255,255,0.03)", borderRadius: 10, border: `1px solid ${state?.status === "ok" ? "rgba(74,222,128,0.15)" : state?.status === "error" ? "rgba(248,113,113,0.15)" : "rgba(255,255,255,0.07)"}`, overflow: "hidden" }, children: [
|
|
3686
|
+
/* @__PURE__ */ jsxs19("div", { style: { display: "flex", alignItems: "center", gap: 8, padding: "9px 10px" }, children: [
|
|
3687
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 18, color: state?.status === "ok" ? "#4ade80" : state?.status === "error" ? "#f87171" : state?.status === "running" ? "#60a5fa" : "rgba(255,255,255,0.35)", flexShrink: 0 }, children: state?.status === "ok" ? "check_circle" : state?.status === "error" ? "error" : state?.status === "running" ? "hourglass_top" : icon }),
|
|
3688
|
+
/* @__PURE__ */ jsxs19("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
3689
|
+
/* @__PURE__ */ jsx21("div", { style: { fontSize: 13, fontWeight: 700, color: "#fff" }, children: label }),
|
|
3690
|
+
/* @__PURE__ */ jsx21("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: desc })
|
|
3427
3691
|
] }),
|
|
3428
|
-
hasResult && state?.status !== "running" && /* @__PURE__ */
|
|
3429
|
-
/* @__PURE__ */
|
|
3692
|
+
hasResult && state?.status !== "running" && /* @__PURE__ */ jsx21("button", { onClick: onToggle, style: { background: "none", border: "none", color: "rgba(255,255,255,0.3)", cursor: "pointer", padding: 2, lineHeight: 0 }, children: /* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: expanded ? "expand_less" : "expand_more" }) }),
|
|
3693
|
+
/* @__PURE__ */ jsx21(
|
|
3430
3694
|
"button",
|
|
3431
3695
|
{
|
|
3432
3696
|
onClick: onRun,
|
|
@@ -3436,20 +3700,20 @@ function TestCard({
|
|
|
3436
3700
|
}
|
|
3437
3701
|
)
|
|
3438
3702
|
] }),
|
|
3439
|
-
hasResult && /* @__PURE__ */
|
|
3440
|
-
/* @__PURE__ */
|
|
3441
|
-
/* @__PURE__ */
|
|
3442
|
-
/* @__PURE__ */
|
|
3703
|
+
hasResult && /* @__PURE__ */ jsxs19("div", { style: { borderTop: "1px solid rgba(255,255,255,0.05)" }, children: [
|
|
3704
|
+
/* @__PURE__ */ jsxs19("div", { style: { padding: "4px 10px 5px", display: "flex", alignItems: "center", gap: 8 }, children: [
|
|
3705
|
+
/* @__PURE__ */ jsx21("span", { style: { fontSize: 11, fontWeight: 700, color: state.status === "ok" ? "#4ade80" : "#f87171" }, children: state.status === "ok" ? "\u2713 OK" : state.status === "running" ? "\u2026" : "\u2717 Fehler" }),
|
|
3706
|
+
/* @__PURE__ */ jsxs19("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)" }, children: [
|
|
3443
3707
|
state.totalMs,
|
|
3444
3708
|
"ms \xB7 ",
|
|
3445
3709
|
state.steps.length,
|
|
3446
3710
|
" Step",
|
|
3447
3711
|
state.steps.length !== 1 ? "s" : ""
|
|
3448
3712
|
] }),
|
|
3449
|
-
/* @__PURE__ */
|
|
3450
|
-
/* @__PURE__ */
|
|
3713
|
+
/* @__PURE__ */ jsx21("div", { style: { flex: 1 } }),
|
|
3714
|
+
/* @__PURE__ */ jsx21(CopyBtn, { text: JSON.stringify(state, null, 2) })
|
|
3451
3715
|
] }),
|
|
3452
|
-
expanded && state.steps.map((step, i) => /* @__PURE__ */
|
|
3716
|
+
expanded && state.steps.map((step, i) => /* @__PURE__ */ jsx21("div", { style: { padding: "0 10px 4px" }, children: /* @__PURE__ */ jsx21(StepView, { step }) }, i))
|
|
3453
3717
|
] })
|
|
3454
3718
|
] });
|
|
3455
3719
|
}
|
|
@@ -3461,10 +3725,10 @@ var EVENT_TYPE_COLORS = {
|
|
|
3461
3725
|
};
|
|
3462
3726
|
function EventMonitor({ events, confirmedEventKeys, galleryItems, imageUploadStatus }) {
|
|
3463
3727
|
if (!events.length) {
|
|
3464
|
-
return /* @__PURE__ */
|
|
3728
|
+
return /* @__PURE__ */ jsx21("div", { style: { padding: "12px 14px", fontSize: 12, color: "rgba(255,255,255,0.3)", fontStyle: "italic" }, children: "Noch keine Events geladen." });
|
|
3465
3729
|
}
|
|
3466
3730
|
const sorted = [...events].sort((a, b) => b.ts - a.ts).slice(0, 30);
|
|
3467
|
-
return /* @__PURE__ */
|
|
3731
|
+
return /* @__PURE__ */ jsxs19("div", { style: { padding: "6px 8px 4px" }, children: [
|
|
3468
3732
|
sorted.map((e, i) => {
|
|
3469
3733
|
const eKey = `${e.ts}_${e.clientId}`;
|
|
3470
3734
|
const isConfirmed = confirmedEventKeys.has(eKey);
|
|
@@ -3477,47 +3741,47 @@ function EventMonitor({ events, confirmedEventKeys, galleryItems, imageUploadSta
|
|
|
3477
3741
|
const uploadStatus = imgId ? imageUploadStatus.get(imgId) : void 0;
|
|
3478
3742
|
const payloadStr = JSON.stringify(e.payload ?? {});
|
|
3479
3743
|
const payloadPreview = payloadStr.length > 70 ? payloadStr.slice(0, 70) + "\u2026" : payloadStr;
|
|
3480
|
-
return /* @__PURE__ */
|
|
3481
|
-
/* @__PURE__ */
|
|
3482
|
-
/* @__PURE__ */
|
|
3483
|
-
/* @__PURE__ */
|
|
3484
|
-
/* @__PURE__ */
|
|
3485
|
-
/* @__PURE__ */
|
|
3486
|
-
/* @__PURE__ */
|
|
3487
|
-
isConfirmed ? /* @__PURE__ */
|
|
3488
|
-
/* @__PURE__ */
|
|
3744
|
+
return /* @__PURE__ */ jsxs19("div", { style: { display: "flex", gap: 7, alignItems: "flex-start", padding: "6px 2px", borderBottom: "1px solid rgba(255,255,255,0.05)" }, children: [
|
|
3745
|
+
/* @__PURE__ */ jsx21("div", { style: { width: 36, height: 36, flexShrink: 0, borderRadius: 4, overflow: "hidden", background: "rgba(255,255,255,0.05)", display: "flex", alignItems: "center", justifyContent: "center" }, children: isImageEvent ? galleryItem?.base64 ? /* @__PURE__ */ jsx21("img", { src: galleryItem.base64, style: { width: "100%", height: "100%", objectFit: "cover" } }) : /* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 18, color: "rgba(255,255,255,0.2)" }, children: "image" }) : /* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 16, color: "rgba(255,255,255,0.15)" }, children: e.type === "tag_upserted" ? "label" : e.type === "metadata_updated" ? "edit_note" : "data_object" }) }),
|
|
3746
|
+
/* @__PURE__ */ jsxs19("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
3747
|
+
/* @__PURE__ */ jsxs19("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3 }, children: [
|
|
3748
|
+
/* @__PURE__ */ jsx21("span", { style: { fontSize: 11, fontWeight: 700, color: typeColor }, children: e.type }),
|
|
3749
|
+
/* @__PURE__ */ jsx21("span", { style: { fontSize: 9, color: "rgba(255,255,255,0.25)", fontVariantNumeric: "tabular-nums" }, children: timeStr }),
|
|
3750
|
+
/* @__PURE__ */ jsx21("div", { style: { flex: 1 } }),
|
|
3751
|
+
isConfirmed ? /* @__PURE__ */ jsxs19("span", { style: { fontSize: 9, fontWeight: 700, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
|
|
3752
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "check_circle" }),
|
|
3489
3753
|
"HF"
|
|
3490
|
-
] }) : /* @__PURE__ */
|
|
3491
|
-
/* @__PURE__ */
|
|
3754
|
+
] }) : /* @__PURE__ */ jsxs19("span", { style: { fontSize: 9, fontWeight: 700, color: "#fbbf24", display: "flex", alignItems: "center", gap: 2 }, children: [
|
|
3755
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "schedule" }),
|
|
3492
3756
|
"lokal"
|
|
3493
3757
|
] })
|
|
3494
3758
|
] }),
|
|
3495
|
-
isImageEvent && /* @__PURE__ */
|
|
3496
|
-
uploadStatus === "done" && /* @__PURE__ */
|
|
3497
|
-
/* @__PURE__ */
|
|
3759
|
+
isImageEvent && /* @__PURE__ */ jsxs19("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3, flexWrap: "wrap" }, children: [
|
|
3760
|
+
uploadStatus === "done" && /* @__PURE__ */ jsxs19("span", { style: { fontSize: 9, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
|
|
3761
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_done" }),
|
|
3498
3762
|
"Upload \u2713"
|
|
3499
3763
|
] }),
|
|
3500
|
-
uploadStatus === "uploading" && /* @__PURE__ */
|
|
3501
|
-
/* @__PURE__ */
|
|
3764
|
+
uploadStatus === "uploading" && /* @__PURE__ */ jsxs19("span", { style: { fontSize: 9, color: "#60a5fa", display: "flex", alignItems: "center", gap: 2 }, children: [
|
|
3765
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_upload" }),
|
|
3502
3766
|
"l\xE4dt hoch\u2026"
|
|
3503
3767
|
] }),
|
|
3504
|
-
uploadStatus === "failed" && /* @__PURE__ */
|
|
3505
|
-
/* @__PURE__ */
|
|
3768
|
+
uploadStatus === "failed" && /* @__PURE__ */ jsxs19("span", { style: { fontSize: 9, color: "#f87171", display: "flex", alignItems: "center", gap: 2 }, children: [
|
|
3769
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_off" }),
|
|
3506
3770
|
"Upload fehlgeschlagen"
|
|
3507
3771
|
] }),
|
|
3508
|
-
galleryItem?.base64 ? /* @__PURE__ */
|
|
3509
|
-
/* @__PURE__ */
|
|
3772
|
+
galleryItem?.base64 ? /* @__PURE__ */ jsxs19("span", { style: { fontSize: 9, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
|
|
3773
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "photo" }),
|
|
3510
3774
|
uploadStatus ? "lokal" : "von HF geladen"
|
|
3511
|
-
] }) : /* @__PURE__ */
|
|
3512
|
-
/* @__PURE__ */
|
|
3775
|
+
] }) : /* @__PURE__ */ jsxs19("span", { style: { fontSize: 9, color: "#f87171", display: "flex", alignItems: "center", gap: 2 }, children: [
|
|
3776
|
+
/* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "broken_image" }),
|
|
3513
3777
|
uploadStatus === "failed" ? "Binary nicht auf HF" : "wird geladen\u2026"
|
|
3514
3778
|
] })
|
|
3515
3779
|
] }),
|
|
3516
|
-
/* @__PURE__ */
|
|
3780
|
+
/* @__PURE__ */ jsx21("div", { style: { fontSize: 9, color: "rgba(255,255,255,0.25)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: payloadPreview })
|
|
3517
3781
|
] })
|
|
3518
3782
|
] }, `${eKey}_${i}`);
|
|
3519
3783
|
}),
|
|
3520
|
-
/* @__PURE__ */
|
|
3784
|
+
/* @__PURE__ */ jsxs19("div", { style: { padding: "6px 0 2px", fontSize: 9, color: "rgba(255,255,255,0.2)", textAlign: "right" }, children: [
|
|
3521
3785
|
events.length,
|
|
3522
3786
|
" Events gesamt \xB7 ",
|
|
3523
3787
|
[...confirmedEventKeys].length,
|
|
@@ -3526,9 +3790,9 @@ function EventMonitor({ events, confirmedEventKeys, galleryItems, imageUploadSta
|
|
|
3526
3790
|
] });
|
|
3527
3791
|
}
|
|
3528
3792
|
function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEventKeys = /* @__PURE__ */ new Set(), imageUploadStatus = /* @__PURE__ */ new Map() }) {
|
|
3529
|
-
const [selected, setSelected] =
|
|
3530
|
-
const [results, setResults] =
|
|
3531
|
-
const [expanded, setExpanded] =
|
|
3793
|
+
const [selected, setSelected] = useState16(null);
|
|
3794
|
+
const [results, setResults] = useState16({});
|
|
3795
|
+
const [expanded, setExpanded] = useState16({});
|
|
3532
3796
|
const withResults = galleryItems.filter((g) => g.base64 && g.status === "done");
|
|
3533
3797
|
const setRunning = (id) => setResults((r) => ({ ...r, [id]: { status: "running", steps: [], totalMs: 0 } }));
|
|
3534
3798
|
const setDone = (id, steps, t0) => {
|
|
@@ -3576,15 +3840,15 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
|
|
|
3576
3840
|
{ id: "img-hub", label: "Upload hub lib", icon: "package_2", desc: "uploadFile() via @huggingface/hub" },
|
|
3577
3841
|
{ id: "img-cdn", label: "Upload CDN lib", icon: "language", desc: "uploadFile() via esm.sh hub lib" }
|
|
3578
3842
|
];
|
|
3579
|
-
return /* @__PURE__ */
|
|
3580
|
-
noToken && /* @__PURE__ */
|
|
3581
|
-
/* @__PURE__ */
|
|
3843
|
+
return /* @__PURE__ */ jsxs19("div", { style: { display: "flex", flexDirection: "column", height: "100%", overflowY: "auto", padding: "12px 10px 80px", boxSizing: "border-box", fontFamily: "inherit" }, children: [
|
|
3844
|
+
noToken && /* @__PURE__ */ jsx21("div", { style: { marginBottom: 10, padding: "8px 12px", background: "rgba(248,113,113,0.08)", borderRadius: 8, border: "1px solid rgba(248,113,113,0.2)", fontSize: 12, color: "#f87171" }, children: "Kein HF-Token geladen \u2014 bitte zuerst Token im Sync-Tab eingeben." }),
|
|
3845
|
+
/* @__PURE__ */ jsx21("div", { style: { marginBottom: 12 }, children: /* @__PURE__ */ jsx21(
|
|
3582
3846
|
CollapsibleCard,
|
|
3583
3847
|
{
|
|
3584
3848
|
title: "Event Monitor",
|
|
3585
|
-
icon: /* @__PURE__ */
|
|
3849
|
+
icon: /* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "bolt" }),
|
|
3586
3850
|
defaultOpen: true,
|
|
3587
|
-
children: /* @__PURE__ */
|
|
3851
|
+
children: /* @__PURE__ */ jsx21(
|
|
3588
3852
|
EventMonitor,
|
|
3589
3853
|
{
|
|
3590
3854
|
events: allEvents,
|
|
@@ -3595,25 +3859,25 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
|
|
|
3595
3859
|
)
|
|
3596
3860
|
}
|
|
3597
3861
|
) }),
|
|
3598
|
-
/* @__PURE__ */
|
|
3862
|
+
/* @__PURE__ */ jsx21(
|
|
3599
3863
|
CollapsibleCard,
|
|
3600
3864
|
{
|
|
3601
3865
|
title: "Upload Tests",
|
|
3602
|
-
icon: /* @__PURE__ */
|
|
3866
|
+
icon: /* @__PURE__ */ jsx21("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "science" }),
|
|
3603
3867
|
defaultOpen: false,
|
|
3604
|
-
children: /* @__PURE__ */
|
|
3605
|
-
/* @__PURE__ */
|
|
3606
|
-
/* @__PURE__ */
|
|
3868
|
+
children: /* @__PURE__ */ jsxs19("div", { style: { padding: "10px 10px 4px" }, children: [
|
|
3869
|
+
/* @__PURE__ */ jsxs19("div", { style: { marginBottom: 14 }, children: [
|
|
3870
|
+
/* @__PURE__ */ jsxs19("div", { style: { fontSize: 10, fontWeight: 700, color: "rgba(255,255,255,0.3)", textTransform: "uppercase", letterSpacing: "0.08em", marginBottom: 8 }, children: [
|
|
3607
3871
|
"Bild ausw\xE4hlen (",
|
|
3608
3872
|
withResults.length,
|
|
3609
3873
|
" verf\xFCgbar)"
|
|
3610
3874
|
] }),
|
|
3611
|
-
withResults.length === 0 ? /* @__PURE__ */
|
|
3875
|
+
withResults.length === 0 ? /* @__PURE__ */ jsx21("div", { style: { fontSize: 12, color: "rgba(255,255,255,0.3)", fontStyle: "italic" }, children: "Noch keine Bilder in der Galerie. Generiere zuerst ein Bild oder lade von HF." }) : /* @__PURE__ */ jsx21("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 6 }, children: withResults.slice(0, 12).map((g) => /* @__PURE__ */ jsx21(
|
|
3612
3876
|
"button",
|
|
3613
3877
|
{
|
|
3614
3878
|
onClick: () => setSelected(g),
|
|
3615
3879
|
style: { padding: 0, border: `2px solid ${selected?.id === g.id ? "#0284c7" : "transparent"}`, borderRadius: 6, cursor: "pointer", overflow: "hidden", background: "none", lineHeight: 0 },
|
|
3616
|
-
children: /* @__PURE__ */
|
|
3880
|
+
children: /* @__PURE__ */ jsx21(
|
|
3617
3881
|
"img",
|
|
3618
3882
|
{
|
|
3619
3883
|
src: g.base64,
|
|
@@ -3624,38 +3888,38 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
|
|
|
3624
3888
|
},
|
|
3625
3889
|
g.id
|
|
3626
3890
|
)) }),
|
|
3627
|
-
selected && /* @__PURE__ */
|
|
3628
|
-
/* @__PURE__ */
|
|
3891
|
+
selected && /* @__PURE__ */ jsxs19("div", { style: { marginTop: 10, display: "flex", gap: 10, alignItems: "flex-start" }, children: [
|
|
3892
|
+
/* @__PURE__ */ jsx21(
|
|
3629
3893
|
"img",
|
|
3630
3894
|
{
|
|
3631
3895
|
src: selected.base64,
|
|
3632
3896
|
style: { width: 80, height: 80, objectFit: "cover", borderRadius: 8, border: "1px solid rgba(255,255,255,0.1)", flexShrink: 0 }
|
|
3633
3897
|
}
|
|
3634
3898
|
),
|
|
3635
|
-
/* @__PURE__ */
|
|
3636
|
-
/* @__PURE__ */
|
|
3637
|
-
/* @__PURE__ */
|
|
3899
|
+
/* @__PURE__ */ jsxs19("div", { style: { flex: 1, minWidth: 0 }, children: [
|
|
3900
|
+
/* @__PURE__ */ jsx21("div", { style: { fontSize: 11, fontWeight: 700, color: "rgba(255,255,255,0.7)", marginBottom: 2 }, children: "Ausgew\xE4hlt" }),
|
|
3901
|
+
/* @__PURE__ */ jsxs19("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", wordBreak: "break-all" }, children: [
|
|
3638
3902
|
"ID: ",
|
|
3639
3903
|
selected.id
|
|
3640
3904
|
] }),
|
|
3641
|
-
/* @__PURE__ */
|
|
3905
|
+
/* @__PURE__ */ jsxs19("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", marginTop: 2 }, children: [
|
|
3642
3906
|
"Ziel: test/",
|
|
3643
3907
|
selected.id,
|
|
3644
3908
|
".jpg"
|
|
3645
3909
|
] }),
|
|
3646
|
-
selected.prompt && /* @__PURE__ */
|
|
3910
|
+
selected.prompt && /* @__PURE__ */ jsx21("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.25)", marginTop: 2, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: selected.prompt })
|
|
3647
3911
|
] })
|
|
3648
3912
|
] })
|
|
3649
3913
|
] }),
|
|
3650
|
-
/* @__PURE__ */
|
|
3651
|
-
/* @__PURE__ */
|
|
3914
|
+
/* @__PURE__ */ jsxs19("div", { style: { marginBottom: 14 }, children: [
|
|
3915
|
+
/* @__PURE__ */ jsxs19("div", { style: { fontSize: 10, fontWeight: 700, color: "rgba(255,255,255,0.3)", textTransform: "uppercase", letterSpacing: "0.1em", marginBottom: 8, borderBottom: "1px solid rgba(255,255,255,0.06)", paddingBottom: 4 }, children: [
|
|
3652
3916
|
"Bild hochladen \u2192 test/",
|
|
3653
3917
|
"{",
|
|
3654
3918
|
"id",
|
|
3655
3919
|
"}",
|
|
3656
3920
|
".jpg"
|
|
3657
3921
|
] }),
|
|
3658
|
-
imgTests.map((t) => /* @__PURE__ */
|
|
3922
|
+
imgTests.map((t) => /* @__PURE__ */ jsx21(
|
|
3659
3923
|
TestCard,
|
|
3660
3924
|
{
|
|
3661
3925
|
id: t.id,
|
|
@@ -3671,13 +3935,13 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
|
|
|
3671
3935
|
t.id
|
|
3672
3936
|
))
|
|
3673
3937
|
] }),
|
|
3674
|
-
/* @__PURE__ */
|
|
3675
|
-
/* @__PURE__ */
|
|
3938
|
+
/* @__PURE__ */ jsxs19("div", { style: { marginBottom: 4 }, children: [
|
|
3939
|
+
/* @__PURE__ */ jsxs19("div", { style: { fontSize: 10, fontWeight: 700, color: "rgba(255,255,255,0.3)", textTransform: "uppercase", letterSpacing: "0.1em", marginBottom: 8, borderBottom: "1px solid rgba(255,255,255,0.06)", paddingBottom: 4 }, children: [
|
|
3676
3940
|
"Event schreiben \u2192 ",
|
|
3677
3941
|
namespace || "(kein namespace)",
|
|
3678
3942
|
"test/events/"
|
|
3679
3943
|
] }),
|
|
3680
|
-
/* @__PURE__ */
|
|
3944
|
+
/* @__PURE__ */ jsx21(
|
|
3681
3945
|
TestCard,
|
|
3682
3946
|
{
|
|
3683
3947
|
id: "event",
|
|
@@ -3699,7 +3963,7 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
|
|
|
3699
3963
|
}
|
|
3700
3964
|
|
|
3701
3965
|
// src/components/AvatarArchitectApp.tsx
|
|
3702
|
-
import { Fragment as Fragment9, jsx as
|
|
3966
|
+
import { Fragment as Fragment9, jsx as jsx22, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3703
3967
|
function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onSelectMedia, buildInfo, initialHfToken, hfNamespace, allowDevNamespace, onFetchServerProjects, onServerSave, onServerLoad, onServerDelete }) {
|
|
3704
3968
|
useEffect6(() => {
|
|
3705
3969
|
const id = "flow-styles";
|
|
@@ -3710,19 +3974,19 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
3710
3974
|
document.head.appendChild(style);
|
|
3711
3975
|
}
|
|
3712
3976
|
}, []);
|
|
3713
|
-
const [showStart, setShowStart] =
|
|
3714
|
-
const [layoutChoice, setLayoutChoice] =
|
|
3977
|
+
const [showStart, setShowStart] = useState17(true);
|
|
3978
|
+
const [layoutChoice, setLayoutChoice] = useState17(() => {
|
|
3715
3979
|
try {
|
|
3716
3980
|
return localStorage.getItem("aa-layout") || null;
|
|
3717
3981
|
} catch {
|
|
3718
3982
|
return null;
|
|
3719
3983
|
}
|
|
3720
3984
|
});
|
|
3721
|
-
const [projectLoaded, setProjectLoaded] =
|
|
3722
|
-
const [hfToken, setHfToken] =
|
|
3723
|
-
const [hfTokenInput, setHfTokenInput] =
|
|
3724
|
-
const [isLoadingFromHF, setIsLoadingFromHF] =
|
|
3725
|
-
const [hfNamespaceLocal, setHfNamespaceLocal] =
|
|
3985
|
+
const [projectLoaded, setProjectLoaded] = useState17(false);
|
|
3986
|
+
const [hfToken, setHfToken] = useState17(initialHfToken || "");
|
|
3987
|
+
const [hfTokenInput, setHfTokenInput] = useState17(initialHfToken || "");
|
|
3988
|
+
const [isLoadingFromHF, setIsLoadingFromHF] = useState17(false);
|
|
3989
|
+
const [hfNamespaceLocal, setHfNamespaceLocal] = useState17(() => {
|
|
3726
3990
|
try {
|
|
3727
3991
|
const stored = localStorage.getItem("aa-hf-namespace");
|
|
3728
3992
|
if (stored !== null) return stored;
|
|
@@ -3731,7 +3995,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
3731
3995
|
return "";
|
|
3732
3996
|
}
|
|
3733
3997
|
});
|
|
3734
|
-
const [hfNamespaceFromServer, setHfNamespaceFromServer] =
|
|
3998
|
+
const [hfNamespaceFromServer, setHfNamespaceFromServer] = useState17(null);
|
|
3735
3999
|
useEffect6(() => {
|
|
3736
4000
|
if (hfNamespace !== void 0) return;
|
|
3737
4001
|
const backendUrl = typeof window !== "undefined" ? window.BACKEND_URL || window.location.origin : null;
|
|
@@ -3754,35 +4018,35 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
3754
4018
|
refresh: refreshHF,
|
|
3755
4019
|
hasStateZip
|
|
3756
4020
|
} = useHFState(hfToken, effectiveNamespace);
|
|
3757
|
-
const [imageUploadStatus, setImageUploadStatus] =
|
|
3758
|
-
const [bootstrapLog, setBootstrapLog] =
|
|
3759
|
-
const [isBootstrapping, setIsBootstrapping] =
|
|
3760
|
-
const syncTopSlot = /* @__PURE__ */
|
|
3761
|
-
localOnlyCount > 0 && /* @__PURE__ */
|
|
4021
|
+
const [imageUploadStatus, setImageUploadStatus] = useState17(/* @__PURE__ */ new Map());
|
|
4022
|
+
const [bootstrapLog, setBootstrapLog] = useState17([]);
|
|
4023
|
+
const [isBootstrapping, setIsBootstrapping] = useState17(false);
|
|
4024
|
+
const syncTopSlot = /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
4025
|
+
localOnlyCount > 0 && /* @__PURE__ */ jsxs20("div", { style: { background: "rgba(234,179,8,0.15)", border: "1px solid rgba(234,179,8,0.3)", padding: "4px 10px", fontSize: 11, color: "#fbbf24", borderRadius: 4, marginBottom: 4 }, children: [
|
|
3762
4026
|
"\u26A0 ",
|
|
3763
4027
|
localOnlyCount,
|
|
3764
4028
|
" lokale Event",
|
|
3765
4029
|
localOnlyCount > 1 ? "s" : "",
|
|
3766
4030
|
" noch nicht auf HF best\xE4tigt"
|
|
3767
4031
|
] }),
|
|
3768
|
-
pendingBufferCount > 0 && /* @__PURE__ */
|
|
4032
|
+
pendingBufferCount > 0 && /* @__PURE__ */ jsxs20("div", { style: { background: "linear-gradient(90deg,#f59e0b,#ef4444)", padding: "4px 10px", fontSize: 11, color: "#fff", borderRadius: 4, marginBottom: 4 }, children: [
|
|
3769
4033
|
pendingBufferCount,
|
|
3770
4034
|
" \xC4nderung",
|
|
3771
4035
|
pendingBufferCount > 1 ? "en" : "",
|
|
3772
4036
|
" lokal \u2014 bei Flow-Reload verloren wenn nicht synchronisiert"
|
|
3773
4037
|
] }),
|
|
3774
|
-
eventCount > 100 && /* @__PURE__ */
|
|
4038
|
+
eventCount > 100 && /* @__PURE__ */ jsxs20("div", { style: { background: "#dc2626", color: "#fff", padding: "5px 10px", borderRadius: 4, marginBottom: 4, fontWeight: 600, fontSize: 11 }, children: [
|
|
3775
4039
|
"\u26A0 ",
|
|
3776
4040
|
eventCount,
|
|
3777
4041
|
" Events nicht konsolidiert \u2014 Konsolidierung dringend empfohlen"
|
|
3778
4042
|
] }),
|
|
3779
|
-
eventCount > 50 && eventCount <= 100 && /* @__PURE__ */
|
|
4043
|
+
eventCount > 50 && eventCount <= 100 && /* @__PURE__ */ jsxs20("div", { style: { background: "#44403c", color: "#a8a29e", padding: "4px 10px", borderRadius: 4, marginBottom: 4, fontSize: 11 }, children: [
|
|
3780
4044
|
eventCount,
|
|
3781
4045
|
" Events seit letzter Konsolidierung \u2014 Konsolidierung empfohlen"
|
|
3782
4046
|
] }),
|
|
3783
|
-
hfToken && !hasStateZip && !isHfRefreshing && /* @__PURE__ */
|
|
3784
|
-
/* @__PURE__ */
|
|
3785
|
-
/* @__PURE__ */
|
|
4047
|
+
hfToken && !hasStateZip && !isHfRefreshing && /* @__PURE__ */ jsxs20("div", { style: { background: "#1c1917", border: "1px solid #44403c", borderRadius: 6, padding: "10px 12px" }, children: [
|
|
4048
|
+
/* @__PURE__ */ jsx22("div", { style: { fontSize: 12, color: "#a8a29e", marginBottom: 6 }, children: effectiveNamespace ? `Kein State-Snapshot in HF (${effectiveNamespace}) \u2014 aus Legacy-Daten (tags.json + metadata.json) migrieren?` : "Namespace wird geladen\u2026" }),
|
|
4049
|
+
/* @__PURE__ */ jsx22(
|
|
3786
4050
|
"button",
|
|
3787
4051
|
{
|
|
3788
4052
|
disabled: isBootstrapping || !effectiveNamespace,
|
|
@@ -3803,10 +4067,10 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
3803
4067
|
children: isBootstrapping ? "Migriere\u2026" : "Legacy-Migration starten"
|
|
3804
4068
|
}
|
|
3805
4069
|
),
|
|
3806
|
-
bootstrapLog.length > 0 && /* @__PURE__ */
|
|
4070
|
+
bootstrapLog.length > 0 && /* @__PURE__ */ jsx22("div", { style: { marginTop: 6, fontFamily: "monospace", fontSize: 10, color: "#78716c", lineHeight: 1.6 }, children: bootstrapLog.map((l, i) => /* @__PURE__ */ jsx22("div", { children: l }, i)) })
|
|
3807
4071
|
] })
|
|
3808
4072
|
] });
|
|
3809
|
-
const wsInputRef =
|
|
4073
|
+
const wsInputRef = useRef8(null);
|
|
3810
4074
|
const startApp = (choice) => {
|
|
3811
4075
|
try {
|
|
3812
4076
|
localStorage.setItem("aa-layout", choice);
|
|
@@ -3815,15 +4079,15 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
3815
4079
|
setLayoutChoice(choice);
|
|
3816
4080
|
setShowStart(false);
|
|
3817
4081
|
};
|
|
3818
|
-
const [nodes, setNodes] =
|
|
3819
|
-
const [edges, setEdges] =
|
|
3820
|
-
const [history, setHistory] =
|
|
3821
|
-
const [galleryItems, setGalleryItems] =
|
|
3822
|
-
const galleryItemsRef =
|
|
4082
|
+
const [nodes, setNodes] = useState17([{ id: "1", type: "custom", position: { x: 0, y: 0 }, data: { label: "Fine Art Project", placeholder: "Name..." } }]);
|
|
4083
|
+
const [edges, setEdges] = useState17([]);
|
|
4084
|
+
const [history, setHistory] = useState17([]);
|
|
4085
|
+
const [galleryItems, setGalleryItems] = useState17([]);
|
|
4086
|
+
const galleryItemsRef = useRef8([]);
|
|
3823
4087
|
useEffect6(() => {
|
|
3824
4088
|
galleryItemsRef.current = galleryItems;
|
|
3825
4089
|
}, [galleryItems]);
|
|
3826
|
-
const hfImageNotFoundRef =
|
|
4090
|
+
const hfImageNotFoundRef = useRef8(/* @__PURE__ */ new Map());
|
|
3827
4091
|
useEffect6(() => {
|
|
3828
4092
|
if (!hfState) return;
|
|
3829
4093
|
if (hfState.tags?.by_category) setWorkspaceTags(hfState.tags);
|
|
@@ -3866,62 +4130,62 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
3866
4130
|
});
|
|
3867
4131
|
}
|
|
3868
4132
|
}, [hfState]);
|
|
3869
|
-
const [activePrompt, setActivePrompt] =
|
|
3870
|
-
const [isSynthesizing, setIsSynthesizing] =
|
|
3871
|
-
const [activeGenerationsCount, setActiveGenerationsCount] =
|
|
3872
|
-
const [currentResult, setCurrentResult] =
|
|
3873
|
-
const [focusedNodeId, setFocusedNodeId] =
|
|
3874
|
-
const [leftTab, setLeftTab] =
|
|
3875
|
-
const [promptFeedback, setPromptFeedback] =
|
|
3876
|
-
const [lastPromptPayload, setLastPromptPayload] =
|
|
3877
|
-
const [isPromptTabGenerating, setIsPromptTabGenerating] =
|
|
3878
|
-
const [activeTab, setActiveTab] =
|
|
3879
|
-
const [mobileTab, setMobileTab] =
|
|
3880
|
-
const [middlePanel, setMiddlePanel] =
|
|
3881
|
-
const [recentLabItems, setRecentLabItems] =
|
|
3882
|
-
const [aspectRatio, setAspectRatio] =
|
|
3883
|
-
const [selectedModel, setSelectedModel] =
|
|
3884
|
-
const [seed, setSeed] =
|
|
3885
|
-
const [seedMode, setSeedMode] =
|
|
3886
|
-
const [isLeftCollapsed, setIsLeftCollapsed] =
|
|
3887
|
-
const [isRightCollapsed, setIsRightCollapsed] =
|
|
3888
|
-
const [leftPanelWidth, setLeftPanelWidth] =
|
|
4133
|
+
const [activePrompt, setActivePrompt] = useState17("");
|
|
4134
|
+
const [isSynthesizing, setIsSynthesizing] = useState17(false);
|
|
4135
|
+
const [activeGenerationsCount, setActiveGenerationsCount] = useState17(0);
|
|
4136
|
+
const [currentResult, setCurrentResult] = useState17(null);
|
|
4137
|
+
const [focusedNodeId, setFocusedNodeId] = useState17(null);
|
|
4138
|
+
const [leftTab, setLeftTab] = useState17("prompt");
|
|
4139
|
+
const [promptFeedback, setPromptFeedback] = useState17(null);
|
|
4140
|
+
const [lastPromptPayload, setLastPromptPayload] = useState17(null);
|
|
4141
|
+
const [isPromptTabGenerating, setIsPromptTabGenerating] = useState17(false);
|
|
4142
|
+
const [activeTab, setActiveTab] = useState17("history");
|
|
4143
|
+
const [mobileTab, setMobileTab] = useState17("stage");
|
|
4144
|
+
const [middlePanel, setMiddlePanel] = useState17("stage");
|
|
4145
|
+
const [recentLabItems, setRecentLabItems] = useState17([]);
|
|
4146
|
+
const [aspectRatio, setAspectRatio] = useState17("1:1");
|
|
4147
|
+
const [selectedModel, setSelectedModel] = useState17("\u{1F34C} Nano Banana Pro");
|
|
4148
|
+
const [seed, setSeed] = useState17(Math.floor(Math.random() * 1e6));
|
|
4149
|
+
const [seedMode, setSeedMode] = useState17("random");
|
|
4150
|
+
const [isLeftCollapsed, setIsLeftCollapsed] = useState17(false);
|
|
4151
|
+
const [isRightCollapsed, setIsRightCollapsed] = useState17(false);
|
|
4152
|
+
const [leftPanelWidth, setLeftPanelWidth] = useState17(() => {
|
|
3889
4153
|
try {
|
|
3890
4154
|
return parseInt(localStorage.getItem("aa-left-width") || "260", 10);
|
|
3891
4155
|
} catch {
|
|
3892
4156
|
return 260;
|
|
3893
4157
|
}
|
|
3894
4158
|
});
|
|
3895
|
-
const [rightPanelWidth, setRightPanelWidth] =
|
|
4159
|
+
const [rightPanelWidth, setRightPanelWidth] = useState17(() => {
|
|
3896
4160
|
try {
|
|
3897
4161
|
return parseInt(localStorage.getItem("aa-right-width") || "320", 10);
|
|
3898
4162
|
} catch {
|
|
3899
4163
|
return 320;
|
|
3900
4164
|
}
|
|
3901
4165
|
});
|
|
3902
|
-
const [isPromptCollapsed, setIsPromptCollapsed] =
|
|
3903
|
-
const [projectActionState, setProjectActionState] =
|
|
3904
|
-
const syncServerDataRef =
|
|
3905
|
-
const [workspaceTags, setWorkspaceTags] =
|
|
3906
|
-
const [serverProjects, setServerProjects] =
|
|
3907
|
-
const [isLoadingFromServer, setIsLoadingFromServer] =
|
|
3908
|
-
const [highContrast, setHighContrast] =
|
|
4166
|
+
const [isPromptCollapsed, setIsPromptCollapsed] = useState17(false);
|
|
4167
|
+
const [projectActionState, setProjectActionState] = useState17("idle");
|
|
4168
|
+
const syncServerDataRef = useRef8(null);
|
|
4169
|
+
const [workspaceTags, setWorkspaceTags] = useState17(null);
|
|
4170
|
+
const [serverProjects, setServerProjects] = useState17([]);
|
|
4171
|
+
const [isLoadingFromServer, setIsLoadingFromServer] = useState17(false);
|
|
4172
|
+
const [highContrast, setHighContrast] = useState17(() => {
|
|
3909
4173
|
try {
|
|
3910
4174
|
return localStorage.getItem("aa-contrast") === "high";
|
|
3911
4175
|
} catch {
|
|
3912
4176
|
return false;
|
|
3913
4177
|
}
|
|
3914
4178
|
});
|
|
3915
|
-
const [activeReferenceId, setActiveReferenceId] =
|
|
3916
|
-
const [activeReferenceThumbnail, setActiveReferenceThumbnail] =
|
|
3917
|
-
const [isScanningImage, setIsScanningImage] =
|
|
3918
|
-
const [touchStartX, setTouchStartX] =
|
|
3919
|
-
const [isFullscreen, setIsFullscreen] =
|
|
3920
|
-
const [zoomScale, setZoomScale] =
|
|
3921
|
-
const [zoomOffset, setZoomOffset] =
|
|
3922
|
-
const lastPinchDist =
|
|
3923
|
-
const lastTapTime =
|
|
3924
|
-
const dragStart =
|
|
4179
|
+
const [activeReferenceId, setActiveReferenceId] = useState17(null);
|
|
4180
|
+
const [activeReferenceThumbnail, setActiveReferenceThumbnail] = useState17(null);
|
|
4181
|
+
const [isScanningImage, setIsScanningImage] = useState17(false);
|
|
4182
|
+
const [touchStartX, setTouchStartX] = useState17(null);
|
|
4183
|
+
const [isFullscreen, setIsFullscreen] = useState17(false);
|
|
4184
|
+
const [zoomScale, setZoomScale] = useState17(1);
|
|
4185
|
+
const [zoomOffset, setZoomOffset] = useState17({ x: 0, y: 0 });
|
|
4186
|
+
const lastPinchDist = useRef8(null);
|
|
4187
|
+
const lastTapTime = useRef8(0);
|
|
4188
|
+
const dragStart = useRef8(null);
|
|
3925
4189
|
const openFullscreen = () => {
|
|
3926
4190
|
setIsFullscreen(true);
|
|
3927
4191
|
setZoomScale(1);
|
|
@@ -4065,16 +4329,16 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4065
4329
|
}
|
|
4066
4330
|
};
|
|
4067
4331
|
const currentIndex = useMemo2(() => history.findIndex((h) => h.id === currentResult?.id), [history, currentResult]);
|
|
4068
|
-
const goToPrev =
|
|
4332
|
+
const goToPrev = useCallback3(() => {
|
|
4069
4333
|
if (currentIndex > 0) setCurrentResult(history[currentIndex - 1]);
|
|
4070
4334
|
}, [currentIndex, history]);
|
|
4071
|
-
const goToNext =
|
|
4335
|
+
const goToNext = useCallback3(() => {
|
|
4072
4336
|
if (currentIndex < history.length - 1) setCurrentResult(history[currentIndex + 1]);
|
|
4073
4337
|
}, [currentIndex, history]);
|
|
4074
4338
|
const hcStyle = highContrast ? { filter: "brightness(1.6) contrast(1.05)" } : void 0;
|
|
4075
4339
|
const isGenerating = activeGenerationsCount > 0;
|
|
4076
4340
|
useKeyboardNavigation(history, currentResult, setCurrentResult);
|
|
4077
|
-
const getSubtreeFormat =
|
|
4341
|
+
const getSubtreeFormat = useCallback3((nodeId, depth = 0) => {
|
|
4078
4342
|
const node = nodes.find((n) => n.id === nodeId);
|
|
4079
4343
|
if (!node) return "";
|
|
4080
4344
|
const childrenIds = edges.filter((e) => e.source === nodeId).map((e) => e.target);
|
|
@@ -4102,13 +4366,14 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4102
4366
|
const activeSeed = seedMode === "random" ? Math.floor(Math.random() * 1e9) : seed;
|
|
4103
4367
|
const newGen = { id: genId, nodeId: overrideNodeId || focusedNodeId || "1", status: "processing", timestamp: Date.now(), prompt: promptToUse, seed: activeSeed, model: selectedModel, tags: [], type: "generation" };
|
|
4104
4368
|
setHistory((prev) => [newGen, ...prev]);
|
|
4369
|
+
setGalleryItems((prev) => [newGen, ...prev]);
|
|
4105
4370
|
if (!options.silent) setCurrentResult(newGen);
|
|
4106
4371
|
if (seedMode === "random") setSeed(activeSeed);
|
|
4107
4372
|
try {
|
|
4108
4373
|
const { base64, mediaId } = await onGenerateImage(buildImageGenerationOptions(promptToUse, aspectRatio, selectedModel, useReferenceId ?? activeReferenceId ?? void 0));
|
|
4109
4374
|
const finishedGen = { ...newGen, status: "done", base64: `data:image/png;base64,${base64}`, mediaId };
|
|
4110
4375
|
setHistory((prev) => prev.map((g) => g.id === genId ? finishedGen : g));
|
|
4111
|
-
setGalleryItems((prev) =>
|
|
4376
|
+
setGalleryItems((prev) => prev.map((g) => g.id === genId ? finishedGen : g));
|
|
4112
4377
|
setCurrentResult((prev) => {
|
|
4113
4378
|
if (!prev) return finishedGen;
|
|
4114
4379
|
if (prev.id === genId || !options.silent) return finishedGen;
|
|
@@ -4138,6 +4403,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4138
4403
|
} catch (err) {
|
|
4139
4404
|
const errorGen = { ...newGen, status: "error", error: { message: err.message || "Unbekannter Fehler", details: err.toString() } };
|
|
4140
4405
|
setHistory((prev) => prev.map((g) => g.id === genId ? errorGen : g));
|
|
4406
|
+
setGalleryItems((prev) => prev.filter((g) => g.id !== genId));
|
|
4141
4407
|
if (!options.silent || currentResult?.id === genId) setCurrentResult(errorGen);
|
|
4142
4408
|
} finally {
|
|
4143
4409
|
setActiveGenerationsCount((prev) => Math.max(0, prev - 1));
|
|
@@ -4452,7 +4718,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4452
4718
|
};
|
|
4453
4719
|
if (isFullscreen && currentResult?.base64) {
|
|
4454
4720
|
const fsBase64 = currentResult.base64.startsWith("data:") ? currentResult.base64 : `data:image/png;base64,${currentResult.base64}`;
|
|
4455
|
-
return /* @__PURE__ */
|
|
4721
|
+
return /* @__PURE__ */ jsxs20(
|
|
4456
4722
|
"div",
|
|
4457
4723
|
{
|
|
4458
4724
|
className: "fixed inset-0 bg-black z-50 flex items-center justify-center overflow-hidden touch-none",
|
|
@@ -4460,7 +4726,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4460
4726
|
onTouchMove: handleFsTouchMove,
|
|
4461
4727
|
onTouchEnd: handleFsTouchEnd,
|
|
4462
4728
|
children: [
|
|
4463
|
-
/* @__PURE__ */
|
|
4729
|
+
/* @__PURE__ */ jsx22(
|
|
4464
4730
|
"img",
|
|
4465
4731
|
{
|
|
4466
4732
|
src: fsBase64,
|
|
@@ -4477,77 +4743,77 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4477
4743
|
}
|
|
4478
4744
|
}
|
|
4479
4745
|
),
|
|
4480
|
-
/* @__PURE__ */
|
|
4481
|
-
zoomScale > 1 && /* @__PURE__ */
|
|
4746
|
+
/* @__PURE__ */ jsx22("button", { onClick: closeFullscreen, className: "absolute top-4 right-4 w-10 h-10 flex items-center justify-center rounded-full bg-black/70 border border-white/20 z-10", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[22px]", children: "close" }) }),
|
|
4747
|
+
zoomScale > 1 && /* @__PURE__ */ jsx22("button", { onClick: () => {
|
|
4482
4748
|
setZoomScale(1);
|
|
4483
4749
|
setZoomOffset({ x: 0, y: 0 });
|
|
4484
|
-
}, className: "absolute top-4 left-4 w-10 h-10 flex items-center justify-center rounded-full bg-black/70 border border-white/20 z-10", children: /* @__PURE__ */
|
|
4485
|
-
history.length > 1 && /* @__PURE__ */
|
|
4486
|
-
/* @__PURE__ */
|
|
4750
|
+
}, className: "absolute top-4 left-4 w-10 h-10 flex items-center justify-center rounded-full bg-black/70 border border-white/20 z-10", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "zoom_out_map" }) }),
|
|
4751
|
+
history.length > 1 && /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
4752
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => {
|
|
4487
4753
|
if (currentIndex > 0) setCurrentResult(history[currentIndex - 1]);
|
|
4488
|
-
}, disabled: currentIndex <= 0, className: "absolute left-2 top-1/2 -translate-y-1/2 w-10 h-10 flex items-center justify-center rounded-full bg-black/60 border border-white/10 disabled:opacity-0", children: /* @__PURE__ */
|
|
4489
|
-
/* @__PURE__ */
|
|
4754
|
+
}, disabled: currentIndex <= 0, className: "absolute left-2 top-1/2 -translate-y-1/2 w-10 h-10 flex items-center justify-center rounded-full bg-black/60 border border-white/10 disabled:opacity-0", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_left" }) }),
|
|
4755
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => {
|
|
4490
4756
|
if (currentIndex < history.length - 1) setCurrentResult(history[currentIndex + 1]);
|
|
4491
|
-
}, disabled: currentIndex >= history.length - 1, className: "absolute right-2 top-1/2 -translate-y-1/2 w-10 h-10 flex items-center justify-center rounded-full bg-black/60 border border-white/10 disabled:opacity-0", children: /* @__PURE__ */
|
|
4492
|
-
/* @__PURE__ */
|
|
4757
|
+
}, disabled: currentIndex >= history.length - 1, className: "absolute right-2 top-1/2 -translate-y-1/2 w-10 h-10 flex items-center justify-center rounded-full bg-black/60 border border-white/10 disabled:opacity-0", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_right" }) }),
|
|
4758
|
+
/* @__PURE__ */ jsxs20("div", { className: "absolute bottom-6 left-1/2 -translate-x-1/2 bg-black/60 rounded-full px-3 py-0.5 text-[10px] text-white/40 font-mono", children: [
|
|
4493
4759
|
currentIndex + 1,
|
|
4494
4760
|
" / ",
|
|
4495
4761
|
history.length
|
|
4496
4762
|
] })
|
|
4497
4763
|
] }),
|
|
4498
|
-
zoomScale === 1 && /* @__PURE__ */
|
|
4764
|
+
zoomScale === 1 && /* @__PURE__ */ jsx22("div", { className: "absolute bottom-6 right-4 text-[9px] text-white/20 font-mono", children: "Pinch zum Zoomen \xB7 Doppeltipp 2.5\xD7" })
|
|
4499
4765
|
]
|
|
4500
4766
|
}
|
|
4501
4767
|
);
|
|
4502
4768
|
}
|
|
4503
4769
|
if (showStart) {
|
|
4504
|
-
return /* @__PURE__ */
|
|
4505
|
-
/* @__PURE__ */
|
|
4770
|
+
return /* @__PURE__ */ jsxs20("div", { className: "fixed inset-0 bg-[#0e0e0e] flex flex-col items-center justify-center p-6", style: { gap: 28, ...hcStyle }, children: [
|
|
4771
|
+
/* @__PURE__ */ jsx22("input", { ref: wsInputRef, type: "file", accept: ".zip", className: "hidden", onChange: (e) => {
|
|
4506
4772
|
const f = e.target.files?.[0];
|
|
4507
4773
|
if (f) handleProjectImport(f);
|
|
4508
4774
|
e.target.value = "";
|
|
4509
4775
|
} }),
|
|
4510
|
-
/* @__PURE__ */
|
|
4511
|
-
/* @__PURE__ */
|
|
4512
|
-
/* @__PURE__ */
|
|
4513
|
-
/* @__PURE__ */
|
|
4776
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-1", children: [
|
|
4777
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-white/15 text-[44px]", children: "palette" }),
|
|
4778
|
+
/* @__PURE__ */ jsx22("span", { className: "text-white/25 text-[10px] font-bold uppercase tracking-[0.25em]", children: "Avatar Architect" }),
|
|
4779
|
+
/* @__PURE__ */ jsxs20("span", { className: "text-white text-[13px] font-mono", children: [
|
|
4514
4780
|
"v",
|
|
4515
4781
|
LIB_VERSION
|
|
4516
4782
|
] })
|
|
4517
4783
|
] }),
|
|
4518
|
-
/* @__PURE__ */
|
|
4784
|
+
/* @__PURE__ */ jsxs20(
|
|
4519
4785
|
"button",
|
|
4520
4786
|
{
|
|
4521
4787
|
onClick: toggleContrast,
|
|
4522
4788
|
className: "flex items-center gap-3 px-5 py-3 rounded-2xl border transition-colors",
|
|
4523
4789
|
style: { borderColor: highContrast ? "rgba(255,255,255,0.3)" : "rgba(255,255,255,0.08)", background: highContrast ? "rgba(255,255,255,0.08)" : "transparent" },
|
|
4524
4790
|
children: [
|
|
4525
|
-
/* @__PURE__ */
|
|
4526
|
-
/* @__PURE__ */
|
|
4527
|
-
/* @__PURE__ */
|
|
4528
|
-
/* @__PURE__ */
|
|
4791
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[22px]", style: { color: highContrast ? "#fff" : "rgba(255,255,255,0.35)" }, children: highContrast ? "light_mode" : "dark_mode" }),
|
|
4792
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-start", children: [
|
|
4793
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[13px] font-bold", style: { color: highContrast ? "#fff" : "rgba(255,255,255,0.5)" }, children: highContrast ? "Hoher Kontrast" : "Normaler Kontrast" }),
|
|
4794
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[10px]", style: { color: "rgba(255,255,255,0.25)" }, children: "Tippen zum Umschalten" })
|
|
4529
4795
|
] })
|
|
4530
4796
|
]
|
|
4531
4797
|
}
|
|
4532
4798
|
),
|
|
4533
|
-
/* @__PURE__ */
|
|
4534
|
-
/* @__PURE__ */
|
|
4799
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
|
|
4800
|
+
/* @__PURE__ */ jsxs20(
|
|
4535
4801
|
"button",
|
|
4536
4802
|
{
|
|
4537
4803
|
onClick: () => wsInputRef.current?.click(),
|
|
4538
4804
|
className: "w-full flex items-center justify-center gap-3 rounded-2xl font-bold text-[14px] uppercase tracking-wide text-white active:scale-95 transition-transform",
|
|
4539
4805
|
style: { height: 56, background: projectLoaded ? "#16a34a" : "#0284c7" },
|
|
4540
4806
|
children: [
|
|
4541
|
-
/* @__PURE__ */
|
|
4807
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[22px]", children: projectLoaded ? "check_circle" : "folder_zip" }),
|
|
4542
4808
|
projectLoaded ? "Projekt geladen \u2713" : "Projekt laden (.zip)"
|
|
4543
4809
|
]
|
|
4544
4810
|
}
|
|
4545
4811
|
),
|
|
4546
|
-
!projectLoaded && /* @__PURE__ */
|
|
4812
|
+
!projectLoaded && /* @__PURE__ */ jsx22("span", { className: "text-white/20 text-[10px] text-center", children: "Baum, Bilder und Einstellungen wiederherstellen" })
|
|
4547
4813
|
] }),
|
|
4548
|
-
/* @__PURE__ */
|
|
4549
|
-
!initialHfToken && /* @__PURE__ */
|
|
4550
|
-
/* @__PURE__ */
|
|
4814
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
|
|
4815
|
+
!initialHfToken && /* @__PURE__ */ jsxs20("div", { className: "flex gap-2 w-full", children: [
|
|
4816
|
+
/* @__PURE__ */ jsx22(
|
|
4551
4817
|
"input",
|
|
4552
4818
|
{
|
|
4553
4819
|
type: "password",
|
|
@@ -4563,7 +4829,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4563
4829
|
style: { height: 44, background: "rgba(255,255,255,0.05)", border: "1px solid rgba(255,255,255,0.1)", color: "rgba(255,255,255,0.7)" }
|
|
4564
4830
|
}
|
|
4565
4831
|
),
|
|
4566
|
-
hfTokenInput.trim() && /* @__PURE__ */
|
|
4832
|
+
hfTokenInput.trim() && /* @__PURE__ */ jsx22(
|
|
4567
4833
|
"button",
|
|
4568
4834
|
{
|
|
4569
4835
|
type: "button",
|
|
@@ -4574,9 +4840,9 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4574
4840
|
}
|
|
4575
4841
|
)
|
|
4576
4842
|
] }),
|
|
4577
|
-
!hfNamespace && /* @__PURE__ */
|
|
4578
|
-
/* @__PURE__ */
|
|
4579
|
-
["app.art-by-rolands.de/", "dev-app.art-by-rolands.de/"].map((ns, i) => /* @__PURE__ */
|
|
4843
|
+
!hfNamespace && /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-3 w-full", children: [
|
|
4844
|
+
/* @__PURE__ */ jsx22("span", { className: "text-white/25 text-[10px] uppercase tracking-widest font-bold flex-shrink-0", children: "State:" }),
|
|
4845
|
+
["app.art-by-rolands.de/", "dev-app.art-by-rolands.de/"].map((ns, i) => /* @__PURE__ */ jsx22(
|
|
4580
4846
|
"button",
|
|
4581
4847
|
{
|
|
4582
4848
|
onClick: () => {
|
|
@@ -4596,14 +4862,14 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4596
4862
|
ns
|
|
4597
4863
|
))
|
|
4598
4864
|
] }),
|
|
4599
|
-
hfToken && /* @__PURE__ */
|
|
4865
|
+
hfToken && /* @__PURE__ */ jsxs20(
|
|
4600
4866
|
"button",
|
|
4601
4867
|
{
|
|
4602
4868
|
disabled: isLoadingFromHF,
|
|
4603
4869
|
onClick: async () => {
|
|
4604
4870
|
setIsLoadingFromHF(true);
|
|
4605
4871
|
try {
|
|
4606
|
-
const { hfListProjects: hfListProjects2, hfDownloadProject: hfDownloadProject2 } = await import("./hfStateService-
|
|
4872
|
+
const { hfListProjects: hfListProjects2, hfDownloadProject: hfDownloadProject2 } = await import("./hfStateService-TC65WQXK.mjs");
|
|
4607
4873
|
const projects = await hfListProjects2(hfToken);
|
|
4608
4874
|
if (projects.length > 0) {
|
|
4609
4875
|
const file = await hfDownloadProject2(projects[0].path, hfToken);
|
|
@@ -4618,15 +4884,15 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4618
4884
|
className: "w-full flex items-center justify-center gap-3 rounded-2xl font-bold text-[14px] uppercase tracking-wide text-white active:scale-95 transition-transform disabled:opacity-50",
|
|
4619
4885
|
style: { height: 56, background: "#f59e0b" },
|
|
4620
4886
|
children: [
|
|
4621
|
-
/* @__PURE__ */
|
|
4887
|
+
/* @__PURE__ */ jsx22("span", { className: `material-symbols-outlined text-[22px]${isLoadingFromHF ? " animate-spin" : ""}`, children: isLoadingFromHF ? "sync" : "cloud_download" }),
|
|
4622
4888
|
isLoadingFromHF ? "Laden\u2026" : "Von HF laden"
|
|
4623
4889
|
]
|
|
4624
4890
|
}
|
|
4625
4891
|
),
|
|
4626
|
-
hfToken && /* @__PURE__ */
|
|
4892
|
+
hfToken && /* @__PURE__ */ jsx22("span", { className: "text-white/20 text-[10px] text-center", children: "Letzten Stand von Hugging Face laden" })
|
|
4627
4893
|
] }),
|
|
4628
|
-
onFetchServerProjects && /* @__PURE__ */
|
|
4629
|
-
/* @__PURE__ */
|
|
4894
|
+
onFetchServerProjects && /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
|
|
4895
|
+
/* @__PURE__ */ jsxs20(
|
|
4630
4896
|
"button",
|
|
4631
4897
|
{
|
|
4632
4898
|
disabled: isLoadingFromServer,
|
|
@@ -4647,35 +4913,35 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4647
4913
|
className: "w-full flex items-center justify-center gap-3 rounded-2xl font-bold text-[14px] uppercase tracking-wide text-white active:scale-95 transition-transform disabled:opacity-50",
|
|
4648
4914
|
style: { height: 56, background: "#7c3aed" },
|
|
4649
4915
|
children: [
|
|
4650
|
-
/* @__PURE__ */
|
|
4916
|
+
/* @__PURE__ */ jsx22("span", { className: `material-symbols-outlined text-[22px]${isLoadingFromServer ? " animate-spin" : ""}`, children: isLoadingFromServer ? "sync" : "cloud_download" }),
|
|
4651
4917
|
isLoadingFromServer ? "Laden\u2026" : "Vom Server laden"
|
|
4652
4918
|
]
|
|
4653
4919
|
}
|
|
4654
4920
|
),
|
|
4655
|
-
/* @__PURE__ */
|
|
4921
|
+
/* @__PURE__ */ jsx22("span", { className: "text-white/20 text-[10px] text-center", children: "Letzten Stand vom Server wiederherstellen" })
|
|
4656
4922
|
] }),
|
|
4657
|
-
/* @__PURE__ */
|
|
4658
|
-
/* @__PURE__ */
|
|
4659
|
-
/* @__PURE__ */
|
|
4923
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
|
|
4924
|
+
/* @__PURE__ */ jsx22("span", { className: "text-white/25 text-[10px] uppercase tracking-widest font-bold", children: "Layout w\xE4hlen & starten" }),
|
|
4925
|
+
/* @__PURE__ */ jsx22("div", { className: "grid grid-cols-2 gap-2 w-full", children: [
|
|
4660
4926
|
{ id: "mobile", icon: "smartphone", label: "Mobile" },
|
|
4661
4927
|
{ id: "mobile-desktop", icon: "phonelink", label: "Mobile+" },
|
|
4662
4928
|
{ id: "desktop", icon: "desktop_windows", label: "Desktop" },
|
|
4663
4929
|
{ id: "tablet-landscape", icon: "tablet", label: "Landscape" }
|
|
4664
|
-
].map((opt) => /* @__PURE__ */
|
|
4930
|
+
].map((opt) => /* @__PURE__ */ jsxs20(
|
|
4665
4931
|
"button",
|
|
4666
4932
|
{
|
|
4667
4933
|
onClick: () => startApp(opt.id),
|
|
4668
4934
|
className: "flex flex-col items-center gap-2 py-4 rounded-2xl border transition-colors",
|
|
4669
4935
|
style: { borderColor: layoutChoice === opt.id ? "rgba(255,255,255,0.35)" : "rgba(255,255,255,0.08)", background: layoutChoice === opt.id ? "rgba(255,255,255,0.07)" : "transparent" },
|
|
4670
4936
|
children: [
|
|
4671
|
-
/* @__PURE__ */
|
|
4672
|
-
/* @__PURE__ */
|
|
4937
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[24px]", style: { color: layoutChoice === opt.id ? "#fff" : "rgba(255,255,255,0.4)" }, children: opt.icon }),
|
|
4938
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[11px] font-bold", style: { color: layoutChoice === opt.id ? "#fff" : "rgba(255,255,255,0.4)" }, children: opt.label })
|
|
4673
4939
|
]
|
|
4674
4940
|
},
|
|
4675
4941
|
opt.id
|
|
4676
4942
|
)) }),
|
|
4677
|
-
layoutChoice === "mobile-desktop" && /* @__PURE__ */
|
|
4678
|
-
layoutChoice === "tablet-landscape" && /* @__PURE__ */
|
|
4943
|
+
layoutChoice === "mobile-desktop" && /* @__PURE__ */ jsx22("span", { className: "text-white/20 text-[9px] text-center", children: "Mobil-Layout skaliert f\xFCr Desktop-Modus" }),
|
|
4944
|
+
layoutChoice === "tablet-landscape" && /* @__PURE__ */ jsx22("span", { className: "text-white/20 text-[9px] text-center", children: "2-Spalten-Layout f\xFCr Landscape-Tablet im Desktop-Mode" })
|
|
4679
4945
|
] })
|
|
4680
4946
|
] });
|
|
4681
4947
|
}
|
|
@@ -4684,21 +4950,21 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4684
4950
|
const mdScale = mdMode ? window.innerWidth / 430 : 1;
|
|
4685
4951
|
const mdW = mdMode ? 430 : void 0;
|
|
4686
4952
|
const mdH = mdMode ? Math.ceil(window.innerHeight / mdScale) : void 0;
|
|
4687
|
-
const mobileRoot = /* @__PURE__ */
|
|
4953
|
+
const mobileRoot = /* @__PURE__ */ jsxs20("div", { className: "flex flex-col bg-[#0e0e0e] text-white overflow-hidden", style: {
|
|
4688
4954
|
width: mdMode ? mdW : "100vw",
|
|
4689
4955
|
height: mdMode ? mdH : "100dvh",
|
|
4690
4956
|
transform: mdMode ? `scale(${mdScale})` : void 0,
|
|
4691
4957
|
transformOrigin: mdMode ? "top left" : void 0,
|
|
4692
4958
|
...hcStyle || {}
|
|
4693
4959
|
}, children: [
|
|
4694
|
-
mobileTab === "labs" && /* @__PURE__ */
|
|
4960
|
+
mobileTab === "labs" && /* @__PURE__ */ jsx22("div", { className: "flex flex-col flex-1 min-h-0", children: /* @__PURE__ */ jsx22(LabsTab, { services: labServices, onResult: (item) => {
|
|
4695
4961
|
const frame = item.frames[0];
|
|
4696
4962
|
if (frame?.base64) {
|
|
4697
4963
|
setCurrentResult(frameToGeneration(frame, item));
|
|
4698
4964
|
setMobileTab("stage");
|
|
4699
4965
|
}
|
|
4700
4966
|
} }) }),
|
|
4701
|
-
mobileTab === "tags" && workspaceTags && /* @__PURE__ */
|
|
4967
|
+
mobileTab === "tags" && workspaceTags && /* @__PURE__ */ jsx22("div", { className: "flex flex-col flex-1 min-h-0", children: /* @__PURE__ */ jsx22(
|
|
4702
4968
|
TagManagerPanel,
|
|
4703
4969
|
{
|
|
4704
4970
|
workspaceTags,
|
|
@@ -4709,21 +4975,21 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4709
4975
|
onTagMove: handleTagMove
|
|
4710
4976
|
}
|
|
4711
4977
|
) }),
|
|
4712
|
-
mobileTab === "stage" && /* @__PURE__ */
|
|
4713
|
-
/* @__PURE__ */
|
|
4714
|
-
/* @__PURE__ */
|
|
4715
|
-
/* @__PURE__ */
|
|
4716
|
-
/* @__PURE__ */
|
|
4717
|
-
activeReferenceThumbnail ? /* @__PURE__ */
|
|
4718
|
-
/* @__PURE__ */
|
|
4719
|
-
/* @__PURE__ */
|
|
4720
|
-
/* @__PURE__ */
|
|
4721
|
-
] }) : /* @__PURE__ */
|
|
4722
|
-
/* @__PURE__ */
|
|
4723
|
-
/* @__PURE__ */
|
|
4978
|
+
mobileTab === "stage" && /* @__PURE__ */ jsxs20("div", { className: "flex flex-col flex-1 min-h-0", children: [
|
|
4979
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2 px-3 border-b border-white/5 bg-black/30 shrink-0", style: { height: 52 }, children: [
|
|
4980
|
+
/* @__PURE__ */ jsx22(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
|
|
4981
|
+
/* @__PURE__ */ jsx22(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" }] }),
|
|
4982
|
+
/* @__PURE__ */ jsx22("div", { className: "flex-1" }),
|
|
4983
|
+
activeReferenceThumbnail ? /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden mr-2", style: { height: 28 }, children: [
|
|
4984
|
+
/* @__PURE__ */ jsx22("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
|
|
4985
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
|
|
4986
|
+
/* @__PURE__ */ jsx22("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 active:text-white/80 transition-colors", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
|
|
4987
|
+
] }) : /* @__PURE__ */ jsx22("button", { onClick: handleSelectReference, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "add_photo_alternate" }) }),
|
|
4988
|
+
/* @__PURE__ */ jsx22("button", { onClick: toggleContrast, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: highContrast ? "light_mode" : "dark_mode" }) }),
|
|
4989
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => setShowStart(true), className: "text-white/20 active:text-white/60 transition-colors mr-1", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "desktop_windows" }) })
|
|
4724
4990
|
] }),
|
|
4725
|
-
/* @__PURE__ */
|
|
4726
|
-
/* @__PURE__ */
|
|
4991
|
+
/* @__PURE__ */ jsx22("div", { className: "px-3 pt-3 pb-2 shrink-0", children: /* @__PURE__ */ jsxs20("div", { className: `relative rounded-xl border transition-all ${isSynthesizing ? "prompt-loading" : "bg-white/5 border-white/10"}`, children: [
|
|
4992
|
+
/* @__PURE__ */ jsx22(
|
|
4727
4993
|
"textarea",
|
|
4728
4994
|
{
|
|
4729
4995
|
value: activePrompt,
|
|
@@ -4733,26 +4999,26 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4733
4999
|
placeholder: "Prompt eingeben..."
|
|
4734
5000
|
}
|
|
4735
5001
|
),
|
|
4736
|
-
activePrompt && !isSynthesizing && /* @__PURE__ */
|
|
5002
|
+
activePrompt && !isSynthesizing && /* @__PURE__ */ jsx22("button", { onClick: () => setActivePrompt(""), className: "absolute top-2 right-2 w-8 h-8 flex items-center justify-center text-white/20 active:text-white transition-colors", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[18px]", children: "close" }) })
|
|
4737
5003
|
] }) }),
|
|
4738
|
-
/* @__PURE__ */
|
|
5004
|
+
/* @__PURE__ */ jsx22("div", { className: "px-3 pb-3 shrink-0", children: /* @__PURE__ */ jsx22(
|
|
4739
5005
|
"button",
|
|
4740
5006
|
{
|
|
4741
5007
|
onClick: () => handleGenerateImage(),
|
|
4742
5008
|
disabled: !activePrompt.trim() || isGenerating,
|
|
4743
5009
|
className: "w-full flex items-center justify-center gap-2 rounded-xl font-bold text-[14px] uppercase tracking-wide transition-all disabled:opacity-30 active:scale-95",
|
|
4744
5010
|
style: { height: 48, background: activePrompt.trim() && !isGenerating ? "#0284c7" : void 0, border: "1px solid rgba(255,255,255,0.1)" },
|
|
4745
|
-
children: isGenerating ? /* @__PURE__ */
|
|
4746
|
-
/* @__PURE__ */
|
|
4747
|
-
/* @__PURE__ */
|
|
4748
|
-
] }) : /* @__PURE__ */
|
|
4749
|
-
/* @__PURE__ */
|
|
4750
|
-
/* @__PURE__ */
|
|
5011
|
+
children: isGenerating ? /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
5012
|
+
/* @__PURE__ */ jsx22("div", { className: "w-4 h-4 border-t-2 border-white rounded-full animate-spin" }),
|
|
5013
|
+
/* @__PURE__ */ jsx22("span", { children: "Generiere..." })
|
|
5014
|
+
] }) : /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
5015
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "bolt" }),
|
|
5016
|
+
/* @__PURE__ */ jsx22("span", { children: "Generieren" })
|
|
4751
5017
|
] })
|
|
4752
5018
|
}
|
|
4753
5019
|
) }),
|
|
4754
|
-
/* @__PURE__ */
|
|
4755
|
-
/* @__PURE__ */
|
|
5020
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1 min-h-0 px-3 pb-3 flex flex-col", children: [
|
|
5021
|
+
/* @__PURE__ */ jsxs20(
|
|
4756
5022
|
"div",
|
|
4757
5023
|
{
|
|
4758
5024
|
className: "w-full rounded-2xl border border-white/5 bg-black/40 relative overflow-hidden flex items-center justify-center",
|
|
@@ -4766,25 +5032,25 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4766
5032
|
setTouchStartX(null);
|
|
4767
5033
|
},
|
|
4768
5034
|
children: [
|
|
4769
|
-
currentResult?.status === "processing" && /* @__PURE__ */
|
|
4770
|
-
/* @__PURE__ */
|
|
4771
|
-
/* @__PURE__ */
|
|
5035
|
+
currentResult?.status === "processing" && /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-3", children: [
|
|
5036
|
+
/* @__PURE__ */ jsx22("div", { className: "w-10 h-10 border-t-2 border-white rounded-full animate-spin" }),
|
|
5037
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[11px] text-white/40 uppercase font-bold tracking-widest", children: "Erstelle Bild..." })
|
|
4772
5038
|
] }),
|
|
4773
|
-
currentResult?.status === "error" && /* @__PURE__ */
|
|
4774
|
-
/* @__PURE__ */
|
|
4775
|
-
/* @__PURE__ */
|
|
4776
|
-
/* @__PURE__ */
|
|
5039
|
+
currentResult?.status === "error" && /* @__PURE__ */ jsxs20("div", { className: "p-6 text-center flex flex-col items-center gap-3", children: [
|
|
5040
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-red-400 text-[36px]", children: "warning" }),
|
|
5041
|
+
/* @__PURE__ */ jsx22("p", { className: "text-white/50 text-[13px]", children: currentResult.error?.message }),
|
|
5042
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => handleGenerateImage(currentResult.prompt), className: "px-4 py-2 rounded-lg border border-white/20 text-[13px] text-white/70 active:bg-white/10", children: "Erneut versuchen" })
|
|
4777
5043
|
] }),
|
|
4778
|
-
currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */
|
|
4779
|
-
!currentResult && /* @__PURE__ */
|
|
4780
|
-
/* @__PURE__ */
|
|
4781
|
-
/* @__PURE__ */
|
|
5044
|
+
currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */ jsx22("img", { src: currentResult.base64, className: "w-full h-full object-contain" }),
|
|
5045
|
+
!currentResult && /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-2 opacity-10", children: [
|
|
5046
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[64px]", children: "palette" }),
|
|
5047
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[11px] font-bold uppercase tracking-[0.2em]", children: "Avatar Architect" })
|
|
4782
5048
|
] }),
|
|
4783
|
-
currentResult?.status === "done" && /* @__PURE__ */
|
|
4784
|
-
history.length > 1 && currentResult && /* @__PURE__ */
|
|
4785
|
-
/* @__PURE__ */
|
|
4786
|
-
/* @__PURE__ */
|
|
4787
|
-
/* @__PURE__ */
|
|
5049
|
+
currentResult?.status === "done" && /* @__PURE__ */ jsx22("button", { onClick: openFullscreen, className: "absolute top-2 right-2 w-8 h-8 flex items-center justify-center rounded-full bg-black/60 border border-white/10 z-10", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[18px]", children: "fullscreen" }) }),
|
|
5050
|
+
history.length > 1 && currentResult && /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
5051
|
+
/* @__PURE__ */ jsx22("button", { onClick: goToPrev, disabled: currentIndex <= 0, className: "absolute left-2 top-1/2 -translate-y-1/2 w-10 h-10 flex items-center justify-center rounded-full bg-black/60 border border-white/10 disabled:opacity-0 transition-opacity", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_left" }) }),
|
|
5052
|
+
/* @__PURE__ */ jsx22("button", { onClick: goToNext, disabled: currentIndex >= history.length - 1, className: "absolute right-2 top-1/2 -translate-y-1/2 w-10 h-10 flex items-center justify-center rounded-full bg-black/60 border border-white/10 disabled:opacity-0 transition-opacity", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_right" }) }),
|
|
5053
|
+
/* @__PURE__ */ jsxs20("div", { className: "absolute bottom-2 left-1/2 -translate-x-1/2 bg-black/60 rounded-full px-3 py-0.5 text-[10px] text-white/40 font-mono", children: [
|
|
4788
5054
|
currentIndex + 1,
|
|
4789
5055
|
" / ",
|
|
4790
5056
|
history.length
|
|
@@ -4793,33 +5059,33 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4793
5059
|
]
|
|
4794
5060
|
}
|
|
4795
5061
|
),
|
|
4796
|
-
currentResult?.status === "done" && /* @__PURE__ */
|
|
4797
|
-
/* @__PURE__ */
|
|
4798
|
-
/* @__PURE__ */
|
|
4799
|
-
/* @__PURE__ */
|
|
5062
|
+
currentResult?.status === "done" && /* @__PURE__ */ jsxs20("div", { className: "flex gap-2 mt-3", children: [
|
|
5063
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => setActivePrompt(currentResult.prompt || ""), className: "flex-1 flex items-center justify-center gap-1.5 rounded-xl border border-white/10 bg-white/5 active:bg-white/10 transition-colors", style: { height: 44 }, children: [
|
|
5064
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[18px] text-white/60", children: "replay" }),
|
|
5065
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[12px] text-white/60", children: "Prompt" })
|
|
4800
5066
|
] }),
|
|
4801
|
-
/* @__PURE__ */
|
|
4802
|
-
/* @__PURE__ */
|
|
4803
|
-
/* @__PURE__ */
|
|
5067
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => handleGenerateImage(currentResult.prompt || activePrompt, currentResult.mediaId, void 0, { silent: true }), className: "flex-1 flex items-center justify-center gap-1.5 rounded-xl bg-white/10 active:bg-white/15 transition-colors", style: { height: 44 }, children: [
|
|
5068
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[18px] text-white/80", children: "auto_fix_high" }),
|
|
5069
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[12px] text-white/80 font-bold", children: "Referenz" })
|
|
4804
5070
|
] }),
|
|
4805
|
-
/* @__PURE__ */
|
|
4806
|
-
/* @__PURE__ */
|
|
4807
|
-
/* @__PURE__ */
|
|
5071
|
+
/* @__PURE__ */ jsxs20("button", { onClick: handleDownloadSingle, className: "flex-1 flex items-center justify-center gap-1.5 rounded-xl border border-white/10 bg-white/5 active:bg-white/10 transition-colors", style: { height: 44 }, children: [
|
|
5072
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[18px] text-white/60", children: "download" }),
|
|
5073
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[12px] text-white/60", children: "Laden" })
|
|
4808
5074
|
] })
|
|
4809
5075
|
] })
|
|
4810
5076
|
] })
|
|
4811
5077
|
] }),
|
|
4812
|
-
mobileTab === "browse" && /* @__PURE__ */
|
|
4813
|
-
/* @__PURE__ */
|
|
4814
|
-
["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */
|
|
4815
|
-
hfToken && /* @__PURE__ */
|
|
5078
|
+
mobileTab === "browse" && /* @__PURE__ */ jsxs20("div", { className: "flex flex-col flex-1 min-h-0", children: [
|
|
5079
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
|
|
5080
|
+
["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */ jsx22("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__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : "info" }) }, tab)),
|
|
5081
|
+
hfToken && /* @__PURE__ */ jsx22("button", { onClick: () => refreshHF(), disabled: isHfRefreshing, className: "w-12 flex items-center justify-center text-white/20 active:text-white transition-colors disabled:opacity-30", children: /* @__PURE__ */ jsx22("span", { className: `material-symbols-outlined text-[20px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) })
|
|
4816
5082
|
] }),
|
|
4817
|
-
/* @__PURE__ */
|
|
4818
|
-
activeTab === "history" && /* @__PURE__ */
|
|
5083
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1 overflow-hidden relative", children: [
|
|
5084
|
+
activeTab === "history" && /* @__PURE__ */ jsx22(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: (g) => {
|
|
4819
5085
|
setCurrentResult(g);
|
|
4820
5086
|
setMobileTab("stage");
|
|
4821
5087
|
}, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }),
|
|
4822
|
-
activeTab === "gallery" && /* @__PURE__ */
|
|
5088
|
+
activeTab === "gallery" && /* @__PURE__ */ jsx22(
|
|
4823
5089
|
MediaLibrary,
|
|
4824
5090
|
{
|
|
4825
5091
|
items: galleryItems,
|
|
@@ -4839,43 +5105,43 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4839
5105
|
}
|
|
4840
5106
|
}
|
|
4841
5107
|
),
|
|
4842
|
-
activeTab === "inspect" && /* @__PURE__ */
|
|
5108
|
+
activeTab === "inspect" && /* @__PURE__ */ jsx22(InspectPanel, { currentResult, history, onSelect: (g) => {
|
|
4843
5109
|
setCurrentResult(g);
|
|
4844
5110
|
} })
|
|
4845
5111
|
] })
|
|
4846
5112
|
] }),
|
|
4847
|
-
/* @__PURE__ */
|
|
4848
|
-
/* @__PURE__ */
|
|
4849
|
-
workspaceTags && /* @__PURE__ */
|
|
5113
|
+
/* @__PURE__ */ jsxs20("div", { style: { display: mobileTab === "tools" ? "flex" : "none" }, className: "flex flex-col flex-1 min-h-0", children: [
|
|
5114
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
|
|
5115
|
+
workspaceTags && /* @__PURE__ */ jsxs20("button", { onClick: () => {
|
|
4850
5116
|
setLeftTab("prompt");
|
|
4851
5117
|
if (activeTab === "setup" || activeTab === "sync") setActiveTab("history");
|
|
4852
5118
|
}, className: `flex-1 flex items-center justify-center gap-1.5 text-[11px] font-bold uppercase tracking-wide transition-colors ${leftTab === "prompt" && activeTab !== "setup" && activeTab !== "sync" ? "text-white border-b-2 border-white" : "text-white/30"}`, children: [
|
|
4853
|
-
/* @__PURE__ */
|
|
5119
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "auto_fix_high" }),
|
|
4854
5120
|
"Prompt"
|
|
4855
5121
|
] }),
|
|
4856
|
-
/* @__PURE__ */
|
|
5122
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => {
|
|
4857
5123
|
setLeftTab("hierarchy");
|
|
4858
5124
|
if (activeTab === "setup" || activeTab === "sync") setActiveTab("history");
|
|
4859
5125
|
}, className: `flex-1 flex items-center justify-center gap-1.5 text-[11px] font-bold uppercase tracking-wide transition-colors ${leftTab === "hierarchy" && activeTab !== "setup" && activeTab !== "sync" ? "text-white border-b-2 border-white" : "text-white/30"}`, children: [
|
|
4860
|
-
/* @__PURE__ */
|
|
5126
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "account_tree" }),
|
|
4861
5127
|
"Hierarchie"
|
|
4862
5128
|
] }),
|
|
4863
|
-
/* @__PURE__ */
|
|
4864
|
-
/* @__PURE__ */
|
|
5129
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => setActiveTab("setup"), className: `flex-1 flex items-center justify-center gap-1.5 text-[11px] font-bold uppercase tracking-wide transition-colors ${activeTab === "setup" ? "text-white border-b-2 border-white" : "text-white/30"}`, children: [
|
|
5130
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "settings" }),
|
|
4865
5131
|
"Setup"
|
|
4866
5132
|
] }),
|
|
4867
|
-
/* @__PURE__ */
|
|
4868
|
-
/* @__PURE__ */
|
|
5133
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => setActiveTab("sync"), className: `flex-1 flex items-center justify-center gap-1.5 text-[11px] font-bold uppercase tracking-wide transition-colors ${activeTab === "sync" ? "text-white border-b-2 border-white" : "text-white/30"}`, children: [
|
|
5134
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "cloud_sync" }),
|
|
4869
5135
|
"Sync"
|
|
4870
5136
|
] }),
|
|
4871
|
-
/* @__PURE__ */
|
|
4872
|
-
/* @__PURE__ */
|
|
5137
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => setActiveTab("hftest"), className: `flex-1 flex items-center justify-center gap-1.5 text-[11px] font-bold uppercase tracking-wide transition-colors ${activeTab === "hftest" ? "text-white border-b-2 border-white" : "text-white/30"}`, children: [
|
|
5138
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "biotech" }),
|
|
4873
5139
|
"HF"
|
|
4874
5140
|
] }),
|
|
4875
|
-
workspaceTags && /* @__PURE__ */
|
|
5141
|
+
workspaceTags && /* @__PURE__ */ jsx22("button", { onClick: () => setActiveTab("tags"), className: `flex-1 flex items-center justify-center gap-1.5 text-[11px] font-bold uppercase tracking-wide transition-colors ${activeTab === "tags" ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "label" }) })
|
|
4876
5142
|
] }),
|
|
4877
|
-
/* @__PURE__ */
|
|
4878
|
-
leftTab === "hierarchy" && activeTab !== "setup" && activeTab !== "sync" && activeTab !== "hftest" && /* @__PURE__ */
|
|
5143
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1 overflow-hidden relative", children: [
|
|
5144
|
+
leftTab === "hierarchy" && activeTab !== "setup" && activeTab !== "sync" && activeTab !== "hftest" && /* @__PURE__ */ jsx22("div", { className: "absolute inset-0", children: /* @__PURE__ */ jsx22(
|
|
4879
5145
|
ListView,
|
|
4880
5146
|
{
|
|
4881
5147
|
nodes,
|
|
@@ -4906,12 +5172,12 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4906
5172
|
isGeneratingNodeId: (id) => isSynthesizing && focusedNodeId === id
|
|
4907
5173
|
}
|
|
4908
5174
|
) }),
|
|
4909
|
-
workspaceTags && /* @__PURE__ */
|
|
5175
|
+
workspaceTags && /* @__PURE__ */ jsx22("div", { style: { display: leftTab === "prompt" && activeTab !== "setup" && activeTab !== "sync" && activeTab !== "hftest" ? "flex" : "none" }, className: "absolute inset-0 flex-col", children: /* @__PURE__ */ jsx22(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => {
|
|
4910
5176
|
handleGenerateImage(prompt);
|
|
4911
5177
|
setMobileTab("stage");
|
|
4912
5178
|
}, onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage }) }),
|
|
4913
|
-
activeTab === "setup" && /* @__PURE__ */
|
|
4914
|
-
activeTab === "sync" && /* @__PURE__ */
|
|
5179
|
+
activeTab === "setup" && /* @__PURE__ */ jsx22(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
|
|
5180
|
+
activeTab === "sync" && /* @__PURE__ */ jsx22(
|
|
4915
5181
|
ProjectSyncTab,
|
|
4916
5182
|
{
|
|
4917
5183
|
topSlot: syncTopSlot,
|
|
@@ -4935,7 +5201,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4935
5201
|
onHfInitialSync: hfToken ? handleHfInitialSync : void 0
|
|
4936
5202
|
}
|
|
4937
5203
|
),
|
|
4938
|
-
activeTab === "tags" && workspaceTags && /* @__PURE__ */
|
|
5204
|
+
activeTab === "tags" && workspaceTags && /* @__PURE__ */ jsx22(
|
|
4939
5205
|
TagManagerPanel,
|
|
4940
5206
|
{
|
|
4941
5207
|
workspaceTags,
|
|
@@ -4946,7 +5212,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4946
5212
|
onTagMove: handleTagMove
|
|
4947
5213
|
}
|
|
4948
5214
|
),
|
|
4949
|
-
activeTab === "hftest" && /* @__PURE__ */
|
|
5215
|
+
activeTab === "hftest" && /* @__PURE__ */ jsx22("div", { className: "absolute inset-0", children: /* @__PURE__ */ jsx22(
|
|
4950
5216
|
HFTestTab,
|
|
4951
5217
|
{
|
|
4952
5218
|
token: hfToken,
|
|
@@ -4959,19 +5225,19 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4959
5225
|
) })
|
|
4960
5226
|
] })
|
|
4961
5227
|
] }),
|
|
4962
|
-
/* @__PURE__ */
|
|
5228
|
+
/* @__PURE__ */ jsx22("div", { className: "flex border-t border-white/10 bg-black shrink-0", style: { height: 56, paddingBottom: "env(safe-area-inset-bottom, 0px)" }, children: [
|
|
4963
5229
|
{ id: "tools", icon: "auto_fix_high", label: "Prompt" },
|
|
4964
5230
|
{ id: "stage", icon: "palette", label: "Stage" },
|
|
4965
5231
|
{ id: "labs", icon: "science", label: "Labs" },
|
|
4966
5232
|
...workspaceTags ? [{ id: "tags", icon: "label", label: "Tags" }] : [],
|
|
4967
5233
|
{ id: "browse", icon: "photo_library", label: "Galerie" }
|
|
4968
|
-
].map((tab) => /* @__PURE__ */
|
|
4969
|
-
/* @__PURE__ */
|
|
4970
|
-
/* @__PURE__ */
|
|
5234
|
+
].map((tab) => /* @__PURE__ */ jsxs20("button", { onClick: () => setMobileTab(tab.id), className: `flex-1 flex flex-col items-center justify-center gap-0.5 transition-colors ${mobileTab === tab.id ? "text-white" : "text-white/30"}`, children: [
|
|
5235
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[24px]", children: tab.icon }),
|
|
5236
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[10px] font-bold uppercase tracking-wide", children: tab.label })
|
|
4971
5237
|
] }, tab.id)) })
|
|
4972
5238
|
] });
|
|
4973
5239
|
if (mdMode) {
|
|
4974
|
-
return /* @__PURE__ */
|
|
5240
|
+
return /* @__PURE__ */ jsx22("div", { style: { position: "fixed", inset: 0, overflow: "hidden", background: "#0e0e0e" }, children: mobileRoot });
|
|
4975
5241
|
}
|
|
4976
5242
|
return mobileRoot;
|
|
4977
5243
|
}
|
|
@@ -4979,17 +5245,17 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4979
5245
|
const tlScale = Math.min(window.innerWidth / 920, window.innerHeight / 520);
|
|
4980
5246
|
const tlW = 920;
|
|
4981
5247
|
const tlH = 520;
|
|
4982
|
-
return /* @__PURE__ */
|
|
4983
|
-
/* @__PURE__ */
|
|
4984
|
-
/* @__PURE__ */
|
|
4985
|
-
/* @__PURE__ */
|
|
4986
|
-
/* @__PURE__ */
|
|
4987
|
-
/* @__PURE__ */
|
|
4988
|
-
/* @__PURE__ */
|
|
4989
|
-
/* @__PURE__ */
|
|
5248
|
+
return /* @__PURE__ */ jsx22("div", { style: { position: "fixed", inset: 0, background: "#0e0e0e", display: "flex", alignItems: "center", justifyContent: "center", overflow: "hidden", ...hcStyle || {} }, children: /* @__PURE__ */ jsxs20("div", { style: { width: tlW, height: tlH, transform: `scale(${tlScale})`, transformOrigin: "center center", display: "flex", flexDirection: "row", color: "#fff", overflow: "hidden", borderRadius: 0 }, children: [
|
|
5249
|
+
/* @__PURE__ */ jsxs20("div", { style: { width: 320, height: tlH, display: "flex", flexDirection: "column", borderRight: "1px solid rgba(255,255,255,0.05)", background: "#000", flexShrink: 0 }, children: [
|
|
5250
|
+
/* @__PURE__ */ jsxs20("div", { style: { height: 52, borderBottom: "1px solid rgba(255,255,255,0.05)", display: "flex", alignItems: "center", gap: 8, padding: "0 12px", flexShrink: 0 }, children: [
|
|
5251
|
+
/* @__PURE__ */ jsx22(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
|
|
5252
|
+
/* @__PURE__ */ jsx22(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" }] }),
|
|
5253
|
+
/* @__PURE__ */ jsx22("div", { style: { flex: 1 } }),
|
|
5254
|
+
/* @__PURE__ */ jsx22("button", { onClick: toggleContrast, style: { color: "rgba(255,255,255,0.2)", background: "none", border: "none", cursor: "pointer", padding: 4, lineHeight: 0 }, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: highContrast ? "light_mode" : "dark_mode" }) }),
|
|
5255
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => setShowStart(true), style: { color: "rgba(255,255,255,0.2)", background: "none", border: "none", cursor: "pointer", padding: 4, lineHeight: 0 }, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "apps" }) })
|
|
4990
5256
|
] }),
|
|
4991
|
-
/* @__PURE__ */
|
|
4992
|
-
/* @__PURE__ */
|
|
5257
|
+
/* @__PURE__ */ jsx22("div", { style: { padding: "12px 12px 8px", flexShrink: 0 }, children: /* @__PURE__ */ jsxs20("div", { style: { position: "relative", borderRadius: 12, border: `1px solid ${isSynthesizing ? "rgba(255,255,255,0.2)" : "rgba(255,255,255,0.1)"}`, background: "rgba(255,255,255,0.05)" }, children: [
|
|
5258
|
+
/* @__PURE__ */ jsx22(
|
|
4993
5259
|
"textarea",
|
|
4994
5260
|
{
|
|
4995
5261
|
value: activePrompt,
|
|
@@ -4998,27 +5264,27 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
4998
5264
|
placeholder: "Prompt eingeben..."
|
|
4999
5265
|
}
|
|
5000
5266
|
),
|
|
5001
|
-
activePrompt && /* @__PURE__ */
|
|
5267
|
+
activePrompt && /* @__PURE__ */ jsx22("button", { onClick: () => setActivePrompt(""), style: { position: "absolute", top: 6, right: 6, width: 22, height: 22, display: "flex", alignItems: "center", justifyContent: "center", color: "rgba(255,255,255,0.2)", background: "none", border: "none", cursor: "pointer", padding: 0 }, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 15 }, children: "close" }) })
|
|
5002
5268
|
] }) }),
|
|
5003
|
-
/* @__PURE__ */
|
|
5269
|
+
/* @__PURE__ */ jsx22("div", { style: { padding: "0 12px 10px", flexShrink: 0 }, children: /* @__PURE__ */ jsx22(
|
|
5004
5270
|
"button",
|
|
5005
5271
|
{
|
|
5006
5272
|
onClick: () => handleGenerateImage(),
|
|
5007
5273
|
disabled: !activePrompt.trim() || isGenerating,
|
|
5008
5274
|
style: { width: "100%", height: 42, display: "flex", alignItems: "center", justifyContent: "center", gap: 8, borderRadius: 10, fontWeight: "bold", fontSize: 13, textTransform: "uppercase", letterSpacing: "0.05em", border: "1px solid rgba(255,255,255,0.1)", background: activePrompt.trim() && !isGenerating ? "#0284c7" : "transparent", color: "#fff", cursor: activePrompt.trim() && !isGenerating ? "pointer" : "default", opacity: !activePrompt.trim() || isGenerating ? 0.3 : 1, fontFamily: "inherit", transition: "background 0.2s" },
|
|
5009
|
-
children: isGenerating ? /* @__PURE__ */
|
|
5010
|
-
/* @__PURE__ */
|
|
5011
|
-
/* @__PURE__ */
|
|
5012
|
-
] }) : /* @__PURE__ */
|
|
5013
|
-
/* @__PURE__ */
|
|
5014
|
-
/* @__PURE__ */
|
|
5275
|
+
children: isGenerating ? /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
5276
|
+
/* @__PURE__ */ jsx22("div", { style: { width: 14, height: 14, borderTop: "2px solid #fff", borderRadius: "50%", animation: "spin 1s linear infinite" } }),
|
|
5277
|
+
/* @__PURE__ */ jsx22("span", { children: "Generiere..." })
|
|
5278
|
+
] }) : /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
5279
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "bolt" }),
|
|
5280
|
+
/* @__PURE__ */ jsx22("span", { children: "Generieren" })
|
|
5015
5281
|
] })
|
|
5016
5282
|
}
|
|
5017
5283
|
) }),
|
|
5018
|
-
/* @__PURE__ */
|
|
5284
|
+
/* @__PURE__ */ jsx22("div", { style: { flex: 1, overflow: "hidden", position: "relative" }, children: /* @__PURE__ */ jsx22(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: setCurrentResult, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }) })
|
|
5019
5285
|
] }),
|
|
5020
|
-
/* @__PURE__ */
|
|
5021
|
-
/* @__PURE__ */
|
|
5286
|
+
/* @__PURE__ */ jsxs20("div", { style: { flex: 1, height: tlH, display: "flex", flexDirection: "column", background: "#0b0b0b" }, children: [
|
|
5287
|
+
/* @__PURE__ */ jsx22(
|
|
5022
5288
|
"div",
|
|
5023
5289
|
{
|
|
5024
5290
|
style: { flex: 1, padding: 16, display: "flex", alignItems: "center", justifyContent: "center", position: "relative" },
|
|
@@ -5030,26 +5296,26 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5030
5296
|
else if (dx > 50) goToPrev();
|
|
5031
5297
|
setTouchStartX(null);
|
|
5032
5298
|
},
|
|
5033
|
-
children: /* @__PURE__ */
|
|
5034
|
-
currentResult?.status === "processing" && /* @__PURE__ */
|
|
5035
|
-
/* @__PURE__ */
|
|
5036
|
-
/* @__PURE__ */
|
|
5299
|
+
children: /* @__PURE__ */ jsxs20("div", { style: { height: "100%", width: "100%", borderRadius: 20, border: "1px solid rgba(255,255,255,0.05)", background: "rgba(0,0,0,0.4)", position: "relative", overflow: "hidden", display: "flex", alignItems: "center", justifyContent: "center" }, children: [
|
|
5300
|
+
currentResult?.status === "processing" && /* @__PURE__ */ jsxs20("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 12 }, children: [
|
|
5301
|
+
/* @__PURE__ */ jsx22("div", { style: { width: 36, height: 36, borderTop: "2px solid #fff", borderRadius: "50%", animation: "spin 1s linear infinite" } }),
|
|
5302
|
+
/* @__PURE__ */ jsx22("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.4)", textTransform: "uppercase", fontWeight: "bold", letterSpacing: "0.15em" }, children: "Erstelle Bild..." })
|
|
5037
5303
|
] }),
|
|
5038
|
-
currentResult?.status === "error" && /* @__PURE__ */
|
|
5039
|
-
/* @__PURE__ */
|
|
5040
|
-
/* @__PURE__ */
|
|
5041
|
-
/* @__PURE__ */
|
|
5304
|
+
currentResult?.status === "error" && /* @__PURE__ */ jsxs20("div", { style: { padding: 24, textAlign: "center", display: "flex", flexDirection: "column", alignItems: "center", gap: 12 }, children: [
|
|
5305
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 32, color: "#f87171" }, children: "warning" }),
|
|
5306
|
+
/* @__PURE__ */ jsx22("p", { style: { fontSize: 11, color: "rgba(255,255,255,0.5)", margin: 0 }, children: currentResult.error?.message }),
|
|
5307
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => handleGenerateImage(currentResult.prompt), style: { padding: "8px 16px", borderRadius: 8, border: "1px solid rgba(255,255,255,0.2)", fontSize: 11, color: "rgba(255,255,255,0.7)", background: "none", cursor: "pointer", fontFamily: "inherit" }, children: "Erneut versuchen" })
|
|
5042
5308
|
] }),
|
|
5043
|
-
currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */
|
|
5044
|
-
!currentResult && /* @__PURE__ */
|
|
5045
|
-
/* @__PURE__ */
|
|
5046
|
-
/* @__PURE__ */
|
|
5309
|
+
currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */ jsx22("img", { src: currentResult.base64, style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain" } }),
|
|
5310
|
+
!currentResult && /* @__PURE__ */ jsxs20("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 8, opacity: 0.1 }, children: [
|
|
5311
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 64 }, children: "palette" }),
|
|
5312
|
+
/* @__PURE__ */ jsx22("span", { style: { fontSize: 11, fontWeight: "bold", textTransform: "uppercase", letterSpacing: "0.2em" }, children: "Avatar Architect" })
|
|
5047
5313
|
] }),
|
|
5048
|
-
currentResult?.status === "done" && /* @__PURE__ */
|
|
5049
|
-
history.length > 1 && currentResult && /* @__PURE__ */
|
|
5050
|
-
/* @__PURE__ */
|
|
5051
|
-
/* @__PURE__ */
|
|
5052
|
-
/* @__PURE__ */
|
|
5314
|
+
currentResult?.status === "done" && /* @__PURE__ */ jsx22("button", { onClick: openFullscreen, style: { position: "absolute", top: 8, right: 8, width: 32, height: 32, display: "flex", alignItems: "center", justifyContent: "center", borderRadius: "50%", background: "rgba(0,0,0,0.6)", border: "1px solid rgba(255,255,255,0.1)", cursor: "pointer", color: "#fff" }, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "fullscreen" }) }),
|
|
5315
|
+
history.length > 1 && currentResult && /* @__PURE__ */ jsxs20(Fragment9, { children: [
|
|
5316
|
+
/* @__PURE__ */ jsx22("button", { onClick: goToPrev, disabled: currentIndex <= 0, style: { position: "absolute", left: 8, top: "50%", transform: "translateY(-50%)", width: 36, height: 36, display: "flex", alignItems: "center", justifyContent: "center", borderRadius: "50%", background: "rgba(0,0,0,0.6)", border: "1px solid rgba(255,255,255,0.1)", cursor: "pointer", color: "#fff", opacity: currentIndex <= 0 ? 0 : 1, transition: "opacity 0.2s" }, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 20 }, children: "chevron_left" }) }),
|
|
5317
|
+
/* @__PURE__ */ jsx22("button", { onClick: goToNext, disabled: currentIndex >= history.length - 1, style: { position: "absolute", right: 8, top: "50%", transform: "translateY(-50%)", width: 36, height: 36, display: "flex", alignItems: "center", justifyContent: "center", borderRadius: "50%", background: "rgba(0,0,0,0.6)", border: "1px solid rgba(255,255,255,0.1)", cursor: "pointer", color: "#fff", opacity: currentIndex >= history.length - 1 ? 0 : 1, transition: "opacity 0.2s" }, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 20 }, children: "chevron_right" }) }),
|
|
5318
|
+
/* @__PURE__ */ jsxs20("div", { style: { position: "absolute", bottom: 8, left: "50%", transform: "translateX(-50%)", background: "rgba(0,0,0,0.6)", borderRadius: 999, padding: "2px 12px", fontSize: 10, color: "rgba(255,255,255,0.4)", fontFamily: "monospace" }, children: [
|
|
5053
5319
|
currentIndex + 1,
|
|
5054
5320
|
" / ",
|
|
5055
5321
|
history.length
|
|
@@ -5058,42 +5324,42 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5058
5324
|
] })
|
|
5059
5325
|
}
|
|
5060
5326
|
),
|
|
5061
|
-
currentResult?.status === "done" && /* @__PURE__ */
|
|
5062
|
-
/* @__PURE__ */
|
|
5063
|
-
/* @__PURE__ */
|
|
5064
|
-
/* @__PURE__ */
|
|
5327
|
+
currentResult?.status === "done" && /* @__PURE__ */ jsxs20("div", { style: { padding: "0 16px 16px", display: "flex", gap: 8, flexShrink: 0 }, children: [
|
|
5328
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => setActivePrompt(currentResult.prompt || ""), style: { flex: 1, height: 40, display: "flex", alignItems: "center", justifyContent: "center", gap: 6, borderRadius: 10, border: "1px solid rgba(255,255,255,0.1)", background: "rgba(255,255,255,0.05)", color: "rgba(255,255,255,0.6)", fontSize: 11, cursor: "pointer", fontFamily: "inherit" }, children: [
|
|
5329
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "replay" }),
|
|
5330
|
+
/* @__PURE__ */ jsx22("span", { children: "Prompt" })
|
|
5065
5331
|
] }),
|
|
5066
|
-
/* @__PURE__ */
|
|
5067
|
-
/* @__PURE__ */
|
|
5068
|
-
/* @__PURE__ */
|
|
5332
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => handleGenerateImage(currentResult.prompt || activePrompt, currentResult.mediaId, void 0, { silent: true }), style: { flex: 1, height: 40, display: "flex", alignItems: "center", justifyContent: "center", gap: 6, borderRadius: 10, border: "none", background: "rgba(255,255,255,0.1)", color: "rgba(255,255,255,0.8)", fontSize: 11, fontWeight: "bold", cursor: "pointer", fontFamily: "inherit" }, children: [
|
|
5333
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "auto_fix_high" }),
|
|
5334
|
+
/* @__PURE__ */ jsx22("span", { children: "Referenz" })
|
|
5069
5335
|
] }),
|
|
5070
|
-
/* @__PURE__ */
|
|
5071
|
-
/* @__PURE__ */
|
|
5072
|
-
/* @__PURE__ */
|
|
5336
|
+
/* @__PURE__ */ jsxs20("button", { onClick: handleDownloadSingle, style: { flex: 1, height: 40, display: "flex", alignItems: "center", justifyContent: "center", gap: 6, borderRadius: 10, border: "1px solid rgba(255,255,255,0.1)", background: "rgba(255,255,255,0.05)", color: "rgba(255,255,255,0.6)", fontSize: 11, cursor: "pointer", fontFamily: "inherit" }, children: [
|
|
5337
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "download" }),
|
|
5338
|
+
/* @__PURE__ */ jsx22("span", { children: "Laden" })
|
|
5073
5339
|
] })
|
|
5074
5340
|
] })
|
|
5075
5341
|
] })
|
|
5076
5342
|
] }) });
|
|
5077
5343
|
}
|
|
5078
|
-
return /* @__PURE__ */
|
|
5079
|
-
/* @__PURE__ */
|
|
5080
|
-
/* @__PURE__ */
|
|
5081
|
-
/* @__PURE__ */
|
|
5082
|
-
!isLeftCollapsed && /* @__PURE__ */
|
|
5083
|
-
workspaceTags && /* @__PURE__ */
|
|
5084
|
-
/* @__PURE__ */
|
|
5344
|
+
return /* @__PURE__ */ jsxs20("div", { className: "flex h-screen w-screen bg-[#0e0e0e] text-white overflow-hidden", style: hcStyle, children: [
|
|
5345
|
+
/* @__PURE__ */ jsx22("div", { className: "absolute top-2 right-2 z-50", children: /* @__PURE__ */ jsx22("button", { onClick: () => setShowStart(true), className: "text-white/10 hover:text-white/30 transition-colors text-[10px]", children: "\u21C4" }) }),
|
|
5346
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col border-r border-white/5 overflow-hidden relative bg-black/10 shrink-0", style: { width: isLeftCollapsed ? 48 : leftPanelWidth, transition: "none" }, children: [
|
|
5347
|
+
/* @__PURE__ */ jsxs20("div", { className: "h-14 border-b border-white/5 flex items-center justify-between shrink-0 px-1", children: [
|
|
5348
|
+
!isLeftCollapsed && /* @__PURE__ */ jsxs20("div", { className: "flex flex-1 gap-1", children: [
|
|
5349
|
+
workspaceTags && /* @__PURE__ */ jsxs20("button", { onClick: () => setLeftTab("prompt"), className: `flex-1 flex items-center justify-center gap-1 h-8 rounded-lg text-[8px] font-bold uppercase tracking-wide transition-colors ${leftTab === "prompt" ? "bg-white/10 text-white" : "text-white/30 hover:text-white/60"}`, children: [
|
|
5350
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[14px]", children: "auto_fix_high" }),
|
|
5085
5351
|
"Prompt"
|
|
5086
5352
|
] }),
|
|
5087
|
-
/* @__PURE__ */
|
|
5088
|
-
/* @__PURE__ */
|
|
5353
|
+
/* @__PURE__ */ jsxs20("button", { onClick: () => setLeftTab("hierarchy"), className: `flex-1 flex items-center justify-center gap-1 h-8 rounded-lg text-[8px] font-bold uppercase tracking-wide transition-colors ${leftTab === "hierarchy" ? "bg-white/10 text-white" : "text-white/30 hover:text-white/60"}`, children: [
|
|
5354
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[14px]", children: "account_tree" }),
|
|
5089
5355
|
"Hierarchie"
|
|
5090
5356
|
] }),
|
|
5091
|
-
workspaceTags && /* @__PURE__ */
|
|
5357
|
+
workspaceTags && /* @__PURE__ */ jsx22("button", { onClick: () => setActiveTab("tags"), className: `flex-1 flex items-center justify-center gap-1.5 text-[11px] font-bold uppercase tracking-wide transition-colors ${activeTab === "tags" ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[20px]", children: "label" }) })
|
|
5092
5358
|
] }),
|
|
5093
|
-
/* @__PURE__ */
|
|
5359
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => setIsLeftCollapsed(!isLeftCollapsed), className: "material-symbols-outlined text-[18px] text-white/40 hover:text-white transition-all w-10 flex items-center justify-center", children: isLeftCollapsed ? "chevron_right" : "chevron_left" })
|
|
5094
5360
|
] }),
|
|
5095
|
-
!isLeftCollapsed && /* @__PURE__ */
|
|
5096
|
-
activeTab === "tags" && workspaceTags && /* @__PURE__ */
|
|
5361
|
+
!isLeftCollapsed && /* @__PURE__ */ jsxs20("div", { className: "flex-1 overflow-hidden relative", children: [
|
|
5362
|
+
activeTab === "tags" && workspaceTags && /* @__PURE__ */ jsx22(
|
|
5097
5363
|
TagManagerPanel,
|
|
5098
5364
|
{
|
|
5099
5365
|
workspaceTags,
|
|
@@ -5104,11 +5370,11 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5104
5370
|
onTagMove: handleTagMove
|
|
5105
5371
|
}
|
|
5106
5372
|
),
|
|
5107
|
-
activeTab === "tags" && !workspaceTags && /* @__PURE__ */
|
|
5108
|
-
/* @__PURE__ */
|
|
5109
|
-
/* @__PURE__ */
|
|
5373
|
+
activeTab === "tags" && !workspaceTags && /* @__PURE__ */ jsx22("div", { className: "flex items-center justify-center h-full p-8 text-center", children: /* @__PURE__ */ jsxs20("div", { children: [
|
|
5374
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[40px] text-white/10 block mb-3", children: "label_off" }),
|
|
5375
|
+
/* @__PURE__ */ jsx22("p", { className: "text-[11px] text-white/20", children: "Erst Workspace importieren um Tags zu verwalten." })
|
|
5110
5376
|
] }) }),
|
|
5111
|
-
leftTab === "hierarchy" && activeTab !== "tags" && /* @__PURE__ */
|
|
5377
|
+
leftTab === "hierarchy" && activeTab !== "tags" && /* @__PURE__ */ jsx22("div", { className: "absolute inset-0", children: /* @__PURE__ */ jsx22(
|
|
5112
5378
|
ListView,
|
|
5113
5379
|
{
|
|
5114
5380
|
nodes,
|
|
@@ -5133,18 +5399,18 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5133
5399
|
isGeneratingNodeId: (id) => isSynthesizing && focusedNodeId === id
|
|
5134
5400
|
}
|
|
5135
5401
|
) }),
|
|
5136
|
-
leftTab === "prompt" && workspaceTags && activeTab !== "tags" && /* @__PURE__ */
|
|
5402
|
+
leftTab === "prompt" && workspaceTags && activeTab !== "tags" && /* @__PURE__ */ jsx22(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 })
|
|
5137
5403
|
] })
|
|
5138
5404
|
] }),
|
|
5139
|
-
!isLeftCollapsed && /* @__PURE__ */
|
|
5140
|
-
/* @__PURE__ */
|
|
5141
|
-
/* @__PURE__ */
|
|
5142
|
-
/* @__PURE__ */
|
|
5143
|
-
/* @__PURE__ */
|
|
5144
|
-
/* @__PURE__ */
|
|
5405
|
+
!isLeftCollapsed && /* @__PURE__ */ jsx22("div", { onMouseDown: startLeftResize, className: "w-1 shrink-0 cursor-col-resize hover:bg-white/20 active:bg-white/30 transition-colors", style: { background: "transparent" } }),
|
|
5406
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1 flex flex-col bg-[#0b0b0b] overflow-hidden", children: [
|
|
5407
|
+
/* @__PURE__ */ jsxs20("div", { className: "h-14 border-b border-white/5 flex items-center px-4 gap-2 justify-between shrink-0 bg-black/20", children: [
|
|
5408
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-1.5", children: [
|
|
5409
|
+
/* @__PURE__ */ jsx22(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
|
|
5410
|
+
/* @__PURE__ */ jsx22(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" }] })
|
|
5145
5411
|
] }),
|
|
5146
|
-
/* @__PURE__ */
|
|
5147
|
-
/* @__PURE__ */
|
|
5412
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-1 mx-auto", children: [
|
|
5413
|
+
/* @__PURE__ */ jsx22(
|
|
5148
5414
|
"button",
|
|
5149
5415
|
{
|
|
5150
5416
|
onClick: () => setMiddlePanel("stage"),
|
|
@@ -5152,7 +5418,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5152
5418
|
children: "Stage"
|
|
5153
5419
|
}
|
|
5154
5420
|
),
|
|
5155
|
-
/* @__PURE__ */
|
|
5421
|
+
/* @__PURE__ */ jsx22(
|
|
5156
5422
|
"button",
|
|
5157
5423
|
{
|
|
5158
5424
|
onClick: () => setMiddlePanel("labs"),
|
|
@@ -5161,68 +5427,68 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5161
5427
|
}
|
|
5162
5428
|
)
|
|
5163
5429
|
] }),
|
|
5164
|
-
/* @__PURE__ */
|
|
5165
|
-
activeReferenceThumbnail ? /* @__PURE__ */
|
|
5166
|
-
/* @__PURE__ */
|
|
5167
|
-
/* @__PURE__ */
|
|
5168
|
-
/* @__PURE__ */
|
|
5169
|
-
] }) : /* @__PURE__ */
|
|
5170
|
-
/* @__PURE__ */
|
|
5171
|
-
/* @__PURE__ */
|
|
5430
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-2", children: [
|
|
5431
|
+
activeReferenceThumbnail ? /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden", style: { height: 28 }, children: [
|
|
5432
|
+
/* @__PURE__ */ jsx22("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
|
|
5433
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
|
|
5434
|
+
/* @__PURE__ */ jsx22("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 hover:text-white/80 transition-colors", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
|
|
5435
|
+
] }) : /* @__PURE__ */ jsxs20("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: [
|
|
5436
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[14px]", children: "add_photo_alternate" }),
|
|
5437
|
+
/* @__PURE__ */ jsx22("span", { children: "Ref" })
|
|
5172
5438
|
] }),
|
|
5173
|
-
/* @__PURE__ */
|
|
5174
|
-
/* @__PURE__ */
|
|
5439
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => setIsPromptCollapsed(!isPromptCollapsed), className: "text-white/40 hover:text-white transition-colors", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined", children: isPromptCollapsed ? "expand_more" : "expand_less" }) }),
|
|
5440
|
+
/* @__PURE__ */ jsx22(PillButton, { variant: "solid", icon: "bolt", loading: isGenerating, disabled: !activePrompt.trim(), onClick: () => handleGenerateImage(), children: "Generieren" })
|
|
5175
5441
|
] })
|
|
5176
5442
|
] }),
|
|
5177
|
-
/* @__PURE__ */
|
|
5178
|
-
!isPromptCollapsed && /* @__PURE__ */
|
|
5179
|
-
/* @__PURE__ */
|
|
5180
|
-
activePrompt && !isSynthesizing && /* @__PURE__ */
|
|
5443
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex-1 flex flex-col overflow-hidden relative", children: [
|
|
5444
|
+
!isPromptCollapsed && /* @__PURE__ */ jsx22("div", { className: "px-6 py-4 border-b border-white/5 bg-black/10 overflow-hidden shrink-0", children: /* @__PURE__ */ jsxs20("div", { className: `relative min-h-[60px] p-4 rounded-2xl border transition-all ${isSynthesizing ? "prompt-loading" : "bg-white/5 border-white/10"}`, children: [
|
|
5445
|
+
/* @__PURE__ */ jsx22("textarea", { value: activePrompt, onChange: (e) => setActivePrompt(e.target.value), className: "w-full bg-transparent border-none outline-none text-[12px] leading-relaxed text-white/80 resize-none h-20 dark-scrollbar", placeholder: "W\xE4hle einen Knoten oder tippe einen Prompt..." }),
|
|
5446
|
+
activePrompt && !isSynthesizing && /* @__PURE__ */ jsx22("button", { onClick: () => setActivePrompt(""), className: "absolute top-2 right-2 w-6 h-6 rounded-full bg-white/5 hover:bg-white/10 flex items-center justify-center transition-colors text-white/20 hover:text-white", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
|
|
5181
5447
|
] }) }),
|
|
5182
|
-
middlePanel === "labs" ? /* @__PURE__ */
|
|
5448
|
+
middlePanel === "labs" ? /* @__PURE__ */ jsx22("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ jsx22(LabsTab, { services: labServices, onResult: (item) => {
|
|
5183
5449
|
const frame = item.frames[0];
|
|
5184
5450
|
if (frame?.base64) setCurrentResult(frameToGeneration(frame, item));
|
|
5185
|
-
} }) }) : /* @__PURE__ */
|
|
5186
|
-
isGenerating && currentResult?.status === "done" && /* @__PURE__ */
|
|
5187
|
-
/* @__PURE__ */
|
|
5188
|
-
/* @__PURE__ */
|
|
5451
|
+
} }) }) : /* @__PURE__ */ jsx22("div", { className: "flex-1 p-6 overflow-hidden flex items-center justify-center", children: /* @__PURE__ */ jsxs20("div", { className: "h-full w-full max-w-4xl aspect-square rounded-3xl border border-white/5 bg-black/40 relative overflow-hidden flex items-center justify-center group shadow-2xl", children: [
|
|
5452
|
+
isGenerating && currentResult?.status === "done" && /* @__PURE__ */ jsxs20("div", { className: "absolute top-6 right-6 z-30 bg-black/60 backdrop-blur-md px-4 py-2 rounded-full border border-white/10 flex items-center gap-3", children: [
|
|
5453
|
+
/* @__PURE__ */ jsx22("div", { className: "w-3 h-3 border-t-2 border-white rounded-full animate-spin" }),
|
|
5454
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[10px] text-white/60 uppercase font-bold tracking-widest", children: "Neue Referenz..." })
|
|
5189
5455
|
] }),
|
|
5190
|
-
currentResult ? currentResult.status === "processing" ? /* @__PURE__ */
|
|
5191
|
-
/* @__PURE__ */
|
|
5192
|
-
/* @__PURE__ */
|
|
5193
|
-
] }) : currentResult.status === "error" ? /* @__PURE__ */
|
|
5194
|
-
/* @__PURE__ */
|
|
5195
|
-
/* @__PURE__ */
|
|
5196
|
-
/* @__PURE__ */
|
|
5197
|
-
/* @__PURE__ */
|
|
5456
|
+
currentResult ? currentResult.status === "processing" ? /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-4", children: [
|
|
5457
|
+
/* @__PURE__ */ jsx22("div", { className: "w-10 h-10 border-t-2 border-white rounded-full animate-spin" }),
|
|
5458
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[10px] text-white/40 uppercase font-bold tracking-widest", children: "Erstelle Bild..." })
|
|
5459
|
+
] }) : currentResult.status === "error" ? /* @__PURE__ */ jsxs20("div", { className: "p-10 text-center flex flex-col items-center gap-5 max-w-md", children: [
|
|
5460
|
+
/* @__PURE__ */ jsx22("div", { className: "w-16 h-16 rounded-full bg-red-500/10 flex items-center justify-center", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-red-500 text-[32px]", children: "warning" }) }),
|
|
5461
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col gap-2", children: [
|
|
5462
|
+
/* @__PURE__ */ jsx22("h3", { className: "text-[11px] font-bold uppercase tracking-widest text-red-400", children: "Generierungsfehler" }),
|
|
5463
|
+
/* @__PURE__ */ jsx22("p", { className: "text-white/60 text-[12px] leading-relaxed", children: currentResult.error?.message })
|
|
5198
5464
|
] }),
|
|
5199
|
-
/* @__PURE__ */
|
|
5200
|
-
] }) : /* @__PURE__ */
|
|
5201
|
-
/* @__PURE__ */
|
|
5202
|
-
/* @__PURE__ */
|
|
5203
|
-
/* @__PURE__ */
|
|
5204
|
-
/* @__PURE__ */
|
|
5205
|
-
/* @__PURE__ */
|
|
5465
|
+
/* @__PURE__ */ jsx22(PillButton, { variant: "outline", icon: "refresh", onClick: () => handleGenerateImage(currentResult.prompt), children: "Erneut versuchen" })
|
|
5466
|
+
] }) : /* @__PURE__ */ jsxs20("div", { className: "h-full w-full relative flex items-center justify-center", children: [
|
|
5467
|
+
/* @__PURE__ */ jsx22("img", { src: currentResult.base64, className: "max-h-full max-w-full object-contain rounded-xl shadow-2xl" }),
|
|
5468
|
+
/* @__PURE__ */ jsxs20("div", { className: "absolute bottom-6 flex gap-2 opacity-0 group-hover:opacity-100 transition-all translate-y-4 group-hover:translate-y-0 z-20", children: [
|
|
5469
|
+
/* @__PURE__ */ jsx22(PillButton, { variant: "outline", icon: "replay", onClick: () => setActivePrompt(currentResult.prompt || ""), children: "Prompt" }),
|
|
5470
|
+
/* @__PURE__ */ jsx22(PillButton, { variant: "solid", icon: "auto_fix_high", onClick: () => handleGenerateImage(currentResult.prompt || activePrompt, currentResult.mediaId, void 0, { silent: true }), children: "Referenz" }),
|
|
5471
|
+
/* @__PURE__ */ jsx22(PillButton, { variant: "outline", icon: "download", onClick: handleDownloadSingle, children: "Speichern" })
|
|
5206
5472
|
] })
|
|
5207
|
-
] }) : /* @__PURE__ */
|
|
5208
|
-
/* @__PURE__ */
|
|
5209
|
-
/* @__PURE__ */
|
|
5473
|
+
] }) : /* @__PURE__ */ jsxs20("div", { className: "flex flex-col items-center gap-2 opacity-10", children: [
|
|
5474
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[100px]", children: "palette" }),
|
|
5475
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[12px] font-bold uppercase tracking-[0.2em]", children: "Avatar Architect" })
|
|
5210
5476
|
] })
|
|
5211
5477
|
] }) })
|
|
5212
5478
|
] })
|
|
5213
5479
|
] }),
|
|
5214
|
-
!isRightCollapsed && /* @__PURE__ */
|
|
5215
|
-
/* @__PURE__ */
|
|
5216
|
-
/* @__PURE__ */
|
|
5217
|
-
/* @__PURE__ */
|
|
5480
|
+
!isRightCollapsed && /* @__PURE__ */ jsx22("div", { onMouseDown: startRightResize, className: "w-1 shrink-0 cursor-col-resize hover:bg-white/20 active:bg-white/30 transition-colors", style: { background: "transparent" } }),
|
|
5481
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex flex-col border-l border-white/5 bg-[#0e0e0e] shrink-0", style: { width: isRightCollapsed ? 60 : rightPanelWidth, transition: "none" }, children: [
|
|
5482
|
+
/* @__PURE__ */ jsxs20("div", { className: "flex border-b border-white/5 h-14 shrink-0 overflow-hidden", children: [
|
|
5483
|
+
/* @__PURE__ */ jsx22("div", { className: "flex flex-1", children: ["history", "gallery", "inspect", "setup", "sync", "tags"].map((tab) => /* @__PURE__ */ jsx22("button", { onClick: () => {
|
|
5218
5484
|
setActiveTab(tab);
|
|
5219
5485
|
setIsRightCollapsed(false);
|
|
5220
|
-
}, className: `flex-1 flex items-center justify-center relative transition-colors ${activeTab === tab ? "text-white" : "text-white/20"}`, children: /* @__PURE__ */
|
|
5221
|
-
hfToken && /* @__PURE__ */
|
|
5222
|
-
/* @__PURE__ */
|
|
5486
|
+
}, className: `flex-1 flex items-center justify-center relative transition-colors ${activeTab === tab ? "text-white" : "text-white/20"}`, children: /* @__PURE__ */ jsx22("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)) }),
|
|
5487
|
+
hfToken && /* @__PURE__ */ jsx22("button", { onClick: () => refreshHF(), disabled: isHfRefreshing, className: "w-10 flex items-center justify-center text-white/20 hover:text-white/60 transition-colors disabled:opacity-30", children: /* @__PURE__ */ jsx22("span", { className: `material-symbols-outlined text-[18px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) }),
|
|
5488
|
+
/* @__PURE__ */ jsx22("button", { onClick: () => setIsRightCollapsed(!isRightCollapsed), className: "w-10 flex items-center justify-center text-white/20 hover:text-white", children: /* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[18px]", children: isRightCollapsed ? "chevron_left" : "chevron_right" }) })
|
|
5223
5489
|
] }),
|
|
5224
|
-
!isRightCollapsed && /* @__PURE__ */
|
|
5225
|
-
activeTab === "tags" && workspaceTags && /* @__PURE__ */
|
|
5490
|
+
!isRightCollapsed && /* @__PURE__ */ jsxs20("div", { className: "flex-1 overflow-hidden relative", children: [
|
|
5491
|
+
activeTab === "tags" && workspaceTags && /* @__PURE__ */ jsx22(
|
|
5226
5492
|
TagManagerPanel,
|
|
5227
5493
|
{
|
|
5228
5494
|
workspaceTags,
|
|
@@ -5233,12 +5499,12 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5233
5499
|
onTagMove: handleTagMove
|
|
5234
5500
|
}
|
|
5235
5501
|
),
|
|
5236
|
-
activeTab === "tags" && !workspaceTags && /* @__PURE__ */
|
|
5237
|
-
/* @__PURE__ */
|
|
5238
|
-
/* @__PURE__ */
|
|
5502
|
+
activeTab === "tags" && !workspaceTags && /* @__PURE__ */ jsx22("div", { className: "flex items-center justify-center h-full p-8 text-center", children: /* @__PURE__ */ jsxs20("div", { children: [
|
|
5503
|
+
/* @__PURE__ */ jsx22("span", { className: "material-symbols-outlined text-[40px] text-white/10 block mb-3", children: "label_off" }),
|
|
5504
|
+
/* @__PURE__ */ jsx22("p", { className: "text-[11px] text-white/20", children: "Erst Workspace importieren um Tags zu verwalten." })
|
|
5239
5505
|
] }) }),
|
|
5240
|
-
activeTab === "history" && /* @__PURE__ */
|
|
5241
|
-
activeTab === "gallery" && /* @__PURE__ */
|
|
5506
|
+
activeTab === "history" && /* @__PURE__ */ jsx22(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: setCurrentResult, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }),
|
|
5507
|
+
activeTab === "gallery" && /* @__PURE__ */ jsx22(
|
|
5242
5508
|
MediaLibrary,
|
|
5243
5509
|
{
|
|
5244
5510
|
items: galleryItems,
|
|
@@ -5252,9 +5518,9 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5252
5518
|
onGenerateReference: (item) => handleGenerateImage(item.prompt || activePrompt, item.mediaId, void 0, { silent: true })
|
|
5253
5519
|
}
|
|
5254
5520
|
),
|
|
5255
|
-
activeTab === "inspect" && /* @__PURE__ */
|
|
5256
|
-
activeTab === "setup" && /* @__PURE__ */
|
|
5257
|
-
activeTab === "sync" && /* @__PURE__ */
|
|
5521
|
+
activeTab === "inspect" && /* @__PURE__ */ jsx22(InspectPanel, { currentResult, history, onSelect: setCurrentResult }),
|
|
5522
|
+
activeTab === "setup" && /* @__PURE__ */ jsx22(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
|
|
5523
|
+
activeTab === "sync" && /* @__PURE__ */ jsx22(
|
|
5258
5524
|
ProjectSyncTab,
|
|
5259
5525
|
{
|
|
5260
5526
|
topSlot: syncTopSlot,
|
|
@@ -5284,8 +5550,8 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
|
|
|
5284
5550
|
}
|
|
5285
5551
|
|
|
5286
5552
|
// src/components/FaApp.tsx
|
|
5287
|
-
import { useState as
|
|
5288
|
-
import { jsx as
|
|
5553
|
+
import { useState as useState18, useEffect as useEffect7 } from "react";
|
|
5554
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
5289
5555
|
function FaApp({
|
|
5290
5556
|
onGenerateImage,
|
|
5291
5557
|
onGeneratePrompt,
|
|
@@ -5304,7 +5570,7 @@ function FaApp({
|
|
|
5304
5570
|
onServerDelete,
|
|
5305
5571
|
buildInfo
|
|
5306
5572
|
}) {
|
|
5307
|
-
const [hfNamespace, setHfNamespace] =
|
|
5573
|
+
const [hfNamespace, setHfNamespace] = useState18(void 0);
|
|
5308
5574
|
useEffect7(() => {
|
|
5309
5575
|
if (!serverBaseUrl) return;
|
|
5310
5576
|
fetch(`${serverBaseUrl}/api/status`).then((r) => r.json()).then((d) => {
|
|
@@ -5316,7 +5582,7 @@ function FaApp({
|
|
|
5316
5582
|
const result = await onGeneratePrompt(text, options);
|
|
5317
5583
|
return result.text;
|
|
5318
5584
|
};
|
|
5319
|
-
return /* @__PURE__ */
|
|
5585
|
+
return /* @__PURE__ */ jsx23(
|
|
5320
5586
|
AvatarArchitectApp,
|
|
5321
5587
|
{
|
|
5322
5588
|
onGenerateImage,
|
|
@@ -5336,7 +5602,7 @@ function FaApp({
|
|
|
5336
5602
|
}
|
|
5337
5603
|
|
|
5338
5604
|
// src/index.ts
|
|
5339
|
-
var LIB_VERSION = "2.0.
|
|
5605
|
+
var LIB_VERSION = "2.0.23";
|
|
5340
5606
|
export {
|
|
5341
5607
|
AvatarArchitectApp,
|
|
5342
5608
|
CollapsibleCard,
|
|
@@ -5349,6 +5615,7 @@ export {
|
|
|
5349
5615
|
LIB_VERSION,
|
|
5350
5616
|
LabBlend,
|
|
5351
5617
|
LabCompare,
|
|
5618
|
+
LabFrameExtractor,
|
|
5352
5619
|
LabImagePicker,
|
|
5353
5620
|
LabLoop,
|
|
5354
5621
|
LabRemix,
|