@rslsp1/fa-app-tools 2.0.22 → 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/index.js CHANGED
@@ -407,10 +407,10 @@ async function loadHFState(namespace, token) {
407
407
  async function loadPendingEvents(namespace, token, sinceTs) {
408
408
  const files = await hfListDir(namespace, "events", token);
409
409
  const pending = files.filter((f) => f.type === "file" && tsFromEventPath(f.path) > sinceTs).sort((a, b) => a.path.localeCompare(b.path));
410
- const events = await Promise.all(
410
+ const raw = await Promise.all(
411
411
  pending.map((f) => hfDownloadJsonByPath(f.path, token))
412
412
  );
413
- return events;
413
+ return raw.flatMap((e) => Array.isArray(e) ? e : [e]);
414
414
  }
415
415
  function getSessionClientId() {
416
416
  return SESSION_CLIENT_ID;
@@ -566,23 +566,27 @@ async function hfUploadImage(base64, id, token, mimeType = "image/jpeg") {
566
566
  commitTitle: `Add image ${id}`
567
567
  });
568
568
  }
569
- async function hfLoadImageAsBase64(id, token) {
570
- for (const ext of ["jpg", "png"]) {
571
- try {
572
- const res = await fetch(
573
- `${HF_BASE}/datasets/${HF_REPO}/resolve/main/images/${id}.${ext}?download=true`,
574
- { headers: { Authorization: `Bearer ${token}` } }
575
- );
576
- if (!res.ok) continue;
577
- const blob = await res.blob();
578
- return new Promise((resolve, reject) => {
579
- const reader = new FileReader();
580
- reader.onload = () => resolve(reader.result.split(",")[1]);
581
- reader.onerror = reject;
582
- reader.readAsDataURL(blob);
583
- });
584
- } catch {
585
- continue;
569
+ async function hfLoadImageAsBase64(id, token, namespace) {
570
+ const paths = [`images/${id}`];
571
+ if (namespace) paths.push(`${namespace}images/${id}`);
572
+ for (const basePath of paths) {
573
+ for (const ext of ["jpg", "png"]) {
574
+ try {
575
+ const res = await fetch(
576
+ `${HF_BASE}/datasets/${HF_REPO}/resolve/main/${basePath}.${ext}?download=true`,
577
+ { headers: { Authorization: `Bearer ${token}` } }
578
+ );
579
+ if (!res.ok) continue;
580
+ const blob = await res.blob();
581
+ return new Promise((resolve, reject) => {
582
+ const reader = new FileReader();
583
+ reader.onload = () => resolve(reader.result.split(",")[1]);
584
+ reader.onerror = reject;
585
+ reader.readAsDataURL(blob);
586
+ });
587
+ } catch {
588
+ continue;
589
+ }
586
590
  }
587
591
  }
588
592
  return null;
@@ -615,6 +619,7 @@ __export(index_exports, {
615
619
  LIB_VERSION: () => LIB_VERSION,
616
620
  LabBlend: () => LabBlend,
617
621
  LabCompare: () => LabCompare,
622
+ LabFrameExtractor: () => LabFrameExtractor,
618
623
  LabImagePicker: () => LabImagePicker,
619
624
  LabLoop: () => LabLoop,
620
625
  LabRemix: () => LabRemix,
@@ -1461,7 +1466,7 @@ function ListView({ nodes, edges, onNodeChange, onAddChild, onDeleteNode, onMove
1461
1466
  }
1462
1467
 
1463
1468
  // src/components/AvatarArchitectApp.tsx
1464
- var import_react23 = require("react");
1469
+ var import_react24 = require("react");
1465
1470
 
1466
1471
  // src/components/PromptTab.tsx
1467
1472
  var import_react12 = require("react");
@@ -2754,7 +2759,7 @@ function useHFState(token, namespace) {
2754
2759
  }
2755
2760
 
2756
2761
  // src/components/labs/LabsTab.tsx
2757
- var import_react20 = require("react");
2762
+ var import_react21 = require("react");
2758
2763
 
2759
2764
  // src/components/labs/LabRemix.tsx
2760
2765
  var import_react16 = require("react");
@@ -3592,52 +3597,313 @@ var LabLoop = ({ services, onResult }) => {
3592
3597
  ] });
3593
3598
  };
3594
3599
 
3595
- // src/components/labs/LabsTab.tsx
3600
+ // src/components/labs/LabFrameExtractor.tsx
3601
+ var import_react20 = require("react");
3596
3602
  var import_jsx_runtime18 = require("react/jsx-runtime");
3597
- var TABS = [
3603
+ var formatTime = (s) => {
3604
+ const m = Math.floor(s / 60);
3605
+ const sec = (s % 60).toFixed(1);
3606
+ return `${m}:${sec.padStart(4, "0")}`;
3607
+ };
3608
+ var MAX_FRAMES = 40;
3609
+ var INTERVAL_OPTIONS = ["0.5", "1", "2", "5", "10"];
3610
+ var LabFrameExtractor = ({
3611
+ videoItems,
3612
+ onResult,
3613
+ resolveVideoUrl
3614
+ }) => {
3615
+ const videoRef = (0, import_react20.useRef)(null);
3616
+ const canvasRef = (0, import_react20.useRef)(null);
3617
+ const cancelledRef = (0, import_react20.useRef)(false);
3618
+ const [selectedItem, setSelectedItem] = (0, import_react20.useState)(null);
3619
+ const [videoSrc, setVideoSrc] = (0, import_react20.useState)(null);
3620
+ const [videoReady, setVideoReady] = (0, import_react20.useState)(false);
3621
+ const [frames, setFrames] = (0, import_react20.useState)([]);
3622
+ const [isExtracting, setIsExtracting] = (0, import_react20.useState)(false);
3623
+ const [intervalSec, setIntervalSec] = (0, import_react20.useState)("1");
3624
+ const handleVideoSelect = (item) => {
3625
+ const mediaId = item.frames[0]?.mediaId;
3626
+ if (!mediaId) return;
3627
+ setSelectedItem(item);
3628
+ setVideoSrc(resolveVideoUrl(mediaId));
3629
+ setFrames([]);
3630
+ setVideoReady(false);
3631
+ cancelledRef.current = false;
3632
+ };
3633
+ const captureAt = (0, import_react20.useCallback)(
3634
+ (t, label) => new Promise((resolve) => {
3635
+ const video = videoRef.current;
3636
+ const canvas = canvasRef.current;
3637
+ if (!video || !canvas || !isFinite(video.duration)) return resolve(null);
3638
+ const onSeeked = () => {
3639
+ canvas.width = video.videoWidth;
3640
+ canvas.height = video.videoHeight;
3641
+ const ctx = canvas.getContext("2d");
3642
+ if (!ctx) return resolve(null);
3643
+ ctx.drawImage(video, 0, 0);
3644
+ resolve({
3645
+ id: `fe-${Date.now()}-${Math.random().toString(36).slice(2, 5)}`,
3646
+ dataUrl: canvas.toDataURL("image/png"),
3647
+ timeSeconds: t,
3648
+ label
3649
+ });
3650
+ };
3651
+ video.addEventListener("seeked", onSeeked, { once: true });
3652
+ video.currentTime = t;
3653
+ }),
3654
+ []
3655
+ );
3656
+ const extractSingle = async (mode) => {
3657
+ const v = videoRef.current;
3658
+ if (!v || !videoReady) return;
3659
+ const t = mode === "start" ? 0 : mode === "end" ? Math.max(0, v.duration - 0.01) : v.currentTime;
3660
+ const frame = await captureAt(t, mode === "start" ? "Start" : mode === "end" ? "End" : formatTime(t));
3661
+ if (frame) setFrames((prev) => [frame, ...prev]);
3662
+ };
3663
+ const extractInterval = async () => {
3664
+ const v = videoRef.current;
3665
+ if (!v || !videoReady || isExtracting) return;
3666
+ const every = parseFloat(intervalSec);
3667
+ if (!isFinite(every) || every <= 0) return;
3668
+ const ts = [];
3669
+ for (let t = 0; t <= v.duration; t += every) {
3670
+ ts.push(Math.min(t, v.duration - 0.01));
3671
+ if (ts.length >= MAX_FRAMES) break;
3672
+ }
3673
+ setIsExtracting(true);
3674
+ cancelledRef.current = false;
3675
+ setFrames([]);
3676
+ const collected = [];
3677
+ for (const t of ts) {
3678
+ if (cancelledRef.current) break;
3679
+ const f = await captureAt(t, formatTime(t));
3680
+ if (f) {
3681
+ collected.push(f);
3682
+ setFrames([...collected]);
3683
+ }
3684
+ }
3685
+ setIsExtracting(false);
3686
+ };
3687
+ const useFrame = (frame) => {
3688
+ if (!onResult || !selectedItem) return;
3689
+ const base64 = frame.dataUrl.replace(/^data:image\/png;base64,/, "");
3690
+ const labFrame = {
3691
+ id: frame.id,
3692
+ base64,
3693
+ source: "flow-gallery"
3694
+ };
3695
+ onResult({
3696
+ id: frame.id,
3697
+ prompt: selectedItem.prompt,
3698
+ label: `Frame ${frame.label} \u2013 ${selectedItem.label ?? selectedItem.id}`,
3699
+ tags: selectedItem.tags ?? [],
3700
+ frames: [labFrame]
3701
+ });
3702
+ };
3703
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex", flexDirection: "column", gap: 12, padding: 12, height: "100%", overflow: "auto" }, children: [
3704
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: 6 }, children: [
3705
+ videoItems.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { style: { fontSize: 11, color: "#666", fontStyle: "italic" }, children: "No video items available" }),
3706
+ videoItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3707
+ "button",
3708
+ {
3709
+ onClick: () => handleVideoSelect(item),
3710
+ style: {
3711
+ padding: "4px 8px",
3712
+ fontSize: 11,
3713
+ background: selectedItem?.id === item.id ? "rgba(168,85,247,0.2)" : "rgba(255,255,255,0.05)",
3714
+ border: `1px solid ${selectedItem?.id === item.id ? "#a855f7" : "rgba(255,255,255,0.1)"}`,
3715
+ borderRadius: 4,
3716
+ color: "#fff",
3717
+ cursor: "pointer"
3718
+ },
3719
+ children: item.label ?? item.id
3720
+ },
3721
+ item.id
3722
+ ))
3723
+ ] }),
3724
+ videoSrc && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3725
+ "video",
3726
+ {
3727
+ ref: videoRef,
3728
+ src: videoSrc,
3729
+ controls: true,
3730
+ crossOrigin: "anonymous",
3731
+ onLoadedMetadata: () => setVideoReady(true),
3732
+ style: { width: "100%", maxHeight: 280, background: "#000", borderRadius: 6, display: "block" }
3733
+ }
3734
+ ),
3735
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("canvas", { ref: canvasRef, style: { display: "none" } }),
3736
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex", flexWrap: "wrap", gap: 6, alignItems: "center" }, children: [
3737
+ ["start", "current", "end"].map((mode) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3738
+ "button",
3739
+ {
3740
+ disabled: !videoReady,
3741
+ onClick: () => extractSingle(mode),
3742
+ style: {
3743
+ padding: "4px 10px",
3744
+ fontSize: 11,
3745
+ borderRadius: 4,
3746
+ background: "rgba(255,255,255,0.08)",
3747
+ border: "1px solid rgba(255,255,255,0.15)",
3748
+ color: "#fff",
3749
+ cursor: videoReady ? "pointer" : "not-allowed",
3750
+ opacity: videoReady ? 1 : 0.4
3751
+ },
3752
+ children: mode === "start" ? "Start Frame" : mode === "end" ? "End Frame" : "Current Frame"
3753
+ },
3754
+ mode
3755
+ )),
3756
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { style: { fontSize: 11, color: "#aaa" }, children: "every" }),
3757
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3758
+ "select",
3759
+ {
3760
+ value: intervalSec,
3761
+ onChange: (e) => setIntervalSec(e.target.value),
3762
+ disabled: !videoReady || isExtracting,
3763
+ style: { fontSize: 11, background: "#111", border: "1px solid #333", color: "#fff", borderRadius: 4, padding: "2px 4px" },
3764
+ children: INTERVAL_OPTIONS.map((v) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("option", { value: v, children: [
3765
+ v,
3766
+ "s"
3767
+ ] }, v))
3768
+ }
3769
+ ),
3770
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3771
+ "button",
3772
+ {
3773
+ disabled: !videoReady,
3774
+ onClick: isExtracting ? () => {
3775
+ cancelledRef.current = true;
3776
+ } : extractInterval,
3777
+ style: {
3778
+ padding: "4px 10px",
3779
+ fontSize: 11,
3780
+ borderRadius: 4,
3781
+ background: isExtracting ? "rgba(239,68,68,0.2)" : "rgba(255,255,255,0.08)",
3782
+ border: `1px solid ${isExtracting ? "#ef4444" : "rgba(255,255,255,0.15)"}`,
3783
+ color: isExtracting ? "#f87171" : "#fff",
3784
+ cursor: videoReady ? "pointer" : "not-allowed",
3785
+ opacity: videoReady ? 1 : 0.4
3786
+ },
3787
+ children: isExtracting ? "Cancel" : "Extract All"
3788
+ }
3789
+ )
3790
+ ] }),
3791
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex", gap: 8, overflowX: "auto", paddingBottom: 4 }, children: [
3792
+ frames.map((frame) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
3793
+ "div",
3794
+ {
3795
+ style: {
3796
+ flexShrink: 0,
3797
+ width: 100,
3798
+ border: "1px solid rgba(255,255,255,0.1)",
3799
+ borderRadius: 6,
3800
+ overflow: "hidden",
3801
+ background: "rgba(255,255,255,0.03)"
3802
+ },
3803
+ children: [
3804
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("img", { src: frame.dataUrl, style: { width: "100%", aspectRatio: "16/9", objectFit: "cover", display: "block" }, alt: frame.label }),
3805
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { style: { fontSize: 9, color: "#888", textAlign: "center", padding: "2px 4px", fontFamily: "monospace" }, children: frame.label }),
3806
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { style: { display: "flex", gap: 2, padding: "0 4px 4px", justifyContent: "center" }, children: [
3807
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3808
+ "button",
3809
+ {
3810
+ onClick: () => useFrame(frame),
3811
+ style: {
3812
+ flex: 1,
3813
+ padding: "2px 0",
3814
+ fontSize: 9,
3815
+ borderRadius: 3,
3816
+ background: "rgba(168,85,247,0.2)",
3817
+ border: "1px solid #a855f7",
3818
+ color: "#c084fc",
3819
+ cursor: "pointer"
3820
+ },
3821
+ children: "Use"
3822
+ }
3823
+ ),
3824
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
3825
+ "button",
3826
+ {
3827
+ onClick: () => setFrames((prev) => prev.filter((f) => f.id !== frame.id)),
3828
+ style: {
3829
+ padding: "2px 4px",
3830
+ fontSize: 9,
3831
+ borderRadius: 3,
3832
+ background: "rgba(255,255,255,0.05)",
3833
+ border: "1px solid rgba(255,255,255,0.1)",
3834
+ color: "#666",
3835
+ cursor: "pointer"
3836
+ },
3837
+ children: "\u2715"
3838
+ }
3839
+ )
3840
+ ] })
3841
+ ]
3842
+ },
3843
+ frame.id
3844
+ )),
3845
+ frames.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { style: { fontSize: 11, color: "#444", fontStyle: "italic", padding: "16px 0" }, children: isExtracting ? "Extracting frames\u2026" : "No frames yet" })
3846
+ ] })
3847
+ ] });
3848
+ };
3849
+
3850
+ // src/components/labs/LabsTab.tsx
3851
+ var import_jsx_runtime19 = require("react/jsx-runtime");
3852
+ var BASE_TABS = [
3598
3853
  { key: "remix", label: "Remix", icon: "auto_fix_high" },
3599
3854
  { key: "blend", label: "Blend", icon: "merge" },
3600
3855
  { key: "compare", label: "Compare", icon: "compare" },
3601
3856
  { key: "loop", label: "Loop", icon: "loop" }
3602
3857
  ];
