@almadar/std 1.0.0 → 1.0.1

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 (40) hide show
  1. package/dist/behaviors/async.d.ts +8 -8
  2. package/dist/behaviors/async.js +548 -500
  3. package/dist/behaviors/async.js.map +1 -1
  4. package/dist/behaviors/data-management.d.ts +11 -19
  5. package/dist/behaviors/data-management.js +468 -449
  6. package/dist/behaviors/data-management.js.map +1 -1
  7. package/dist/behaviors/feedback.d.ts +6 -6
  8. package/dist/behaviors/feedback.js +312 -278
  9. package/dist/behaviors/feedback.js.map +1 -1
  10. package/dist/behaviors/game-core.d.ts +11 -12
  11. package/dist/behaviors/game-core.js +357 -406
  12. package/dist/behaviors/game-core.js.map +1 -1
  13. package/dist/behaviors/game-entity.d.ts +13 -14
  14. package/dist/behaviors/game-entity.js +622 -592
  15. package/dist/behaviors/game-entity.js.map +1 -1
  16. package/dist/behaviors/game-ui.d.ts +9 -10
  17. package/dist/behaviors/game-ui.js +522 -459
  18. package/dist/behaviors/game-ui.js.map +1 -1
  19. package/dist/behaviors/index.d.ts +3 -3
  20. package/dist/behaviors/index.js +3876 -3843
  21. package/dist/behaviors/index.js.map +1 -1
  22. package/dist/behaviors/registry.d.ts +14 -24
  23. package/dist/behaviors/registry.js +3868 -3803
  24. package/dist/behaviors/registry.js.map +1 -1
  25. package/dist/behaviors/types.d.ts +14 -138
  26. package/dist/behaviors/types.js +10 -47
  27. package/dist/behaviors/types.js.map +1 -1
  28. package/dist/behaviors/ui-interaction.d.ts +13 -20
  29. package/dist/behaviors/ui-interaction.js +961 -1043
  30. package/dist/behaviors/ui-interaction.js.map +1 -1
  31. package/dist/index.d.ts +44 -11
  32. package/dist/index.js +3913 -3870
  33. package/dist/index.js.map +1 -1
  34. package/dist/modules/index.js +11 -0
  35. package/dist/modules/index.js.map +1 -1
  36. package/dist/modules/str.js +11 -0
  37. package/dist/modules/str.js.map +1 -1
  38. package/dist/registry.js +11 -0
  39. package/dist/registry.js.map +1 -1
  40. package/package.json +3 -2
@@ -1,1091 +1,1009 @@
1
1
  // behaviors/ui-interaction.ts
