chore: rename @nodes -> @nodarium for everything

app/src/lib/graph-interface/node/Node.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
-  import type { Node } from "@nodes/types";
-  import { getContext, onMount } from "svelte";
-  import { getGraphState } from "../graph/state.svelte";
+  import type { Node } from "@nodarium/types";
+  import { onMount } from "svelte";
+  import { getGraphManager, getGraphState } from "../graph/state.svelte";
   import { T } from "@threlte/core";
   import { type Mesh } from "three";
   import NodeFrag from "./Node.frag";
@@ -10,6 +10,7 @@
   import { colors } from "../graph/colors.svelte";
   import { appSettings } from "$lib/settings/app-settings.svelte";
 
+  const graph = getGraphManager();
   const graphState = getGraphState();
 
   type Props = {
@@ -17,7 +18,7 @@
     inView: boolean;
     z: number;
   };
-  let { node = $bindable(), inView, z }: Props = $props();
+  let { node, inView, z }: Props = $props();
 
   const isActive = $derived(graphState.activeNodeId === node.id);
   const isSelected = $derived(graphState.selectedNodes.has(node.id));
@@ -31,14 +32,9 @@
         : colors.outline;
   });
 
-  const updateNodePosition =
-    getContext<(n: Node) => void>("updateNodePosition");
-
-  const getNodeHeight = getContext<(n: string) => number>("getNodeHeight");
-
   let meshRef: Mesh | undefined = $state();
 
-  const height = getNodeHeight?.(node.type);
+  const height = graphState.getNodeHeight(node.type);
 
   $effect(() => {
     if (!node?.tmp) node.tmp = {};
@@ -48,7 +44,7 @@
   onMount(() => {
     if (!node.tmp) node.tmp = {};
     node.tmp.mesh = meshRef;
-    updateNodePosition?.(node);
+    graphState.updateNodePosition(node);
   });
 </script>
 
@@ -78,4 +74,4 @@
   />
 </T.Mesh>
 
-<NodeHtml bind:node {inView} {isActive} {isSelected} {z} />
+<NodeHtml {node} {inView} {isActive} {isSelected} {z} />

app/src/lib/graph-interface/node/NodeHTML.svelte

@@ -1,11 +1,14 @@
 <script lang="ts">
-  import type { Node } from "@nodes/types";
+  import type { Node } from "@nodarium/types";
   import NodeHeader from "./NodeHeader.svelte";
   import NodeParameter from "./NodeParameter.svelte";
-  import { getContext, onMount } from "svelte";
+  import { onMount } from "svelte";
+  import { getGraphState } from "../graph/state.svelte";
 
   let ref: HTMLDivElement;
 
+  const graphState = getGraphState();
+
   type Props = {
     node: Node;
     position?: "absolute" | "fixed" | "relative";
@@ -32,13 +35,10 @@
       p[1].type !== "seed" && !("setting" in p[1]) && p[1]?.hidden !== true,
   );
 
-  const updateNodePosition =
-    getContext<(n: Node) => void>("updateNodePosition");
-
   onMount(() => {
     node.tmp = node.tmp || {};
     node.tmp.ref = ref;
-    updateNodePosition?.(node);
+    graphState?.updateNodePosition(node);
   });
 </script>
 

app/src/lib/graph-interface/node/NodeHeader.svelte

@@ -1,23 +1,19 @@
 <script lang="ts">
+  import { getGraphState } from "../graph/state.svelte.js";
   import { createNodePath } from "../helpers/index.js";
-  import type { Node, Socket } from "@nodes/types";
-  import { getContext } from "svelte";
+  import type { Node } from "@nodarium/types";
+
+  const graphState = getGraphState();
 
   const { node }: { node: Node } = $props();
 
-  const setDownSocket = getContext<(socket: Socket) => void>("setDownSocket");
-  const getSocketPosition =
-    getContext<(node: Node, index: number) => [number, number]>(
-      "getSocketPosition",
-    );
-
   function handleMouseDown(event: MouseEvent) {
     event.stopPropagation();
     event.preventDefault();
-    setDownSocket?.({
+    graphState.setDownSocket?.({
       node,
       index: 0,
-      position: getSocketPosition?.(node, 0),
+      position: graphState.getSocketPosition?.(node, 0),
     });
   }
 

app/src/lib/graph-interface/node/NodeInput.svelte

@@ -1,13 +1,14 @@
 <script lang="ts">
-  import type { Node, NodeInput } from "@nodes/types";
-  import { getGraphManager } from "../graph/context.js";
-  import { Input } from "@nodes/ui";
+  import type { Node, NodeInput } from "@nodarium/types";
+  import { Input } from "@nodarium/ui";
+  import type { GraphManager } from "../graph-manager.svelte";
 
   type Props = {
     node: Node;
     input: NodeInput;
     id: string;
     elementId?: string;
+    graph?: GraphManager;
   };
 
   const {
@@ -15,10 +16,9 @@
     input,
     id,
     elementId = `input-${Math.random().toString(36).substring(7)}`,
+    graph,
   }: Props = $props();
 
-  const graph = getGraphManager();
-
   function getDefaultValue() {
     if (node?.props?.[id] !== undefined) return node?.props?.[id] as number;
     if ("value" in input && input?.value !== undefined)

app/src/lib/graph-interface/node/NodeParameter.svelte

@@ -1,14 +1,11 @@
 <script lang="ts">
   import type {
     NodeInput as NodeInputType,
-    Socket,
     Node as NodeType,
-  } from "@nodes/types";
-  import { getContext } from "svelte";
+  } from "@nodarium/types";
   import { createNodePath } from "../helpers/index.js";
-  import { getGraphManager } from "../graph/context.js";
   import NodeInput from "./NodeInput.svelte";
-  import { getGraphState } from "../graph/state.svelte.js";
+  import { getGraphManager, getGraphState } from "../graph/state.svelte.js";
 
   type Props = {
     node: NodeType;
@@ -17,31 +14,26 @@
     isLast?: boolean;
   };
 
+  const graph = getGraphManager();
+
   let { node = $bindable(), input, id, isLast }: Props = $props();
 
   const inputType = node?.tmp?.type?.inputs?.[id]!;
 
   const socketId = `${node.id}-${id}`;
 
-  const graph = getGraphManager();
   const graphState = getGraphState();
   const graphId = graph?.id;
 
   const elementId = `input-${Math.random().toString(36).substring(7)}`;
 
-  const setDownSocket = getContext<(socket: Socket) => void>("setDownSocket");
-  const getSocketPosition =
-    getContext<(node: NodeType, index: string) => [number, number]>(
-      "getSocketPosition",
-    );
-
   function handleMouseDown(ev: MouseEvent) {
     ev.preventDefault();
     ev.stopPropagation();
-    setDownSocket?.({
+    graphState.setDownSocket({
       node,
       index: id,
-      position: getSocketPosition?.(node, id),
+      position: graphState.getSocketPosition?.(node, id),
     });
   }
 
@@ -87,7 +79,7 @@
         <label for={elementId}>{input.label || id}</label>
       {/if}
       {#if inputType.external !== true}
-        <NodeInput {elementId} bind:node {input} {id} />
+        <NodeInput {graph} {elementId} bind:node {input} {id} />
       {/if}
     </div>