@tangle-network/agent-app 0.23.0 → 0.25.0

package/dist/{DesignCanvas-JTSAL6KX.js → DesignCanvas-MA5EH324.js}

@@ -1,10 +1,10 @@
 import {
   DesignCanvas,
   DesignCanvas_default
-} from "./chunk-2W4YCAFH.js";
+} from "./chunk-LPAVBGVY.js";
 import "./chunk-JZAJE3JL.js";
 export {
   DesignCanvas,
   DesignCanvas_default as default
 };
-//# sourceMappingURL=DesignCanvas-JTSAL6KX.js.map
+//# sourceMappingURL=DesignCanvas-MA5EH324.js.map

package/dist/DesignCanvasEditor-YLCO7I5I.js

@@ -0,0 +1,9 @@
+import {
+  DesignCanvasEditor
+} from "./chunk-FSUR2752.js";
+import "./chunk-LPAVBGVY.js";
+import "./chunk-JZAJE3JL.js";
+export {
+  DesignCanvasEditor
+};
+//# sourceMappingURL=DesignCanvasEditor-YLCO7I5I.js.map

package/dist/{chunk-NSKJFV4Y.js → chunk-FSUR2752.js}

@@ -8,11 +8,14 @@ import {
   multiSetAttrsCommand,
   setAttrsCommand,
   ungroupElementCommand
-} from "./chunk-2W4YCAFH.js";
+} from "./chunk-LPAVBGVY.js";
 import {
+  SCENE_SCHEMA_VERSION,
+  bleedAwareExportBounds,
   boundsIntersect,
   elementAabb,
-  findElement
+  findElement,
+  scaleForPreset
 } from "./chunk-JZAJE3JL.js";
 
 // src/design-canvas-react/components/Workspace.tsx
@@ -26,6 +29,121 @@ import {
 } from "react";
 import { Stage, Layer as Layer4, Rect as Rect2, Group as Group2 } from "react-konva";
 
