@dxos/plugin-explorer 0.8.1 → 0.8.2-main.10c050d

package/dist/lib/node-esm/{chunk-PUFSCMN4.mjs → chunk-3CMBLK6W.mjs}

@@ -7,9 +7,9 @@ var meta = {
   name: "Explorer",
   description: "Install this plugin to view a hypergraph of all objects inside of your Space.",
   icon: "ph--graph--regular",
-  source: "https://github.com/dxos/dxos/tree/main/packages/plugins/experimental/plugin-explorer",
+  source: "https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-explorer",
   tags: [
-    "experimental"
+    "labs"
   ],
   screenshots: [
     "https://dxos.network/plugin-details-explorer-dark.png"
@@ -20,4 +20,4 @@ export {
   EXPLORER_PLUGIN,
   meta
 };
-//# sourceMappingURL=chunk-PUFSCMN4.mjs.map
+//# sourceMappingURL=chunk-3CMBLK6W.mjs.map

package/dist/lib/node-esm/{chunk-PUFSCMN4.mjs.map → chunk-3CMBLK6W.mjs.map}

@@ -1,7 +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 EXPLORER_PLUGIN = 'dxos.org/plugin/explorer';\n\nexport const meta: PluginMeta = {\n  id: EXPLORER_PLUGIN,\n  name: 'Explorer',\n  description: 'Install this plugin to view a hypergraph of all objects inside of your Space.',\n  icon: 'ph--graph--regular',\n  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/experimental/plugin-explorer',\n  tags: ['experimental'],\n  screenshots: ['https://dxos.network/plugin-details-explorer-dark.png'],\n};\n"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { type PluginMeta } from '@dxos/app-framework';\n\nexport const EXPLORER_PLUGIN = 'dxos.org/plugin/explorer';\n\nexport const meta: PluginMeta = {\n  id: EXPLORER_PLUGIN,\n  name: 'Explorer',\n  description: 'Install this plugin to view a hypergraph of all objects inside of your Space.',\n  icon: 'ph--graph--regular',\n  source: 'https://github.com/dxos/dxos/tree/main/packages/plugins/plugin-explorer',\n  tags: ['labs'],\n  screenshots: ['https://dxos.network/plugin-details-explorer-dark.png'],\n};\n"],
   "mappings": ";;;AAMO,IAAMA,kBAAkB;AAExB,IAAMC,OAAmB;EAC9BC,IAAIF;EACJG,MAAM;EACNC,aAAa;EACbC,MAAM;EACNC,QAAQ;EACRC,MAAM;IAAC;;EACPC,aAAa;IAAC;;AAChB;",
   "names": ["EXPLORER_PLUGIN", "meta", "id", "name", "description", "icon", "source", "tags", "screenshots"]
 }

package/dist/lib/node-esm/{chunk-QZH2GDN5.mjs → chunk-N6VEANUZ.mjs}

@@ -1,38 +1,39 @@
 import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
 import {
   EXPLORER_PLUGIN
-} from "./chunk-PUFSCMN4.mjs";
+} from "./chunk-3CMBLK6W.mjs";
 
 // packages/plugins/plugin-explorer/src/types/schema.ts
-import { S, TypedObject } from "@dxos/echo-schema";
+import { Schema } from "effect";
+import { TypedObject } from "@dxos/echo-schema";
 var ViewType = class extends TypedObject({
   typename: "dxos.org/type/ExplorerView",
   version: "0.1.0"
 })({
-  name: S.optional(S.String),
-  type: S.String
+  name: Schema.optional(Schema.String),
+  type: Schema.String
 }) {
 };
 
 // packages/plugins/plugin-explorer/src/types/types.ts
-import { S as S2 } from "@dxos/echo-schema";
-var ExplorerAction;
+import { Schema as Schema2 } from "effect";
 (function(ExplorerAction2) {
   const EXPLORER_ACTION = `${EXPLORER_PLUGIN}/action`;
-  class Create extends S2.TaggedClass()(`${EXPLORER_ACTION}/create`, {
-    input: S2.Struct({
-      name: S2.optional(S2.String)
+  class Create extends Schema2.TaggedClass()(`${EXPLORER_ACTION}/create`, {
+    input: Schema2.Struct({
+      name: Schema2.optional(Schema2.String)
     }),
-    output: S2.Struct({
+    output: Schema2.Struct({
       object: ViewType
     })
   }) {
   }
   ExplorerAction2.Create = Create;
 })(ExplorerAction || (ExplorerAction = {}));
+var ExplorerAction;
 
 export {
   ViewType,
   ExplorerAction
 };
-//# sourceMappingURL=chunk-QZH2GDN5.mjs.map
+//# sourceMappingURL=chunk-N6VEANUZ.mjs.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/types/schema.ts", "../../../src/types/types.ts"],
+  "sourcesContent": ["//\n// Copyright 2024 DXOS.org\n//\n\nimport { Schema } from 'effect';\n\nimport { TypedObject } from '@dxos/echo-schema';\n\n// TODO(burdon): Clashes with sdk/view.\nexport class ViewType extends TypedObject({\n  typename: 'dxos.org/type/ExplorerView',\n  version: '0.1.0',\n})({\n  name: Schema.optional(Schema.String),\n  type: Schema.String,\n}) {}\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { Schema } from 'effect';\n\nimport { ViewType } from './schema';\nimport { EXPLORER_PLUGIN } from '../meta';\n\nexport namespace ExplorerAction {\n  const EXPLORER_ACTION = `${EXPLORER_PLUGIN}/action`;\n\n  export class Create extends Schema.TaggedClass<Create>()(`${EXPLORER_ACTION}/create`, {\n    input: Schema.Struct({\n      name: Schema.optional(Schema.String),\n    }),\n    output: Schema.Struct({\n      object: ViewType,\n    }),\n  }) {}\n}\n"],
+  "mappings": ";;;;;;AAIA,SAASA,cAAc;AAEvB,SAASC,mBAAmB;AAGrB,IAAMC,WAAN,cAAuBC,YAAY;EACxCC,UAAU;EACVC,SAAS;AACX,CAAA,EAAG;EACDC,MAAMC,OAAOC,SAASD,OAAOE,MAAM;EACnCC,MAAMH,OAAOE;AACf,CAAA,EAAA;AAAI;;;ACXJ,SAASE,UAAAA,eAAc;UAKNC,iBAAAA;AACf,QAAMC,kBAAkB,GAAGC,eAAAA;EAEpB,MAAMC,eAAeC,QAAOC,YAAW,EAAW,GAAGJ,eAAAA,WAA0B;IACpFK,OAAOF,QAAOG,OAAO;MACnBC,MAAMJ,QAAOK,SAASL,QAAOM,MAAM;IACrC,CAAA;IACAC,QAAQP,QAAOG,OAAO;MACpBK,QAAQC;IACV,CAAA;EACF,CAAA,EAAA;EAAI;kBAPSV,SAAAA;AAQf,GAXiBH,mBAAAA,iBAAAA,CAAAA,EAAAA;;",
+  "names": ["Schema", "TypedObject", "ViewType", "TypedObject", "typename", "version", "name", "Schema", "optional", "String", "type", "Schema", "ExplorerAction", "EXPLORER_ACTION", "EXPLORER_PLUGIN", "Create", "Schema", "TaggedClass", "input", "Struct", "name", "optional", "String", "output", "object", "ViewType"]
+}

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

@@ -0,0 +1,179 @@
+import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+
+// packages/plugins/plugin-explorer/src/components/Graph/D3ForceGraph.tsx
+import { useSignals as _useSignals } from "@preact-signals/safe-react/tracking";
+import React, { useCallback, useEffect, useMemo, useRef } from "react";
+import { getTypename } from "@dxos/echo-schema";
+import { SelectionModel } from "@dxos/graph";
+import { GraphForceProjector, SVG } from "@dxos/react-ui-graph";
+import { getHashColor } from "@dxos/react-ui-theme";
+import "@dxos/react-ui-graph/styles/graph.css";
+var D3ForceGraph = ({ classNames, model, selection: _selection, grid, ...props }) => {
+  var _effect = _useSignals();
+  try {
+    const context = useRef(null);
+    const projector = useMemo(() => {
+      if (context.current) {
+        return new GraphForceProjector(context.current, {
+          attributes: {
+            linkForce: (edge) => {
+              return edge.data?.object?.active !== false;
+            }
+          },
+          forces: {
+            point: {
+              strength: 0.01
+            }
+          }
+        });
+      }
+    }, [
+      context.current
+    ]);
+    const graph = useRef(null);
+    const selection = useMemo(() => _selection ?? new SelectionModel(), [
+      _selection
+    ]);
+    useEffect(() => graph.current?.repaint(), [
+      selection.selected.value
+    ]);
+    const handleSelect = useCallback((node) => {
+      if (selection.contains(node.id)) {
+        selection.remove(node.id);
+      } else {
+        selection.add(node.id);
+      }
+    }, [
+      selection
+    ]);
+    return /* @__PURE__ */ React.createElement(SVG.Root, {
+      ref: context,
+      classNames
+    }, /* @__PURE__ */ React.createElement(SVG.Markers, null), grid && /* @__PURE__ */ React.createElement(SVG.Grid, {
+      axis: true
+    }), /* @__PURE__ */ React.createElement(SVG.Zoom, {
+      extent: [
+        1 / 2,
+        2
+      ]
+    }, /* @__PURE__ */ React.createElement(SVG.Graph, {
+      ...props,
+      ref: graph,
+      model,
+      projector,
+      labels: {
+        text: (node) => {
+          return node.data?.data.label ?? node.id;
+        }
+      },
+      attributes: {
+        node: (node) => {
+          const obj = node.data?.data.object;
+          return {
+            data: {
+              color: getHashColor(obj && getTypename(obj))?.color
+            },
+            classes: {
+              "dx-selected": selection.contains(node.id)
+            }
+          };
+        }
+      },
+      onSelect: handleSelect
+    })));
+  } finally {
+    _effect.f();
+  }
+};
+
+// packages/plugins/plugin-explorer/src/components/Graph/ForceGraph.tsx
+import { useSignals as _useSignals2 } from "@preact-signals/safe-react/tracking";
+import { forceLink, forceManyBody } from "d3";
+import NativeForceGraph from "force-graph";
+import React2, { useEffect as useEffect2, useRef as useRef2 } from "react";
+import { useResizeDetector } from "react-resize-detector";
+import { filterObjectsSync } from "@dxos/plugin-search";
+
+// packages/plugins/plugin-explorer/src/components/Graph/adapter.ts
+var GraphAdapter = class {
+  constructor(graph) {
+    this.graph = graph;
+    this._nodes = [];
+    this._links = [];
+    this._nodes = graph.nodes.map((node) => ({
+      id: node.id,
+      type: node.type,
+      data: node.data
+    }));
+    this._links = graph.edges.map((edge) => ({
+      type: edge.type,
+      source: edge.source,
+      target: edge.target,
+      data: edge.data
+    }));
+  }
+  get nodes() {
+    return this._nodes;
+  }
+  get links() {
+    return this._links;
+  }
+};
+
+// packages/plugins/plugin-explorer/src/components/Graph/ForceGraph.tsx
+var ForceGraph = ({ model, match }) => {
+  var _effect = _useSignals2();
+  try {
+    const { ref, width, height } = useResizeDetector({
+      refreshRate: 200
+    });
+    const rootRef = useRef2(null);
+    const forceGraph = useRef2();
+    const filteredRef = useRef2();
+    filteredRef.current = filterObjectsSync(model?.objects ?? [], match);
+    useEffect2(() => {
+      if (rootRef.current) {
+        forceGraph.current = new NativeForceGraph(rootRef.current).nodeRelSize(6).nodeLabel((node) => node.type === "schema" ? node.data.typename : node.data.label ?? node.id).nodeAutoColorBy((node) => node.type === "schema" ? "schema" : node.data.typename).linkAutoColorBy((link) => link.type);
+      }
+      return () => {
+        forceGraph.current?.pauseAnimation().graphData({
+          nodes: [],
+          links: []
+        });
+        forceGraph.current = void 0;
+      };
+    }, []);
+    useEffect2(() => {
+      if (forceGraph.current && width && height && model) {
+        forceGraph.current.pauseAnimation().width(width).height(height).onEngineStop(() => {
+          handleZoomToFit();
+        }).onNodeClick((node) => {
+          forceGraph.current?.emitParticle(node);
+        }).d3Force("link", forceLink().distance(160).strength(0.5)).d3Force("charge", forceManyBody().strength(-30)).graphData(new GraphAdapter(model)).warmupTicks(100).cooldownTime(1e3).resumeAnimation();
+      }
+    }, [
+      model,
+      width,
+      height
+    ]);
+    const handleZoomToFit = () => {
+      forceGraph.current?.zoomToFit(400, 40);
+    };
+    return /* @__PURE__ */ React2.createElement("div", {
+      ref,
+      className: "relative grow",
+      onClick: handleZoomToFit
+    }, /* @__PURE__ */ React2.createElement("div", {
+      ref: rootRef,
+      className: "absolute inset-0"
+    }));
+  } finally {
+    _effect.f();
+  }
+};
+
+export {
+  D3ForceGraph,
+  ForceGraph
+};
+//# sourceMappingURL=chunk-PVII2K2B.mjs.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/Graph/D3ForceGraph.tsx", "../../../src/components/Graph/ForceGraph.tsx", "../../../src/components/Graph/adapter.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { type FC, useCallback, useEffect, useMemo, useRef } from 'react';\n\nimport { getTypename } from '@dxos/echo-schema';\nimport { SelectionModel } from '@dxos/graph';\nimport { type ThemedClassName } from '@dxos/react-ui';\nimport {\n  type GraphController,\n  GraphForceProjector,\n  type GraphLayoutNode,\n  type GraphProps,\n  SVG,\n  type SVGContext,\n} from '@dxos/react-ui-graph';\nimport { getHashColor } from '@dxos/react-ui-theme';\nimport { type SpaceGraphNode, type SpaceGraphModel, type SpaceGraphEdge } from '@dxos/schema';\n\nimport '@dxos/react-ui-graph/styles/graph.css';\n\nexport type D3ForceGraphProps = ThemedClassName<\n  {\n    model?: SpaceGraphModel;\n    match?: RegExp;\n    selection?: SelectionModel;\n    grid?: boolean;\n  } & Pick<GraphProps, 'drag'>\n>;\n\nexport const D3ForceGraph: FC<D3ForceGraphProps> = ({ classNames, model, selection: _selection, grid, ...props }) => {\n  const context = useRef<SVGContext>(null);\n  const projector = useMemo<GraphForceProjector | undefined>(() => {\n    if (context.current) {\n      return new GraphForceProjector(context.current, {\n        attributes: {\n          linkForce: (edge) => {\n            // TODO(burdon): Check type (currently assumes Employee property).\n            // Edge shouldn't contribute to force if it's not active.\n            return edge.data?.object?.active !== false;\n          },\n        },\n        forces: {\n          point: {\n            strength: 0.01,\n          },\n        },\n      });\n    }\n  }, [context.current]);\n\n  const graph = useRef<GraphController>(null);\n  const selection = useMemo(() => _selection ?? new SelectionModel(), [_selection]);\n  useEffect(() => graph.current?.repaint(), [selection.selected.value]);\n\n  const handleSelect = useCallback<NonNullable<GraphProps['onSelect']>>(\n    (node) => {\n      if (selection.contains(node.id)) {\n        selection.remove(node.id);\n      } else {\n        selection.add(node.id);\n      }\n    },\n    [selection],\n  );\n\n  return (\n    <SVG.Root ref={context} classNames={classNames}>\n      <SVG.Markers />\n      {grid && <SVG.Grid axis />}\n      <SVG.Zoom extent={[1 / 2, 2]}>\n        <SVG.Graph<SpaceGraphNode, SpaceGraphEdge>\n          {...props}\n          ref={graph}\n          model={model}\n          projector={projector}\n          labels={{\n            text: (node) => {\n              return node.data?.data.label ?? node.id;\n            },\n          }}\n          attributes={{\n            node: (node: GraphLayoutNode<SpaceGraphNode>) => {\n              const obj = node.data?.data.object;\n              return {\n                data: {\n                  color: getHashColor(obj && getTypename(obj))?.color,\n                },\n                classes: {\n                  'dx-selected': selection.contains(node.id),\n                },\n              };\n            },\n          }}\n          onSelect={handleSelect}\n        />\n      </SVG.Zoom>\n    </SVG.Root>\n  );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { forceLink, forceManyBody } from 'd3';\nimport NativeForceGraph from 'force-graph';\nimport React, { type FC, useEffect, useRef } from 'react';\nimport { useResizeDetector } from 'react-resize-detector';\n\nimport { filterObjectsSync, type SearchResult } from '@dxos/plugin-search';\nimport { type SpaceGraphModel } from '@dxos/schema';\n\nimport { GraphAdapter } from './adapter';\n\nexport type ForceGraphProps = {\n  model?: SpaceGraphModel;\n  match?: RegExp;\n};\n\nexport const ForceGraph: FC<ForceGraphProps> = ({ model, match }) => {\n  const { ref, width, height } = useResizeDetector({ refreshRate: 200 });\n  const rootRef = useRef<HTMLDivElement>(null);\n  const forceGraph = useRef<NativeForceGraph>();\n\n  const filteredRef = useRef<SearchResult[]>();\n  filteredRef.current = filterObjectsSync(model?.objects ?? [], match);\n\n  useEffect(() => {\n    if (rootRef.current) {\n      // https://github.com/vasturiano/force-graph\n      // https://github.com/vasturiano/3d-force-graph\n      forceGraph.current = new NativeForceGraph(rootRef.current)\n        // https://github.com/vasturiano/force-graph?tab=readme-ov-file#node-styling\n        .nodeRelSize(6)\n        .nodeLabel((node: any) => (node.type === 'schema' ? node.data.typename : node.data.label ?? node.id))\n        .nodeAutoColorBy((node: any) => (node.type === 'schema' ? 'schema' : node.data.typename))\n\n        // https://github.com/vasturiano/force-graph?tab=readme-ov-file#link-styling\n        .linkAutoColorBy((link: any) => link.type);\n    }\n\n    return () => {\n      forceGraph.current?.pauseAnimation().graphData({ nodes: [], links: [] });\n      forceGraph.current = undefined;\n    };\n  }, []);\n\n  useEffect(() => {\n    if (forceGraph.current && width && height && model) {\n      // https://github.com/vasturiano/force-graph?tab=readme-ov-file#container-layout\n      forceGraph.current\n        .pauseAnimation()\n        .width(width)\n        .height(height)\n        .onEngineStop(() => {\n          handleZoomToFit();\n        })\n        .onNodeClick((node: any) => {\n          forceGraph.current?.emitParticle(node);\n        })\n\n        // https://github.com/vasturiano/force-graph?tab=readme-ov-file#force-engine-d3-force-configuration\n        // .d3Force('center', forceCenter().strength(0.9))\n        .d3Force('link', forceLink().distance(160).strength(0.5))\n        .d3Force('charge', forceManyBody().strength(-30))\n\n        .graphData(new GraphAdapter(model))\n        .warmupTicks(100)\n        .cooldownTime(1_000)\n        .resumeAnimation();\n    }\n  }, [model, width, height]);\n\n  const handleZoomToFit = () => {\n    forceGraph.current?.zoomToFit(400, 40);\n  };\n\n  return (\n    <div ref={ref} className='relative grow' onClick={handleZoomToFit}>\n      <div ref={rootRef} className='absolute inset-0' />\n    </div>\n  );\n};\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { type Graph } from '@dxos/graph';\n\nexport type GraphNode = {\n  id?: string;\n};\n\nexport type GraphLink = {\n  source?: string;\n  target?: string;\n};\n\nexport type GraphData = {\n  nodes: GraphNode[];\n  links: GraphLink[];\n};\n\nexport class GraphAdapter implements GraphData {\n  private readonly _nodes: GraphNode[] = [];\n  private readonly _links: GraphLink[] = [];\n\n  constructor(private readonly graph: Graph) {\n    this._nodes = graph.nodes.map((node) => ({\n      id: node.id,\n      type: node.type,\n      data: node.data,\n    }));\n\n    this._links = graph.edges.map((edge) => ({\n      type: edge.type,\n      source: edge.source,\n      target: edge.target,\n      data: edge.data,\n    }));\n  }\n\n  get nodes() {\n    return this._nodes;\n  }\n\n  get links() {\n    return this._links;\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["React", "useCallback", "useEffect", "useMemo", "useRef", "getTypename", "SelectionModel", "GraphForceProjector", "SVG", "getHashColor", "D3ForceGraph", "classNames", "model", "selection", "_selection", "grid", "props", "context", "useRef", "projector", "useMemo", "current", "GraphForceProjector", "attributes", "linkForce", "edge", "data", "object", "active", "forces", "point", "strength", "graph", "SelectionModel", "useEffect", "repaint", "selected", "value", "handleSelect", "useCallback", "node", "contains", "id", "remove", "add", "SVG", "Root", "ref", "Markers", "Grid", "axis", "Zoom", "extent", "Graph", "labels", "text", "label", "obj", "color", "getHashColor", "getTypename", "classes", "onSelect", "forceLink", "forceManyBody", "NativeForceGraph", "React", "useEffect", "useRef", "useResizeDetector", "filterObjectsSync", "GraphAdapter", "graph", "_nodes", "_links", "nodes", "map", "node", "id", "type", "data", "edges", "edge", "source", "target", "links", "ForceGraph", "model", "match", "ref", "width", "height", "useResizeDetector", "refreshRate", "rootRef", "useRef", "forceGraph", "filteredRef", "current", "filterObjectsSync", "objects", "useEffect", "NativeForceGraph", "nodeRelSize", "nodeLabel", "node", "type", "data", "typename", "label", "id", "nodeAutoColorBy", "linkAutoColorBy", "link", "pauseAnimation", "graphData", "nodes", "links", "undefined", "onEngineStop", "handleZoomToFit", "onNodeClick", "emitParticle", "d3Force", "forceLink", "distance", "strength", "forceManyBody", "GraphAdapter", "warmupTicks", "cooldownTime", "resumeAnimation", "zoomToFit", "React", "div", "className", "onClick"]
+}

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

@@ -0,0 +1,32 @@
+import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+
+// packages/plugins/plugin-explorer/src/hooks/useGraphModel.ts
+import { useEffect, useState } from "react";
+import { SpaceGraphModel } from "@dxos/schema";
+var useGraphModel = (space, filter, options) => {
+  const [model, setModel] = useState(void 0);
+  useEffect(() => {
+    if (!space) {
+      void model?.close();
+      setModel(void 0);
+      return;
+    }
+    if (!model) {
+      const model2 = new SpaceGraphModel().setFilter(filter).setOptions(options);
+      void model2.open(space);
+      setModel(model2);
+    } else {
+      model.setFilter(filter).setOptions(options);
+    }
+  }, [
+    space,
+    filter,
+    options
+  ]);
+  return model;
+};
+
+export {
+  useGraphModel
+};
+//# sourceMappingURL=chunk-VSORIAHH.mjs.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/hooks/useGraphModel.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { useEffect, useState } from 'react';\n\nimport { type Filter, type Space } from '@dxos/client/echo';\nimport { SpaceGraphModel, type SpaceGraphModelOptions } from '@dxos/schema';\n\n// TODO(burdon): Factor out.\nexport const useGraphModel = (\n  space: Space | undefined,\n  filter?: Filter.Any | undefined,\n  options?: SpaceGraphModelOptions,\n): SpaceGraphModel | undefined => {\n  const [model, setModel] = useState<SpaceGraphModel | undefined>(undefined);\n  useEffect(() => {\n    if (!space) {\n      void model?.close();\n      setModel(undefined);\n      return;\n    }\n\n    // TODO(burdon): Does this need to be a dependency?\n    if (!model) {\n      const model = new SpaceGraphModel().setFilter(filter).setOptions(options);\n      void model.open(space);\n      setModel(model);\n    } else {\n      model.setFilter(filter).setOptions(options);\n    }\n  }, [space, filter, options]);\n\n  return model;\n};\n"],
+  "mappings": ";;;AAIA,SAASA,WAAWC,gBAAgB;AAGpC,SAASC,uBAAoD;AAGtD,IAAMC,gBAAgB,CAC3BC,OACAC,QACAC,YAAAA;AAEA,QAAM,CAACC,OAAOC,QAAAA,IAAYC,SAAsCC,MAAAA;AAChEC,YAAU,MAAA;AACR,QAAI,CAACP,OAAO;AACV,WAAKG,OAAOK,MAAAA;AACZJ,eAASE,MAAAA;AACT;IACF;AAGA,QAAI,CAACH,OAAO;AACV,YAAMA,SAAQ,IAAIM,gBAAAA,EAAkBC,UAAUT,MAAAA,EAAQU,WAAWT,OAAAA;AACjE,WAAKC,OAAMS,KAAKZ,KAAAA;AAChBI,eAASD,MAAAA;IACX,OAAO;AACLA,YAAMO,UAAUT,MAAAA,EAAQU,WAAWT,OAAAA;IACrC;EACF,GAAG;IAACF;IAAOC;IAAQC;GAAQ;AAE3B,SAAOC;AACT;",
+  "names": ["useEffect", "useState", "SpaceGraphModel", "useGraphModel", "space", "filter", "options", "model", "setModel", "useState", "undefined", "useEffect", "close", "SpaceGraphModel", "setFilter", "setOptions", "open"]
+}

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

@@ -1,23 +1,26 @@
 import { createRequire } from 'node:module';const require = createRequire(import.meta.url);
+import {
+  useGraphModel
+} from "./chunk-VSORIAHH.mjs";
 import {
   Chart,
   ExplorerContainer,
   Globe,
   Tree,
   defaultTreeLayoutSlots
-} from "./chunk-PZOORWFE.mjs";
+} from "./chunk-34X2VFQN.mjs";
 import {
-  Graph,
-  SpaceGraphModel
-} from "./chunk-SZRRNWYT.mjs";
+  D3ForceGraph,
+  ForceGraph
+} from "./chunk-PVII2K2B.mjs";
 import {
   ExplorerAction,
   ViewType
-} from "./chunk-QZH2GDN5.mjs";
+} from "./chunk-N6VEANUZ.mjs";
 import {
   EXPLORER_PLUGIN,
   meta
-} from "./chunk-PUFSCMN4.mjs";
+} from "./chunk-3CMBLK6W.mjs";
 
 // packages/plugins/plugin-explorer/src/ExplorerPlugin.tsx
 import { Capabilities, contributes, createIntent, defineModule, definePlugin, Events } from "@dxos/app-framework";