3603
- var LabsTab = ({ services, onResult }) => {
3604
- const [activeTab, setActiveTab] = (0, import_react20.useState)("remix");
3605
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex flex-col h-full overflow-hidden", children: [
3606
- /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "flex border-b border-white/5 shrink-0", children: TABS.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
3858
+ var FRAMES_TAB = { key: "frames", label: "Frames", icon: "crop_original" };
3859
+ var LabsTab = ({ services, onResult, videoItems, resolveVideoUrl }) => {
3860
+ const [activeTab, setActiveTab] = (0, import_react21.useState)("remix");
3861
+ const showFrames = !!(videoItems && resolveVideoUrl);
3862
+ const tabs = showFrames ? [...BASE_TABS, FRAMES_TAB] : BASE_TABS;
3863
+ return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex flex-col h-full overflow-hidden", children: [
3864
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "flex border-b border-white/5 shrink-0", children: tabs.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
3607
3865
  "button",
3608
3866
  {
3609
3867
  onClick: () => setActiveTab(tab.key),
3610
3868
  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"}`,
3611
3869
  children: [
3612
- /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: tab.icon }),
3870
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: tab.icon }),
3613
3871
  tab.label
3614
3872
  ]
3615
3873
  },
3616
3874
  tab.key
3617
3875
  )) }),
3618
- /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "flex-1 overflow-hidden", children: [
3619
- activeTab === "remix" && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LabRemix, { services, onResult }),
3620
- activeTab === "blend" && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LabBlend, { services, onResult }),
3621
- activeTab === "compare" && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LabCompare, { services, onResult }),
3622
- activeTab === "loop" && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(LabLoop, { services, onResult })
3876
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex-1 overflow-hidden", children: [
3877
+ activeTab === "remix" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LabRemix, { services, onResult }),
3878
+ activeTab === "blend" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LabBlend, { services, onResult }),
3879
+ activeTab === "compare" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LabCompare, { services, onResult }),
3880
+ activeTab === "loop" && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(LabLoop, { services, onResult }),
3881
+ activeTab === "frames" && showFrames && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
3882
+ LabFrameExtractor,
3883
+ {
3884
+ videoItems,
3885
+ onResult,
3886
+ resolveVideoUrl
3887
+ }
3888
+ )
3623
3889
  ] })
3624
3890
  ] });
3625
3891
  };
3626
3892
 
3627
3893
  // src/components/TagManagerPanel.tsx
3628
- var import_react21 = require("react");
3629
- var import_jsx_runtime19 = require("react/jsx-runtime");
3894
+ var import_react22 = require("react");
3895
+ var import_jsx_runtime20 = require("react/jsx-runtime");
3630
3896
  function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete, onTagReorder, onTagMove }) {
3631
3897
  const categories = Object.keys(workspaceTags.by_category).filter(
3632
3898
  (cat) => (workspaceTags.by_category[cat] || []).some((t) => !t.is_deleted)
3633
3899
  );
3634
- const [selectedCategory, setSelectedCategory] = (0, import_react21.useState)(categories[0] || "");
3900
+ const [selectedCategory, setSelectedCategory] = (0, import_react22.useState)(categories[0] || "");
3635
3901
  const effectiveCategory = categories.includes(selectedCategory) ? selectedCategory : categories[0] || "";
3636
- const [editingLabel, setEditingLabel] = (0, import_react21.useState)(null);
3637
- const [editState, setEditState] = (0, import_react21.useState)({ label: "", value: "" });
3638
- const [newTag, setNewTag] = (0, import_react21.useState)({ label: "", value: "" });
3639
- const [movingLabel, setMovingLabel] = (0, import_react21.useState)(null);
3640
- const [moveTarget, setMoveTarget] = (0, import_react21.useState)("");
3902
+ const [editingLabel, setEditingLabel] = (0, import_react22.useState)(null);
3903
+ const [editState, setEditState] = (0, import_react22.useState)({ label: "", value: "" });
3904
+ const [newTag, setNewTag] = (0, import_react22.useState)({ label: "", value: "" });
3905
+ const [movingLabel, setMovingLabel] = (0, import_react22.useState)(null);
3906
+ const [moveTarget, setMoveTarget] = (0, import_react22.useState)("");
3641
3907
  const tags = (workspaceTags.by_category[effectiveCategory] || []).filter((t) => !t.is_deleted);
3642
3908
  const otherCategories = categories.filter((c) => c !== effectiveCategory);
3643
3909
  const startEdit = (tag) => {
@@ -3680,10 +3946,10 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3680
3946
  if (!confirm(`Tag "${tag.label}" l\xF6schen?`)) return;
3681
3947
  onTagDelete(tag.label, effectiveCategory);
3682
3948
  };
3683
- return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex flex-col h-full overflow-hidden", children: [
3684
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "px-3 py-2 border-b border-white/5 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-[10px] font-bold uppercase tracking-widest text-white/40", children: "Tag Manager" }) }),
3685
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "px-3 py-2 shrink-0 overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-1.5 flex-nowrap", children: [
3686
- categories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
3949
+ return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col h-full overflow-hidden", children: [
3950
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "px-3 py-2 border-b border-white/5 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-[10px] font-bold uppercase tracking-widest text-white/40", children: "Tag Manager" }) }),
3951
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "px-3 py-2 shrink-0 overflow-x-auto", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex gap-1.5 flex-nowrap", children: [
3952
+ categories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
3687
3953
  "button",
3688
3954
  {
3689
3955
  onClick: () => {
@@ -3695,17 +3961,17 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3695
3961
  children: [
3696
3962
  cat,
3697
3963
  " ",
3698
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "ml-1 opacity-50", children: (workspaceTags.by_category[cat] || []).filter((t) => !t.is_deleted).length })
3964
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "ml-1 opacity-50", children: (workspaceTags.by_category[cat] || []).filter((t) => !t.is_deleted).length })
3699
3965
  ]
3700
3966
  },
3701
3967
  cat
3702
3968
  )),
3703
- categories.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "text-[10px] text-white/20", children: "Erst Workspace importieren" })
3969
+ categories.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "text-[10px] text-white/20", children: "Erst Workspace importieren" })
3704
3970
  ] }) }),
3705
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex-1 overflow-y-auto dark-scrollbar px-3 pb-2 space-y-1", children: [
3706
- tags.map((tag, i) => /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { children: [
3707
- editingLabel === tag.label ? /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "bg-white/5 border border-blue-600/40 rounded-lg p-2.5 space-y-1.5", children: [
3708
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
3971
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 overflow-y-auto dark-scrollbar px-3 pb-2 space-y-1", children: [
3972
+ tags.map((tag, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
3973
+ editingLabel === tag.label ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "bg-white/5 border border-blue-600/40 rounded-lg p-2.5 space-y-1.5", children: [
3974
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3709
3975
  "input",
3710
3976
  {
3711
3977
  value: editState.label,
@@ -3716,7 +3982,7 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3716
3982
  onKeyDown: (e) => e.key === "Enter" && saveEdit(tag.label)
3717
3983
  }
3718
3984
  ),
3719
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
3985
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3720
3986
  "textarea",
3721
3987
  {
3722
3988
  value: editState.value,
@@ -3726,24 +3992,24 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3726
3992
  placeholder: "Prompt-Wert (leer = Label)"
3727
3993
  }
3728
3994
  ),
3729
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-1.5 justify-end", children: [
3730
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("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" }),
3731
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("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" })
3995
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex gap-1.5 justify-end", children: [
3996
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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" }),
3997
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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" })
3732
3998
  ] })
3733
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("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: [
3734
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex flex-col gap-0 shrink-0", children: [
3735
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { onClick: () => handleMoveUp(i), disabled: i === 0, className: "text-white/20 hover:text-white/60 disabled:opacity-10 transition leading-none", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "arrow_drop_up" }) }),
3736
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("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__ */ (0, import_jsx_runtime19.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "arrow_drop_down" }) })
3999
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("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: [
4000
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex flex-col gap-0 shrink-0", children: [
4001
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => handleMoveUp(i), disabled: i === 0, className: "text-white/20 hover:text-white/60 disabled:opacity-10 transition leading-none", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "arrow_drop_up" }) }),
4002
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "arrow_drop_down" }) })
3737
4003
  ] }),
3738
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex-1 min-w-0", children: [
3739
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "text-[12px] text-white/80 font-medium truncate", children: tag.label }),
3740
- tag.value && tag.value !== tag.label && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "text-[10px] text-white/30 truncate", children: [
4004
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex-1 min-w-0", children: [
4005
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-[12px] text-white/80 font-medium truncate", children: tag.label }),
4006
+ tag.value && tag.value !== tag.label && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "text-[10px] text-white/30 truncate", children: [
3741
4007
  tag.value.slice(0, 60),
3742
4008
  tag.value.length > 60 ? "\u2026" : ""
3743
4009
  ] })
3744
4010
  ] }),
3745
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-1 opacity-0 group-hover:opacity-100 transition shrink-0", children: [
3746
- otherCategories.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
4011
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex gap-1 opacity-0 group-hover:opacity-100 transition shrink-0", children: [
4012
+ otherCategories.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3747
4013
  "button",
3748
4014
  {
3749
4015
  onClick: () => {
@@ -3753,29 +4019,29 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3753
4019
  },
3754
4020
  className: "p-1 rounded text-white/30 hover:text-purple-400 transition",
3755
4021
  title: "Kategorie wechseln",
3756
- children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "material-symbols-outlined text-[16px]", children: "drive_file_move" })
4022
+ children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[16px]", children: "drive_file_move" })
3757
4023
  }
3758
4024
  ),
3759
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { onClick: () => startEdit(tag), className: "p-1 rounded text-white/30 hover:text-blue-400 transition", title: "Bearbeiten", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "material-symbols-outlined text-[16px]", children: "edit" }) }),
3760
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("button", { onClick: () => handleDelete(tag), className: "p-1 rounded text-white/30 hover:text-red-400 transition", title: "L\xF6schen", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "material-symbols-outlined text-[16px]", children: "delete" }) })
4025
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => startEdit(tag), className: "p-1 rounded text-white/30 hover:text-blue-400 transition", title: "Bearbeiten", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[16px]", children: "edit" }) }),
4026
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: () => handleDelete(tag), className: "p-1 rounded text-white/30 hover:text-red-400 transition", title: "L\xF6schen", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[16px]", children: "delete" }) })
3761
4027
  ] })
3762
4028
  ] }),
3763
- movingLabel === tag.label && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "mt-1 bg-purple-900/20 border border-purple-700/30 rounded-lg p-2.5 space-y-1.5", children: [
3764
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "text-[9px] font-bold uppercase tracking-widest text-purple-400/70", children: "Verschieben nach Kategorie" }),
3765
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
4029
+ movingLabel === tag.label && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "mt-1 bg-purple-900/20 border border-purple-700/30 rounded-lg p-2.5 space-y-1.5", children: [
4030
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-[9px] font-bold uppercase tracking-widest text-purple-400/70", children: "Verschieben nach Kategorie" }),
4031
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
3766
4032
  "select",
3767
4033
  {
3768
4034
  value: moveTarget,
3769
4035
  onChange: (e) => setMoveTarget(e.target.value),
3770
4036
  className: "w-full bg-black/40 border border-white/10 rounded px-2 py-1 text-[11px] text-white/70 outline-none",
3771
4037
  children: [
3772
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("option", { value: "", children: "\u2014 Kategorie w\xE4hlen \u2014" }),
3773
- otherCategories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("option", { value: cat, children: cat }, cat))
4038
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("option", { value: "", children: "\u2014 Kategorie w\xE4hlen \u2014" }),
4039
+ otherCategories.map((cat) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("option", { value: cat, children: cat }, cat))
3774
4040
  ]
3775
4041
  }
3776
4042
  ),
3777
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "flex gap-1.5 justify-end", children: [
3778
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
4043
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "flex gap-1.5 justify-end", children: [
4044
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3779
4045
  "button",
3780
4046
  {
3781
4047
  onClick: () => handleMove(tag),
@@ -3784,19 +4050,19 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3784
4050
  children: "VERSCHIEBEN"
3785
4051
  }
3786
4052
  ),
3787
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("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" })
4053
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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" })
3788
4054
  ] })
3789
4055
  ] })
3790
4056
  ] }, `${effectiveCategory}-${i}`)),
3791
- tags.length === 0 && effectiveCategory && /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: "text-center text-[11px] text-white/20 py-6", children: "Keine Tags in dieser Kategorie." })
4057
+ tags.length === 0 && effectiveCategory && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "text-center text-[11px] text-white/20 py-6", children: "Keine Tags in dieser Kategorie." })
3792
4058
  ] }),
3793
- effectiveCategory && /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "px-3 py-2 border-t border-white/5 shrink-0 space-y-1.5", children: [
3794
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "text-[9px] font-bold uppercase tracking-widest text-white/30", children: [
4059
+ effectiveCategory && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "px-3 py-2 border-t border-white/5 shrink-0 space-y-1.5", children: [
4060
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "text-[9px] font-bold uppercase tracking-widest text-white/30", children: [
3795
4061
  "Neuer Tag in \u201E",
3796
4062
  effectiveCategory,
3797
4063
  '"'
3798
4064
  ] }),
3799
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
4065
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3800
4066
  "input",
3801
4067
  {
3802
4068
  value: newTag.label,
@@ -3806,7 +4072,7 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3806
4072
  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"
3807
4073
  }
3808
4074
  ),
3809
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
4075
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
3810
4076
  "textarea",
3811
4077
  {
3812
4078
  value: newTag.value,
@@ -3816,14 +4082,14 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3816
4082
  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"
3817
4083
  }
3818
4084
  ),
3819
- /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
4085
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
3820
4086
  "button",
3821
4087
  {
3822
4088
  onClick: handleCreate,
3823
4089
  disabled: !newTag.label.trim(),
3824
4090
  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",
3825
4091
  children: [
3826
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "add" }),
4092
+ /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "add" }),
3827
4093
  "TAG ERSTELLEN"
3828
4094
  ]
3829
4095
  }
@@ -3833,8 +4099,8 @@ function TagManagerPanel({ workspaceTags, onTagCreate, onTagUpdate, onTagDelete,
3833
4099
  }
3834
4100
 
3835
4101
  // src/components/HFTestTab.tsx
3836
- var import_react22 = require("react");
3837
- var import_jsx_runtime20 = require("react/jsx-runtime");
4102
+ var import_react23 = require("react");
4103
+ var import_jsx_runtime21 = require("react/jsx-runtime");
3838
4104
  var HF_BASE2 = "https://huggingface.co";
3839
4105
  var HF_REPO2 = "RolandSch/fa-app-state";
3840
4106
  var TEST_DIR = "test";
@@ -4026,8 +4292,8 @@ function tryFmt(s) {
4026
4292
  }
4027
4293
  }
4028
4294
  function CopyBtn({ text }) {
4029
- const [done, setDone] = (0, import_react22.useState)(false);
4030
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
4295
+ const [done, setDone] = (0, import_react23.useState)(false);
4296
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
4031
4297
  "button",
4032
4298
  {
4033
4299
  onClick: () => {
@@ -4038,7 +4304,7 @@ function CopyBtn({ text }) {
4038
4304
  },
4039
4305
  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 },
4040
4306
  children: [
4041
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: done ? "check" : "content_copy" }),
4307
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: done ? "check" : "content_copy" }),
4042
4308
  done ? "Kopiert" : "Copy"
4043
4309
  ]
4044
4310
  }
@@ -4046,35 +4312,35 @@ function CopyBtn({ text }) {
4046
4312
  }
4047
4313
  function StepView({ step }) {
4048
4314
  const isSpecial = step.method === "-" || step.method === "import()" || step.method === "import()+call";
4049
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("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: [
4050
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 4 }, children: [
4051
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { style: { fontSize: 11, fontWeight: 700, color: step.ok === false ? "#f87171" : "#4ade80" }, children: step.ok === false ? "\u2717" : "\u2713" }),
4052
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { style: { fontSize: 11, fontWeight: 600, color: "rgba(255,255,255,0.7)", flex: 1 }, children: step.label }),
4053
- step.durationMs !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)" }, children: [
4315
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
4316
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 4 }, children: [
4317
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { style: { fontSize: 11, fontWeight: 700, color: step.ok === false ? "#f87171" : "#4ade80" }, children: step.ok === false ? "\u2717" : "\u2713" }),
4318
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { style: { fontSize: 11, fontWeight: 600, color: "rgba(255,255,255,0.7)", flex: 1 }, children: step.label }),
4319
+ step.durationMs !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)" }, children: [
4054
4320
  step.durationMs,
4055
4321
  "ms"
4056
4322
  ] }),
4057
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CopyBtn, { text: JSON.stringify(step, null, 2) })
4323
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CopyBtn, { text: JSON.stringify(step, null, 2) })
4058
4324
  ] }),
