@dxos/plugin-graph 0.8.2-main.fbd8ed0 → 0.8.2-staging.7ac8446

package/README.md

@@ -1,4 +1,6 @@
-# @dxos/plugin-graph
+# @dxos/plugin-client
+
+Surface plugin for DXOS Client.
 
 ## DXOS Resources
 

package/dist/lib/browser/chunk-L263B77P.mjs

@@ -0,0 +1,12 @@
+// packages/plugins/plugin-graph/src/meta.ts
+var GRAPH_PLUGIN = "dxos.org/plugin/graph";
+var meta = {
+  id: GRAPH_PLUGIN,
+  name: "Graph"
+};
+
+export {
+  GRAPH_PLUGIN,
+  meta
+};
+//# sourceMappingURL=chunk-L263B77P.mjs.map

package/dist/lib/browser/chunk-L263B77P.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/meta.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const GRAPH_PLUGIN = 'dxos.org/plugin/graph';\n\nexport const meta: PluginMeta = {\n  id: GRAPH_PLUGIN,\n  name: 'Graph',\n};\n"],
+  "mappings": ";AAMO,IAAMA,eAAe;AAErB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;AACR;",
+  "names": ["GRAPH_PLUGIN", "meta", "id", "name"]
+}

package/dist/lib/browser/graph-UYXVVZ2I.mjs

@@ -0,0 +1,42 @@
+import {
+  GRAPH_PLUGIN
+} from "./chunk-L263B77P.mjs";
+
+// packages/plugins/plugin-graph/src/graph.ts
+import { batch, effect, untracked } from "@preact/signals-core";
+import { Capabilities, contributes } from "@dxos/app-framework";
+import { flattenExtensions, GraphBuilder } from "@dxos/app-graph";
+var KEY = `${GRAPH_PLUGIN}/app-graph`;
+var graph_default = async (context) => {
+  const builder = GraphBuilder.from(localStorage.getItem(KEY) ?? void 0);
+  const interval = setInterval(() => {
+    localStorage.setItem(KEY, builder.graph.pickle());
+  }, 5e3);
+  const unsubscribe = effect(() => {
+    batch(() => {
+      const next = flattenExtensions(context.requestCapabilities(Capabilities.AppGraphBuilder));
+      const current = untracked(() => builder.extensions);
+      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));
+      removed.forEach((extension) => builder.removeExtension(extension.id));
+      next.forEach((extension) => builder.addExtension(extension));
+    });
+  });
+  await builder.initialize();
+  await builder.graph.expand(builder.graph.root);
+  setupDevtools(builder.graph);
+  return contributes(Capabilities.AppGraph, {
+    graph: builder.graph,
+    explore: (options) => builder.explore(options)
+  }, () => {
+    clearInterval(interval);
+    unsubscribe();
+  });
+};
+var setupDevtools = (graph) => {
+  globalThis.composer ??= {};
+  globalThis.composer.graph = graph;
+};
+export {
+  graph_default as default
+};
+//# sourceMappingURL=graph-UYXVVZ2I.mjs.map

package/dist/lib/browser/graph-UYXVVZ2I.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/graph.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { batch, effect, untracked } from '@preact/signals-core';\n\nimport { Capabilities, contributes, type PluginsContext } from '@dxos/app-framework';\nimport { flattenExtensions, type Graph, GraphBuilder } from '@dxos/app-graph';\n\nimport { GRAPH_PLUGIN } from './meta';\n\nconst KEY = `${GRAPH_PLUGIN}/app-graph`;\n\nexport default async (context: PluginsContext) => {\n  const builder = GraphBuilder.from(localStorage.getItem(KEY) ?? undefined);\n  const interval = setInterval(() => {\n    localStorage.setItem(KEY, builder.graph.pickle());\n  }, 5_000);\n\n  const unsubscribe = effect(() => {\n    batch(() => {\n      const next = flattenExtensions(context.requestCapabilities(Capabilities.AppGraphBuilder));\n      const current = untracked(() => builder.extensions);\n      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));\n      removed.forEach((extension) => builder.removeExtension(extension.id));\n      next.forEach((extension) => builder.addExtension(extension));\n    });\n  });\n\n  await builder.initialize();\n  await builder.graph.expand(builder.graph.root);\n\n  setupDevtools(builder.graph);\n\n  return contributes(\n    Capabilities.AppGraph,\n    { graph: builder.graph, explore: (options) => builder.explore(options) },\n    () => {\n      clearInterval(interval);\n      unsubscribe();\n    },\n  );\n};\n\n// Expose the graph to the window for debugging.\nconst setupDevtools = (graph: Graph) => {\n  (globalThis as any).composer ??= {};\n  (globalThis as any).composer.graph = graph;\n};\n"],
+  "mappings": ";;;;;AAIA,SAASA,OAAOC,QAAQC,iBAAiB;AAEzC,SAASC,cAAcC,mBAAwC;AAC/D,SAASC,mBAA+BC,oBAAoB;AAI5D,IAAMC,MAAM,GAAGC,YAAAA;AAEf,IAAA,gBAAe,OAAOC,YAAAA;AACpB,QAAMC,UAAUC,aAAaC,KAAKC,aAAaC,QAAQP,GAAAA,KAAQQ,MAAAA;AAC/D,QAAMC,WAAWC,YAAY,MAAA;AAC3BJ,iBAAaK,QAAQX,KAAKG,QAAQS,MAAMC,OAAM,CAAA;EAChD,GAAG,GAAA;AAEH,QAAMC,cAAcC,OAAO,MAAA;AACzBC,UAAM,MAAA;AACJ,YAAMC,OAAOC,kBAAkBhB,QAAQiB,oBAAoBC,aAAaC,eAAe,CAAA;AACvF,YAAMC,UAAUC,UAAU,MAAMpB,QAAQqB,UAAU;AAClD,YAAMC,UAAUH,QAAQI,OAAO,CAAC,EAAEC,GAAE,MAAO,CAACV,KAAKW,KAAK,CAAC,EAAED,IAAIE,OAAM,MAAOA,WAAWF,EAAAA,CAAAA;AACrFF,cAAQK,QAAQ,CAACC,cAAc5B,QAAQ6B,gBAAgBD,UAAUJ,EAAE,CAAA;AACnEV,WAAKa,QAAQ,CAACC,cAAc5B,QAAQ8B,aAAaF,SAAAA,CAAAA;IACnD,CAAA;EACF,CAAA;AAEA,QAAM5B,QAAQ+B,WAAU;AACxB,QAAM/B,QAAQS,MAAMuB,OAAOhC,QAAQS,MAAMwB,IAAI;AAE7CC,gBAAclC,QAAQS,KAAK;AAE3B,SAAO0B,YACLlB,aAAamB,UACb;IAAE3B,OAAOT,QAAQS;IAAO4B,SAAS,CAACC,YAAYtC,QAAQqC,QAAQC,OAAAA;EAAS,GACvE,MAAA;AACEC,kBAAcjC,QAAAA;AACdK,gBAAAA;EACF,CAAA;AAEJ;AAGA,IAAMuB,gBAAgB,CAACzB,UAAAA;AACpB+B,aAAmBC,aAAa,CAAC;AACjCD,aAAmBC,SAAShC,QAAQA;AACvC;",
+  "names": ["batch", "effect", "untracked", "Capabilities", "contributes", "flattenExtensions", "GraphBuilder", "KEY", "GRAPH_PLUGIN", "context", "builder", "GraphBuilder", "from", "localStorage", "getItem", "undefined", "interval", "setInterval", "setItem", "graph", "pickle", "unsubscribe", "effect", "batch", "next", "flattenExtensions", "requestCapabilities", "Capabilities", "AppGraphBuilder", "current", "untracked", "extensions", "removed", "filter", "id", "some", "nextId", "forEach", "extension", "removeExtension", "addExtension", "initialize", "expand", "root", "setupDevtools", "contributes", "AppGraph", "explore", "options", "clearInterval", "globalThis", "composer"]
+}

package/dist/lib/browser/index.mjs

@@ -1,17 +1,13 @@
+import {
+  GRAPH_PLUGIN,
+  meta
+} from "./chunk-L263B77P.mjs";
+
 // packages/plugins/plugin-graph/src/index.ts
 export * from "@dxos/app-graph";
 
 // packages/plugins/plugin-graph/src/GraphPlugin.ts
 import { defineModule, lazy, Events, definePlugin } from "@dxos/app-framework";
