@rslsp1/fa-app-tools 4.0.0 → 5.0.0

package/dist/{chunk-566GHYAT.mjs → chunk-TW4IDHAN.mjs}

@@ -5225,6 +5225,29 @@ function findPromptRun(events, runId) {
   return collectPromptRuns(events).find((run) => run.run_id === runId) ?? null;
 }
 
+// src/lib/szenen/bildVorschau.ts
+async function ladeVorschauen(port, mediaRefs, fertig, optionen = {}) {
+  const laden = port.loadPreview;
+  if (!laden) return;
+  const parallel = Math.max(1, optionen.parallel ?? 4);
+  const lauf = optionen.lauf;
+  const offen = mediaRefs.filter((ref) => !(optionen.hat?.(ref) ?? false));
+  let naechster = 0;
+  async function arbeiter() {
+    while (naechster < offen.length) {
+      if (lauf?.abgebrochen) return;
+      const ref = offen[naechster];
+      naechster += 1;
+      const ergebnis = await laden.call(port, ref);
+      if (lauf?.abgebrochen) return;
+      if (ergebnis.kind === "ok") fertig(ref, ergebnis.value);
+    }
+  }
+  await Promise.all(
+    Array.from({ length: Math.min(parallel, offen.length) }, () => arbeiter())
+  );
+}
+
 // src/lib/szenen/textGenerationPort.ts
 function simulatedAnswerFor(request) {
   let input;
@@ -6183,7 +6206,7 @@ async function runSceneDerivation(input, port, userPrompt) {
 }
 
 // src/features/szenen/SzenenView.tsx
-import { useMemo as useMemo3, useState as useState16 } from "react";
+import { useMemo as useMemo4, useState as useState16 } from "react";
 
 // src/features/szenen/areas/ElementsArea.tsx
 import { useState as useState11 } from "react";
@@ -9973,7 +9996,7 @@ var MediaArea = ({ port }) => {
 };
 
 // src/features/szenen/areas/DeriveArea.tsx
-import { useRef as useRef2, useState as useState15 } from "react";
+import { useEffect as useEffect5, useMemo as useMemo3, useRef as useRef2, useState as useState15 } from "react";
 
 // src/features/szenen/areas/RecoveryPanel.tsx
 import { useState as useState13 } from "react";
@@ -10341,14 +10364,64 @@ function readAsBase642(datei) {
     leser.readAsDataURL(datei);
   });
 }