@@ -27,8 +30,8 @@ import { defineObjectForm } from "@dxos/plugin-space/types";
 
 // packages/plugins/plugin-explorer/src/capabilities/index.ts
 import { lazy } from "@dxos/app-framework";
-var IntentResolver = lazy(() => import("./intent-resolver-PTFKXAT4.mjs"));
-var ReactSurface = lazy(() => import("./react-surface-J5SW7VF2.mjs"));
+var IntentResolver = lazy(() => import("./intent-resolver-4RBV644N.mjs"));
+var ReactSurface = lazy(() => import("./react-surface-ZEVL3FXG.mjs"));
 
 // packages/plugins/plugin-explorer/src/translations.ts
 var translations_default = [
@@ -91,14 +94,15 @@ var ExplorerPlugin = () => definePlugin(meta, [
 ]);
 export {
   Chart,
+  D3ForceGraph,
   EXPLORER_PLUGIN,
   ExplorerContainer,
   ExplorerPlugin,
+  ForceGraph,
   Globe,
-  Graph,
-  SpaceGraphModel,
   Tree,
   defaultTreeLayoutSlots,
-  meta
+  meta,
+  useGraphModel
 };
 //# sourceMappingURL=index.mjs.map

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../src/ExplorerPlugin.tsx", "../../../src/capabilities/index.ts", "../../../src/translations.ts"],
   "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { Capabilities, contributes, createIntent, defineModule, definePlugin, Events } from '@dxos/app-framework';\nimport { ClientCapabilities, ClientEvents } from '@dxos/plugin-client';\nimport { SpaceCapabilities } from '@dxos/plugin-space';\nimport { defineObjectForm } from '@dxos/plugin-space/types';\n\nimport { IntentResolver, ReactSurface } from './capabilities';\nimport { meta } from './meta';\nimport translations from './translations';\nimport { ViewType, ExplorerAction } from './types';\n\nexport const ExplorerPlugin = () =>\n  definePlugin(meta, [\n    defineModule({\n      id: `${meta.id}/module/translations`,\n      activatesOn: Events.SetupTranslations,\n      activate: () => contributes(Capabilities.Translations, translations),\n    }),\n    defineModule({\n      id: `${meta.id}/module/metadata`,\n      activatesOn: Events.SetupMetadata,\n      activate: () =>\n        contributes(Capabilities.Metadata, {\n          id: ViewType.typename,\n          metadata: {\n            icon: 'ph--graph--regular',\n          },\n        }),\n    }),\n    defineModule({\n      id: `${meta.id}/module/object-form`,\n      activatesOn: ClientEvents.SetupSchema,\n      activate: () =>\n        contributes(\n          SpaceCapabilities.ObjectForm,\n          defineObjectForm({\n            objectSchema: ViewType,\n            getIntent: () => createIntent(ExplorerAction.Create),\n          }),\n        ),\n    }),\n    defineModule({\n      id: `${meta.id}/module/schema`,\n      activatesOn: ClientEvents.SetupSchema,\n      activate: () => contributes(ClientCapabilities.Schema, [ViewType]),\n    }),\n    defineModule({\n      id: `${meta.id}/module/react-surface`,\n      activatesOn: Events.SetupReactSurface,\n      activate: ReactSurface,\n    }),\n    defineModule({\n      id: `${meta.id}/module/intent-resolver`,\n      activatesOn: Events.SetupIntentResolver,\n      activate: IntentResolver,\n    }),\n  ]);\n", "//\n// Copyright 2025 DXOS.org\n//\n\nimport { lazy } from '@dxos/app-framework';\n\nexport const IntentResolver = lazy(() => import('./intent-resolver'));\nexport const ReactSurface = lazy(() => import('./react-surface'));\n", "//\n// Copyright 2023 DXOS.org\n//\n\nimport { EXPLORER_PLUGIN } from './meta';\nimport { ViewType } from './types';\n\nexport default [\n  {\n    'en-US': {\n      [ViewType.typename]: {\n        'typename label': 'Explorer',\n        'object name placeholder': 'New explorer',\n      },\n      [EXPLORER_PLUGIN]: {\n        'plugin name': 'Explorer',\n        'object title label': 'Title',\n      },\n    },\n  },\n];\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAIA,SAASA,cAAcC,aAAaC,cAAcC,cAAcC,cAAcC,cAAc;AAC5F,SAASC,oBAAoBC,oBAAoB;AACjD,SAASC,yBAAyB;AAClC,SAASC,wBAAwB;;;ACHjC,SAASC,YAAY;AAEd,IAAMC,iBAAiBC,KAAK,MAAM,OAAO,gCAAA,CAAA;AACzC,IAAMC,eAAeD,KAAK,MAAM,OAAO,8BAAA,CAAA;;;ACA9C,IAAA,uBAAe;EACb;IACE,SAAS;MACP,CAACE,SAASC,QAAQ,GAAG;QACnB,kBAAkB;QAClB,2BAA2B;MAC7B;MACA,CAACC,eAAAA,GAAkB;QACjB,eAAe;QACf,sBAAsB;MACxB;IACF;EACF;;;;AFLK,IAAMC,iBAAiB,MAC5BC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,UAAU,MAAMC,YAAYC,aAAaC,cAAcC,oBAAAA;EACzD,CAAA;EACAT,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOO;IACpBL,UAAU,MACRC,YAAYC,aAAaI,UAAU;MACjCV,IAAIW,SAASC;MACbC,UAAU;QACRC,MAAM;MACR;IACF,CAAA;EACJ,CAAA;EACAf,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAac,aAAaC;IAC1BZ,UAAU,MACRC,YACEY,kBAAkBC,YAClBC,iBAAiB;MACfC,cAAcT;MACdU,WAAW,MAAMC,aAAaC,eAAeC,MAAM;IACrD,CAAA,CAAA;EAEN,CAAA;EACAzB,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAac,aAAaC;IAC1BZ,UAAU,MAAMC,YAAYoB,mBAAmBC,QAAQ;MAACf;KAAS;EACnE,CAAA;EACAZ,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOyB;IACpBvB,UAAUwB;EACZ,CAAA;EACA7B,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAO2B;IACpBzB,UAAU0B;EACZ,CAAA;CACD;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAIA,SAASA,cAAcC,aAAaC,cAAcC,cAAcC,cAAcC,cAAc;AAC5F,SAASC,oBAAoBC,oBAAoB;AACjD,SAASC,yBAAyB;AAClC,SAASC,wBAAwB;;;ACHjC,SAASC,YAAY;AAEd,IAAMC,iBAAiBC,KAAK,MAAM,OAAO,gCAAA,CAAA;AACzC,IAAMC,eAAeD,KAAK,MAAM,OAAO,8BAAA,CAAA;;;ACA9C,IAAA,uBAAe;EACb;IACE,SAAS;MACP,CAACE,SAASC,QAAQ,GAAG;QACnB,kBAAkB;QAClB,2BAA2B;MAC7B;MACA,CAACC,eAAAA,GAAkB;QACjB,eAAe;QACf,sBAAsB;MACxB;IACF;EACF;;;;AFLK,IAAMC,iBAAiB,MAC5BC,aAAaC,MAAM;EACjBC,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOC;IACpBC,UAAU,MAAMC,YAAYC,aAAaC,cAAcC,oBAAAA;EACzD,CAAA;EACAT,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOO;IACpBL,UAAU,MACRC,YAAYC,aAAaI,UAAU;MACjCV,IAAIW,SAASC;MACbC,UAAU;QACRC,MAAM;MACR;IACF,CAAA;EACJ,CAAA;EACAf,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAac,aAAaC;IAC1BZ,UAAU,MACRC,YACEY,kBAAkBC,YAClBC,iBAAiB;MACfC,cAAcT;MACdU,WAAW,MAAMC,aAAaC,eAAeC,MAAM;IACrD,CAAA,CAAA;EAEN,CAAA;EACAzB,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAac,aAAaC;IAC1BZ,UAAU,MAAMC,YAAYoB,mBAAmBC,QAAQ;MAACf;KAAS;EACnE,CAAA;EACAZ,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAOyB;IACpBvB,UAAUwB;EACZ,CAAA;EACA7B,aAAa;IACXC,IAAI,GAAGF,KAAKE,EAAE;IACdC,aAAaC,OAAO2B;IACpBzB,UAAU0B;EACZ,CAAA;CACD;",
   "names": ["Capabilities", "contributes", "createIntent", "defineModule", "definePlugin", "Events", "ClientCapabilities", "ClientEvents", "SpaceCapabilities", "defineObjectForm", "lazy", "IntentResolver", "lazy", "ReactSurface", "ViewType", "typename", "EXPLORER_PLUGIN", "ExplorerPlugin", "definePlugin", "meta", "defineModule", "id", "activatesOn", "Events", "SetupTranslations", "activate", "contributes", "Capabilities", "Translations", "translations", "SetupMetadata", "Metadata", "ViewType", "typename", "metadata", "icon", "ClientEvents", "SetupSchema", "SpaceCapabilities", "ObjectForm", "defineObjectForm", "objectSchema", "getIntent", "createIntent", "ExplorerAction", "Create", "ClientCapabilities", "Schema", "SetupReactSurface", "ReactSurface", "SetupIntentResolver", "IntentResolver"]
 }