2
2
  var LIST_BEHAVIOR = {
3
- name: "std/List",
4
- category: "ui-interaction",
3
+ name: "std-list",
4
+ version: "1.0.0",
5
5
  description: "Entity list management with CRUD operations",
6
- suggestedFor: [
7
- "Entity listing pages",
8
- "Admin panels",
9
- "Data management screens",
10
- "Table views with inline actions"
11
- ],
12
- dataEntities: [
6
+ orbitals: [
13
7
  {
14
- name: "ListState",
15
- runtime: true,
16
- singleton: true,
17
- fields: [
18
- { name: "selectedId", type: "string", default: null }
19
- ]
20
- }
21
- ],
22
- stateMachine: {
23
- initial: "Browsing",
24
- states: [
25
- { name: "Browsing", isInitial: true },
26
- { name: "Creating" },
27
- { name: "Viewing" },
28
- { name: "Editing" },
29
- { name: "Deleting" }
30
- ],
31
- events: [
32
- { key: "INIT" },
33
- { key: "CREATE" },
34
- { key: "VIEW" },
35
- { key: "EDIT" },
36
- { key: "DELETE" },
37
- { key: "CONFIRM_DELETE" },
38
- { key: "CANCEL" },
39
- { key: "SAVE" }
40
- ],
41
- transitions: [
42
- // INIT: Self-loop on Browsing that renders the list UI
43
- {
44
- from: "Browsing",
45
- to: "Browsing",
46
- event: "INIT",
47
- effects: [
48
- ["render-ui", "main", {
49
- type: "page-header",
50
- title: "@config.title",
51
- actions: [{ label: "Create", event: "CREATE", variant: "primary" }]
52
- }],
53
- ["render-ui", "main", {
54
- type: "entity-table",
55
- entity: "@config.entity",
56
- columns: "@config.columns",
57
- itemActions: [
58
- { label: "View", event: "VIEW", placement: "row" },
59
- { label: "Edit", event: "EDIT", placement: "row" },
60
- { label: "Delete", event: "DELETE", variant: "danger", placement: "row" }
8
+ name: "ListOrbital",
9
+ entity: {
10
+ name: "ListState",
11
+ persistence: "runtime",
12
+ fields: [
13
+ { name: "id", type: "string", required: true },
14
+ { name: "selectedId", type: "string", default: null },
15
+ { name: "entityType", type: "string", default: "" },
16
+ { name: "title", type: "string", default: "Items" },
17
+ { name: "columns", type: "array", default: [] }
18
+ ]
19
+ },
20
+ traits: [
21
+ {
22
+ name: "List",
23
+ linkedEntity: "ListState",
24
+ category: "interaction",
25
+ stateMachine: {
26
+ states: [
27
+ { name: "Browsing", isInitial: true },
28
+ { name: "Creating" },
29
+ { name: "Viewing" },
30
+ { name: "Editing" },
31
+ { name: "Deleting" }
32
+ ],
33
+ events: [
34
+ { key: "INIT", name: "Initialize" },
35
+ { key: "CREATE", name: "Create" },
36
+ { key: "VIEW", name: "View" },
37
+ { key: "EDIT", name: "Edit" },
38
+ { key: "DELETE", name: "Delete" },
39
+ { key: "CONFIRM_DELETE", name: "Confirm Delete" },
40
+ { key: "CANCEL", name: "Cancel" },
41
+ { key: "SAVE", name: "Save" }
42
+ ],
43
+ transitions: [
44
+ {
45
+ from: "Browsing",
46
+ to: "Browsing",
47
+ event: "INIT",
48
+ effects: [
49
+ ["render-ui", "main", {
50
+ type: "page-header",
51
+ title: "@entity.title",
52
+ actions: [{ label: "Create", event: "CREATE", variant: "primary" }]
53
+ }],
54
+ ["render-ui", "main", {
55
+ type: "entity-table",
56
+ entity: "@entity.entityType",
57
+ columns: "@entity.columns",
58
+ itemActions: [
59
+ { label: "View", event: "VIEW", placement: "row" },
60
+ { label: "Edit", event: "EDIT", placement: "row" },
61
+ { label: "Delete", event: "DELETE", variant: "danger", placement: "row" }
62
+ ]
63
+ }]
64
+ ]
65
+ },
66
+ {
67
+ from: "Browsing",
68
+ to: "Creating",
69
+ event: "CREATE",
70
+ effects: [
71
+ ["render-ui", "modal", {
72
+ type: "form-section",
73
+ entity: "@entity.entityType",
74
+ mode: "create",
75
+ onSubmit: "SAVE",
76
+ onCancel: "CANCEL"
77
+ }]
78
+ ]
79
+ },
80
+ {
81
+ from: "Browsing",
82
+ to: "Viewing",
83
+ event: "VIEW",
84
+ effects: [
85
+ ["set", "@entity.selectedId", "@payload.id"],
86
+ ["render-ui", "drawer", {
87
+ type: "entity-detail",
88
+ entity: "@entity.entityType",
89
+ data: "@payload.id",
90
+ actions: [
91
+ { label: "Edit", event: "EDIT" },
92
+ { label: "Close", event: "CANCEL" }
93
+ ]
94
+ }]
95
+ ]
96
+ },
97
+ {
98
+ from: "Browsing",
99
+ to: "Editing",
100
+ event: "EDIT",
101
+ effects: [
102
+ ["set", "@entity.selectedId", "@payload.id"],
103
+ ["render-ui", "drawer", {
104
+ type: "form-section",
105
+ entity: "@entity.entityType",
106
+ initialData: "@payload.id",
107
+ mode: "edit",
108
+ onSubmit: "SAVE",
109
+ onCancel: "CANCEL"
110
+ }]
111
+ ]
112
+ },
113
+ {
114
+ from: "Viewing",
115
+ to: "Editing",
116
+ event: "EDIT",
117
+ effects: [
118
+ ["render-ui", "drawer", {
119
+ type: "form-section",
120
+ entity: "@entity.entityType",
121
+ initialData: "@entity.selectedId",
122
+ mode: "edit",
123
+ onSubmit: "SAVE",
124
+ onCancel: "CANCEL"
125
+ }]
126
+ ]
127
+ },
128
+ {
129
+ from: "Browsing",
130
+ to: "Deleting",
131
+ event: "DELETE",
132
+ effects: [
133
+ ["set", "@entity.selectedId", "@payload.id"],
134
+ ["render-ui", "modal", {
135
+ type: "confirm-dialog",
136
+ isOpen: true,
137
+ onClose: "CANCEL",
138
+ onConfirm: "CONFIRM_DELETE",
139
+ title: "Delete Confirmation",
140
+ message: "Are you sure you want to delete this item?",
141
+ confirmText: "Delete",
142
+ variant: "danger"
143
+ }]
144
+ ]
145
+ },
146
+ {
147
+ from: "Creating",
148
+ to: "Browsing",
149
+ event: "SAVE",
150
+ effects: [
151
+ ["persist", "create", "@entity.entityType", "@payload.data"],
152
+ ["notify", "in_app", "Created successfully"],
153
+ ["emit", "INIT"]
154
+ ]
155
+ },
156
+ {
157
+ from: "Editing",
158
+ to: "Browsing",
159
+ event: "SAVE",
160
+ effects: [
161
+ ["persist", "update", "@entity.entityType", "@payload.data"],
162
+ ["notify", "in_app", "Updated successfully"],
163
+ ["emit", "INIT"]
164
+ ]
165
+ },
166
+ {
167
+ from: "Deleting",
168
+ to: "Browsing",
169
+ event: "CONFIRM_DELETE",
170
+ effects: [
171
+ ["persist", "delete", "@entity.entityType", "@entity.selectedId"],
172
+ ["notify", "in_app", "Deleted successfully"],
173
+ ["emit", "INIT"]
174
+ ]
175
+ },
176
+ {
177
+ from: "Creating",
178
+ to: "Browsing",
179
+ event: "CANCEL",
180
+ effects: []
181
+ },
182
+ {
183
+ from: "Viewing",
184
+ to: "Browsing",
185
+ event: "CANCEL",
186
+ effects: []
187
+ },
188
+ {
189
+ from: "Editing",
190
+ to: "Browsing",
191
+ event: "CANCEL",
192
+ effects: []
193
+ },
194
+ {
195
+ from: "Deleting",
196
+ to: "Browsing",
197
+ event: "CANCEL",
198
+ effects: []
199
+ }
61
200
  ]
62
- }]
63
- ]
64
- },
65
- {
66
- from: "Browsing",
67
- to: "Creating",
68
- event: "CREATE",
69
- effects: [
70
- ["render-ui", "modal", {
71
- type: "form-section",
72
- entity: "@config.entity",
73
- mode: "create",
74
- submitEvent: "SAVE",
75
- cancelEvent: "CANCEL"
76
- }]
77
- ]
78
- },
79
- {
80
- from: "Browsing",
81
- to: "Viewing",
82
- event: "VIEW",
83
- effects: [
84
- ["set", "@entity.selectedId", "@payload.id"],
85
- ["render-ui", "drawer", {
86
- type: "entity-detail",
87
- entity: "@config.entity",
88
- id: "@payload.id",
89
- actions: [
90
- { label: "Edit", event: "EDIT" },
91
- { label: "Close", event: "CANCEL" }
92
- ]
93
- }]
94
- ]
95
- },
96
- {
97
- from: "Browsing",
98
- to: "Editing",
99
- event: "EDIT",
100
- effects: [
101
- ["set", "@entity.selectedId", "@payload.id"],
102
- ["render-ui", "drawer", {
103
- type: "form-section",
104
- entity: "@config.entity",
105
- id: "@payload.id",
106
- mode: "edit",
107
- submitEvent: "SAVE",
108
- cancelEvent: "CANCEL"
109
- }]
110
- ]
111
- },
112
- {
113
- from: "Viewing",
114
- to: "Editing",
115
- event: "EDIT",
116
- effects: [
117
- ["render-ui", "drawer", {
118
- type: "form-section",
119
- entity: "@config.entity",
120
- id: "@entity.selectedId",
121
- mode: "edit",
122
- submitEvent: "SAVE",
123
- cancelEvent: "CANCEL"
124
- }]
125
- ]
126
- },
127
- {
128
- from: "Browsing",
129
- to: "Deleting",
130
- event: "DELETE",
131
- effects: [
132
- ["set", "@entity.selectedId", "@payload.id"],
133
- ["render-ui", "modal", {
134
- type: "confirmation",
135
- title: "Delete Confirmation",
136
- message: "Are you sure you want to delete this item?",
137
- confirmLabel: "Delete",
138
- confirmVariant: "danger"
139
- }]
140
- ]
141
- },
142
- {
143
- from: "Creating",
144
- to: "Browsing",
145
- event: "SAVE",
146
- effects: [
147
- ["persist", "create", "@config.entity", "@payload.data"],
148
- ["render-ui", "modal", null],
149
- ["notify", { type: "success", message: "Created successfully" }],
150
- ["emit", "INIT"]
151
- ]
152
- },
153
- {
154
- from: "Editing",
155
- to: "Browsing",
156
- event: "SAVE",
157
- effects: [
158
- ["persist", "update", "@config.entity", "@payload.data"],
159
- ["render-ui", "drawer", null],
160
- ["notify", { type: "success", message: "Updated successfully" }],
161
- ["emit", "INIT"]
162
- ]
163
- },
164
- {
165
- from: "Deleting",
166
- to: "Browsing",
167
- event: "CONFIRM_DELETE",
168
- effects: [
169
- ["persist", "delete", "@config.entity", "@entity.selectedId"],
170
- ["render-ui", "modal", null],
171
- ["notify", { type: "success", message: "Deleted successfully" }],
172
- ["emit", "INIT"]
173
- ]
174
- },
175
- {
176
- from: "Creating",
177
- to: "Browsing",
178
- event: "CANCEL",
179
- effects: [
180
- ["render-ui", "modal", null]
181
- ]
182
- },
183
- {
184
- from: "Viewing",
185
- to: "Browsing",
186
- event: "CANCEL",
187
- effects: [
188
- ["render-ui", "drawer", null]
189
- ]
190
- },
191
- {
192
- from: "Editing",
193
- to: "Browsing",
194
- event: "CANCEL",
195
- effects: [
196
- ["render-ui", "drawer", null]
197
- ]
198
- },
199
- {
200
- from: "Deleting",
201
- to: "Browsing",
202
- event: "CANCEL",
203
- effects: [
204
- ["render-ui", "modal", null]
205
- ]
206
- }
207
- ]
208
- },
209
- configSchema: {
210
- required: [
211
- { name: "entity", type: "entity", description: "Entity type to list" },
212
- { name: "columns", type: "array", description: "Fields to display as columns" }
213
- ],
214
- optional: [
215
- { name: "title", type: "string", description: "Page title", default: "" },
216
- { name: "display", type: "string", description: "Display mode", default: "table", enum: ["table", "cards", "list"] },
217
- { name: "actions", type: "action[]", description: "Available actions", default: ["view", "edit", "delete"] },
218
- { name: "createInModal", type: "boolean", description: "Show create form in modal", default: true },
219
- { name: "editInDrawer", type: "boolean", description: "Show edit form in drawer", default: true }
220
- ]
221
- }
201
+ }
202
+ }
203
+ ],
204
+ pages: []
205
+ }
206
+ ]
222
207
  };
