@likec4/diagram 1.27.3 → 1.28.1

package/src/state/diagram-machine.ts

@@ -529,7 +529,6 @@ export const diagramMachine = setup({
             type: 'xyflow:fitDiagram',
             params: { duration: 0 },
           },
-          'startSyncLayout',
           assign(({ context }) => ({
             navigationHistory: {
               currentIndex: 0,
@@ -540,6 +539,7 @@ export const diagramMachine = setup({
               }],
             },
           })),
+          'startSyncLayout',
         ],
         target: 'ready',
       }, {
@@ -947,13 +947,11 @@ export 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({
@@ -961,6 +959,7 @@ export const diagramMachine = setup({
               lastOnNavigate: null,
             })
             enqueue('startSyncLayout')
+            enqueue.raise({ type: 'fitDiagram' }, { id: 'fitDiagram', delay: 25 })
           }),
           target: '#idle',
         },

package/src/state/hotkeyActor.ts

@@ -1,4 +1,5 @@
 import { getHotkeyHandler } from '@mantine/hooks'
+import type { KeyboardEvent } from 'react'
 import { type AnyEventObject, type NonReducibleUnknown, fromCallback } from 'xstate'
 
 export type HotKeyEvent = { type: 'key.esc' | `key.arrow.${'left' | 'right'}` }
@@ -7,16 +8,25 @@ export const hotkeyActorLogic = fromCallback<AnyEventObject, NonReducibleUnknown
   sendBack: (event: HotKeyEvent) => void
 }) => {
   const escHandler = getHotkeyHandler([
-    ['Escape', () => sendBack({ type: 'key.esc' }), {
+    ['Escape', (event: KeyboardEvent) => {
+      event.stopPropagation()
+      sendBack({ type: 'key.esc' })
+    }, {
       preventDefault: true,
     }],
   ])
 
   const arrowshandler = getHotkeyHandler([
-    ['ArrowLeft', () => sendBack({ type: 'key.arrow.left' }), {
+    ['ArrowLeft', (event: KeyboardEvent) => {
+      event.stopPropagation()
+      sendBack({ type: 'key.arrow.left' })
+    }, {
       preventDefault: true,
     }],
-    ['ArrowRight', () => sendBack({ type: 'key.arrow.right' }), {
+    ['ArrowRight', (event: KeyboardEvent) => {
+      event.stopPropagation()
+      sendBack({ type: 'key.arrow.right' })
+    }, {
       preventDefault: true,
     }],
   ])