package/dist/lib/node-esm/{intent-resolver-PTFKXAT4.mjs → intent-resolver-4RBV644N.mjs}

@@ -2,17 +2,17 @@ import { createRequire } from 'node:module';const require = createRequire(import
 import {
   ExplorerAction,
   ViewType
-} from "./chunk-QZH2GDN5.mjs";
-import "./chunk-PUFSCMN4.mjs";
+} from "./chunk-N6VEANUZ.mjs";
+import "./chunk-3CMBLK6W.mjs";
 
 // packages/plugins/plugin-explorer/src/capabilities/intent-resolver.ts
 import { contributes, Capabilities, createResolver } from "@dxos/app-framework";
-import { create } from "@dxos/live-object";
+import { live } from "@dxos/live-object";
 var intent_resolver_default = () => contributes(Capabilities.IntentResolver, createResolver({
   intent: ExplorerAction.Create,
   resolve: ({ name }) => ({
     data: {
-      object: create(ViewType, {
+      object: live(ViewType, {
         name,
         type: ""
       })
@@ -22,4 +22,4 @@ var intent_resolver_default = () => contributes(Capabilities.IntentResolver, cre
 export {
   intent_resolver_default as default
 };
-//# sourceMappingURL=intent-resolver-PTFKXAT4.mjs.map
+//# sourceMappingURL=intent-resolver-4RBV644N.mjs.map

package/dist/lib/node-esm/intent-resolver-4RBV644N.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/capabilities/intent-resolver.ts"],
+  "sourcesContent": ["//\n// Copyright 2025 DXOS.org\n//\n\nimport { contributes, Capabilities, createResolver } from '@dxos/app-framework';\nimport { live } from '@dxos/live-object';\n\nimport { ExplorerAction, ViewType } from '../types';\n\nexport default () =>\n  contributes(\n    Capabilities.IntentResolver,\n    createResolver({\n      intent: ExplorerAction.Create,\n      resolve: ({ name }) => ({\n        data: { object: live(ViewType, { name, type: '' }) },\n      }),\n    }),\n  );\n"],
+  "mappings": ";;;;;;;;AAIA,SAASA,aAAaC,cAAcC,sBAAsB;AAC1D,SAASC,YAAY;AAIrB,IAAA,0BAAe,MACbC,YACEC,aAAaC,gBACbC,eAAe;EACbC,QAAQC,eAAeC;EACvBC,SAAS,CAAC,EAAEC,KAAI,OAAQ;IACtBC,MAAM;MAAEC,QAAQC,KAAKC,UAAU;QAAEJ;QAAMK,MAAM;MAAG,CAAA;IAAG;EACrD;AACF,CAAA,CAAA;",
+  "names": ["contributes", "Capabilities", "createResolver", "live", "contributes", "Capabilities", "IntentResolver", "createResolver", "intent", "ExplorerAction", "Create", "resolve", "name", "data", "object", "live", "ViewType", "type"]
+}