@antelopejs/dms-database 0.0.7 → 0.0.9

package/frontend-vue/app/components/QueryBuilderPanel.vue

@@ -27,6 +27,7 @@ import {
 	lineNumbers,
 	placeholder as cmPlaceholder,
 } from "@codemirror/view";
+import { useColorMode } from "@vueuse/core";
 import type { SchemaSummary } from "../composables/useDatabaseSchemas";
 import type { QueryLanguage } from "../composables/useQueryStore";
 

package/frontend-vue/app/components/SchemaDiagram.vue

@@ -6,6 +6,11 @@ import {
 	type VueFlowStore,
 } from "@vue-flow/core";
 import dagre from "@dagrejs/dagre";
+import type { ShallowUnwrapRef } from "vue";
+import DiagramNoteNode from "./DiagramNoteNode.vue";
+import DiagramRelationEdge from "./DiagramRelationEdge.vue";
+import DiagramStubNode from "./DiagramStubNode.vue";
+import DiagramTableNode from "./DiagramTableNode.vue";
 import type { SchemaSummary } from "../composables/useDatabaseSchemas";
 import type {
 	DiagramNote,
@@ -192,7 +197,9 @@ const {
 // exposes the full imperative VueFlow controller (setNodes/setEdges/fitView/
 // viewport/findNode/onNodeDrag…) via a template ref; all the ERD business
 // logic below (dagre auto-layout, edge routing, undo/redo, notes) stays here.
-const canvas = ref<VueFlowStore | null>(null);
+// Vue's expose proxy unwraps the controller's refs: `edges` is the array
+// itself, not a Ref (`edges.value` is undefined and threw on every drag).
+const canvas = shallowRef<ShallowUnwrapRef<VueFlowStore> | null>(null);
 // Our own wrapper element — used to measure the visible canvas for note placement.
 const canvasWrapper = ref<HTMLElement | null>(null);
 
@@ -788,15 +795,19 @@ async function applyChanges() {
 	}
 }
 
-const nodeTypes = {
-	[TABLE_NODE_TYPE]: resolveComponent("DmsDatabaseDiagramTableNode"),
-	[STUB_NODE_TYPE]: resolveComponent("DmsDatabaseDiagramStubNode"),
-	[NOTE_NODE_TYPE]: resolveComponent("DmsDatabaseDiagramNoteNode"),
-};
+// Imported directly, not resolved by name: the DMS registers its global
+// components as async components, and the async relation edge was mounted
+// with the HTML namespace — its <path> was created as an HTML element inside
+// the edges <svg>, so no relation line was drawn.
+const nodeTypes = markRaw({
+	[TABLE_NODE_TYPE]: DiagramTableNode,
+	[STUB_NODE_TYPE]: DiagramStubNode,
+	[NOTE_NODE_TYPE]: DiagramNoteNode,
+});
 
-const edgeTypes = {
-	[RELATION_EDGE_TYPE]: resolveComponent("DmsDatabaseDiagramRelationEdge"),
-};
+const edgeTypes = markRaw({
+	[RELATION_EDGE_TYPE]: DiagramRelationEdge,
+});
 
 const zoomPercent = computed(
 	() => `${Math.round(liveViewport.value.zoom * 100)}%`,
@@ -810,7 +821,7 @@ function widthForNodeType(type: string | undefined): number {
 function recomputeEdgesForNode(nodeId: string) {
 	const instance = canvas.value;
 	if (!instance) return;
-	for (const edge of instance.edges.value) {
+	for (const edge of instance.edges) {
 		if (edge.source !== nodeId && edge.target !== nodeId) continue;
 		const sNode = instance.findNode(edge.source);
 		const tNode = instance.findNode(edge.target);

package/frontend-vue/package.json

@@ -26,7 +26,7 @@
 		"@codemirror/view": "^6.38.1",
 		"@dagrejs/dagre": "^3.0.0",
 		"@vue-flow/core": "^1.48.2",
-		"@vueuse/core": "^13.0.0",
+		"@vueuse/core": "^14.3.0",
 		"vue": "^3.5.18"
 	},
 	"devDependencies": {

package/frontend-vue/pnpm-lock.yaml

@@ -42,8 +42,8 @@ importers:
         specifier: ^1.48.2
         version: 1.48.2(vue@3.5.34(typescript@5.9.3))
       '@vueuse/core':
-        specifier: ^13.0.0
-        version: 13.9.0(vue@3.5.34(typescript@5.9.3))
+        specifier: ^14.3.0
+        version: 14.3.0(vue@3.5.34(typescript@5.9.3))
       vue:
         specifier: ^3.5.18
         version: 3.5.34(typescript@5.9.3)
@@ -1304,11 +1304,6 @@ packages:
   '@vueuse/core@10.11.1':
     resolution: {integrity: sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==}
 
-  '@vueuse/core@13.9.0':
-    resolution: {integrity: sha512-ts3regBQyURfCE2BcytLqzm8+MmLlo5Ln/KLoxDVcsZ2gzIwVNnQpQOL/UKV8alUqjSZOlpFZcRNsLRqj+OzyA==}
-    peerDependencies:
-      vue: ^3.5.0
-
   '@vueuse/core@14.3.0':
     resolution: {integrity: sha512-aHfz47g0ZhMtTVHmIzMVpJy8ePhhOy68GY5bv110+5DVtZ+W7BsOx+m61UNQqfrWyPztIHIanWa3E2tib3NFIw==}
     peerDependencies:
@@ -1359,20 +1354,12 @@ packages:
   '@vueuse/metadata@10.11.1':
     resolution: {integrity: sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==}
 
-  '@vueuse/metadata@13.9.0':
-    resolution: {integrity: sha512-1AFRvuiGphfF7yWixZa0KwjYH8ulyjDCC0aFgrGRz8+P4kvDFSdXLVfTk5xAN9wEuD1J6z4/myMoYbnHoX07zg==}
-
   '@vueuse/metadata@14.3.0':
     resolution: {integrity: sha512-BwxmbAzwAVF50+MW57GXOUEV61nFBGnlBvrTqj49PqWJu3uw7hdu72ztXeZ33RdZtDY6kO+bfCAE1PCn88Tktw==}
 
   '@vueuse/shared@10.11.1':
     resolution: {integrity: sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==}
 
-  '@vueuse/shared@13.9.0':
-    resolution: {integrity: sha512-e89uuTLMh0U5cZ9iDpEI2senqPGfbPRTHM/0AaQkcxnpqjkZqDYP8rpfm7edOz8s+pOCOROEy1PIveSW8+fL5g==}
-    peerDependencies:
-      vue: ^3.5.0
-
   '@vueuse/shared@14.3.0':
     resolution: {integrity: sha512-bZpge9eSXwa4ToSiqJ7j6KRwhAsneMFoSz3LMWKQDkqimm3D/tbFlrklrs/IOqC8tEcYmXQZJ6N0UrjhBirVCg==}
     peerDependencies:
@@ -4271,13 +4258,6 @@ snapshots:
       - '@vue/composition-api'
       - vue
 
-  '@vueuse/core@13.9.0(vue@3.5.34(typescript@5.9.3))':
-    dependencies:
-      '@types/web-bluetooth': 0.0.21
-      '@vueuse/metadata': 13.9.0
-      '@vueuse/shared': 13.9.0(vue@3.5.34(typescript@5.9.3))
-      vue: 3.5.34(typescript@5.9.3)
-
   '@vueuse/core@14.3.0(vue@3.5.34(typescript@5.9.3))':
     dependencies:
       '@types/web-bluetooth': 0.0.21
@@ -4295,8 +4275,6 @@ snapshots:
 
   '@vueuse/metadata@10.11.1': {}
 
-  '@vueuse/metadata@13.9.0': {}
-
   '@vueuse/metadata@14.3.0': {}
 
   '@vueuse/shared@10.11.1(vue@3.5.34(typescript@5.9.3))':
@@ -4306,10 +4284,6 @@ snapshots:
       - '@vue/composition-api'
       - vue
 
-  '@vueuse/shared@13.9.0(vue@3.5.34(typescript@5.9.3))':
-    dependencies:
-      vue: 3.5.34(typescript@5.9.3)
-
   '@vueuse/shared@14.3.0(vue@3.5.34(typescript@5.9.3))':
     dependencies:
       vue: 3.5.34(typescript@5.9.3)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@antelopejs/dms-database",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",