@awesome-flow/ecs 0.3.0 → 0.5.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.
Files changed (7) hide show
  1. package/dist/index.cjs +214 -237
  2. package/dist/index.cjs.map +1 -1
  3. package/dist/index.d.cts +22 -21
  4. package/dist/index.d.ts +22 -21
  5. package/dist/index.js +192 -216
  6. package/dist/index.js.map +1 -1
  7. package/package.json +3 -3
package/dist/index.cjs CHANGED
@@ -33,6 +33,7 @@ __export(src_exports, {
33
33
  EcsFlowRepository: () => EcsFlowRepository,
34
34
  EcsHandleDataType: () => EcsHandleDataType,
35
35
  EcsNodeType: () => EcsNodeType,
36
+ EcsTemplateGroup: () => EcsTemplateGroup,
36
37
  EntityNode: () => node_entity_default,
37
38
  EntityNodeTemplate: () => EntityNodeTemplate,
38
39
  FlowEcsState: () => flow_ecs_state_default,
@@ -80,110 +81,52 @@ var EcsFlowRepository = class {
80
81
  }
81
82
  };
82
83
 
83
- // src/flow/flow-ecs-state.tsx
84
- var import_react21 = require("react");
85
-
86
- // src/flow/flow-ecs-auto-layout.tsx
87
- var import_abstract = require("@awesome-flow/core/abstract");
88
- var import_dagre = __toESM(require("@dagrejs/dagre"), 1);
89
- var import_react2 = require("@xyflow/react");
90
- var import_react3 = require("react");
91
- var import_jsx_runtime = require("react/jsx-runtime");
92
- function FlowEcsAutoLayout(props) {
93
- const { getNodes, getEdges } = (0, import_react2.useReactFlow)();
94
- const context = (0, import_react3.useContext)(import_abstract.FlowContext);
95
- const setNodes = context.useFlowStore((state) => state.setNodes);
96
- const graph = (0, import_react3.useMemo)(() => new import_dagre.default.graphlib.Graph().setDefaultEdgeLabel(() => ({})), []);
97
- const getLayoutElements = (0, import_react3.useCallback)(
98
- (nodes, edges, options) => {
99
- graph.setGraph(options);
100
- edges.forEach((edge) => graph.setEdge(edge.source, edge.target));
101
- nodes.forEach((node) => {
102
- if (node.measured) {
103
- graph.setNode(node.id, {
104
- width: node.measured.width,
105
- height: node.measured.height
106
- });
107
- }
108
- });
109
- import_dagre.default.layout(graph);
110
- return {
111
- nodes: nodes.map((node) => {
112
- const graphNode = graph.node(node.id);
113
- if (graphNode) {
114
- return { ...node, position: { x: graphNode.x, y: graphNode.y } };
115
- }
116
- return node;
117
- }),
118
- edges
119
- };
120
- },
121
- [graph]
122
- );
123
- (0, import_react3.useEffect)(() => {
124
- if (props.needsLayout) {
125
- const storeNodes = getNodes();
126
- if (storeNodes?.length) {
127
- const edges = getEdges();
128
- const layout = getLayoutElements(storeNodes, edges, {
129
- rankdir: "LR"
130
- });
131
- setNodes(layout.nodes);
132
- }
133
- }
134
- }, [props.needsLayout]);
135
- (0, import_react3.useEffect)(() => {
136
- if (props.needsLayout) {
137
- props.setNeedsLayout(false);
138
- }
139
- });
140
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, {});
141
- }
142
- var flow_ecs_auto_layout_default = FlowEcsAutoLayout;
143
-
144
- // src/flow/flow-ecs-entities.tsx
145
- var import_abstract4 = require("@awesome-flow/core/abstract");
146
- var import_react19 = require("react");
84
+ // src/abstract/handle-types.ts
85
+ var EcsHandleDataType = /* @__PURE__ */ ((EcsHandleDataType2) => {
86
+ EcsHandleDataType2["proxy"] = "proxy";
87
+ EcsHandleDataType2["module"] = "module";
88
+ return EcsHandleDataType2;
89
+ })(EcsHandleDataType || {});
147
90
 
148
91
  // src/nodes/node-systems-module.tsx
149
92
  var import_layout = require("@awesome-flow/core/layout");
150
- var import_react7 = require("react");
93
+ var import_react5 = require("react");
151
94
  var import_core4 = require("@mantine/core");
152
95
 
153
96
  // src/layout/systems-module-layout.tsx
154
97
  var import_systems = require("@awesome-ecs/abstract/systems");
155
98
  var import_core3 = require("@mantine/core");
156
- var import_react6 = require("react");
99
+ var import_react4 = require("react");
157
100
 
158
101
  // src/components/pipeline-middleware-list.tsx