223
208
  var DETAIL_BEHAVIOR = {
224
- name: "std/Detail",
225
- category: "ui-interaction",
209
+ name: "std-detail",
210
+ version: "1.0.0",
226
211
  description: "Single entity view with edit/delete capabilities",
227
- suggestedFor: [
228
- "Entity detail pages",
229
- "Profile views",
230
- "Settings pages",
231
- "Single record screens"
232
- ],
233
- dataEntities: [
212
+ orbitals: [
234
213
  {
235
- name: "DetailState",
236
- runtime: true,
237
- fields: [
238
- { name: "entityId", type: "string", default: null },
239
- { name: "isLoading", type: "boolean", default: false },
240
- { name: "hasChanges", type: "boolean", default: false }
241
- ]
242
- }
243
- ],
244
- stateMachine: {
245
- initial: "Viewing",
246
- states: [
247
- { name: "Viewing", isInitial: true },
248
- { name: "Editing" },
249
- { name: "Deleting" }
250
- ],
251
- events: [
252
- { key: "INIT" },
253
- { key: "EDIT" },
254
- { key: "SAVE" },
255
- { key: "CANCEL" },
256
- { key: "DELETE" },
257
- { key: "CONFIRM_DELETE" }
258
- ],
259
- transitions: [
260
- // INIT: Self-loop on Viewing
261
- {
262
- from: "Viewing",
263
- to: "Viewing",
264
- event: "INIT",
265
- effects: [
266
- ["render-ui", "main", {
267
- type: "page-header",
268
- title: "@entity.name",
269
- actions: [
270
- { label: "Edit", event: "EDIT" },
271
- { label: "Delete", event: "DELETE", variant: "danger" }
214
+ name: "DetailOrbital",
215
+ entity: {
216
+ name: "DetailState",
217
+ persistence: "runtime",
218
+ fields: [
219
+ { name: "id", type: "string", required: true },
220
+ { name: "entityId", type: "string", default: null },
221
+ { name: "isLoading", type: "boolean", default: false },
222
+ { name: "hasChanges", type: "boolean", default: false },
223
+ { name: "entityType", type: "string", default: "" },
224
+ { name: "fields", type: "array", default: [] },
225
+ { name: "returnUrl", type: "string", default: "/" }
226
+ ]
227
+ },
228
+ traits: [
229
+ {
230
+ name: "Detail",
231
+ linkedEntity: "DetailState",
232
+ category: "interaction",
233
+ stateMachine: {
234
+ states: [
235
+ { name: "Viewing", isInitial: true },
236
+ { name: "Editing" },
237
+ { name: "Deleting" }
238
+ ],
239
+ events: [
240
+ { key: "INIT", name: "Initialize" },
241
+ { key: "EDIT", name: "Edit" },
242
+ { key: "SAVE", name: "Save" },
243
+ { key: "CANCEL", name: "Cancel" },
244
+ { key: "DELETE", name: "Delete" },
245
+ { key: "CONFIRM_DELETE", name: "Confirm Delete" }
246
+ ],
247
+ transitions: [
248
+ {
249
+ from: "Viewing",
250
+ to: "Viewing",
251
+ event: "INIT",
252
+ effects: [
253
+ ["render-ui", "main", {
254
+ type: "page-header",
255
+ title: "@entity.name",
256
+ actions: [
257
+ { label: "Edit", event: "EDIT" },
258
+ { label: "Delete", event: "DELETE", variant: "danger" }
259
+ ]
260
+ }],
261
+ ["render-ui", "main", {
262
+ type: "entity-detail",
263
+ entity: "@entity.entityType",
264
+ fieldNames: "@entity.fields"
265
+ }]
266
+ ]
267
+ },
268
+ {
269
+ from: "Viewing",
270
+ to: "Editing",
271
+ event: "EDIT",
272
+ effects: [
273
+ ["render-ui", "main", {
274
+ type: "form-section",
275
+ entity: "@entity.entityType",
276
+ mode: "edit",
277
+ fields: "@entity.fields",
278
+ onSubmit: "SAVE",
279
+ onCancel: "CANCEL"
280
+ }]
281
+ ]
282
+ },
283
+ {
284
+ from: "Editing",
285
+ to: "Viewing",
286
+ event: "SAVE",
287
+ effects: [
288
+ ["persist", "update", "@entity.entityType", "@payload.data"],
289
+ ["notify", "in_app", "Updated successfully"],
290
+ ["emit", "INIT"]
291
+ ]
292
+ },
293
+ {
294
+ from: "Editing",
295
+ to: "Viewing",
296
+ event: "CANCEL",
297
+ effects: [["emit", "INIT"]]
298
+ },
299
+ {
300
+ from: "Viewing",
301
+ to: "Deleting",
302
+ event: "DELETE",
303
+ effects: [
304
+ ["render-ui", "modal", {
305
+ type: "confirm-dialog",
306
+ isOpen: true,
307
+ onClose: "CANCEL",
308
+ onConfirm: "CONFIRM",
309
+ title: "Delete Confirmation",
310
+ message: "Are you sure you want to delete this item?"
311
+ }]
312
+ ]
313
+ },
314
+ {
315
+ from: "Deleting",
316
+ to: "Viewing",
317
+ event: "CONFIRM_DELETE",
318
+ effects: [
319
+ ["persist", "delete", "@entity.entityType", "@entity.id"],
320
+ ["navigate", "@entity.returnUrl"]
321
+ ]
322
+ },
323
+ {
324
+ from: "Deleting",
325
+ to: "Viewing",
326
+ event: "CANCEL",
327
+ effects: []
328
+ }
272
329
  ]
273
- }],
274
- ["render-ui", "main", {
275
- type: "entity-detail",
276
- entity: "@config.entity",
277
- fieldNames: "@config.fields"
278
- }]
279
- ]
280
- },
281
- {
282
- from: "Viewing",
283
- to: "Editing",
284
- event: "EDIT",
285
- effects: [
286
- ["render-ui", "main", {
287
- type: "form-section",
288
- entity: "@config.entity",
289
- mode: "edit",
290
- fields: "@config.fields",
291
- submitEvent: "SAVE",
292
- cancelEvent: "CANCEL"
293
- }]
294
- ]
295
- },
296
- {
297
- from: "Editing",
298
- to: "Viewing",
299
- event: "SAVE",
300
- effects: [
301
- ["persist", "update", "@config.entity", "@payload.data"],
302
- ["notify", { type: "success", message: "Updated successfully" }],
303
- ["emit", "INIT"]
304
- ]
305
- },
306
- {
307
- from: "Editing",
308
- to: "Viewing",
309
- event: "CANCEL",
310
- effects: [
311
- ["emit", "INIT"]
312
- ]
313
- },
314
- {
315
- from: "Viewing",
316
- to: "Deleting",
317
- event: "DELETE",
318
- effects: [
319
- ["render-ui", "modal", {
320
- type: "confirmation",
321
- title: "Delete Confirmation",
322
- message: "Are you sure you want to delete this item?"
323
- }]
324
- ]
325
- },
326
- {
327
- from: "Deleting",
328
- to: "Viewing",
329
- event: "CONFIRM_DELETE",
330
- effects: [
331
- ["persist", "delete", "@config.entity", "@entity.id"],
332
- ["navigate", "@config.returnUrl"]
333
- ]
334
- },
335
- {
336
- from: "Deleting",
337
- to: "Viewing",
338
- event: "CANCEL",
339
- effects: [
340
- ["render-ui", "modal", null]
341
- ]
342
- }
343
- ]
344
- },
345
- configSchema: {
346
- required: [
347
- { name: "entity", type: "entity", description: "Entity type" },
348
- { name: "fields", type: "array", description: "Fields to display" }
349
- ],
350
- optional: [
351
- { name: "layout", type: "string", description: "Layout mode", default: "two-column", enum: ["single-column", "two-column", "grid"] },
352
- { name: "allowEdit", type: "boolean", description: "Allow editing", default: true },
353
- { name: "allowDelete", type: "boolean", description: "Allow deletion", default: true }
354
- ]
355
- }
330
+ }
331
+ }
332
+ ],
333
+ pages: []
334
+ }
335
+ ]
356
336
  };
