@likec4/diagram 1.28.0 → 1.28.1

package/dist/overlays/relationships-browser/hooks.js

@@ -2,11 +2,11 @@ import { nonNullable } from '@likec4/core';
 import { useCallbackRef } from '@mantine/hooks';
 import { useSelector } from '@xstate/react';
 import { shallowEqual } from 'fast-equals';
-import { createContext, useMemo, useContext } from 'react';
+import { r as reactExports } from '../../_virtual/index.js';
 
-const RelationshipsBrowserActorContext = createContext(null);
+const RelationshipsBrowserActorContext = reactExports.createContext(null);
 function useRelationshipsBrowserActor() {
-  return nonNullable(useContext(RelationshipsBrowserActorContext), "No RelationshipsBrowserActorContext");
+  return nonNullable(reactExports.useContext(RelationshipsBrowserActorContext), "No RelationshipsBrowserActorContext");
 }
 function useRelationshipsBrowserState(selector, compare = shallowEqual) {
   const actor = useRelationshipsBrowserActor();
@@ -14,7 +14,7 @@ function useRelationshipsBrowserState(selector, compare = shallowEqual) {
 }
 function useRelationshipsBrowser() {
   const actor = useRelationshipsBrowserActor();
-  return useMemo(() => ({
+  return reactExports.useMemo(() => ({
     actor,
     get rootElementId() {
       return `relationships-browser-${actor.sessionId.replaceAll(":", "_")}`;

package/dist/overlays/relationships-browser/layout.js

@@ -1,4 +1,4 @@
-import { useMemo } from 'react';
+import { r as reactExports } from '../../_virtual/index.js';
 import dagre from '@dagrejs/dagre';
 import { toArray, invariant, ifind, DefaultMap } from '@likec4/core';
 import { pipe, concat, map, groupBy, prop, forEachObj, filter, mapToObj, find, only, unique, tap, reduce, sortBy } from 'remeda';
@@ -454,7 +454,7 @@ function layoutRelationshipsView(data, scope) {
 }
 function useRelationshipsView(subject, viewId, scope) {
   const model = useLikeC4Model(true);
-  return useMemo(() => {
+  return reactExports.useMemo(() => {
     const view = viewId ? model.findView(viewId) : null;
     const data = layoutRelationshipsView(
       computeRelationshipsView(subject, model, viewId, scope),

package/dist/overlays/relationships-browser/useViewToNodesEdges.js

@@ -41,7 +41,6 @@ function viewToNodesEdge(view) {
       draggable: false,
       selectable: true,
       focusable: true,
-      deletable: false,
       position,
       zIndex: isCompound ? ZIndexes.Compound : ZIndexes.Element,
       style: {
@@ -140,7 +139,7 @@ function viewToNodesEdge(view) {
       zIndex: ZIndexes.Edge,
       // selectable: selectable,
       // hidden: !visiblePredicate(edge),
-      deletable: false,
+      // deletable: false,
       data: {
         sourceFqn: edge.sourceFqn,
         targetFqn: edge.targetFqn,

package/dist/state/DiagramActorProvider.js

@@ -3,7 +3,7 @@ import { useDeepCompareEffect } from '@react-hookz/web';
 import { useActorRef, useSelector } from '@xstate/react';
 import { useStoreApi } from '@xyflow/react';
 import { shallowEqual } from 'fast-equals';
-import { useEffect } from 'react';
+import { r as reactExports } from '../_virtual/index.js';
 import { useDiagramEventHandlersRef } from '../context/DiagramEventHandlers.js';
 import { useEnabledFeatures, DiagramFeatures } from '../context/DiagramFeatures.js';
 import { DiagramActorSafeContext } from '../hooks/safeContext.js';
@@ -27,7 +27,9 @@ function DiagramActorProvider({
     diagramMachine.provide({
       actions: {
         "trigger:NavigateTo": (_, { viewId }) => {
-          handlersRef.current.onNavigateTo?.(viewId);
+          setTimeout(() => {
+            handlersRef.current.onNavigateTo?.(viewId);
+          }, 30);
         },
         "trigger:OnChange": (_, params) => {
           handlersRef.current.onChange?.(params);
@@ -61,7 +63,7 @@ function DiagramActorProvider({
   useUpdateEffect(() => {
     actorRef.send({ type: "update.inputs", inputs });
   }, [inputs]);
-  useEffect(() => {
+  reactExports.useEffect(() => {
     actorRef.send({ type: "update.features", features });
   }, [features]);
   const { xyedges, xynodes } = useViewToNodesEdges({

package/dist/state/diagram-machine.d.ts

@@ -1,6 +1,6 @@
 import { BBox, DiagramView, EdgeId, ElementNotation, Fqn, NodeId, StepEdgeId, ViewChange, ViewId, XYPoint, NonEmptyArray, Point, Color, RelationshipLineType, RelationshipArrowType } from '@likec4/core';
-import { ReactFlowInstance, useStoreApi, EdgeMarkerType, HandleType } from '@xyflow/react';
-import { EdgeChange, NodeChange, Rect, Viewport, XYPosition } from '@xyflow/system';
+import { ReactFlowInstance, useStoreApi } from '@xyflow/react';
+import { EdgeChange, NodeChange, Rect, Viewport, EdgeMarkerType, HandleType, XYPosition } from '@xyflow/system';
 import { ActorLogicFrom, ActorRef, AnyEventObject, Snapshot, StateMachine, ActorRefFromLogic, NonReducibleUnknown, EventObject, MetaObject, AnyActorLogic, ConditionalRequired, InputFrom, RequiredLogicInput, IsNotNever, MachineSnapshot, AnyActorRef, StateValue, ActionFunction, CallbackActorLogic, Values, RequiredActorOptions, GetConcreteByKey, CancelAction, StopAction } from 'xstate';
 import { Base } from '../base/types';
 import { EnabledFeatures, FeatureName } from '../context/DiagramFeatures';
@@ -2210,7 +2210,7 @@ export declare const diagramMachine: StateMachine<Context, Events, {
                     readonly params: {
                         readonly duration: 0;
                     };
-                }, "startSyncLayout", ActionFunction<Context, Events, Events, undefined, Values<{
+                }, ActionFunction<Context, Events, Events, undefined, Values<{
                     syncManualLayoutActorLogic: {
                         src: "syncManualLayoutActorLogic";
                         logic: StateMachine<Readonly< Input>, SyncLayoutEvents, {}, never, {
@@ -2463,7 +2463,7 @@ export declare const diagramMachine: StateMachine<Context, Events, {
                         }>;
                         id: "overlays";
                     };
-                }>, never, never, never, never>];
+                }>, never, never, never, never>, "startSyncLayout"];
                 readonly target: "ready";
             }, {
                 readonly target: "initializing";

package/dist/state/diagram-machine.js

@@ -332,7 +332,6 @@ const diagramMachine = setup({
             type: "xyflow:fitDiagram",
             params: { duration: 0 }
           },
-          "startSyncLayout",
           assign(({ context }) => ({
             navigationHistory: {
               currentIndex: 0,
@@ -342,7 +341,8 @@ const diagramMachine = setup({
                 viewport: { ...context.xyflow.getViewport() }
               }]
             }
-          }))
+          })),
+          "startSyncLayout"
         ],
         target: "ready"
       }, {
@@ -743,13 +743,11 @@ const diagramMachine = setup({
                   }
                 }
               });
-              enqueue.raise({ type: "fitDiagram" }, { id: "fitDiagram", delay: 80 });
             } else {
               enqueue({
                 type: "xyflow:setViewportCenter",
                 params: getBBoxCenter(event.view.bounds)
               });
-              enqueue.raise({ type: "fitDiagram", duration: 200 }, { id: "fitDiagram", delay: 25 });
             }
             enqueue.assign(updateNavigationHistory);
             enqueue.assign({
@@ -757,6 +755,7 @@ const diagramMachine = setup({
               lastOnNavigate: null
             });
             enqueue("startSyncLayout");
+            enqueue.raise({ type: "fitDiagram" }, { id: "fitDiagram", delay: 25 });
           }),
           target: "#idle"
         }