159
102
  var import_core2 = require("@mantine/core");
160
103
 
161
104
  // src/components/badge-list.tsx
162
105
  var import_core = require("@mantine/core");
163
- var import_react5 = require("react");
106
+ var import_react3 = require("react");
164
107
 
165
108
  // src/components/formatter-camel-case.tsx
166
- var import_react4 = require("react");
109
+ var import_react2 = require("react");
167
110
  function CamelCaseFormatter(props) {
168
- const value = (0, import_react4.useMemo)(
111
+ const value = (0, import_react2.useMemo)(
169
112
  () => props.value?.toString().replace(/([a-z])([A-Z])/g, "$1 $2"),
170
113
  [props.value]
171
114
  );
172
115
  return value;
173
116
  }
174
- var formatter_camel_case_default = (0, import_react4.memo)(CamelCaseFormatter);
117
+ var formatter_camel_case_default = (0, import_react2.memo)(CamelCaseFormatter);
175
118
 
176
119
  // src/components/badge-list.tsx
177
- var import_jsx_runtime2 = require("react/jsx-runtime");
120
+ var import_jsx_runtime = require("react/jsx-runtime");
178
121
  function BadgeList(props) {
179
122
  return props.items.map((value, i) => {
180
- return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core.Badge, { ...props.badge || [], children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(formatter_camel_case_default, { value }) }, i);
123
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_core.Badge, { ...props.badge || [], children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(formatter_camel_case_default, { value }) }, i);
181
124
  });
182
125
  }
183
- var badge_list_default = (0, import_react5.memo)(BadgeList);
126
+ var badge_list_default = (0, import_react3.memo)(BadgeList);
184
127
 
185
128
  // src/components/pipeline-middleware-list.tsx
186
- var import_jsx_runtime3 = require("react/jsx-runtime");
129
+ var import_jsx_runtime2 = require("react/jsx-runtime");
187
130
  function PipelineMiddlewareList(props) {
188
131
  let middleware = [];
189
132
  if (props.pipeline) {
@@ -192,55 +135,55 @@ function PipelineMiddlewareList(props) {
192
135
  const components = middleware.map((m) => {
193
136
  return m.name || m.constructor.name;
194
137
  });
195
- return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core2.Accordion.Item, { value: props.label, children: [
196
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Badge, { fullWidth: true, variant: "light", rightSection: components.length, children: props.label }) }),
197
- /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_core2.Stack, { children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(badge_list_default, { items: components, badge: { variant: "outline" } }) }) })
138
+ return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_core2.Accordion.Item, { value: props.label, children: [
139
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Badge, { fullWidth: true, variant: "light", rightSection: components.length, children: props.label }) }),
140
+ /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_core2.Stack, { children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(badge_list_default, { items: components, badge: { variant: "outline" } }) }) })
198
141
  ] }, props.label);
199
142
  }
200
143
  var pipeline_middleware_list_default = PipelineMiddlewareList;
201
144
 
202
145
  // src/layout/systems-module-layout.tsx
203
- var import_jsx_runtime4 = require("react/jsx-runtime");
146
+ var import_jsx_runtime3 = require("react/jsx-runtime");
204
147
  function SystemsModuleLayout(props) {
205
148
  const { module: module2 } = props;
206
149
  const runtimeContext = module2["runtimeContext"];
207
150
  const { systemContext } = runtimeContext;
208
- const { status } = (0, import_react6.useMemo)(() => {
151
+ const { status } = (0, import_react4.useMemo)(() => {
209
152
  return systemContext.runtime;
210
153
  }, [systemContext.runtime.status]);
211
154
  const init = runtimeContext.systemPipelines.get(import_systems.SystemType.initialize);
212
155
  const update = runtimeContext.systemPipelines.get(import_systems.SystemType.update);
213
156
  const render = runtimeContext.systemPipelines.get(import_systems.SystemType.render);
214
157
  const sync = runtimeContext.systemPipelines.get(import_systems.SystemType.sync);
215
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
216
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core3.Text, { children: [
158
+ return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
159
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core3.Text, { children: [
217
160
  "Status: ",
218
161
  status
219
162
  ] }),
220
- /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_core3.Accordion, { children: [
221
- init && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(pipeline_middleware_list_default, { pipeline: init, label: "Initialize" }),
222
- update && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(pipeline_middleware_list_default, { pipeline: update, label: "Update" }),
223
- render && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(pipeline_middleware_list_default, { pipeline: render, label: "Render" }),
224
- sync && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(pipeline_middleware_list_default, { pipeline: sync, label: "Sync" })
163
+ /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_core3.Accordion, { children: [
164
+ init && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(pipeline_middleware_list_default, { pipeline: init, label: "Initialize" }),
165
+ update && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(pipeline_middleware_list_default, { pipeline: update, label: "Update" }),
166
+ render && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(pipeline_middleware_list_default, { pipeline: render, label: "Render" }),
167
+ sync && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(pipeline_middleware_list_default, { pipeline: sync, label: "Sync" })
225
168
  ] })
226
169
  ] });
227
170
  }
228
171
  var systems_module_layout_default = SystemsModuleLayout;
229
172
 
230
173
  // src/nodes/node-systems-module.tsx
231
- var import_jsx_runtime5 = require("react/jsx-runtime");
174
+ var import_jsx_runtime4 = require("react/jsx-runtime");
232
175
  function SystemsModuleNode({ id, data, selected, type }) {
233
- const { systemsModuleRepository } = (0, import_react7.useContext)(EcsFlowContext);
176
+ const { systemsModuleRepository } = (0, import_react5.useContext)(EcsFlowContext);
234
177
  const module2 = systemsModuleRepository.get(data.entityType);
235
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
178
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
236
179
  import_layout.NodeContainer,
237
180
  {
238
181
  id,
239
182
  selected,
240
183
  data,
241
- title: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_core4.Badge, { fullWidth: true, color: "indigo", variant: "transparent", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(formatter_camel_case_default, { value: data.entityType }) }),
184
+ title: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_core4.Badge, { fullWidth: true, color: "indigo", variant: "transparent", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(formatter_camel_case_default, { value: data.entityType }) }),
242
185
  type,
243
- children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(systems_module_layout_default, { type: data.entityType, module: module2 })
186
+ children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(systems_module_layout_default, { type: data.entityType, module: module2 })
244
187
  }