-
-// packages/plugins/plugin-graph/src/meta.ts
-var GRAPH_PLUGIN = "dxos.org/plugin/graph";
-var meta = {
-  id: GRAPH_PLUGIN,
-  name: "Graph"
-};
-
-// packages/plugins/plugin-graph/src/GraphPlugin.ts
 var GraphPlugin = () => definePlugin(meta, [
   defineModule({
     id: `${meta.id}/module/graph`,
@@ -23,28 +19,43 @@ var GraphPlugin = () => definePlugin(meta, [
     activatesAfter: [
       Events.AppGraphReady
     ],
-    activate: lazy(() => import("./graph-5AJD2WYC.mjs"))
+    activate: lazy(() => import("./graph-UYXVVZ2I.mjs"))
   })
 ]);
 
 // packages/plugins/plugin-graph/src/hooks/useNode.ts
-import { useRxValue } from "@effect-rx/rx-react";
-import { Option } from "effect";
-var useNode = (graph, id) => {
-  return Option.getOrElse(useRxValue(graph.node(id ?? "")), () => void 0);
-};
-var useConnections = (graph, id, relation) => {
-  return useRxValue(graph.connections(id ?? "", relation));
-};
-var useActions = (graph, id) => {
-  return useRxValue(graph.actions(id ?? ""));
+import { useEffect, useState } from "react";
+var useNode = (graph, id, timeout) => {
+  const [nodeState, setNodeState] = useState(id ? graph.findNode(id, false) : void 0);
+  useEffect(() => {
+    if (!id && nodeState) {
+      setNodeState(void 0);
+    }
+    if (nodeState?.id === id || !id) {
+      return;
+    }
+    const frame = requestAnimationFrame(async () => {
+      try {
+        const node = await graph.waitForNode(id, timeout);
+        if (node) {
+          setNodeState(node);
+        }
+      } catch {
+      }
+    });
+    return () => cancelAnimationFrame(frame);
+  }, [
+    graph,
+    id,
+    timeout,
+    nodeState?.id
+  ]);
+  return nodeState;
 };
 export {
   GRAPH_PLUGIN,
   GraphPlugin,
   meta,
-  useActions,
-  useConnections,
   useNode
 };
 //# sourceMappingURL=index.mjs.map

package/dist/lib/browser/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/index.ts", "../../../src/GraphPlugin.ts", "../../../src/meta.ts", "../../../src/hooks/useNode.ts"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nexport * from '@dxos/app-graph';\n\nexport * from './GraphPlugin';\nexport * from './hooks';\nexport * from './meta';\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { defineModule, lazy, Events, definePlugin } from '@dxos/app-framework';\n\nimport { meta } from './meta';\n\n/**\n * Manages the state of the graph for the application.\n * Enables other plugins to register node builders to add nodes to the graph.\n * This includes actions and annotation each other's nodes.\n */\nexport const GraphPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/graph`,\n      activatesOn: Events.Startup,\n      activatesBefore: [Events.SetupAppGraph, Events.SetupMetadata],\n      activatesAfter: [Events.AppGraphReady],\n      activate: lazy(() => import('./graph')),\n    }),\n  ]);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const GRAPH_PLUGIN = 'dxos.org/plugin/graph';\n\nexport const meta: PluginMeta = {\n  id: GRAPH_PLUGIN,\n  name: 'Graph',\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useRxValue } from '@effect-rx/rx-react';\nimport { Option } from 'effect';\n\nimport { type ReadableGraph, type Node, type Relation } from '@dxos/app-graph';\n\n/**\n * React hook to get a node from the graph.\n *\n * @param graph Graph to find the node in.\n * @param id Id of the node to find.\n * @param timeout Optional timeout in milliseconds to wait for the node to be found.\n * @returns Node if found, undefined otherwise.\n */\n// TODO(wittjosiah): Factor out to @dxos/app-graph/react.\nexport const useNode = <T = any>(graph: ReadableGraph, id?: string): Node<T> | undefined => {\n  return Option.getOrElse(useRxValue(graph.node(id ?? '')), () => undefined);\n};\n\nexport const useConnections = (graph: ReadableGraph, id?: string, relation?: Relation): Node[] => {\n  return useRxValue(graph.connections(id ?? '', relation));\n};\n\nexport const useActions = (graph: ReadableGraph, id?: string): Node[] => {\n  return useRxValue(graph.actions(id ?? ''));\n};\n"],
-  "mappings": ";AAIA,cAAc;;;ACAd,SAASA,cAAcC,MAAMC,QAAQC,oBAAoB;;;ACElD,IAAMC,eAAe;AAErB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;AACR;;;ADEO,IAAMC,cAAc,MACzBC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,iBAAiB;MAACF,OAAOG;MAAeH,OAAOI;;IAC/CC,gBAAgB;MAACL,OAAOM;;IACxBC,UAAUC,KAAK,MAAM,OAAO,sBAAA,CAAA;EAC9B,CAAA;CACD;;;AElBH,SAASC,kBAAkB;AAC3B,SAASC,cAAc;AAahB,IAAMC,UAAU,CAAUC,OAAsBC,OAAAA;AACrD,SAAOC,OAAOC,UAAUC,WAAWJ,MAAMK,KAAKJ,MAAM,EAAA,CAAA,GAAM,MAAMK,MAAAA;AAClE;AAEO,IAAMC,iBAAiB,CAACP,OAAsBC,IAAaO,aAAAA;AAChE,SAAOJ,WAAWJ,MAAMS,YAAYR,MAAM,IAAIO,QAAAA,CAAAA;AAChD;AAEO,IAAME,aAAa,CAACV,OAAsBC,OAAAA;AAC/C,SAAOG,WAAWJ,MAAMW,QAAQV,MAAM,EAAA,CAAA;AACxC;",
-  "names": ["defineModule", "lazy", "Events", "definePlugin", "GRAPH_PLUGIN", "meta", "id", "name", "GraphPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "Startup", "activatesBefore", "SetupAppGraph", "SetupMetadata", "activatesAfter", "AppGraphReady", "activate", "lazy", "useRxValue", "Option", "useNode", "graph", "id", "Option", "getOrElse", "useRxValue", "node", "undefined", "useConnections", "relation", "connections", "useActions", "actions"]
+  "sources": ["../../../src/index.ts", "../../../src/GraphPlugin.ts", "../../../src/hooks/useNode.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nexport * from '@dxos/app-graph';\n\nexport * from './GraphPlugin';\nexport * from './hooks';\nexport * from './meta';\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { defineModule, lazy, Events, definePlugin } from '@dxos/app-framework';\n\nimport { meta } from './meta';\n\n/**\n * Manages the state of the graph for the application.\n * Enables other plugins to register node builders to add nodes to the graph.\n * This includes actions and annotation each other's nodes.\n */\nexport const GraphPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/graph`,\n      activatesOn: Events.Startup,\n      activatesBefore: [Events.SetupAppGraph, Events.SetupMetadata],\n      activatesAfter: [Events.AppGraphReady],\n      activate: lazy(() => import('./graph')),\n    }),\n  ]);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useState } from 'react';\n\nimport { type Graph, type Node } from '@dxos/app-graph';\n\n/**\n * React hook to get a node from the graph.\n *\n * @param graph Graph to find the node in.\n * @param id Id of the node to find.\n * @param timeout Optional timeout in milliseconds to wait for the node to be found.\n * @returns Node if found, undefined otherwise.\n */\n// TODO(wittjosiah): Factor out?\nexport const useNode = <T = any>(graph: Graph, id?: string, timeout?: number): Node<T> | undefined => {\n  const [nodeState, setNodeState] = useState<Node<T> | undefined>(id ? graph.findNode(id, false) : undefined);\n\n  useEffect(() => {\n    if (!id && nodeState) {\n      setNodeState(undefined);\n    }\n\n    if (nodeState?.id === id || !id) {\n      return;\n    }\n\n    // Set timeout did not seem to effectively not block the UI thread.\n    const frame = requestAnimationFrame(async () => {\n      try {\n        const node = await graph.waitForNode(id, timeout);\n        if (node) {\n          setNodeState(node);\n        }\n      } catch {\n        // TODO(ZaymonFC): This leaves the resolved node in an invalid state in the case of a timeout.\n      }\n    });\n\n    return () => cancelAnimationFrame(frame);\n  }, [graph, id, timeout, nodeState?.id]);\n\n  return nodeState;\n};\n"],
+  "mappings": ";;;;;;AAIA,cAAc;;;ACAd,SAASA,cAAcC,MAAMC,QAAQC,oBAAoB;AASlD,IAAMC,cAAc,MACzBC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,iBAAiB;MAACF,OAAOG;MAAeH,OAAOI;;IAC/CC,gBAAgB;MAACL,OAAOM;;IACxBC,UAAUC,KAAK,MAAM,OAAO,sBAAA,CAAA;EAC9B,CAAA;CACD;;;AClBH,SAASC,WAAWC,gBAAgB;AAa7B,IAAMC,UAAU,CAAUC,OAAcC,IAAaC,YAAAA;AAC1D,QAAM,CAACC,WAAWC,YAAAA,IAAgBC,SAA8BJ,KAAKD,MAAMM,SAASL,IAAI,KAAA,IAASM,MAAAA;AAEjGC,YAAU,MAAA;AACR,QAAI,CAACP,MAAME,WAAW;AACpBC,mBAAaG,MAAAA;IACf;AAEA,QAAIJ,WAAWF,OAAOA,MAAM,CAACA,IAAI;AAC/B;IACF;AAGA,UAAMQ,QAAQC,sBAAsB,YAAA;AAClC,UAAI;AACF,cAAMC,OAAO,MAAMX,MAAMY,YAAYX,IAAIC,OAAAA;AACzC,YAAIS,MAAM;AACRP,uBAAaO,IAAAA;QACf;MACF,QAAQ;MAER;IACF,CAAA;AAEA,WAAO,MAAME,qBAAqBJ,KAAAA;EACpC,GAAG;IAACT;IAAOC;IAAIC;IAASC,WAAWF;GAAG;AAEtC,SAAOE;AACT;",
+  "names": ["defineModule", "lazy", "Events", "definePlugin", "GraphPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "Startup", "activatesBefore", "SetupAppGraph", "SetupMetadata", "activatesAfter", "AppGraphReady", "activate", "lazy", "useEffect", "useState", "useNode", "graph", "id", "timeout", "nodeState", "setNodeState", "useState", "findNode", "undefined", "useEffect", "frame", "requestAnimationFrame", "node", "waitForNode", "cancelAnimationFrame"]
 }

package/dist/lib/browser/meta.json

@@ -1 +1 @@
-{"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytes":950,"imports":[],"format":"esm"},"packages/plugins/plugin-graph/src/graph.ts":{"bytes":7025,"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytes":2810,"imports":[{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-graph/src/graph.ts","kind":"dynamic-import","original":"./graph"}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytes":3193,"imports":[{"path":"@effect-rx/rx-react","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytes":506,"imports":[{"path":"packages/plugins/plugin-graph/src/hooks/useNode.ts","kind":"import-statement","original":"./useNode"}],"format":"esm"},"packages/plugins/plugin-graph/src/index.ts":{"bytes":778,"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/GraphPlugin.ts","kind":"import-statement","original":"./GraphPlugin"},{"path":"packages/plugins/plugin-graph/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-graph/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3458},"packages/plugins/plugin-graph/dist/lib/browser/index.mjs":{"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/dist/lib/browser/graph-5AJD2WYC.mjs","kind":"dynamic-import"},{"path":"@effect-rx/rx-react","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true}],"exports":["GRAPH_PLUGIN","GraphPlugin","meta","useActions","useConnections","useNode"],"entryPoint":"packages/plugins/plugin-graph/src/index.ts","inputs":{"packages/plugins/plugin-graph/src/index.ts":{"bytesInOutput":33},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytesInOutput":417},"packages/plugins/plugin-graph/src/meta.ts":{"bytesInOutput":96},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytesInOutput":386},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytesInOutput":0}},"bytes":1313},"packages/plugins/plugin-graph/dist/lib/browser/graph-5AJD2WYC.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3671},"packages/plugins/plugin-graph/dist/lib/browser/graph-5AJD2WYC.mjs":{"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"exports":["default"],"entryPoint":"packages/plugins/plugin-graph/src/graph.ts","inputs":{"packages/plugins/plugin-graph/src/graph.ts":{"bytesInOutput":1331}},"bytes":1460}}}
+{"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytes":950,"imports":[],"format":"esm"},"packages/plugins/plugin-graph/src/graph.ts":{"bytes":6242,"imports":[{"path":"@preact/signals-core","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytes":2810,"imports":[{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-graph/src/graph.ts","kind":"dynamic-import","original":"./graph"}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytes":4473,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytes":506,"imports":[{"path":"packages/plugins/plugin-graph/src/hooks/useNode.ts","kind":"import-statement","original":"./useNode"}],"format":"esm"},"packages/plugins/plugin-graph/src/index.ts":{"bytes":778,"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/GraphPlugin.ts","kind":"import-statement","original":"./GraphPlugin"},{"path":"packages/plugins/plugin-graph/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-graph/dist/lib/browser/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3652},"packages/plugins/plugin-graph/dist/lib/browser/index.mjs":{"imports":[{"path":"packages/plugins/plugin-graph/dist/lib/browser/chunk-L263B77P.mjs","kind":"import-statement"},{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/dist/lib/browser/graph-UYXVVZ2I.mjs","kind":"dynamic-import"},{"path":"react","kind":"import-statement","external":true}],"exports":["GRAPH_PLUGIN","GraphPlugin","meta","useNode"],"entryPoint":"packages/plugins/plugin-graph/src/index.ts","inputs":{"packages/plugins/plugin-graph/src/index.ts":{"bytesInOutput":33},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytesInOutput":417},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytesInOutput":662},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytesInOutput":0}},"bytes":1426},"packages/plugins/plugin-graph/dist/lib/browser/graph-UYXVVZ2I.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3429},"packages/plugins/plugin-graph/dist/lib/browser/graph-UYXVVZ2I.mjs":{"imports":[{"path":"packages/plugins/plugin-graph/dist/lib/browser/chunk-L263B77P.mjs","kind":"import-statement"},{"path":"@preact/signals-core","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"exports":["default"],"entryPoint":"packages/plugins/plugin-graph/src/graph.ts","inputs":{"packages/plugins/plugin-graph/src/graph.ts":{"bytesInOutput":1331}},"bytes":1516},"packages/plugins/plugin-graph/dist/lib/browser/chunk-L263B77P.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":447},"packages/plugins/plugin-graph/dist/lib/browser/chunk-L263B77P.mjs":{"imports":[],"exports":["GRAPH_PLUGIN","meta"],"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytesInOutput":96}},"bytes":221}}}

package/dist/lib/node/chunk-AKNWBLRY.cjs

@@ -0,0 +1,35 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var chunk_AKNWBLRY_exports = {};
+__export(chunk_AKNWBLRY_exports, {
+  GRAPH_PLUGIN: () => GRAPH_PLUGIN,
+  meta: () => meta
+});
+module.exports = __toCommonJS(chunk_AKNWBLRY_exports);
+var GRAPH_PLUGIN = "dxos.org/plugin/graph";
+var meta = {
+  id: GRAPH_PLUGIN,
+  name: "Graph"
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  GRAPH_PLUGIN,
+  meta
+});
+//# sourceMappingURL=chunk-AKNWBLRY.cjs.map

package/dist/lib/node/chunk-AKNWBLRY.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/meta.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const GRAPH_PLUGIN = 'dxos.org/plugin/graph';\n\nexport const meta: PluginMeta = {\n  id: GRAPH_PLUGIN,\n  name: 'Graph',\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAMO,IAAMA,eAAe;AAErB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;AACR;",
+  "names": ["GRAPH_PLUGIN", "meta", "id", "name"]
+}

package/dist/lib/node/{graph-IZROFGJQ.cjs → graph-GCGIYOGJ.cjs}

@@ -16,41 +16,38 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var graph_IZROFGJQ_exports = {};
-__export(graph_IZROFGJQ_exports, {
+var graph_GCGIYOGJ_exports = {};
+__export(graph_GCGIYOGJ_exports, {
   default: () => graph_default
 });
-module.exports = __toCommonJS(graph_IZROFGJQ_exports);
-var import_effect = require("effect");
+module.exports = __toCommonJS(graph_GCGIYOGJ_exports);
+var import_chunk_AKNWBLRY = require("./chunk-AKNWBLRY.cjs");
+var import_signals_core = require("@preact/signals-core");
 var import_app_framework = require("@dxos/app-framework");
 var import_app_graph = require("@dxos/app-graph");
+var KEY = `${import_chunk_AKNWBLRY.GRAPH_PLUGIN}/app-graph`;
 var graph_default = async (context) => {
-  const registry = context.getCapability(import_app_framework.Capabilities.RxRegistry);
-  const builder = import_app_graph.GraphBuilder.from(
-    /* localStorage.getItem(KEY) ?? */
-    void 0,
-    registry
-  );
-  const unsubscribe = registry.subscribe(context.capabilities(import_app_framework.Capabilities.AppGraphBuilder), (extensions) => {
-    const next = (0, import_app_graph.flattenExtensions)(extensions);
-    const current = import_effect.Record.values(registry.get(builder.extensions));
-    const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));
-    removed.forEach((extension) => builder.removeExtension(extension.id));
-    next.forEach((extension) => builder.addExtension(extension));
-  }, {
-    immediate: true
+  const builder = import_app_graph.GraphBuilder.from(localStorage.getItem(KEY) ?? void 0);
+  const interval = setInterval(() => {
+    localStorage.setItem(KEY, builder.graph.pickle());
+  }, 5e3);
+  const unsubscribe = (0, import_signals_core.effect)(() => {
+    (0, import_signals_core.batch)(() => {
+      const next = (0, import_app_graph.flattenExtensions)(context.requestCapabilities(import_app_framework.Capabilities.AppGraphBuilder));
+      const current = (0, import_signals_core.untracked)(() => builder.extensions);
+      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));
+      removed.forEach((extension) => builder.removeExtension(extension.id));
+      next.forEach((extension) => builder.addExtension(extension));
+    });
   });
-  builder.graph.onNodeChanged.on(({ id, node }) => {
-    if (import_effect.Option.isSome(node)) {
-      builder.graph.expand(id);
-    }
-  });
-  builder.graph.expand(import_app_graph.ROOT_ID);
+  await builder.initialize();
+  await builder.graph.expand(builder.graph.root);
   setupDevtools(builder.graph);
   return (0, import_app_framework.contributes)(import_app_framework.Capabilities.AppGraph, {
     graph: builder.graph,
-    explore: builder.explore
+    explore: (options) => builder.explore(options)
   }, () => {
+    clearInterval(interval);
     unsubscribe();
   });
 };
@@ -58,4 +55,4 @@ var setupDevtools = (graph) => {
   globalThis.composer ??= {};
   globalThis.composer.graph = graph;
 };
-//# sourceMappingURL=graph-IZROFGJQ.cjs.map
+//# sourceMappingURL=graph-GCGIYOGJ.cjs.map

package/dist/lib/node/graph-GCGIYOGJ.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/graph.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { batch, effect, untracked } from '@preact/signals-core';\n\nimport { Capabilities, contributes, type PluginsContext } from '@dxos/app-framework';\nimport { flattenExtensions, type Graph, GraphBuilder } from '@dxos/app-graph';\n\nimport { GRAPH_PLUGIN } from './meta';\n\nconst KEY = `${GRAPH_PLUGIN}/app-graph`;\n\nexport default async (context: PluginsContext) => {\n  const builder = GraphBuilder.from(localStorage.getItem(KEY) ?? undefined);\n  const interval = setInterval(() => {\n    localStorage.setItem(KEY, builder.graph.pickle());\n  }, 5_000);\n\n  const unsubscribe = effect(() => {\n    batch(() => {\n      const next = flattenExtensions(context.requestCapabilities(Capabilities.AppGraphBuilder));\n      const current = untracked(() => builder.extensions);\n      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));\n      removed.forEach((extension) => builder.removeExtension(extension.id));\n      next.forEach((extension) => builder.addExtension(extension));\n    });\n  });\n\n  await builder.initialize();\n  await builder.graph.expand(builder.graph.root);\n\n  setupDevtools(builder.graph);\n\n  return contributes(\n    Capabilities.AppGraph,\n    { graph: builder.graph, explore: (options) => builder.explore(options) },\n    () => {\n      clearInterval(interval);\n      unsubscribe();\n    },\n  );\n};\n\n// Expose the graph to the window for debugging.\nconst setupDevtools = (graph: Graph) => {\n  (globalThis as any).composer ??= {};\n  (globalThis as any).composer.graph = graph;\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAIA,0BAAyC;AAEzC,2BAA+D;AAC/D,uBAA4D;AAI5D,IAAMA,MAAM,GAAGC,kCAAAA;AAEf,IAAA,gBAAe,OAAOC,YAAAA;AACpB,QAAMC,UAAUC,8BAAaC,KAAKC,aAAaC,QAAQP,GAAAA,KAAQQ,MAAAA;AAC/D,QAAMC,WAAWC,YAAY,MAAA;AAC3BJ,iBAAaK,QAAQX,KAAKG,QAAQS,MAAMC,OAAM,CAAA;EAChD,GAAG,GAAA;AAEH,QAAMC,kBAAcC,4BAAO,MAAA;AACzBC,mCAAM,MAAA;AACJ,YAAMC,WAAOC,oCAAkBhB,QAAQiB,oBAAoBC,kCAAaC,eAAe,CAAA;AACvF,YAAMC,cAAUC,+BAAU,MAAMpB,QAAQqB,UAAU;AAClD,YAAMC,UAAUH,QAAQI,OAAO,CAAC,EAAEC,GAAE,MAAO,CAACV,KAAKW,KAAK,CAAC,EAAED,IAAIE,OAAM,MAAOA,WAAWF,EAAAA,CAAAA;AACrFF,cAAQK,QAAQ,CAACC,cAAc5B,QAAQ6B,gBAAgBD,UAAUJ,EAAE,CAAA;AACnEV,WAAKa,QAAQ,CAACC,cAAc5B,QAAQ8B,aAAaF,SAAAA,CAAAA;IACnD,CAAA;EACF,CAAA;AAEA,QAAM5B,QAAQ+B,WAAU;AACxB,QAAM/B,QAAQS,MAAMuB,OAAOhC,QAAQS,MAAMwB,IAAI;AAE7CC,gBAAclC,QAAQS,KAAK;AAE3B,aAAO0B,kCACLlB,kCAAamB,UACb;IAAE3B,OAAOT,QAAQS;IAAO4B,SAAS,CAACC,YAAYtC,QAAQqC,QAAQC,OAAAA;EAAS,GACvE,MAAA;AACEC,kBAAcjC,QAAAA;AACdK,gBAAAA;EACF,CAAA;AAEJ;AAGA,IAAMuB,gBAAgB,CAACzB,UAAAA;AACpB+B,aAAmBC,aAAa,CAAC;AACjCD,aAAmBC,SAAShC,QAAQA;AACvC;",
+  "names": ["KEY", "GRAPH_PLUGIN", "context", "builder", "GraphBuilder", "from", "localStorage", "getItem", "undefined", "interval", "setInterval", "setItem", "graph", "pickle", "unsubscribe", "effect", "batch", "next", "flattenExtensions", "requestCapabilities", "Capabilities", "AppGraphBuilder", "current", "untracked", "extensions", "removed", "filter", "id", "some", "nextId", "forEach", "extension", "removeExtension", "addExtension", "initialize", "expand", "root", "setupDevtools", "contributes", "AppGraph", "explore", "options", "clearInterval", "globalThis", "composer"]
+}