357
337
  var FORM_BEHAVIOR = {
358
- name: "std/Form",
359
- category: "ui-interaction",
338
+ name: "std-form",
339
+ version: "1.0.0",
360
340
  description: "Form state management with validation and submission",
361
- suggestedFor: [
362
- "Create/edit forms",
363
- "Settings forms",
364
- "Multi-field input",
365
- "Validated data entry"
366
- ],
367
- dataEntities: [
341
+ orbitals: [
368
342
  {
369
- name: "FormState",
370
- runtime: true,
371
- fields: [
372
- { name: "values", type: "object", default: {} },
373
- { name: "errors", type: "object", default: {} },
374
- { name: "touched", type: "object", default: {} },
375
- { name: "isDirty", type: "boolean", default: false },
376
- { name: "isSubmitting", type: "boolean", default: false }
377
- ]
378
- }
379
- ],
380
- stateMachine: {
381
- initial: "Idle",
382
- states: [
383
- { name: "Idle", isInitial: true },
384
- { name: "Editing" },
385
- { name: "Validating" },
386
- { name: "Submitting" },
387
- { name: "Success" },
388
- { name: "Error" }
389
- ],
390
- events: [
391
- { key: "INIT" },
392
- { key: "FIELD_CHANGE" },
393
- { key: "FIELD_BLUR" },
394
- { key: "SUBMIT" },
395
- { key: "VALIDATION_PASSED" },
396
- { key: "VALIDATION_FAILED" },
397
- { key: "SUBMIT_SUCCESS" },
398
- { key: "SUBMIT_ERROR" },
399
- { key: "RESET" }
400
- ],
401
- transitions: [
402
- // INIT: Self-loop on Idle → Editing
403
- {
404
- from: "Idle",
405
- to: "Editing",
406
- event: "INIT",
407
- effects: [
408
- ["render-ui", "main", {
409
- type: "form-section",
410
- entity: "@config.entity",
411
- fields: "@config.fields",
412
- values: "@entity.values",
413
- errors: "@entity.errors",
414
- submitEvent: "SUBMIT",
415
- cancelEvent: "@config.cancelEvent"
416
- }]
417
- ]
418
- },
419
- {
420
- from: "Editing",
421
- to: "Editing",
422
- event: "FIELD_CHANGE",
423
- effects: [
424
- ["set", "@entity.values", ["object/set", "@entity.values", "@payload.field", "@payload.value"]],
425
- ["set", "@entity.isDirty", true]
426
- ]
427
- },
428
- {
429
- from: "Editing",
430
- to: "Editing",
431
- event: "FIELD_BLUR",
432
- effects: [
433
- ["set", "@entity.touched", ["object/set", "@entity.touched", "@payload.field", true]]
434
- ]
435
- },
436
- {
437
- from: "Editing",
438
- to: "Validating",
439
- event: "SUBMIT",
440
- effects: [
441
- [
442
- "let",
443
- [["result", ["validate/check", "@entity.values", "@config.validation"]]],
444
- [
445
- "if",
446
- "@result.valid",
447
- ["emit", "VALIDATION_PASSED"],
448
- [
449
- "do",
450
- ["set", "@entity.errors", "@result.errors"],
451
- ["emit", "VALIDATION_FAILED"]
452
- ]
343
+ name: "FormOrbital",
344
+ entity: {
345
+ name: "FormState",
346
+ persistence: "runtime",
347
+ fields: [
348
+ { name: "id", type: "string", required: true },
349
+ { name: "values", type: "object", default: {} },
350
+ { name: "errors", type: "object", default: {} },
351
+ { name: "touched", type: "object", default: {} },
352
+ { name: "isDirty", type: "boolean", default: false },
353
+ { name: "isSubmitting", type: "boolean", default: false },
354
+ { name: "entityType", type: "string", default: "" },
355
+ { name: "fields", type: "array", default: [] },
356
+ { name: "mode", type: "string", default: "create" },
357
+ { name: "validation", type: "object", default: {} },
358
+ { name: "cancelEvent", type: "string", default: "CANCEL" },
359
+ { name: "submitEvent", type: "string", default: "SUBMIT_SUCCESS" }
360
+ ]
361
+ },
362
+ traits: [
363
+ {
364
+ name: "Form",
365
+ linkedEntity: "FormState",
366
+ category: "interaction",
367
+ stateMachine: {
368
+ states: [
369
+ { name: "Idle", isInitial: true },
370
+ { name: "Editing" },
371
+ { name: "Validating" },
372
+ { name: "Submitting" },
373
+ { name: "Success", isTerminal: true },
374
+ { name: "Error" }
375
+ ],
376
+ events: [
377
+ { key: "INIT", name: "Initialize" },
378
+ { key: "FIELD_CHANGE", name: "Field Change" },
379
+ { key: "FIELD_BLUR", name: "Field Blur" },
380
+ { key: "SUBMIT", name: "Submit" },
381
+ { key: "VALIDATION_PASSED", name: "Validation Passed" },
382
+ { key: "VALIDATION_FAILED", name: "Validation Failed" },
383
+ { key: "SUBMIT_SUCCESS", name: "Submit Success" },
384
+ { key: "SUBMIT_ERROR", name: "Submit Error" },
385
+ { key: "RESET", name: "Reset" }
386
+ ],
387
+ transitions: [
388
+ {
389
+ from: "Idle",
390
+ to: "Editing",
391
+ event: "INIT",
392
+ effects: [
393
+ ["render-ui", "main", {
394
+ type: "form-section",
395
+ entity: "@entity.entityType",
396
+ fields: "@entity.fields",
397
+ initialData: "@entity.values",
398
+ onSubmit: "SUBMIT",
399
+ onCancel: "@entity.cancelEvent"
400
+ }]
401
+ ]
402
+ },
403
+ {
404
+ from: "Editing",
405
+ to: "Editing",
406
+ event: "FIELD_CHANGE",
407
+ effects: [
408
+ ["set", "@entity.values", ["object/set", "@entity.values", "@payload.field", "@payload.value"]],
409
+ ["set", "@entity.isDirty", true]
410
+ ]
411
+ },
412
+ {
413
+ from: "Editing",
414
+ to: "Editing",
415
+ event: "FIELD_BLUR",
416
+ effects: [
417
+ ["set", "@entity.touched", ["object/set", "@entity.touched", "@payload.field", true]]
418
+ ]
419
+ },
420
+ {
421
+ from: "Editing",
422
+ to: "Validating",
423
+ event: "SUBMIT",
424
+ effects: [
425
+ [
426
+ "let",
427
+ [["result", ["validate/check", "@entity.values", "@entity.validation"]]],
428
+ [
429
+ "if",
430
+ "@result.valid",
431
+ ["emit", "VALIDATION_PASSED"],
432
+ [
433
+ "do",
434
+ ["set", "@entity.errors", "@result.errors"],
435
+ ["emit", "VALIDATION_FAILED"]
436
+ ]
437
+ ]
438
+ ]
439
+ ]
440
+ },
441
+ {
442
+ from: "Validating",
443
+ to: "Submitting",
444
+ event: "VALIDATION_PASSED",
445
+ effects: [
446
+ ["set", "@entity.isSubmitting", true],
447
+ [
448
+ "if",
449
+ ["=", "@entity.mode", "create"],
450
+ ["persist", "create", "@entity.entityType", "@entity.values"],
451
+ ["persist", "update", "@entity.entityType", "@entity.values"]
452
+ ]
453
+ ]
454
+ },
455
+ {
456
+ from: "Validating",
457
+ to: "Editing",
458
+ event: "VALIDATION_FAILED",
459
+ effects: [
460
+ ["notify", "in_app", "Please fix the validation errors"]
461
+ ]
462
+ },
463
+ {
464
+ from: "Submitting",
465
+ to: "Success",
466
+ event: "SUBMIT_SUCCESS",
467
+ effects: [
468
+ ["set", "@entity.isSubmitting", false],
469
+ ["notify", "in_app", "Saved successfully"],
470
+ ["emit", "@entity.submitEvent", { data: "@entity.values" }]
471
+ ]
472
+ },
473
+ {
474
+ from: "Submitting",
475
+ to: "Error",
476
+ event: "SUBMIT_ERROR",
477
+ effects: [
478
+ ["set", "@entity.isSubmitting", false],
479
+ ["set", "@entity.errors", { _form: "@payload.error" }],
480
+ ["notify", "in_app", "@payload.error"]
481
+ ]
482
+ },
483
+ {
484
+ from: "Editing",
485
+ to: "Idle",
486
+ event: "RESET",
487
+ effects: [
488
+ ["set", "@entity.values", {}],
489
+ ["set", "@entity.errors", {}],
490
+ ["set", "@entity.touched", {}],
491
+ ["set", "@entity.isDirty", false]
492
+ ]
493
+ },
494
+ {
495
+ from: "Error",
496
+ to: "Idle",
497
+ event: "RESET",
498
+ effects: [
499
+ ["set", "@entity.values", {}],
500
+ ["set", "@entity.errors", {}],
501
+ ["set", "@entity.touched", {}],
502
+ ["set", "@entity.isDirty", false]
503
+ ]
504
+ }
453
505
  ]
454
- ]
455
- ]
456
- },
457
- {
458
- from: "Validating",
459
- to: "Submitting",
460
- event: "VALIDATION_PASSED",
461
- effects: [
462
- ["set", "@entity.isSubmitting", true],
463
- [
464
- "if",
465
- ["=", "@config.mode", "create"],
466
- ["persist", "create", "@config.entity", "@entity.values"],
467
- ["persist", "update", "@config.entity", "@entity.values"]
468
- ]
469
- ]
470
- },
471
- {
472
- from: "Validating",
473
- to: "Editing",
474
- event: "VALIDATION_FAILED",
475
- effects: [
476
- ["notify", { type: "error", message: "Please fix the validation errors" }]
477
- ]
478
- },
479
- {
480
- from: "Submitting",
481
- to: "Success",
482
- event: "SUBMIT_SUCCESS",
483
- effects: [
484
- ["set", "@entity.isSubmitting", false],
485
- ["notify", { type: "success", message: "Saved successfully" }],
486
- ["emit", "@config.submitEvent", { data: "@entity.values" }]
487
- ]
488
- },
489
- {
490
- from: "Submitting",
491
- to: "Error",
492
- event: "SUBMIT_ERROR",
493
- effects: [
494
- ["set", "@entity.isSubmitting", false],
495
- ["set", "@entity.errors", { _form: "@payload.error" }],
496
- ["notify", { type: "error", message: "@payload.error" }]
497
- ]
498
- },
499
- {
500
- from: "Editing",
501
- to: "Idle",
502
- event: "RESET",
503
- effects: [
504
- ["set", "@entity.values", {}],
505
- ["set", "@entity.errors", {}],
506
- ["set", "@entity.touched", {}],
507
- ["set", "@entity.isDirty", false]
508
- ]
509
- },
510
- {
511
- from: "Error",
512
- to: "Idle",
513
- event: "RESET",
514
- effects: [
515
- ["set", "@entity.values", {}],
516
- ["set", "@entity.errors", {}],
517
- ["set", "@entity.touched", {}],
518
- ["set", "@entity.isDirty", false]
519
- ]
520
- }
521
- ]
522
- },
523
- configSchema: {
524
- required: [
525
- { name: "entity", type: "entity", description: "Entity type" },
526
- { name: "fields", type: "array", description: "Form fields" }
527
- ],
528
- optional: [
529
- { name: "mode", type: "string", description: "Form mode", default: "create", enum: ["create", "edit"] },
530
- { name: "validation", type: "object", description: "Validation rules", default: {} },
531
- { name: "submitEvent", type: "event", description: "Event to emit on successful submit", default: "SAVE" },
532
- { name: "cancelEvent", type: "event", description: "Event to emit on cancel", default: "CANCEL" }
533
- ]
534
- }
506
+ }
507
+ }
508
+ ],
509
+ pages: []
510
+ }
511
+ ]
535
512
  };