4059
- !isSpecial && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { marginBottom: 5 }, children: [
4060
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.25)", marginBottom: 2 }, children: [
4325
+ !isSpecial && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { marginBottom: 5 }, children: [
4326
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.25)", marginBottom: 2 }, children: [
4061
4327
  "\u2192 ",
4062
4328
  step.method,
4063
4329
  " ",
4064
4330
  step.url
4065
4331
  ] }),
4066
- Object.keys(step.reqHeaders).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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") }),
4067
- step.reqBody && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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 })
4332
+ Object.keys(step.reqHeaders).length > 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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") }),
4333
+ step.reqBody && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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 })
4068
4334
  ] }),
4069
- step.error && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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 }),
4070
- !step.error && (step.resStatus !== void 0 || step.resBody) && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { children: [
4071
- step.resStatus !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { fontSize: 11, fontWeight: 700, color: (step.resStatus || 0) < 300 ? "#4ade80" : "#f87171", marginBottom: 3 }, children: [
4335
+ step.error && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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 }),
4336
+ !step.error && (step.resStatus !== void 0 || step.resBody) && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
4337
+ step.resStatus !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { fontSize: 11, fontWeight: 700, color: (step.resStatus || 0) < 300 ? "#4ade80" : "#f87171", marginBottom: 3 }, children: [
4072
4338
  "\u2190 ",
4073
4339
  step.resStatus,
4074
4340
  " ",
4075
4341
  step.resStatusText
4076
4342
  ] }),
4077
- step.resBody && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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) })
4343
+ step.resBody && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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) })
4078
4344
  ] })
4079
4345
  ] });
4080
4346
  }
@@ -4090,15 +4356,15 @@ function TestCard({
4090
4356
  onToggle
4091
4357
  }) {
4092
4358
  const hasResult = state && state.status !== "idle";
4093
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("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: [
4094
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8, padding: "9px 10px" }, children: [
4095
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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 }),
4096
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
4097
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontSize: 13, fontWeight: 700, color: "#fff" }, children: label }),
4098
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: desc })
4359
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
4360
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 8, padding: "9px 10px" }, children: [
4361
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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 }),
4362
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
4363
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { fontSize: 13, fontWeight: 700, color: "#fff" }, children: label }),
4364
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: desc })
4099
4365
  ] }),
4100
- hasResult && state?.status !== "running" && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("button", { onClick: onToggle, style: { background: "none", border: "none", color: "rgba(255,255,255,0.3)", cursor: "pointer", padding: 2, lineHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: expanded ? "expand_less" : "expand_more" }) }),
4101
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4366
+ hasResult && state?.status !== "running" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: onToggle, style: { background: "none", border: "none", color: "rgba(255,255,255,0.3)", cursor: "pointer", padding: 2, lineHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: expanded ? "expand_less" : "expand_more" }) }),
4367
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4102
4368
  "button",
4103
4369
  {
4104
4370
  onClick: onRun,
@@ -4108,20 +4374,20 @@ function TestCard({
4108
4374
  }
4109
4375
  )
4110
4376
  ] }),
4111
- hasResult && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { borderTop: "1px solid rgba(255,255,255,0.05)" }, children: [
4112
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { padding: "4px 10px 5px", display: "flex", alignItems: "center", gap: 8 }, children: [
4113
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { style: { fontSize: 11, fontWeight: 700, color: state.status === "ok" ? "#4ade80" : "#f87171" }, children: state.status === "ok" ? "\u2713 OK" : state.status === "running" ? "\u2026" : "\u2717 Fehler" }),
4114
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)" }, children: [
4377
+ hasResult && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { borderTop: "1px solid rgba(255,255,255,0.05)" }, children: [
4378
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { padding: "4px 10px 5px", display: "flex", alignItems: "center", gap: 8 }, children: [
4379
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { style: { fontSize: 11, fontWeight: 700, color: state.status === "ok" ? "#4ade80" : "#f87171" }, children: state.status === "ok" ? "\u2713 OK" : state.status === "running" ? "\u2026" : "\u2717 Fehler" }),
4380
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)" }, children: [
4115
4381
  state.totalMs,
4116
4382
  "ms \xB7 ",
4117
4383
  state.steps.length,
4118
4384
  " Step",
4119
4385
  state.steps.length !== 1 ? "s" : ""
4120
4386
  ] }),
4121
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { flex: 1 } }),
4122
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(CopyBtn, { text: JSON.stringify(state, null, 2) })
4387
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { flex: 1 } }),
4388
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CopyBtn, { text: JSON.stringify(state, null, 2) })
4123
4389
  ] }),
4124
- expanded && state.steps.map((step, i) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { padding: "0 10px 4px" }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(StepView, { step }) }, i))
4390
+ expanded && state.steps.map((step, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { padding: "0 10px 4px" }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(StepView, { step }) }, i))
4125
4391
  ] })
4126
4392
  ] });
4127
4393
  }
@@ -4133,10 +4399,10 @@ var EVENT_TYPE_COLORS = {
4133
4399
  };
4134
4400
  function EventMonitor({ events, confirmedEventKeys, galleryItems, imageUploadStatus }) {
4135
4401
  if (!events.length) {
4136
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { padding: "12px 14px", fontSize: 12, color: "rgba(255,255,255,0.3)", fontStyle: "italic" }, children: "Noch keine Events geladen." });
4402
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { padding: "12px 14px", fontSize: 12, color: "rgba(255,255,255,0.3)", fontStyle: "italic" }, children: "Noch keine Events geladen." });
4137
4403
  }
4138
4404
  const sorted = [...events].sort((a, b) => b.ts - a.ts).slice(0, 30);
4139
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { padding: "6px 8px 4px" }, children: [
4405
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { padding: "6px 8px 4px" }, children: [
4140
4406
  sorted.map((e, i) => {
4141
4407
  const eKey = `${e.ts}_${e.clientId}`;
4142
4408
  const isConfirmed = confirmedEventKeys.has(eKey);
@@ -4149,47 +4415,47 @@ function EventMonitor({ events, confirmedEventKeys, galleryItems, imageUploadSta
4149
4415
  const uploadStatus = imgId ? imageUploadStatus.get(imgId) : void 0;
4150
4416
  const payloadStr = JSON.stringify(e.payload ?? {});
4151
4417
  const payloadPreview = payloadStr.length > 70 ? payloadStr.slice(0, 70) + "\u2026" : payloadStr;
4152
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", gap: 7, alignItems: "flex-start", padding: "6px 2px", borderBottom: "1px solid rgba(255,255,255,0.05)" }, children: [
4153
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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__ */ (0, import_jsx_runtime20.jsx)("img", { src: galleryItem.base64, style: { width: "100%", height: "100%", objectFit: "cover" } }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18, color: "rgba(255,255,255,0.2)" }, children: "image" }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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" }) }),
4154
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
4155
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3 }, children: [
4156
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { style: { fontSize: 11, fontWeight: 700, color: typeColor }, children: e.type }),
4157
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { style: { fontSize: 9, color: "rgba(255,255,255,0.25)", fontVariantNumeric: "tabular-nums" }, children: timeStr }),
4158
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { flex: 1 } }),
4159
- isConfirmed ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 9, fontWeight: 700, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
4160
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "check_circle" }),
4418
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", gap: 7, alignItems: "flex-start", padding: "6px 2px", borderBottom: "1px solid rgba(255,255,255,0.05)" }, children: [
4419
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("img", { src: galleryItem.base64, style: { width: "100%", height: "100%", objectFit: "cover" } }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18, color: "rgba(255,255,255,0.2)" }, children: "image" }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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" }) }),
4420
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
4421
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3 }, children: [
4422
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { style: { fontSize: 11, fontWeight: 700, color: typeColor }, children: e.type }),
4423
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { style: { fontSize: 9, color: "rgba(255,255,255,0.25)", fontVariantNumeric: "tabular-nums" }, children: timeStr }),
4424
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { flex: 1 } }),
4425
+ isConfirmed ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 9, fontWeight: 700, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
4426
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "check_circle" }),
4161
4427
  "HF"
4162
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 9, fontWeight: 700, color: "#fbbf24", display: "flex", alignItems: "center", gap: 2 }, children: [
4163
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "schedule" }),
4428
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 9, fontWeight: 700, color: "#fbbf24", display: "flex", alignItems: "center", gap: 2 }, children: [
4429
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "schedule" }),
4164
4430
  "lokal"
4165
4431
  ] })
4166
4432
  ] }),
4167
- isImageEvent && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3, flexWrap: "wrap" }, children: [
4168
- uploadStatus === "done" && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 9, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
4169
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_done" }),
4433
+ isImageEvent && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", alignItems: "center", gap: 6, marginBottom: 3, flexWrap: "wrap" }, children: [
4434
+ uploadStatus === "done" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 9, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
4435
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_done" }),
4170
4436
  "Upload \u2713"
4171
4437
  ] }),
4172
- uploadStatus === "uploading" && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 9, color: "#60a5fa", display: "flex", alignItems: "center", gap: 2 }, children: [
4173
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_upload" }),
4438
+ uploadStatus === "uploading" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 9, color: "#60a5fa", display: "flex", alignItems: "center", gap: 2 }, children: [
4439
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_upload" }),
4174
4440
  "l\xE4dt hoch\u2026"
4175
4441
  ] }),
4176
- uploadStatus === "failed" && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 9, color: "#f87171", display: "flex", alignItems: "center", gap: 2 }, children: [
4177
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_off" }),
4442
+ uploadStatus === "failed" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 9, color: "#f87171", display: "flex", alignItems: "center", gap: 2 }, children: [
4443
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "cloud_off" }),
4178
4444
  "Upload fehlgeschlagen"
4179
4445
  ] }),
4180
- galleryItem?.base64 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 9, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
4181
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "photo" }),
4446
+ galleryItem?.base64 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 9, color: "#4ade80", display: "flex", alignItems: "center", gap: 2 }, children: [
4447
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "photo" }),
4182
4448
  uploadStatus ? "lokal" : "von HF geladen"
4183
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("span", { style: { fontSize: 9, color: "#f87171", display: "flex", alignItems: "center", gap: 2 }, children: [
4184
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "broken_image" }),
4449
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { style: { fontSize: 9, color: "#f87171", display: "flex", alignItems: "center", gap: 2 }, children: [
4450
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 11 }, children: "broken_image" }),
4185
4451
  uploadStatus === "failed" ? "Binary nicht auf HF" : "wird geladen\u2026"
4186
4452
  ] })
4187
4453
  ] }),
4188
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontSize: 9, color: "rgba(255,255,255,0.25)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: payloadPreview })
4454
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { fontSize: 9, color: "rgba(255,255,255,0.25)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: payloadPreview })
4189
4455
  ] })
4190
4456
  ] }, `${eKey}_${i}`);
4191
4457
  }),
4192
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { padding: "6px 0 2px", fontSize: 9, color: "rgba(255,255,255,0.2)", textAlign: "right" }, children: [
4458
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { padding: "6px 0 2px", fontSize: 9, color: "rgba(255,255,255,0.2)", textAlign: "right" }, children: [
4193
4459
  events.length,
4194
4460
  " Events gesamt \xB7 ",
4195
4461
  [...confirmedEventKeys].length,
@@ -4198,9 +4464,9 @@ function EventMonitor({ events, confirmedEventKeys, galleryItems, imageUploadSta
4198
4464
  ] });
4199
4465
  }
4200
4466
  function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEventKeys = /* @__PURE__ */ new Set(), imageUploadStatus = /* @__PURE__ */ new Map() }) {
4201
- const [selected, setSelected] = (0, import_react22.useState)(null);
4202
- const [results, setResults] = (0, import_react22.useState)({});
4203
- const [expanded, setExpanded] = (0, import_react22.useState)({});
4467
+ const [selected, setSelected] = (0, import_react23.useState)(null);
4468
+ const [results, setResults] = (0, import_react23.useState)({});
4469
+ const [expanded, setExpanded] = (0, import_react23.useState)({});
4204
4470
  const withResults = galleryItems.filter((g) => g.base64 && g.status === "done");
4205
4471
  const setRunning = (id) => setResults((r) => ({ ...r, [id]: { status: "running", steps: [], totalMs: 0 } }));
4206
4472
  const setDone = (id, steps, t0) => {
@@ -4248,15 +4514,15 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
4248
4514
  { id: "img-hub", label: "Upload hub lib", icon: "package_2", desc: "uploadFile() via @huggingface/hub" },
4249
4515
  { id: "img-cdn", label: "Upload CDN lib", icon: "language", desc: "uploadFile() via esm.sh hub lib" }
4250
4516
  ];
4251
- return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { display: "flex", flexDirection: "column", height: "100%", overflowY: "auto", padding: "12px 10px 80px", boxSizing: "border-box", fontFamily: "inherit" }, children: [
4252
- noToken && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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." }),
4253
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { marginBottom: 12 }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4517
+ return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", flexDirection: "column", height: "100%", overflowY: "auto", padding: "12px 10px 80px", boxSizing: "border-box", fontFamily: "inherit" }, children: [
4518
+ noToken && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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." }),
4519
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { marginBottom: 12 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4254
4520
  CollapsibleCard,
4255
4521
  {
4256
4522
  title: "Event Monitor",
4257
- icon: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "bolt" }),
4523
+ icon: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "bolt" }),
4258
4524
  defaultOpen: true,
4259
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4525
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4260
4526
  EventMonitor,
4261
4527
  {
4262
4528
  events: allEvents,
@@ -4267,25 +4533,25 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
4267
4533
  )
4268
4534
  }
4269
4535
  ) }),
4270
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4536
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4271
4537
  CollapsibleCard,
4272
4538
  {
4273
4539
  title: "Upload Tests",
4274
- icon: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "science" }),
4540
+ icon: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "science" }),
4275
4541
  defaultOpen: false,
4276
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { padding: "10px 10px 4px" }, children: [
4277
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { marginBottom: 14 }, children: [
4278
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { fontSize: 10, fontWeight: 700, color: "rgba(255,255,255,0.3)", textTransform: "uppercase", letterSpacing: "0.08em", marginBottom: 8 }, children: [
4542
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { padding: "10px 10px 4px" }, children: [
4543
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { marginBottom: 14 }, children: [
4544
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { fontSize: 10, fontWeight: 700, color: "rgba(255,255,255,0.3)", textTransform: "uppercase", letterSpacing: "0.08em", marginBottom: 8 }, children: [
4279
4545
  "Bild ausw\xE4hlen (",
4280
4546
  withResults.length,
4281
4547
  " verf\xFCgbar)"
4282
4548
  ] }),
4283
- withResults.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("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__ */ (0, import_jsx_runtime20.jsx)("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 6 }, children: withResults.slice(0, 12).map((g) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4549
+ withResults.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("div", { style: { display: "grid", gridTemplateColumns: "repeat(4, 1fr)", gap: 6 }, children: withResults.slice(0, 12).map((g) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4284
4550
  "button",
4285
4551
  {
4286
4552
  onClick: () => setSelected(g),
4287
4553
  style: { padding: 0, border: `2px solid ${selected?.id === g.id ? "#0284c7" : "transparent"}`, borderRadius: 6, cursor: "pointer", overflow: "hidden", background: "none", lineHeight: 0 },
4288
- children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4554
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4289
4555
  "img",
4290
4556
  {
4291
4557
  src: g.base64,
@@ -4296,38 +4562,38 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
4296
4562
  },
4297
4563
  g.id
4298
4564
  )) }),
4299
- selected && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { marginTop: 10, display: "flex", gap: 10, alignItems: "flex-start" }, children: [
4300
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4565
+ selected && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { marginTop: 10, display: "flex", gap: 10, alignItems: "flex-start" }, children: [
4566
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4301
4567
  "img",
4302
4568
  {
4303
4569
  src: selected.base64,
4304
4570
  style: { width: 80, height: 80, objectFit: "cover", borderRadius: 8, border: "1px solid rgba(255,255,255,0.1)", flexShrink: 0 }
4305
4571
  }
4306
4572
  ),
4307
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
4308
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontSize: 11, fontWeight: 700, color: "rgba(255,255,255,0.7)", marginBottom: 2 }, children: "Ausgew\xE4hlt" }),
4309
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", wordBreak: "break-all" }, children: [
4573
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { flex: 1, minWidth: 0 }, children: [
4574
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { fontSize: 11, fontWeight: 700, color: "rgba(255,255,255,0.7)", marginBottom: 2 }, children: "Ausgew\xE4hlt" }),
4575
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", wordBreak: "break-all" }, children: [
4310
4576
  "ID: ",
4311
4577
  selected.id
4312
4578
  ] }),
