fix(core): allow null as key-code

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>

packages/core/src/composables/useKeyPress.ts

@@ -10,7 +10,7 @@ function isInputDOMNode(event: KeyboardEvent): boolean {
   return ['INPUT', 'SELECT', 'TEXTAREA'].includes(target?.nodeName) || hasAttribute || !!closest
 }
 
-export default (keyFilter: MaybeRef<KeyFilter>, onChange?: (keyPressed: boolean) => void): Ref<boolean> => {
+export default (keyFilter: MaybeRef<KeyFilter | null>, onChange?: (keyPressed: boolean) => void): Ref<boolean> => {
   const window = useWindow()
 
   let isPressed = $ref(unref(keyFilter) === true)
@@ -27,27 +27,29 @@ export default (keyFilter: MaybeRef<KeyFilter>, onChange?: (keyPressed: boolean)
       return
     }
 
-    onKeyStroke(
-      unrefKeyFilter,
-      (e) => {
-        if (isInputDOMNode(e)) return
+    if (unrefKeyFilter) {
+      onKeyStroke(
+        unrefKeyFilter,
+        (e) => {
+          if (isInputDOMNode(e)) return
 
-        e.preventDefault()
-        isPressed = true
-      },
-      { eventName: 'keydown' },
-    )
+          e.preventDefault()
+          isPressed = true
+        },
+        { eventName: 'keydown' },
+      )
 
-    onKeyStroke(
-      unrefKeyFilter,
-      (e) => {
-        if (isInputDOMNode(e)) return
+      onKeyStroke(
+        unrefKeyFilter,
+        (e) => {
+          if (isInputDOMNode(e)) return
 
-        e.preventDefault()
-        isPressed = false
-      },
-      { eventName: 'keyup' },
-    )
+          e.preventDefault()
+          isPressed = false
+        },
+        { eventName: 'keyup' },
+      )
+    }
   })
 
   if (typeof window.addEventListener !== 'undefined') {

packages/core/src/types/flow.ts

@@ -113,10 +113,10 @@ export interface FlowProps {
   /** @deprecated use {@link ConnectionLineOptions.style} */
   connectionLineStyle?: CSSProperties | null
   connectionLineOptions?: ConnectionLineOptions
-  deleteKeyCode?: KeyFilter
-  selectionKeyCode?: KeyFilter
-  multiSelectionKeyCode?: KeyFilter
-  zoomActivationKeyCode?: KeyFilter
+  deleteKeyCode?: KeyFilter | null
+  selectionKeyCode?: KeyFilter | null
+  multiSelectionKeyCode?: KeyFilter | null
+  zoomActivationKeyCode?: KeyFilter | null
   snapToGrid?: boolean
   snapGrid?: SnapGrid
   onlyRenderVisibleElements?: boolean

packages/core/src/types/store.ts

@@ -65,10 +65,10 @@ export interface State extends Omit<FlowOptions, 'id' | 'modelValue'> {
   userSelectionActive: boolean
   multiSelectionActive: boolean
 
-  deleteKeyCode: KeyFilter
-  selectionKeyCode: KeyFilter
-  multiSelectionKeyCode: KeyFilter
-  zoomActivationKeyCode: KeyFilter
+  deleteKeyCode: KeyFilter | null
+  selectionKeyCode: KeyFilter | null
+  multiSelectionKeyCode: KeyFilter | null
+  zoomActivationKeyCode: KeyFilter | null
 
   connectionMode: ConnectionMode
   connectionLineOptions: ConnectionLineOptions