245
188
  );
246
189
  }
@@ -249,96 +192,96 @@ var node_systems_module_default = SystemsModuleNode;
249
192
  // src/nodes/node-entity.tsx
250
193
  var import_layout2 = require("@awesome-flow/core/layout");
251
194
  var import_core12 = require("@mantine/core");
252
- var import_react14 = require("react");
195
+ var import_react12 = require("react");
253
196
 
254
197
  // src/layout/entity-layout.tsx
255
198
  var import_core11 = require("@mantine/core");
256
199
 
257
200
  // src/components/entity-component-list.tsx
258
201
  var import_core7 = require("@mantine/core");
259
- var import_react10 = require("react");
202
+ var import_react8 = require("react");
260
203
 
261
204
  // src/components/entity-component-inspector.tsx
262
205
  var import_core6 = require("@mantine/core");
263
- var import_react9 = require("react");
206
+ var import_react7 = require("react");
264
207
  var import_hooks = require("@mantine/hooks");
265
208
 
266
209
  // src/components/object-inspector.tsx
267
210
  var import_core5 = require("@mantine/core");
268
- var import_react8 = require("react");
211
+ var import_react6 = require("react");
269
212
  var import_react_inspector = require("react-inspector");
270
- var import_jsx_runtime6 = require("react/jsx-runtime");
213
+ var import_jsx_runtime5 = require("react/jsx-runtime");
271
214
  function ObjectInspector(props) {
272
215
  const colorScheme = (0, import_core5.useComputedColorScheme)();
273
- const theme = (0, import_react8.useMemo)(
216
+ const theme = (0, import_react6.useMemo)(
274
217
  () => colorScheme === "dark" ? "chromeDark" : "chromeLight",
275
218
  [colorScheme]
276
219
  );
277
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react_inspector.Inspector, { table: false, theme, data: props.data });
220
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react_inspector.Inspector, { table: false, theme, data: props.data });
278
221
  }
279
- var object_inspector_default = (0, import_react8.memo)(ObjectInspector);
222
+ var object_inspector_default = (0, import_react6.memo)(ObjectInspector);
280
223
 
281
224
  // src/components/entity-component-inspector.tsx
282
- var import_jsx_runtime7 = require("react/jsx-runtime");
225
+ var import_jsx_runtime6 = require("react/jsx-runtime");
283
226
  function EntityComponentInspector(props) {
284
227
  const [opened, { toggle }] = (0, import_hooks.useDisclosure)(false);
285
- const buttonColor = (0, import_react9.useMemo)(() => opened ? "light" : "indigo", [opened]);
286
- return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core6.Box, { children: [
287
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core6.Button, { variant: "outline", size: "xs", onClick: toggle, color: buttonColor, fullWidth: true, children: props.component.componentType }),
288
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core6.Collapse, { in: opened, children: opened && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(object_inspector_default, { data: props.component }) })
228
+ const buttonColor = (0, import_react7.useMemo)(() => opened ? "light" : "indigo", [opened]);
229
+ return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(import_core6.Box, { children: [
230
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Button, { variant: "outline", size: "xs", onClick: toggle, color: buttonColor, fullWidth: true, children: props.component.componentType }),
231
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_core6.Collapse, { in: opened, children: opened && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(object_inspector_default, { data: props.component }) })
289
232
  ] });