4313
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", marginTop: 2 }, children: [
4579
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.3)", overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap", marginTop: 2 }, children: [
4314
4580
  "Ziel: test/",
4315
4581
  selected.id,
4316
4582
  ".jpg"
4317
4583
  ] }),
4318
- selected.prompt && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.25)", marginTop: 2, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: selected.prompt })
4584
+ selected.prompt && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { fontSize: 10, color: "rgba(255,255,255,0.25)", marginTop: 2, overflow: "hidden", textOverflow: "ellipsis", whiteSpace: "nowrap" }, children: selected.prompt })
4319
4585
  ] })
4320
4586
  ] })
4321
4587
  ] }),
4322
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { marginBottom: 14 }, children: [
4323
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("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: [
4588
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { marginBottom: 14 }, children: [
4589
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
4324
4590
  "Bild hochladen \u2192 test/",
4325
4591
  "{",
4326
4592
  "id",
4327
4593
  "}",
4328
4594
  ".jpg"
4329
4595
  ] }),
4330
- imgTests.map((t) => /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4596
+ imgTests.map((t) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4331
4597
  TestCard,
4332
4598
  {
4333
4599
  id: t.id,
@@ -4343,13 +4609,13 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
4343
4609
  t.id
4344
4610
  ))
4345
4611
  ] }),
4346
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { style: { marginBottom: 4 }, children: [
4347
- /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("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: [
4612
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { marginBottom: 4 }, children: [
4613
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
4348
4614
  "Event schreiben \u2192 ",
4349
4615
  namespace || "(kein namespace)",
4350
4616
  "test/events/"
4351
4617
  ] }),
4352
- /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
4618
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4353
4619
  TestCard,
4354
4620
  {
4355
4621
  id: "event",
@@ -4371,9 +4637,9 @@ function HFTestTab({ token, namespace, galleryItems, allEvents = [], confirmedEv
4371
4637
  }
4372
4638
 
4373
4639
  // src/components/AvatarArchitectApp.tsx
4374
- var import_jsx_runtime21 = require("react/jsx-runtime");
4640
+ var import_jsx_runtime22 = require("react/jsx-runtime");
4375
4641
  function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onSelectMedia, buildInfo, initialHfToken, hfNamespace, allowDevNamespace, onFetchServerProjects, onServerSave, onServerLoad, onServerDelete }) {
4376
- (0, import_react23.useEffect)(() => {
4642
+ (0, import_react24.useEffect)(() => {
4377
4643
  const id = "flow-styles";
4378
4644
  if (!document.getElementById(id)) {
4379
4645
  const style = document.createElement("style");
@@ -4382,19 +4648,19 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4382
4648
  document.head.appendChild(style);
4383
4649
  }
4384
4650
  }, []);
4385
- const [showStart, setShowStart] = (0, import_react23.useState)(true);
4386
- const [layoutChoice, setLayoutChoice] = (0, import_react23.useState)(() => {
4651
+ const [showStart, setShowStart] = (0, import_react24.useState)(true);
4652
+ const [layoutChoice, setLayoutChoice] = (0, import_react24.useState)(() => {
4387
4653
  try {
4388
4654
  return localStorage.getItem("aa-layout") || null;
4389
4655
  } catch {
4390
4656
  return null;
4391
4657
  }
4392
4658
  });
4393
- const [projectLoaded, setProjectLoaded] = (0, import_react23.useState)(false);
4394
- const [hfToken, setHfToken] = (0, import_react23.useState)(initialHfToken || "");
4395
- const [hfTokenInput, setHfTokenInput] = (0, import_react23.useState)(initialHfToken || "");
4396
- const [isLoadingFromHF, setIsLoadingFromHF] = (0, import_react23.useState)(false);
4397
- const [hfNamespaceLocal, setHfNamespaceLocal] = (0, import_react23.useState)(() => {
4659
+ const [projectLoaded, setProjectLoaded] = (0, import_react24.useState)(false);
4660
+ const [hfToken, setHfToken] = (0, import_react24.useState)(initialHfToken || "");
4661
+ const [hfTokenInput, setHfTokenInput] = (0, import_react24.useState)(initialHfToken || "");
4662
+ const [isLoadingFromHF, setIsLoadingFromHF] = (0, import_react24.useState)(false);
4663
+ const [hfNamespaceLocal, setHfNamespaceLocal] = (0, import_react24.useState)(() => {
4398
4664
  try {
4399
4665
  const stored = localStorage.getItem("aa-hf-namespace");
4400
4666
  if (stored !== null) return stored;
@@ -4403,8 +4669,8 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4403
4669
  return "";
4404
4670
  }
4405
4671
  });
4406
- const [hfNamespaceFromServer, setHfNamespaceFromServer] = (0, import_react23.useState)(null);
4407
- (0, import_react23.useEffect)(() => {
4672
+ const [hfNamespaceFromServer, setHfNamespaceFromServer] = (0, import_react24.useState)(null);
4673
+ (0, import_react24.useEffect)(() => {
4408
4674
  if (hfNamespace !== void 0) return;
4409
4675
  const backendUrl = typeof window !== "undefined" ? window.BACKEND_URL || window.location.origin : null;
4410
4676
  if (!backendUrl) return;
@@ -4426,35 +4692,35 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4426
4692
  refresh: refreshHF,
4427
4693
  hasStateZip
4428
4694
  } = useHFState(hfToken, effectiveNamespace);
4429
- const [imageUploadStatus, setImageUploadStatus] = (0, import_react23.useState)(/* @__PURE__ */ new Map());
4430
- const [bootstrapLog, setBootstrapLog] = (0, import_react23.useState)([]);
4431
- const [isBootstrapping, setIsBootstrapping] = (0, import_react23.useState)(false);
4432
- const syncTopSlot = /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
4433
- localOnlyCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
4695
+ const [imageUploadStatus, setImageUploadStatus] = (0, import_react24.useState)(/* @__PURE__ */ new Map());
4696
+ const [bootstrapLog, setBootstrapLog] = (0, import_react24.useState)([]);
4697
+ const [isBootstrapping, setIsBootstrapping] = (0, import_react24.useState)(false);
4698
+ const syncTopSlot = /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
4699
+ localOnlyCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
4434
4700
  "\u26A0 ",
4435
4701
  localOnlyCount,
4436
4702
  " lokale Event",
4437
4703
  localOnlyCount > 1 ? "s" : "",
4438
4704
  " noch nicht auf HF best\xE4tigt"
4439
4705
  ] }),
4440
- pendingBufferCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { background: "linear-gradient(90deg,#f59e0b,#ef4444)", padding: "4px 10px", fontSize: 11, color: "#fff", borderRadius: 4, marginBottom: 4 }, children: [
4706
+ pendingBufferCount > 0 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { background: "linear-gradient(90deg,#f59e0b,#ef4444)", padding: "4px 10px", fontSize: 11, color: "#fff", borderRadius: 4, marginBottom: 4 }, children: [
4441
4707
  pendingBufferCount,
4442
4708
  " \xC4nderung",
4443
4709
  pendingBufferCount > 1 ? "en" : "",
4444
4710
  " lokal \u2014 bei Flow-Reload verloren wenn nicht synchronisiert"
4445
4711
  ] }),
4446
- eventCount > 100 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { background: "#dc2626", color: "#fff", padding: "5px 10px", borderRadius: 4, marginBottom: 4, fontWeight: 600, fontSize: 11 }, children: [
4712
+ eventCount > 100 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { background: "#dc2626", color: "#fff", padding: "5px 10px", borderRadius: 4, marginBottom: 4, fontWeight: 600, fontSize: 11 }, children: [
4447
4713
  "\u26A0 ",
4448
4714
  eventCount,
4449
4715
  " Events nicht konsolidiert \u2014 Konsolidierung dringend empfohlen"
4450
4716
  ] }),
4451
- eventCount > 50 && eventCount <= 100 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { background: "#44403c", color: "#a8a29e", padding: "4px 10px", borderRadius: 4, marginBottom: 4, fontSize: 11 }, children: [
4717
+ eventCount > 50 && eventCount <= 100 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { background: "#44403c", color: "#a8a29e", padding: "4px 10px", borderRadius: 4, marginBottom: 4, fontSize: 11 }, children: [
4452
4718
  eventCount,
4453
4719
  " Events seit letzter Konsolidierung \u2014 Konsolidierung empfohlen"
4454
4720
  ] }),
4455
- hfToken && !hasStateZip && !isHfRefreshing && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { background: "#1c1917", border: "1px solid #44403c", borderRadius: 6, padding: "10px 12px" }, children: [
4456
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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" }),
4457
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
4721
+ hfToken && !hasStateZip && !isHfRefreshing && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { background: "#1c1917", border: "1px solid #44403c", borderRadius: 6, padding: "10px 12px" }, children: [
4722
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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" }),
4723
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
4458
4724
  "button",
4459
4725
  {
4460
4726
  disabled: isBootstrapping || !effectiveNamespace,
@@ -4475,10 +4741,10 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4475
4741
  children: isBootstrapping ? "Migriere\u2026" : "Legacy-Migration starten"
4476
4742
  }
4477
4743
  ),
4478
- bootstrapLog.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { marginTop: 6, fontFamily: "monospace", fontSize: 10, color: "#78716c", lineHeight: 1.6 }, children: bootstrapLog.map((l, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { children: l }, i)) })
4744
+ bootstrapLog.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { marginTop: 6, fontFamily: "monospace", fontSize: 10, color: "#78716c", lineHeight: 1.6 }, children: bootstrapLog.map((l, i) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { children: l }, i)) })
4479
4745
  ] })
4480
4746
  ] });
