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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (170) hide show
  1. package/dist/lib/browser/ExplorerContainer-BBZ54DJS.mjs +37 -0
  2. package/dist/lib/browser/ExplorerContainer-BBZ54DJS.mjs.map +7 -0
  3. package/dist/lib/browser/{chunk-B2DMPSP5.mjs → chunk-73GQ46YO.mjs} +430 -170
  4. package/dist/lib/{node-esm/chunk-PZOORWFE.mjs.map → browser/chunk-73GQ46YO.mjs.map} +4 -4
  5. package/dist/lib/browser/{chunk-QLQLPZNI.mjs → chunk-73YTQHOT.mjs} +12 -11
  6. package/dist/lib/browser/chunk-73YTQHOT.mjs.map +7 -0
  7. package/dist/lib/browser/chunk-M2BGAY6H.mjs +177 -0
  8. package/dist/lib/browser/chunk-M2BGAY6H.mjs.map +7 -0
  9. package/dist/lib/browser/{chunk-Z2SDLMQM.mjs → chunk-OBAFAA5V.mjs} +3 -3
  10. package/dist/lib/browser/{chunk-Z2SDLMQM.mjs.map → chunk-OBAFAA5V.mjs.map} +1 -1
  11. package/dist/lib/browser/chunk-SLB2F5AO.mjs +30 -0
  12. package/dist/lib/browser/chunk-SLB2F5AO.mjs.map +7 -0
  13. package/dist/lib/browser/index.mjs +15 -11
  14. package/dist/lib/browser/index.mjs.map +1 -1
  15. package/dist/lib/browser/{intent-resolver-NHHRWTOP.mjs → intent-resolver-FJDVBDE3.mjs} +5 -5
  16. package/dist/lib/browser/intent-resolver-FJDVBDE3.mjs.map +7 -0
  17. package/dist/lib/browser/meta.json +1 -1
  18. package/dist/lib/browser/meta.mjs +1 -1
  19. package/dist/lib/browser/{react-surface-N7TC6BMF.mjs → react-surface-H3YDMXAQ.mjs} +5 -5
  20. package/dist/lib/browser/types/index.mjs +2 -2
  21. package/dist/lib/node/{ExplorerContainer-73AHSBAG.cjs → ExplorerContainer-MVP2AM7R.cjs} +24 -16
  22. package/dist/lib/node/ExplorerContainer-MVP2AM7R.cjs.map +7 -0
  23. package/dist/lib/node/chunk-4T4LCT5R.cjs +52 -0
  24. package/dist/lib/node/chunk-4T4LCT5R.cjs.map +7 -0
  25. package/dist/lib/node/{chunk-HCDBN6NN.cjs → chunk-72H5HBTK.cjs} +429 -168
  26. package/dist/lib/node/chunk-72H5HBTK.cjs.map +7 -0
  27. package/dist/lib/node/{chunk-VB3QE6XY.cjs → chunk-BCDVG2CH.cjs} +6 -6
  28. package/dist/lib/node/{chunk-VB3QE6XY.cjs.map → chunk-BCDVG2CH.cjs.map} +1 -1
  29. package/dist/lib/node/{chunk-YLL7H7CZ.cjs → chunk-MLRYW4WQ.cjs} +15 -14
  30. package/dist/lib/node/chunk-MLRYW4WQ.cjs.map +7 -0
  31. package/dist/lib/node/chunk-NELWWGBU.cjs +204 -0
  32. package/dist/lib/node/chunk-NELWWGBU.cjs.map +7 -0
  33. package/dist/lib/node/index.cjs +34 -31
  34. package/dist/lib/node/index.cjs.map +1 -1
  35. package/dist/lib/node/{intent-resolver-EEOTX3OZ.cjs → intent-resolver-DRT67ZU4.cjs} +8 -8
  36. package/dist/lib/node/intent-resolver-DRT67ZU4.cjs.map +7 -0
  37. package/dist/lib/node/meta.cjs +3 -3
  38. package/dist/lib/node/meta.cjs.map +1 -1
  39. package/dist/lib/node/meta.json +1 -1
  40. package/dist/lib/node/{react-surface-WD4G2NRS.cjs → react-surface-6ESLSM33.cjs} +11 -11
  41. package/dist/lib/node/types/index.cjs +4 -4
  42. package/dist/lib/node/types/index.cjs.map +1 -1
  43. package/dist/lib/node-esm/ExplorerContainer-APGUQI4M.mjs +38 -0
  44. package/dist/lib/node-esm/ExplorerContainer-APGUQI4M.mjs.map +7 -0
  45. package/dist/lib/node-esm/{chunk-PZOORWFE.mjs → chunk-34X2VFQN.mjs} +430 -169
  46. package/dist/lib/{browser/chunk-B2DMPSP5.mjs.map → node-esm/chunk-34X2VFQN.mjs.map} +4 -4
  47. package/dist/lib/node-esm/{chunk-PUFSCMN4.mjs → chunk-3CMBLK6W.mjs} +3 -3
  48. package/dist/lib/node-esm/{chunk-PUFSCMN4.mjs.map → chunk-3CMBLK6W.mjs.map} +1 -1
  49. package/dist/lib/node-esm/{chunk-QZH2GDN5.mjs → chunk-N6VEANUZ.mjs} +12 -11
  50. package/dist/lib/node-esm/chunk-N6VEANUZ.mjs.map +7 -0
  51. package/dist/lib/node-esm/chunk-PVII2K2B.mjs +179 -0
  52. package/dist/lib/node-esm/chunk-PVII2K2B.mjs.map +7 -0
  53. package/dist/lib/node-esm/chunk-VSORIAHH.mjs +32 -0
  54. package/dist/lib/node-esm/chunk-VSORIAHH.mjs.map +7 -0
  55. package/dist/lib/node-esm/index.mjs +15 -11
  56. package/dist/lib/node-esm/index.mjs.map +1 -1
  57. package/dist/lib/node-esm/{intent-resolver-PTFKXAT4.mjs → intent-resolver-4RBV644N.mjs} +5 -5
  58. package/dist/lib/node-esm/intent-resolver-4RBV644N.mjs.map +7 -0
  59. package/dist/lib/node-esm/meta.json +1 -1
  60. package/dist/lib/node-esm/meta.mjs +1 -1
  61. package/dist/lib/node-esm/{react-surface-J5SW7VF2.mjs → react-surface-ZEVL3FXG.mjs} +5 -5
  62. package/dist/lib/node-esm/types/index.mjs +2 -2
  63. package/dist/types/src/components/Chart/Chart.d.ts.map +1 -1
  64. package/dist/types/src/components/ExplorerContainer.d.ts +4 -3
  65. package/dist/types/src/components/ExplorerContainer.d.ts.map +1 -1
  66. package/dist/types/src/components/Globe/Globe.d.ts.map +1 -1
  67. package/dist/types/src/components/Graph/D3ForceGraph.d.ts +14 -0
  68. package/dist/types/src/components/Graph/D3ForceGraph.d.ts.map +1 -0
  69. package/dist/types/src/components/Graph/D3ForceGraph.stories.d.ts +6 -0
  70. package/dist/types/src/components/Graph/D3ForceGraph.stories.d.ts.map +1 -0
  71. package/dist/types/src/components/Graph/ForceGraph.d.ts +8 -0
  72. package/dist/types/src/components/Graph/ForceGraph.d.ts.map +1 -0
  73. package/dist/types/src/components/Graph/{Graph.stories.d.ts → ForceGraph.stories.d.ts} +1 -1
  74. package/dist/types/src/components/Graph/ForceGraph.stories.d.ts.map +1 -0
  75. package/dist/types/src/components/Graph/adapter.d.ts +21 -0
  76. package/dist/types/src/components/Graph/adapter.d.ts.map +1 -0
  77. package/dist/types/src/components/Graph/index.d.ts +2 -2
  78. package/dist/types/src/components/Graph/index.d.ts.map +1 -1
  79. package/dist/types/src/components/Graph/testing.d.ts +14 -0
  80. package/dist/types/src/components/Graph/testing.d.ts.map +1 -0
  81. package/dist/types/src/components/Tree/Tree.d.ts.map +1 -1
  82. package/dist/types/src/components/Tree/layout/HierarchicalEdgeBundling.d.ts.map +1 -1
  83. package/dist/types/src/components/Tree/layout/RadialTree.d.ts.map +1 -1
  84. package/dist/types/src/components/Tree/layout/TidyTree.d.ts.map +1 -1
  85. package/dist/types/src/components/Tree/testing/generator.d.ts +8 -0
  86. package/dist/types/src/components/Tree/testing/generator.d.ts.map +1 -0
  87. package/dist/types/src/components/Tree/testing/index.d.ts +2 -0
  88. package/dist/types/src/components/Tree/testing/index.d.ts.map +1 -0
  89. package/dist/types/src/components/Tree/types/index.d.ts +3 -0
  90. package/dist/types/src/components/Tree/types/index.d.ts.map +1 -0
  91. package/dist/types/src/components/Tree/types/tree.d.ts +83 -0
  92. package/dist/types/src/components/Tree/types/tree.d.ts.map +1 -0
  93. package/dist/types/src/components/Tree/types/tree.test.d.ts +2 -0
  94. package/dist/types/src/components/Tree/types/tree.test.d.ts.map +1 -0
  95. package/dist/types/src/components/Tree/types/types.d.ts +8 -0
  96. package/dist/types/src/components/Tree/types/types.d.ts.map +1 -0
  97. package/dist/types/src/components/index.d.ts +2 -2
  98. package/dist/types/src/components/plot.d.ts.map +1 -1
  99. package/dist/types/src/hooks/index.d.ts +2 -0
  100. package/dist/types/src/hooks/index.d.ts.map +1 -0
  101. package/dist/types/src/hooks/useGraphModel.d.ts +4 -0
  102. package/dist/types/src/hooks/useGraphModel.d.ts.map +1 -0
  103. package/dist/types/src/index.d.ts +2 -1
  104. package/dist/types/src/index.d.ts.map +1 -1
  105. package/dist/types/src/translations.d.ts +2 -8
  106. package/dist/types/src/translations.d.ts.map +1 -1
  107. package/dist/types/src/types/schema.d.ts +6 -6
  108. package/dist/types/src/types/schema.d.ts.map +1 -1
  109. package/dist/types/src/types/types.d.ts +6 -6
  110. package/dist/types/src/types/types.d.ts.map +1 -1
  111. package/dist/types/tsconfig.tsbuildinfo +1 -1
  112. package/package.json +30 -27
  113. package/src/capabilities/intent-resolver.ts +2 -2
  114. package/src/components/ExplorerContainer.tsx +11 -4
  115. package/src/components/Globe/Globe.stories.tsx +13 -13
  116. package/src/components/Graph/D3ForceGraph.stories.tsx +64 -0
  117. package/src/components/Graph/D3ForceGraph.tsx +101 -0
  118. package/src/components/Graph/ForceGraph.stories.tsx +64 -0
  119. package/src/components/Graph/{Graph.tsx → ForceGraph.tsx} +19 -26
  120. package/src/components/Graph/adapter.ts +47 -0
  121. package/src/components/Graph/index.ts +2 -3
  122. package/src/components/Graph/testing.ts +57 -0
  123. package/src/components/Tree/Tree.stories.tsx +1 -1
  124. package/src/components/Tree/Tree.tsx +11 -18
  125. package/src/components/Tree/layout/HierarchicalEdgeBundling.ts +17 -19
  126. package/src/components/Tree/layout/RadialTree.ts +5 -7
  127. package/src/components/Tree/layout/TidyTree.ts +5 -6
  128. package/src/components/Tree/testing/generator.ts +46 -0
  129. package/src/components/Tree/testing/index.ts +5 -0
  130. package/src/components/Tree/types/index.ts +6 -0
  131. package/src/components/Tree/types/tree.test.ts +133 -0
  132. package/src/components/Tree/types/tree.ts +287 -0
  133. package/src/components/Tree/types/types.ts +41 -0
  134. package/src/hooks/index.ts +5 -0
  135. package/src/hooks/useGraphModel.ts +35 -0
  136. package/src/index.ts +2 -2
  137. package/src/meta.ts +2 -2
  138. package/src/types/schema.ts +5 -3
  139. package/src/types/types.ts +5 -5
  140. package/dist/lib/browser/ExplorerContainer-HL532ODG.mjs +0 -27
  141. package/dist/lib/browser/ExplorerContainer-HL532ODG.mjs.map +0 -7
  142. package/dist/lib/browser/chunk-QLQLPZNI.mjs.map +0 -7
  143. package/dist/lib/browser/chunk-SBLNE7FL.mjs +0 -205
  144. package/dist/lib/browser/chunk-SBLNE7FL.mjs.map +0 -7
  145. package/dist/lib/browser/intent-resolver-NHHRWTOP.mjs.map +0 -7
  146. package/dist/lib/node/ExplorerContainer-73AHSBAG.cjs.map +0 -7
  147. package/dist/lib/node/chunk-HCDBN6NN.cjs.map +0 -7
  148. package/dist/lib/node/chunk-OIHH6TVE.cjs +0 -236
  149. package/dist/lib/node/chunk-OIHH6TVE.cjs.map +0 -7
  150. package/dist/lib/node/chunk-YLL7H7CZ.cjs.map +0 -7
  151. package/dist/lib/node/intent-resolver-EEOTX3OZ.cjs.map +0 -7
  152. package/dist/lib/node-esm/ExplorerContainer-NMI55PYM.mjs +0 -28
  153. package/dist/lib/node-esm/ExplorerContainer-NMI55PYM.mjs.map +0 -7
  154. package/dist/lib/node-esm/chunk-QZH2GDN5.mjs.map +0 -7
  155. package/dist/lib/node-esm/chunk-SZRRNWYT.mjs +0 -207
  156. package/dist/lib/node-esm/chunk-SZRRNWYT.mjs.map +0 -7
  157. package/dist/lib/node-esm/intent-resolver-PTFKXAT4.mjs.map +0 -7
  158. package/dist/types/src/components/Graph/Graph.d.ts +0 -8
  159. package/dist/types/src/components/Graph/Graph.d.ts.map +0 -1
  160. package/dist/types/src/components/Graph/Graph.stories.d.ts.map +0 -1
  161. package/dist/types/src/components/Graph/graph-model.d.ts +0 -39
  162. package/dist/types/src/components/Graph/graph-model.d.ts.map +0 -1
  163. package/dist/types/src/components/Tree/types.d.ts +0 -8
  164. package/dist/types/src/components/Tree/types.d.ts.map +0 -1
  165. package/src/components/Graph/Graph.stories.tsx +0 -62
  166. package/src/components/Graph/graph-model.ts +0 -193
  167. package/src/components/Tree/types.ts +0 -40
  168. /package/dist/lib/browser/{react-surface-N7TC6BMF.mjs.map → react-surface-H3YDMXAQ.mjs.map} +0 -0
  169. /package/dist/lib/node/{react-surface-WD4G2NRS.cjs.map → react-surface-6ESLSM33.cjs.map} +0 -0
  170. /package/dist/lib/node-esm/{react-surface-J5SW7VF2.mjs.map → react-surface-ZEVL3FXG.mjs.map} +0 -0