package/dist/lib/node/index.cjs

@@ -29,26 +29,19 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var node_exports = {};
 __export(node_exports, {
-  GRAPH_PLUGIN: () => GRAPH_PLUGIN,
+  GRAPH_PLUGIN: () => import_chunk_AKNWBLRY.GRAPH_PLUGIN,
   GraphPlugin: () => GraphPlugin,
-  meta: () => meta,
-  useActions: () => useActions,
-  useConnections: () => useConnections,
+  meta: () => import_chunk_AKNWBLRY.meta,
   useNode: () => useNode
 });
 module.exports = __toCommonJS(node_exports);
+var import_chunk_AKNWBLRY = require("./chunk-AKNWBLRY.cjs");
 __reExport(node_exports, require("@dxos/app-graph"), module.exports);
 var import_app_framework = require("@dxos/app-framework");
-var import_rx_react = require("@effect-rx/rx-react");
-var import_effect = require("effect");
-var GRAPH_PLUGIN = "dxos.org/plugin/graph";
-var meta = {
-  id: GRAPH_PLUGIN,
-  name: "Graph"
-};
-var GraphPlugin = () => (0, import_app_framework.definePlugin)(meta, [
+var import_react = require("react");
+var GraphPlugin = () => (0, import_app_framework.definePlugin)(import_chunk_AKNWBLRY.meta, [
   (0, import_app_framework.defineModule)({
-    id: `${meta.id}/module/graph`,
+    id: `${import_chunk_AKNWBLRY.meta.id}/module/graph`,
     activatesOn: import_app_framework.Events.Startup,
     activatesBefore: [
       import_app_framework.Events.SetupAppGraph,
@@ -57,25 +50,41 @@ var GraphPlugin = () => (0, import_app_framework.definePlugin)(meta, [
     activatesAfter: [
       import_app_framework.Events.AppGraphReady
     ],
-    activate: (0, import_app_framework.lazy)(() => import("./graph-IZROFGJQ.cjs"))
+    activate: (0, import_app_framework.lazy)(() => import("./graph-GCGIYOGJ.cjs"))
   })
 ]);
-var useNode = (graph, id) => {
-  return import_effect.Option.getOrElse((0, import_rx_react.useRxValue)(graph.node(id ?? "")), () => void 0);
-};
-var useConnections = (graph, id, relation) => {
-  return (0, import_rx_react.useRxValue)(graph.connections(id ?? "", relation));
-};
-var useActions = (graph, id) => {
-  return (0, import_rx_react.useRxValue)(graph.actions(id ?? ""));
+var useNode = (graph, id, timeout) => {
+  const [nodeState, setNodeState] = (0, import_react.useState)(id ? graph.findNode(id, false) : void 0);
+  (0, import_react.useEffect)(() => {
+    if (!id && nodeState) {
+      setNodeState(void 0);
+    }
+    if (nodeState?.id === id || !id) {
+      return;
+    }
+    const frame = requestAnimationFrame(async () => {
+      try {
+        const node = await graph.waitForNode(id, timeout);
+        if (node) {
+          setNodeState(node);
+        }
+      } catch {
+      }
+    });
+    return () => cancelAnimationFrame(frame);
+  }, [
+    graph,
+    id,
+    timeout,
+    nodeState?.id
+  ]);
+  return nodeState;
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   GRAPH_PLUGIN,
   GraphPlugin,
   meta,
-  useActions,
-  useConnections,
   useNode,
   ...require("@dxos/app-graph")
 });

package/dist/lib/node/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/index.ts", "../../../src/GraphPlugin.ts", "../../../src/meta.ts", "../../../src/hooks/useNode.ts"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nexport * from '@dxos/app-graph';\n\nexport * from './GraphPlugin';\nexport * from './hooks';\nexport * from './meta';\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { defineModule, lazy, Events, definePlugin } from '@dxos/app-framework';\n\nimport { meta } from './meta';\n\n/**\n * Manages the state of the graph for the application.\n * Enables other plugins to register node builders to add nodes to the graph.\n * This includes actions and annotation each other's nodes.\n */\nexport const GraphPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/graph`,\n      activatesOn: Events.Startup,\n      activatesBefore: [Events.SetupAppGraph, Events.SetupMetadata],\n      activatesAfter: [Events.AppGraphReady],\n      activate: lazy(() => import('./graph')),\n    }),\n  ]);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const GRAPH_PLUGIN = 'dxos.org/plugin/graph';\n\nexport const meta: PluginMeta = {\n  id: GRAPH_PLUGIN,\n  name: 'Graph',\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useRxValue } from '@effect-rx/rx-react';\nimport { Option } from 'effect';\n\nimport { type ReadableGraph, type Node, type Relation } from '@dxos/app-graph';\n\n/**\n * React hook to get a node from the graph.\n *\n * @param graph Graph to find the node in.\n * @param id Id of the node to find.\n * @param timeout Optional timeout in milliseconds to wait for the node to be found.\n * @returns Node if found, undefined otherwise.\n */\n// TODO(wittjosiah): Factor out to @dxos/app-graph/react.\nexport const useNode = <T = any>(graph: ReadableGraph, id?: string): Node<T> | undefined => {\n  return Option.getOrElse(useRxValue(graph.node(id ?? '')), () => undefined);\n};\n\nexport const useConnections = (graph: ReadableGraph, id?: string, relation?: Relation): Node[] => {\n  return useRxValue(graph.connections(id ?? '', relation));\n};\n\nexport const useActions = (graph: ReadableGraph, id?: string): Node[] => {\n  return useRxValue(graph.actions(id ?? ''));\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,yBAAc;ACAd,2BAAyD;AEAzD,sBAA2B;AAC3B,oBAAuB;ADChB,IAAMA,eAAe;AAErB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;AACR;ADEO,IAAMC,cAAc,UACzBC,mCAAaJ,MAAM;MACjBK,mCAAa;IACXJ,IAAI,GAAGD,KAAKC,EAAE;IACdK,aAAaC,4BAAOC;IACpBC,iBAAiB;MAACF,4BAAOG;MAAeH,4BAAOI;;IAC/CC,gBAAgB;MAACL,4BAAOM;;IACxBC,cAAUC,2BAAK,MAAM,OAAO,sBAAA,CAAA;EAC9B,CAAA;CACD;AEJI,IAAMC,UAAU,CAAUC,OAAsBhB,OAAAA;AACrD,SAAOiB,qBAAOC,cAAUC,4BAAWH,MAAMI,KAAKpB,MAAM,EAAA,CAAA,GAAM,MAAMqB,MAAAA;AAClE;AAEO,IAAMC,iBAAiB,CAACN,OAAsBhB,IAAauB,aAAAA;AAChE,aAAOJ,4BAAWH,MAAMQ,YAAYxB,MAAM,IAAIuB,QAAAA,CAAAA;AAChD;AAEO,IAAME,aAAa,CAACT,OAAsBhB,OAAAA;AAC/C,aAAOmB,4BAAWH,MAAMU,QAAQ1B,MAAM,EAAA,CAAA;AACxC;",
-  "names": ["GRAPH_PLUGIN", "meta", "id", "name", "GraphPlugin", "definePlugin", "defineModule", "activatesOn", "Events", "Startup", "activatesBefore", "SetupAppGraph", "SetupMetadata", "activatesAfter", "AppGraphReady", "activate", "lazy", "useNode", "graph", "Option", "getOrElse", "useRxValue", "node", "undefined", "useConnections", "relation", "connections", "useActions", "actions"]
+  "sources": ["../../../src/index.ts", "../../../src/GraphPlugin.ts", "../../../src/hooks/useNode.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nexport * from '@dxos/app-graph';\n\nexport * from './GraphPlugin';\nexport * from './hooks';\nexport * from './meta';\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { defineModule, lazy, Events, definePlugin } from '@dxos/app-framework';\n\nimport { meta } from './meta';\n\n/**\n * Manages the state of the graph for the application.\n * Enables other plugins to register node builders to add nodes to the graph.\n * This includes actions and annotation each other's nodes.\n */\nexport const GraphPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/graph`,\n      activatesOn: Events.Startup,\n      activatesBefore: [Events.SetupAppGraph, Events.SetupMetadata],\n      activatesAfter: [Events.AppGraphReady],\n      activate: lazy(() => import('./graph')),\n    }),\n  ]);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useState } from 'react';\n\nimport { type Graph, type Node } from '@dxos/app-graph';\n\n/**\n * React hook to get a node from the graph.\n *\n * @param graph Graph to find the node in.\n * @param id Id of the node to find.\n * @param timeout Optional timeout in milliseconds to wait for the node to be found.\n * @returns Node if found, undefined otherwise.\n */\n// TODO(wittjosiah): Factor out?\nexport const useNode = <T = any>(graph: Graph, id?: string, timeout?: number): Node<T> | undefined => {\n  const [nodeState, setNodeState] = useState<Node<T> | undefined>(id ? graph.findNode(id, false) : undefined);\n\n  useEffect(() => {\n    if (!id && nodeState) {\n      setNodeState(undefined);\n    }\n\n    if (nodeState?.id === id || !id) {\n      return;\n    }\n\n    // Set timeout did not seem to effectively not block the UI thread.\n    const frame = requestAnimationFrame(async () => {\n      try {\n        const node = await graph.waitForNode(id, timeout);\n        if (node) {\n          setNodeState(node);\n        }\n      } catch {\n        // TODO(ZaymonFC): This leaves the resolved node in an invalid state in the case of a timeout.\n      }\n    });\n\n    return () => cancelAnimationFrame(frame);\n  }, [graph, id, timeout, nodeState?.id]);\n\n  return nodeState;\n};\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,yBAAc;ACAd,2BAAyD;ACAzD,mBAAoC;ADS7B,IAAMA,cAAc,UACzBC,mCAAaC,4BAAM;MACjBC,mCAAa;IACXC,IAAI,GAAGF,2BAAKE,EAAE;IACdC,aAAaC,4BAAOC;IACpBC,iBAAiB;MAACF,4BAAOG;MAAeH,4BAAOI;;IAC/CC,gBAAgB;MAACL,4BAAOM;;IACxBC,cAAUC,2BAAK,MAAM,OAAO,sBAAA,CAAA;EAC9B,CAAA;CACD;ACLI,IAAMC,UAAU,CAAUC,OAAcZ,IAAaa,YAAAA;AAC1D,QAAM,CAACC,WAAWC,YAAAA,QAAgBC,uBAA8BhB,KAAKY,MAAMK,SAASjB,IAAI,KAAA,IAASkB,MAAAA;AAEjGC,8BAAU,MAAA;AACR,QAAI,CAACnB,MAAMc,WAAW;AACpBC,mBAAaG,MAAAA;IACf;AAEA,QAAIJ,WAAWd,OAAOA,MAAM,CAACA,IAAI;AAC/B;IACF;AAGA,UAAMoB,QAAQC,sBAAsB,YAAA;AAClC,UAAI;AACF,cAAMC,OAAO,MAAMV,MAAMW,YAAYvB,IAAIa,OAAAA;AACzC,YAAIS,MAAM;AACRP,uBAAaO,IAAAA;QACf;MACF,QAAQ;MAER;IACF,CAAA;AAEA,WAAO,MAAME,qBAAqBJ,KAAAA;EACpC,GAAG;IAACR;IAAOZ;IAAIa;IAASC,WAAWd;GAAG;AAEtC,SAAOc;AACT;",
+  "names": ["GraphPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "Startup", "activatesBefore", "SetupAppGraph", "SetupMetadata", "activatesAfter", "AppGraphReady", "activate", "lazy", "useNode", "graph", "timeout", "nodeState", "setNodeState", "useState", "findNode", "undefined", "useEffect", "frame", "requestAnimationFrame", "node", "waitForNode", "cancelAnimationFrame"]
 }

package/dist/lib/node/meta.json

@@ -1 +1 @@
-{"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytes":950,"imports":[],"format":"esm"},"packages/plugins/plugin-graph/src/graph.ts":{"bytes":7025,"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytes":2810,"imports":[{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-graph/src/graph.ts","kind":"dynamic-import","original":"./graph"}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytes":3193,"imports":[{"path":"@effect-rx/rx-react","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytes":506,"imports":[{"path":"packages/plugins/plugin-graph/src/hooks/useNode.ts","kind":"import-statement","original":"./useNode"}],"format":"esm"},"packages/plugins/plugin-graph/src/index.ts":{"bytes":778,"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/GraphPlugin.ts","kind":"import-statement","original":"./GraphPlugin"},{"path":"packages/plugins/plugin-graph/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-graph/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3458},"packages/plugins/plugin-graph/dist/lib/node/index.cjs":{"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/dist/lib/node/graph-IZROFGJQ.cjs","kind":"dynamic-import"},{"path":"@effect-rx/rx-react","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true}],"exports":["GRAPH_PLUGIN","GraphPlugin","meta","useActions","useConnections","useNode"],"entryPoint":"packages/plugins/plugin-graph/src/index.ts","inputs":{"packages/plugins/plugin-graph/src/index.ts":{"bytesInOutput":33},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytesInOutput":417},"packages/plugins/plugin-graph/src/meta.ts":{"bytesInOutput":96},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytesInOutput":386},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytesInOutput":0}},"bytes":1313},"packages/plugins/plugin-graph/dist/lib/node/graph-IZROFGJQ.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3671},"packages/plugins/plugin-graph/dist/lib/node/graph-IZROFGJQ.cjs":{"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"exports":["default"],"entryPoint":"packages/plugins/plugin-graph/src/graph.ts","inputs":{"packages/plugins/plugin-graph/src/graph.ts":{"bytesInOutput":1331}},"bytes":1460}}}
+{"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytes":950,"imports":[],"format":"esm"},"packages/plugins/plugin-graph/src/graph.ts":{"bytes":6242,"imports":[{"path":"@preact/signals-core","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytes":2810,"imports":[{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-graph/src/graph.ts","kind":"dynamic-import","original":"./graph"}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytes":4473,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytes":506,"imports":[{"path":"packages/plugins/plugin-graph/src/hooks/useNode.ts","kind":"import-statement","original":"./useNode"}],"format":"esm"},"packages/plugins/plugin-graph/src/index.ts":{"bytes":778,"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/GraphPlugin.ts","kind":"import-statement","original":"./GraphPlugin"},{"path":"packages/plugins/plugin-graph/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-graph/dist/lib/node/index.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3652},"packages/plugins/plugin-graph/dist/lib/node/index.cjs":{"imports":[{"path":"packages/plugins/plugin-graph/dist/lib/node/chunk-AKNWBLRY.cjs","kind":"import-statement"},{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/dist/lib/node/graph-GCGIYOGJ.cjs","kind":"dynamic-import"},{"path":"react","kind":"import-statement","external":true}],"exports":["GRAPH_PLUGIN","GraphPlugin","meta","useNode"],"entryPoint":"packages/plugins/plugin-graph/src/index.ts","inputs":{"packages/plugins/plugin-graph/src/index.ts":{"bytesInOutput":33},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytesInOutput":417},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytesInOutput":662},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytesInOutput":0}},"bytes":1426},"packages/plugins/plugin-graph/dist/lib/node/graph-GCGIYOGJ.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3429},"packages/plugins/plugin-graph/dist/lib/node/graph-GCGIYOGJ.cjs":{"imports":[{"path":"packages/plugins/plugin-graph/dist/lib/node/chunk-AKNWBLRY.cjs","kind":"import-statement"},{"path":"@preact/signals-core","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"exports":["default"],"entryPoint":"packages/plugins/plugin-graph/src/graph.ts","inputs":{"packages/plugins/plugin-graph/src/graph.ts":{"bytesInOutput":1331}},"bytes":1516},"packages/plugins/plugin-graph/dist/lib/node/chunk-AKNWBLRY.cjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":447},"packages/plugins/plugin-graph/dist/lib/node/chunk-AKNWBLRY.cjs":{"imports":[],"exports":["GRAPH_PLUGIN","meta"],"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytesInOutput":96}},"bytes":221}}}

package/dist/lib/node-esm/chunk-RJQY6JZL.mjs

@@ -0,0 +1,14 @@
+import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+
+// packages/plugins/plugin-graph/src/meta.ts
+var GRAPH_PLUGIN = "dxos.org/plugin/graph";
+var meta = {
+  id: GRAPH_PLUGIN,
+  name: "Graph"
+};
+
+export {
+  GRAPH_PLUGIN,
+  meta
+};
+//# sourceMappingURL=chunk-RJQY6JZL.mjs.map

package/dist/lib/node-esm/chunk-RJQY6JZL.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/meta.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const GRAPH_PLUGIN = 'dxos.org/plugin/graph';\n\nexport const meta: PluginMeta = {\n  id: GRAPH_PLUGIN,\n  name: 'Graph',\n};\n"],
+  "mappings": ";;;AAMO,IAAMA,eAAe;AAErB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;AACR;",
+  "names": ["GRAPH_PLUGIN", "meta", "id", "name"]
+}

package/dist/lib/node-esm/graph-NUZMWBDN.mjs

@@ -0,0 +1,43 @@
+import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+import {
+  GRAPH_PLUGIN
+} from "./chunk-RJQY6JZL.mjs";
+
+// packages/plugins/plugin-graph/src/graph.ts
+import { batch, effect, untracked } from "@preact/signals-core";
+import { Capabilities, contributes } from "@dxos/app-framework";
+import { flattenExtensions, GraphBuilder } from "@dxos/app-graph";
+var KEY = `${GRAPH_PLUGIN}/app-graph`;
+var graph_default = async (context) => {
+  const builder = GraphBuilder.from(localStorage.getItem(KEY) ?? void 0);
+  const interval = setInterval(() => {
+    localStorage.setItem(KEY, builder.graph.pickle());
+  }, 5e3);
+  const unsubscribe = effect(() => {
+    batch(() => {
+      const next = flattenExtensions(context.requestCapabilities(Capabilities.AppGraphBuilder));
+      const current = untracked(() => builder.extensions);
+      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));
+      removed.forEach((extension) => builder.removeExtension(extension.id));
+      next.forEach((extension) => builder.addExtension(extension));
+    });
+  });
+  await builder.initialize();
+  await builder.graph.expand(builder.graph.root);
+  setupDevtools(builder.graph);
+  return contributes(Capabilities.AppGraph, {
+    graph: builder.graph,
+    explore: (options) => builder.explore(options)
+  }, () => {
+    clearInterval(interval);
+    unsubscribe();
+  });
+};
+var setupDevtools = (graph) => {
+  globalThis.composer ??= {};
+  globalThis.composer.graph = graph;
+};
+export {
+  graph_default as default
+};
+//# sourceMappingURL=graph-NUZMWBDN.mjs.map

package/dist/lib/node-esm/graph-NUZMWBDN.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/graph.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { batch, effect, untracked } from '@preact/signals-core';\n\nimport { Capabilities, contributes, type PluginsContext } from '@dxos/app-framework';\nimport { flattenExtensions, type Graph, GraphBuilder } from '@dxos/app-graph';\n\nimport { GRAPH_PLUGIN } from './meta';\n\nconst KEY = `${GRAPH_PLUGIN}/app-graph`;\n\nexport default async (context: PluginsContext) => {\n  const builder = GraphBuilder.from(localStorage.getItem(KEY) ?? undefined);\n  const interval = setInterval(() => {\n    localStorage.setItem(KEY, builder.graph.pickle());\n  }, 5_000);\n\n  const unsubscribe = effect(() => {\n    batch(() => {\n      const next = flattenExtensions(context.requestCapabilities(Capabilities.AppGraphBuilder));\n      const current = untracked(() => builder.extensions);\n      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));\n      removed.forEach((extension) => builder.removeExtension(extension.id));\n      next.forEach((extension) => builder.addExtension(extension));\n    });\n  });\n\n  await builder.initialize();\n  await builder.graph.expand(builder.graph.root);\n\n  setupDevtools(builder.graph);\n\n  return contributes(\n    Capabilities.AppGraph,\n    { graph: builder.graph, explore: (options) => builder.explore(options) },\n    () => {\n      clearInterval(interval);\n      unsubscribe();\n    },\n  );\n};\n\n// Expose the graph to the window for debugging.\nconst setupDevtools = (graph: Graph) => {\n  (globalThis as any).composer ??= {};\n  (globalThis as any).composer.graph = graph;\n};\n"],
+  "mappings": ";;;;;;AAIA,SAASA,OAAOC,QAAQC,iBAAiB;AAEzC,SAASC,cAAcC,mBAAwC;AAC/D,SAASC,mBAA+BC,oBAAoB;AAI5D,IAAMC,MAAM,GAAGC,YAAAA;AAEf,IAAA,gBAAe,OAAOC,YAAAA;AACpB,QAAMC,UAAUC,aAAaC,KAAKC,aAAaC,QAAQP,GAAAA,KAAQQ,MAAAA;AAC/D,QAAMC,WAAWC,YAAY,MAAA;AAC3BJ,iBAAaK,QAAQX,KAAKG,QAAQS,MAAMC,OAAM,CAAA;EAChD,GAAG,GAAA;AAEH,QAAMC,cAAcC,OAAO,MAAA;AACzBC,UAAM,MAAA;AACJ,YAAMC,OAAOC,kBAAkBhB,QAAQiB,oBAAoBC,aAAaC,eAAe,CAAA;AACvF,YAAMC,UAAUC,UAAU,MAAMpB,QAAQqB,UAAU;AAClD,YAAMC,UAAUH,QAAQI,OAAO,CAAC,EAAEC,GAAE,MAAO,CAACV,KAAKW,KAAK,CAAC,EAAED,IAAIE,OAAM,MAAOA,WAAWF,EAAAA,CAAAA;AACrFF,cAAQK,QAAQ,CAACC,cAAc5B,QAAQ6B,gBAAgBD,UAAUJ,EAAE,CAAA;AACnEV,WAAKa,QAAQ,CAACC,cAAc5B,QAAQ8B,aAAaF,SAAAA,CAAAA;IACnD,CAAA;EACF,CAAA;AAEA,QAAM5B,QAAQ+B,WAAU;AACxB,QAAM/B,QAAQS,MAAMuB,OAAOhC,QAAQS,MAAMwB,IAAI;AAE7CC,gBAAclC,QAAQS,KAAK;AAE3B,SAAO0B,YACLlB,aAAamB,UACb;IAAE3B,OAAOT,QAAQS;IAAO4B,SAAS,CAACC,YAAYtC,QAAQqC,QAAQC,OAAAA;EAAS,GACvE,MAAA;AACEC,kBAAcjC,QAAAA;AACdK,gBAAAA;EACF,CAAA;AAEJ;AAGA,IAAMuB,gBAAgB,CAACzB,UAAAA;AACpB+B,aAAmBC,aAAa,CAAC;AACjCD,aAAmBC,SAAShC,QAAQA;AACvC;",
+  "names": ["batch", "effect", "untracked", "Capabilities", "contributes", "flattenExtensions", "GraphBuilder", "KEY", "GRAPH_PLUGIN", "context", "builder", "GraphBuilder", "from", "localStorage", "getItem", "undefined", "interval", "setInterval", "setItem", "graph", "pickle", "unsubscribe", "effect", "batch", "next", "flattenExtensions", "requestCapabilities", "Capabilities", "AppGraphBuilder", "current", "untracked", "extensions", "removed", "filter", "id", "some", "nextId", "forEach", "extension", "removeExtension", "addExtension", "initialize", "expand", "root", "setupDevtools", "contributes", "AppGraph", "explore", "options", "clearInterval", "globalThis", "composer"]
+}