4481
- const wsInputRef = (0, import_react23.useRef)(null);
4747
+ const wsInputRef = (0, import_react24.useRef)(null);
4482
4748
  const startApp = (choice) => {
4483
4749
  try {
4484
4750
  localStorage.setItem("aa-layout", choice);
@@ -4487,16 +4753,16 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4487
4753
  setLayoutChoice(choice);
4488
4754
  setShowStart(false);
4489
4755
  };
4490
- const [nodes, setNodes] = (0, import_react23.useState)([{ id: "1", type: "custom", position: { x: 0, y: 0 }, data: { label: "Fine Art Project", placeholder: "Name..." } }]);
4491
- const [edges, setEdges] = (0, import_react23.useState)([]);
4492
- const [history, setHistory] = (0, import_react23.useState)([]);
4493
- const [galleryItems, setGalleryItems] = (0, import_react23.useState)([]);
4494
- const galleryItemsRef = (0, import_react23.useRef)([]);
4495
- (0, import_react23.useEffect)(() => {
4756
+ const [nodes, setNodes] = (0, import_react24.useState)([{ id: "1", type: "custom", position: { x: 0, y: 0 }, data: { label: "Fine Art Project", placeholder: "Name..." } }]);
4757
+ const [edges, setEdges] = (0, import_react24.useState)([]);
4758
+ const [history, setHistory] = (0, import_react24.useState)([]);
4759
+ const [galleryItems, setGalleryItems] = (0, import_react24.useState)([]);
4760
+ const galleryItemsRef = (0, import_react24.useRef)([]);
4761
+ (0, import_react24.useEffect)(() => {
4496
4762
  galleryItemsRef.current = galleryItems;
4497
4763
  }, [galleryItems]);
4498
- const hfImageNotFoundRef = (0, import_react23.useRef)(/* @__PURE__ */ new Map());
4499
- (0, import_react23.useEffect)(() => {
4764
+ const hfImageNotFoundRef = (0, import_react24.useRef)(/* @__PURE__ */ new Map());
4765
+ (0, import_react24.useEffect)(() => {
4500
4766
  if (!hfState) return;
4501
4767
  if (hfState.tags?.by_category) setWorkspaceTags(hfState.tags);
4502
4768
  const hfIds = new Set(hfState.metadata.map((m) => m.id));
@@ -4538,62 +4804,62 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4538
4804
  });
4539
4805
  }
4540
4806
  }, [hfState]);
4541
- const [activePrompt, setActivePrompt] = (0, import_react23.useState)("");
4542
- const [isSynthesizing, setIsSynthesizing] = (0, import_react23.useState)(false);
4543
- const [activeGenerationsCount, setActiveGenerationsCount] = (0, import_react23.useState)(0);
4544
- const [currentResult, setCurrentResult] = (0, import_react23.useState)(null);
4545
- const [focusedNodeId, setFocusedNodeId] = (0, import_react23.useState)(null);
4546
- const [leftTab, setLeftTab] = (0, import_react23.useState)("prompt");
4547
- const [promptFeedback, setPromptFeedback] = (0, import_react23.useState)(null);
4548
- const [lastPromptPayload, setLastPromptPayload] = (0, import_react23.useState)(null);
4549
- const [isPromptTabGenerating, setIsPromptTabGenerating] = (0, import_react23.useState)(false);
4550
- const [activeTab, setActiveTab] = (0, import_react23.useState)("history");
4551
- const [mobileTab, setMobileTab] = (0, import_react23.useState)("stage");
4552
- const [middlePanel, setMiddlePanel] = (0, import_react23.useState)("stage");
4553
- const [recentLabItems, setRecentLabItems] = (0, import_react23.useState)([]);
4554
- const [aspectRatio, setAspectRatio] = (0, import_react23.useState)("1:1");
4555
- const [selectedModel, setSelectedModel] = (0, import_react23.useState)("\u{1F34C} Nano Banana Pro");
4556
- const [seed, setSeed] = (0, import_react23.useState)(Math.floor(Math.random() * 1e6));
4557
- const [seedMode, setSeedMode] = (0, import_react23.useState)("random");
4558
- const [isLeftCollapsed, setIsLeftCollapsed] = (0, import_react23.useState)(false);
4559
- const [isRightCollapsed, setIsRightCollapsed] = (0, import_react23.useState)(false);
4560
- const [leftPanelWidth, setLeftPanelWidth] = (0, import_react23.useState)(() => {
4807
+ const [activePrompt, setActivePrompt] = (0, import_react24.useState)("");
4808
+ const [isSynthesizing, setIsSynthesizing] = (0, import_react24.useState)(false);
4809
+ const [activeGenerationsCount, setActiveGenerationsCount] = (0, import_react24.useState)(0);
4810
+ const [currentResult, setCurrentResult] = (0, import_react24.useState)(null);
4811
+ const [focusedNodeId, setFocusedNodeId] = (0, import_react24.useState)(null);
4812
+ const [leftTab, setLeftTab] = (0, import_react24.useState)("prompt");
4813
+ const [promptFeedback, setPromptFeedback] = (0, import_react24.useState)(null);
4814
+ const [lastPromptPayload, setLastPromptPayload] = (0, import_react24.useState)(null);
4815
+ const [isPromptTabGenerating, setIsPromptTabGenerating] = (0, import_react24.useState)(false);
4816
+ const [activeTab, setActiveTab] = (0, import_react24.useState)("history");
4817
+ const [mobileTab, setMobileTab] = (0, import_react24.useState)("stage");
4818
+ const [middlePanel, setMiddlePanel] = (0, import_react24.useState)("stage");
4819
+ const [recentLabItems, setRecentLabItems] = (0, import_react24.useState)([]);
4820
+ const [aspectRatio, setAspectRatio] = (0, import_react24.useState)("1:1");
4821
+ const [selectedModel, setSelectedModel] = (0, import_react24.useState)("\u{1F34C} Nano Banana Pro");
4822
+ const [seed, setSeed] = (0, import_react24.useState)(Math.floor(Math.random() * 1e6));
4823
+ const [seedMode, setSeedMode] = (0, import_react24.useState)("random");
4824
+ const [isLeftCollapsed, setIsLeftCollapsed] = (0, import_react24.useState)(false);
4825
+ const [isRightCollapsed, setIsRightCollapsed] = (0, import_react24.useState)(false);
4826
+ const [leftPanelWidth, setLeftPanelWidth] = (0, import_react24.useState)(() => {
4561
4827
  try {
4562
4828
  return parseInt(localStorage.getItem("aa-left-width") || "260", 10);
4563
4829
  } catch {
4564
4830
  return 260;
4565
4831
  }
4566
4832
  });
4567
- const [rightPanelWidth, setRightPanelWidth] = (0, import_react23.useState)(() => {
4833
+ const [rightPanelWidth, setRightPanelWidth] = (0, import_react24.useState)(() => {
4568
4834
  try {
4569
4835
  return parseInt(localStorage.getItem("aa-right-width") || "320", 10);
4570
4836
  } catch {
4571
4837
  return 320;
4572
4838
  }
4573
4839
  });
4574
- const [isPromptCollapsed, setIsPromptCollapsed] = (0, import_react23.useState)(false);
4575
- const [projectActionState, setProjectActionState] = (0, import_react23.useState)("idle");
4576
- const syncServerDataRef = (0, import_react23.useRef)(null);
4577
- const [workspaceTags, setWorkspaceTags] = (0, import_react23.useState)(null);
4578
- const [serverProjects, setServerProjects] = (0, import_react23.useState)([]);
4579
- const [isLoadingFromServer, setIsLoadingFromServer] = (0, import_react23.useState)(false);
4580
- const [highContrast, setHighContrast] = (0, import_react23.useState)(() => {
4840
+ const [isPromptCollapsed, setIsPromptCollapsed] = (0, import_react24.useState)(false);
4841
+ const [projectActionState, setProjectActionState] = (0, import_react24.useState)("idle");
4842
+ const syncServerDataRef = (0, import_react24.useRef)(null);
4843
+ const [workspaceTags, setWorkspaceTags] = (0, import_react24.useState)(null);
4844
+ const [serverProjects, setServerProjects] = (0, import_react24.useState)([]);
4845
+ const [isLoadingFromServer, setIsLoadingFromServer] = (0, import_react24.useState)(false);
4846
+ const [highContrast, setHighContrast] = (0, import_react24.useState)(() => {
4581
4847
  try {
4582
4848
  return localStorage.getItem("aa-contrast") === "high";
4583
4849
  } catch {
4584
4850
  return false;
4585
4851
  }
4586
4852
  });
4587
- const [activeReferenceId, setActiveReferenceId] = (0, import_react23.useState)(null);
4588
- const [activeReferenceThumbnail, setActiveReferenceThumbnail] = (0, import_react23.useState)(null);
4589
- const [isScanningImage, setIsScanningImage] = (0, import_react23.useState)(false);
4590
- const [touchStartX, setTouchStartX] = (0, import_react23.useState)(null);
4591
- const [isFullscreen, setIsFullscreen] = (0, import_react23.useState)(false);
4592
- const [zoomScale, setZoomScale] = (0, import_react23.useState)(1);
4593
- const [zoomOffset, setZoomOffset] = (0, import_react23.useState)({ x: 0, y: 0 });
4594
- const lastPinchDist = (0, import_react23.useRef)(null);
4595
- const lastTapTime = (0, import_react23.useRef)(0);
4596
- const dragStart = (0, import_react23.useRef)(null);
4853
+ const [activeReferenceId, setActiveReferenceId] = (0, import_react24.useState)(null);
4854
+ const [activeReferenceThumbnail, setActiveReferenceThumbnail] = (0, import_react24.useState)(null);
4855
+ const [isScanningImage, setIsScanningImage] = (0, import_react24.useState)(false);
4856
+ const [touchStartX, setTouchStartX] = (0, import_react24.useState)(null);
4857
+ const [isFullscreen, setIsFullscreen] = (0, import_react24.useState)(false);
4858
+ const [zoomScale, setZoomScale] = (0, import_react24.useState)(1);
4859
+ const [zoomOffset, setZoomOffset] = (0, import_react24.useState)({ x: 0, y: 0 });
4860
+ const lastPinchDist = (0, import_react24.useRef)(null);
4861
+ const lastTapTime = (0, import_react24.useRef)(0);
4862
+ const dragStart = (0, import_react24.useRef)(null);
4597
4863
  const openFullscreen = () => {
4598
4864
  setIsFullscreen(true);
4599
4865
  setZoomScale(1);
@@ -4656,7 +4922,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4656
4922
  setActiveReferenceId(null);
4657
4923
  setActiveReferenceThumbnail(null);
4658
4924
  };
4659
- const labServices = (0, import_react23.useMemo)(() => {
4925
+ const labServices = (0, import_react24.useMemo)(() => {
4660
4926
  const available = groupGenerationsToLabItems([...galleryItems, ...history]);
4661
4927
  return {
4662
4928
  availableItems: available,
@@ -4736,17 +5002,17 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4736
5002
  setIsScanningImage(false);
4737
5003
  }
4738
5004
  };
4739
- const currentIndex = (0, import_react23.useMemo)(() => history.findIndex((h) => h.id === currentResult?.id), [history, currentResult]);
4740
- const goToPrev = (0, import_react23.useCallback)(() => {
5005
+ const currentIndex = (0, import_react24.useMemo)(() => history.findIndex((h) => h.id === currentResult?.id), [history, currentResult]);
5006
+ const goToPrev = (0, import_react24.useCallback)(() => {
4741
5007
  if (currentIndex > 0) setCurrentResult(history[currentIndex - 1]);
4742
5008
  }, [currentIndex, history]);
4743
- const goToNext = (0, import_react23.useCallback)(() => {
5009
+ const goToNext = (0, import_react24.useCallback)(() => {
4744
5010
  if (currentIndex < history.length - 1) setCurrentResult(history[currentIndex + 1]);
4745
5011
  }, [currentIndex, history]);
4746
5012
  const hcStyle = highContrast ? { filter: "brightness(1.6) contrast(1.05)" } : void 0;
4747
5013
  const isGenerating = activeGenerationsCount > 0;
4748
5014
  useKeyboardNavigation(history, currentResult, setCurrentResult);
4749
- const getSubtreeFormat = (0, import_react23.useCallback)((nodeId, depth = 0) => {
5015
+ const getSubtreeFormat = (0, import_react24.useCallback)((nodeId, depth = 0) => {
4750
5016
  const node = nodes.find((n) => n.id === nodeId);
4751
5017
  if (!node) return "";
4752
5018
  const childrenIds = edges.filter((e) => e.source === nodeId).map((e) => e.target);
@@ -4754,7 +5020,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
4754
5020
  return `${indent}- ${node.data.label || "(unbenannt)"}
4755
5021
  ` + childrenIds.map((id) => getSubtreeFormat(id, depth + 1)).join("");
4756
5022
  }, [nodes, edges]);
4757
- const activePath = (0, import_react23.useMemo)(() => {
5023
+ const activePath = (0, import_react24.useMemo)(() => {
4758
5024
  if (!focusedNodeId) return /* @__PURE__ */ new Set();
4759
5025
  const path = /* @__PURE__ */ new Set([focusedNodeId]);
4760
5026
  let currId = focusedNodeId;
@@ -5102,7 +5368,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5102
5368
  setTimeout(() => setProjectActionState("idle"), 4e3);
5103
5369
  }
5104
5370
  };
5105
- (0, import_react23.useEffect)(() => {
5371
+ (0, import_react24.useEffect)(() => {
5106
5372
  if (activeTab === "setup" || activeTab === "sync") fetchServerProjects();
5107
5373
  }, [activeTab]);
5108
5374
  const mergeWorkspaceTags = (local, remote) => {
@@ -5126,7 +5392,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5126
5392
  };
5127
5393
  if (isFullscreen && currentResult?.base64) {
5128
5394
  const fsBase64 = currentResult.base64.startsWith("data:") ? currentResult.base64 : `data:image/png;base64,${currentResult.base64}`;
5129
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
5395
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
5130
5396
  "div",
5131
5397
  {
5132
5398
  className: "fixed inset-0 bg-black z-50 flex items-center justify-center overflow-hidden touch-none",
@@ -5134,7 +5400,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5134
5400
  onTouchMove: handleFsTouchMove,
5135
5401
  onTouchEnd: handleFsTouchEnd,
5136
5402
  children: [
5137
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5403
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5138
5404
  "img",
5139
5405
  {
5140
5406
  src: fsBase64,
@@ -5151,77 +5417,77 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5151
5417
  }
5152
5418
  }
5153
5419
  ),
5154
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "close" }) }),
5155
- zoomScale > 1 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => {
5420
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "close" }) }),
5421
+ zoomScale > 1 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => {
5156
5422
  setZoomScale(1);
5157
5423
  setZoomOffset({ x: 0, y: 0 });
5158
- }, 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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "zoom_out_map" }) }),
5159
- history.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
5160
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => {
5424
+ }, 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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "zoom_out_map" }) }),
5425
+ history.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
5426
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => {
5161
5427
  if (currentIndex > 0) setCurrentResult(history[currentIndex - 1]);
5162
- }, 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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_left" }) }),
5163
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => {
5428
+ }, 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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_left" }) }),
5429
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => {
5164
5430
  if (currentIndex < history.length - 1) setCurrentResult(history[currentIndex + 1]);
5165
- }, 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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_right" }) }),
5166
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5431
+ }, 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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_right" }) }),
5432
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5167
5433
  currentIndex + 1,
5168
5434
  " / ",
5169
5435
  history.length
5170
5436
  ] })
5171
5437
  ] }),
5172
- zoomScale === 1 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute bottom-6 right-4 text-[9px] text-white/20 font-mono", children: "Pinch zum Zoomen \xB7 Doppeltipp 2.5\xD7" })
5438
+ zoomScale === 1 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute bottom-6 right-4 text-[9px] text-white/20 font-mono", children: "Pinch zum Zoomen \xB7 Doppeltipp 2.5\xD7" })
5173
5439
  ]
5174
5440
  }
5175
5441
  );
5176
5442
  }
5177
5443
  if (showStart) {
5178
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "fixed inset-0 bg-[#0e0e0e] flex flex-col items-center justify-center p-6", style: { gap: 28, ...hcStyle }, children: [
5179
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("input", { ref: wsInputRef, type: "file", accept: ".zip", className: "hidden", onChange: (e) => {
5444
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "fixed inset-0 bg-[#0e0e0e] flex flex-col items-center justify-center p-6", style: { gap: 28, ...hcStyle }, children: [
5445
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("input", { ref: wsInputRef, type: "file", accept: ".zip", className: "hidden", onChange: (e) => {
5180
5446
  const f = e.target.files?.[0];
5181
5447
  if (f) handleProjectImport(f);
5182
5448
  e.target.value = "";
5183
5449
  } }),
5184
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-1", children: [
5185
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-white/15 text-[44px]", children: "palette" }),
5186
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/25 text-[10px] font-bold uppercase tracking-[0.25em]", children: "Avatar Architect" }),
5187
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("span", { className: "text-white text-[13px] font-mono", children: [
5450
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-1", children: [
5451
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-white/15 text-[44px]", children: "palette" }),
5452
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/25 text-[10px] font-bold uppercase tracking-[0.25em]", children: "Avatar Architect" }),
5453
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("span", { className: "text-white text-[13px] font-mono", children: [
5188
5454
  "v",
5189
5455
  LIB_VERSION
5190
5456
  ] })
5191
5457
  ] }),
5192
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
5458
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
5193
5459
  "button",
5194
5460
  {
5195
5461
  onClick: toggleContrast,
5196
5462
  className: "flex items-center gap-3 px-5 py-3 rounded-2xl border transition-colors",
5197
5463
  style: { borderColor: highContrast ? "rgba(255,255,255,0.3)" : "rgba(255,255,255,0.08)", background: highContrast ? "rgba(255,255,255,0.08)" : "transparent" },
5198
5464
  children: [
5199
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[22px]", style: { color: highContrast ? "#fff" : "rgba(255,255,255,0.35)" }, children: highContrast ? "light_mode" : "dark_mode" }),
5200
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-start", children: [
5201
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[13px] font-bold", style: { color: highContrast ? "#fff" : "rgba(255,255,255,0.5)" }, children: highContrast ? "Hoher Kontrast" : "Normaler Kontrast" }),
5202
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[10px]", style: { color: "rgba(255,255,255,0.25)" }, children: "Tippen zum Umschalten" })
5465
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[22px]", style: { color: highContrast ? "#fff" : "rgba(255,255,255,0.35)" }, children: highContrast ? "light_mode" : "dark_mode" }),
5466
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-start", children: [
5467
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[13px] font-bold", style: { color: highContrast ? "#fff" : "rgba(255,255,255,0.5)" }, children: highContrast ? "Hoher Kontrast" : "Normaler Kontrast" }),
5468
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[10px]", style: { color: "rgba(255,255,255,0.25)" }, children: "Tippen zum Umschalten" })
5203
5469
  ] })
5204
5470
  ]
5205
5471
  }
5206
5472
  ),
5207
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5208
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
5473
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5474
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
5209
5475
  "button",
5210
5476
  {
5211
5477
  onClick: () => wsInputRef.current?.click(),
5212
5478
  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",
5213
5479
  style: { height: 56, background: projectLoaded ? "#16a34a" : "#0284c7" },
5214
5480
  children: [
5215
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: projectLoaded ? "check_circle" : "folder_zip" }),
5481
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: projectLoaded ? "check_circle" : "folder_zip" }),
5216
5482
  projectLoaded ? "Projekt geladen \u2713" : "Projekt laden (.zip)"
5217
5483
  ]
5218
5484
  }
5219
5485
  ),
5220
- !projectLoaded && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/20 text-[10px] text-center", children: "Baum, Bilder und Einstellungen wiederherstellen" })
5486
+ !projectLoaded && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/20 text-[10px] text-center", children: "Baum, Bilder und Einstellungen wiederherstellen" })
5221
5487
  ] }),
5222
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5223
- !initialHfToken && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex gap-2 w-full", children: [
5224
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5488
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5489
+ !initialHfToken && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex gap-2 w-full", children: [
5490
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5225
5491
  "input",
5226
5492
  {
5227
5493
  type: "password",
@@ -5237,7 +5503,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5237
5503
  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)" }
5238
5504
  }
5239
5505
  ),
5240
- hfTokenInput.trim() && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5506
+ hfTokenInput.trim() && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5241
5507
  "button",
5242
5508
  {
5243
5509
  type: "button",
@@ -5248,9 +5514,9 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5248
5514
  }
5249
5515
  )
5250
5516
  ] }),
5251
- !hfNamespace && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-3 w-full", children: [
5252
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/25 text-[10px] uppercase tracking-widest font-bold flex-shrink-0", children: "State:" }),
5253
- ["app.art-by-rolands.de/", "dev-app.art-by-rolands.de/"].map((ns, i) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5517
+ !hfNamespace && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-3 w-full", children: [
5518
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/25 text-[10px] uppercase tracking-widest font-bold flex-shrink-0", children: "State:" }),
5519
+ ["app.art-by-rolands.de/", "dev-app.art-by-rolands.de/"].map((ns, i) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5254
5520
  "button",
5255
5521
  {
5256
5522
  onClick: () => {
@@ -5270,7 +5536,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5270
5536
  ns
5271
5537
  ))
5272
5538
  ] }),
5273
- hfToken && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
5539
+ hfToken && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
5274
5540
  "button",
5275
5541
  {
5276
5542
  disabled: isLoadingFromHF,
@@ -5292,15 +5558,15 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5292
5558
  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",
5293
5559
  style: { height: 56, background: "#f59e0b" },
5294
5560
  children: [
5295
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: `material-symbols-outlined text-[22px]${isLoadingFromHF ? " animate-spin" : ""}`, children: isLoadingFromHF ? "sync" : "cloud_download" }),
5561
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: `material-symbols-outlined text-[22px]${isLoadingFromHF ? " animate-spin" : ""}`, children: isLoadingFromHF ? "sync" : "cloud_download" }),
5296
5562
  isLoadingFromHF ? "Laden\u2026" : "Von HF laden"
5297
5563
  ]
5298
5564
  }
5299
5565
  ),
5300
- hfToken && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/20 text-[10px] text-center", children: "Letzten Stand von Hugging Face laden" })
5566
+ hfToken && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/20 text-[10px] text-center", children: "Letzten Stand von Hugging Face laden" })
5301
5567
  ] }),
5302
- onFetchServerProjects && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5303
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
5568
+ onFetchServerProjects && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5569
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
5304
5570
  "button",
5305
5571
  {
5306
5572
  disabled: isLoadingFromServer,
@@ -5321,35 +5587,35 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5321
5587
  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",
5322
5588
  style: { height: 56, background: "#7c3aed" },
5323
5589
  children: [
5324
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: `material-symbols-outlined text-[22px]${isLoadingFromServer ? " animate-spin" : ""}`, children: isLoadingFromServer ? "sync" : "cloud_download" }),
5590
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: `material-symbols-outlined text-[22px]${isLoadingFromServer ? " animate-spin" : ""}`, children: isLoadingFromServer ? "sync" : "cloud_download" }),
5325
5591
  isLoadingFromServer ? "Laden\u2026" : "Vom Server laden"