+function useVorschauen(port, mediaRefs) {
+  const [quellen, setQuellen] = useState15(() => /* @__PURE__ */ new Map());
+  const gehalten = useRef2(/* @__PURE__ */ new Map());
+  const schluessel = mediaRefs.join(" ");
+  useEffect5(() => {
+    const bestand = port.imageLibrary;
+    if (!bestand?.loadPreview) return void 0;
+    const refs = schluessel ? schluessel.split(" ") : [];
+    const lauf = { abgebrochen: false };
+    void ladeVorschauen(
+      bestand,
+      refs,
+      (mediaRef, quelle) => {
+        gehalten.current.set(mediaRef, quelle);
+        setQuellen(new Map(gehalten.current));
+      },
+      { parallel: 4, hat: (ref) => gehalten.current.has(ref), lauf }
+    );
+    return () => {
+      lauf.abgebrochen = true;
+    };
+  }, [port, schluessel]);
+  return quellen;
+}
+var Kachel = ({ quelle, alt }) => /* @__PURE__ */ jsx17("span", { className: "szenen-bildkachel", children: quelle ? /* @__PURE__ */ jsx17("img", { src: quelle, alt, loading: "lazy" }) : /* @__PURE__ */ jsx17("span", { className: "szenen-bildkachel__leer", "aria-hidden": "true" }) });
 var BildWaehler = ({ port, gewaehlt, onWaehlen, onEntfernen }) => {
   const [suche, setSuche] = useState15("");
-  const [bilder] = usePortQuery(
-    () => port.imageLibrary.listImages({ search: suche.trim() || void 0, limit: 60 }),
+  const [offenesWerk, setOffenesWerk] = useState15(null);
+  const [items] = usePortQuery(
+    () => port.imageLibrary.listItems({ search: suche.trim() || void 0, limit: 60 }),
     [port, suche]
   );
+  const werk = items.status === "ready" ? items.value.find((i) => i.itemRef === offenesWerk) ?? null : null;
+  const sichtbar = useMemo3(() => {
+    const refs = werk ? werk.images.map((b) => b.mediaRef) : items.status === "ready" ? items.value.map((i) => i.images[0]?.mediaRef).filter((r) => Boolean(r)) : [];
+    return [.../* @__PURE__ */ new Set([...refs, ...gewaehlt.map((b) => b.mediaRef)])];
+  }, [items, werk, gewaehlt]);
+  const quellen = useVorschauen(port, sichtbar);
+  const quelleVon = (bild) => bild.thumbUrl || quellen.get(bild.mediaRef) || null;
   return /* @__PURE__ */ jsxs17("div", { className: "szenen-bildwahl", "data-testid": "bildwahl", children: [
-    /* @__PURE__ */ jsxs17("label", { className: "szenen-field", children: [
+    werk ? /* @__PURE__ */ jsxs17("div", { className: "szenen-bildwahl__kopf", children: [
+      /* @__PURE__ */ jsx17(
+        "button",
+        {
+          type: "button",
+          className: "szenen-bildwahl__zurueck",
+          onClick: () => setOffenesWerk(null),
+          "data-testid": "bildwahl-zurueck",
+          children: "Zurueck zur Auswahl"
+        }
+      ),
+      /* @__PURE__ */ jsxs17("span", { className: "szenen-bildwahl__werktitel", "data-testid": "bildwahl-werktitel", children: [
+        werk.title,
+        " \xB7 ",
+        werk.images.length,
+        " Bilder"
+      ] })
+    ] }) : /* @__PURE__ */ jsxs17("label", { className: "szenen-field", children: [
       /* @__PURE__ */ jsx17("span", { children: "Bild aus dem Bestand" }),
       /* @__PURE__ */ jsx17(
         "input",
@@ -10356,31 +10429,70 @@ var BildWaehler = ({ port, gewaehlt, onWaehlen, onEntfernen }) => {
           type: "search",
           value: suche,
           onChange: (e) => setSuche(e.target.value),
+          onKeyDown: (e) => {
+            if (e.key === "Enter") e.preventDefault();
+          },
           placeholder: "Suchen \u2026",
           "data-testid": "bild-suche"
         }
       )
     ] }),
-    bilder.status === "loading" && /* @__PURE__ */ jsx17("p", { children: "Bilder werden geladen \u2026" }),
-    bilder.status === "error" && /* @__PURE__ */ jsxs17("p", { className: "szenen-error", role: "alert", children: [
+    items.status === "loading" && /* @__PURE__ */ jsx17("p", { children: "Bilder werden geladen \u2026" }),
+    items.status === "error" && /* @__PURE__ */ jsxs17("p", { className: "szenen-error", role: "alert", children: [
       "Der Bildbestand ist nicht lesbar: ",
-      bilder.message
+      items.message
     ] }),
-    bilder.status === "ready" && bilder.value.length === 0 && /* @__PURE__ */ jsx17("p", { className: "szenen-empty", "data-testid": "bildwahl-leer", children: "Zu dieser Suche gibt es kein Bild. Ohne Treffer bleibt der Upload." }),
-    bilder.status === "ready" && bilder.value.length > 0 && /* @__PURE__ */ jsx17("ul", { className: "szenen-bildwahl__liste", children: bilder.value.map((bild) => /* @__PURE__ */ jsx17("li", { children: /* @__PURE__ */ jsxs17(
+    items.status === "ready" && items.value.length === 0 && /* @__PURE__ */ jsx17("p", { className: "szenen-empty", "data-testid": "bildwahl-leer", children: "Zu dieser Suche gibt es kein Bild. Ohne Treffer bleibt der Upload." }),
+    werk && /* @__PURE__ */ jsx17("ul", { className: "szenen-bildwahl__raster", "data-testid": "bildwahl-galerie", children: werk.images.map((bild, position) => /* @__PURE__ */ jsx17("li", { children: /* @__PURE__ */ jsxs17(
       "button",
       {
         type: "button",
-        onClick: () => onWaehlen(bild),
+        onClick: () => {
+          onWaehlen(bild);
+          setOffenesWerk(null);
+        },
         "data-testid": `bild-waehlen-${bild.mediaRef}`,
+        title: bild.title,
         children: [
-          bild.thumbUrl && /* @__PURE__ */ jsx17("img", { src: bild.thumbUrl, alt: "" }),
-          /* @__PURE__ */ jsx17("span", { children: bild.title })
+          /* @__PURE__ */ jsx17(Kachel, { quelle: quelleVon(bild), alt: bild.title }),
+          /* @__PURE__ */ jsxs17("span", { className: "szenen-bildwahl__nummer", children: [
+            "#",
+            position + 1
+          ] })
         ]
       }
     ) }, bild.mediaRef)) }),
+    !werk && items.status === "ready" && items.value.length > 0 && /* @__PURE__ */ jsx17("ul", { className: "szenen-bildwahl__raster", "data-testid": "bildwahl-werke", children: items.value.map((item) => {
+      const deckbild = item.images[0];
+      if (!deckbild) return null;
+      return /* @__PURE__ */ jsx17("li", { children: /* @__PURE__ */ jsxs17(
+        "button",
+        {
+          type: "button",
+          onClick: () => item.images.length === 1 ? onWaehlen(deckbild) : setOffenesWerk(item.itemRef),
+          "data-testid": `item-waehlen-${item.itemRef}`,
+          title: item.title,
+          children: [
+            /* @__PURE__ */ jsx17(Kachel, { quelle: quelleVon(deckbild), alt: item.title }),
+            item.images.length > 1 && /* @__PURE__ */ jsxs17(
+              "span",
+              {
+                className: "szenen-bildwahl__anzahl",
+                "data-testid": `item-anzahl-${item.itemRef}`,
+                children: [
+                  item.images.length,
+                  "x"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsx17("span", { className: "szenen-bildwahl__titel", children: item.title })
+          ]
+        }
+      ) }, item.itemRef);
+    }) }),
     gewaehlt.length > 0 && /* @__PURE__ */ jsx17("ul", { className: "szenen-bildwahl__gewaehlt", "data-testid": "bilder-gewaehlt", children: gewaehlt.map((bild) => /* @__PURE__ */ jsxs17("li", { children: [
-      bild.title,
+      /* @__PURE__ */ jsx17(Kachel, { quelle: quelleVon(bild), alt: bild.title }),
+      /* @__PURE__ */ jsx17("span", { className: "szenen-bildwahl__titel", children: bild.title }),
       /* @__PURE__ */ jsx17(
         "button",
         {
@@ -10419,7 +10531,10 @@ var DeriveArea = ({ port, contextId }) => {
   );
   const gewaehlt = regeln.status === "ready" ? regeln.value.find((r) => r.versionId === policyVersionId) ?? null : null;
   async function starten(folgt) {
-    if (!gewaehlt) return;
+    if (!gewaehlt) {
+      setMeldung("Bitte zuerst eine Rekonstruktionsregel waehlen \u2014 ohne sie ist kein Lauf reproduzierbar (D-03).");
+      return;
+    }
     setLaeuft(true);
     setMeldung(null);
     setLauf(null);
@@ -10796,8 +10911,8 @@ var SzenenView = ({
   initialArea,
   onAreaChange
 }) => {
-  const bereiche = useMemo3(() => areasFor(port), [port]);
-  const faehig = useMemo3(() => capabilitiesOf(port), [port]);
+  const bereiche = useMemo4(() => areasFor(port), [port]);
+  const faehig = useMemo4(() => capabilitiesOf(port), [port]);
   const [aktiv, setAktiv] = useState16(() => resolveArea(port, initialArea));
   const wechsle = (id) => {
     setAktiv(id);
@@ -10853,6 +10968,17 @@ var SzenenView = ({
 };
 
 // src/lib/szenen/flowTextGenerationPort.ts
+function alsFlowTextZugang(sdk) {
+  return async (prompt, options) => {
+    const antwort = await sdk(prompt, options);
+    if (typeof antwort?.text !== "string") {
+      throw new Error(
+        `Flow.generate.text lieferte kein { text: string }, sondern ${antwort === null || antwort === void 0 ? String(antwort) : typeof antwort}: ${JSON.stringify(antwort)?.slice(0, 200)}`
+      );
+    }
+    return antwort.text;
+  };
+}
 function createFlowTextGenerationPort(generateText, options = {}) {
   const provider = options.provider ?? "flow";
   const modelId = options.modelId ?? "flow.generate.text";
@@ -13962,6 +14088,7 @@ function createHfImageStore(options) {
   const basisMs = options.leseBasisMs ?? 400;
   const schlafen = options.schlafen ?? warten;
   const abgelegt = /* @__PURE__ */ new Map();
+  const vorschauen = /* @__PURE__ */ new Map();
   const bekanntePfade = /* @__PURE__ */ new Set();
   let gefalteterBestand = null;
   let laufenderAbgleich = null;
@@ -13985,7 +14112,7 @@ function createHfImageStore(options) {
     }
     return laufenderAbgleich;
   }
-  return {
+  const speicher = {
     bestand: bestandAbgleichen,
     async putWithId(id, base64, mimeType, titel) {
       const echterTyp = typAusBytes(base64, mimeType);
@@ -14004,6 +14131,38 @@ function createHfImageStore(options) {
       }, []);
       abgelegt.set(id, { data: base64, mimeType: echterTyp });
     },
+    async preview(id) {
+      const bekannt = vorschauen.get(id);
+      if (bekannt) return bekannt;
+      const eben = abgelegt.get(id);
+      if (eben) {
+        const quelle2 = `data:${eben.mimeType};base64,${eben.data}`;
+        vorschauen.set(id, quelle2);
+        return quelle2;
+      }
+      const zustand = await bestandAbgleichen();
+      const eintrag = zustand.metadata.find((e) => e.id === id);
+      if (eintrag?.hasThumb && eintrag.filename) {
+        const klein = await hfLoadImageAsBase64(
+          id,
+          token,
+          void 0,
+          eintrag.filename,
+          void 0,
+          eintrag.mimeType,
+          true
+        );
+        if (klein) {
+          const quelle2 = `data:${eintrag.mimeType || "image/jpeg"};base64,${klein}`;
+          vorschauen.set(id, quelle2);
+          return quelle2;
+        }
+      }
+      const voll = await speicher.resolve(id);
+      const quelle = `data:${voll.mimeType};base64,${voll.data}`;
+      vorschauen.set(id, quelle);
+      return quelle;
+    },
     async resolve(id, mimeType) {
       const eben = abgelegt.get(id);
       if (eben) return eben;
@@ -14041,6 +14200,47 @@ function createHfImageStore(options) {
       );
     }
   };
+  return speicher;
+}
+
+// src/lib/szenen/libraryItems.ts
+var LOCATOR = /^(.+)-(\d+)$/;
+function locatorTeile(mediaRef) {
+  const treffer = LOCATOR.exec(mediaRef);
+  if (!treffer) return { stamm: mediaRef, position: null };
+  return { stamm: treffer[1], position: Number(treffer[2]) };
+}
+function gruppiereZuItems(bilder) {
+  const gruppen = /* @__PURE__ */ new Map();
+  for (const bild of bilder) {
+    const { stamm } = locatorTeile(bild.mediaRef);
+    const vorhanden = gruppen.get(stamm);
+    if (vorhanden) vorhanden.push(bild);
+    else gruppen.set(stamm, [bild]);
+  }
+  const items = [...gruppen.entries()].map(([stamm, mitglieder]) => {
+    const sortiert = [...mitglieder].sort((a, b) => {
+      const pa = locatorTeile(a.mediaRef).position ?? 0;
+      const pb = locatorTeile(b.mediaRef).position ?? 0;
+      return pa - pb;
+    });
+    const erstes = sortiert[0];
+    const itemRef = sortiert.length === 1 ? erstes.mediaRef : stamm;
+    const juengstes = sortiert.reduce(
+      (max, b) => Math.max(max, b.timestamp ?? 0),
+      0
+    );
+    return {
+      item: {
+        itemRef,
+        title: erstes.itemTitle?.trim() || erstes.title || itemRef,
+        images: sortiert.map(({ timestamp: _t, itemTitle: _i, ...bild }) => bild)
+      },
+      juengstes
+    };
+  });
+  items.sort((a, b) => b.juengstes - a.juengstes);
+  return items.map((e) => e.item);
 }
 
 // src/lib/szenen/hfImageLibrary.ts
@@ -14048,13 +14248,22 @@ function fehler2(nachricht, retryable = false) {
   return { kind: "error", message: nachricht, retryable };
 }
 function alsBild(eintrag) {
+  const { position } = locatorTeile(eintrag.id);
+  const werk = eintrag.prompt?.trim() || "";
   return {
     mediaRef: eintrag.id,
-    // Der Prompt ist der einzige menschenlesbare Text, den ein Bild dort trägt.
-    // Fehlt er, ist die Kennung ehrlicher als ein erfundener Name.
-    title: eintrag.prompt?.trim() || eintrag.id,
+    // Innerhalb eines mehrbildigen Werkes tragen alle Einträge denselben
+    // Prompt — der Abgleich schreibt ihn je Bild aus derselben Library-Zeile.
+    // Deshalb bekommt die Kachel dort die Position dazu, sonst stünde
+    // vierzehnmal derselbe Satz.
+    title: position === null ? werk || eintrag.id : `${werk || eintrag.id} \xB7 Bild ${position + 1}`,
     mimeType: eintrag.mimeType || "image/jpeg",
-    thumbUrl: null
+    // Kein `thumbUrl`: Die Datei liegt auf HF hinter einem Token, und ein
+    // `<img src>` käme dort nicht durch. Die Quelle entsteht über
+    // `loadPreview()` — und nur für die Kacheln, die wirklich gezeigt werden.
+    thumbUrl: null,
+    itemTitle: werk || null,
+    ...typeof eintrag.timestamp === "number" ? { timestamp: eintrag.timestamp } : {}
   };
 }
 function createHfImageLibrary(options) {
@@ -14065,15 +14274,14 @@ function createHfImageLibrary(options) {
     ...options.now ? { now: options.now } : {}
   });
   return {
-    async listImages(query) {
+    async listItems(query) {
       try {
         const zustand = await store.bestand();
         const eintraege = zustand?.metadata ?? [];
+        const items = gruppiereZuItems(eintraege.map(alsBild));
         const gesucht = query?.search?.trim().toLowerCase();
-        const gefiltert = gesucht ? eintraege.filter((e) => (e.prompt ?? "").toLowerCase().includes(gesucht) || e.id.toLowerCase().includes(gesucht)) : eintraege;
-        const sortiert = [...gefiltert].sort((a, b) => (b.timestamp ?? 0) - (a.timestamp ?? 0));
-        const begrenzt = query?.limit ? sortiert.slice(0, query.limit) : sortiert;
-        return { kind: "ok", value: begrenzt.map(alsBild) };
+        const gefiltert = gesucht ? items.filter((i) => i.title.toLowerCase().includes(gesucht) || i.itemRef.toLowerCase().includes(gesucht)) : items;
+        return { kind: "ok", value: query?.limit ? gefiltert.slice(0, query.limit) : gefiltert };
       } catch (error) {
         return fehler2(
           `Der Bildbestand konnte nicht gelesen werden: ${error instanceof Error ? error.message : String(error)}`,
@@ -14081,6 +14289,16 @@ function createHfImageLibrary(options) {
         );
       }
     },
+    async loadPreview(mediaRef) {
+      try {
+        return { kind: "ok", value: await store.preview(mediaRef) };
+      } catch (error) {
+        return fehler2(
+          `Die Vorschau von ${mediaRef} ist nicht ladbar: ${error instanceof Error ? error.message : String(error)}`,
+          true
+        );
+      }
+    },
     async resolveImage(mediaRef, mimeTypeHinweis) {
       try {
         const bild = await store.resolve(mediaRef, mimeTypeHinweis);
@@ -14093,10 +14311,13 @@ function createHfImageLibrary(options) {
       const id = newImageId();
       try {
         await store.putWithId(id, input.data, input.mime_type, input.title);
-        return {
-          kind: "ok",
-          value: { mediaRef: id, title: input.title, mimeType: input.mime_type, thumbUrl: null }
+        const abgelegt = {
+          mediaRef: id,
+          title: input.title,
+          mimeType: input.mime_type,
+          thumbUrl: null
         };
+        return { kind: "ok", value: abgelegt };
       } catch (error) {
         return fehler2(
           `Das Bild konnte nicht abgelegt werden: ${error instanceof Error ? error.message : String(error)}`,
@@ -14824,6 +15045,7 @@ export {
   preferredHeadRevisionOf,
   collectPromptRuns,
   findPromptRun,
+  ladeVorschauen,
   simulatedAnswerFor,
   SIMULATION_PROVIDER,
   createSimulationTextGenerationPort,
@@ -14844,6 +15066,7 @@ export {
   createSimulationSceneDerivationPort,
   runSceneDerivation,
   SzenenView,
+  alsFlowTextZugang,
   createFlowTextGenerationPort,
   CATALOGUE_TYPES,
   publishedHeadsOf,
@@ -14896,6 +15119,8 @@ export {
   bildPfad,
   typAusBytes,
   createHfImageStore,
+  locatorTeile,
+  gruppiereZuItems,
   createHfImageLibrary,
   FLOW_EXECUTION_PATH,
   createFlowImageProvider,

package/dist/index.d.mts

@@ -6,7 +6,7 @@ import { Node, Edge } from '@xyflow/react';
 import * as zustand_vanilla from 'zustand/vanilla';
 import { F as FeatureSliceId, b as SliceContract, a as PersistenceDescriptor, W as WorkspacePersistence, P as PersistedSlice, L as LoadResult, f as WriteResult, e as WorkspaceTabId, C as CommandResult, R as RequestContext, Q as QueryResult } from './contracts-DdYOMBl9.mjs';
 
-var version = "4.0.0";
+var version = "5.0.0";
 
 declare function useOnClickOutside(ref: RefObject<HTMLElement | null>, handler: (e: MouseEvent | TouchEvent) => void): void;
 

package/dist/index.d.ts

@@ -6,7 +6,7 @@ import { Node, Edge } from '@xyflow/react';
 import * as zustand_vanilla from 'zustand/vanilla';
 import { F as FeatureSliceId, b as SliceContract, a as PersistenceDescriptor, W as WorkspacePersistence, P as PersistedSlice, L as LoadResult, f as WriteResult, e as WorkspaceTabId, C as CommandResult, R as RequestContext, Q as QueryResult } from './contracts-DdYOMBl9.js';
 
-var version = "4.0.0";
+var version = "5.0.0";
 
 declare function useOnClickOutside(ref: RefObject<HTMLElement | null>, handler: (e: MouseEvent | TouchEvent) => void): void;