290
233
  }
291
- var entity_component_inspector_default = (0, import_react9.memo)(EntityComponentInspector);
234
+ var entity_component_inspector_default = (0, import_react7.memo)(EntityComponentInspector);
292
235
 
293
236
  // src/components/entity-component-list.tsx
294
- var import_jsx_runtime8 = require("react/jsx-runtime");
237
+ var import_jsx_runtime7 = require("react/jsx-runtime");
295
238
  function EntityComponentList(props) {
296
239
  const components = Array.from(props.entity.components.values());
297
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core7.Accordion.Item, { value: "components", children: [
298
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core7.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core7.Badge, { fullWidth: true, variant: "light", rightSection: components.length, children: "Components" }) }),
299
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core7.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core7.Stack, { children: components.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(entity_component_inspector_default, { component: c }, i)) }) })
240
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(import_core7.Accordion.Item, { value: "components", children: [
241
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Badge, { fullWidth: true, variant: "light", rightSection: components.length, children: "Components" }) }),
242
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_core7.Stack, { children: components.map((c, i) => /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(entity_component_inspector_default, { component: c }, i)) }) })
300
243
  ] }, "components");
301
244
  }
302
- var entity_component_list_default = (0, import_react10.memo)(EntityComponentList);
245
+ var entity_component_list_default = (0, import_react8.memo)(EntityComponentList);
303
246
 
304
247
  // src/components/entity-proxy-list.tsx
305
248
  var import_core8 = require("@mantine/core");
306
- var import_react11 = require("react");
307
- var import_jsx_runtime9 = require("react/jsx-runtime");
249
+ var import_react9 = require("react");
250
+ var import_jsx_runtime8 = require("react/jsx-runtime");
308
251
  function EntityProxyList(props) {
309
252
  const proxies = Array.from(props.entity.proxies.values()).map((c) => c.values());
310
253
  const items = proxies.map((p) => Array.from(p).map((k) => EcsIdGenerator.entityProxy(k))).flat();
311
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core8.Accordion.Item, { value: "proxies", children: [
312
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Badge, { fullWidth: true, variant: "light", rightSection: items.length, children: "Proxies" }) }),
313
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core8.Stack, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(badge_list_default, { items, badge: { variant: "outline" } }) }) })
254
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_core8.Accordion.Item, { value: "proxies", children: [
255
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Badge, { fullWidth: true, variant: "light", rightSection: items.length, children: "Proxies" }) }),
256
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_core8.Stack, { children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(badge_list_default, { items, badge: { variant: "outline" } }) }) })
314
257
  ] }, "proxies");
315
258
  }
316
- var entity_proxy_list_default = (0, import_react11.memo)(EntityProxyList);
259
+ var entity_proxy_list_default = (0, import_react9.memo)(EntityProxyList);
317
260
 
318
261
  // src/components/entity-subscription-list.tsx
319
262
  var import_core9 = require("@mantine/core");
320
- var import_react12 = require("react");
321
- var import_jsx_runtime10 = require("react/jsx-runtime");
263
+ var import_react10 = require("react");
264
+ var import_jsx_runtime9 = require("react/jsx-runtime");
322
265
  function EntitySubscriptionList(props) {
323
- const { entityEventsManager } = (0, import_react12.useContext)(EcsFlowContext);
266
+ const { entityEventsManager } = (0, import_react10.useContext)(EcsFlowContext);
324
267
  const subscriptions = entityEventsManager.getSubscriptionsForEntity(props.entity.myProxy);
325
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_core9.Accordion.Item, { value: "subscriptions", children: [
326
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Badge, { fullWidth: true, variant: "light", rightSection: subscriptions.length, children: "Events" }) }),
327
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core9.Stack, { children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(badge_list_default, { items: subscriptions, badge: { variant: "outline" } }) }) })
268
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_core9.Accordion.Item, { value: "subscriptions", children: [
269
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Accordion.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Badge, { fullWidth: true, variant: "light", rightSection: subscriptions.length, children: "Events" }) }),
270
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Accordion.Panel, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_core9.Stack, { children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(badge_list_default, { items: subscriptions, badge: { variant: "outline" } }) }) })
328
271
  ] }, "subscriptions");
329
272
  }
330
- var entity_subscription_list_default = (0, import_react12.memo)(EntitySubscriptionList);
273
+ var entity_subscription_list_default = (0, import_react10.memo)(EntitySubscriptionList);
331
274
 
332
275
  // src/components/entity-update-counter.tsx
333
276
  var import_core10 = require("@mantine/core");
