SYNC: fixed diagram references when using zoom

packages/web/src/designer/Designer.svelte

@@ -638,7 +638,7 @@
 
   function recomputeReferencePositions() {
     for (const ref of Object.values(referenceRefs) as any[]) {
-      if (ref) ref.recomputePosition();
+      if (ref) ref.recomputePosition(zoomKoef);
     }
   }
 
@@ -915,6 +915,7 @@
         onRemoveReference={removeReference}
         designer={value}
         {settings}
+        {zoomKoef}
       />
     {/each}
     <!-- 

packages/web/src/designer/DiagramDesigner.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import Designer from './Designer.svelte';
   import DiagramDesignerReference from './DiagramDesignerReference.svelte';
+  // import QueryDesignerReference from './QueryDesignerReference.svelte';
 
   export let columnFilter;
 </script>

packages/web/src/designer/DiagramDesignerReference.svelte

@@ -9,6 +9,8 @@
   export let domTables;
   export let settings;
 
+  export let zoomKoef;
+
   let src = null;
   let dst = null;
 
@@ -19,7 +21,7 @@
   const arhi = 12;
   const arpad = 3;
 
-  export function recomputePosition() {
+  export function recomputePosition(zoomKoef) {
     const { designerId, sourceId, targetId, columns, joinType } = reference;
 
     /** @type {DomTableRef} */
@@ -31,6 +33,17 @@
     const targetRect = targetTable.getRect();
     if (!sourceRect || !targetRect) return null;
 
+    if (zoomKoef > 0) {
+      sourceRect.left /= zoomKoef;
+      sourceRect.right /= zoomKoef;
+      sourceRect.top /= zoomKoef;
+      sourceRect.bottom /= zoomKoef;
+      targetRect.left /= zoomKoef;
+      targetRect.right /= zoomKoef;
+      targetRect.top /= zoomKoef;
+      targetRect.bottom /= zoomKoef;
+    }
+
     src = {
       x: (sourceRect.left + sourceRect.right) / 2,
       y: (sourceRect.top + sourceRect.bottom) / 2,
@@ -47,7 +60,7 @@
 
   $: {
     domTables;
-    recomputePosition();
+    recomputePosition(zoomKoef);
   }
 </script>