package/dist/lib/node-esm/index.mjs

@@ -1,19 +1,14 @@
 import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+import {
+  GRAPH_PLUGIN,
+  meta
+} from "./chunk-RJQY6JZL.mjs";
 
 // packages/plugins/plugin-graph/src/index.ts
 export * from "@dxos/app-graph";
 
 // packages/plugins/plugin-graph/src/GraphPlugin.ts
 import { defineModule, lazy, Events, definePlugin } from "@dxos/app-framework";
-
-// packages/plugins/plugin-graph/src/meta.ts
-var GRAPH_PLUGIN = "dxos.org/plugin/graph";
-var meta = {
-  id: GRAPH_PLUGIN,
-  name: "Graph"
-};
-
-// packages/plugins/plugin-graph/src/GraphPlugin.ts
 var GraphPlugin = () => definePlugin(meta, [
   defineModule({
     id: `${meta.id}/module/graph`,
@@ -25,28 +20,43 @@ var GraphPlugin = () => definePlugin(meta, [
     activatesAfter: [
       Events.AppGraphReady
     ],
-    activate: lazy(() => import("./graph-NJMEGQY3.mjs"))
+    activate: lazy(() => import("./graph-NUZMWBDN.mjs"))
   })
 ]);
 
 // packages/plugins/plugin-graph/src/hooks/useNode.ts
-import { useRxValue } from "@effect-rx/rx-react";
-import { Option } from "effect";
-var useNode = (graph, id) => {
-  return Option.getOrElse(useRxValue(graph.node(id ?? "")), () => void 0);
-};
-var useConnections = (graph, id, relation) => {
-  return useRxValue(graph.connections(id ?? "", relation));
-};
-var useActions = (graph, id) => {
-  return useRxValue(graph.actions(id ?? ""));
+import { useEffect, useState } from "react";
+var useNode = (graph, id, timeout) => {
+  const [nodeState, setNodeState] = useState(id ? graph.findNode(id, false) : void 0);
+  useEffect(() => {
+    if (!id && nodeState) {
+      setNodeState(void 0);
+    }
+    if (nodeState?.id === id || !id) {
+      return;
+    }
+    const frame = requestAnimationFrame(async () => {
+      try {
+        const node = await graph.waitForNode(id, timeout);
+        if (node) {
+          setNodeState(node);
+        }
+      } catch {
+      }
+    });
+    return () => cancelAnimationFrame(frame);
+  }, [
+    graph,
+    id,
+    timeout,
+    nodeState?.id
+  ]);
+  return nodeState;
 };
 export {
   GRAPH_PLUGIN,
   GraphPlugin,
   meta,
-  useActions,
-  useConnections,
   useNode
 };
 //# sourceMappingURL=index.mjs.map

package/dist/lib/node-esm/index.mjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
-  "sources": ["../../../src/index.ts", "../../../src/GraphPlugin.ts", "../../../src/meta.ts", "../../../src/hooks/useNode.ts"],
-  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nexport * from '@dxos/app-graph';\n\nexport * from './GraphPlugin';\nexport * from './hooks';\nexport * from './meta';\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { defineModule, lazy, Events, definePlugin } from '@dxos/app-framework';\n\nimport { meta } from './meta';\n\n/**\n * Manages the state of the graph for the application.\n * Enables other plugins to register node builders to add nodes to the graph.\n * This includes actions and annotation each other's nodes.\n */\nexport const GraphPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/graph`,\n      activatesOn: Events.Startup,\n      activatesBefore: [Events.SetupAppGraph, Events.SetupMetadata],\n      activatesAfter: [Events.AppGraphReady],\n      activate: lazy(() => import('./graph')),\n    }),\n  ]);\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const GRAPH_PLUGIN = 'dxos.org/plugin/graph';\n\nexport const meta: PluginMeta = {\n  id: GRAPH_PLUGIN,\n  name: 'Graph',\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useRxValue } from '@effect-rx/rx-react';\nimport { Option } from 'effect';\n\nimport { type ReadableGraph, type Node, type Relation } from '@dxos/app-graph';\n\n/**\n * React hook to get a node from the graph.\n *\n * @param graph Graph to find the node in.\n * @param id Id of the node to find.\n * @param timeout Optional timeout in milliseconds to wait for the node to be found.\n * @returns Node if found, undefined otherwise.\n */\n// TODO(wittjosiah): Factor out to @dxos/app-graph/react.\nexport const useNode = <T = any>(graph: ReadableGraph, id?: string): Node<T> | undefined => {\n  return Option.getOrElse(useRxValue(graph.node(id ?? '')), () => undefined);\n};\n\nexport const useConnections = (graph: ReadableGraph, id?: string, relation?: Relation): Node[] => {\n  return useRxValue(graph.connections(id ?? '', relation));\n};\n\nexport const useActions = (graph: ReadableGraph, id?: string): Node[] => {\n  return useRxValue(graph.actions(id ?? ''));\n};\n"],
-  "mappings": ";;;AAIA,cAAc;;;ACAd,SAASA,cAAcC,MAAMC,QAAQC,oBAAoB;;;ACElD,IAAMC,eAAe;AAErB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;AACR;;;ADEO,IAAMC,cAAc,MACzBC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,iBAAiB;MAACF,OAAOG;MAAeH,OAAOI;;IAC/CC,gBAAgB;MAACL,OAAOM;;IACxBC,UAAUC,KAAK,MAAM,OAAO,sBAAA,CAAA;EAC9B,CAAA;CACD;;;AElBH,SAASC,kBAAkB;AAC3B,SAASC,cAAc;AAahB,IAAMC,UAAU,CAAUC,OAAsBC,OAAAA;AACrD,SAAOC,OAAOC,UAAUC,WAAWJ,MAAMK,KAAKJ,MAAM,EAAA,CAAA,GAAM,MAAMK,MAAAA;AAClE;AAEO,IAAMC,iBAAiB,CAACP,OAAsBC,IAAaO,aAAAA;AAChE,SAAOJ,WAAWJ,MAAMS,YAAYR,MAAM,IAAIO,QAAAA,CAAAA;AAChD;AAEO,IAAME,aAAa,CAACV,OAAsBC,OAAAA;AAC/C,SAAOG,WAAWJ,MAAMW,QAAQV,MAAM,EAAA,CAAA;AACxC;",
-  "names": ["defineModule", "lazy", "Events", "definePlugin", "GRAPH_PLUGIN", "meta", "id", "name", "GraphPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "Startup", "activatesBefore", "SetupAppGraph", "SetupMetadata", "activatesAfter", "AppGraphReady", "activate", "lazy", "useRxValue", "Option", "useNode", "graph", "id", "Option", "getOrElse", "useRxValue", "node", "undefined", "useConnections", "relation", "connections", "useActions", "actions"]
+  "sources": ["../../../src/index.ts", "../../../src/GraphPlugin.ts", "../../../src/hooks/useNode.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nexport * from '@dxos/app-graph';\n\nexport * from './GraphPlugin';\nexport * from './hooks';\nexport * from './meta';\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { defineModule, lazy, Events, definePlugin } from '@dxos/app-framework';\n\nimport { meta } from './meta';\n\n/**\n * Manages the state of the graph for the application.\n * Enables other plugins to register node builders to add nodes to the graph.\n * This includes actions and annotation each other's nodes.\n */\nexport const GraphPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/graph`,\n      activatesOn: Events.Startup,\n      activatesBefore: [Events.SetupAppGraph, Events.SetupMetadata],\n      activatesAfter: [Events.AppGraphReady],\n      activate: lazy(() => import('./graph')),\n    }),\n  ]);\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { useEffect, useState } from 'react';\n\nimport { type Graph, type Node } from '@dxos/app-graph';\n\n/**\n * React hook to get a node from the graph.\n *\n * @param graph Graph to find the node in.\n * @param id Id of the node to find.\n * @param timeout Optional timeout in milliseconds to wait for the node to be found.\n * @returns Node if found, undefined otherwise.\n */\n// TODO(wittjosiah): Factor out?\nexport const useNode = <T = any>(graph: Graph, id?: string, timeout?: number): Node<T> | undefined => {\n  const [nodeState, setNodeState] = useState<Node<T> | undefined>(id ? graph.findNode(id, false) : undefined);\n\n  useEffect(() => {\n    if (!id && nodeState) {\n      setNodeState(undefined);\n    }\n\n    if (nodeState?.id === id || !id) {\n      return;\n    }\n\n    // Set timeout did not seem to effectively not block the UI thread.\n    const frame = requestAnimationFrame(async () => {\n      try {\n        const node = await graph.waitForNode(id, timeout);\n        if (node) {\n          setNodeState(node);\n        }\n      } catch {\n        // TODO(ZaymonFC): This leaves the resolved node in an invalid state in the case of a timeout.\n      }\n    });\n\n    return () => cancelAnimationFrame(frame);\n  }, [graph, id, timeout, nodeState?.id]);\n\n  return nodeState;\n};\n"],
+  "mappings": ";;;;;;;AAIA,cAAc;;;ACAd,SAASA,cAAcC,MAAMC,QAAQC,oBAAoB;AASlD,IAAMC,cAAc,MACzBC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,iBAAiB;MAACF,OAAOG;MAAeH,OAAOI;;IAC/CC,gBAAgB;MAACL,OAAOM;;IACxBC,UAAUC,KAAK,MAAM,OAAO,sBAAA,CAAA;EAC9B,CAAA;CACD;;;AClBH,SAASC,WAAWC,gBAAgB;AAa7B,IAAMC,UAAU,CAAUC,OAAcC,IAAaC,YAAAA;AAC1D,QAAM,CAACC,WAAWC,YAAAA,IAAgBC,SAA8BJ,KAAKD,MAAMM,SAASL,IAAI,KAAA,IAASM,MAAAA;AAEjGC,YAAU,MAAA;AACR,QAAI,CAACP,MAAME,WAAW;AACpBC,mBAAaG,MAAAA;IACf;AAEA,QAAIJ,WAAWF,OAAOA,MAAM,CAACA,IAAI;AAC/B;IACF;AAGA,UAAMQ,QAAQC,sBAAsB,YAAA;AAClC,UAAI;AACF,cAAMC,OAAO,MAAMX,MAAMY,YAAYX,IAAIC,OAAAA;AACzC,YAAIS,MAAM;AACRP,uBAAaO,IAAAA;QACf;MACF,QAAQ;MAER;IACF,CAAA;AAEA,WAAO,MAAME,qBAAqBJ,KAAAA;EACpC,GAAG;IAACT;IAAOC;IAAIC;IAASC,WAAWF;GAAG;AAEtC,SAAOE;AACT;",
+  "names": ["defineModule", "lazy", "Events", "definePlugin", "GraphPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "Startup", "activatesBefore", "SetupAppGraph", "SetupMetadata", "activatesAfter", "AppGraphReady", "activate", "lazy", "useEffect", "useState", "useNode", "graph", "id", "timeout", "nodeState", "setNodeState", "useState", "findNode", "undefined", "useEffect", "frame", "requestAnimationFrame", "node", "waitForNode", "cancelAnimationFrame"]
 }