334
- var import_react13 = require("react");
335
- var import_jsx_runtime11 = require("react/jsx-runtime");
277
+ var import_react11 = require("react");
278
+ var import_jsx_runtime10 = require("react/jsx-runtime");
336
279
  function EntityUpdateCounter(props) {
337
- const [, setRefresh] = (0, import_react13.useState)(0);
338
- const { entityUpdateCounter } = (0, import_react13.useContext)(EcsFlowContext);
280
+ const [, setRefresh] = (0, import_react11.useState)(0);
281
+ const { entityUpdateCounter } = (0, import_react11.useContext)(EcsFlowContext);
339
282
  const updates = entityUpdateCounter.getUpdateCount(props.entityUid) || 0;
340
283
  const removes = entityUpdateCounter.getRemoveCount(props.entityUid) || 0;
341
- (0, import_react13.useEffect)(() => {
284
+ (0, import_react11.useEffect)(() => {
342
285
  const interval = setInterval(() => {
343
286
  setRefresh((refresh) => refresh + 1);
344
287
  }, 1e3);
@@ -347,129 +290,104 @@ function EntityUpdateCounter(props) {
347
290
  clearInterval(interval);
348
291
  };
349
292
  }, []);
350
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
351
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Badge, { variant: "light", children: updates }),
352
- /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core10.Badge, { variant: "light", color: "orange", children: removes })
293
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(import_jsx_runtime10.Fragment, { children: [
294
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core10.Badge, { variant: "light", children: updates }),
295
+ /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_core10.Badge, { variant: "light", color: "orange", children: removes })
353
296
  ] });
354
297
  }
355
- var entity_update_counter_default = (0, import_react13.memo)(EntityUpdateCounter);
298
+ var entity_update_counter_default = (0, import_react11.memo)(EntityUpdateCounter);
356
299
 
357
300
  // src/layout/entity-layout.tsx
358
- var import_jsx_runtime12 = require("react/jsx-runtime");
301
+ var import_jsx_runtime11 = require("react/jsx-runtime");
359
302
  function EntityLayout({ entity }) {
360
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_jsx_runtime12.Fragment, { children: [
361
- /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Group, { children: [
362
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Badge, { variant: "outline", color: "orange", children: entity.myProxy.entityUid }),
363
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(entity_update_counter_default, { entityUid: entity.myProxy.entityUid })
303
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_jsx_runtime11.Fragment, { children: [
304
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core11.Group, { children: [
305
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core11.Badge, { variant: "outline", color: "orange", children: entity.myProxy.entityUid }),
306
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(entity_update_counter_default, { entityUid: entity.myProxy.entityUid })
364
307
  ] }),
365
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core11.Divider, { my: 5 }),
366
- /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_core11.Accordion, { children: [
367
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(entity_component_list_default, { entity }),
368
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(entity_proxy_list_default, { entity }),
369
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(entity_subscription_list_default, { entity })
308
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_core11.Divider, { my: 5 }),
309
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(import_core11.Accordion, { children: [
310
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(entity_component_list_default, { entity }),
311
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(entity_proxy_list_default, { entity }),
312
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(entity_subscription_list_default, { entity })
370
313
  ] })
371
314
  ] });
372
315
  }
373
316
  var entity_layout_default = EntityLayout;
374
317
 
375
318
  // src/nodes/node-entity.tsx
376
- var import_jsx_runtime13 = require("react/jsx-runtime");
319
+ var import_jsx_runtime12 = require("react/jsx-runtime");
377
320
  function EntityNode({ id, data, selected, type }) {
378
- const { entityRepository } = (0, import_react14.useContext)(EcsFlowContext);
379
- const entity = (0, import_react14.useMemo)(() => entityRepository.get(data.entity), [data.entity]);
380
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
321
+ const { entityRepository } = (0, import_react12.useContext)(EcsFlowContext);
322
+ const entity = (0, import_react12.useMemo)(() => entityRepository.get(data.entity), [data.entity]);
323
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
381
324
  import_layout2.NodeContainer,
382
325
  {
383
326
  id,
384
327
  selected,
385
328
  data,
386
- title: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_core12.Badge, { fullWidth: true, variant: "transparent", children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(formatter_camel_case_default, { value: entity.myProxy.entityType }) }),
329
+ title: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_core12.Badge, { fullWidth: true, variant: "transparent", children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(formatter_camel_case_default, { value: entity.myProxy.entityType }) }),
387
330
  type,
388
- children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(entity_layout_default, { entity })
331
+ children: /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(entity_layout_default, { entity })
389
332
  }
390
333
  );
391
334
  }
392
335
  var node_entity_default = EntityNode;
393
336
 
394
337
  // src/templates/template-entity-node.ts
395
- var import_utils = require("@awesome-flow/core/utils");
396
- var import_react15 = require("@xyflow/react");
338
+ var import_react13 = require("@xyflow/react");
397
339
 