5326
5592
  ]
5327
5593
  }
5328
5594
  ),
5329
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/20 text-[10px] text-center", children: "Letzten Stand vom Server wiederherstellen" })
5595
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/20 text-[10px] text-center", children: "Letzten Stand vom Server wiederherstellen" })
5330
5596
  ] }),
5331
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5332
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/25 text-[10px] uppercase tracking-widest font-bold", children: "Layout w\xE4hlen & starten" }),
5333
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "grid grid-cols-2 gap-2 w-full", children: [
5597
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-2 w-full max-w-[280px]", children: [
5598
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/25 text-[10px] uppercase tracking-widest font-bold", children: "Layout w\xE4hlen & starten" }),
5599
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "grid grid-cols-2 gap-2 w-full", children: [
5334
5600
  { id: "mobile", icon: "smartphone", label: "Mobile" },
5335
5601
  { id: "mobile-desktop", icon: "phonelink", label: "Mobile+" },
5336
5602
  { id: "desktop", icon: "desktop_windows", label: "Desktop" },
5337
5603
  { id: "tablet-landscape", icon: "tablet", label: "Landscape" }
5338
- ].map((opt) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
5604
+ ].map((opt) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
5339
5605
  "button",
5340
5606
  {
5341
5607
  onClick: () => startApp(opt.id),
5342
5608
  className: "flex flex-col items-center gap-2 py-4 rounded-2xl border transition-colors",
5343
5609
  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" },
5344
5610
  children: [
5345
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[24px]", style: { color: layoutChoice === opt.id ? "#fff" : "rgba(255,255,255,0.4)" }, children: opt.icon }),
5346
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[11px] font-bold", style: { color: layoutChoice === opt.id ? "#fff" : "rgba(255,255,255,0.4)" }, children: opt.label })
5611
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[24px]", style: { color: layoutChoice === opt.id ? "#fff" : "rgba(255,255,255,0.4)" }, children: opt.icon }),
5612
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[11px] font-bold", style: { color: layoutChoice === opt.id ? "#fff" : "rgba(255,255,255,0.4)" }, children: opt.label })
5347
5613
  ]
5348
5614
  },
5349
5615
  opt.id
5350
5616
  )) }),
5351
- layoutChoice === "mobile-desktop" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/20 text-[9px] text-center", children: "Mobil-Layout skaliert f\xFCr Desktop-Modus" }),
5352
- layoutChoice === "tablet-landscape" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-white/20 text-[9px] text-center", children: "2-Spalten-Layout f\xFCr Landscape-Tablet im Desktop-Mode" })
5617
+ layoutChoice === "mobile-desktop" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/20 text-[9px] text-center", children: "Mobil-Layout skaliert f\xFCr Desktop-Modus" }),
5618
+ layoutChoice === "tablet-landscape" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-white/20 text-[9px] text-center", children: "2-Spalten-Layout f\xFCr Landscape-Tablet im Desktop-Mode" })
5353
5619
  ] })
5354
5620
  ] });
5355
5621
  }
@@ -5358,21 +5624,21 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5358
5624
  const mdScale = mdMode ? window.innerWidth / 430 : 1;
5359
5625
  const mdW = mdMode ? 430 : void 0;
5360
5626
  const mdH = mdMode ? Math.ceil(window.innerHeight / mdScale) : void 0;
5361
- const mobileRoot = /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col bg-[#0e0e0e] text-white overflow-hidden", style: {
5627
+ const mobileRoot = /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col bg-[#0e0e0e] text-white overflow-hidden", style: {
5362
5628
  width: mdMode ? mdW : "100vw",
5363
5629
  height: mdMode ? mdH : "100dvh",
5364
5630
  transform: mdMode ? `scale(${mdScale})` : void 0,
5365
5631
  transformOrigin: mdMode ? "top left" : void 0,
5366
5632
  ...hcStyle || {}
5367
5633
  }, children: [
5368
- mobileTab === "labs" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex flex-col flex-1 min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LabsTab, { services: labServices, onResult: (item) => {
5634
+ mobileTab === "labs" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex flex-col flex-1 min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LabsTab, { services: labServices, onResult: (item) => {
5369
5635
  const frame = item.frames[0];
5370
5636
  if (frame?.base64) {
5371
5637
  setCurrentResult(frameToGeneration(frame, item));
5372
5638
  setMobileTab("stage");
5373
5639
  }
5374
5640
  } }) }),
5375
- mobileTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex flex-col flex-1 min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5641
+ mobileTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex flex-col flex-1 min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5376
5642
  TagManagerPanel,
5377
5643
  {
5378
5644
  workspaceTags,
@@ -5383,21 +5649,21 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5383
5649
  onTagMove: handleTagMove
5384
5650
  }
5385
5651
  ) }),
5386
- mobileTab === "stage" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col flex-1 min-h-0", children: [
5387
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-2 px-3 border-b border-white/5 bg-black/30 shrink-0", style: { height: 52 }, children: [
5388
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
5389
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] }),
5390
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1" }),
5391
- activeReferenceThumbnail ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden mr-2", style: { height: 28 }, children: [
5392
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
5393
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
5394
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 active:text-white/80 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
5395
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: handleSelectReference, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "add_photo_alternate" }) }),
5396
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: toggleContrast, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: highContrast ? "light_mode" : "dark_mode" }) }),
5397
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => setShowStart(true), className: "text-white/20 active:text-white/60 transition-colors mr-1", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "desktop_windows" }) })
5652
+ mobileTab === "stage" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col flex-1 min-h-0", children: [
5653
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-2 px-3 border-b border-white/5 bg-black/30 shrink-0", style: { height: 52 }, children: [
5654
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
5655
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] }),
5656
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex-1" }),
5657
+ activeReferenceThumbnail ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden mr-2", style: { height: 28 }, children: [
5658
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
5659
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
5660
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 active:text-white/80 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
5661
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: handleSelectReference, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "add_photo_alternate" }) }),
5662
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: toggleContrast, className: "text-white/20 active:text-white/60 transition-colors mr-2", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: highContrast ? "light_mode" : "dark_mode" }) }),
5663
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => setShowStart(true), className: "text-white/20 active:text-white/60 transition-colors mr-1", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "desktop_windows" }) })
5398
5664
  ] }),
5399
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "px-3 pt-3 pb-2 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: `relative rounded-xl border transition-all ${isSynthesizing ? "prompt-loading" : "bg-white/5 border-white/10"}`, children: [
5400
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5665
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "px-3 pt-3 pb-2 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `relative rounded-xl border transition-all ${isSynthesizing ? "prompt-loading" : "bg-white/5 border-white/10"}`, children: [
5666
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5401
5667
  "textarea",
5402
5668
  {
5403
5669
  value: activePrompt,
@@ -5407,26 +5673,26 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5407
5673
  placeholder: "Prompt eingeben..."
5408
5674
  }
5409
5675
  ),
5410
- activePrompt && !isSynthesizing && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[18px]", children: "close" }) })
5676
+ activePrompt && !isSynthesizing && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[18px]", children: "close" }) })
5411
5677
  ] }) }),
5412
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "px-3 pb-3 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5678
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "px-3 pb-3 shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5413
5679
  "button",
5414
5680
  {
5415
5681
  onClick: () => handleGenerateImage(),
5416
5682
  disabled: !activePrompt.trim() || isGenerating,
5417
5683
  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",
5418
5684
  style: { height: 48, background: activePrompt.trim() && !isGenerating ? "#0284c7" : void 0, border: "1px solid rgba(255,255,255,0.1)" },
5419
- children: isGenerating ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
5420
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-4 h-4 border-t-2 border-white rounded-full animate-spin" }),
5421
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Generiere..." })
5422
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
5423
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "bolt" }),
5424
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Generieren" })
5685
+ children: isGenerating ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
5686
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-4 h-4 border-t-2 border-white rounded-full animate-spin" }),
5687
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Generiere..." })
5688
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
5689
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "bolt" }),
5690
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Generieren" })
5425
5691
  ] })
5426
5692
  }
5427
5693
  ) }),
5428
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 min-h-0 px-3 pb-3 flex flex-col", children: [
5429
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
5694
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 min-h-0 px-3 pb-3 flex flex-col", children: [
5695
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
5430
5696
  "div",
5431
5697
  {
5432
5698
  className: "w-full rounded-2xl border border-white/5 bg-black/40 relative overflow-hidden flex items-center justify-center",
@@ -5440,25 +5706,25 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5440
5706
  setTouchStartX(null);
5441
5707
  },
5442
5708
  children: [
5443
- currentResult?.status === "processing" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-3", children: [
5444
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-10 h-10 border-t-2 border-white rounded-full animate-spin" }),
5445
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[11px] text-white/40 uppercase font-bold tracking-widest", children: "Erstelle Bild..." })
5709
+ currentResult?.status === "processing" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-3", children: [
5710
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-10 h-10 border-t-2 border-white rounded-full animate-spin" }),
5711
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[11px] text-white/40 uppercase font-bold tracking-widest", children: "Erstelle Bild..." })
5446
5712
  ] }),
5447
- currentResult?.status === "error" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "p-6 text-center flex flex-col items-center gap-3", children: [
5448
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-red-400 text-[36px]", children: "warning" }),
5449
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-white/50 text-[13px]", children: currentResult.error?.message }),
5450
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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" })
5713
+ currentResult?.status === "error" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "p-6 text-center flex flex-col items-center gap-3", children: [
5714
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-red-400 text-[36px]", children: "warning" }),
5715
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "text-white/50 text-[13px]", children: currentResult.error?.message }),
5716
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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" })
5451
5717
  ] }),
5452
- currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("img", { src: currentResult.base64, className: "w-full h-full object-contain" }),
5453
- !currentResult && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-2 opacity-10", children: [
5454
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[64px]", children: "palette" }),
5455
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[11px] font-bold uppercase tracking-[0.2em]", children: "Avatar Architect" })
5718
+ currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("img", { src: currentResult.base64, className: "w-full h-full object-contain" }),
5719
+ !currentResult && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-2 opacity-10", children: [
5720
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[64px]", children: "palette" }),
5721
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[11px] font-bold uppercase tracking-[0.2em]", children: "Avatar Architect" })
5456
5722
  ] }),
5457
- currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[18px]", children: "fullscreen" }) }),
5458
- history.length > 1 && currentResult && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
5459
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_left" }) }),
5460
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_right" }) }),
5461
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5723
+ currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[18px]", children: "fullscreen" }) }),
5724
+ history.length > 1 && currentResult && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
5725
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_left" }) }),
5726
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[22px]", children: "chevron_right" }) }),
5727
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5462
5728
  currentIndex + 1,
5463
5729
  " / ",
5464
5730
  history.length
@@ -5467,33 +5733,33 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5467
5733
  ]
5468
5734
  }
5469
5735
  ),
5470
- currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex gap-2 mt-3", children: [
5471
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5472
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[18px] text-white/60", children: "replay" }),
5473
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[12px] text-white/60", children: "Prompt" })
5736
+ currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex gap-2 mt-3", children: [
5737
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5738
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[18px] text-white/60", children: "replay" }),
5739
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[12px] text-white/60", children: "Prompt" })
5474
5740
  ] }),
5475
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5476
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[18px] text-white/80", children: "auto_fix_high" }),
5477
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[12px] text-white/80 font-bold", children: "Referenz" })
5741
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5742
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[18px] text-white/80", children: "auto_fix_high" }),
5743
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[12px] text-white/80 font-bold", children: "Referenz" })
5478
5744
  ] }),
5479
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5480
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[18px] text-white/60", children: "download" }),
5481
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[12px] text-white/60", children: "Laden" })
5745
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5746
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[18px] text-white/60", children: "download" }),
5747
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[12px] text-white/60", children: "Laden" })
5482
5748
  ] })
5483
5749
  ] })
5484
5750
  ] })
5485
5751
  ] }),
5486
- mobileTab === "browse" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col flex-1 min-h-0", children: [
5487
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
5488
- ["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => setActiveTab(tab), className: `flex-1 flex items-center justify-center gap-1.5 transition-colors text-[11px] font-bold uppercase tracking-wide ${activeTab === tab ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : "info" }) }, tab)),
5489
- hfToken && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: `material-symbols-outlined text-[20px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) })
5752
+ mobileTab === "browse" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col flex-1 min-h-0", children: [
5753
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
5754
+ ["history", "gallery", "inspect"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => setActiveTab(tab), className: `flex-1 flex items-center justify-center gap-1.5 transition-colors text-[11px] font-bold uppercase tracking-wide ${activeTab === tab ? "text-white border-b-2 border-white" : "text-white/30"}`, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : "info" }) }, tab)),
5755
+ hfToken && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: `material-symbols-outlined text-[20px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) })
5490
5756
  ] }),
5491
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
5492
- activeTab === "history" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: (g) => {
5757
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
5758
+ activeTab === "history" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: (g) => {
5493
5759
  setCurrentResult(g);
5494
5760
  setMobileTab("stage");
5495
5761
  }, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }),
5496
- activeTab === "gallery" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5762
+ activeTab === "gallery" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5497
5763
  MediaLibrary,
5498
5764
  {
5499
5765
  items: galleryItems,
@@ -5513,43 +5779,43 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5513
5779
  }
5514
5780
  }
5515
5781
  ),
5516
- activeTab === "inspect" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(InspectPanel, { currentResult, history, onSelect: (g) => {
5782
+ activeTab === "inspect" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(InspectPanel, { currentResult, history, onSelect: (g) => {
5517
5783
  setCurrentResult(g);
5518
5784
  } })
5519
5785
  ] })
5520
5786
  ] }),
5521
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: mobileTab === "tools" ? "flex" : "none" }, className: "flex flex-col flex-1 min-h-0", children: [
5522
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
5523
- workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("button", { onClick: () => {
5787
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: mobileTab === "tools" ? "flex" : "none" }, className: "flex flex-col flex-1 min-h-0", children: [
5788
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex border-b border-white/5 shrink-0", style: { height: 52 }, children: [
5789
+ workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("button", { onClick: () => {
5524
5790
  setLeftTab("prompt");
5525
5791
  if (activeTab === "setup" || activeTab === "sync") setActiveTab("history");
5526
5792
  }, 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: [
5527
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "auto_fix_high" }),
5793
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "auto_fix_high" }),
5528
5794
  "Prompt"
5529
5795
  ] }),
5530
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("button", { onClick: () => {
5796
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("button", { onClick: () => {
5531
5797
  setLeftTab("hierarchy");
5532
5798
  if (activeTab === "setup" || activeTab === "sync") setActiveTab("history");
5533
5799
  }, 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: [
5534
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "account_tree" }),
5800
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "account_tree" }),
5535
5801
  "Hierarchie"
5536
5802
  ] }),
5537
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5538
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "settings" }),
5803
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5804
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "settings" }),
5539
5805
  "Setup"
5540
5806
  ] }),
5541
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5542
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "cloud_sync" }),
5807
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5808
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "cloud_sync" }),
5543
5809
  "Sync"
5544
5810
  ] }),
5545
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5546
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "biotech" }),
5811
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5812
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "biotech" }),
5547
5813
  "HF"
5548
5814
  ] }),
5549
- workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "label" }) })
5815
+ workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "label" }) })
5550
5816
  ] }),
5551
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
5552
- leftTab === "hierarchy" && activeTab !== "setup" && activeTab !== "sync" && activeTab !== "hftest" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute inset-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5817
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
5818
+ leftTab === "hierarchy" && activeTab !== "setup" && activeTab !== "sync" && activeTab !== "hftest" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute inset-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5553
5819
  ListView,
5554
5820
  {
5555
5821
  nodes,
@@ -5580,12 +5846,12 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5580
5846
  isGeneratingNodeId: (id) => isSynthesizing && focusedNodeId === id
5581
5847
  }
5582
5848
  ) }),
5583
- workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { display: leftTab === "prompt" && activeTab !== "setup" && activeTab !== "sync" && activeTab !== "hftest" ? "flex" : "none" }, className: "absolute inset-0 flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => {
5849
+ workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { display: leftTab === "prompt" && activeTab !== "setup" && activeTab !== "sync" && activeTab !== "hftest" ? "flex" : "none" }, className: "absolute inset-0 flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => {
5584
5850
  handleGenerateImage(prompt);