package/dist/lib/node-esm/meta.json

@@ -1 +1 @@
-{"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytes":950,"imports":[],"format":"esm"},"packages/plugins/plugin-graph/src/graph.ts":{"bytes":7025,"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytes":2810,"imports":[{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-graph/src/graph.ts","kind":"dynamic-import","original":"./graph"}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytes":3193,"imports":[{"path":"@effect-rx/rx-react","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytes":506,"imports":[{"path":"packages/plugins/plugin-graph/src/hooks/useNode.ts","kind":"import-statement","original":"./useNode"}],"format":"esm"},"packages/plugins/plugin-graph/src/index.ts":{"bytes":778,"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/GraphPlugin.ts","kind":"import-statement","original":"./GraphPlugin"},{"path":"packages/plugins/plugin-graph/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-graph/dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3460},"packages/plugins/plugin-graph/dist/lib/node-esm/index.mjs":{"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/dist/lib/node-esm/graph-NJMEGQY3.mjs","kind":"dynamic-import"},{"path":"@effect-rx/rx-react","kind":"import-statement","external":true},{"path":"effect","kind":"import-statement","external":true}],"exports":["GRAPH_PLUGIN","GraphPlugin","meta","useActions","useConnections","useNode"],"entryPoint":"packages/plugins/plugin-graph/src/index.ts","inputs":{"packages/plugins/plugin-graph/src/index.ts":{"bytesInOutput":33},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytesInOutput":417},"packages/plugins/plugin-graph/src/meta.ts":{"bytesInOutput":96},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytesInOutput":386},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytesInOutput":0}},"bytes":1406},"packages/plugins/plugin-graph/dist/lib/node-esm/graph-NJMEGQY3.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3673},"packages/plugins/plugin-graph/dist/lib/node-esm/graph-NJMEGQY3.mjs":{"imports":[{"path":"effect","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"exports":["default"],"entryPoint":"packages/plugins/plugin-graph/src/graph.ts","inputs":{"packages/plugins/plugin-graph/src/graph.ts":{"bytesInOutput":1331}},"bytes":1553}}}
+{"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytes":950,"imports":[],"format":"esm"},"packages/plugins/plugin-graph/src/graph.ts":{"bytes":6242,"imports":[{"path":"@preact/signals-core","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytes":2810,"imports":[{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"},{"path":"packages/plugins/plugin-graph/src/graph.ts","kind":"dynamic-import","original":"./graph"}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytes":4473,"imports":[{"path":"react","kind":"import-statement","external":true}],"format":"esm"},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytes":506,"imports":[{"path":"packages/plugins/plugin-graph/src/hooks/useNode.ts","kind":"import-statement","original":"./useNode"}],"format":"esm"},"packages/plugins/plugin-graph/src/index.ts":{"bytes":778,"imports":[{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/src/GraphPlugin.ts","kind":"import-statement","original":"./GraphPlugin"},{"path":"packages/plugins/plugin-graph/src/hooks/index.ts","kind":"import-statement","original":"./hooks"},{"path":"packages/plugins/plugin-graph/src/meta.ts","kind":"import-statement","original":"./meta"}],"format":"esm"}},"outputs":{"packages/plugins/plugin-graph/dist/lib/node-esm/index.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3653},"packages/plugins/plugin-graph/dist/lib/node-esm/index.mjs":{"imports":[{"path":"packages/plugins/plugin-graph/dist/lib/node-esm/chunk-RJQY6JZL.mjs","kind":"import-statement"},{"path":"@dxos/app-graph","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"packages/plugins/plugin-graph/dist/lib/node-esm/graph-NUZMWBDN.mjs","kind":"dynamic-import"},{"path":"react","kind":"import-statement","external":true}],"exports":["GRAPH_PLUGIN","GraphPlugin","meta","useNode"],"entryPoint":"packages/plugins/plugin-graph/src/index.ts","inputs":{"packages/plugins/plugin-graph/src/index.ts":{"bytesInOutput":33},"packages/plugins/plugin-graph/src/GraphPlugin.ts":{"bytesInOutput":417},"packages/plugins/plugin-graph/src/hooks/useNode.ts":{"bytesInOutput":662},"packages/plugins/plugin-graph/src/hooks/index.ts":{"bytesInOutput":0}},"bytes":1518},"packages/plugins/plugin-graph/dist/lib/node-esm/graph-NUZMWBDN.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":3430},"packages/plugins/plugin-graph/dist/lib/node-esm/graph-NUZMWBDN.mjs":{"imports":[{"path":"packages/plugins/plugin-graph/dist/lib/node-esm/chunk-RJQY6JZL.mjs","kind":"import-statement"},{"path":"@preact/signals-core","kind":"import-statement","external":true},{"path":"@dxos/app-framework","kind":"import-statement","external":true},{"path":"@dxos/app-graph","kind":"import-statement","external":true}],"exports":["default"],"entryPoint":"packages/plugins/plugin-graph/src/graph.ts","inputs":{"packages/plugins/plugin-graph/src/graph.ts":{"bytesInOutput":1331}},"bytes":1608},"packages/plugins/plugin-graph/dist/lib/node-esm/chunk-RJQY6JZL.mjs.map":{"imports":[],"exports":[],"inputs":{},"bytes":449},"packages/plugins/plugin-graph/dist/lib/node-esm/chunk-RJQY6JZL.mjs":{"imports":[],"exports":["GRAPH_PLUGIN","meta"],"inputs":{"packages/plugins/plugin-graph/src/meta.ts":{"bytesInOutput":96}},"bytes":314}}}