398
- // src/abstract/handle-types.ts
399
- var EcsHandleDataType = /* @__PURE__ */ ((EcsHandleDataType2) => {
400
- EcsHandleDataType2[EcsHandleDataType2["proxy"] = 1] = "proxy";
401
- EcsHandleDataType2[EcsHandleDataType2["module"] = 2] = "module";
402
- return EcsHandleDataType2;
403
- })(EcsHandleDataType || {});
340
+ // src/abstract/templates.ts
341
+ var EcsTemplateGroup = /* @__PURE__ */ ((EcsTemplateGroup2) => {
342
+ EcsTemplateGroup2["ecs"] = "ECS";
343
+ return EcsTemplateGroup2;
344
+ })(EcsTemplateGroup || {});
404
345
 
405
346
  // src/templates/template-entity-node.ts
406
347
  var EntityNodeTemplate = class {
407
- create() {
408
- const data = {
348
+ template = {
349
+ type: "entity-node" /* entity */,
350
+ group: "ECS" /* ecs */,
351
+ data: {
409
352
  title: "Entity",
410
353
  entity: null
411
- };
412
- return {
413
- id: import_utils.IDGenerator.template(),
414
- removable: false,
415
- type: "entity-node" /* entity */,
416
- data,
417
- handles: [
418
- {
419
- dataType: 1 /* proxy */,
420
- position: import_react15.Position.Left,
421
- connection: "target",
422
- disabled: true
423
- },
424
- {
425
- dataType: 1 /* proxy */,
426
- position: import_react15.Position.Right,
427
- connection: "source",
428
- disabled: true
429
- }
430
- ]
431
- };
432
- }
433
- isHandleAllowed() {
434
- return false;
435
- }
436
- getHandleAllowedDataType() {
437
- return 1 /* proxy */;
438
- }
354
+ },
355
+ handles: [
356
+ {
357
+ dataType: "proxy" /* proxy */,
358
+ position: import_react13.Position.Left,
359
+ connection: "target",
360
+ disabled: true
361
+ },
362
+ {
363
+ dataType: "proxy" /* proxy */,
364
+ position: import_react13.Position.Right,
365
+ connection: "source",
366
+ disabled: true
367
+ }
368
+ ]
369
+ };
439
370
  };
440
371
 
441
372
  // src/templates/template-systems-module.ts
442
- var import_utils2 = require("@awesome-flow/core/utils");
443
- var import_react16 = require("@xyflow/react");
373
+ var import_react14 = require("@xyflow/react");
444
374
  var SystemsModuleNodeTemplate = class {
445
- create() {
446
- const data = {
375
+ template = {
376
+ type: "systems-module-node" /* systemsModule */,
377
+ group: "ECS" /* ecs */,
378
+ data: {
447
379
  title: "Systems Module",
448
- entityType: null,
449
- handles: null,
450
- templateId: null
451
- };
452
- return {
453
- id: import_utils2.IDGenerator.template(),
454
- removable: false,
455
- type: "systems-module-node" /* systemsModule */,
456
- data,
457
- handles: [
458
- {
459
- dataType: 2 /* module */,
460
- position: import_react16.Position.Left,
461
- connection: "target",
462
- disabled: true
463
- }
464
- ]
465
- };
466
- }
467
- isHandleAllowed() {
468
- return false;
469
- }
470
- getHandleAllowedDataType() {
471
- return 2 /* module */;
472
- }
380
+ entityType: null
381
+ },
382
+ handles: [
383
+ {
384
+ dataType: "module" /* module */,
385
+ position: import_react14.Position.Left,
386
+ connection: "target",
387
+ disabled: true
388
+ }
389
+ ]
390
+ };
473
391
  };
474
392
 
475
393
  // src/abstract/node-types.ts
@@ -487,14 +405,79 @@ var ecsNodeTemplates = {
487
405
  ["systems-module-node" /* systemsModule */]: new SystemsModuleNodeTemplate()
488
406
  };
489
407
 