536
513
  var MODAL_BEHAVIOR = {
537
- name: "std/Modal",
538
- category: "ui-interaction",
514
+ name: "std-modal",
515
+ version: "1.0.0",
539
516
  description: "Modal dialog with open/close state management",
540
- suggestedFor: [
541
- "Confirmation dialogs",
542
- "Create forms",
543
- "Detail views",
544
- "Any overlay content"
545
- ],
546
- dataEntities: [
517
+ orbitals: [
547
518
  {
548
- name: "ModalState",
549
- runtime: true,
550
- fields: [
551
- { name: "content", type: "object", default: null }
552
- ]
519
+ name: "ModalOrbital",
520
+ entity: {
521
+ name: "ModalState",
522
+ persistence: "runtime",
523
+ fields: [
524
+ { name: "id", type: "string", required: true },
525
+ { name: "content", type: "object", default: null }
526
+ ]
527
+ },
528
+ traits: [
529
+ {
530
+ name: "Modal",
531
+ linkedEntity: "ModalState",
532
+ category: "interaction",
533
+ stateMachine: {
534
+ states: [
535
+ { name: "Closed", isInitial: true },
536
+ { name: "Open" }
537
+ ],
538
+ events: [
539
+ { key: "OPEN", name: "Open" },
540
+ { key: "CLOSE", name: "Close" },
541
+ { key: "CONFIRM", name: "Confirm" }
542
+ ],
543
+ transitions: [
544
+ {
545
+ from: "Closed",
546
+ to: "Open",
547
+ event: "OPEN",
548
+ effects: [
549
+ ["set", "@entity.content", "@payload.content"],
550
+ ["render-ui", "modal", {
551
+ type: "modal",
552
+ isOpen: true,
553
+ onClose: "CLOSE"
554
+ }]
555
+ ]
556
+ },
557
+ {
558
+ from: "Open",
559
+ to: "Closed",
560
+ event: "CLOSE",
561
+ effects: []
562
+ },
563
+ {
564
+ from: "Open",
565
+ to: "Closed",
566
+ event: "CONFIRM",
567
+ effects: []
568
+ }
569
+ ]
570
+ }
571
+ }
572
+ ],
573
+ pages: []
553
574
  }
554
- ],
555
- stateMachine: {
556
- initial: "Closed",
557
- states: [
558
- { name: "Closed", isInitial: true },
559
- { name: "Open" }
560
- ],
561
- events: [
562
- { key: "OPEN" },
563
- { key: "CLOSE" },
564
- { key: "CONFIRM" }
565
- ],
566
- transitions: [
567
- {
568
- from: "Closed",
569
- to: "Open",
570
- event: "OPEN",
571
- effects: [
572
- ["set", "@entity.content", "@payload.content"],
573
- ["render-ui", "modal", {
574
- type: "@payload.type",
575
- onClose: "CLOSE"
576
- }]
577
- ]
578
- },
579
- {
580
- from: "Open",
581
- to: "Closed",
582
- event: "CLOSE",
583
- effects: [
584
- ["render-ui", "modal", null]
585
- ]
586
- },
587
- {
588
- from: "Open",
589
- to: "Closed",
590
- event: "CONFIRM",
591
- effects: [
592
- ["render-ui", "modal", null]
593
- ]
594
- }
595
- ]
596
- },
597
- configSchema: {
598
- required: [],
599
- optional: [
600
- { name: "size", type: "string", description: "Modal size", default: "md", enum: ["sm", "md", "lg", "xl", "full"] },
601
- { name: "closeOnOverlay", type: "boolean", description: "Close on overlay click", default: true },
602
- { name: "closeOnEscape", type: "boolean", description: "Close on escape key", default: true }
603
- ]
604
- }
575
+ ]
605
576
  };
606
577
  var DRAWER_BEHAVIOR = {
607
- name: "std/Drawer",
608
- category: "ui-interaction",
578
+ name: "std-drawer",
579
+ version: "1.0.0",
609
580
  description: "Side drawer panel for detail views and forms",
610
- suggestedFor: [
611
- "Detail panels",
612
- "Edit forms",
613
- "Property panels",
614
- "Side navigation"
615
- ],
616
- dataEntities: [
581
+ orbitals: [
617
582
  {
618
- name: "DrawerState",
619
- runtime: true,
620
- fields: [
621
- { name: "content", type: "object", default: null }
622
- ]
583
+ name: "DrawerOrbital",
584
+ entity: {
585
+ name: "DrawerState",
586
+ persistence: "runtime",
587
+ fields: [
588
+ { name: "id", type: "string", required: true },
589
+ { name: "content", type: "object", default: null }
590
+ ]
591
+ },
592
+ traits: [
593
+ {
594
+ name: "Drawer",
595
+ linkedEntity: "DrawerState",
596
+ category: "interaction",
597
+ stateMachine: {
598
+ states: [
599
+ { name: "Closed", isInitial: true },
600
+ { name: "Open" }
601
+ ],
602
+ events: [
603
+ { key: "OPEN", name: "Open" },
604
+ { key: "CLOSE", name: "Close" }
605
+ ],
606
+ transitions: [
607
+ {
608
+ from: "Closed",
609
+ to: "Open",
610
+ event: "OPEN",
611
+ effects: [
612
+ ["set", "@entity.content", "@payload.content"],
613
+ ["render-ui", "drawer", {
614
+ type: "drawer",
615
+ isOpen: true,
616
+ onClose: "CLOSE"
617
+ }]
618
+ ]
619
+ },
620
+ {
621
+ from: "Open",
622
+ to: "Closed",
623
+ event: "CLOSE",
624
+ effects: []
625
+ }
626
+ ]
627
+ }
628
+ }
629
+ ],
630
+ pages: []
623
631
  }
624
- ],
625
- stateMachine: {
626
- initial: "Closed",
627
- states: [
628
- { name: "Closed", isInitial: true },
629
- { name: "Open" }
630
- ],
631
- events: [
632
- { key: "OPEN" },
633
- { key: "CLOSE" }
634
- ],
635
- transitions: [
636
- {
637
- from: "Closed",
638
- to: "Open",
639
- event: "OPEN",
640
- effects: [
641
- ["set", "@entity.content", "@payload.content"],
642
- ["render-ui", "drawer", {
643
- type: "@payload.type",
644
- onClose: "CLOSE"
645
- }]
646
- ]
647
- },
648
- {
649
- from: "Open",
650
- to: "Closed",
651
- event: "CLOSE",
652
- effects: [
653
- ["render-ui", "drawer", null]
654
- ]
655
- }
656
- ]
657
- },
658
- configSchema: {
659
- required: [],
660
- optional: [
661
- { name: "position", type: "string", description: "Drawer position", default: "right", enum: ["left", "right"] },
662
- { name: "size", type: "string", description: "Drawer size", default: "md", enum: ["sm", "md", "lg"] },
663
- { name: "overlay", type: "boolean", description: "Show overlay", default: true }
664
- ]
665
- }
632
+ ]
666
633
  };
