vue-flow: Can't create new edge (js)

Hi! At first thanks for your work! Can’t understand what I’m doing wrong…

    const onConnect = (params) => {
      console.log("on connect", params);
      elements.value = addEdge(params, elements.value);
    };

and the console output is:

source: "3"​
sourceHandle: null​
target: "4"​
targetHandle: ""

Uncaught TypeError: t is undefined

my custom node:

<template>
  <Handle
    type="target"
    :position="Position.Left"
    :style="{
      background: '#fff',
      border: '1px solid',
      'border-color': getCssVar('warning'),
      width: '10px',
      height: '10px',
    }"
  />
  <q-card>
    <q-card-section class="bg-warning text-white text-h6">
      {{ node.label }}
    </q-card-section>
    <q-card-section>
      <q-input label="Sec" outlined="" v-model="node.value" />
    </q-card-section>
  </q-card>
  <Handle
    type="source"
    :position="Position.Right"
    :style="{
      background: '#fff',
      border: '1px solid',
      'border-color': getCssVar('warning'),
      width: '10px',
      height: '10px',
    }"
  />
</template>

<script>
import { defineComponent, ref } from "vue";
import { Handle, Position } from "@braks/vue-flow";

import { getCssVar } from "quasar";

export default defineComponent({
  name: "MessageNode",
  components: {
    Handle,
  },
  props: ["data"],
  setup(props) {
    const node = ref(props.data);
    return {
      getCssVar,
      Position,
      node,
    };
  },
});
</script>