408
+ // src/flow/flow-ecs-state.tsx
409
+ var import_react21 = require("react");
410
+
411
+ // src/flow/flow-ecs-auto-layout.tsx
412
+ var import_hooks2 = require("@awesome-flow/core/hooks");
413
+ var import_dagre = __toESM(require("@dagrejs/dagre"), 1);
414
+ var import_react15 = require("@xyflow/react");
415
+ var import_react16 = require("react");
416
+ var import_jsx_runtime13 = require("react/jsx-runtime");
417
+ function FlowEcsAutoLayout() {
418
+ const [needsLayout, setNeedsLayout] = (0, import_react16.useState)(false);
419
+ const { ecsFlowRepository } = (0, import_react16.useContext)(EcsFlowContext);
420
+ (0, import_react16.useEffect)(() => {
421
+ setNeedsLayout(true);
422
+ }, [ecsFlowRepository.sizeNodes]);
423
+ const { getNodes, getEdges } = (0, import_react15.useReactFlow)();
424
+ const setNodes = (0, import_hooks2.useFlowStore)((state) => state.setNodes);
425
+ const graph = (0, import_react16.useMemo)(() => new import_dagre.default.graphlib.Graph().setDefaultEdgeLabel(() => ({})), []);
426
+ const getLayoutElements = (0, import_react16.useCallback)(
427
+ (nodes, edges, options) => {
428
+ graph.setGraph(options);
429
+ edges.forEach((edge) => graph.setEdge(edge.source, edge.target));
430
+ nodes.forEach((node) => {
431
+ if (node.measured) {
432
+ graph.setNode(node.id, {
433
+ width: node.measured.width,
434
+ height: node.measured.height
435
+ });
436
+ }
437
+ });
438
+ import_dagre.default.layout(graph);
439
+ return {
440
+ nodes: nodes.map((node) => {
441
+ const graphNode = graph.node(node.id);
442
+ if (graphNode) {
443
+ return { ...node, position: { x: graphNode.x, y: graphNode.y } };
444
+ }
445
+ return node;
446
+ }),
447
+ edges
448
+ };
449
+ },
450
+ [graph]
451
+ );
452
+ (0, import_react16.useEffect)(() => {
453
+ if (needsLayout) {
454
+ const storeNodes = getNodes();
455
+ if (storeNodes?.length && !storeNodes.some((n) => !n.measured?.width || !n.measured?.height)) {
456
+ const edges = getEdges();
457
+ const layout = getLayoutElements(storeNodes, edges, {
458
+ rankdir: "LR"
459
+ });
460
+ setNodes(layout.nodes);
461
+ setNeedsLayout(false);
462
+ }
463
+ }
464
+ });
465
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_jsx_runtime13.Fragment, {});
466
+ }
467
+ var flow_ecs_auto_layout_default = FlowEcsAutoLayout;
468
+
469
+ // src/flow/flow-ecs-entities.tsx
470
+ var import_abstract = require("@awesome-flow/core/abstract");
471
+ var import_react19 = require("react");
472
+ var import_hooks5 = require("@awesome-flow/core/hooks");
473
+
490
474
  // src/flow/flow-ecs-edge-proxies.tsx
491
475
  var import_react17 = require("react");
492
- var import_abstract2 = require("@awesome-flow/core/abstract");
476
+ var import_hooks3 = require("@awesome-flow/core/hooks");
493
477
  var import_jsx_runtime14 = require("react/jsx-runtime");