@@ -26,30 +26,37 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
26
26
  mod
27
27
  ));
28
28
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var chunk_HCDBN6NN_exports = {};
30
- __export(chunk_HCDBN6NN_exports, {
29
+ var chunk_72H5HBTK_exports = {};
30
+ __export(chunk_72H5HBTK_exports, {
31
31
  Chart: () => Chart,
32
32
  ExplorerContainer: () => ExplorerContainer,
33
33
  Globe: () => Globe,
34
- Tree: () => Tree,
34
+ Tree: () => Tree2,
35
35
  defaultTreeLayoutSlots: () => defaultTreeLayoutSlots
36
36
  });
37
- module.exports = __toCommonJS(chunk_HCDBN6NN_exports);
38
- var import_chunk_OIHH6TVE = require("./chunk-OIHH6TVE.cjs");
37
+ module.exports = __toCommonJS(chunk_72H5HBTK_exports);
38
+ var import_tracking = require("@preact-signals/safe-react/tracking");
39
39
  var Plot = __toESM(require("@observablehq/plot"));
40
40
  var import_react = __toESM(require("react"));
41
41
  var import_react_resize_detector = require("react-resize-detector");
42
+ var import_tracking2 = require("@preact-signals/safe-react/tracking");
42
43
  var Plot2 = __toESM(require("@observablehq/plot"));
43
44
  var import_react2 = __toESM(require("react"));
44
45
  var import_react_resize_detector2 = require("react-resize-detector");
45
46
  var topojson = __toESM(require("topojson-client"));
47
+ var import_tracking3 = require("@preact-signals/safe-react/tracking");
46
48
  var import_react3 = __toESM(require("react"));
47
- var import_react_resize_detector3 = require("react-resize-detector");
48
- var import_gem_core = require("@dxos/gem-core");
49
49
  var import_react_ui = require("@dxos/react-ui");
50
- var d3 = __toESM(require("d3"));
51
- var d32 = __toESM(require("d3"));
52
- var d33 = __toESM(require("d3"));
50
+ var import_react_ui_graph = require("@dxos/react-ui-graph");
51
+ var import_schema = require("@dxos/schema");
52
+ var import_d3 = require("d3");
53
+ var import_d32 = require("d3");
54
+ var import_d33 = require("d3");
55
+ var import_effect = require("effect");
56
+ var import_echo = require("@dxos/echo");
57
+ var import_echo_schema = require("@dxos/echo-schema");
58
+ var import_invariant = require("@dxos/invariant");
59
+ var import_live_object = require("@dxos/live-object");
53
60
  var import_react4 = require("react");
54
61
  var createAdapter = (prop, accessor) => accessor ? {
55
62
  transform: (values) => values.map((value) => accessor(value)[prop])
@@ -61,40 +68,45 @@ var defaultOptions = {
61
68
  fillOpacity: 0.2
62
69
  };
63
70
  var Chart = ({ items = [], accessor, options = defaultOptions }) => {
64
- const { ref: containerRef, width = 0, height = 0 } = (0, import_react_resize_detector.useResizeDetector)({
65
- refreshRate: 200
66
- });
67
- (0, import_react.useEffect)(() => {
68
- if (!width || !height) {
69
- return;
70
- }
71
- const plot3 = Plot.plot({
72
- grid: true,
71
+ var _effect = (0, import_tracking.useSignals)();
72
+ try {
73
+ const { ref: containerRef, width = 0, height = 0 } = (0, import_react_resize_detector.useResizeDetector)({
74
+ refreshRate: 200
75
+ });
76
+ (0, import_react.useEffect)(() => {
77
+ if (!width || !height) {
78
+ return;
79
+ }
80
+ const plot3 = Plot.plot({
81
+ grid: true,
82
+ width,
83
+ height,
84
+ style: {
85
+ background: "transparent"
86
+ },
87
+ marks: [
88
+ Plot.frame(),
89
+ Plot.dot(items, {
90
+ x: createAdapter("x", accessor),
91
+ y: createAdapter("y", accessor),
92
+ ...options
93
+ })
94
+ ]
95
+ });
96
+ containerRef.current.append(plot3);
97
+ return () => plot3?.remove();
98
+ }, [
99
+ items,
73
100
  width,
74
- height,
75
- style: {
76
- background: "transparent"
77
- },
78
- marks: [
79
- Plot.frame(),
80
- Plot.dot(items, {
81
- x: createAdapter("x", accessor),
82
- y: createAdapter("y", accessor),
83
- ...options
84
- })
85
- ]
101
+ height
102
+ ]);
103
+ return /* @__PURE__ */ import_react.default.createElement("div", {
104
+ ref: containerRef,
105
+ className: "grow"
86
106
  });
87
- containerRef.current.append(plot3);
88
- return () => plot3?.remove();
89
- }, [
90
- items,
91
- width,
92
- height
93
- ]);
94
- return /* @__PURE__ */ import_react.default.createElement("div", {
95
- ref: containerRef,
96
- className: "grow"
97
- });
107
+ } finally {
108
+ _effect.f();
109
+ }
98
110
  };
99
111
  var countries_110m_default = {
100
112
  type: "Topology",
@@ -10801,71 +10813,76 @@ var defaultOptions2 = {
10801
10813
  fill: "#003300"
10802
10814
  };
10803
10815
  var Globe = ({ items = [], accessor, projection = "orthographic", options = defaultOptions2 }) => {
10804
- const { ref: containerRef, width = 0, height = 0 } = (0, import_react_resize_detector2.useResizeDetector)({
10805
- refreshRate: 200
10806
- });
10807
- const land = topojson.feature(countries_110m_default, countries_110m_default.objects.land);
10808
- (0, import_react2.useEffect)(() => {
10809
- if (!width || !height) {
10810
- return;
10811
- }
10812
- const plot3 = Plot2.plot({
10813
- // https://observablehq.com/plot/features/projections
10814
- projection: {
10815
- type: projection,
10816
- rotate: [
10817
- -100,
10818
- -20
10816
+ var _effect = (0, import_tracking2.useSignals)();
10817
+ try {
10818
+ const { ref: containerRef, width = 0, height = 0 } = (0, import_react_resize_detector2.useResizeDetector)({
10819
+ refreshRate: 200
10820
+ });
10821
+ const land = topojson.feature(countries_110m_default, countries_110m_default.objects.land);
10822
+ (0, import_react2.useEffect)(() => {
10823
+ if (!width || !height) {
10824
+ return;
10825
+ }
10826
+ const plot3 = Plot2.plot({
10827
+ // https://observablehq.com/plot/features/projections
10828
+ projection: {
10829
+ type: projection,
10830
+ rotate: [
10831
+ -100,
10832
+ -20
10833
+ ]
10834
+ },
10835
+ // projection: { type: 'equirectangular', rotate: [-140, -30] },
10836
+ width,
10837
+ height,
10838
+ style: {
10839
+ background: "transparent"
10840
+ },
10841
+ // TODO(burdon): Create simple wrapper for Plot with good defaults.
10842
+ marks: [
10843
+ Plot2.sphere({
10844
+ fill: "lightblue",
10845
+ fillOpacity: 0.5
10846
+ }),
10847
+ Plot2.geo(land, {
10848
+ fill: "darkgreen",
10849
+ fillOpacity: 0.5
10850
+ }),
10851
+ Plot2.graticule(),
10852
+ Plot2.dot(items, {
10853
+ x: createAdapter("lat", accessor),
10854
+ y: createAdapter("lng", accessor),
10855
+ ...options
10856
+ })
10819
10857
  ]
10820
- },
10821
- // projection: { type: 'equirectangular', rotate: [-140, -30] },
10858
+ });
10859
+ containerRef.current.append(plot3);
10860
+ return () => plot3?.remove();
10861
+ }, [
10862
+ items,
10822
10863
  width,
10823
- height,
10824
- style: {
10825
- background: "transparent"
10826
- },
10827
- // TODO(burdon): Create simple wrapper for Plot with good defaults.
10828
- marks: [
10829
- Plot2.sphere({
10830
- fill: "lightblue",
10831
- fillOpacity: 0.5
10832
- }),
10833
- Plot2.geo(land, {
10834
- fill: "darkgreen",
10835
- fillOpacity: 0.5
10836
- }),
10837
- Plot2.graticule(),
10838
- Plot2.dot(items, {
10839
- x: createAdapter("lat", accessor),
10840
- y: createAdapter("lng", accessor),
10841
- ...options
10842
- })
10843
- ]
10864
+ height
10865
+ ]);
10866
+ return /* @__PURE__ */ import_react2.default.createElement("div", {
10867
+ ref: containerRef,
10868
+ className: "grow p-4"
10844
10869
  });
10845
- containerRef.current.append(plot3);
10846
- return () => plot3?.remove();
10847
- }, [
10848
- items,
10849
- width,
10850
- height
10851
- ]);
10852
- return /* @__PURE__ */ import_react2.default.createElement("div", {
10853
- ref: containerRef,
10854
- className: "grow p-4"
10855
- });
10870
+ } finally {
10871
+ _effect.f();
10872
+ }
10856
10873
  };
10857
10874
  var HierarchicalEdgeBundling = (s, data, options) => {
10858
- const svg = d3.select(s);
10875
+ const svg = (0, import_d3.select)(s);
10859
10876
  svg.selectAll("*").remove();
10860
10877
  const { radius = 600, padding = 100, slots } = options;
10861
- const root = d3.hierarchy(flatten(data));
10862
- const tree3 = d3.cluster().size([
10878
+ const root = (0, import_d3.hierarchy)(flatten(data));
10879
+ const tree3 = (0, import_d3.cluster)().size([
10863
10880
  2 * Math.PI,
10864
10881
  radius - padding
10865
10882
  ]);
10866
10883
  const layout = tree3(addLinks(root));
10867
10884
  const node = svg.append("g").selectAll().data(layout.leaves()).join("g").attr("transform", (d) => `rotate(${d.x * (180 / Math.PI) - 90}) translate(${d.y},0)`).append("text").attr("class", slots?.text ?? "").attr("dy", "0.31em").attr("x", (d) => d.x < Math.PI ? 6 : -6).attr("text-anchor", (d) => d.x < Math.PI ? "start" : "end").attr("transform", (d) => d.x >= Math.PI ? "rotate(180)" : null).call((text) => text.text((d) => d.data.id.slice(0, 8)));
10868
- const line = d3.lineRadial().curve(d3.curveBundle.beta(0.85)).radius((d) => d.y).angle((d) => d.x);
10885
+ const line = (0, import_d3.lineRadial)().curve(import_d3.curveBundle.beta(0.85)).radius((d) => d.y).angle((d) => d.x);
10869
10886
  const links = svg.append("g").selectAll().data(layout.leaves().flatMap((leaf) => leaf.outgoing)).join("path").style("mix-blend-mode", "multiply").attr("class", slots?.path ?? "").attr("d", ([i, o]) => {
10870
10887
  return line(i.path(o));
10871
10888
  }).each(function(d) {
@@ -10915,19 +10932,19 @@ var flatten = (node) => {
10915
10932
  };
10916
10933
  var HierarchicalEdgeBundling_default = HierarchicalEdgeBundling;
10917
10934
  var RadialTree = (s, data, options) => {
10918
- const svg = d32.select(s);
10935
+ const svg = (0, import_d32.select)(s);
10919
10936
  svg.selectAll("*").remove();
10920
10937
  const { label, radius = 400, r = 4, slots } = options;
10921
10938
  const arc = 2 * Math.PI;
10922
- const root = d32.hierarchy(data);
10939
+ const root = (0, import_d32.hierarchy)(data);
10923
10940
  const descendants = root.descendants();
10924
10941
  const getLabel = label === null ? null : descendants.map((d) => label(d.data));
10925
- const layout = d32.tree().size([
10942
+ const layout = (0, import_d32.tree)().size([
10926
10943
  arc,
10927
10944
  radius
10928
10945
  ]).separation((a, b) => (a.parent === b.parent ? 1 : 2) / a.depth);
10929
10946
  layout(root);
10930
- svg.append("g").selectAll("path").data(root.links()).join("path").attr("class", slots?.path ?? "").attr("d", d32.linkRadial().angle((d) => d.x + Math.PI / 2).radius((d) => d.y));
10947
+ svg.append("g").selectAll("path").data(root.links()).join("path").attr("class", slots?.path ?? "").attr("d", (0, import_d32.linkRadial)().angle((d) => d.x + Math.PI / 2).radius((d) => d.y));
10931
10948
  const node = svg.append("g").selectAll("a").data(root.descendants()).join("a").attr("transform", (d) => `rotate(${d.x * 180 / Math.PI}) translate(${d.y},0)`);
10932
10949
  node.append("circle").attr("class", slots?.node ?? "").attr("r", r);
10933
10950
  if (getLabel) {
@@ -10937,15 +10954,15 @@ var RadialTree = (s, data, options) => {
10937
10954
  };
10938
10955
  var RadialTree_default = RadialTree;
10939
10956
  var TidyTree = (s, data, options) => {
10940
- const svg = d33.select(s);
10957
+ const svg = (0, import_d33.select)(s);
10941
10958
  svg.selectAll("*").remove();
10942
10959
  const { label, width, height, r = 4, padding = 4, margin = 60, slots } = options;
10943
- const root = d33.hierarchy(data);
10960
+ const root = (0, import_d33.hierarchy)(data);
10944
10961
  const descendants = root.descendants();
10945
10962
  const getLabel = label == null ? null : descendants.map((d) => label(d.data));
10946
10963
  const dx = 16;
10947
10964
  const dy = width / (root.height + padding);
10948
- const layout = d33.tree().nodeSize([
10965
+ const layout = (0, import_d33.tree)().nodeSize([
10949
10966
  dx,
10950
10967
  dy
10951
10968
  ]);
@@ -10970,7 +10987,7 @@ var TidyTree = (s, data, options) => {
10970
10987
  });
10971
10988
  const sx = Math.min(2, Math.max(1, (height - margin * 2) / (x1 - x0)));
10972
10989
  const oy = -(width - (y1 - y0)) / 2;
10973
- svg.append("g").selectAll("path").data(root.links()).join("path").attr("class", slots?.path ?? "").attr("d", d33.link(d33.curveBumpX).x((d) => d.y + oy).y((d) => d.x * sx));
10990
+ svg.append("g").selectAll("path").data(root.links()).join("path").attr("class", slots?.path ?? "").attr("d", (0, import_d33.link)(import_d33.curveBumpX).x((d) => d.y + oy).y((d) => d.x * sx));
10974
10991
  const node = svg.append("g").selectAll("a").data(root.descendants()).join("a").attr("transform", (d) => `translate(${d.y + oy},${d.x * sx})`);
10975
10992
  node.append("circle").attr("class", slots?.node ?? "").attr("r", r);
10976
10993
  if (getLabel) {
@@ -10978,25 +10995,267 @@ var TidyTree = (s, data, options) => {
10978
10995
  }
10979
10996
  };
10980
10997
  var TidyTree_default = TidyTree;
10981
- var mapGraphToTreeData = (model, maxDepth = 8) => {
10982
- const mapNode = (node, depth = 0) => {
10983
- const treeNode = {
10984
- id: model.idAccessor(node),
10985
- label: model.idAccessor(node).slice(0, 8)
10998
+ var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-explorer/src/components/Tree/types/tree.ts";
10999
+ var TreeNodeType = import_effect.Schema.Struct({
11000
+ id: import_echo_schema.ObjectId,
11001
+ children: import_effect.Schema.mutable(import_effect.Schema.Array(import_echo_schema.ObjectId)),
11002
+ data: import_effect.Schema.mutable(import_effect.Schema.Record({
11003
+ key: import_effect.Schema.String,
11004
+ value: import_effect.Schema.Any
11005
+ })),
11006
+ ref: import_effect.Schema.optional((0, import_echo_schema.Ref)(import_echo_schema.Expando))
11007
+ }).pipe(import_effect.Schema.mutable);
11008
+ var TreeType = import_effect.Schema.Struct({
11009
+ root: import_echo_schema.ObjectId,
11010
+ nodes: import_effect.Schema.mutable(import_effect.Schema.Record({
11011
+ key: import_echo_schema.ObjectId,
11012
+ value: TreeNodeType
11013
+ }))
11014
+ }).pipe(import_echo.Type.Obj({
11015
+ typename: "dxos.org/type/Tree",
11016
+ version: "0.1.0"
11017
+ }));
11018
+ var Tree = class _Tree {
11019
+ static {
11020
+ this.create = () => {
11021
+ const id = import_echo_schema.ObjectId.random();
11022
+ return (0, import_live_object.live)(TreeType, {
11023
+ root: id,
11024
+ nodes: {
11025
+ [id]: {
11026
+ id,
11027
+ children: [],
11028
+ data: {
11029
+ text: ""
11030
+ }
11031
+ }
11032
+ }
11033
+ });
10986
11034
  };
10987
- const links = model.graph.links.filter((link2) => link2.source === treeNode.id);
10988
- if (depth < maxDepth) {
10989
- treeNode.children = links.map((link2) => mapNode(model.graph.nodes.find((node2) => model.idAccessor(node2) === link2.target), depth + 1));
11035
+ }
11036
+ constructor(tree3) {
11037
+ this._tree = tree3 ?? _Tree.create();
11038
+ }
11039
+ get tree() {
11040
+ return this._tree;
11041
+ }
11042
+ // TODO(burdon): Make reactive.
11043
+ get size() {
11044
+ return Object.keys(this._tree.nodes).length;
11045
+ }
11046
+ get root() {
11047
+ return this.getNode(this._tree.root);
11048
+ }
11049
+ //
11050
+ // Traversal
11051
+ //
11052
+ /**
11053
+ * Recursively traverse the tree until the callback returns a value.
11054
+ */
11055
+ tranverse(callback, root = this._tree.root, depth = 0) {
11056
+ const node = this._tree.nodes[root];
11057
+ const result = callback(node, depth);
11058
+ if (result !== void 0) {
11059
+ return result;
10990
11060
  }
10991
- return treeNode;
10992
- };
10993
- let data;
10994
- if (model.selected) {
10995
- const node = model.graph.nodes.find((node2) => model.idAccessor(node2) === model.selected);
10996
- if (node) {
10997
- data = mapNode(node);
11061
+ for (const childId of node.children) {
11062
+ const result2 = this.tranverse(callback, childId, depth + 1);
11063
+ if (result2 !== void 0) {
11064
+ return result2;
11065
+ }
11066
+ }
11067
+ }
11068
+ getNode(id) {
11069
+ const node = this._tree.nodes[id];
11070
+ (0, import_invariant.invariant)(node, void 0, {
11071
+ F: __dxlog_file,
11072
+ L: 100,
11073
+ S: this,
11074
+ A: [
11075
+ "node",
11076
+ ""
11077
+ ]
11078
+ });
11079
+ return node;
11080
+ }
11081
+ /**
11082
+ * Get the children of a node.
11083
+ */
11084
+ getChildNodes(node) {
11085
+ return node.children.map((id) => this.getNode(id));
11086
+ }
11087
+ /**
11088
+ * Get the parent of a node.
11089
+ */
11090
+ getParent(node) {
11091
+ const parent = this.tranverse((n) => {
11092
+ if (n.children.includes(node.id)) {
11093
+ return n;
11094
+ }
11095
+ });
11096
+ return parent ?? null;
11097
+ }
11098
+ /**
11099
+ * Get the next node in the tree.
11100
+ */
11101
+ getNext(node, hierarchical = true) {
11102
+ if (hierarchical && node.children.length) {
11103
+ return this.getChildNodes(node)[0];
11104
+ } else {
11105
+ const parent = this.getParent(node);
11106
+ if (parent) {
11107
+ const idx = this.getChildNodes(parent).findIndex(({ id }) => id === node.id);
11108
+ if (idx < parent.children.length - 1) {
11109
+ return this.getNode(parent.children[idx + 1]);
11110
+ } else {
11111
+ return this.getNext(parent, false);
11112
+ }
11113
+ }
11114
+ }
11115
+ }
11116
+ /**
11117
+ * Get the previous node in the tree.
11118
+ */
11119
+ getPrevious(node, hierarchical = true) {
11120
+ const parent = this.getParent(node);
11121
+ const idx = this.getChildNodes(parent).findIndex(({ id }) => id === node.id);
11122
+ if (idx === 0) {
11123
+ if (hierarchical) {
11124
+ return parent;
11125
+ }
11126
+ } else {
11127
+ const previous = this.getNode(parent.children[idx - 1]);
11128
+ if (hierarchical && previous.children.length) {
11129
+ return this.getLastDescendent(previous);
11130
+ }
11131
+ return previous;
11132
+ }
11133
+ }
11134
+ /**
11135
+ * Get the last descendent of a node.
11136
+ */
11137
+ getLastDescendent(node) {
11138
+ const children = this.getChildNodes(node);
11139
+ const last = children.length ? children[children.length - 1] : void 0;
11140
+ if (last) {
11141
+ return this.getLastDescendent(last);
11142
+ }
11143
+ return node;
11144
+ }
11145
+ //
11146
+ // Mutations
11147
+ //
11148
+ /**
11149
+ * Clear tree.
11150
+ */
11151
+ clear() {
11152
+ const root = this._tree.nodes[this._tree.root];
11153
+ root.children.length = 0;
11154
+ this._tree.nodes = {
11155
+ [root.id]: root
11156
+ };
11157
+ }
11158
+ /**
11159
+ * Add node.
11160
+ */
11161
+ addNode(parent, node, index) {
11162
+ if (!node) {
11163
+ const id = import_echo_schema.ObjectId.random();
11164
+ node = {
11165
+ id,
11166
+ children: [],
11167
+ data: {
11168
+ text: ""
11169
+ }
11170
+ };
11171
+ }
11172
+ this._tree.nodes[node.id] = node;
11173
+ parent.children.splice(index ?? parent.children.length, 0, node.id);
11174
+ return node;
11175
+ }
11176
+ /**
11177
+ * Delete node.
11178
+ */
11179
+ deleteNode(parent, id) {
11180
+ const node = this._tree.nodes[id];
11181
+ if (!node) {
11182
+ return void 0;
10998
11183
  }
11184
+ delete this._tree.nodes[node.id];
11185
+ const idx = parent.children.findIndex((child) => child === id);
11186
+ if (idx !== -1) {
11187
+ parent.children.splice(idx, 1);
11188
+ }
11189
+ return node;
10999
11190
  }
11191
+ /**
11192
+ * Move child node.
11193
+ */
11194
+ moveNode(node, from, to) {
11195
+ (0, import_invariant.invariant)(from >= 0 && from < node.children.length, void 0, {
11196
+ F: __dxlog_file,
11197
+ L: 230,
11198
+ S: this,
11199
+ A: [
11200
+ "from >= 0 && from < node.children.length",
11201
+ ""
11202
+ ]
11203
+ });
11204
+ (0, import_invariant.invariant)(to >= 0 && to < node.children.length, void 0, {
11205
+ F: __dxlog_file,
11206
+ L: 231,
11207
+ S: this,
11208
+ A: [
11209
+ "to >= 0 && to < node.children.length",
11210
+ ""
11211
+ ]
11212
+ });
11213
+ if (from === to) {
11214
+ return null;
11215
+ }
11216
+ const child = node.children[from];
11217
+ node.children.splice(from, 1);
11218
+ node.children.splice(to, 0, child);
11219
+ return this.getNode(child);
11220
+ }
11221
+ /**
11222
+ * Indent node.
11223
+ */
11224
+ indentNode(node) {
11225
+ const parent = this.getParent(node);
11226
+ if (!parent) {
11227
+ return;
11228
+ }
11229
+ const idx = parent.children.findIndex((child) => child === node.id);
11230
+ if (idx < 1 || idx >= parent.children.length) {
11231
+ return;
11232
+ }
11233
+ const previous = this.getNode(parent.children[idx - 1]);
11234
+ parent.children.splice(idx, 1);
11235
+ previous.children.push(node.id);
11236
+ }
11237
+ /**
11238
+ * Unindent node.
11239
+ */
11240
+ unindentNode(node) {
11241
+ const parent = this.getParent(node);
11242
+ if (!parent) {
11243
+ return;
11244
+ }
11245
+ const ancestor = this.getParent(parent);
11246
+ if (!ancestor) {
11247
+ return;
11248
+ }
11249
+ const nodeIdx = parent.children.findIndex((id) => id === node.id);
11250
+ const [_, ...rest] = parent.children.splice(nodeIdx, parent.children.length - nodeIdx);
11251
+ parent.children.splice(nodeIdx, parent.children.length - nodeIdx);
11252
+ const parentIdx = this.getChildNodes(ancestor).findIndex((n) => n.id === parent.id);
11253
+ ancestor.children.splice(parentIdx + 1, 0, node.id);
11254
+ node.children.push(...rest);
11255
+ }
11256
+ };
11257
+ var mapGraphToTreeData = (model, maxDepth = 8) => {
11258
+ let data;
11000
11259
  return data;
11001
11260
  };
11002
11261
  var defaultTreeLayoutSlots = {
@@ -11018,57 +11277,59 @@ var renderers = /* @__PURE__ */ new Map([
11018
11277
  HierarchicalEdgeBundling_default
11019
11278
  ]
11020
11279
  ]);
11021
- var Tree = ({ space, selected, variant = "tidy", onNodeClick }) => {
11022
- const [model] = (0, import_react_ui.useAsyncState)(async () => space ? new import_chunk_OIHH6TVE.SpaceGraphModel().open(space, selected) : void 0, [
11023
- space,
11024
- selected
11025
- ]);
11026
- const [tree3, setTree] = (0, import_react3.useState)();
11027
- (0, import_react3.useEffect)(() => {
11028
- return model?.subscribe(() => {
11029
- const tree4 = mapGraphToTreeData(model);
11030
- setTree(tree4);
11031
- }, true);
11032
- }, [
11033
- model
11034
- ]);
11035
- const context = (0, import_gem_core.createSvgContext)();
11036
- const { ref, width = 0, height = 0 } = (0, import_react_resize_detector3.useResizeDetector)();
11037
- (0, import_react3.useEffect)(() => {
11038
- if (width && height) {
11039
- const size = Math.min(width, height);
11040
- const radius = size * 0.4;
11041
- const options = {
11042
- // TODO(burdon): Type.
11043
- label: (d) => d.label ?? d.id,
11044
- width,
11045
- height,
11046
- radius,
11047
- marginLeft: (width - radius * 2) / 2,
11048
- marginRight: (width - radius * 2) / 2,
11049
- marginTop: (height - radius * 2) / 2,
11050
- marginBottom: (height - radius * 2) / 2,
11051
- slots: defaultTreeLayoutSlots
11052
- };
11053
- if (tree3) {
11054
- const renderer = renderers.get(variant);
11055
- renderer?.(context.ref.current, tree3, options);
11280
+ var Tree2 = ({ space, selected, variant = "tidy", onNodeClick }) => {
11281
+ var _effect = (0, import_tracking3.useSignals)();
11282
+ try {
11283
+ const [model] = (0, import_react_ui.useAsyncState)(async () => space ? new import_schema.SpaceGraphModel().open(space) : void 0, [
11284
+ space,
11285
+ selected
11286
+ ]);
11287
+ const [tree3, setTree] = (0, import_react3.useState)();
11288
+ (0, import_react3.useEffect)(() => {
11289
+ return model?.subscribe(() => {
11290
+ const tree4 = mapGraphToTreeData(model);
11291
+ setTree(tree4);
11292
+ }, true);
11293
+ }, [
11294
+ model
11295
+ ]);
11296
+ const context = (0, import_react3.useRef)(null);
11297
+ (0, import_react3.useEffect)(() => {
11298
+ if (context.current) {
11299
+ const { width, height } = context.current.size;
11300
+ const size = Math.min(width, height);
11301
+ const radius = size * 0.4;
11302
+ const options = {
11303
+ // TODO(burdon): Type.
11304
+ label: (d) => d.label ?? d.id,
11305
+ width,
11306
+ height,
11307
+ radius,
11308
+ marginLeft: (width - radius * 2) / 2,
11309
+ marginRight: (width - radius * 2) / 2,
11310
+ marginTop: (height - radius * 2) / 2,
11311
+ marginBottom: (height - radius * 2) / 2,
11312
+ slots: defaultTreeLayoutSlots
11313
+ };
11314
+ if (tree3) {
11315
+ const renderer = renderers.get(variant);
11316
+ renderer?.(context.current.svg, tree3, options);
11317
+ }
11056
11318
  }
11057
- }
11058
- }, [
11059
- tree3,
11060
- width,
11061
- height
11062
- ]);
11063
- return /* @__PURE__ */ import_react3.default.createElement("div", {
11064
- ref,
11065
- className: "flex grow overflow-hidden",
11066
- onClick: () => onNodeClick?.()
11067
- }, /* @__PURE__ */ import_react3.default.createElement(import_gem_core.SVGRoot, {
11068
- context
11069
- }, /* @__PURE__ */ import_react3.default.createElement(import_gem_core.SVG, null)));
11319
+ }, [
11320
+ context.current,
11321
+ tree3
11322
+ ]);
11323
+ return /* @__PURE__ */ import_react3.default.createElement("div", {
11324
+ onClick: () => onNodeClick?.()
11325
+ }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui_graph.SVG.Root, {
11326
+ ref: context
11327
+ }));
11328
+ } finally {
11329
+ _effect.f();
11330
+ }
11070
11331
  };
11071
- var ExplorerContainer = (0, import_react4.lazy)(() => import("./ExplorerContainer-73AHSBAG.cjs"));
11332
+ var ExplorerContainer = (0, import_react4.lazy)(() => import("./ExplorerContainer-MVP2AM7R.cjs"));
11072
11333
  // Annotate the CommonJS export names for ESM import in node:
11073
11334
  0 && (module.exports = {
11074
11335
  Chart,
@@ -11077,4 +11338,4 @@ var ExplorerContainer = (0, import_react4.lazy)(() => import("./ExplorerContaine
11077
11338
  Tree,
11078
11339
  defaultTreeLayoutSlots
11079
11340
  });
11080
- //# sourceMappingURL=chunk-HCDBN6NN.cjs.map
11341
+ //# sourceMappingURL=chunk-72H5HBTK.cjs.map