package/dist/types/src/graph.d.ts

@@ -1,8 +1,8 @@
-import { type PluginContext } from '@dxos/app-framework';
-import { type ExpandableGraph } from '@dxos/app-graph';
-declare const _default: (context: PluginContext) => Promise<import("@dxos/app-framework").Capability<{
-    graph: ExpandableGraph;
-    explore: ({ registry, source, relation, visitor }: import("@dxos/app-graph").GraphBuilderTraverseOptions, path?: string[]) => Promise<void>;
+import { type PluginsContext } from '@dxos/app-framework';
+import { type Graph } from '@dxos/app-graph';
+declare const _default: (context: PluginsContext) => Promise<import("@dxos/app-framework").Capability<{
+    graph: Graph;
+    explore: (options: import("@dxos/app-graph").GraphBuilderTraverseOptions) => Promise<void>;
 }>>;
 export default _default;
 //# sourceMappingURL=graph.d.ts.map

package/dist/types/src/graph.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"graph.d.ts","sourceRoot":"","sources":["../../../src/graph.ts"],"names":[],"mappings":"AAMA,OAAO,EAA6B,KAAK,aAAa,EAAE,MAAM,qBAAqB,CAAC;AACpF,OAAO,EAAmC,KAAK,eAAe,EAAW,MAAM,iBAAiB,CAAC;yBAM3E,SAAS,aAAa;;;;AAA5C,wBAkCE"}
+{"version":3,"file":"graph.d.ts","sourceRoot":"","sources":["../../../src/graph.ts"],"names":[],"mappings":"AAMA,OAAO,EAA6B,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrF,OAAO,EAAqB,KAAK,KAAK,EAAgB,MAAM,iBAAiB,CAAC;kCAM/C,cAAc;;;;AAA7C,wBA6BE"}

package/dist/types/src/hooks/useNode.d.ts

@@ -1,4 +1,4 @@
-import { type ReadableGraph, type Node, type Relation } from '@dxos/app-graph';
+import { type Graph, type Node } from '@dxos/app-graph';
 /**
  * React hook to get a node from the graph.
  *
@@ -7,7 +7,5 @@ import { type ReadableGraph, type Node, type Relation } from '@dxos/app-graph';
  * @param timeout Optional timeout in milliseconds to wait for the node to be found.
  * @returns Node if found, undefined otherwise.
  */
-export declare const useNode: <T = any>(graph: ReadableGraph, id?: string) => Node<T> | undefined;
-export declare const useConnections: (graph: ReadableGraph, id?: string, relation?: Relation) => Node[];
-export declare const useActions: (graph: ReadableGraph, id?: string) => Node[];
+export declare const useNode: <T = any>(graph: Graph, id?: string, timeout?: number) => Node<T> | undefined;
 //# sourceMappingURL=useNode.d.ts.map

package/dist/types/src/hooks/useNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useNode.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useNode.ts"],"names":[],"mappings":"AAOA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,IAAI,EAAE,KAAK,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE/E;;;;;;;GAOG;AAEH,eAAO,MAAM,OAAO,GAAI,CAAC,GAAG,GAAG,EAAE,OAAO,aAAa,EAAE,KAAK,MAAM,KAAG,IAAI,CAAC,CAAC,CAAC,GAAG,SAE9E,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,OAAO,aAAa,EAAE,KAAK,MAAM,EAAE,WAAW,QAAQ,KAAG,IAAI,EAE3F,CAAC;AAEF,eAAO,MAAM,UAAU,GAAI,OAAO,aAAa,EAAE,KAAK,MAAM,KAAG,IAAI,EAElE,CAAC"}
+{"version":3,"file":"useNode.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useNode.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,KAAK,EAAE,KAAK,IAAI,EAAE,MAAM,iBAAiB,CAAC;AAExD;;;;;;;GAOG;AAEH,eAAO,MAAM,OAAO,GAAI,CAAC,eAAe,KAAK,OAAO,MAAM,YAAY,MAAM,KAAG,IAAI,CAAC,CAAC,CAAC,GAAG,SA4BxF,CAAC"}