+// src/design-canvas-react/export-math.ts
+function isExportHiddenNodeName(name) {
+  return name.startsWith("overlay:") || name === "Transformer";
+}
+function resolveExportParams(page, opts) {
+  const includeBleed = opts.preset !== void 0 ? opts.preset.includeBleed : opts.includeBleed ?? false;
+  const cropRect = bleedAwareExportBounds(page, includeBleed);
+  const pixelRatio = opts.preset !== void 0 ? scaleForPreset(opts.preset, cropRect) : opts.pixelRatio ?? 1;
+  const format = opts.preset !== void 0 ? opts.preset.format : opts.format;
+  const mimeType = format === "jpeg" ? "image/jpeg" : "image/png";
+  return {
+    cropRect,
+    pixelRatio,
+    mimeType,
+    quality: format === "jpeg" ? 0.92 : void 0
+  };
+}
+function identifyTaintedSrc(imageSrcs) {
+  for (const { src } of imageSrcs) {
+    if (isCrossOriginSrc(src)) return src;
+  }
+  return null;
+}
+function isCrossOriginSrc(src) {
+  return /^https?:\/\//i.test(src);
+}
+function documentCropToStageCoords(cropRect, stageScale, stageX, stageY) {
+  return {
+    x: stageX + cropRect.x * stageScale,
+    y: stageY + cropRect.y * stageScale,
+    width: cropRect.width * stageScale,
+    height: cropRect.height * stageScale
+  };
+}
+
+// src/design-canvas-react/export.ts
+async function exportPageDataUrl(stage, page, opts) {
+  const { cropRect, pixelRatio, mimeType, quality } = resolveExportParams(page, opts);
+  const imageSrcs = collectImageSrcs(stage);
+  const hiddenNodes = [];
+  for (const layer of stage.getLayers()) {
+    for (const node of layer.getChildren()) {
+      const name = node.name();
+      if (isExportHiddenNodeName(name) && node.visible()) {
+        node.visible(false);
+        hiddenNodes.push(node);
+      }
+    }
+  }
+  const stageScale = stage.scaleX();
+  const stageCrop = documentCropToStageCoords(cropRect, stageScale, stage.x(), stage.y());
+  let dataUrl;
+  try {
+    dataUrl = stage.toDataURL({
+      mimeType,
+      ...quality !== void 0 ? { quality } : {},
+      pixelRatio,
+      x: stageCrop.x,
+      y: stageCrop.y,
+      width: stageCrop.width,
+      height: stageCrop.height
+    });
+  } catch (err) {
+    for (const node of hiddenNodes) {
+      node.visible(true);
+    }
+    if (err instanceof Error && err.name === "SecurityError") {
+      const taintedSrc = identifyTaintedSrc(imageSrcs);
+      if (taintedSrc !== null) {
+        throw new Error(
+          `Export failed: image source is CORS-tainted and cannot be read by the canvas. Offending src: "${taintedSrc}". Ensure the image is served with Access-Control-Allow-Origin or use a proxied /api/ path.`
+        );
+      }
+      throw new Error(
+        `Export failed: a canvas SecurityError occurred but no cross-origin image src could be identified. The stage may contain a tainted video or image loaded without CORS headers.`
+      );
+    }
+    throw err;
+  }
+  for (const node of hiddenNodes) {
+    node.visible(true);
+  }
+  return dataUrl;
+}
+function collectImageSrcs(stage) {
+  const result = [];
+  for (const layer of stage.getLayers()) {
+    for (const node of layer.getChildren()) {
+      const src = node.getAttr("src");
+      if (typeof src === "string" && src.length > 0) {
+        result.push({ name: node.name(), src });
+      }
+    }
+  }
+  return result;
+}
+function exportDocumentJson(document) {
+  if (document.schemaVersion !== SCENE_SCHEMA_VERSION) {
+    throw new Error(
+      `exportDocumentJson: document schemaVersion is ${document.schemaVersion}, expected ${SCENE_SCHEMA_VERSION} \u2014 upgrade the document before exporting`
+    );
+  }
+  return JSON.stringify(document, null, 2);
+}
+function downloadDataUrl(dataUrl, filename) {
+  if (typeof globalThis.document === "undefined") return;
+  const a = globalThis.document.createElement("a");
+  a.href = dataUrl;
+  a.download = filename;
+  a.style.display = "none";
+  globalThis.document.body.appendChild(a);
+  a.click();
+  globalThis.document.body.removeChild(a);
+}
+
 // src/design-canvas-react/engine/snap.ts
 var KIND_PRIORITY = {
   "guide": 0,
@@ -310,8 +428,8 @@ function normalizeMarquee(startX, startY, endX, endY) {
   };
 }
 function computeTextOverlayPosition(input) {
-  const left = input.panX + input.elementX * input.zoom + input.stageLeft;
-  const top = input.panY + input.elementY * input.zoom + input.stageTop;
+  const left = input.panX + input.elementX * input.zoom;
+  const top = input.panY + input.elementY * input.zoom;
   return {
     left,
     top,
@@ -883,7 +1001,6 @@ function InlineTextEditor({
   zoom,
   panX,
   panY,
-  stageRect,
   onCommit,
   onCancel
 }) {
@@ -897,8 +1014,6 @@ function InlineTextEditor({
     zoom,
     panX,
     panY,
-    stageLeft: stageRect.left,
-    stageTop: stageRect.top,
     elementFontSize: element.fontSize
   });
   useEffect3(() => {
@@ -945,8 +1060,11 @@ function InlineTextEditor({
         lineHeight: element.lineHeight,
         letterSpacing: element.letterSpacing * zoom,
         color: element.fill,
-        background: "rgba(255,255,255,0.95)",
-        border: "2px solid #3b82f6",
+        // Neutral token surface rather than a forced white: a white fill makes
+        // light text invisible while editing. The token surface stays legible
+        // for any text color and matches the editor chrome.
+        background: "var(--bg-input)",
+        border: "2px solid var(--brand-primary)",
         borderRadius: 2,
         padding: 2,
         resize: "none",
@@ -973,12 +1091,12 @@ function WorkspaceView({
   canWrite,
   onApplyOperations,
   onSelectionChange,
-  renderAgentPanel,
-  renderSidePanel,
   className,
   stack,
   activePage,
   onFitRef,
+  onExport,
+  onExportRef,
   fitOnMount = true,
   onReady
 }) {
@@ -1024,6 +1142,20 @@ function WorkspaceView({
       if (onFitRef.current !== null) onFitRef.current = null;
     };
   });
+  useEffect4(() => {
+    if (!onExportRef || !onExport) return;
+    onExportRef.current = ({ format, pixelRatio }) => {
+      const stage = stageRef.current;
+      if (!stage) return;
+      void (async () => {
+        const dataUrl = await exportPageDataUrl(stage, activePage, { format, pixelRatio });
+        await onExport({ pageId: activePageId, format, dataUrl, pixelRatio });
+      })();
+    };
+    return () => {
+      if (onExportRef.current !== null) onExportRef.current = null;
+    };
+  });
   const gestureRef = useRef4("idle");
   const panOriginRef = useRef4({ screenX: 0, screenY: 0, panX: 0, panY: 0 });
   const [marquee, setMarquee] = useState2(NO_MARQUEE);
@@ -1378,7 +1510,6 @@ function WorkspaceView({
     [selectedElementIds, activePage]
   );
   const editingTextElement = editingElementId ? findElement(activePage, editingElementId)?.element ?? null : null;
-  const stageRect = containerRef.current?.getBoundingClientRect() ?? { left: 0, top: 0 };
   const dpr = typeof window !== "undefined" ? window.devicePixelRatio : 1;
   const pageScreenX = panX;
   const pageScreenY = panY;
@@ -1390,7 +1521,7 @@ function WorkspaceView({
   return /* @__PURE__ */ jsxs3(
     "div",
     {
-      className: `design-canvas-workspace relative overflow-hidden bg-[#1a1a1a] outline-none ${className ?? ""}`,
+      className: `design-canvas-workspace relative overflow-hidden bg-[var(--canvas-backdrop,#1a1a1a)] outline-none ${className ?? ""}`,
       ref: containerRef,
       tabIndex: 0,
       onWheel: handleWheel,
@@ -1401,7 +1532,6 @@ function WorkspaceView({
       onKeyUp: handleKeyUp,
       style: { cursor: spaceHeldRef.current ? "grab" : "default" },
       children: [
-        renderSidePanel && /* @__PURE__ */ jsx6("div", { className: "absolute left-0 top-0 bottom-0 z-20 w-60 pointer-events-auto", children: renderSidePanel() }),
         /* @__PURE__ */ jsxs3(
           Stage,
           {
@@ -1523,12 +1653,10 @@ function WorkspaceView({
             zoom,
             panX,
             panY,
-            stageRect: { left: stageRect.left, top: stageRect.top },
             onCommit: handleTextCommit,
             onCancel: handleTextCancel
           }
-        ),
-        renderAgentPanel && /* @__PURE__ */ jsx6("div", { className: "absolute right-0 top-0 bottom-0 z-20 w-80 pointer-events-auto", children: renderAgentPanel({ selectedElements, activePageId }) })
+        )
       ]
     }
   );
@@ -1563,8 +1691,6 @@ function Workspace(props) {
       canWrite: props.canWrite,
       onApplyOperations: props.onApplyOperations,
       onSelectionChange: props.onSelectionChange,
-      renderAgentPanel: props.renderAgentPanel,
-      renderSidePanel: props.renderSidePanel,
       className: props.className
     }
   );
@@ -1722,9 +1848,9 @@ function DesignCanvasEditor(props) {
             canWrite: ctx.canWrite,
             onApplyOperations: props.onApplyOperations,
             onSelectionChange: props.onSelectionChange,
-            renderAgentPanel: props.renderAgentPanel,
-            renderSidePanel: props.renderSidePanel,
             onFitRef: ctx.onFitRef,
+            onExport: props.onExport,
+            onExportRef: ctx.onExportRef,
             fitOnMount: ctx.fitOnMount,
             onReady: ctx.onReady
           }
@@ -1742,6 +1868,14 @@ export {
   nudgeDelta,
   DUPLICATE_OFFSET,
   createZoomPanMath,
+  isExportHiddenNodeName,
+  resolveExportParams,
+  identifyTaintedSrc,
+  isCrossOriginSrc,
+  documentCropToStageCoords,
+  exportPageDataUrl,
+  exportDocumentJson,
+  downloadDataUrl,
   bakeRectTransform,
   bakeLineTransform,
   bakeTextTransform,
@@ -1752,4 +1886,4 @@ export {
   Workspace,
   DesignCanvasEditor
 };
-//# sourceMappingURL=chunk-NSKJFV4Y.js.map
+//# sourceMappingURL=chunk-FSUR2752.js.map