667
634
  var TABS_BEHAVIOR = {
668
- name: "std/Tabs",
669
- category: "ui-interaction",
635
+ name: "std-tabs",
636
+ version: "1.0.0",
670
637
  description: "Tabbed navigation within a page",
671
- suggestedFor: [
672
- "Multi-view pages",
673
- "Settings with sections",
674
- "Dashboard tabs",
675
- "Profile sections"
676
- ],
677
- dataEntities: [
638
+ orbitals: [
678
639
  {
679
- name: "TabsState",
680
- runtime: true,
681
- singleton: true,
682
- fields: [
683
- { name: "activeTab", type: "string", default: null }
684
- ]
640
+ name: "TabsOrbital",
641
+ entity: {
642
+ name: "TabsState",
643
+ persistence: "runtime",
644
+ fields: [
645
+ { name: "id", type: "string", required: true },
646
+ { name: "activeTab", type: "string", default: null },
647
+ { name: "tabs", type: "array", default: [] },
648
+ { name: "defaultTab", type: "string", default: null }
649
+ ]
650
+ },
651
+ traits: [
652
+ {
653
+ name: "Tabs",
654
+ linkedEntity: "TabsState",
655
+ category: "interaction",
656
+ stateMachine: {
657
+ states: [{ name: "Active", isInitial: true }],
658
+ events: [
659
+ { key: "INIT", name: "Initialize" },
660
+ { key: "SELECT_TAB", name: "Select Tab" }
661
+ ],
662
+ transitions: [
663
+ {
664
+ from: "Active",
665
+ to: "Active",
666
+ event: "INIT",
667
+ effects: [
668
+ ["set", "@entity.activeTab", "@entity.defaultTab"],
669
+ ["render-ui", "main", {
670
+ type: "tabs",
671
+ tabs: "@entity.tabs",
672
+ activeTab: "@entity.activeTab",
673
+ onTabChange: "SELECT_TAB"
674
+ }]
675
+ ]
676
+ },
677
+ {
678
+ from: "Active",
679
+ to: "Active",
680
+ event: "SELECT_TAB",
681
+ effects: [["set", "@entity.activeTab", "@payload.tabId"]]
682
+ }
683
+ ]
684
+ }
685
+ }
686
+ ],
687
+ pages: []
685
688
  }
686
- ],
687
- stateMachine: {
688
- initial: "Active",
689
- states: [
690
- { name: "Active", isInitial: true }
691
- ],
692
- events: [
693
- { key: "INIT" },
694
- { key: "SELECT_TAB" }
695
- ],
696
- transitions: [
697
- // INIT: Self-loop on Active
698
- {
699
- from: "Active",
700
- to: "Active",
701
- event: "INIT",
702
- effects: [
703
- ["set", "@entity.activeTab", "@config.defaultTab"],
704
- ["render-ui", "main", {
705
- type: "filter-group",
706
- filterType: "tabs",
707
- tabs: "@config.tabs",
708
- active: "@entity.activeTab",
709
- onSelect: "SELECT_TAB"
710
- }]
711
- ]
712
- },
713
- {
714
- from: "Active",
715
- to: "Active",
716
- event: "SELECT_TAB",
717
- effects: [
718
- ["set", "@entity.activeTab", "@payload.tabId"]
719
- ]
720
- }
721
- ]
722
- },
723
- configSchema: {
724
- required: [
725
- { name: "tabs", type: "array", description: "Tab definitions with id, label, content" }
726
- ],
727
- optional: [
728
- { name: "defaultTab", type: "string", description: "Default active tab ID" }
729
- ]
730
- }
689
+ ]
731
690
  };
