From 43e1de0842c493ffa0c98f3114755a40da592476 Mon Sep 17 00:00:00 2001
From: newcat <freddy.wagner@web.de>
Date: Sat, 25 May 2024 02:33:22 +0200
Subject: [PATCH] Expose temporary connection handler (#408)

---
 packages/renderer-vue/src/editor/Editor.vue        |  4 ++--
 packages/renderer-vue/src/editor/index.ts          |  4 ++++
 .../renderer-vue/src/editor/temporaryConnection.ts | 14 +++++++++++---
 packages/renderer-vue/src/index.ts                 |  4 +---
 packages/renderer-vue/src/node/NodeInterface.vue   | 11 +++--------
 5 files changed, 21 insertions(+), 16 deletions(-)
 create mode 100644 packages/renderer-vue/src/editor/index.ts

diff --git a/packages/renderer-vue/src/editor/Editor.vue b/packages/renderer-vue/src/editor/Editor.vue
index 5991bf00..c776687d 100644
--- a/packages/renderer-vue/src/editor/Editor.vue
+++ b/packages/renderer-vue/src/editor/Editor.vue
@@ -95,7 +95,7 @@ import { AbstractNode } from "@baklavajs/core";
 import { IBaklavaViewModel } from "../viewModel";
 import { providePlugin, useDragMove } from "../utility";
 import { usePanZoom } from "./panZoom";
-import { useTemporaryConnection } from "./temporaryConnection";
+import { provideTemporaryConnection } from "./temporaryConnection";
 import { useContextMenu } from "./contextMenu";
 import { useSelectionBox } from "./selectionBox";
 
@@ -125,7 +125,7 @@ const connections = computed(() => props.viewModel.displayedGraph.connections);
 const selectedNodes = computed(() => props.viewModel.displayedGraph.selectedNodes);
 
 const panZoom = usePanZoom();
-const temporaryConnection = useTemporaryConnection();
+const temporaryConnection = provideTemporaryConnection();
 const contextMenu = useContextMenu(viewModelRef);
 const selectionBox = useSelectionBox(el);
 
diff --git a/packages/renderer-vue/src/editor/index.ts b/packages/renderer-vue/src/editor/index.ts
new file mode 100644
index 00000000..f75b51c0
--- /dev/null
+++ b/packages/renderer-vue/src/editor/index.ts
@@ -0,0 +1,4 @@
+/** @deprecated use `BaklavaEditor` instead */
+export { default as EditorComponent } from "./editor/Editor.vue";
+export { default as BaklavaEditor } from "./editor/Editor.vue";
+export * from "./temporaryConnection";
diff --git a/packages/renderer-vue/src/editor/temporaryConnection.ts b/packages/renderer-vue/src/editor/temporaryConnection.ts
index 67034741..6f2afc99 100644
--- a/packages/renderer-vue/src/editor/temporaryConnection.ts
+++ b/packages/renderer-vue/src/editor/temporaryConnection.ts
@@ -1,15 +1,15 @@
-import { provide, ref, Ref } from "vue";
+import { inject, provide, ref, Ref } from "vue";
 import { NodeInterface } from "@baklavajs/core";
 import { ITemporaryConnection, TemporaryConnectionState } from "../connection/connection";
 import { useGraph } from "../utility";
 
-export const TEMPORARY_CONNECTION_HANDLER_INJECTION_SYMBOL = Symbol();
+const TEMPORARY_CONNECTION_HANDLER_INJECTION_SYMBOL = Symbol();
 export interface ITemporaryConnectionHandler {
     hoveredOver: (ni: NodeInterface | undefined) => void;
     temporaryConnection: Ref<ITemporaryConnection | null>;
 }
 
-export function useTemporaryConnection() {
+export function provideTemporaryConnection() {
     const { graph } = useGraph();
 
     const temporaryConnection = ref<ITemporaryConnection | null>(null) as Ref<ITemporaryConnection | null>;
@@ -99,3 +99,11 @@ export function useTemporaryConnection() {
 
     return { temporaryConnection, onMouseMove, onMouseDown, onMouseUp, hoveredOver };
 }
+
+export function useTemporaryConnection() {
+    const temporaryConnection = inject<ITemporaryConnectionHandler>(TEMPORARY_CONNECTION_HANDLER_INJECTION_SYMBOL);
+    if (!temporaryConnection) {
+        throw new Error("useTemporaryConnection must be used within a BaklavaEditor");
+    }
+    return temporaryConnection;
+}
diff --git a/packages/renderer-vue/src/index.ts b/packages/renderer-vue/src/index.ts
index 359364da..cefa4cbe 100644
--- a/packages/renderer-vue/src/index.ts
+++ b/packages/renderer-vue/src/index.ts
@@ -4,9 +4,7 @@
 
 export * from "./overrides";
 
-/** @deprecated use `BaklavaEditor` instead */
-export { default as EditorComponent } from "./editor/Editor.vue";
-export { default as BaklavaEditor } from "./editor/Editor.vue";
+export * from "./editor";
 export * from "./commands";
 export * from "./nodeinterfaces";
 export * from "./viewModel";
diff --git a/packages/renderer-vue/src/node/NodeInterface.vue b/packages/renderer-vue/src/node/NodeInterface.vue
index f22d4994..84cb6c80 100644
--- a/packages/renderer-vue/src/node/NodeInterface.vue
+++ b/packages/renderer-vue/src/node/NodeInterface.vue
@@ -28,13 +28,10 @@
 </template>
 
 <script setup lang="ts">
-import { computed, inject, onMounted, onUpdated, Ref, ref } from "vue";
+import { computed, onMounted, onUpdated, Ref, ref } from "vue";
 import { AbstractNode, NodeInterface } from "@baklavajs/core";
 import { useViewModel } from "../utility";
-import {
-    ITemporaryConnectionHandler,
-    TEMPORARY_CONNECTION_HANDLER_INJECTION_SYMBOL,
-} from "../editor/temporaryConnection";
+import { useTemporaryConnection } from "../editor/temporaryConnection";
 
 const ellipsis = (value: any, characters = 100) => {
     const stringValue: string = typeof value?.toString === "function" ? String(value) : "";
@@ -52,9 +49,7 @@ const props = defineProps<{
 }>();
 
 const { viewModel } = useViewModel();
-const { hoveredOver, temporaryConnection } = inject<ITemporaryConnectionHandler>(
-    TEMPORARY_CONNECTION_HANDLER_INJECTION_SYMBOL,
-)!;
+const { hoveredOver, temporaryConnection } = useTemporaryConnection();
 
 const el = ref<HTMLElement | null>(null) as Ref<HTMLElement>;