@likec4/diagram 1.50.0 → 1.51.0

package/dist/navigationpanel/comparepanel/DriftsSummary.js

@@ -101,7 +101,7 @@ function DriftsSummary() {
   if (view.length === 0 && nodes.length === 0 && edges.length === 0) {
     return null;
   }
-  return /* @__PURE__ */ jsx(AnimatePresence, { propagate: true, mode: "wait", children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(AnimatePresence, { children: /* @__PURE__ */ jsxs(
     m.div,
     {
       layout: "size",
@@ -120,16 +120,16 @@ function DriftsSummary() {
       }),
       children: [
         hasAtLeast(view, 1) && /* @__PURE__ */ jsx(ViewDrifts, { drifts: view }),
-        nodes.length > 0 && /* @__PURE__ */ jsxs(m.div, { layout: "size", children: [
+        nodes.length > 0 && /* @__PURE__ */ jsxs(m.div, { layout: true, children: [
           /* @__PURE__ */ jsx(SectionHeader, { children: "Elements:" }),
-          /* @__PURE__ */ jsx(m.div, { layout: "size", className: vstack({ mt: "2", gap: "2" }), children: map(
+          /* @__PURE__ */ jsx("div", { className: vstack({ mt: "2", gap: "2" }), children: map(
             nodes,
             (node) => /* @__PURE__ */ jsx(NodeDrifts, { ...node, ...handlers }, node.id)
           ) })
         ] }, `nodes-drifts`),
-        edges.length > 0 && /* @__PURE__ */ jsxs(m.div, { layout: "size", children: [
+        edges.length > 0 && /* @__PURE__ */ jsxs(m.div, { layout: true, children: [
           /* @__PURE__ */ jsx(SectionHeader, { children: "Relationships:" }),
-          /* @__PURE__ */ jsx(m.div, { layout: "size", className: vstack({ mt: "2", gap: "2" }), children: map(edges, (edge) => /* @__PURE__ */ jsx(EdgeDrifts, { ...edge, ...handlers }, edge.edgeId)) })
+          /* @__PURE__ */ jsx("div", { className: vstack({ mt: "2", gap: "2" }), children: map(edges, (edge) => /* @__PURE__ */ jsx(EdgeDrifts, { ...edge, ...handlers }, edge.edgeId)) })
         ] }, `edges-drifts`)
       ]
     },
@@ -153,6 +153,7 @@ function ViewDrifts({ drifts }) {
   ) });
 }
 function NodeDrifts({ id, name, drifts, ...handlers }) {
+  const key = `node-drifts-${id}`;
   return /* @__PURE__ */ jsxs(
     DriftsGroup,
     {
@@ -178,28 +179,29 @@ function NodeDrifts({ id, name, drifts, ...handlers }) {
             children: name
           }
         ),
-        map(drifts, (drift) => /* @__PURE__ */ jsx(DriftLabel, { children: drift }, id + drift))
+        map(drifts, (drift, i) => /* @__PURE__ */ jsx(DriftLabel, { children: drift }, key + drift + i))
       ]
     },
-    `node-drifts-${id}`
+    key
   );
 }
 function EdgeDrifts({ edgeId, drifts, ...handlers }) {
+  const key = `edge-drifts-${edgeId}`;
   return /* @__PURE__ */ jsx(
     DriftsGroup,
     {
       "data-drift-type": "edge",
       "data-drift-id": edgeId,
       ...handlers,
-      children: map(drifts, (drift) => /* @__PURE__ */ jsx(
+      children: map(drifts, (drift, i) => /* @__PURE__ */ jsx(
         DriftLabel,
         {
           children: drift
         },
-        edgeId + drift
+        key + drift + i
       ))
     },
-    `edge-drifts-${edgeId}`
+    key
   );
 }
 const DriftsGroup = styled(m.div, {
@@ -220,7 +222,7 @@ const DriftsGroup = styled(m.div, {
   defaultProps: {
     className: "group",
     variants,
-    layout: "size",
+    layout: true,
     initial: "initial",
     animate: "animate",
     exit: "exit"

package/dist/navigationpanel/walkthrough/DynamicViewControls.js

@@ -32,14 +32,14 @@ const TriggerWalkthroughButton = forwardRef((props, ref) => /* @__PURE__ */ jsx(
   }
 ));
 function StartWalkthroughButton() {
-  const { enableReadOnly, enableCompareWithLatest } = useEnabledFeatures();
+  const { enableCompareWithLatest } = useEnabledFeatures();
   const diagram = useDiagram();
   const actor = useNavigationActor();
   let tooltipLabel = "Start Dynamic View Walkthrough";
   switch (true) {
-    case !enableReadOnly:
-      tooltipLabel = "Walkthrough not available in Edit mode";
-      break;
+    // case !enableReadOnly:
+    //   tooltipLabel = 'Walkthrough not available in Edit mode'
+    //   break
     case enableCompareWithLatest:
       tooltipLabel = "Walkthrough not available when Compare is active";
       break;
@@ -57,7 +57,7 @@ function StartWalkthroughButton() {
       exit: { opacity: 0, translateX: -20 },
       size: "compact-xs",
       h: 26,
-      disabled: !enableReadOnly || enableCompareWithLatest,
+      disabled: enableCompareWithLatest,
       classNames: {
         label: css({
           display: {