732
691
  var WIZARD_BEHAVIOR = {
733
- name: "std/Wizard",
734
- category: "ui-interaction",
692
+ name: "std-wizard",
693
+ version: "1.0.0",
735
694
  description: "Multi-step wizard flow - each step is a state",
736
- suggestedFor: [
737
- "Onboarding flows",
738
- "Multi-step forms",
739
- "Setup wizards",
740
- "Checkout flows"
741
- ],
742
- dataEntities: [
695
+ orbitals: [
743
696
  {
744
- name: "WizardState",
745
- runtime: true,
746
- singleton: true,
747
- fields: [
748
- { name: "stepData", type: "object", default: {} }
749
- ]
697
+ name: "WizardOrbital",
698
+ entity: {
699
+ name: "WizardState",
700
+ persistence: "runtime",
701
+ fields: [
702
+ { name: "id", type: "string", required: true },
703
+ { name: "stepData", type: "object", default: {} },
704
+ { name: "entityType", type: "string", default: "" },
705
+ { name: "step1Fields", type: "array", default: [] },
706
+ { name: "step2Fields", type: "array", default: [] },
707
+ { name: "completionUrl", type: "string", default: "/" }
708
+ ]
709
+ },
710
+ traits: [
711
+ {
712
+ name: "Wizard",
713
+ linkedEntity: "WizardState",
714
+ category: "interaction",
715
+ stateMachine: {
716
+ states: [
717
+ { name: "Step1", isInitial: true },
718
+ { name: "Step2" },
719
+ { name: "Step3" },
720
+ { name: "Complete", isTerminal: true }
721
+ ],
722
+ events: [
723
+ { key: "INIT", name: "Initialize" },
724
+ { key: "NEXT", name: "Next" },
725
+ { key: "PREV", name: "Previous" },
726
+ { key: "COMPLETE", name: "Complete" }
727
+ ],
728
+ transitions: [
729
+ {
730
+ from: "Step1",
731
+ to: "Step1",
732
+ event: "INIT",
733
+ effects: [
734
+ ["render-ui", "main", {
735
+ type: "wizard-progress",
736
+ steps: ["Step 1", "Step 2", "Step 3"],
737
+ currentStep: 0
738
+ }],
739
+ ["render-ui", "main", {
740
+ type: "form-section",
741
+ entity: "@entity.entityType",
742
+ fields: "@entity.step1Fields",
743
+ onSubmit: "NEXT"
744
+ }]
745
+ ]
746
+ },
747
+ {
748
+ from: "Step1",
749
+ to: "Step2",
750
+ event: "NEXT",
751
+ effects: [
752
+ ["set", "@entity.stepData.step1", "@payload"],
753
+ ["render-ui", "main", {
754
+ type: "wizard-progress",
755
+ steps: ["Step 1", "Step 2", "Step 3"],
756
+ currentStep: 1
757
+ }],
758
+ ["render-ui", "main", {
759
+ type: "form-section",
760
+ entity: "@entity.entityType",
761
+ fields: "@entity.step2Fields",
762
+ onSubmit: "NEXT",
763
+ onCancel: "PREV"
764
+ }]
765
+ ]
766
+ },
767
+ {
768
+ from: "Step2",
769
+ to: "Step1",
770
+ event: "PREV",
771
+ effects: [["emit", "INIT"]]
772
+ },
773
+ {
774
+ from: "Step2",
775
+ to: "Step3",
776
+ event: "NEXT",
777
+ effects: [
778
+ ["set", "@entity.stepData.step2", "@payload"],
779
+ ["render-ui", "main", {
780
+ type: "wizard-progress",
781
+ steps: ["Step 1", "Step 2", "Step 3"],
782
+ currentStep: 2
783
+ }],
784
+ ["render-ui", "main", {
785
+ type: "entity-detail",
786
+ entity: "@entity.entityType",
787
+ fieldNames: ["step1", "step2"],
788
+ title: "Review"
789
+ }]
790
+ ]
791
+ },
792
+ {
793
+ from: "Step3",
794
+ to: "Step2",
795
+ event: "PREV",
796
+ effects: []
797
+ },
798
+ {
799
+ from: "Step3",
800
+ to: "Complete",
801
+ event: "COMPLETE",
802
+ effects: [
803
+ ["persist", "create", "@entity.entityType", "@entity.stepData"],
804
+ ["notify", "in_app", "Wizard completed!"],
805
+ ["navigate", "@entity.completionUrl"]
806
+ ]
807
+ }
808
+ ]
809
+ }
810
+ }
811
+ ],
812
+ pages: []
750
813
  }
751
- ],
752
- // IMPORTANT: Each wizard step is a STATE, not a number index
753
- // This is the correct pattern for wizards
754
- stateMachine: {
755
- initial: "Step1",
756
- states: [
757
- { name: "Step1", isInitial: true },
758
- { name: "Step2" },
759
- { name: "Step3" },
760
- { name: "Complete" }
761
- ],
762
- events: [
763
- { key: "INIT" },
764
- { key: "NEXT" },
765
- { key: "PREV" },
766
- { key: "COMPLETE" }
767
- ],
768
- transitions: [
769
- // INIT on Step1: Self-loop that renders step 1
770
- {
771
- from: "Step1",
772
- to: "Step1",
773
- event: "INIT",
774
- effects: [
775
- ["render-ui", "main", {
776
- type: "wizard-progress",
777
- steps: ["Step 1", "Step 2", "Step 3"],
778
- current: 0
779
- }],
780
- ["render-ui", "main", {
781
- type: "form-section",
782
- entity: "@config.entity",
783
- fields: "@config.step1Fields",
784
- submitEvent: "NEXT"
785
- }]
786
- ]
787
- },
788
- // Step1 → Step2
789
- {
790
- from: "Step1",
791
- to: "Step2",
792
- event: "NEXT",
793
- effects: [
794
- ["set", "@entity.stepData.step1", "@payload"],
795
- ["render-ui", "main", {
796
- type: "wizard-progress",
797
- steps: ["Step 1", "Step 2", "Step 3"],
798
- current: 1
799
- }],
800
- ["render-ui", "main", {
801
- type: "form-section",
802
- entity: "@config.entity",
803
- fields: "@config.step2Fields",
804
- submitEvent: "NEXT",
805
- cancelEvent: "PREV"
806
- }]
807
- ]
808
- },
809
- // Step2 → Step1 (back)
810
- {
811
- from: "Step2",
812
- to: "Step1",
813
- event: "PREV",
814
- effects: [
815
- ["emit", "INIT"]
816
- ]
817
- },
818
- // Step2 → Step3
819
- {
820
- from: "Step2",
821
- to: "Step3",
822
- event: "NEXT",
823
- effects: [
824
- ["set", "@entity.stepData.step2", "@payload"],
825
- ["render-ui", "main", {
826
- type: "wizard-progress",
827
- steps: ["Step 1", "Step 2", "Step 3"],
828
- current: 2
829
- }],
830
- ["render-ui", "main", {
831
- type: "entity-detail",
832
- entity: "@config.entity",
833
- fieldNames: ["step1", "step2"],
834
- title: "Review"
835
- }],
836
- ["render-ui", "main", {
837
- type: "form-section",
838
- submitLabel: "Complete",
839
- cancelLabel: "Back",
840
- submitEvent: "COMPLETE",
841
- cancelEvent: "PREV"
842
- }]
843
- ]
844
- },
845
- // Step3 → Step2 (back)
846
- {
847
- from: "Step3",
848
- to: "Step2",
849
- event: "PREV",
850
- effects: [
851
- ["render-ui", "main", {
852
- type: "wizard-progress",
853
- steps: ["Step 1", "Step 2", "Step 3"],
854
- current: 1
855
- }],
856
- ["render-ui", "main", {
857
- type: "form-section",
858
- entity: "@config.entity",
859
- fields: "@config.step2Fields",
860
- submitEvent: "NEXT",
861
- cancelEvent: "PREV"
862
- }]
863
- ]
864
- },
865
- // Step3 → Complete
866
- {
867
- from: "Step3",
868
- to: "Complete",
869
- event: "COMPLETE",
870
- effects: [
871
- ["persist", "create", "@config.entity", "@entity.stepData"],
872
- ["notify", { type: "success", message: "Wizard completed!" }],
873
- ["navigate", "@config.completionUrl"]
874
- ]
875
- }
876
- ]
877
- },
878
- configSchema: {
879
- required: [
880
- { name: "entity", type: "entity", description: "Entity to create" },
881
- { name: "step1Fields", type: "array", description: "Fields for step 1" },
882
- { name: "step2Fields", type: "array", description: "Fields for step 2" }
883
- ],
884
- optional: [
885
- { name: "completionUrl", type: "string", description: "URL to navigate on completion", default: "/" }
886
- ]
887
- }
814
+ ]
888
815
  };
889
816
  var MASTER_DETAIL_BEHAVIOR = {
890
- name: "std/MasterDetail",
891
- category: "ui-interaction",
817
+ name: "std-masterdetail",
818
+ version: "1.0.0",
892
819
  description: "Master-detail layout with synchronized list and detail views",
893
- suggestedFor: [
894
- "Email clients",
895
- "File managers",
896
- "Two-panel layouts",
897
- "List-detail views"
898
- ],
899
- dataEntities: [
820
+ orbitals: [
900
821
  {
901
- name: "MasterDetailState",
902
- runtime: true,
903
- singleton: true,
904
- fields: [
905
- { name: "selectedId", type: "string", default: null }
906
- ]
822
+ name: "MasterDetailOrbital",
823
+ entity: {
824
+ name: "MasterDetailState",
825
+ persistence: "runtime",
826
+ fields: [
827
+ { name: "id", type: "string", required: true },
828
+ { name: "selectedId", type: "string", default: null },
829
+ { name: "entityType", type: "string", default: "" },
830
+ { name: "masterColumns", type: "array", default: [] },
831
+ { name: "detailFields", type: "array", default: [] }
832
+ ]
833
+ },
834
+ traits: [
835
+ {
836
+ name: "MasterDetail",
837
+ linkedEntity: "MasterDetailState",
838
+ category: "interaction",
839
+ stateMachine: {
840
+ states: [
841
+ { name: "NoSelection", isInitial: true },
842
+ { name: "Selected" }
843
+ ],
844
+ events: [
845
+ { key: "INIT", name: "Initialize" },
846
+ { key: "SELECT", name: "Select" },
847
+ { key: "DESELECT", name: "Deselect" }
848
+ ],
849
+ transitions: [
850
+ {
851
+ from: "NoSelection",
852
+ to: "NoSelection",
853
+ event: "INIT",
854
+ effects: [
855
+ ["render-ui", "main", {
856
+ type: "master-detail",
857
+ master: "@entity.entityType",
858
+ detail: "@entity.selectedId",
859
+ hasSelection: "@entity.hasSelection"
860
+ }],
861
+ ["render-ui", "main", {
862
+ type: "empty-state",
863
+ message: "Select an item to view details"
864
+ }]
865
+ ]
866
+ },
867
+ {
868
+ from: "NoSelection",
869
+ to: "Selected",
870
+ event: "SELECT",
871
+ effects: [
872
+ ["set", "@entity.selectedId", "@payload.id"],
873
+ ["render-ui", "main", {
874
+ type: "entity-detail",
875
+ entity: "@entity.entityType",
876
+ data: "@payload.id",
877
+ fieldNames: "@entity.detailFields"
878
+ }]
879
+ ]
880
+ },
881
+ {
882
+ from: "Selected",
883
+ to: "Selected",
884
+ event: "SELECT",
885
+ effects: [
886
+ ["set", "@entity.selectedId", "@payload.id"],
887
+ ["render-ui", "main", {
888
+ type: "entity-detail",
889
+ entity: "@entity.entityType",
890
+ data: "@payload.id",
891
+ fieldNames: "@entity.detailFields"
892
+ }]
893
+ ]
894
+ },
895
+ {
896
+ from: "Selected",
897
+ to: "NoSelection",
898
+ event: "DESELECT",
899
+ effects: [
900
+ ["set", "@entity.selectedId", null],
901
+ ["render-ui", "main", {
902
+ type: "empty-state",
903
+ message: "Select an item to view details"
904
+ }]
905
+ ]
906
+ }
907
+ ]
908
+ }
909
+ }
910
+ ],
911
+ pages: []
907
912
  }
908
- ],
909
- stateMachine: {
910
- initial: "NoSelection",
911
- states: [
912
- { name: "NoSelection", isInitial: true },
913
- { name: "Selected" }
914
- ],
915
- events: [
916
- { key: "INIT" },
917
- { key: "SELECT" },
918
- { key: "DESELECT" }
919
- ],
920
- transitions: [
921
- // INIT: Self-loop on NoSelection
922
- {
923
- from: "NoSelection",
924
- to: "NoSelection",
925
- event: "INIT",
926
- effects: [
927
- ["render-ui", "main", {
928
- type: "master-detail",
929
- entity: "@config.entity",
930
- masterColumns: "@config.masterColumns",
931
- onSelect: "SELECT",
932
- selected: "@entity.selectedId"
933
- }],
934
- ["render-ui", "main", {
935
- type: "empty-state",
936
- message: "Select an item to view details"
937
- }]
938
- ]
939
- },
940
- {
941
- from: "NoSelection",
942
- to: "Selected",
943
- event: "SELECT",
944
- effects: [
945
- ["set", "@entity.selectedId", "@payload.id"],
946
- ["render-ui", "main", {
947
- type: "entity-detail",
948
- entity: "@config.entity",
949
- id: "@payload.id",
950
- fieldNames: "@config.detailFields"
951
- }]
952
- ]
953
- },
954
- {
955
- from: "Selected",
956
- to: "Selected",
957
- event: "SELECT",
958
- effects: [
959
- ["set", "@entity.selectedId", "@payload.id"],
960
- ["render-ui", "main", {
961
- type: "entity-detail",
962
- entity: "@config.entity",
963
- id: "@payload.id",
964
- fieldNames: "@config.detailFields"
965
- }]
966
- ]
967
- },
968
- {
969
- from: "Selected",
970
- to: "NoSelection",
971
- event: "DESELECT",
972
- effects: [
973
- ["set", "@entity.selectedId", null],
974
- ["render-ui", "main", {
975
- type: "empty-state",
976
- message: "Select an item to view details"
977
- }]
978
- ]
979
- }
980
- ]
981
- },
982
- configSchema: {
983
- required: [
984
- { name: "entity", type: "entity", description: "Entity type" },
985
- { name: "masterColumns", type: "array", description: "Columns for master list" },
986
- { name: "detailFields", type: "array", description: "Fields for detail panel" }
987
- ],
988
- optional: [
989
- { name: "masterWidth", type: "string", description: "Master panel width", default: "350px" }
990
- ]
991
- }
913
+ ]
992
914
  };