package/dist/types/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"version":"5.8.3"}
+{"version":"5.7.3"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/plugin-graph",
-  "version": "0.8.2-main.fbd8ed0",
+  "version": "0.8.2-staging.7ac8446",
   "description": "DXOS Surface plugin for constructing knowledge graphs",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -24,27 +24,22 @@
     "src"
   ],
   "dependencies": {
-    "@dxos/app-framework": "0.8.2-main.fbd8ed0",
-    "@dxos/async": "0.8.2-main.fbd8ed0",
-    "@dxos/app-graph": "0.8.2-main.fbd8ed0",
-    "@dxos/debug": "0.8.2-main.fbd8ed0"
+    "@preact/signals-core": "^1.6.0",
+    "@dxos/app-framework": "0.8.2-staging.7ac8446",
+    "@dxos/debug": "0.8.2-staging.7ac8446",
+    "@dxos/async": "0.8.2-staging.7ac8446",
+    "@dxos/app-graph": "0.8.2-staging.7ac8446"
   },
   "devDependencies": {
-    "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
-    "effect": "^3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "vite": "5.4.7",
-    "@dxos/react-client": "0.8.2-main.fbd8ed0",
-    "@dxos/storybook-utils": "0.8.2-main.fbd8ed0"
+    "@dxos/storybook-utils": "0.8.2-staging.7ac8446",
+    "@dxos/react-client": "0.8.2-staging.7ac8446"
   },
   "peerDependencies": {
-    "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
-    "effect": "^3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0"
   },

package/src/graph.ts

@@ -2,53 +2,48 @@
 // Copyright 2025 DXOS.org
 //
 
-import { Option, Record } from 'effect';
+import { batch, effect, untracked } from '@preact/signals-core';
 
-import { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';
-import { flattenExtensions, GraphBuilder, type ExpandableGraph, ROOT_ID } from '@dxos/app-graph';
+import { Capabilities, contributes, type PluginsContext } from '@dxos/app-framework';
+import { flattenExtensions, type Graph, GraphBuilder } from '@dxos/app-graph';
 
-// import { GRAPH_PLUGIN } from './meta';
+import { GRAPH_PLUGIN } from './meta';
 
-// const KEY = `${GRAPH_PLUGIN}/app-graph`;
+const KEY = `${GRAPH_PLUGIN}/app-graph`;
 
-export default async (context: PluginContext) => {
-  const registry = context.getCapability(Capabilities.RxRegistry);
-  const builder = GraphBuilder.from(/* localStorage.getItem(KEY) ?? */ undefined, registry);
-  // const interval = setInterval(() => {
-  //   localStorage.setItem(KEY, builder.graph.pickle());
-  // }, 5_000);
+export default async (context: PluginsContext) => {
+  const builder = GraphBuilder.from(localStorage.getItem(KEY) ?? undefined);
+  const interval = setInterval(() => {
+    localStorage.setItem(KEY, builder.graph.pickle());
+  }, 5_000);
 
-  const unsubscribe = registry.subscribe(
-    context.capabilities(Capabilities.AppGraphBuilder),
-    (extensions) => {
-      const next = flattenExtensions(extensions);
-      const current = Record.values(registry.get(builder.extensions));
+  const unsubscribe = effect(() => {
+    batch(() => {
+      const next = flattenExtensions(context.requestCapabilities(Capabilities.AppGraphBuilder));
+      const current = untracked(() => builder.extensions);
       const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));
       removed.forEach((extension) => builder.removeExtension(extension.id));
       next.forEach((extension) => builder.addExtension(extension));
-    },
-    { immediate: true },
-  );
-
-  // TODO(wittjosiah): Stop expanding the graph eagerly.
-  builder.graph.onNodeChanged.on(({ id, node }) => {
-    if (Option.isSome(node)) {
-      builder.graph.expand(id);
-    }
+    });
   });
-  // await builder.initialize();
-  builder.graph.expand(ROOT_ID);
+
+  await builder.initialize();
+  await builder.graph.expand(builder.graph.root);
 
   setupDevtools(builder.graph);
 
-  return contributes(Capabilities.AppGraph, { graph: builder.graph, explore: builder.explore }, () => {
-    // clearInterval(interval);
-    unsubscribe();
-  });
+  return contributes(
+    Capabilities.AppGraph,
+    { graph: builder.graph, explore: (options) => builder.explore(options) },
+    () => {
+      clearInterval(interval);
+      unsubscribe();
+    },
+  );
 };
 
 // Expose the graph to the window for debugging.
-const setupDevtools = (graph: ExpandableGraph) => {
+const setupDevtools = (graph: Graph) => {
   (globalThis as any).composer ??= {};
   (globalThis as any).composer.graph = graph;
 };

package/src/hooks/useNode.ts

@@ -2,10 +2,9 @@
 // Copyright 2024 DXOS.org
 //
 
-import { useRxValue } from '@effect-rx/rx-react';
-import { Option } from 'effect';
+import { useEffect, useState } from 'react';
 
-import { type ReadableGraph, type Node, type Relation } from '@dxos/app-graph';
+import { type Graph, type Node } from '@dxos/app-graph';
 
 /**
  * React hook to get a node from the graph.
@@ -15,15 +14,33 @@ import { type ReadableGraph, type Node, type Relation } from '@dxos/app-graph';
  * @param timeout Optional timeout in milliseconds to wait for the node to be found.
  * @returns Node if found, undefined otherwise.
  */
-// TODO(wittjosiah): Factor out to @dxos/app-graph/react.
-export const useNode = <T = any>(graph: ReadableGraph, id?: string): Node<T> | undefined => {
-  return Option.getOrElse(useRxValue(graph.node(id ?? '')), () => undefined);
-};
+// TODO(wittjosiah): Factor out?
+export const useNode = <T = any>(graph: Graph, id?: string, timeout?: number): Node<T> | undefined => {
+  const [nodeState, setNodeState] = useState<Node<T> | undefined>(id ? graph.findNode(id, false) : undefined);
 
-export const useConnections = (graph: ReadableGraph, id?: string, relation?: Relation): Node[] => {
-  return useRxValue(graph.connections(id ?? '', relation));
-};
+  useEffect(() => {
+    if (!id && nodeState) {
+      setNodeState(undefined);
+    }
+
+    if (nodeState?.id === id || !id) {
+      return;
+    }
+
+    // Set timeout did not seem to effectively not block the UI thread.
+    const frame = requestAnimationFrame(async () => {
+      try {
+        const node = await graph.waitForNode(id, timeout);
+        if (node) {
+          setNodeState(node);
+        }
+      } catch {
+        // TODO(ZaymonFC): This leaves the resolved node in an invalid state in the case of a timeout.
+      }
+    });
+
+    return () => cancelAnimationFrame(frame);
+  }, [graph, id, timeout, nodeState?.id]);
 
-export const useActions = (graph: ReadableGraph, id?: string): Node[] => {
-  return useRxValue(graph.actions(id ?? ''));
+  return nodeState;
 };

package/dist/lib/browser/graph-5AJD2WYC.mjs

@@ -1,42 +0,0 @@
-// packages/plugins/plugin-graph/src/graph.ts
-import { Option, Record } from "effect";
-import { Capabilities, contributes } from "@dxos/app-framework";
-import { flattenExtensions, GraphBuilder, ROOT_ID } from "@dxos/app-graph";
-var graph_default = async (context) => {
-  const registry = context.getCapability(Capabilities.RxRegistry);
-  const builder = GraphBuilder.from(
-    /* localStorage.getItem(KEY) ?? */
-    void 0,
-    registry
-  );
-  const unsubscribe = registry.subscribe(context.capabilities(Capabilities.AppGraphBuilder), (extensions) => {
-    const next = flattenExtensions(extensions);
-    const current = Record.values(registry.get(builder.extensions));
-    const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));
-    removed.forEach((extension) => builder.removeExtension(extension.id));
-    next.forEach((extension) => builder.addExtension(extension));
-  }, {
-    immediate: true
-  });
-  builder.graph.onNodeChanged.on(({ id, node }) => {
-    if (Option.isSome(node)) {
-      builder.graph.expand(id);
-    }
-  });
-  builder.graph.expand(ROOT_ID);
-  setupDevtools(builder.graph);
-  return contributes(Capabilities.AppGraph, {
-    graph: builder.graph,
-    explore: builder.explore
-  }, () => {
-    unsubscribe();
-  });
-};
-var setupDevtools = (graph) => {
-  globalThis.composer ??= {};
-  globalThis.composer.graph = graph;
-};
-export {
-  graph_default as default
-};
-//# sourceMappingURL=graph-5AJD2WYC.mjs.map

package/dist/lib/browser/graph-5AJD2WYC.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/graph.ts"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { Option, Record } from 'effect';\n\nimport { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';\nimport { flattenExtensions, GraphBuilder, type ExpandableGraph, ROOT_ID } from '@dxos/app-graph';\n\n// import { GRAPH_PLUGIN } from './meta';\n\n// const KEY = `${GRAPH_PLUGIN}/app-graph`;\n\nexport default async (context: PluginContext) => {\n  const registry = context.getCapability(Capabilities.RxRegistry);\n  const builder = GraphBuilder.from(/* localStorage.getItem(KEY) ?? */ undefined, registry);\n  // const interval = setInterval(() => {\n  //   localStorage.setItem(KEY, builder.graph.pickle());\n  // }, 5_000);\n\n  const unsubscribe = registry.subscribe(\n    context.capabilities(Capabilities.AppGraphBuilder),\n    (extensions) => {\n      const next = flattenExtensions(extensions);\n      const current = Record.values(registry.get(builder.extensions));\n      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));\n      removed.forEach((extension) => builder.removeExtension(extension.id));\n      next.forEach((extension) => builder.addExtension(extension));\n    },\n    { immediate: true },\n  );\n\n  // TODO(wittjosiah): Stop expanding the graph eagerly.\n  builder.graph.onNodeChanged.on(({ id, node }) => {\n    if (Option.isSome(node)) {\n      builder.graph.expand(id);\n    }\n  });\n  // await builder.initialize();\n  builder.graph.expand(ROOT_ID);\n\n  setupDevtools(builder.graph);\n\n  return contributes(Capabilities.AppGraph, { graph: builder.graph, explore: builder.explore }, () => {\n    // clearInterval(interval);\n    unsubscribe();\n  });\n};\n\n// Expose the graph to the window for debugging.\nconst setupDevtools = (graph: ExpandableGraph) => {\n  (globalThis as any).composer ??= {};\n  (globalThis as any).composer.graph = graph;\n};\n"],
-  "mappings": ";AAIA,SAASA,QAAQC,cAAc;AAE/B,SAASC,cAAcC,mBAAuC;AAC9D,SAASC,mBAAmBC,cAAoCC,eAAe;AAM/E,IAAA,gBAAe,OAAOC,YAAAA;AACpB,QAAMC,WAAWD,QAAQE,cAAcC,aAAaC,UAAU;AAC9D,QAAMC,UAAUC,aAAaC;;IAAwCC;IAAWP;EAAAA;AAKhF,QAAMQ,cAAcR,SAASS,UAC3BV,QAAQW,aAAaR,aAAaS,eAAe,GACjD,CAACC,eAAAA;AACC,UAAMC,OAAOC,kBAAkBF,UAAAA;AAC/B,UAAMG,UAAUC,OAAOC,OAAOjB,SAASkB,IAAId,QAAQQ,UAAU,CAAA;AAC7D,UAAMO,UAAUJ,QAAQK,OAAO,CAAC,EAAEC,GAAE,MAAO,CAACR,KAAKS,KAAK,CAAC,EAAED,IAAIE,OAAM,MAAOA,WAAWF,EAAAA,CAAAA;AACrFF,YAAQK,QAAQ,CAACC,cAAcrB,QAAQsB,gBAAgBD,UAAUJ,EAAE,CAAA;AACnER,SAAKW,QAAQ,CAACC,cAAcrB,QAAQuB,aAAaF,SAAAA,CAAAA;EACnD,GACA;IAAEG,WAAW;EAAK,CAAA;AAIpBxB,UAAQyB,MAAMC,cAAcC,GAAG,CAAC,EAAEV,IAAIW,KAAI,MAAE;AAC1C,QAAIC,OAAOC,OAAOF,IAAAA,GAAO;AACvB5B,cAAQyB,MAAMM,OAAOd,EAAAA;IACvB;EACF,CAAA;AAEAjB,UAAQyB,MAAMM,OAAOC,OAAAA;AAErBC,gBAAcjC,QAAQyB,KAAK;AAE3B,SAAOS,YAAYpC,aAAaqC,UAAU;IAAEV,OAAOzB,QAAQyB;IAAOW,SAASpC,QAAQoC;EAAQ,GAAG,MAAA;AAE5FhC,gBAAAA;EACF,CAAA;AACF;AAGA,IAAM6B,gBAAgB,CAACR,UAAAA;AACpBY,aAAmBC,aAAa,CAAC;AACjCD,aAAmBC,SAASb,QAAQA;AACvC;",
-  "names": ["Option", "Record", "Capabilities", "contributes", "flattenExtensions", "GraphBuilder", "ROOT_ID", "context", "registry", "getCapability", "Capabilities", "RxRegistry", "builder", "GraphBuilder", "from", "undefined", "unsubscribe", "subscribe", "capabilities", "AppGraphBuilder", "extensions", "next", "flattenExtensions", "current", "Record", "values", "get", "removed", "filter", "id", "some", "nextId", "forEach", "extension", "removeExtension", "addExtension", "immediate", "graph", "onNodeChanged", "on", "node", "Option", "isSome", "expand", "ROOT_ID", "setupDevtools", "contributes", "AppGraph", "explore", "globalThis", "composer"]
-}