5585
5851
  setMobileTab("stage");
5586
5852
  }, onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage }) }),
5587
- activeTab === "setup" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
5588
- activeTab === "sync" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5853
+ activeTab === "setup" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
5854
+ activeTab === "sync" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5589
5855
  ProjectSyncTab,
5590
5856
  {
5591
5857
  topSlot: syncTopSlot,
@@ -5609,7 +5875,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5609
5875
  onHfInitialSync: hfToken ? handleHfInitialSync : void 0
5610
5876
  }
5611
5877
  ),
5612
- activeTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5878
+ activeTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5613
5879
  TagManagerPanel,
5614
5880
  {
5615
5881
  workspaceTags,
@@ -5620,7 +5886,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5620
5886
  onTagMove: handleTagMove
5621
5887
  }
5622
5888
  ),
5623
- activeTab === "hftest" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute inset-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5889
+ activeTab === "hftest" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute inset-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5624
5890
  HFTestTab,
5625
5891
  {
5626
5892
  token: hfToken,
@@ -5633,19 +5899,19 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5633
5899
  ) })
5634
5900
  ] })
5635
5901
  ] }),
5636
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex border-t border-white/10 bg-black shrink-0", style: { height: 56, paddingBottom: "env(safe-area-inset-bottom, 0px)" }, children: [
5902
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex border-t border-white/10 bg-black shrink-0", style: { height: 56, paddingBottom: "env(safe-area-inset-bottom, 0px)" }, children: [
5637
5903
  { id: "tools", icon: "auto_fix_high", label: "Prompt" },
5638
5904
  { id: "stage", icon: "palette", label: "Stage" },
5639
5905
  { id: "labs", icon: "science", label: "Labs" },
5640
5906
  ...workspaceTags ? [{ id: "tags", icon: "label", label: "Tags" }] : [],
5641
5907
  { id: "browse", icon: "photo_library", label: "Galerie" }
5642
- ].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5643
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[24px]", children: tab.icon }),
5644
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[10px] font-bold uppercase tracking-wide", children: tab.label })
5908
+ ].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5909
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[24px]", children: tab.icon }),
5910
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[10px] font-bold uppercase tracking-wide", children: tab.label })
5645
5911
  ] }, tab.id)) })
5646
5912
  ] });
5647
5913
  if (mdMode) {
5648
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { position: "fixed", inset: 0, overflow: "hidden", background: "#0e0e0e" }, children: mobileRoot });
5914
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { position: "fixed", inset: 0, overflow: "hidden", background: "#0e0e0e" }, children: mobileRoot });
5649
5915
  }
5650
5916
  return mobileRoot;
5651
5917
  }
@@ -5653,17 +5919,17 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5653
5919
  const tlScale = Math.min(window.innerWidth / 920, window.innerHeight / 520);
5654
5920
  const tlW = 920;
5655
5921
  const tlH = 520;
5656
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { position: "fixed", inset: 0, background: "#0e0e0e", display: "flex", alignItems: "center", justifyContent: "center", overflow: "hidden", ...hcStyle || {} }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { width: tlW, height: tlH, transform: `scale(${tlScale})`, transformOrigin: "center center", display: "flex", flexDirection: "row", color: "#fff", overflow: "hidden", borderRadius: 0 }, children: [
5657
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { width: 320, height: tlH, display: "flex", flexDirection: "column", borderRight: "1px solid rgba(255,255,255,0.05)", background: "#000", flexShrink: 0 }, children: [
5658
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5659
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
5660
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] }),
5661
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { flex: 1 } }),
5662
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: toggleContrast, style: { color: "rgba(255,255,255,0.2)", background: "none", border: "none", cursor: "pointer", padding: 4, lineHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: highContrast ? "light_mode" : "dark_mode" }) }),
5663
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => setShowStart(true), style: { color: "rgba(255,255,255,0.2)", background: "none", border: "none", cursor: "pointer", padding: 4, lineHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "apps" }) })
5922
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { position: "fixed", inset: 0, background: "#0e0e0e", display: "flex", alignItems: "center", justifyContent: "center", overflow: "hidden", ...hcStyle || {} }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { width: tlW, height: tlH, transform: `scale(${tlScale})`, transformOrigin: "center center", display: "flex", flexDirection: "row", color: "#fff", overflow: "hidden", borderRadius: 0 }, children: [
5923
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { width: 320, height: tlH, display: "flex", flexDirection: "column", borderRight: "1px solid rgba(255,255,255,0.05)", background: "#000", flexShrink: 0 }, children: [
5924
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5925
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
5926
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] }),
5927
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { flex: 1 } }),
5928
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: toggleContrast, style: { color: "rgba(255,255,255,0.2)", background: "none", border: "none", cursor: "pointer", padding: 4, lineHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: highContrast ? "light_mode" : "dark_mode" }) }),
5929
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => setShowStart(true), style: { color: "rgba(255,255,255,0.2)", background: "none", border: "none", cursor: "pointer", padding: 4, lineHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "apps" }) })
5664
5930
  ] }),
5665
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { padding: "12px 12px 8px", flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5666
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5931
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { padding: "12px 12px 8px", flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5932
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5667
5933
  "textarea",
5668
5934
  {
5669
5935
  value: activePrompt,
@@ -5672,27 +5938,27 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5672
5938
  placeholder: "Prompt eingeben..."
5673
5939
  }
5674
5940
  ),
5675
- activePrompt && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 15 }, children: "close" }) })
5941
+ activePrompt && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 15 }, children: "close" }) })
5676
5942
  ] }) }),
5677
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { padding: "0 12px 10px", flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5943
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { padding: "0 12px 10px", flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5678
5944
  "button",
5679
5945
  {
5680
5946
  onClick: () => handleGenerateImage(),
5681
5947
  disabled: !activePrompt.trim() || isGenerating,
5682
5948
  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" },
5683
- children: isGenerating ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
5684
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { width: 14, height: 14, borderTop: "2px solid #fff", borderRadius: "50%", animation: "spin 1s linear infinite" } }),
5685
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Generiere..." })
5686
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
5687
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "bolt" }),
5688
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Generieren" })
5949
+ children: isGenerating ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
5950
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { width: 14, height: 14, borderTop: "2px solid #fff", borderRadius: "50%", animation: "spin 1s linear infinite" } }),
5951
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Generiere..." })
5952
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
5953
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "bolt" }),
5954
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Generieren" })
5689
5955
  ] })
5690
5956
  }
5691
5957
  ) }),
5692
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { flex: 1, overflow: "hidden", position: "relative" }, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: setCurrentResult, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }) })
5958
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { flex: 1, overflow: "hidden", position: "relative" }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: setCurrentResult, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }) })
5693
5959
  ] }),
5694
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { flex: 1, height: tlH, display: "flex", flexDirection: "column", background: "#0b0b0b" }, children: [
5695
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
5960
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { flex: 1, height: tlH, display: "flex", flexDirection: "column", background: "#0b0b0b" }, children: [
5961
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5696
5962
  "div",
5697
5963
  {
5698
5964
  style: { flex: 1, padding: 16, display: "flex", alignItems: "center", justifyContent: "center", position: "relative" },
@@ -5704,26 +5970,26 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5704
5970
  else if (dx > 50) goToPrev();
5705
5971
  setTouchStartX(null);
5706
5972
  },
5707
- children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5708
- currentResult?.status === "processing" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 12 }, children: [
5709
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { style: { width: 36, height: 36, borderTop: "2px solid #fff", borderRadius: "50%", animation: "spin 1s linear infinite" } }),
5710
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.4)", textTransform: "uppercase", fontWeight: "bold", letterSpacing: "0.15em" }, children: "Erstelle Bild..." })
5973
+ children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5974
+ currentResult?.status === "processing" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 12 }, children: [
5975
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { width: 36, height: 36, borderTop: "2px solid #fff", borderRadius: "50%", animation: "spin 1s linear infinite" } }),
5976
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { style: { fontSize: 10, color: "rgba(255,255,255,0.4)", textTransform: "uppercase", fontWeight: "bold", letterSpacing: "0.15em" }, children: "Erstelle Bild..." })
5711
5977
  ] }),
5712
- currentResult?.status === "error" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { padding: 24, textAlign: "center", display: "flex", flexDirection: "column", alignItems: "center", gap: 12 }, children: [
5713
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 32, color: "#f87171" }, children: "warning" }),
5714
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { style: { fontSize: 11, color: "rgba(255,255,255,0.5)", margin: 0 }, children: currentResult.error?.message }),
5715
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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" })
5978
+ currentResult?.status === "error" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { padding: 24, textAlign: "center", display: "flex", flexDirection: "column", alignItems: "center", gap: 12 }, children: [
5979
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 32, color: "#f87171" }, children: "warning" }),
5980
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { style: { fontSize: 11, color: "rgba(255,255,255,0.5)", margin: 0 }, children: currentResult.error?.message }),
5981
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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" })
5716
5982
  ] }),
5717
- currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("img", { src: currentResult.base64, style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain" } }),
5718
- !currentResult && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 8, opacity: 0.1 }, children: [
5719
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 64 }, children: "palette" }),
5720
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { style: { fontSize: 11, fontWeight: "bold", textTransform: "uppercase", letterSpacing: "0.2em" }, children: "Avatar Architect" })
5983
+ currentResult?.status === "done" && currentResult.base64 && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("img", { src: currentResult.base64, style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain" } }),
5984
+ !currentResult && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 8, opacity: 0.1 }, children: [
5985
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 64 }, children: "palette" }),
5986
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { style: { fontSize: 11, fontWeight: "bold", textTransform: "uppercase", letterSpacing: "0.2em" }, children: "Avatar Architect" })
5721
5987
  ] }),
5722
- currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "fullscreen" }) }),
5723
- history.length > 1 && currentResult && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
5724
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 20 }, children: "chevron_left" }) }),
5725
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 20 }, children: "chevron_right" }) }),
5726
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5988
+ currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 18 }, children: "fullscreen" }) }),
5989
+ history.length > 1 && currentResult && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
5990
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 20 }, children: "chevron_left" }) }),
5991
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 20 }, children: "chevron_right" }) }),
5992
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
5727
5993
  currentIndex + 1,
5728
5994
  " / ",
5729
5995
  history.length
@@ -5732,42 +5998,42 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5732
5998
  ] })
5733
5999
  }
5734
6000
  ),
5735
- currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { style: { padding: "0 16px 16px", display: "flex", gap: 8, flexShrink: 0 }, children: [
5736
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5737
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "replay" }),
5738
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Prompt" })
6001
+ currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { style: { padding: "0 16px 16px", display: "flex", gap: 8, flexShrink: 0 }, children: [
6002
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6003
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "replay" }),
6004
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Prompt" })
5739
6005
  ] }),
5740
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5741
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "auto_fix_high" }),
5742
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Referenz" })
6006
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6007
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "auto_fix_high" }),
6008
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Referenz" })
5743
6009
  ] }),
5744
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5745
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "download" }),
5746
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Laden" })
6010
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6011
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", style: { fontSize: 16 }, children: "download" }),
6012
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Laden" })
5747
6013
  ] })
5748
6014
  ] })
5749
6015
  ] })
5750
6016
  ] }) });
5751
6017
  }
5752
- return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex h-screen w-screen bg-[#0e0e0e] text-white overflow-hidden", style: hcStyle, children: [
5753
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute top-2 right-2 z-50", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => setShowStart(true), className: "text-white/10 hover:text-white/30 transition-colors text-[10px]", children: "\u21C4" }) }),
5754
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5755
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "h-14 border-b border-white/5 flex items-center justify-between shrink-0 px-1", children: [
5756
- !isLeftCollapsed && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-1 gap-1", children: [
5757
- workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5758
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "auto_fix_high" }),
6018
+ return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex h-screen w-screen bg-[#0e0e0e] text-white overflow-hidden", style: hcStyle, children: [
6019
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute top-2 right-2 z-50", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => setShowStart(true), className: "text-white/10 hover:text-white/30 transition-colors text-[10px]", children: "\u21C4" }) }),
6020
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6021
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "h-14 border-b border-white/5 flex items-center justify-between shrink-0 px-1", children: [
6022
+ !isLeftCollapsed && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-1 gap-1", children: [
6023
+ workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6024
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "auto_fix_high" }),
5759
6025
  "Prompt"
5760
6026
  ] }),
5761
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5762
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "account_tree" }),
6027
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6028
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "account_tree" }),
5763
6029
  "Hierarchie"
5764
6030
  ] }),
5765
- workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "label" }) })
6031
+ workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: "label" }) })
5766
6032
  ] }),
5767
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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" })
6033
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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" })
5768
6034
  ] }),
5769
- !isLeftCollapsed && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
5770
- activeTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
6035
+ !isLeftCollapsed && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
6036
+ activeTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5771
6037
  TagManagerPanel,
5772
6038
  {
5773
6039
  workspaceTags,
@@ -5778,11 +6044,11 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5778
6044
  onTagMove: handleTagMove
5779
6045
  }
5780
6046
  ),
5781
- activeTab === "tags" && !workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex items-center justify-center h-full p-8 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
5782
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[40px] text-white/10 block mb-3", children: "label_off" }),
5783
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-[11px] text-white/20", children: "Erst Workspace importieren um Tags zu verwalten." })
6047
+ activeTab === "tags" && !workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex items-center justify-center h-full p-8 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { children: [
6048
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[40px] text-white/10 block mb-3", children: "label_off" }),
6049
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "text-[11px] text-white/20", children: "Erst Workspace importieren um Tags zu verwalten." })
5784
6050
  ] }) }),
5785
- leftTab === "hierarchy" && activeTab !== "tags" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "absolute inset-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
6051
+ leftTab === "hierarchy" && activeTab !== "tags" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "absolute inset-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5786
6052
  ListView,
5787
6053
  {
5788
6054
  nodes,
@@ -5807,18 +6073,18 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5807
6073
  isGeneratingNodeId: (id) => isSynthesizing && focusedNodeId === id
5808
6074
  }
5809
6075
  ) }),
5810
- leftTab === "prompt" && workspaceTags && activeTab !== "tags" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => handleGenerateImage(prompt), onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage })
6076
+ leftTab === "prompt" && workspaceTags && activeTab !== "tags" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PromptTab, { workspaceTags, onGenerate: handlePromptTabGenerate, isGenerating: isPromptTabGenerating, feedback: promptFeedback, promptResult: activePrompt || null, lastPayload: lastPromptPayload, onGenerateImage: (prompt) => handleGenerateImage(prompt), onTagCreate: handleTagCreate, onTagUpdate: handleTagUpdate, onTagDelete: handleTagDelete, onScanImage: handleScanImage, isScanning: isScanningImage })
5811
6077
  ] })
5812
6078
  ] }),
5813
- !isLeftCollapsed && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { onMouseDown: startLeftResize, className: "w-1 shrink-0 cursor-col-resize hover:bg-white/20 active:bg-white/30 transition-colors", style: { background: "transparent" } }),
5814
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 flex flex-col bg-[#0b0b0b] overflow-hidden", children: [
5815
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "h-14 border-b border-white/5 flex items-center px-4 gap-2 justify-between shrink-0 bg-black/20", children: [
5816
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-1.5", children: [
5817
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
5818
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] })
6079
+ !isLeftCollapsed && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { onMouseDown: startLeftResize, className: "w-1 shrink-0 cursor-col-resize hover:bg-white/20 active:bg-white/30 transition-colors", style: { background: "transparent" } }),
6080
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 flex flex-col bg-[#0b0b0b] overflow-hidden", children: [
6081
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "h-14 border-b border-white/5 flex items-center px-4 gap-2 justify-between shrink-0 bg-black/20", children: [
6082
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-1.5", children: [
6083
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CompactDropdown, { value: aspectRatio, onChange: setAspectRatio, options: [{ label: "1:1", value: "1:1" }, { label: "16:9", value: "16:9" }, { label: "9:16", value: "9:16" }] }),
6084
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(CompactDropdown, { value: selectedModel, onChange: setSelectedModel, options: [{ value: "\u{1F34C} Nano Banana Pro", label: "\u{1F34C} Nano Banana Pro" }, { value: "\u{1F34C} Nano Banana 2", label: "\u{1F34C} Nano Banana 2" }, { value: "Imagen 4", label: "Imagen 4" }] })
5819
6085
  ] }),
