@awesome-flow/ecs 0.2.0 → 0.4.0

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.
package/dist/index.js CHANGED
@@ -1,21 +1,15 @@
1
- // src/ecs/ecs-flow-context.ts
1
+ // src/abstract/ecs-flow-context.ts
2
2
  import { createContext } from "react";
3
- var EcsFlowContext = createContext({
4
- ecsFlowRepository: null,
5
- entityRepository: null,
6
- entityEventsManager: null,
7
- entityUpdateCounter: null,
8
- systemsModuleRepository: null
9
- });
3
+ var EcsFlowContext = createContext(null);
10
4
 
11
5
  // src/utils/id-generator.ts
12
- var IdGenerator = class {
6
+ var EcsIdGenerator = class {
13
7
  static entityProxy(proxy) {
14
8
  return `${proxy.entityType}:${proxy.entityUid}`;
15
9
  }
16
10
  };
17
11
 
18
- // src/ecs/ecs-flow-repository.ts
12
+ // src/abstract/ecs-flow-repository.ts
19
13
  var EcsFlowRepository = class {
20
14
  nodes;
21
15
  constructor() {
@@ -31,98 +25,44 @@ var EcsFlowRepository = class {
31
25
  return this.nodes.get(entityType.toString());
32
26
  }
33
27
  addEntityNode(node) {
34
- this.nodes.set(IdGenerator.entityProxy(node.data.entity), node);
28
+ this.nodes.set(EcsIdGenerator.entityProxy(node.data.entity), node);
35
29
  }
36
30
  getEntityNode(entity) {
37
- return this.nodes.get(IdGenerator.entityProxy(entity));
31
+ return this.nodes.get(EcsIdGenerator.entityProxy(entity));
38
32
  }
39
33
  listAllNodes() {
40
34
  return Array.from(this.nodes.values());
41
35
  }
42
36
  };
43
37
 
44
- // src/ecs/flow-ecs-state.tsx
45
- import { useEffect as useEffect7, useContext as useContext10, useState as useState3 } from "react";
46
-
47
- // src/ecs/flow-ecs-auto-layout.tsx
48
- import { FlowContext } from "@awesome-flow/core/abstract";
49
- import Dagre from "@dagrejs/dagre";
50
- import { useReactFlow } from "@xyflow/react";
51
- import { useCallback, useContext, useEffect, useMemo } from "react";
52
- import { Fragment, jsx } from "react/jsx-runtime";
53
- function FlowEcsAutoLayout(props) {
54
- const { getNodes, getEdges } = useReactFlow();
55
- const context = useContext(FlowContext);
56
- const setNodes = context.useFlowStore((state) => state.setNodes);
57
- const graph = useMemo(() => new Dagre.graphlib.Graph().setDefaultEdgeLabel(() => ({})), []);
58
- const getLayoutElements = useCallback(
59
- (nodes, edges, options) => {
60
- graph.setGraph(options);
61
- edges.forEach((edge) => graph.setEdge(edge.source, edge.target));
62
- nodes.forEach((node) => {
63
- if (node.measured) {
64
- graph.setNode(node.id, {
65
- width: node.measured.width,
66
- height: node.measured.height
67
- });
68
- }
69
- });
70
- Dagre.layout(graph);
71
- return {
72
- nodes: nodes.map((node) => {
73
- const graphNode = graph.node(node.id);
74
- if (graphNode) {
75
- return { ...node, position: { x: graphNode.x, y: graphNode.y } };
76
- }
77
- return node;
78
- }),
79
- edges
80
- };
81
- },
82
- [graph]
83
- );
84
- useEffect(() => {
85
- if (props.needsLayout) {
86
- const storeNodes = getNodes();
87
- if (storeNodes?.length) {
88
- const edges = getEdges();
89
- const layout = getLayoutElements(storeNodes, edges, {
90
- rankdir: "LR"
91
- });
92
- setNodes(layout.nodes);
93
- }
94
- }
95
- }, [props.needsLayout]);
96
- useEffect(() => {
97
- if (props.needsLayout) {
98
- props.setNeedsLayout(false);
99
- }
100
- });
101
- return /* @__PURE__ */ jsx(Fragment, {});
102
- }
103
- var flow_ecs_auto_layout_default = FlowEcsAutoLayout;
104
-
105
- // src/ecs/flow-ecs-entities.tsx
106
- import { FlowContext as FlowContext4 } from "@awesome-flow/core/abstract";
107
- import { useContext as useContext8, useEffect as useEffect5, useState as useState2 } from "react";
38
+ // src/abstract/handle-types.ts
39
+ var EcsHandleDataType = /* @__PURE__ */ ((EcsHandleDataType2) => {
40
+ EcsHandleDataType2["proxy"] = "proxy";
41
+ EcsHandleDataType2["module"] = "module";
42
+ return EcsHandleDataType2;
43
+ })(EcsHandleDataType || {});
108
44
 
109
45
  // src/nodes/node-systems-module.tsx
110
46
  import { NodeContainer } from "@awesome-flow/core/layout";
111
- import { useContext as useContext2 } from "react";
47
+ import { useContext } from "react";
48
+ import { Badge as Badge3 } from "@mantine/core";
112
49
 
113
50
  // src/layout/systems-module-layout.tsx
114
51
  import { SystemType } from "@awesome-ecs/abstract/systems";
115
52
  import { Accordion as Accordion2, Text } from "@mantine/core";
116
- import { useMemo as useMemo3 } from "react";
53
+ import { useMemo as useMemo2 } from "react";
54
+
55
+ // src/components/pipeline-middleware-list.tsx
56
+ import { Accordion, Badge as Badge2, Stack } from "@mantine/core";
117
57
 
118
58
  // src/components/badge-list.tsx
119
59
  import { Badge } from "@mantine/core";
120
60
  import { memo as memo2 } from "react";
121
61
 
122
62
  // src/components/formatter-camel-case.tsx
123
- import { memo, useMemo as useMemo2 } from "react";
63
+ import { memo, useMemo } from "react";
124
64
  function CamelCaseFormatter(props) {
125
- const value = useMemo2(
65
+ const value = useMemo(
126
66
  () => props.value?.toString().replace(/([a-z])([A-Z])/g, "$1 $2"),
127
67
  [props.value]
128
68
  );
@@ -131,17 +71,16 @@ function CamelCaseFormatter(props) {
131
71
  var formatter_camel_case_default = memo(CamelCaseFormatter);
132
72
 
133
73
  // src/components/badge-list.tsx
134
- import { jsx as jsx2 } from "react/jsx-runtime";
74
+ import { jsx } from "react/jsx-runtime";
135
75
  function BadgeList(props) {
136
76
  return props.items.map((value, i) => {
137
- return /* @__PURE__ */ jsx2(Badge, { ...props.badge || [], children: /* @__PURE__ */ jsx2(formatter_camel_case_default, { value }) }, i);
77
+ return /* @__PURE__ */ jsx(Badge, { ...props.badge || [], children: /* @__PURE__ */ jsx(formatter_camel_case_default, { value }) }, i);
138
78
  });
139
79
  }
140
80
  var badge_list_default = memo2(BadgeList);
141
81
 
142
82
  // src/components/pipeline-middleware-list.tsx
143
- import { Accordion, Badge as Badge2, Stack } from "@mantine/core";
144
- import { jsx as jsx3, jsxs } from "react/jsx-runtime";
83
+ import { jsx as jsx2, jsxs } from "react/jsx-runtime";
145
84
  function PipelineMiddlewareList(props) {
146
85
  let middleware = [];
147
86
  if (props.pipeline) {
@@ -151,56 +90,54 @@ function PipelineMiddlewareList(props) {
151
90
  return m.name || m.constructor.name;
152
91
  });
153
92
  return /* @__PURE__ */ jsxs(Accordion.Item, { value: props.label, children: [
154
- /* @__PURE__ */ jsx3(Accordion.Control, { children: /* @__PURE__ */ jsx3(Badge2, { fullWidth: true, variant: "light", rightSection: components.length, children: props.label }) }),
155
- /* @__PURE__ */ jsx3(Accordion.Panel, { children: /* @__PURE__ */ jsx3(Stack, { children: /* @__PURE__ */ jsx3(badge_list_default, { items: components, badge: { variant: "outline" } }) }) })
93
+ /* @__PURE__ */ jsx2(Accordion.Control, { children: /* @__PURE__ */ jsx2(Badge2, { fullWidth: true, variant: "light", rightSection: components.length, children: props.label }) }),
94
+ /* @__PURE__ */ jsx2(Accordion.Panel, { children: /* @__PURE__ */ jsx2(Stack, { children: /* @__PURE__ */ jsx2(badge_list_default, { items: components, badge: { variant: "outline" } }) }) })
156
95
  ] }, props.label);
157
96
  }
158
97
  var pipeline_middleware_list_default = PipelineMiddlewareList;
159
98
 
160
99
  // src/layout/systems-module-layout.tsx
161
- import { Fragment as Fragment2, jsx as jsx4, jsxs as jsxs2 } from "react/jsx-runtime";
100
+ import { Fragment, jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
162
101
  function SystemsModuleLayout(props) {
163
102
  const { module } = props;
164
103
  const runtimeContext = module["runtimeContext"];
165
- const systemContext = runtimeContext.systemContext;
166
- const { status } = useMemo3(() => {
104
+ const { systemContext } = runtimeContext;
105
+ const { status } = useMemo2(() => {
167
106
  return systemContext.runtime;
168
107
  }, [systemContext.runtime.status]);
169
108
  const init = runtimeContext.systemPipelines.get(SystemType.initialize);
170
109
  const update = runtimeContext.systemPipelines.get(SystemType.update);
171
110
  const render = runtimeContext.systemPipelines.get(SystemType.render);
172
111
  const sync = runtimeContext.systemPipelines.get(SystemType.sync);
173
- return /* @__PURE__ */ jsxs2(Fragment2, { children: [
112
+ return /* @__PURE__ */ jsxs2(Fragment, { children: [
174
113
  /* @__PURE__ */ jsxs2(Text, { children: [
175
114
  "Status: ",
176
115
  status
177
116
  ] }),
178
117
  /* @__PURE__ */ jsxs2(Accordion2, { children: [
179
- init && /* @__PURE__ */ jsx4(pipeline_middleware_list_default, { pipeline: init, label: "Initialize" }),
180
- update && /* @__PURE__ */ jsx4(pipeline_middleware_list_default, { pipeline: update, label: "Update" }),
181
- render && /* @__PURE__ */ jsx4(pipeline_middleware_list_default, { pipeline: render, label: "Render" }),
182
- sync && /* @__PURE__ */ jsx4(pipeline_middleware_list_default, { pipeline: sync, label: "Sync" })
118
+ init && /* @__PURE__ */ jsx3(pipeline_middleware_list_default, { pipeline: init, label: "Initialize" }),
119
+ update && /* @__PURE__ */ jsx3(pipeline_middleware_list_default, { pipeline: update, label: "Update" }),
120
+ render && /* @__PURE__ */ jsx3(pipeline_middleware_list_default, { pipeline: render, label: "Render" }),
121
+ sync && /* @__PURE__ */ jsx3(pipeline_middleware_list_default, { pipeline: sync, label: "Sync" })
183
122
  ] })
184
123
  ] });
185
124
  }
186
125
  var systems_module_layout_default = SystemsModuleLayout;
187
126
 
188
127
  // src/nodes/node-systems-module.tsx
189
- import { Badge as Badge3 } from "@mantine/core";
190
- import { jsx as jsx5 } from "react/jsx-runtime";
128
+ import { jsx as jsx4 } from "react/jsx-runtime";
191
129
  function SystemsModuleNode({ id, data, selected, type }) {
192
- const { systemsModuleRepository } = useContext2(EcsFlowContext);
130
+ const { systemsModuleRepository } = useContext(EcsFlowContext);
193
131
  const module = systemsModuleRepository.get(data.entityType);
194
- return /* @__PURE__ */ jsx5(
132
+ return /* @__PURE__ */ jsx4(
195
133
  NodeContainer,
196
134
  {
197
135
  id,
198
136
  selected,
199
- handles: data.handles,
200
- title: /* @__PURE__ */ jsx5(Badge3, { fullWidth: true, color: "indigo", variant: "transparent", children: /* @__PURE__ */ jsx5(formatter_camel_case_default, { value: data.entityType }) }),
201
- templateId: data.templateId,
137
+ data,
138
+ title: /* @__PURE__ */ jsx4(Badge3, { fullWidth: true, color: "indigo", variant: "transparent", children: /* @__PURE__ */ jsx4(formatter_camel_case_default, { value: data.entityType }) }),
202
139
  type,
203
- children: /* @__PURE__ */ jsx5(systems_module_layout_default, { type: data.entityType, module })
140
+ children: /* @__PURE__ */ jsx4(systems_module_layout_default, { type: data.entityType, module })
204
141
  }
205
142
  );
206
143
  }
@@ -209,7 +146,7 @@ var node_systems_module_default = SystemsModuleNode;
209
146
  // src/nodes/node-entity.tsx
210
147
  import { NodeContainer as NodeContainer2 } from "@awesome-flow/core/layout";
211
148
  import { Badge as Badge9 } from "@mantine/core";
212
- import { useContext as useContext5, useMemo as useMemo8 } from "react";
149
+ import { useContext as useContext4, useMemo as useMemo5 } from "react";
213
150
 
214
151
  // src/layout/entity-layout.tsx
215
152
  import { Accordion as Accordion6, Badge as Badge8, Divider, Group } from "@mantine/core";
@@ -220,43 +157,43 @@ import { memo as memo5 } from "react";
220
157
 
221
158
  // src/components/entity-component-inspector.tsx
222
159
  import { Box, Button, Collapse } from "@mantine/core";
223
- import { memo as memo4, useMemo as useMemo6 } from "react";
160
+ import { memo as memo4, useMemo as useMemo4 } from "react";
224
161
  import { useDisclosure } from "@mantine/hooks";
225
162
 
226
163
  // src/components/object-inspector.tsx
227
164
  import { useComputedColorScheme } from "@mantine/core";
228
- import { memo as memo3, useMemo as useMemo5 } from "react";
165
+ import { memo as memo3, useMemo as useMemo3 } from "react";
229
166
  import { Inspector } from "react-inspector";
230
- import { jsx as jsx6 } from "react/jsx-runtime";
167
+ import { jsx as jsx5 } from "react/jsx-runtime";
231
168
  function ObjectInspector(props) {
232
169
  const colorScheme = useComputedColorScheme();
233
- const theme = useMemo5(
170
+ const theme = useMemo3(
234
171
  () => colorScheme === "dark" ? "chromeDark" : "chromeLight",
235
172
  [colorScheme]
236
173
  );
237
- return /* @__PURE__ */ jsx6(Inspector, { table: false, theme, data: props.data });
174
+ return /* @__PURE__ */ jsx5(Inspector, { table: false, theme, data: props.data });
238
175
  }
239
176
  var object_inspector_default = memo3(ObjectInspector);
240
177
 
241
178
  // src/components/entity-component-inspector.tsx
242
- import { jsx as jsx7, jsxs as jsxs3 } from "react/jsx-runtime";
179
+ import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
243
180
  function EntityComponentInspector(props) {
244
181
  const [opened, { toggle }] = useDisclosure(false);
245
- const buttonColor = useMemo6(() => opened ? "light" : "indigo", [opened]);
182
+ const buttonColor = useMemo4(() => opened ? "light" : "indigo", [opened]);
246
183
  return /* @__PURE__ */ jsxs3(Box, { children: [
247
- /* @__PURE__ */ jsx7(Button, { variant: "outline", size: "xs", onClick: toggle, color: buttonColor, fullWidth: true, children: props.component.componentType }),
248
- /* @__PURE__ */ jsx7(Collapse, { in: opened, children: opened && /* @__PURE__ */ jsx7(object_inspector_default, { data: props.component }) })
184
+ /* @__PURE__ */ jsx6(Button, { variant: "outline", size: "xs", onClick: toggle, color: buttonColor, fullWidth: true, children: props.component.componentType }),
185
+ /* @__PURE__ */ jsx6(Collapse, { in: opened, children: opened && /* @__PURE__ */ jsx6(object_inspector_default, { data: props.component }) })
249
186
  ] });
250
187
  }
251
188
  var entity_component_inspector_default = memo4(EntityComponentInspector);
252
189
 
253
190
  // src/components/entity-component-list.tsx
254
- import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
191
+ import { jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
255
192
  function EntityComponentList(props) {
256
193
  const components = Array.from(props.entity.components.values());
257
194
  return /* @__PURE__ */ jsxs4(Accordion3.Item, { value: "components", children: [
258
- /* @__PURE__ */ jsx8(Accordion3.Control, { children: /* @__PURE__ */ jsx8(Badge4, { fullWidth: true, variant: "light", rightSection: components.length, children: "Components" }) }),
259
- /* @__PURE__ */ jsx8(Accordion3.Panel, { children: /* @__PURE__ */ jsx8(Stack2, { children: components.map((c, i) => /* @__PURE__ */ jsx8(entity_component_inspector_default, { component: c }, i)) }) })
195
+ /* @__PURE__ */ jsx7(Accordion3.Control, { children: /* @__PURE__ */ jsx7(Badge4, { fullWidth: true, variant: "light", rightSection: components.length, children: "Components" }) }),
196
+ /* @__PURE__ */ jsx7(Accordion3.Panel, { children: /* @__PURE__ */ jsx7(Stack2, { children: components.map((c, i) => /* @__PURE__ */ jsx7(entity_component_inspector_default, { component: c }, i)) }) })
260
197
  ] }, "components");
261
198
  }
262
199
  var entity_component_list_default = memo5(EntityComponentList);
@@ -264,41 +201,41 @@ var entity_component_list_default = memo5(EntityComponentList);
264
201
  // src/components/entity-proxy-list.tsx
265
202
  import { Accordion as Accordion4, Badge as Badge5, Stack as Stack3 } from "@mantine/core";
266
203
  import { memo as memo6 } from "react";
267
- import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
204
+ import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
268
205
  function EntityProxyList(props) {
269
206
  const proxies = Array.from(props.entity.proxies.values()).map((c) => c.values());
270
- const items = proxies.map((p) => Array.from(p).map((k) => IdGenerator.entityProxy(k))).flat();
207
+ const items = proxies.map((p) => Array.from(p).map((k) => EcsIdGenerator.entityProxy(k))).flat();
271
208
  return /* @__PURE__ */ jsxs5(Accordion4.Item, { value: "proxies", children: [
272
- /* @__PURE__ */ jsx9(Accordion4.Control, { children: /* @__PURE__ */ jsx9(Badge5, { fullWidth: true, variant: "light", rightSection: items.length, children: "Proxies" }) }),
273
- /* @__PURE__ */ jsx9(Accordion4.Panel, { children: /* @__PURE__ */ jsx9(Stack3, { children: /* @__PURE__ */ jsx9(badge_list_default, { items, badge: { variant: "outline" } }) }) })
209
+ /* @__PURE__ */ jsx8(Accordion4.Control, { children: /* @__PURE__ */ jsx8(Badge5, { fullWidth: true, variant: "light", rightSection: items.length, children: "Proxies" }) }),
210
+ /* @__PURE__ */ jsx8(Accordion4.Panel, { children: /* @__PURE__ */ jsx8(Stack3, { children: /* @__PURE__ */ jsx8(badge_list_default, { items, badge: { variant: "outline" } }) }) })
274
211
  ] }, "proxies");
275
212
  }
276
213
  var entity_proxy_list_default = memo6(EntityProxyList);
277
214
 
278
215
  // src/components/entity-subscription-list.tsx
279
216
  import { Accordion as Accordion5, Badge as Badge6, Stack as Stack4 } from "@mantine/core";
280
- import { memo as memo7, useContext as useContext3 } from "react";
281
- import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
217
+ import { memo as memo7, useContext as useContext2 } from "react";
218
+ import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
282
219
  function EntitySubscriptionList(props) {
283
- const { entityEventsManager } = useContext3(EcsFlowContext);
220
+ const { entityEventsManager } = useContext2(EcsFlowContext);
284
221
  const subscriptions = entityEventsManager.getSubscriptionsForEntity(props.entity.myProxy);
285
222
  return /* @__PURE__ */ jsxs6(Accordion5.Item, { value: "subscriptions", children: [
286
- /* @__PURE__ */ jsx10(Accordion5.Control, { children: /* @__PURE__ */ jsx10(Badge6, { fullWidth: true, variant: "light", rightSection: subscriptions.length, children: "Events" }) }),
287
- /* @__PURE__ */ jsx10(Accordion5.Panel, { children: /* @__PURE__ */ jsx10(Stack4, { children: /* @__PURE__ */ jsx10(badge_list_default, { items: subscriptions, badge: { variant: "outline" } }) }) })
223
+ /* @__PURE__ */ jsx9(Accordion5.Control, { children: /* @__PURE__ */ jsx9(Badge6, { fullWidth: true, variant: "light", rightSection: subscriptions.length, children: "Events" }) }),
224
+ /* @__PURE__ */ jsx9(Accordion5.Panel, { children: /* @__PURE__ */ jsx9(Stack4, { children: /* @__PURE__ */ jsx9(badge_list_default, { items: subscriptions, badge: { variant: "outline" } }) }) })
288
225
  ] }, "subscriptions");
289
226
  }
290
227
  var entity_subscription_list_default = memo7(EntitySubscriptionList);
291
228
 
292
229
  // src/components/entity-update-counter.tsx
293
230
  import { Badge as Badge7 } from "@mantine/core";
294
- import { memo as memo8, useContext as useContext4, useEffect as useEffect2, useState } from "react";
295
- import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
231
+ import { memo as memo8, useContext as useContext3, useEffect, useState } from "react";
232
+ import { Fragment as Fragment2, jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
296
233
  function EntityUpdateCounter(props) {
297
234
  const [, setRefresh] = useState(0);
298
- const { entityUpdateCounter } = useContext4(EcsFlowContext);
235
+ const { entityUpdateCounter } = useContext3(EcsFlowContext);
299
236
  const updates = entityUpdateCounter.getUpdateCount(props.entityUid) || 0;
300
237
  const removes = entityUpdateCounter.getRemoveCount(props.entityUid) || 0;
301
- useEffect2(() => {
238
+ useEffect(() => {
302
239
  const interval = setInterval(() => {
303
240
  setRefresh((refresh) => refresh + 1);
304
241
  }, 1e3);
@@ -307,52 +244,107 @@ function EntityUpdateCounter(props) {
307
244
  clearInterval(interval);
308
245
  };
309
246
  }, []);
310
- return /* @__PURE__ */ jsxs7(Fragment3, { children: [
311
- /* @__PURE__ */ jsx11(Badge7, { variant: "light", children: updates }),
312
- /* @__PURE__ */ jsx11(Badge7, { variant: "light", color: "orange", children: removes })
247
+ return /* @__PURE__ */ jsxs7(Fragment2, { children: [
248
+ /* @__PURE__ */ jsx10(Badge7, { variant: "light", children: updates }),
249
+ /* @__PURE__ */ jsx10(Badge7, { variant: "light", color: "orange", children: removes })
313
250
  ] });
314
251
  }
315
252
  var entity_update_counter_default = memo8(EntityUpdateCounter);
316
253
 
317
254
  // src/layout/entity-layout.tsx
318
- import { Fragment as Fragment4, jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
255
+ import { Fragment as Fragment3, jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
319
256
  function EntityLayout({ entity }) {
320
- return /* @__PURE__ */ jsxs8(Fragment4, { children: [
257
+ return /* @__PURE__ */ jsxs8(Fragment3, { children: [
321
258
  /* @__PURE__ */ jsxs8(Group, { children: [
322
- /* @__PURE__ */ jsx12(Badge8, { variant: "outline", color: "orange", children: entity.myProxy.entityUid }),
323
- /* @__PURE__ */ jsx12(entity_update_counter_default, { entityUid: entity.myProxy.entityUid })
259
+ /* @__PURE__ */ jsx11(Badge8, { variant: "outline", color: "orange", children: entity.myProxy.entityUid }),
260
+ /* @__PURE__ */ jsx11(entity_update_counter_default, { entityUid: entity.myProxy.entityUid })
324
261
  ] }),
325
- /* @__PURE__ */ jsx12(Divider, { my: 5 }),
262
+ /* @__PURE__ */ jsx11(Divider, { my: 5 }),
326
263
  /* @__PURE__ */ jsxs8(Accordion6, { children: [
327
- /* @__PURE__ */ jsx12(entity_component_list_default, { entity }),
328
- /* @__PURE__ */ jsx12(entity_proxy_list_default, { entity }),
329
- /* @__PURE__ */ jsx12(entity_subscription_list_default, { entity })
264
+ /* @__PURE__ */ jsx11(entity_component_list_default, { entity }),
265
+ /* @__PURE__ */ jsx11(entity_proxy_list_default, { entity }),
266
+ /* @__PURE__ */ jsx11(entity_subscription_list_default, { entity })
330
267
  ] })
331
268
  ] });
332
269
  }
333
270
  var entity_layout_default = EntityLayout;
334
271
 
335
272
  // src/nodes/node-entity.tsx
336
- import { jsx as jsx13 } from "react/jsx-runtime";
273
+ import { jsx as jsx12 } from "react/jsx-runtime";
337
274
  function EntityNode({ id, data, selected, type }) {
338
- const { entityRepository } = useContext5(EcsFlowContext);
339
- const entity = useMemo8(() => entityRepository.get(data.entity), [data.entity]);
340
- return /* @__PURE__ */ jsx13(
275
+ const { entityRepository } = useContext4(EcsFlowContext);
276
+ const entity = useMemo5(() => entityRepository.get(data.entity), [data.entity]);
277
+ return /* @__PURE__ */ jsx12(
341
278
  NodeContainer2,
342
279
  {
343
280
  id,
344
281
  selected,
345
- handles: data.handles,
346
- title: /* @__PURE__ */ jsx13(Badge9, { fullWidth: true, variant: "transparent", children: /* @__PURE__ */ jsx13(formatter_camel_case_default, { value: entity.myProxy.entityType }) }),
347
- templateId: data.templateId,
282
+ data,
283
+ title: /* @__PURE__ */ jsx12(Badge9, { fullWidth: true, variant: "transparent", children: /* @__PURE__ */ jsx12(formatter_camel_case_default, { value: entity.myProxy.entityType }) }),
348
284
  type,
349
- children: /* @__PURE__ */ jsx13(entity_layout_default, { entity })
285
+ children: /* @__PURE__ */ jsx12(entity_layout_default, { entity })
350
286
  }
351
287
  );
352
288
  }
353
289
  var node_entity_default = EntityNode;
354
290
 
355
- // src/node-types.ts
291
+ // src/templates/template-entity-node.ts
292
+ import { Position } from "@xyflow/react";
293
+
294
+ // src/abstract/templates.ts
295
+ var EcsTemplateGroup = /* @__PURE__ */ ((EcsTemplateGroup2) => {
296
+ EcsTemplateGroup2["ecs"] = "ECS";
297
+ return EcsTemplateGroup2;
298
+ })(EcsTemplateGroup || {});
299
+
300
+ // src/templates/template-entity-node.ts
301
+ var EntityNodeTemplate = class {
302
+ template = {
303
+ type: "entity-node" /* entity */,
304
+ group: "ECS" /* ecs */,
305
+ data: {
306
+ title: "Entity",
307
+ entity: null
308
+ },
309
+ handles: [
310
+ {
311
+ dataType: "proxy" /* proxy */,
312
+ position: Position.Left,
313
+ connection: "target",
314
+ disabled: true
315
+ },
316
+ {
317
+ dataType: "proxy" /* proxy */,
318
+ position: Position.Right,
319
+ connection: "source",
320
+ disabled: true
321
+ }
322
+ ]
323
+ };
324
+ };
325
+
326
+ // src/templates/template-systems-module.ts
327
+ import { Position as Position2 } from "@xyflow/react";
328
+ var SystemsModuleNodeTemplate = class {
329
+ template = {
330
+ type: "systems-module-node" /* systemsModule */,
331
+ group: "ECS" /* ecs */,
332
+ data: {
333
+ title: "Systems Module",
334
+ entityType: null
335
+ },
336
+ handles: [
337
+ {
338
+ dataType: "module" /* module */,
339
+ position: Position2.Left,
340
+ connection: "target",
341
+ disabled: true
342
+ }
343
+ ]
344
+ };
345
+ };
346
+
347
+ // src/abstract/node-types.ts
356
348
  var EcsNodeType = /* @__PURE__ */ ((EcsNodeType2) => {
357
349
  EcsNodeType2["systemsModule"] = "systems-module-node";
358
350
  EcsNodeType2["entity"] = "entity-node";
@@ -362,8 +354,77 @@ var ecsNodeTypes = {
362
354
  ["systems-module-node" /* systemsModule */]: node_systems_module_default,
363
355
  ["entity-node" /* entity */]: node_entity_default
364
356
  };
357
+ var ecsNodeTemplates = {
358
+ ["entity-node" /* entity */]: new EntityNodeTemplate(),
359
+ ["systems-module-node" /* systemsModule */]: new SystemsModuleNodeTemplate()
360
+ };
361
+
362
+ // src/flow/flow-ecs-state.tsx
363
+ import { useEffect as useEffect7, useContext as useContext10, useState as useState3 } from "react";
365
364
 
366
- // src/ecs/flow-ecs-edge-proxies.tsx
365
+ // src/flow/flow-ecs-auto-layout.tsx
366
+ import { FlowContext } from "@awesome-flow/core/abstract";
367
+ import Dagre from "@dagrejs/dagre";
368
+ import { useReactFlow } from "@xyflow/react";
369
+ import { useCallback, useContext as useContext5, useEffect as useEffect2, useMemo as useMemo6 } from "react";
370
+ import { Fragment as Fragment4, jsx as jsx13 } from "react/jsx-runtime";
371
+ function FlowEcsAutoLayout(props) {
372
+ const { getNodes, getEdges } = useReactFlow();
373
+ const context = useContext5(FlowContext);
374
+ const setNodes = context.useFlowStore((state) => state.setNodes);
375
+ const graph = useMemo6(() => new Dagre.graphlib.Graph().setDefaultEdgeLabel(() => ({})), []);
376
+ const getLayoutElements = useCallback(
377
+ (nodes, edges, options) => {
378
+ graph.setGraph(options);
379
+ edges.forEach((edge) => graph.setEdge(edge.source, edge.target));
380
+ nodes.forEach((node) => {
381
+ if (node.measured) {
382
+ graph.setNode(node.id, {
383
+ width: node.measured.width,
384
+ height: node.measured.height
385
+ });
386
+ }
387
+ });
388
+ Dagre.layout(graph);
389
+ return {
390
+ nodes: nodes.map((node) => {
391
+ const graphNode = graph.node(node.id);
392
+ if (graphNode) {
393
+ return { ...node, position: { x: graphNode.x, y: graphNode.y } };
394
+ }
395
+ return node;
396
+ }),
397
+ edges
398
+ };
399
+ },
400
+ [graph]
401
+ );
402
+ useEffect2(() => {
403
+ if (props.needsLayout) {
404
+ const storeNodes = getNodes();
405
+ if (storeNodes?.length) {
406
+ const edges = getEdges();
407
+ const layout = getLayoutElements(storeNodes, edges, {
408
+ rankdir: "LR"
409
+ });
410
+ setNodes(layout.nodes);
411
+ }
412
+ }
413
+ }, [props.needsLayout]);
414
+ useEffect2(() => {
415
+ if (props.needsLayout) {
416
+ props.setNeedsLayout(false);
417
+ }
418
+ });
419
+ return /* @__PURE__ */ jsx13(Fragment4, {});
420
+ }
421
+ var flow_ecs_auto_layout_default = FlowEcsAutoLayout;
422
+
423
+ // src/flow/flow-ecs-entities.tsx
424
+ import { FlowContext as FlowContext4 } from "@awesome-flow/core/abstract";
425
+ import { useContext as useContext8, useEffect as useEffect5, useState as useState2 } from "react";
426
+
427
+ // src/flow/flow-ecs-edge-proxies.tsx
367
428
  import { useContext as useContext6, useEffect as useEffect3 } from "react";
368
429
  import { FlowContext as FlowContext2 } from "@awesome-flow/core/abstract";
369
430
  import { Fragment as Fragment5, jsx as jsx14 } from "react/jsx-runtime";
@@ -396,7 +457,7 @@ function FlowEcsEdgeProxies(props) {
396
457
  }
397
458
  var flow_ecs_edge_proxies_default = FlowEcsEdgeProxies;
398
459
 
399
- // src/ecs/flow-ecs-edge-modules.tsx
460
+ // src/flow/flow-ecs-edge-modules.tsx
400
461
  import { useContext as useContext7, useEffect as useEffect4 } from "react";
401
462
  import { FlowContext as FlowContext3 } from "@awesome-flow/core/abstract";
402
463
  import { Fragment as Fragment6, jsx as jsx15 } from "react/jsx-runtime";
@@ -425,7 +486,7 @@ function FlowEcsEdgeModules(props) {
425
486
  }
426
487
  var flow_ecs_edge_modules_default = FlowEcsEdgeModules;
427
488
 
428
- // src/ecs/flow-ecs-entities.tsx
489
+ // src/flow/flow-ecs-entities.tsx
429
490
  import { Fragment as Fragment7, jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
430
491
  function FlowEcsEntities() {
431
492
  const context = useContext8(FlowContext4);
@@ -455,7 +516,7 @@ function FlowEcsEntities() {
455
516
  }
456
517
  var flow_ecs_entities_default = FlowEcsEntities;
457
518
 
458
- // src/ecs/flow-ecs-modules.tsx
519
+ // src/flow/flow-ecs-modules.tsx
459
520
  import { useEffect as useEffect6, useContext as useContext9 } from "react";
460
521
  import { FlowContext as FlowContext5 } from "@awesome-flow/core/abstract";
461
522
  import { Fragment as Fragment8, jsx as jsx17 } from "react/jsx-runtime";
@@ -487,7 +548,7 @@ function FlowEcsModules() {
487
548
  }
488
549
  var flow_ecs_modules_default = FlowEcsModules;
489
550
 
490
- // src/ecs/flow-ecs-state.tsx
551
+ // src/flow/flow-ecs-state.tsx
491
552
  import { Fragment as Fragment9, jsx as jsx18, jsxs as jsxs10 } from "react/jsx-runtime";
492
553
  function FlowEcsState(props) {
493
554
  const [, setUpdates] = useState3(0);
@@ -508,97 +569,18 @@ function FlowEcsState(props) {
508
569
  ] });
509
570
  }
510
571
  var flow_ecs_state_default = FlowEcsState;
511
-
512
- // src/templates/template-entity-node.ts
513
- import { IDGenerator } from "@awesome-flow/core/utils";
514
-
515
- // src/handle-types.ts
516
- var EcsHandleDataType = /* @__PURE__ */ ((EcsHandleDataType2) => {
517
- EcsHandleDataType2[EcsHandleDataType2["proxy"] = 1] = "proxy";
518
- EcsHandleDataType2[EcsHandleDataType2["module"] = 2] = "module";
519
- return EcsHandleDataType2;
520
- })(EcsHandleDataType || {});
521
-
522
- // src/templates/template-entity-node.ts
523
- import { Position } from "@xyflow/react";
524
- var EntityNodeTemplate = class {
525
- create() {
526
- const data = {
527
- title: "Entity",
528
- entity: null
529
- };
530
- return {
531
- id: IDGenerator.template(),
532
- removable: false,
533
- type: "entity-node" /* entity */,
534
- data,
535
- handles: [
536
- {
537
- dataType: 1 /* proxy */,
538
- position: Position.Left,
539
- connection: "target",
540
- disabled: true
541
- },
542
- {
543
- dataType: 1 /* proxy */,
544
- position: Position.Right,
545
- connection: "source",
546
- disabled: true
547
- }
548
- ]
549
- };
550
- }
551
- isHandleAllowed() {
552
- return false;
553
- }
554
- getHandleAllowedDataType() {
555
- return 1 /* proxy */;
556
- }
557
- };
558
-
559
- // src/templates/template-systems-module.ts
560
- import { IDGenerator as IDGenerator2 } from "@awesome-flow/core/utils";
561
- import { Position as Position2 } from "@xyflow/react";
562
- var SystemsModuleNodeTemplate = class {
563
- create() {
564
- const data = {
565
- title: "Systems Module",
566
- entityType: null,
567
- handles: null,
568
- templateId: null
569
- };
570
- return {
571
- id: IDGenerator2.template(),
572
- removable: false,
573
- type: "systems-module-node" /* systemsModule */,
574
- data,
575
- handles: [
576
- {
577
- dataType: 2 /* module */,
578
- position: Position2.Left,
579
- connection: "target",
580
- disabled: true
581
- }
582
- ]
583
- };
584
- }
585
- isHandleAllowed() {
586
- return false;
587
- }
588
- getHandleAllowedDataType() {
589
- return 2 /* module */;
590
- }
591
- };
592
572
  export {
593
573
  EcsFlowContext,
594
574
  EcsFlowRepository,
595
575
  EcsHandleDataType,
596
576
  EcsNodeType,
577
+ EcsTemplateGroup,
597
578
  node_entity_default as EntityNode,
598
579
  EntityNodeTemplate,
599
580
  flow_ecs_state_default as FlowEcsState,
600
581
  node_systems_module_default as SystemsModuleNode,
601
582
  SystemsModuleNodeTemplate,
583
+ ecsNodeTemplates,
602
584
  ecsNodeTypes
603
585
  };
604
586
  //# sourceMappingURL=index.js.map