@industry-theme/principal-view-panels 0.12.75 → 0.12.77

package/dist/panels/CanvasEditorPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CanvasEditorPanel.d.ts","sourceRoot":"","sources":["../../src/panels/CanvasEditorPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,UAAU,CAAC;AAI5D,OAAO,KAAK,EAAqD,gBAAgB,EAA+C,MAAM,mCAAmC,CAAC;AAE1K,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAKxE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAkCrE;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,2BAA2B;IACzE;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,cAAc,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE3C;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEnC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC;QACrB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;QAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B,CAAC,CAAC;IAEH;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAEvC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACrC;AAED;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAoqD9D,CAAC"}
+{"version":3,"file":"CanvasEditorPanel.d.ts","sourceRoot":"","sources":["../../src/panels/CanvasEditorPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,UAAU,CAAC;AAI5D,OAAO,KAAK,EAAqD,gBAAgB,EAA+C,MAAM,mCAAmC,CAAC;AAE1K,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAKxE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAkCrE;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,2BAA2B;IACzE;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,cAAc,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE3C;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEnC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC;QACrB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;QAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B,CAAC,CAAC;IAEH;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAEvC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACrC;AAED;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAguD9D,CAAC"}

package/dist/panels.bundle.js

@@ -189158,10 +189158,13 @@ const CanvasEditorPanel = ({
     observerRef.current = new ResizeObserver(([entry]) => {
       const { width, height } = entry.contentRect;
       if (width > 0 && height > 0) {
+        console.info("[CanvasEditorPanel] ResizeObserver dimensions:", { width, height, canvasPath });
         setContainerDimensions({ width, height });
       }
     });
     observerRef.current.observe(node2);
+    const rect = node2.getBoundingClientRect();
+    console.info("[CanvasEditorPanel] Initial container rect:", { width: rect.width, height: rect.height, canvasPath });
   }, []);
   useEffect(() => {
     return () => {
@@ -189172,6 +189175,37 @@ const CanvasEditorPanel = ({
   }, []);
   const [shouldFitToNodes, setShouldFitToNodes] = useState(false);
   const [fitCounter, setFitCounter] = useState(0);
+  const initialDimensionsRef = useRef(null);
+  const dimensionStabilizeTimerRef = useRef(null);
+  useEffect(() => {
+    if (!containerDimensions || !state.canvas) return;
+    if (dimensionStabilizeTimerRef.current) {
+      clearTimeout(dimensionStabilizeTimerRef.current);
+    }
+    if (!initialDimensionsRef.current) {
+      initialDimensionsRef.current = containerDimensions;
+      return;
+    }
+    const initial = initialDimensionsRef.current;
+    const widthChange = Math.abs(containerDimensions.width - initial.width);
+    if (widthChange > 100) {
+      dimensionStabilizeTimerRef.current = setTimeout(() => {
+        console.info("[CanvasEditorPanel] Dimensions stabilized after significant change, triggering re-fit:", {
+          initial: initial.width,
+          final: containerDimensions.width,
+          change: widthChange
+        });
+        initialDimensionsRef.current = containerDimensions;
+        setFitCounter((c2) => c2 + 1);
+        setShouldFitToNodes(true);
+      }, 150);
+    }
+    return () => {
+      if (dimensionStabilizeTimerRef.current) {
+        clearTimeout(dimensionStabilizeTimerRef.current);
+      }
+    };
+  }, [containerDimensions, state.canvas]);
   const [isCarouselExpanded, setIsCarouselExpanded] = useState(false);
   const contextRef = useRef(context2);
   const actionsRef = useRef(actions);
@@ -190072,33 +190106,41 @@ const CanvasEditorPanel = ({
         ) }) : /* @__PURE__ */ jsx("div", {}),
         rightPanel: /* @__PURE__ */ jsxs("div", { ref: containerRefCallback, style: { height: "100%", width: "100%", background: theme2.colors.background, display: "flex", flexDirection: "column" }, children: [
           /* @__PURE__ */ jsxs("div", { style: { flex: 1, minHeight: 0, position: "relative" }, children: [
-            canvasContent ? /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center" }, children: canvasContent }) : state.canvas ? /* @__PURE__ */ jsx(
-              GraphRenderer,
-              {
-                ref: graphRef,
-                canvas: state.canvas,
-                library: state.library ?? void 0,
-                spansCanvas: state.spansCanvas ?? void 0,
-                workflowSpanPattern: workflowSpanPattern ?? void 0,
-                width: "100%",
-                height: "100%",
-                editable: state.isEditMode,
-                onPendingChangesChange: (hasChanges) => {
-                  setState((prev) => ({ ...prev, hasUnsavedChanges: hasChanges }));
-                },
-                onCopy: handleCopyNodes,
-                showBackground: state.showGridLines,
-                backgroundVariant: "lines",
-                showControls: true,
-                highlightedNodeId: state.highlightedNodeId,
-                activeNodeIds,
-                fitViewToNodeIds,
-                fitViewPadding: 0.15,
+            canvasContent ? /* @__PURE__ */ jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center" }, children: canvasContent }) : state.canvas ? (() => {
+              console.info("[CanvasEditorPanel] Rendering GraphRenderer with dimensions:", {
                 containerWidth: containerDimensions == null ? void 0 : containerDimensions.width,
                 containerHeight: containerDimensions == null ? void 0 : containerDimensions.height,
-                scenarioEdges
-              }
-            ) : null,
+                fitViewToNodeIds: fitViewToNodeIds == null ? void 0 : fitViewToNodeIds.length,
+                canvasPath
+              });
+              return /* @__PURE__ */ jsx(
+                GraphRenderer,
+                {
+                  ref: graphRef,
+                  canvas: state.canvas,
+                  library: state.library ?? void 0,
+                  spansCanvas: state.spansCanvas ?? void 0,
+                  workflowSpanPattern: workflowSpanPattern ?? void 0,
+                  width: "100%",
+                  height: "100%",
+                  editable: state.isEditMode,
+                  onPendingChangesChange: (hasChanges) => {
+                    setState((prev) => ({ ...prev, hasUnsavedChanges: hasChanges }));
+                  },
+                  onCopy: handleCopyNodes,
+                  showBackground: state.showGridLines,
+                  backgroundVariant: "lines",
+                  showControls: true,
+                  highlightedNodeId: state.highlightedNodeId,
+                  activeNodeIds,
+                  fitViewToNodeIds,
+                  fitViewPadding: 0.15,
+                  containerWidth: containerDimensions == null ? void 0 : containerDimensions.width,
+                  containerHeight: containerDimensions == null ? void 0 : containerDimensions.height,
+                  scenarioEdges
+                }
+              );
+            })() : null,
             state.isEditMode && state.hasUnsavedChanges && /* @__PURE__ */ jsxs("div", { style: {
               position: "absolute",
               top: 0,