5820
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-1 mx-auto", children: [
5821
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
6086
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-1 mx-auto", children: [
6087
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5822
6088
  "button",
5823
6089
  {
5824
6090
  onClick: () => setMiddlePanel("stage"),
@@ -5826,7 +6092,7 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5826
6092
  children: "Stage"
5827
6093
  }
5828
6094
  ),
5829
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
6095
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5830
6096
  "button",
5831
6097
  {
5832
6098
  onClick: () => setMiddlePanel("labs"),
@@ -5835,68 +6101,68 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5835
6101
  }
5836
6102
  )
5837
6103
  ] }),
5838
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-2", children: [
5839
- activeReferenceThumbnail ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden", style: { height: 28 }, children: [
5840
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
5841
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
5842
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 hover:text-white/80 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
5843
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("button", { onClick: handleSelectReference, className: "flex items-center gap-1 h-7 px-2 rounded-lg border border-white/10 text-white/30 hover:text-white/60 hover:border-white/20 transition-colors text-[10px] font-bold uppercase tracking-wide", children: [
5844
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "add_photo_alternate" }),
5845
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { children: "Ref" })
6104
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-2", children: [
6105
+ activeReferenceThumbnail ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center gap-1 rounded-lg border border-white/20 bg-white/5 overflow-hidden", style: { height: 28 }, children: [
6106
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("img", { src: activeReferenceThumbnail, className: "h-full aspect-square object-cover" }),
6107
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[10px] text-white/60 font-bold uppercase tracking-wide px-1", children: "Ref" }),
6108
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: clearReference, className: "w-6 h-full flex items-center justify-center text-white/30 hover:text-white/80 transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
6109
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("button", { onClick: handleSelectReference, className: "flex items-center gap-1 h-7 px-2 rounded-lg border border-white/10 text-white/30 hover:text-white/60 hover:border-white/20 transition-colors text-[10px] font-bold uppercase tracking-wide", children: [
6110
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "add_photo_alternate" }),
6111
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: "Ref" })
5846
6112
  ] }),
5847
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => setIsPromptCollapsed(!isPromptCollapsed), className: "text-white/40 hover:text-white transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined", children: isPromptCollapsed ? "expand_more" : "expand_less" }) }),
5848
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PillButton, { variant: "solid", icon: "bolt", loading: isGenerating, disabled: !activePrompt.trim(), onClick: () => handleGenerateImage(), children: "Generieren" })
6113
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => setIsPromptCollapsed(!isPromptCollapsed), className: "text-white/40 hover:text-white transition-colors", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined", children: isPromptCollapsed ? "expand_more" : "expand_less" }) }),
6114
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PillButton, { variant: "solid", icon: "bolt", loading: isGenerating, disabled: !activePrompt.trim(), onClick: () => handleGenerateImage(), children: "Generieren" })
5849
6115
  ] })
5850
6116
  ] }),
5851
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 flex flex-col overflow-hidden relative", children: [
5852
- !isPromptCollapsed && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "px-6 py-4 border-b border-white/5 bg-black/10 overflow-hidden shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: `relative min-h-[60px] p-4 rounded-2xl border transition-all ${isSynthesizing ? "prompt-loading" : "bg-white/5 border-white/10"}`, children: [
5853
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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..." }),
5854
- activePrompt && !isSynthesizing && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
6117
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 flex flex-col overflow-hidden relative", children: [
6118
+ !isPromptCollapsed && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "px-6 py-4 border-b border-white/5 bg-black/10 overflow-hidden shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: `relative min-h-[60px] p-4 rounded-2xl border transition-all ${isSynthesizing ? "prompt-loading" : "bg-white/5 border-white/10"}`, children: [
6119
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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..." }),
6120
+ activePrompt && !isSynthesizing && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[14px]", children: "close" }) })
5855
6121
  ] }) }),
5856
- middlePanel === "labs" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(LabsTab, { services: labServices, onResult: (item) => {
6122
+ middlePanel === "labs" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex-1 overflow-hidden", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(LabsTab, { services: labServices, onResult: (item) => {
5857
6123
  const frame = item.frames[0];
5858
6124
  if (frame?.base64) setCurrentResult(frameToGeneration(frame, item));
5859
- } }) }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex-1 p-6 overflow-hidden flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5860
- isGenerating && currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5861
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-3 h-3 border-t-2 border-white rounded-full animate-spin" }),
5862
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[10px] text-white/60 uppercase font-bold tracking-widest", children: "Neue Referenz..." })
6125
+ } }) }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex-1 p-6 overflow-hidden flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6126
+ isGenerating && currentResult?.status === "done" && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6127
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-3 h-3 border-t-2 border-white rounded-full animate-spin" }),
6128
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[10px] text-white/60 uppercase font-bold tracking-widest", children: "Neue Referenz..." })
5863
6129
  ] }),
5864
- currentResult ? currentResult.status === "processing" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-4", children: [
5865
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-10 h-10 border-t-2 border-white rounded-full animate-spin" }),
5866
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[10px] text-white/40 uppercase font-bold tracking-widest", children: "Erstelle Bild..." })
5867
- ] }) : currentResult.status === "error" ? /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "p-10 text-center flex flex-col items-center gap-5 max-w-md", children: [
5868
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-16 h-16 rounded-full bg-red-500/10 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-red-500 text-[32px]", children: "warning" }) }),
5869
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col gap-2", children: [
5870
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("h3", { className: "text-[11px] font-bold uppercase tracking-widest text-red-400", children: "Generierungsfehler" }),
5871
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-white/60 text-[12px] leading-relaxed", children: currentResult.error?.message })
6130
+ currentResult ? currentResult.status === "processing" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-4", children: [
6131
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-10 h-10 border-t-2 border-white rounded-full animate-spin" }),
6132
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[10px] text-white/40 uppercase font-bold tracking-widest", children: "Erstelle Bild..." })
6133
+ ] }) : currentResult.status === "error" ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "p-10 text-center flex flex-col items-center gap-5 max-w-md", children: [
6134
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-16 h-16 rounded-full bg-red-500/10 flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-red-500 text-[32px]", children: "warning" }) }),
6135
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col gap-2", children: [
6136
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("h3", { className: "text-[11px] font-bold uppercase tracking-widest text-red-400", children: "Generierungsfehler" }),
6137
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "text-white/60 text-[12px] leading-relaxed", children: currentResult.error?.message })
5872
6138
  ] }),
5873
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PillButton, { variant: "outline", icon: "refresh", onClick: () => handleGenerateImage(currentResult.prompt), children: "Erneut versuchen" })
5874
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "h-full w-full relative flex items-center justify-center", children: [
5875
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("img", { src: currentResult.base64, className: "max-h-full max-w-full object-contain rounded-xl shadow-2xl" }),
5876
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("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: [
5877
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PillButton, { variant: "outline", icon: "replay", onClick: () => setActivePrompt(currentResult.prompt || ""), children: "Prompt" }),
5878
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PillButton, { variant: "solid", icon: "auto_fix_high", onClick: () => handleGenerateImage(currentResult.prompt || activePrompt, currentResult.mediaId, void 0, { silent: true }), children: "Referenz" }),
5879
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PillButton, { variant: "outline", icon: "download", onClick: handleDownloadSingle, children: "Speichern" })
6139
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PillButton, { variant: "outline", icon: "refresh", onClick: () => handleGenerateImage(currentResult.prompt), children: "Erneut versuchen" })
6140
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "h-full w-full relative flex items-center justify-center", children: [
6141
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("img", { src: currentResult.base64, className: "max-h-full max-w-full object-contain rounded-xl shadow-2xl" }),
6142
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("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: [
6143
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PillButton, { variant: "outline", icon: "replay", onClick: () => setActivePrompt(currentResult.prompt || ""), children: "Prompt" }),
6144
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PillButton, { variant: "solid", icon: "auto_fix_high", onClick: () => handleGenerateImage(currentResult.prompt || activePrompt, currentResult.mediaId, void 0, { silent: true }), children: "Referenz" }),
6145
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(PillButton, { variant: "outline", icon: "download", onClick: handleDownloadSingle, children: "Speichern" })
5880
6146
  ] })
5881
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col items-center gap-2 opacity-10", children: [
5882
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[100px]", children: "palette" }),
5883
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-[12px] font-bold uppercase tracking-[0.2em]", children: "Avatar Architect" })
6147
+ ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col items-center gap-2 opacity-10", children: [
6148
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[100px]", children: "palette" }),
6149
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "text-[12px] font-bold uppercase tracking-[0.2em]", children: "Avatar Architect" })
5884
6150
  ] })
5885
6151
  ] }) })
5886
6152
  ] })
5887
6153
  ] }),
5888
- !isRightCollapsed && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { onMouseDown: startRightResize, className: "w-1 shrink-0 cursor-col-resize hover:bg-white/20 active:bg-white/30 transition-colors", style: { background: "transparent" } }),
5889
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex flex-col border-l border-white/5 bg-[#0e0e0e] shrink-0", style: { width: isRightCollapsed ? 60 : rightPanelWidth, transition: "none" }, children: [
5890
- /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex border-b border-white/5 h-14 shrink-0 overflow-hidden", children: [
5891
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex flex-1", children: ["history", "gallery", "inspect", "setup", "sync", "tags"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => {
6154
+ !isRightCollapsed && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { onMouseDown: startRightResize, className: "w-1 shrink-0 cursor-col-resize hover:bg-white/20 active:bg-white/30 transition-colors", style: { background: "transparent" } }),
6155
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex flex-col border-l border-white/5 bg-[#0e0e0e] shrink-0", style: { width: isRightCollapsed ? 60 : rightPanelWidth, transition: "none" }, children: [
6156
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex border-b border-white/5 h-14 shrink-0 overflow-hidden", children: [
6157
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex flex-1", children: ["history", "gallery", "inspect", "setup", "sync", "tags"].map((tab) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => {
5892
6158
  setActiveTab(tab);
5893
6159
  setIsRightCollapsed(false);
5894
- }, className: `flex-1 flex items-center justify-center relative transition-colors ${activeTab === tab ? "text-white" : "text-white/20"}`, children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : tab === "inspect" ? "info" : tab === "setup" ? "settings" : tab === "sync" ? "cloud_sync" : "label" }) }, tab)) }),
5895
- hfToken && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("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__ */ (0, import_jsx_runtime21.jsx)("span", { className: `material-symbols-outlined text-[18px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) }),
5896
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("button", { onClick: () => setIsRightCollapsed(!isRightCollapsed), className: "w-10 flex items-center justify-center text-white/20 hover:text-white", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[18px]", children: isRightCollapsed ? "chevron_left" : "chevron_right" }) })
6160
+ }, className: `flex-1 flex items-center justify-center relative transition-colors ${activeTab === tab ? "text-white" : "text-white/20"}`, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[20px]", children: tab === "history" ? "history" : tab === "gallery" ? "photo_library" : tab === "inspect" ? "info" : tab === "setup" ? "settings" : tab === "sync" ? "cloud_sync" : "label" }) }, tab)) }),
6161
+ hfToken && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("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__ */ (0, import_jsx_runtime22.jsx)("span", { className: `material-symbols-outlined text-[18px]${isHfRefreshing ? " animate-spin" : ""}`, children: "sync" }) }),
6162
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("button", { onClick: () => setIsRightCollapsed(!isRightCollapsed), className: "w-10 flex items-center justify-center text-white/20 hover:text-white", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[18px]", children: isRightCollapsed ? "chevron_left" : "chevron_right" }) })
5897
6163
  ] }),
5898
- !isRightCollapsed && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
5899
- activeTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
6164
+ !isRightCollapsed && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex-1 overflow-hidden relative", children: [
6165
+ activeTab === "tags" && workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5900
6166
  TagManagerPanel,
5901
6167
  {
5902
6168
  workspaceTags,
@@ -5907,12 +6173,12 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5907
6173
  onTagMove: handleTagMove
5908
6174
  }
5909
6175
  ),
5910
- activeTab === "tags" && !workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "flex items-center justify-center h-full p-8 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { children: [
5911
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "material-symbols-outlined text-[40px] text-white/10 block mb-3", children: "label_off" }),
5912
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("p", { className: "text-[11px] text-white/20", children: "Erst Workspace importieren um Tags zu verwalten." })
6176
+ activeTab === "tags" && !workspaceTags && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex items-center justify-center h-full p-8 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { children: [
6177
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { className: "material-symbols-outlined text-[40px] text-white/10 block mb-3", children: "label_off" }),
6178
+ /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("p", { className: "text-[11px] text-white/20", children: "Erst Workspace importieren um Tags zu verwalten." })
5913
6179
  ] }) }),
5914
- activeTab === "history" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: setCurrentResult, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }),
5915
- activeTab === "gallery" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
6180
+ activeTab === "history" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(HistoryPanel, { history, currentResultId: currentResult?.id || null, onSelect: setCurrentResult, onDelete: (id) => setHistory((h) => h.filter((x) => x.id !== id)) }),
6181
+ activeTab === "gallery" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5916
6182
  MediaLibrary,
5917
6183
  {
5918
6184
  items: galleryItems,
@@ -5926,9 +6192,9 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5926
6192
  onGenerateReference: (item) => handleGenerateImage(item.prompt || activePrompt, item.mediaId, void 0, { silent: true })
5927
6193
  }
5928
6194
  ),
5929
- activeTab === "inspect" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(InspectPanel, { currentResult, history, onSelect: setCurrentResult }),
5930
- activeTab === "setup" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
5931
- activeTab === "sync" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
6195
+ activeTab === "inspect" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(InspectPanel, { currentResult, history, onSelect: setCurrentResult }),
6196
+ activeTab === "setup" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(SetupPanel, { onWorkspaceImport: handleWorkspaceImport, buildInfo }),
6197
+ activeTab === "sync" && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
5932
6198
  ProjectSyncTab,
5933
6199
  {
5934
6200
  topSlot: syncTopSlot,
@@ -5958,8 +6224,8 @@ function AvatarArchitectApp({ onGenerateImage, onGeneratePrompt, onDownload, onS
5958
6224
  }
5959
6225
 
5960
6226
  // src/components/FaApp.tsx
5961
- var import_react24 = require("react");
5962
- var import_jsx_runtime22 = require("react/jsx-runtime");
6227
+ var import_react25 = require("react");
6228
+ var import_jsx_runtime23 = require("react/jsx-runtime");
5963
6229
  function FaApp({
5964
6230
  onGenerateImage,
5965
6231
  onGeneratePrompt,
@@ -5978,8 +6244,8 @@ function FaApp({
5978
6244
  onServerDelete,
5979
6245
  buildInfo
5980
6246
  }) {
5981
- const [hfNamespace, setHfNamespace] = (0, import_react24.useState)(void 0);
5982
- (0, import_react24.useEffect)(() => {
6247
+ const [hfNamespace, setHfNamespace] = (0, import_react25.useState)(void 0);
6248
+ (0, import_react25.useEffect)(() => {
5983
6249
  if (!serverBaseUrl) return;
5984
6250
  fetch(`${serverBaseUrl}/api/status`).then((r) => r.json()).then((d) => {
5985
6251
  if (typeof d.hfNamespace === "string") setHfNamespace(d.hfNamespace);
@@ -5990,7 +6256,7 @@ function FaApp({
5990
6256
  const result = await onGeneratePrompt(text, options);
5991
6257
  return result.text;
5992
6258
  };
5993
- return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
6259
+ return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
5994
6260
  AvatarArchitectApp,
5995
6261
  {
5996
6262
  onGenerateImage,
@@ -6012,7 +6278,7 @@ function FaApp({
6012
6278
  // src/index.ts
6013
6279
  init_hfStateService();
6014
6280
  init_hfStateService();
6015
- var LIB_VERSION = "2.0.22";
6281
+ var LIB_VERSION = "2.0.23";
6016
6282
  // Annotate the CommonJS export names for ESM import in node:
6017
6283
  0 && (module.exports = {
6018
6284
  AvatarArchitectApp,
@@ -6026,6 +6292,7 @@ var LIB_VERSION = "2.0.22";
6026
6292
  LIB_VERSION,
6027
6293
  LabBlend,
6028
6294
  LabCompare,
6295
+ LabFrameExtractor,
6029
6296
  LabImagePicker,
6030
6297
  LabLoop,
6031
6298
  LabRemix,