package/dist/lib/node/graph-IZROFGJQ.cjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/graph.ts"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { Option, Record } from 'effect';\n\nimport { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';\nimport { flattenExtensions, GraphBuilder, type ExpandableGraph, ROOT_ID } from '@dxos/app-graph';\n\n// import { GRAPH_PLUGIN } from './meta';\n\n// const KEY = `${GRAPH_PLUGIN}/app-graph`;\n\nexport default async (context: PluginContext) => {\n  const registry = context.getCapability(Capabilities.RxRegistry);\n  const builder = GraphBuilder.from(/* localStorage.getItem(KEY) ?? */ undefined, registry);\n  // const interval = setInterval(() => {\n  //   localStorage.setItem(KEY, builder.graph.pickle());\n  // }, 5_000);\n\n  const unsubscribe = registry.subscribe(\n    context.capabilities(Capabilities.AppGraphBuilder),\n    (extensions) => {\n      const next = flattenExtensions(extensions);\n      const current = Record.values(registry.get(builder.extensions));\n      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));\n      removed.forEach((extension) => builder.removeExtension(extension.id));\n      next.forEach((extension) => builder.addExtension(extension));\n    },\n    { immediate: true },\n  );\n\n  // TODO(wittjosiah): Stop expanding the graph eagerly.\n  builder.graph.onNodeChanged.on(({ id, node }) => {\n    if (Option.isSome(node)) {\n      builder.graph.expand(id);\n    }\n  });\n  // await builder.initialize();\n  builder.graph.expand(ROOT_ID);\n\n  setupDevtools(builder.graph);\n\n  return contributes(Capabilities.AppGraph, { graph: builder.graph, explore: builder.explore }, () => {\n    // clearInterval(interval);\n    unsubscribe();\n  });\n};\n\n// Expose the graph to the window for debugging.\nconst setupDevtools = (graph: ExpandableGraph) => {\n  (globalThis as any).composer ??= {};\n  (globalThis as any).composer.graph = graph;\n};\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;AAIA,oBAA+B;AAE/B,2BAA8D;AAC9D,uBAA+E;AAM/E,IAAA,gBAAe,OAAOA,YAAAA;AACpB,QAAMC,WAAWD,QAAQE,cAAcC,kCAAaC,UAAU;AAC9D,QAAMC,UAAUC,8BAAaC;;IAAwCC;IAAWP;EAAAA;AAKhF,QAAMQ,cAAcR,SAASS,UAC3BV,QAAQW,aAAaR,kCAAaS,eAAe,GACjD,CAACC,eAAAA;AACC,UAAMC,WAAOC,oCAAkBF,UAAAA;AAC/B,UAAMG,UAAUC,qBAAOC,OAAOjB,SAASkB,IAAId,QAAQQ,UAAU,CAAA;AAC7D,UAAMO,UAAUJ,QAAQK,OAAO,CAAC,EAAEC,GAAE,MAAO,CAACR,KAAKS,KAAK,CAAC,EAAED,IAAIE,OAAM,MAAOA,WAAWF,EAAAA,CAAAA;AACrFF,YAAQK,QAAQ,CAACC,cAAcrB,QAAQsB,gBAAgBD,UAAUJ,EAAE,CAAA;AACnER,SAAKW,QAAQ,CAACC,cAAcrB,QAAQuB,aAAaF,SAAAA,CAAAA;EACnD,GACA;IAAEG,WAAW;EAAK,CAAA;AAIpBxB,UAAQyB,MAAMC,cAAcC,GAAG,CAAC,EAAEV,IAAIW,KAAI,MAAE;AAC1C,QAAIC,qBAAOC,OAAOF,IAAAA,GAAO;AACvB5B,cAAQyB,MAAMM,OAAOd,EAAAA;IACvB;EACF,CAAA;AAEAjB,UAAQyB,MAAMM,OAAOC,wBAAAA;AAErBC,gBAAcjC,QAAQyB,KAAK;AAE3B,aAAOS,kCAAYpC,kCAAaqC,UAAU;IAAEV,OAAOzB,QAAQyB;IAAOW,SAASpC,QAAQoC;EAAQ,GAAG,MAAA;AAE5FhC,gBAAAA;EACF,CAAA;AACF;AAGA,IAAM6B,gBAAgB,CAACR,UAAAA;AACpBY,aAAmBC,aAAa,CAAC;AACjCD,aAAmBC,SAASb,QAAQA;AACvC;",
-  "names": ["context", "registry", "getCapability", "Capabilities", "RxRegistry", "builder", "GraphBuilder", "from", "undefined", "unsubscribe", "subscribe", "capabilities", "AppGraphBuilder", "extensions", "next", "flattenExtensions", "current", "Record", "values", "get", "removed", "filter", "id", "some", "nextId", "forEach", "extension", "removeExtension", "addExtension", "immediate", "graph", "onNodeChanged", "on", "node", "Option", "isSome", "expand", "ROOT_ID", "setupDevtools", "contributes", "AppGraph", "explore", "globalThis", "composer"]
-}

package/dist/lib/node-esm/graph-NJMEGQY3.mjs

@@ -1,44 +0,0 @@
-import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
-
-// packages/plugins/plugin-graph/src/graph.ts
-import { Option, Record } from "effect";
-import { Capabilities, contributes } from "@dxos/app-framework";
-import { flattenExtensions, GraphBuilder, ROOT_ID } from "@dxos/app-graph";
-var graph_default = async (context) => {
-  const registry = context.getCapability(Capabilities.RxRegistry);
-  const builder = GraphBuilder.from(
-    /* localStorage.getItem(KEY) ?? */
-    void 0,
-    registry
-  );
-  const unsubscribe = registry.subscribe(context.capabilities(Capabilities.AppGraphBuilder), (extensions) => {
-    const next = flattenExtensions(extensions);
-    const current = Record.values(registry.get(builder.extensions));
-    const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));
-    removed.forEach((extension) => builder.removeExtension(extension.id));
-    next.forEach((extension) => builder.addExtension(extension));
-  }, {
-    immediate: true
-  });
-  builder.graph.onNodeChanged.on(({ id, node }) => {
-    if (Option.isSome(node)) {
-      builder.graph.expand(id);
-    }
-  });
-  builder.graph.expand(ROOT_ID);
-  setupDevtools(builder.graph);
-  return contributes(Capabilities.AppGraph, {
-    graph: builder.graph,
-    explore: builder.explore
-  }, () => {
-    unsubscribe();
-  });
-};
-var setupDevtools = (graph) => {
-  globalThis.composer ??= {};
-  globalThis.composer.graph = graph;
-};
-export {
-  graph_default as default
-};
-//# sourceMappingURL=graph-NJMEGQY3.mjs.map

package/dist/lib/node-esm/graph-NJMEGQY3.mjs.map

@@ -1,7 +0,0 @@
-{
-  "version": 3,
-  "sources": ["../../../src/graph.ts"],
-  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { Option, Record } from 'effect';\n\nimport { Capabilities, contributes, type PluginContext } from '@dxos/app-framework';\nimport { flattenExtensions, GraphBuilder, type ExpandableGraph, ROOT_ID } from '@dxos/app-graph';\n\n// import { GRAPH_PLUGIN } from './meta';\n\n// const KEY = `${GRAPH_PLUGIN}/app-graph`;\n\nexport default async (context: PluginContext) => {\n  const registry = context.getCapability(Capabilities.RxRegistry);\n  const builder = GraphBuilder.from(/* localStorage.getItem(KEY) ?? */ undefined, registry);\n  // const interval = setInterval(() => {\n  //   localStorage.setItem(KEY, builder.graph.pickle());\n  // }, 5_000);\n\n  const unsubscribe = registry.subscribe(\n    context.capabilities(Capabilities.AppGraphBuilder),\n    (extensions) => {\n      const next = flattenExtensions(extensions);\n      const current = Record.values(registry.get(builder.extensions));\n      const removed = current.filter(({ id }) => !next.some(({ id: nextId }) => nextId === id));\n      removed.forEach((extension) => builder.removeExtension(extension.id));\n      next.forEach((extension) => builder.addExtension(extension));\n    },\n    { immediate: true },\n  );\n\n  // TODO(wittjosiah): Stop expanding the graph eagerly.\n  builder.graph.onNodeChanged.on(({ id, node }) => {\n    if (Option.isSome(node)) {\n      builder.graph.expand(id);\n    }\n  });\n  // await builder.initialize();\n  builder.graph.expand(ROOT_ID);\n\n  setupDevtools(builder.graph);\n\n  return contributes(Capabilities.AppGraph, { graph: builder.graph, explore: builder.explore }, () => {\n    // clearInterval(interval);\n    unsubscribe();\n  });\n};\n\n// Expose the graph to the window for debugging.\nconst setupDevtools = (graph: ExpandableGraph) => {\n  (globalThis as any).composer ??= {};\n  (globalThis as any).composer.graph = graph;\n};\n"],
-  "mappings": ";;;AAIA,SAASA,QAAQC,cAAc;AAE/B,SAASC,cAAcC,mBAAuC;AAC9D,SAASC,mBAAmBC,cAAoCC,eAAe;AAM/E,IAAA,gBAAe,OAAOC,YAAAA;AACpB,QAAMC,WAAWD,QAAQE,cAAcC,aAAaC,UAAU;AAC9D,QAAMC,UAAUC,aAAaC;;IAAwCC;IAAWP;EAAAA;AAKhF,QAAMQ,cAAcR,SAASS,UAC3BV,QAAQW,aAAaR,aAAaS,eAAe,GACjD,CAACC,eAAAA;AACC,UAAMC,OAAOC,kBAAkBF,UAAAA;AAC/B,UAAMG,UAAUC,OAAOC,OAAOjB,SAASkB,IAAId,QAAQQ,UAAU,CAAA;AAC7D,UAAMO,UAAUJ,QAAQK,OAAO,CAAC,EAAEC,GAAE,MAAO,CAACR,KAAKS,KAAK,CAAC,EAAED,IAAIE,OAAM,MAAOA,WAAWF,EAAAA,CAAAA;AACrFF,YAAQK,QAAQ,CAACC,cAAcrB,QAAQsB,gBAAgBD,UAAUJ,EAAE,CAAA;AACnER,SAAKW,QAAQ,CAACC,cAAcrB,QAAQuB,aAAaF,SAAAA,CAAAA;EACnD,GACA;IAAEG,WAAW;EAAK,CAAA;AAIpBxB,UAAQyB,MAAMC,cAAcC,GAAG,CAAC,EAAEV,IAAIW,KAAI,MAAE;AAC1C,QAAIC,OAAOC,OAAOF,IAAAA,GAAO;AACvB5B,cAAQyB,MAAMM,OAAOd,EAAAA;IACvB;EACF,CAAA;AAEAjB,UAAQyB,MAAMM,OAAOC,OAAAA;AAErBC,gBAAcjC,QAAQyB,KAAK;AAE3B,SAAOS,YAAYpC,aAAaqC,UAAU;IAAEV,OAAOzB,QAAQyB;IAAOW,SAASpC,QAAQoC;EAAQ,GAAG,MAAA;AAE5FhC,gBAAAA;EACF,CAAA;AACF;AAGA,IAAM6B,gBAAgB,CAACR,UAAAA;AACpBY,aAAmBC,aAAa,CAAC;AACjCD,aAAmBC,SAASb,QAAQA;AACvC;",
-  "names": ["Option", "Record", "Capabilities", "contributes", "flattenExtensions", "GraphBuilder", "ROOT_ID", "context", "registry", "getCapability", "Capabilities", "RxRegistry", "builder", "GraphBuilder", "from", "undefined", "unsubscribe", "subscribe", "capabilities", "AppGraphBuilder", "extensions", "next", "flattenExtensions", "current", "Record", "values", "get", "removed", "filter", "id", "some", "nextId", "forEach", "extension", "removeExtension", "addExtension", "immediate", "graph", "onNodeChanged", "on", "node", "Option", "isSome", "expand", "ROOT_ID", "setupDevtools", "contributes", "AppGraph", "explore", "globalThis", "composer"]
-}