494
478
  function FlowEcsEdgeProxies(props) {
495
479
  const { nodesToConnect } = props;
496
- const context = (0, import_react17.useContext)(import_abstract2.FlowContext);
497
- const onConnect = context.useFlowStore((state) => state.onConnect);
480
+ const onConnect = (0, import_hooks3.useFlowStore)((state) => state.onConnect);
498
481
  const { ecsFlowRepository, entityRepository } = (0, import_react17.useContext)(EcsFlowContext);
499
482
  (0, import_react17.useEffect)(() => {
500
483
  for (const node of nodesToConnect) {
@@ -522,12 +505,11 @@ var flow_ecs_edge_proxies_default = FlowEcsEdgeProxies;
522
505
 
523
506
  // src/flow/flow-ecs-edge-modules.tsx
524
507
  var import_react18 = require("react");
525
- var import_abstract3 = require("@awesome-flow/core/abstract");
508
+ var import_hooks4 = require("@awesome-flow/core/hooks");
526
509
  var import_jsx_runtime15 = require("react/jsx-runtime");
527
510
  function FlowEcsEdgeModules(props) {
528
511
  const { nodesToConnect } = props;
529
- const context = (0, import_react18.useContext)(import_abstract3.FlowContext);
530
- const onConnect = context.useFlowStore((state) => state.onConnect);
512
+ const onConnect = (0, import_hooks4.useFlowStore)((state) => state.onConnect);
531
513
  const { ecsFlowRepository, entityRepository } = (0, import_react18.useContext)(EcsFlowContext);
532
514
  (0, import_react18.useEffect)(() => {
533
515
  for (const node of nodesToConnect) {
@@ -552,8 +534,8 @@ var flow_ecs_edge_modules_default = FlowEcsEdgeModules;
552
534
  // src/flow/flow-ecs-entities.tsx
553
535
  var import_jsx_runtime16 = require("react/jsx-runtime");
554
536
  function FlowEcsEntities() {
555
- const context = (0, import_react19.useContext)(import_abstract4.FlowContext);
556
- const addNodes = context.useFlowStore((state) => state.addNodes);
537
+ const { nodeFactory } = (0, import_react19.useContext)(import_abstract.FlowContext);
538
+ const addNodes = (0, import_hooks5.useFlowStore)((state) => state.addNodes);
557
539
  const { ecsFlowRepository, entityRepository } = (0, import_react19.useContext)(EcsFlowContext);
558
540
  const [entityNodes, setEntityNodes] = (0, import_react19.useState)([]);
559
541
  (0, import_react19.useEffect)(() => {
@@ -563,7 +545,7 @@ function FlowEcsEntities() {
563
545
  if (ecsFlowRepository.getEntityNode(entity.myProxy)) {
564
546
  continue;
565
547
  }
566
- const node = context.nodeFactory.createNodeFromType("entity-node" /* entity */);
548
+ const node = nodeFactory.createNodeFromType("entity-node" /* entity */);
567
549
  node.data.entity = entity.myProxy;
568
550
  node.position = { x: 0, y: 0 };
569
551
  ecsFlowRepository.addEntityNode(node);
@@ -581,11 +563,12 @@ var flow_ecs_entities_default = FlowEcsEntities;
581
563
 
582
564
  // src/flow/flow-ecs-modules.tsx
583
565
  var import_react20 = require("react");
584
- var import_abstract5 = require("@awesome-flow/core/abstract");
566
+ var import_abstract2 = require("@awesome-flow/core/abstract");
567
+ var import_hooks6 = require("@awesome-flow/core/hooks");
585
568
  var import_jsx_runtime17 = require("react/jsx-runtime");
586
569
  function FlowEcsModules() {
587
- const context = (0, import_react20.useContext)(import_abstract5.FlowContext);
588
- const addNodes = context.useFlowStore((state) => state.addNodes);
570
+ const { nodeFactory } = (0, import_react20.useContext)(import_abstract2.FlowContext);
571
+ const addNodes = (0, import_hooks6.useFlowStore)((state) => state.addNodes);
589
572
  const { ecsFlowRepository, systemsModuleRepository } = (0, import_react20.useContext)(EcsFlowContext);
590
573
  (0, import_react20.useEffect)(() => {
591
574
  const modules = Array.from(systemsModuleRepository.list()).filter((m) => !!m);
@@ -595,9 +578,7 @@ function FlowEcsModules() {
595
578
  if (ecsFlowRepository.getSystemModuleNode(element)) {
596
579
  continue;
597
580
  }
598
- const node = context.nodeFactory.createNodeFromType(
599
- "systems-module-node" /* systemsModule */
600
- );
581
+ const node = nodeFactory.createNodeFromType("systems-module-node" /* systemsModule */);
601
582
  node.data.entityType = element;
602
583
  node.position = { x: 0, y: 0 };
603
584
  ecsFlowRepository.addSystemModuleNode(node);
@@ -615,11 +596,6 @@ var flow_ecs_modules_default = FlowEcsModules;
615
596
  var import_jsx_runtime18 = require("react/jsx-runtime");
616
597
  function FlowEcsState(props) {
617
598
  const [, setUpdates] = (0, import_react21.useState)(0);
618
- const [needsLayout, setNeedsLayout] = (0, import_react21.useState)(false);
619
- const { ecsFlowRepository } = (0, import_react21.useContext)(EcsFlowContext);
620
- (0, import_react21.useEffect)(() => {
621
- setNeedsLayout(true);
622
- }, [ecsFlowRepository.sizeNodes]);
623
599
  (0, import_react21.useEffect)(() => {
624
600
  setInterval(() => {
625
601
  setUpdates((updates) => updates + 1);
@@ -628,16 +604,17 @@ function FlowEcsState(props) {
628
604
  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(import_jsx_runtime18.Fragment, { children: [
629
605
  props.showSystemModules && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(flow_ecs_modules_default, {}),
630
606
  props.showEntities && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(flow_ecs_entities_default, {}),
631
- props.autoLayout && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(flow_ecs_auto_layout_default, { needsLayout, setNeedsLayout })
607
+ props.autoLayout && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(flow_ecs_auto_layout_default, {})
632
608
  ] });
633
609
  }
634
- var flow_ecs_state_default = FlowEcsState;
610
+ var flow_ecs_state_default = (0, import_react21.memo)(FlowEcsState);
635
611
  // Annotate the CommonJS export names for ESM import in node:
636
612
  0 && (module.exports = {
637
613
  EcsFlowContext,
638
614
  EcsFlowRepository,
639
615
  EcsHandleDataType,
640
616
  EcsNodeType,
617
+ EcsTemplateGroup,
641
618
  EntityNode,
642
619
  EntityNodeTemplate,
643
620
  FlowEcsState,