993
915
  var FILTER_BEHAVIOR = {
994
- name: "std/Filter",
995
- category: "ui-interaction",
916
+ name: "std-filter-ui",
917
+ version: "1.0.0",
996
918
  description: "Filter and search management for lists",
997
- suggestedFor: [
998
- "Filtered lists",
999
- "Search interfaces",
1000
- "Faceted navigation",
1001
- "Advanced filtering"
1002
- ],
1003
- dataEntities: [
919
+ orbitals: [
1004
920
  {
1005
- name: "FilterState",
1006
- runtime: true,
1007
- singleton: true,
1008
- fields: [
1009
- { name: "filters", type: "object", default: {} },
1010
- { name: "searchTerm", type: "string", default: "" }
1011
- ]
921
+ name: "FilterOrbital",
922
+ entity: {
923
+ name: "FilterState",
924
+ persistence: "runtime",
925
+ fields: [
926
+ { name: "id", type: "string", required: true },
927
+ { name: "filters", type: "object", default: {} },
928
+ { name: "searchTerm", type: "string", default: "" },
929
+ { name: "filterConfig", type: "array", default: [] }
930
+ ]
931
+ },
932
+ traits: [
933
+ {
934
+ name: "Filter",
935
+ linkedEntity: "FilterState",
936
+ category: "interaction",
937
+ stateMachine: {
938
+ states: [
939
+ { name: "Idle", isInitial: true },
940
+ { name: "Filtering" }
941
+ ],
942
+ events: [
943
+ { key: "INIT", name: "Initialize" },
944
+ { key: "SET_FILTER", name: "Set Filter" },
945
+ { key: "CLEAR_FILTERS", name: "Clear Filters" },
946
+ { key: "SEARCH", name: "Search" }
947
+ ],
948
+ transitions: [
949
+ {
950
+ from: "Idle",
951
+ to: "Idle",
952
+ event: "INIT",
953
+ effects: [
954
+ ["render-ui", "main", {
955
+ type: "filter-group",
956
+ entity: "@entity.entityType",
957
+ filters: "@entity.filterConfig",
958
+ onFilterChange: "SET_FILTER",
959
+ onClearAll: "CLEAR_FILTERS"
960
+ }]
961
+ ]
962
+ },
963
+ {
964
+ from: "Idle",
965
+ to: "Filtering",
966
+ event: "SET_FILTER",
967
+ effects: [
968
+ ["set", "@entity.filters", ["object/set", "@entity.filters", "@payload.field", "@payload.value"]],
969
+ ["emit", "FILTER_CHANGED", "@entity.filters"]
970
+ ]
971
+ },
972
+ {
973
+ from: "Filtering",
974
+ to: "Idle",
975
+ event: "SET_FILTER",
976
+ effects: [
977
+ ["set", "@entity.filters", ["object/set", "@entity.filters", "@payload.field", "@payload.value"]],
978
+ ["emit", "FILTER_CHANGED", "@entity.filters"]
979
+ ]
980
+ },
981
+ {
982
+ from: "Filtering",
983
+ to: "Idle",
984
+ event: "CLEAR_FILTERS",
985
+ effects: [
986
+ ["set", "@entity.filters", {}],
987
+ ["set", "@entity.searchTerm", ""],
988
+ ["emit", "FILTER_CHANGED", {}]
989
+ ]
990
+ },
991
+ {
992
+ from: "Idle",
993
+ to: "Filtering",
994
+ event: "SEARCH",
995
+ effects: [
996
+ ["set", "@entity.searchTerm", "@payload.term"],
997
+ ["emit", "SEARCH_CHANGED", "@payload.term"]
998
+ ]
999
+ }
1000
+ ]
1001
+ }
1002
+ }
1003
+ ],
1004
+ pages: []
1012
1005
  }
1013
- ],
1014
- stateMachine: {
1015
- initial: "Idle",
1016
- states: [
1017
- { name: "Idle", isInitial: true },
1018
- { name: "Filtering" }
1019
- ],
1020
- events: [
1021
- { key: "INIT" },
1022
- { key: "SET_FILTER" },
1023
- { key: "CLEAR_FILTERS" },
1024
- { key: "SEARCH" }
1025
- ],
1026
- transitions: [
1027
- // INIT: Self-loop
1028
- {
1029
- from: "Idle",
1030
- to: "Idle",
1031
- event: "INIT",
1032
- effects: [
1033
- ["render-ui", "main", {
1034
- type: "filter-group",
1035
- filters: "@config.filters",
1036
- values: "@entity.filters",
1037
- onFilterChange: "SET_FILTER",
1038
- onClear: "CLEAR_FILTERS"
1039
- }]
1040
- ]
1041
- },
1042
- {
1043
- from: "Idle",
1044
- to: "Filtering",
1045
- event: "SET_FILTER",
1046
- effects: [
1047
- ["set", "@entity.filters", ["object/set", "@entity.filters", "@payload.field", "@payload.value"]],
1048
- ["emit", "FILTER_CHANGED", "@entity.filters"]
1049
- ]
1050
- },
1051
- {
1052
- from: "Filtering",
1053
- to: "Idle",
1054
- event: "SET_FILTER",
1055
- effects: [
1056
- ["set", "@entity.filters", ["object/set", "@entity.filters", "@payload.field", "@payload.value"]],
1057
- ["emit", "FILTER_CHANGED", "@entity.filters"]
1058
- ]
1059
- },
1060
- {
1061
- from: "Filtering",
1062
- to: "Idle",
1063
- event: "CLEAR_FILTERS",
1064
- effects: [
1065
- ["set", "@entity.filters", {}],
1066
- ["set", "@entity.searchTerm", ""],
1067
- ["emit", "FILTER_CHANGED", {}]
1068
- ]
1069
- },
1070
- {
1071
- from: "Idle",
1072
- to: "Filtering",
1073
- event: "SEARCH",
1074
- effects: [
1075
- ["set", "@entity.searchTerm", "@payload.term"],
1076
- ["emit", "SEARCH_CHANGED", "@payload.term"]
1077
- ]
1078
- }
1079
- ]
1080
- },
1081
- configSchema: {
1082
- required: [
1083
- { name: "filters", type: "array", description: "Filter definitions" }
1084
- ],
1085
- optional: [
1086
- { name: "searchable", type: "boolean", description: "Enable search", default: true }
1087
- ]
1088
- }
1006
+ ]
1089
1007
  };
1090
1008
  var UI_INTERACTION_BEHAVIORS = [
1091
1009
  LIST_BEHAVIOR,