@almadar/std 14.6.0 → 14.7.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 (5) hide show
  1. package/behaviors/registry/app/organisms/std-ecommerce.orb +776 -732
  2. package/behaviors/registry/service/atoms/std-service-stripe.orb +187 -171
  3. package/dist/behaviors/registry/app/organisms/std-ecommerce.orb +776 -732
  4. package/dist/behaviors/registry/service/atoms/std-service-stripe.orb +187 -171
  5. package/package.json +1 -1
package/behaviors/registry/app/organisms/std-ecommerce.orb CHANGED
@@ -69,8 +69,10 @@
69
69
  "ref": "AppShell.traits.AppLayout",
70
70
  "name": "ProductAppLayout",
71
71
  "config": {
72
- "notificationClickEvent": "PRODUCT_NOTIFICATIONS_OPEN",
73
72
  "contentTrait": "@trait.ProductCatalog",
73
+ "notifications": [],
74
+ "searchEvent": "PRODUCT_SEARCH",
75
+ "notificationClickEvent": "PRODUCT_NOTIFICATIONS_OPEN",
74
76
  "appName": "EcommerceApp",
75
77
  "navItems": [
76
78
  {
@@ -85,28 +87,26 @@
85
87
  },
86
88
  {
87
89
  "label": "Checkout",
88
- "icon": "credit-card",
89
- "href": "/checkout"
90
+ "href": "/checkout",
91
+ "icon": "credit-card"
90
92
  },
91
93
  {
92
94
  "href": "/orders",
93
- "label": "Orders",
94
- "icon": "clipboard-list"
95
+ "icon": "clipboard-list",
96
+ "label": "Orders"
95
97
  }
96
98
  ],
97
- "searchEvent": "PRODUCT_SEARCH",
98
99
  "topBarActions": [
99
100
  {
100
101
  "event": "CART_OPEN",
101
102
  "icon": "shopping-cart",
102
103
  "label": "Cart"
103
104
  }
104
- ],
105
- "notifications": []
105
+ ]
106
106
  },
107
107
  "events": {
108
- "NOTIFY_CLICK": "PRODUCT_NOTIFICATIONS_OPEN",
109
- "SEARCH": "PRODUCT_SEARCH"
108
+ "SEARCH": "PRODUCT_SEARCH",
109
+ "NOTIFY_CLICK": "PRODUCT_NOTIFICATIONS_OPEN"
110
110
  }
111
111
  },
112
112
  {
@@ -189,45 +189,46 @@
189
189
  "render-ui",
190
190
  "main",
191
191
  {
192
+ "direction": "vertical",
192
193
  "type": "stack",
193
194
  "children": [
194
195
  {
195
196
  "type": "stack",
196
197
  "gap": "md",
198
+ "justify": "between",
197
199
  "children": [
198
200
  {
201
+ "align": "center",
199
202
  "children": [
200
203
  {
201
- "type": "icon",
202
- "name": "package"
204
+ "name": "package",
205
+ "type": "icon"
203
206
  },
204
207
  {
205
- "type": "typography",
206
208
  "content": "Products",
209
+ "type": "typography",
207
210
  "variant": "h2"
208
211
  }
209
212
  ],
210
- "type": "stack",
211
- "gap": "sm",
212
213
  "direction": "horizontal",
213
- "align": "center"
214
+ "gap": "sm",
215
+ "type": "stack"
214
216
  },
215
217
  {
216
- "direction": "horizontal",
218
+ "type": "stack",
217
219
  "gap": "sm",
220
+ "direction": "horizontal",
218
221
  "children": [
219
222
  {
223
+ "icon": "plus",
220
224
  "type": "button",
221
225
  "label": "Create Product",
222
226
  "action": "CREATE",
223
- "variant": "primary",
224
- "icon": "plus"
227
+ "variant": "primary"
225
228
  }
226
- ],
227
- "type": "stack"
229
+ ]
228
230
  }
229
231
  ],
230
- "justify": "between",
231
232
  "direction": "horizontal",
232
233
  "align": "center"
233
234
  },
@@ -236,8 +237,7 @@
236
237
  },
237
238
  "@trait.ProductBrowseList"
238
239
  ],
239
- "gap": "lg",
240
- "direction": "vertical"
240
+ "gap": "lg"
241
241
  }
242
242
  ]
243
243
  ]
@@ -256,34 +256,34 @@
256
256
  "render-ui",
257
257
  "main",
258
258
  {
259
+ "direction": "vertical",
260
+ "align": "center",
261
+ "type": "stack",
262
+ "className": "py-8",
259
263
  "children": [
260
264
  {
261
265
  "type": "icon",
262
266
  "name": "bell"
263
267
  },
264
268
  {
265
- "type": "typography",
266
269
  "variant": "h3",
270
+ "type": "typography",
267
271
  "content": "No notifications"
268
272
  },
269
273
  {
270
- "content": "You're all caught up.",
271
- "color": "muted",
274
+ "type": "typography",
272
275
  "variant": "caption",
273
- "type": "typography"
276
+ "color": "muted",
277
+ "content": "You're all caught up."
274
278
  },
275
279
  {
276
280
  "variant": "ghost",
281
+ "type": "button",
277
282
  "label": "Back to products",
278
- "action": "INIT",
279
- "type": "button"
283
+ "action": "INIT"
280
284
  }
281
285
  ],
282
- "type": "stack",
283
- "direction": "vertical",
284
- "gap": "md",
285
- "align": "center",
286
- "className": "py-8"
286
+ "gap": "md"
287
287
  }
288
288
  ]
289
289
  ]
@@ -297,52 +297,52 @@
297
297
  "name": "ProductBrowseList",
298
298
  "linkedEntity": "Product",
299
299
  "config": {
300
- "fields": [
300
+ "itemActions": [
301
301
  {
302
- "name": "name",
303
- "variant": "h3",
304
- "icon": "package"
302
+ "label": "View",
303
+ "event": "VIEW",
304
+ "variant": "ghost"
305
305
  },
306
306
  {
307
- "name": "category",
308
- "variant": "badge"
307
+ "event": "EDIT",
308
+ "label": "Edit",
309
+ "variant": "ghost"
309
310
  },
310
311
  {
311
- "variant": "h4",
312
- "format": "currency",
313
- "name": "price"
314
- },
312
+ "event": "DELETE",
313
+ "variant": "danger",
314
+ "label": "Delete"
315
+ }
316
+ ],
317
+ "cols": 3.0,
318
+ "fields": [
315
319
  {
316
- "variant": "caption",
317
- "name": "sku"
320
+ "icon": "package",
321
+ "name": "name",
322
+ "variant": "h3"
318
323
  },
319
324
  {
320
- "name": "inStock",
321
- "label": "In Stock",
322
- "variant": "body",
323
- "format": "boolean"
324
- }
325
- ],
326
- "gap": "md",
327
- "itemActions": [
325
+ "variant": "badge",
326
+ "name": "category"
327
+ },
328
328
  {
329
- "variant": "ghost",
330
- "label": "View",
331
- "event": "VIEW"
329
+ "format": "currency",
330
+ "name": "price",
331
+ "variant": "h4"
332
332
  },
333
333
  {
334
- "variant": "ghost",
335
- "label": "Edit",
336
- "event": "EDIT"
334
+ "name": "sku",
335
+ "variant": "caption"
337
336
  },
338
337
  {
339
- "variant": "danger",
340
- "event": "DELETE",
341
- "label": "Delete"
338
+ "variant": "body",
339
+ "name": "inStock",
340
+ "format": "boolean",
341
+ "label": "In Stock"
342
342
  }
343
343
  ],
344
- "cols": 3.0,
345
- "imageField": "imageUrl"
344
+ "imageField": "imageUrl",
345
+ "gap": "md"
346
346
  },
347
347
  "listens": [
348
348
  {
@@ -571,7 +571,6 @@
571
571
  "render-ui",
572
572
  "modal",
573
573
  {
574
- "gap": "md",
575
574
  "children": [
576
575
  {
577
576
  "type": "stack",
@@ -593,10 +592,10 @@
593
592
  "type": "divider"
594
593
  },
595
594
  {
596
- "cancelEvent": "CLOSE",
597
- "type": "form-section",
598
595
  "mode": "create",
599
596
  "submitEvent": "SAVE",
597
+ "cancelEvent": "CLOSE",
598
+ "type": "form-section",
600
599
  "fields": [
601
600
  "name",
602
601
  "description",
@@ -608,6 +607,7 @@
608
607
  }
609
608
  ],
610
609
  "type": "stack",
610
+ "gap": "md",
611
611
  "direction": "vertical"
612
612
  }
613
613
  ]
@@ -869,8 +869,8 @@
869
869
  "Product",
870
870
  {
871
871
  "emit": {
872
- "failure": "ProductLoadFailed",
873
- "success": "ProductLoaded"
872
+ "success": "ProductLoaded",
873
+ "failure": "ProductLoadFailed"
874
874
  }
875
875
  }
876
876
  ]
@@ -885,11 +885,11 @@
885
885
  "fetch",
886
886
  "Product",
887
887
  {
888
+ "id": "@payload.id",
888
889
  "emit": {
889
890
  "failure": "ProductLoadFailed",
890
891
  "success": "ProductLoaded"
891
- },
892
- "id": "@payload.id"
892
+ }
893
893
  }
894
894
  ],
895
895
  [
@@ -897,28 +897,30 @@
897
897
  "modal",
898
898
  {
899
899
  "direction": "vertical",
900
+ "type": "stack",
900
901
  "children": [
901
902
  {
902
- "gap": "sm",
903
903
  "children": [
904
904
  {
905
905
  "type": "icon",
906
906
  "name": "edit"
907
907
  },
908
908
  {
909
+ "content": "Edit Product",
909
910
  "variant": "h3",
910
- "type": "typography",
911
- "content": "Edit Product"
911
+ "type": "typography"
912
912
  }
913
913
  ],
914
914
  "type": "stack",
915
- "direction": "horizontal"
915
+ "direction": "horizontal",
916
+ "gap": "sm"
916
917
  },
917
918
  {
918
919
  "type": "divider"
919
920
  },
920
921
  {
921
- "cancelEvent": "CLOSE",
922
+ "type": "form-section",
923
+ "submitEvent": "SAVE",
922
924
  "fields": [
923
925
  "name",
924
926
  "description",
@@ -928,13 +930,11 @@
928
930
  "inStock"
929
931
  ],
930
932
  "mode": "edit",
931
- "type": "form-section",
932
- "submitEvent": "SAVE",
933
+ "cancelEvent": "CLOSE",
933
934
  "entity": "@payload.row"
934
935
  }
935
936
  ],
936
- "gap": "md",
937
- "type": "stack"
937
+ "gap": "md"
938
938
  }
939
939
  ]
940
940
  ]
@@ -975,8 +975,8 @@
975
975
  "@payload.data",
976
976
  {
977
977
  "emit": {
978
- "failure": "ProductUpdateFailed",
979
- "success": "ProductUpdated"
978
+ "success": "ProductUpdated",
979
+ "failure": "ProductUpdateFailed"
980
980
  }
981
981
  }
982
982
  ],
@@ -1164,8 +1164,8 @@
1164
1164
  "Product",
1165
1165
  {
1166
1166
  "emit": {
1167
- "success": "ProductLoaded",
1168
- "failure": "ProductLoadFailed"
1167
+ "failure": "ProductLoadFailed",
1168
+ "success": "ProductLoaded"
1169
1169
  }
1170
1170
  }
1171
1171
  ]
@@ -1180,11 +1180,11 @@
1180
1180
  "fetch",
1181
1181
  "Product",
1182
1182
  {
1183
- "id": "@payload.id",
1184
1183
  "emit": {
1185
1184
  "success": "ProductLoaded",
1186
1185
  "failure": "ProductLoadFailed"
1187
- }
1186
+ },
1187
+ "id": "@payload.id"
1188
1188
  }
1189
1189
  ],
1190
1190
  [
@@ -1193,72 +1193,56 @@
1193
1193
  {
1194
1194
  "direction": "vertical",
1195
1195
  "gap": "md",
1196
+ "type": "stack",
1196
1197
  "children": [
1197
1198
  {
1198
1199
  "direction": "horizontal",
1199
1200
  "type": "stack",
1200
1201
  "gap": "sm",
1201
- "align": "center",
1202
1202
  "children": [
1203
1203
  {
1204
- "name": "eye",
1205
- "type": "icon"
1204
+ "type": "icon",
1205
+ "name": "eye"
1206
1206
  },
1207
1207
  {
1208
+ "variant": "h3",
1208
1209
  "content": "@entity.name",
1209
- "type": "typography",
1210
- "variant": "h3"
1210
+ "type": "typography"
1211
1211
  }
1212
- ]
1212
+ ],
1213
+ "align": "center"
1213
1214
  },
1214
1215
  {
1215
1216
  "type": "divider"
1216
1217
  },
1217
1218
  {
1218
- "gap": "md",
1219
- "direction": "horizontal",
1220
1219
  "type": "stack",
1221
1220
  "children": [
1222
1221
  {
1223
- "type": "typography",
1222
+ "variant": "caption",
1224
1223
  "content": "Name",
1225
- "variant": "caption"
1224
+ "type": "typography"
1226
1225
  },
1227
1226
  {
1227
+ "variant": "body",
1228
1228
  "content": "@entity.name",
1229
- "type": "typography",
1230
- "variant": "body"
1229
+ "type": "typography"
1231
1230
  }
1232
- ]
1233
- },
1234
- {
1231
+ ],
1235
1232
  "direction": "horizontal",
1236
- "type": "stack",
1237
- "gap": "md",
1238
- "children": [
1239
- {
1240
- "variant": "caption",
1241
- "type": "typography",
1242
- "content": "Description"
1243
- },
1244
- {
1245
- "type": "typography",
1246
- "variant": "body",
1247
- "content": "@entity.description"
1248
- }
1249
- ]
1233
+ "gap": "md"
1250
1234
  },
1251
1235
  {
1252
1236
  "children": [
1253
1237
  {
1254
- "type": "typography",
1255
1238
  "variant": "caption",
1256
- "content": "Price"
1239
+ "content": "Description",
1240
+ "type": "typography"
1257
1241
  },
1258
1242
  {
1259
- "type": "typography",
1260
1243
  "variant": "body",
1261
- "content": "@entity.price"
1244
+ "content": "@entity.description",
1245
+ "type": "typography"
1262
1246
  }
1263
1247
  ],
1264
1248
  "direction": "horizontal",
@@ -1267,20 +1251,20 @@
1267
1251
  },
1268
1252
  {
1269
1253
  "gap": "md",
1270
- "direction": "horizontal",
1271
1254
  "type": "stack",
1272
1255
  "children": [
1273
1256
  {
1274
- "variant": "caption",
1275
1257
  "type": "typography",
1276
- "content": "Category"
1258
+ "content": "Price",
1259
+ "variant": "caption"
1277
1260
  },
1278
1261
  {
1262
+ "content": "@entity.price",
1279
1263
  "type": "typography",
1280
- "variant": "body",
1281
- "content": "@entity.category"
1264
+ "variant": "body"
1282
1265
  }
1283
- ]
1266
+ ],
1267
+ "direction": "horizontal"
1284
1268
  },
1285
1269
  {
1286
1270
  "type": "stack",
@@ -1288,12 +1272,12 @@
1288
1272
  "children": [
1289
1273
  {
1290
1274
  "variant": "caption",
1291
- "type": "typography",
1292
- "content": "Sku"
1275
+ "content": "Category",
1276
+ "type": "typography"
1293
1277
  },
1294
1278
  {
1295
1279
  "variant": "body",
1296
- "content": "@entity.sku",
1280
+ "content": "@entity.category",
1297
1281
  "type": "typography"
1298
1282
  }
1299
1283
  ],
@@ -1301,47 +1285,63 @@
1301
1285
  },
1302
1286
  {
1303
1287
  "direction": "horizontal",
1288
+ "gap": "md",
1289
+ "type": "stack",
1304
1290
  "children": [
1305
1291
  {
1306
- "content": "In Stock",
1307
1292
  "type": "typography",
1293
+ "content": "Sku",
1308
1294
  "variant": "caption"
1309
1295
  },
1310
1296
  {
1311
- "variant": "body",
1312
1297
  "type": "typography",
1313
- "content": "@entity.inStock"
1298
+ "variant": "body",
1299
+ "content": "@entity.sku"
1314
1300
  }
1315
- ],
1301
+ ]
1302
+ },
1303
+ {
1304
+ "direction": "horizontal",
1305
+ "gap": "md",
1316
1306
  "type": "stack",
1317
- "gap": "md"
1307
+ "children": [
1308
+ {
1309
+ "content": "In Stock",
1310
+ "type": "typography",
1311
+ "variant": "caption"
1312
+ },
1313
+ {
1314
+ "content": "@entity.inStock",
1315
+ "type": "typography",
1316
+ "variant": "body"
1317
+ }
1318
+ ]
1318
1319
  },
1319
1320
  {
1320
1321
  "type": "divider"
1321
1322
  },
1322
1323
  {
1323
- "direction": "horizontal",
1324
- "justify": "end",
1325
1324
  "type": "stack",
1326
1325
  "children": [
1327
1326
  {
1328
1327
  "label": "Edit",
1329
1328
  "type": "button",
1329
+ "icon": "edit",
1330
1330
  "variant": "primary",
1331
- "action": "EDIT",
1332
- "icon": "edit"
1331
+ "action": "EDIT"
1333
1332
  },
1334
1333
  {
1335
- "label": "Close",
1336
- "variant": "ghost",
1334
+ "action": "CLOSE",
1337
1335
  "type": "button",
1338
- "action": "CLOSE"
1336
+ "label": "Close",
1337
+ "variant": "ghost"
1339
1338
  }
1340
1339
  ],
1341
- "gap": "sm"
1340
+ "direction": "horizontal",
1341
+ "gap": "sm",
1342
+ "justify": "end"
1342
1343
  }
1343
- ],
1344
- "type": "stack"
1344
+ ]
1345
1345
  }
1346
1346
  ]
1347
1347
  ]
@@ -1571,8 +1571,8 @@
1571
1571
  "Product",
1572
1572
  {
1573
1573
  "emit": {
1574
- "failure": "ProductLoadFailed",
1575
- "success": "ProductLoaded"
1574
+ "success": "ProductLoaded",
1575
+ "failure": "ProductLoadFailed"
1576
1576
  }
1577
1577
  }
1578
1578
  ]
@@ -1592,68 +1592,68 @@
1592
1592
  "fetch",
1593
1593
  "Product",
1594
1594
  {
1595
+ "id": "@payload.id",
1595
1596
  "emit": {
1596
- "failure": "ProductLoadFailed",
1597
- "success": "ProductLoaded"
1598
- },
1599
- "id": "@payload.id"
1597
+ "success": "ProductLoaded",
1598
+ "failure": "ProductLoadFailed"
1599
+ }
1600
1600
  }
1601
1601
  ],
1602
1602
  [
1603
1603
  "render-ui",
1604
1604
  "modal",
1605
1605
  {
1606
- "type": "stack",
1607
1606
  "gap": "md",
1608
- "direction": "vertical",
1609
1607
  "children": [
1610
1608
  {
1609
+ "type": "stack",
1611
1610
  "direction": "horizontal",
1611
+ "align": "center",
1612
1612
  "children": [
1613
1613
  {
1614
- "type": "icon",
1615
- "name": "alert-triangle"
1614
+ "name": "alert-triangle",
1615
+ "type": "icon"
1616
1616
  },
1617
1617
  {
1618
1618
  "type": "typography",
1619
- "variant": "h3",
1620
- "content": "Delete Product"
1619
+ "content": "Delete Product",
1620
+ "variant": "h3"
1621
1621
  }
1622
1622
  ],
1623
- "type": "stack",
1624
- "gap": "sm",
1625
- "align": "center"
1623
+ "gap": "sm"
1626
1624
  },
1627
1625
  {
1628
1626
  "type": "divider"
1629
1627
  },
1630
1628
  {
1631
- "type": "alert",
1632
1629
  "variant": "error",
1630
+ "type": "alert",
1633
1631
  "message": "This action cannot be undone."
1634
1632
  },
1635
1633
  {
1636
1634
  "gap": "sm",
1637
- "type": "stack",
1638
1635
  "justify": "end",
1639
1636
  "children": [
1640
1637
  {
1641
- "variant": "ghost",
1642
- "type": "button",
1643
1638
  "action": "CANCEL",
1644
- "label": "Cancel"
1639
+ "label": "Cancel",
1640
+ "variant": "ghost",
1641
+ "type": "button"
1645
1642
  },
1646
1643
  {
1647
- "variant": "danger",
1648
- "action": "CONFIRM_DELETE",
1649
1644
  "label": "Delete",
1650
- "icon": "check",
1651
- "type": "button"
1645
+ "action": "CONFIRM_DELETE",
1646
+ "variant": "danger",
1647
+ "type": "button",
1648
+ "icon": "check"
1652
1649
  }
1653
1650
  ],
1651
+ "type": "stack",
1654
1652
  "direction": "horizontal"
1655
1653
  }
1656
- ]
1654
+ ],
1655
+ "direction": "vertical",
1656
+ "type": "stack"
1657
1657
  }
1658
1658
  ]
1659
1659
  ]
@@ -1670,8 +1670,8 @@
1670
1670
  "@entity.pendingId",
1671
1671
  {
1672
1672
  "emit": {
1673
- "success": "ProductDeleted",
1674
- "failure": "ProductDeleteFailed"
1673
+ "failure": "ProductDeleteFailed",
1674
+ "success": "ProductDeleted"
1675
1675
  }
1676
1676
  }
1677
1677
  ],
@@ -1692,9 +1692,9 @@
1692
1692
  "Product",
1693
1693
  {
1694
1694
  "emit": {
1695
- "failure": "ProductLoadFailed",
1696
- "success": "ProductLoaded"
1697
- }
1695
+ "success": "ProductLoaded",
1696
+ "failure": "ProductLoadFailed"
1697
+ }
1698
1698
  }
1699
1699
  ],
1700
1700
  [
@@ -1754,8 +1754,8 @@
1754
1754
  "Product",
1755
1755
  {
1756
1756
  "emit": {
1757
- "success": "ProductLoaded",
1758
- "failure": "ProductLoadFailed"
1757
+ "failure": "ProductLoadFailed",
1758
+ "success": "ProductLoaded"
1759
1759
  }
1760
1760
  }
1761
1761
  ]
@@ -1993,8 +1993,8 @@
1993
1993
  "CartItem",
1994
1994
  {
1995
1995
  "emit": {
1996
- "failure": "CartItemLoadFailed",
1997
- "success": "CartItemLoaded"
1996
+ "success": "CartItemLoaded",
1997
+ "failure": "CartItemLoadFailed"
1998
1998
  }
1999
1999
  }
2000
2000
  ],
@@ -2008,15 +2008,15 @@
2008
2008
  },
2009
2009
  {
2010
2010
  "type": "typography",
2011
+ "variant": "caption",
2011
2012
  "color": "muted",
2012
- "content": "Loading…",
2013
- "variant": "caption"
2013
+ "content": "Loading…"
2014
2014
  }
2015
2015
  ],
2016
- "type": "stack",
2017
2016
  "className": "py-12",
2018
2017
  "gap": "md",
2019
2018
  "direction": "vertical",
2019
+ "type": "stack",
2020
2020
  "align": "center"
2021
2021
  }
2022
2022
  ]
@@ -2031,16 +2031,42 @@
2031
2031
  "render-ui",
2032
2032
  "main",
2033
2033
  {
2034
+ "navItems": [
2035
+ {
2036
+ "label": "Products",
2037
+ "href": "/products",
2038
+ "icon": "package"
2039
+ },
2040
+ {
2041
+ "label": "Cart",
2042
+ "href": "/cart",
2043
+ "icon": "shopping-cart"
2044
+ },
2045
+ {
2046
+ "label": "Checkout",
2047
+ "icon": "credit-card",
2048
+ "href": "/checkout"
2049
+ },
2050
+ {
2051
+ "label": "Orders",
2052
+ "href": "/orders",
2053
+ "icon": "clipboard-list"
2054
+ }
2055
+ ],
2034
2056
  "children": [
2035
2057
  {
2036
2058
  "type": "stack",
2037
- "direction": "vertical",
2059
+ "gap": "lg",
2038
2060
  "children": [
2039
2061
  {
2040
- "direction": "horizontal",
2062
+ "type": "stack",
2041
2063
  "justify": "between",
2064
+ "direction": "horizontal",
2065
+ "gap": "md",
2042
2066
  "children": [
2043
2067
  {
2068
+ "type": "stack",
2069
+ "direction": "horizontal",
2044
2070
  "gap": "md",
2045
2071
  "children": [
2046
2072
  {
@@ -2048,51 +2074,47 @@
2048
2074
  "type": "icon"
2049
2075
  },
2050
2076
  {
2051
- "content": "Shopping Cart",
2052
2077
  "type": "typography",
2078
+ "content": "Shopping Cart",
2053
2079
  "variant": "h2"
2054
2080
  }
2055
- ],
2056
- "direction": "horizontal",
2057
- "type": "stack"
2081
+ ]
2058
2082
  },
2059
2083
  {
2060
- "icon": "plus",
2061
- "type": "button",
2062
2084
  "variant": "primary",
2063
2085
  "label": "Add Item",
2064
- "action": "ADD_ITEM"
2086
+ "action": "ADD_ITEM",
2087
+ "type": "button",
2088
+ "icon": "plus"
2065
2089
  }
2066
- ],
2067
- "type": "stack",
2068
- "gap": "md"
2090
+ ]
2069
2091
  },
2070
2092
  {
2071
2093
  "type": "divider"
2072
2094
  },
2073
2095
  {
2096
+ "cols": 3.0,
2074
2097
  "type": "simple-grid",
2075
2098
  "children": [
2076
2099
  {
2077
- "type": "stat-display",
2078
- "label": "Items",
2100
+ "icon": "package",
2079
2101
  "value": "@payload.data.length",
2080
- "icon": "package"
2102
+ "type": "stat-display",
2103
+ "label": "Items"
2081
2104
  },
2082
2105
  {
2083
- "type": "stat-display",
2106
+ "value": "@payload.data.length",
2084
2107
  "label": "Subtotal",
2085
- "icon": "dollar-sign",
2086
- "value": "@payload.data.length"
2108
+ "type": "stat-display",
2109
+ "icon": "dollar-sign"
2087
2110
  },
2088
2111
  {
2112
+ "type": "stat-display",
2089
2113
  "label": "Total",
2090
2114
  "value": "@payload.data.length",
2091
- "icon": "receipt",
2092
- "type": "stat-display"
2115
+ "icon": "receipt"
2093
2116
  }
2094
- ],
2095
- "cols": 3.0
2117
+ ]
2096
2118
  },
2097
2119
  {
2098
2120
  "type": "divider"
@@ -2100,68 +2122,46 @@
2100
2122
  {
2101
2123
  "entity": "@payload.data",
2102
2124
  "type": "data-grid",
2125
+ "itemActions": [
2126
+ {
2127
+ "event": "REQUEST_REMOVE",
2128
+ "variant": "danger",
2129
+ "label": "Remove"
2130
+ }
2131
+ ],
2103
2132
  "fields": [
2104
2133
  {
2105
- "label": "Product Name",
2106
2134
  "icon": "shopping-cart",
2135
+ "name": "productName",
2107
2136
  "variant": "h4",
2108
- "name": "productName"
2137
+ "label": "Product Name"
2109
2138
  },
2110
2139
  {
2111
- "name": "quantity",
2112
- "variant": "caption",
2140
+ "format": "currency",
2113
2141
  "label": "Quantity",
2114
- "format": "currency"
2142
+ "variant": "caption",
2143
+ "name": "quantity"
2115
2144
  },
2116
2145
  {
2117
- "label": "Unit Price",
2118
2146
  "variant": "badge",
2119
- "name": "unitPrice"
2120
- }
2121
- ],
2122
- "itemActions": [
2123
- {
2124
- "variant": "danger",
2125
- "label": "Remove",
2126
- "event": "REQUEST_REMOVE"
2147
+ "name": "unitPrice",
2148
+ "label": "Unit Price"
2127
2149
  }
2128
2150
  ]
2129
2151
  },
2130
2152
  {
2131
2153
  "icon": "arrow-right",
2154
+ "type": "button",
2132
2155
  "label": "Proceed to Checkout",
2133
- "action": "PROCEED_CHECKOUT",
2134
2156
  "variant": "primary",
2135
- "type": "button"
2157
+ "action": "PROCEED_CHECKOUT"
2136
2158
  }
2137
2159
  ],
2138
- "gap": "lg"
2160
+ "direction": "vertical"
2139
2161
  }
2140
2162
  ],
2141
- "appName": "EcommerceApp",
2142
2163
  "type": "dashboard-layout",
2143
- "navItems": [
2144
- {
2145
- "label": "Products",
2146
- "href": "/products",
2147
- "icon": "package"
2148
- },
2149
- {
2150
- "href": "/cart",
2151
- "label": "Cart",
2152
- "icon": "shopping-cart"
2153
- },
2154
- {
2155
- "label": "Checkout",
2156
- "href": "/checkout",
2157
- "icon": "credit-card"
2158
- },
2159
- {
2160
- "label": "Orders",
2161
- "icon": "clipboard-list",
2162
- "href": "/orders"
2163
- }
2164
- ]
2164
+ "appName": "EcommerceApp"
2165
2165
  }
2166
2166
  ]
2167
2167
  ]
@@ -2176,9 +2176,10 @@
2176
2176
  "main",
2177
2177
  {
2178
2178
  "type": "stack",
2179
- "align": "center",
2180
2179
  "gap": "md",
2180
+ "align": "center",
2181
2181
  "className": "py-12",
2182
+ "direction": "vertical",
2182
2183
  "children": [
2183
2184
  {
2184
2185
  "name": "alert-triangle",
@@ -2186,25 +2187,24 @@
2186
2187
  "type": "icon"
2187
2188
  },
2188
2189
  {
2189
- "type": "typography",
2190
+ "variant": "h3",
2190
2191
  "content": "Failed to load cartitem",
2191
- "variant": "h3"
2192
+ "type": "typography"
2192
2193
  },
2193
2194
  {
2195
+ "color": "muted",
2194
2196
  "variant": "body",
2195
- "content": "@payload.error",
2196
2197
  "type": "typography",
2197
- "color": "muted"
2198
+ "content": "@payload.error"
2198
2199
  },
2199
2200
  {
2200
- "variant": "primary",
2201
- "label": "Retry",
2202
2201
  "type": "button",
2202
+ "icon": "rotate-ccw",
2203
+ "label": "Retry",
2203
2204
  "action": "INIT",
2204
- "icon": "rotate-ccw"
2205
+ "variant": "primary"
2205
2206
  }
2206
- ],
2207
- "direction": "vertical"
2207
+ ]
2208
2208
  }
2209
2209
  ]
2210
2210
  ]
@@ -2228,22 +2228,22 @@
2228
2228
  "render-ui",
2229
2229
  "main",
2230
2230
  {
2231
- "className": "py-12",
2231
+ "gap": "md",
2232
2232
  "direction": "vertical",
2233
- "align": "center",
2233
+ "className": "py-12",
2234
+ "type": "stack",
2234
2235
  "children": [
2235
2236
  {
2236
2237
  "type": "spinner"
2237
2238
  },
2238
2239
  {
2239
2240
  "color": "muted",
2241
+ "type": "typography",
2240
2242
  "content": "Preparing checkout…",
2241
- "variant": "caption",
2242
- "type": "typography"
2243
+ "variant": "caption"
2243
2244
  }
2244
2245
  ],
2245
- "gap": "md",
2246
- "type": "stack"
2246
+ "align": "center"
2247
2247
  }
2248
2248
  ]
2249
2249
  ]
@@ -2257,35 +2257,12 @@
2257
2257
  "render-ui",
2258
2258
  "main",
2259
2259
  {
2260
- "type": "dashboard-layout",
2261
2260
  "appName": "EcommerceApp",
2262
- "navItems": [
2263
- {
2264
- "href": "/products",
2265
- "label": "Products",
2266
- "icon": "package"
2267
- },
2268
- {
2269
- "icon": "shopping-cart",
2270
- "label": "Cart",
2271
- "href": "/cart"
2272
- },
2273
- {
2274
- "icon": "credit-card",
2275
- "label": "Checkout",
2276
- "href": "/checkout"
2277
- },
2278
- {
2279
- "label": "Orders",
2280
- "icon": "clipboard-list",
2281
- "href": "/orders"
2282
- }
2283
- ],
2284
2261
  "children": [
2285
2262
  {
2286
2263
  "children": [
2287
2264
  {
2288
- "type": "stack",
2265
+ "direction": "horizontal",
2289
2266
  "children": [
2290
2267
  {
2291
2268
  "type": "icon",
@@ -2293,73 +2270,96 @@
2293
2270
  },
2294
2271
  {
2295
2272
  "type": "typography",
2296
- "variant": "h2",
2297
- "content": "Checkout"
2273
+ "content": "Checkout",
2274
+ "variant": "h2"
2298
2275
  }
2299
2276
  ],
2300
- "direction": "horizontal",
2301
- "gap": "sm"
2277
+ "gap": "sm",
2278
+ "type": "stack"
2302
2279
  },
2303
2280
  {
2304
2281
  "type": "divider"
2305
2282
  },
2306
2283
  {
2307
- "entity": "@payload.data",
2308
2284
  "type": "data-grid",
2285
+ "entity": "@payload.data",
2309
2286
  "itemActions": [
2310
2287
  {
2288
+ "label": "Remove",
2311
2289
  "event": "REQUEST_REMOVE",
2312
- "variant": "danger",
2313
- "label": "Remove"
2290
+ "variant": "danger"
2314
2291
  }
2315
2292
  ],
2316
2293
  "fields": [
2317
2294
  {
2295
+ "name": "productName",
2318
2296
  "icon": "shopping-cart",
2319
2297
  "variant": "h4",
2320
- "label": "Product Name",
2321
- "name": "productName"
2298
+ "label": "Product Name"
2322
2299
  },
2323
2300
  {
2324
2301
  "format": "currency",
2325
2302
  "variant": "caption",
2326
- "label": "Quantity",
2327
- "name": "quantity"
2303
+ "name": "quantity",
2304
+ "label": "Quantity"
2328
2305
  },
2329
2306
  {
2307
+ "variant": "badge",
2330
2308
  "name": "unitPrice",
2331
- "label": "Unit Price",
2332
- "variant": "badge"
2309
+ "label": "Unit Price"
2333
2310
  }
2334
2311
  ]
2335
2312
  },
2336
2313
  {
2337
2314
  "type": "stack",
2338
- "justify": "end",
2339
- "gap": "sm",
2340
- "direction": "horizontal",
2341
2315
  "children": [
2342
2316
  {
2343
- "icon": "arrow-left",
2344
2317
  "label": "Back to Cart",
2345
2318
  "type": "button",
2346
2319
  "variant": "ghost",
2347
- "action": "BACK_TO_CART"
2320
+ "action": "BACK_TO_CART",
2321
+ "icon": "arrow-left"
2348
2322
  },
2349
2323
  {
2350
2324
  "label": "Confirm Order",
2351
- "variant": "primary",
2352
2325
  "action": "CONFIRM_ORDER",
2326
+ "icon": "check",
2353
2327
  "type": "button",
2354
- "icon": "check"
2328
+ "variant": "primary"
2355
2329
  }
2356
- ]
2330
+ ],
2331
+ "direction": "horizontal",
2332
+ "justify": "end",
2333
+ "gap": "sm"
2357
2334
  }
2358
2335
  ],
2359
2336
  "gap": "lg",
2360
2337
  "type": "stack",
2361
2338
  "direction": "vertical"
2362
2339
  }
2340
+ ],
2341
+ "type": "dashboard-layout",
2342
+ "navItems": [
2343
+ {
2344
+ "href": "/products",
2345
+ "label": "Products",
2346
+ "icon": "package"
2347
+ },
2348
+ {
2349
+ "href": "/cart",
2350
+ "icon": "shopping-cart",
2351
+ "label": "Cart"
2352
+ },
2353
+ {
2354
+ "label": "Checkout",
2355
+ "href": "/checkout",
2356
+ "icon": "credit-card"
2357
+ },
2358
+ {
2359
+ "href": "/orders",
2360
+ "label": "Orders",
2361
+ "icon": "clipboard-list"
2362
+ }
2363
2363
  ]
2364
2364
  }
2365
2365
  ]
@@ -2401,46 +2401,17 @@
2401
2401
  "render-ui",
2402
2402
  "main",
2403
2403
  {
2404
- "children": [
2405
- {
2406
- "gap": "lg",
2407
- "align": "center",
2408
- "direction": "vertical",
2409
- "children": [
2410
- {
2411
- "type": "icon",
2412
- "name": "check-circle"
2413
- },
2414
- {
2415
- "type": "typography",
2416
- "content": "Order Confirmed",
2417
- "variant": "h2"
2418
- },
2419
- {
2420
- "variant": "body",
2421
- "type": "typography",
2422
- "content": "Your order has been placed successfully."
2423
- },
2424
- {
2425
- "type": "button",
2426
- "action": "INIT",
2427
- "variant": "primary",
2428
- "label": "Continue Shopping"
2429
- }
2430
- ],
2431
- "type": "stack"
2432
- }
2433
- ],
2404
+ "appName": "EcommerceApp",
2434
2405
  "navItems": [
2435
2406
  {
2436
- "label": "Products",
2437
2407
  "icon": "package",
2408
+ "label": "Products",
2438
2409
  "href": "/products"
2439
2410
  },
2440
2411
  {
2441
2412
  "href": "/cart",
2442
- "label": "Cart",
2443
- "icon": "shopping-cart"
2413
+ "icon": "shopping-cart",
2414
+ "label": "Cart"
2444
2415
  },
2445
2416
  {
2446
2417
  "icon": "credit-card",
@@ -2454,7 +2425,36 @@
2454
2425
  }
2455
2426
  ],
2456
2427
  "type": "dashboard-layout",
2457
- "appName": "EcommerceApp"
2428
+ "children": [
2429
+ {
2430
+ "type": "stack",
2431
+ "align": "center",
2432
+ "direction": "vertical",
2433
+ "gap": "lg",
2434
+ "children": [
2435
+ {
2436
+ "name": "check-circle",
2437
+ "type": "icon"
2438
+ },
2439
+ {
2440
+ "type": "typography",
2441
+ "content": "Order Confirmed",
2442
+ "variant": "h2"
2443
+ },
2444
+ {
2445
+ "content": "Your order has been placed successfully.",
2446
+ "type": "typography",
2447
+ "variant": "body"
2448
+ },
2449
+ {
2450
+ "label": "Continue Shopping",
2451
+ "type": "button",
2452
+ "variant": "primary",
2453
+ "action": "INIT"
2454
+ }
2455
+ ]
2456
+ }
2457
+ ]
2458
2458
  }
2459
2459
  ]
2460
2460
  ]
@@ -2622,8 +2622,8 @@
2622
2622
  "CartItem",
2623
2623
  {
2624
2624
  "emit": {
2625
- "failure": "CartItemLoadFailed",
2626
- "success": "CartItemLoaded"
2625
+ "success": "CartItemLoaded",
2626
+ "failure": "CartItemLoadFailed"
2627
2627
  }
2628
2628
  }
2629
2629
  ]
@@ -2648,42 +2648,42 @@
2648
2648
  "render-ui",
2649
2649
  "modal",
2650
2650
  {
2651
- "type": "stack",
2652
- "gap": "md",
2653
2651
  "children": [
2654
2652
  {
2655
2653
  "type": "stack",
2656
- "direction": "horizontal",
2657
2654
  "children": [
2658
2655
  {
2659
2656
  "type": "icon",
2660
2657
  "name": "plus-circle"
2661
2658
  },
2662
2659
  {
2663
- "type": "typography",
2664
2660
  "content": "Add Item",
2665
- "variant": "h3"
2661
+ "variant": "h3",
2662
+ "type": "typography"
2666
2663
  }
2667
2664
  ],
2665
+ "direction": "horizontal",
2668
2666
  "gap": "sm"
2669
2667
  },
2670
2668
  {
2671
2669
  "type": "divider"
2672
2670
  },
2673
2671
  {
2674
- "cancelEvent": "CLOSE",
2675
2672
  "fields": [
2676
2673
  "productName",
2677
2674
  "quantity",
2678
2675
  "unitPrice",
2679
2676
  "totalPrice"
2680
2677
  ],
2681
- "mode": "create",
2682
2678
  "submitEvent": "SAVE",
2683
- "type": "form-section"
2679
+ "type": "form-section",
2680
+ "mode": "create",
2681
+ "cancelEvent": "CLOSE"
2684
2682
  }
2685
2683
  ],
2686
- "direction": "vertical"
2684
+ "type": "stack",
2685
+ "direction": "vertical",
2686
+ "gap": "md"
2687
2687
  }
2688
2688
  ]
2689
2689
  ]
@@ -2910,8 +2910,8 @@
2910
2910
  "CartItem",
2911
2911
  {
2912
2912
  "emit": {
2913
- "failure": "CartItemLoadFailed",
2914
- "success": "CartItemLoaded"
2913
+ "success": "CartItemLoaded",
2914
+ "failure": "CartItemLoadFailed"
2915
2915
  }
2916
2916
  }
2917
2917
  ]
@@ -2931,68 +2931,68 @@
2931
2931
  "fetch",
2932
2932
  "CartItem",
2933
2933
  {
2934
+ "id": "@payload.id",
2934
2935
  "emit": {
2935
2936
  "success": "CartItemLoaded",
2936
2937
  "failure": "CartItemLoadFailed"
2937
- },
2938
- "id": "@payload.id"
2938
+ }
2939
2939
  }
2940
2940
  ],
2941
2941
  [
2942
2942
  "render-ui",
2943
2943
  "modal",
2944
2944
  {
2945
- "direction": "vertical",
2946
- "type": "stack",
2947
- "gap": "md",
2948
2945
  "children": [
2949
2946
  {
2947
+ "gap": "sm",
2948
+ "align": "center",
2949
+ "type": "stack",
2950
+ "direction": "horizontal",
2950
2951
  "children": [
2951
2952
  {
2952
2953
  "type": "icon",
2953
2954
  "name": "alert-triangle"
2954
2955
  },
2955
2956
  {
2956
- "content": "Remove Item",
2957
2957
  "type": "typography",
2958
+ "content": "Remove Item",
2958
2959
  "variant": "h3"
2959
2960
  }
2960
- ],
2961
- "type": "stack",
2962
- "direction": "horizontal",
2963
- "gap": "sm",
2964
- "align": "center"
2961
+ ]
2965
2962
  },
2966
2963
  {
2967
2964
  "type": "divider"
2968
2965
  },
2969
2966
  {
2970
- "message": "Are you sure you want to remove this item from your cart?",
2971
2967
  "variant": "error",
2968
+ "message": "Are you sure you want to remove this item from your cart?",
2972
2969
  "type": "alert"
2973
2970
  },
2974
2971
  {
2975
- "justify": "end",
2976
2972
  "children": [
2977
2973
  {
2978
2974
  "variant": "ghost",
2979
2975
  "type": "button",
2980
- "action": "CANCEL",
2981
- "label": "Cancel"
2976
+ "label": "Cancel",
2977
+ "action": "CANCEL"
2982
2978
  },
2983
2979
  {
2984
- "label": "Remove",
2985
2980
  "type": "button",
2986
- "icon": "check",
2981
+ "label": "Remove",
2987
2982
  "action": "CONFIRM_REMOVE",
2983
+ "icon": "check",
2988
2984
  "variant": "danger"
2989
2985
  }
2990
2986
  ],
2991
- "direction": "horizontal",
2992
2987
  "gap": "sm",
2993
- "type": "stack"
2988
+ "type": "stack",
2989
+ "justify": "end",
2990
+ "direction": "horizontal"
2994
2991
  }
2995
- ]
2992
+ ],
2993
+ "type": "stack",
2994
+ "direction": "vertical",
2995
+ "gap": "md"
2996
2996
  }
2997
2997
  ]
2998
2998
  ]
@@ -3089,8 +3089,8 @@
3089
3089
  "CartItem",
3090
3090
  {
3091
3091
  "emit": {
3092
- "success": "CartItemLoaded",
3093
- "failure": "CartItemLoadFailed"
3092
+ "failure": "CartItemLoadFailed",
3093
+ "success": "CartItemLoaded"
3094
3094
  }
3095
3095
  }
3096
3096
  ]
@@ -3165,10 +3165,10 @@
3165
3165
  "ref": "Stripe.traits.ServiceStripeStripe",
3166
3166
  "name": "CheckoutPayment",
3167
3167
  "config": {
3168
- "uiTrait": "@trait.CheckoutPaymentForm",
3169
3168
  "amount": 0.0,
3170
- "metadata": {},
3171
- "currency": "usd"
3169
+ "currency": "usd",
3170
+ "uiTrait": "@trait.CheckoutPaymentForm",
3171
+ "metadata": {}
3172
3172
  },
3173
3173
  "listens": [
3174
3174
  {
@@ -3223,45 +3223,45 @@
3223
3223
  "render-ui",
3224
3224
  "main",
3225
3225
  {
3226
- "type": "stack",
3227
- "gap": "md",
3228
3226
  "children": [
3229
3227
  {
3228
+ "type": "alert",
3230
3229
  "variant": "info",
3231
- "message": "Enter card details to complete your order.",
3232
- "type": "alert"
3230
+ "message": "Enter card details to complete your order."
3233
3231
  },
3234
3232
  {
3235
- "type": "input",
3236
3233
  "inputType": "text",
3237
- "placeholder": "Card number"
3234
+ "placeholder": "Card number",
3235
+ "type": "input"
3238
3236
  },
3239
3237
  {
3240
- "direction": "horizontal",
3241
3238
  "gap": "sm",
3242
- "type": "stack",
3243
3239
  "children": [
3244
3240
  {
3241
+ "inputType": "text",
3245
3242
  "placeholder": "MM/YY",
3246
- "type": "input",
3247
- "inputType": "text"
3243
+ "type": "input"
3248
3244
  },
3249
3245
  {
3246
+ "type": "input",
3250
3247
  "inputType": "text",
3251
- "placeholder": "CVC",
3252
- "type": "input"
3248
+ "placeholder": "CVC"
3253
3249
  }
3254
- ]
3250
+ ],
3251
+ "direction": "horizontal",
3252
+ "type": "stack"
3255
3253
  },
3256
3254
  {
3257
- "label": "Pay now",
3258
- "icon": "credit-card",
3259
- "action": "CREATE_PAYMENT",
3260
3255
  "type": "button",
3261
- "variant": "primary"
3256
+ "variant": "primary",
3257
+ "icon": "credit-card",
3258
+ "label": "Pay now",
3259
+ "action": "CREATE_PAYMENT"
3262
3260
  }
3263
3261
  ],
3264
- "direction": "vertical"
3262
+ "gap": "md",
3263
+ "direction": "vertical",
3264
+ "type": "stack"
3265
3265
  }
3266
3266
  ]
3267
3267
  ]
@@ -3502,46 +3502,54 @@
3502
3502
  "render-ui",
3503
3503
  "main",
3504
3504
  {
3505
- "gap": "lg",
3506
3505
  "type": "stack",
3507
- "direction": "vertical",
3508
- "className": "max-w-xl mx-auto w-full",
3506
+ "gap": "lg",
3509
3507
  "children": [
3510
3508
  {
3509
+ "variant": "h2",
3511
3510
  "content": "Checkout",
3512
- "type": "typography",
3513
- "variant": "h2"
3511
+ "type": "typography"
3514
3512
  },
3515
3513
  {
3514
+ "currentStep": 0.0,
3516
3515
  "type": "wizard-progress",
3517
3516
  "steps": [
3518
3517
  "Customer Info",
3519
3518
  "Shipping",
3520
3519
  "Payment",
3521
3520
  "Review"
3522
- ],
3523
- "currentStep": 0.0
3521
+ ]
3524
3522
  },
3525
3523
  {
3526
3524
  "type": "divider"
3527
3525
  },
3528
3526
  {
3527
+ "variant": "h3",
3529
3528
  "type": "typography",
3530
- "content": "Customer Info",
3531
- "variant": "h3"
3529
+ "content": "Customer Info"
3532
3530
  },
3533
3531
  {
3534
- "type": "form-section",
3535
- "submitLabel": "Continue",
3532
+ "submitEvent": "NEXT",
3536
3533
  "showCancel": false,
3534
+ "type": "form-section",
3537
3535
  "fields": [
3538
- "customerName",
3539
- "email"
3536
+ {
3537
+ "min": 2.0,
3538
+ "required": true,
3539
+ "name": "customerName"
3540
+ },
3541
+ {
3542
+ "type": "email",
3543
+ "name": "email",
3544
+ "required": true
3545
+ }
3540
3546
  ],
3541
3547
  "mode": "create",
3542
- "submitEvent": "NEXT"
3548
+ "submitLabel": "Continue"
3543
3549
  }
3544
- ]
3550
+ ],
3551
+ "direction": "vertical",
3552
+ "className": "max-w-xl mx-auto w-full"
3545
3553
  }
3546
3554
  ]
3547
3555
  ]
@@ -3550,6 +3558,11 @@
3550
3558
  "from": "step1",
3551
3559
  "to": "step2",
3552
3560
  "event": "NEXT",
3561
+ "guard": [
3562
+ "and",
3563
+ "@payload.data.customerName",
3564
+ "@payload.data.email"
3565
+ ],
3553
3566
  "effects": [
3554
3567
  [
3555
3568
  "set",
@@ -3566,14 +3579,12 @@
3566
3579
  "main",
3567
3580
  {
3568
3581
  "type": "stack",
3569
- "gap": "lg",
3570
3582
  "direction": "vertical",
3571
- "className": "max-w-xl mx-auto w-full",
3572
3583
  "children": [
3573
3584
  {
3574
- "type": "typography",
3575
3585
  "content": "Checkout",
3576
- "variant": "h2"
3586
+ "variant": "h2",
3587
+ "type": "typography"
3577
3588
  },
3578
3589
  {
3579
3590
  "steps": [
@@ -3582,30 +3593,36 @@
3582
3593
  "Payment",
3583
3594
  "Review"
3584
3595
  ],
3585
- "type": "wizard-progress",
3586
- "currentStep": 1.0
3596
+ "currentStep": 1.0,
3597
+ "type": "wizard-progress"
3587
3598
  },
3588
3599
  {
3589
3600
  "type": "divider"
3590
3601
  },
3591
3602
  {
3592
- "content": "Shipping Address",
3593
3603
  "type": "typography",
3594
- "variant": "h3"
3604
+ "variant": "h3",
3605
+ "content": "Shipping Address"
3595
3606
  },
3596
3607
  {
3608
+ "type": "form-section",
3609
+ "cancelEvent": "PREV",
3610
+ "entity": "@entity",
3597
3611
  "fields": [
3598
- "shippingAddress"
3612
+ {
3613
+ "required": true,
3614
+ "min": 5.0,
3615
+ "name": "shippingAddress"
3616
+ }
3599
3617
  ],
3600
3618
  "submitEvent": "NEXT",
3601
3619
  "submitLabel": "Continue",
3602
3620
  "mode": "edit",
3603
- "cancelLabel": "Back",
3604
- "cancelEvent": "PREV",
3605
- "entity": "@entity",
3606
- "type": "form-section"
3621
+ "cancelLabel": "Back"
3607
3622
  }
3608
- ]
3623
+ ],
3624
+ "className": "max-w-xl mx-auto w-full",
3625
+ "gap": "lg"
3609
3626
  }
3610
3627
  ]
3611
3628
  ]
@@ -3614,6 +3631,7 @@
3614
3631
  "from": "step2",
3615
3632
  "to": "step3",
3616
3633
  "event": "NEXT",
3634
+ "guard": "@payload.data.shippingAddress",
3617
3635
  "effects": [
3618
3636
  [
3619
3637
  "set",
@@ -3624,8 +3642,10 @@
3624
3642
  "render-ui",
3625
3643
  "main",
3626
3644
  {
3627
- "className": "max-w-xl mx-auto w-full",
3645
+ "direction": "vertical",
3646
+ "gap": "lg",
3628
3647
  "type": "stack",
3648
+ "className": "max-w-xl mx-auto w-full",
3629
3649
  "children": [
3630
3650
  {
3631
3651
  "type": "typography",
@@ -3633,14 +3653,14 @@
3633
3653
  "variant": "h2"
3634
3654
  },
3635
3655
  {
3636
- "currentStep": 2.0,
3637
- "type": "wizard-progress",
3638
3656
  "steps": [
3639
3657
  "Customer Info",
3640
3658
  "Shipping",
3641
3659
  "Payment",
3642
3660
  "Review"
3643
- ]
3661
+ ],
3662
+ "currentStep": 2.0,
3663
+ "type": "wizard-progress"
3644
3664
  },
3645
3665
  {
3646
3666
  "type": "divider"
@@ -3653,22 +3673,20 @@
3653
3673
  "@trait.CheckoutPayment",
3654
3674
  {
3655
3675
  "direction": "horizontal",
3676
+ "type": "stack",
3677
+ "justify": "start",
3678
+ "gap": "sm",
3656
3679
  "children": [
3657
3680
  {
3658
3681
  "icon": "arrow-left",
3659
- "variant": "ghost",
3660
- "label": "Back",
3661
3682
  "type": "button",
3662
- "action": "PREV"
3663
- }
3664
- ],
3665
- "gap": "sm",
3666
- "justify": "start",
3667
- "type": "stack"
3683
+ "label": "Back",
3684
+ "action": "PREV",
3685
+ "variant": "ghost"
3686
+ }
3687
+ ]
3668
3688
  }
3669
- ],
3670
- "gap": "lg",
3671
- "direction": "vertical"
3689
+ ]
3672
3690
  }
3673
3691
  ]
3674
3692
  ]
@@ -3682,7 +3700,10 @@
3682
3700
  "render-ui",
3683
3701
  "main",
3684
3702
  {
3703
+ "type": "stack",
3685
3704
  "direction": "vertical",
3705
+ "gap": "lg",
3706
+ "className": "max-w-xl mx-auto w-full",
3686
3707
  "children": [
3687
3708
  {
3688
3709
  "content": "Checkout",
@@ -3690,39 +3711,44 @@
3690
3711
  "variant": "h2"
3691
3712
  },
3692
3713
  {
3714
+ "type": "wizard-progress",
3693
3715
  "steps": [
3694
3716
  "Customer Info",
3695
3717
  "Shipping",
3696
3718
  "Payment",
3697
3719
  "Review"
3698
3720
  ],
3699
- "currentStep": 0.0,
3700
- "type": "wizard-progress"
3721
+ "currentStep": 0.0
3701
3722
  },
3702
3723
  {
3703
3724
  "type": "divider"
3704
3725
  },
3705
3726
  {
3727
+ "content": "Customer Info",
3706
3728
  "type": "typography",
3707
- "variant": "h3",
3708
- "content": "Customer Info"
3729
+ "variant": "h3"
3709
3730
  },
3710
3731
  {
3711
- "mode": "edit",
3732
+ "submitLabel": "Continue",
3733
+ "entity": "@entity",
3712
3734
  "fields": [
3713
- "customerName",
3714
- "email"
3735
+ {
3736
+ "name": "customerName",
3737
+ "required": true,
3738
+ "min": 2.0
3739
+ },
3740
+ {
3741
+ "name": "email",
3742
+ "type": "email",
3743
+ "required": true
3744
+ }
3715
3745
  ],
3746
+ "mode": "edit",
3716
3747
  "type": "form-section",
3717
- "entity": "@entity",
3718
3748
  "showCancel": false,
3719
- "submitEvent": "NEXT",
3720
- "submitLabel": "Continue"
3749
+ "submitEvent": "NEXT"
3721
3750
  }
3722
- ],
3723
- "className": "max-w-xl mx-auto w-full",
3724
- "type": "stack",
3725
- "gap": "lg"
3751
+ ]
3726
3752
  }
3727
3753
  ]
3728
3754
  ]
@@ -3738,132 +3764,132 @@
3738
3764
  {
3739
3765
  "direction": "vertical",
3740
3766
  "type": "stack",
3741
- "className": "max-w-xl mx-auto w-full",
3742
- "gap": "lg",
3743
3767
  "children": [
3744
3768
  {
3745
3769
  "type": "typography",
3746
- "variant": "h2",
3747
- "content": "Review your order"
3770
+ "content": "Review your order",
3771
+ "variant": "h2"
3748
3772
  },
3749
3773
  {
3774
+ "currentStep": 3.0,
3775
+ "type": "wizard-progress",
3750
3776
  "steps": [
3751
3777
  "Customer Info",
3752
3778
  "Shipping",
3753
3779
  "Payment",
3754
3780
  "Review"
3755
- ],
3756
- "type": "wizard-progress",
3757
- "currentStep": 3.0
3781
+ ]
3758
3782
  },
3759
3783
  {
3760
3784
  "type": "divider"
3761
3785
  },
3762
3786
  {
3787
+ "type": "stack",
3788
+ "gap": "sm",
3763
3789
  "children": [
3764
3790
  {
3791
+ "justify": "between",
3792
+ "direction": "horizontal",
3793
+ "gap": "md",
3765
3794
  "type": "stack",
3766
3795
  "children": [
3767
3796
  {
3768
3797
  "content": "Customer",
3769
- "variant": "caption",
3770
- "type": "typography"
3798
+ "type": "typography",
3799
+ "variant": "caption"
3771
3800
  },
3772
3801
  {
3773
- "variant": "body",
3774
3802
  "type": "typography",
3803
+ "variant": "body",
3775
3804
  "content": "@entity.customerName"
3776
3805
  }
3777
- ],
3778
- "gap": "md",
3779
- "justify": "between",
3780
- "direction": "horizontal"
3806
+ ]
3781
3807
  },
3782
3808
  {
3783
- "direction": "horizontal",
3784
- "type": "stack",
3785
- "gap": "md",
3786
3809
  "justify": "between",
3810
+ "gap": "md",
3787
3811
  "children": [
3788
3812
  {
3789
- "type": "typography",
3790
3813
  "variant": "caption",
3791
- "content": "Email"
3814
+ "content": "Email",
3815
+ "type": "typography"
3792
3816
  },
3793
3817
  {
3794
- "variant": "body",
3795
3818
  "content": "@entity.email",
3796
- "type": "typography"
3819
+ "type": "typography",
3820
+ "variant": "body"
3797
3821
  }
3798
- ]
3822
+ ],
3823
+ "direction": "horizontal",
3824
+ "type": "stack"
3799
3825
  },
3800
3826
  {
3801
3827
  "direction": "horizontal",
3802
3828
  "type": "stack",
3829
+ "justify": "between",
3830
+ "gap": "md",
3803
3831
  "children": [
3804
3832
  {
3805
- "type": "typography",
3806
3833
  "variant": "caption",
3834
+ "type": "typography",
3807
3835
  "content": "Shipping"
3808
3836
  },
3809
3837
  {
3838
+ "type": "typography",
3810
3839
  "content": "@entity.shippingAddress",
3811
- "variant": "body",
3812
- "type": "typography"
3840
+ "variant": "body"
3813
3841
  }
3814
- ],
3815
- "gap": "md",
3816
- "justify": "between"
3842
+ ]
3817
3843
  },
3818
3844
  {
3845
+ "direction": "horizontal",
3846
+ "gap": "md",
3819
3847
  "justify": "between",
3820
3848
  "children": [
3821
3849
  {
3850
+ "content": "Order total",
3822
3851
  "type": "typography",
3823
- "variant": "caption",
3824
- "content": "Order total"
3852
+ "variant": "caption"
3825
3853
  },
3826
3854
  {
3827
- "type": "typography",
3828
3855
  "variant": "body",
3856
+ "type": "typography",
3829
3857
  "content": "@entity.orderTotal"
3830
3858
  }
3831
3859
  ],
3832
- "type": "stack",
3833
- "direction": "horizontal",
3834
- "gap": "md"
3860
+ "type": "stack"
3835
3861
  }
3836
3862
  ],
3837
- "gap": "sm",
3838
- "direction": "vertical",
3839
- "type": "stack"
3863
+ "direction": "vertical"
3840
3864
  },
3841
3865
  {
3842
3866
  "type": "divider"
3843
3867
  },
3844
3868
  {
3845
- "gap": "sm",
3846
3869
  "children": [
3847
3870
  {
3848
- "type": "button",
3849
- "icon": "arrow-left",
3850
- "variant": "ghost",
3851
3871
  "label": "Back",
3872
+ "variant": "ghost",
3873
+ "icon": "arrow-left",
3874
+ "type": "button",
3852
3875
  "action": "PREV"
3853
3876
  },
3854
3877
  {
3855
- "type": "button",
3856
3878
  "label": "Place order",
3857
3879
  "action": "COMPLETE",
3880
+ "type": "button",
3858
3881
  "variant": "primary",
3859
3882
  "icon": "check"
3860
3883
  }
3861
3884
  ],
3862
3885
  "type": "stack",
3886
+ "justify": "between",
3863
3887
  "direction": "horizontal",
3864
- "justify": "between"
3888
+ "gap": "sm"
3865
3889
  }
3866
- ]
3890
+ ],
3891
+ "gap": "lg",
3892
+ "className": "max-w-xl mx-auto w-full"
3867
3893
  }
3868
3894
  ]
3869
3895
  ]
@@ -3878,45 +3904,49 @@
3878
3904
  "main",
3879
3905
  {
3880
3906
  "gap": "lg",
3881
- "type": "stack",
3882
- "className": "max-w-xl mx-auto w-full",
3883
3907
  "children": [
3884
3908
  {
3909
+ "content": "Checkout",
3885
3910
  "type": "typography",
3886
- "variant": "h2",
3887
- "content": "Checkout"
3911
+ "variant": "h2"
3888
3912
  },
3889
3913
  {
3890
- "type": "wizard-progress",
3891
3914
  "steps": [
3892
3915
  "Customer Info",
3893
3916
  "Shipping",
3894
3917
  "Payment",
3895
3918
  "Review"
3896
3919
  ],
3897
- "currentStep": 1.0
3920
+ "currentStep": 1.0,
3921
+ "type": "wizard-progress"
3898
3922
  },
3899
3923
  {
3900
3924
  "type": "divider"
3901
3925
  },
3902
3926
  {
3903
- "content": "Shipping Address",
3904
3927
  "type": "typography",
3905
- "variant": "h3"
3928
+ "variant": "h3",
3929
+ "content": "Shipping Address"
3906
3930
  },
3907
3931
  {
3932
+ "cancelLabel": "Back",
3908
3933
  "submitEvent": "NEXT",
3909
- "submitLabel": "Continue",
3910
- "type": "form-section",
3934
+ "mode": "edit",
3935
+ "entity": "@entity",
3936
+ "cancelEvent": "PREV",
3911
3937
  "fields": [
3912
- "shippingAddress"
3938
+ {
3939
+ "min": 5.0,
3940
+ "name": "shippingAddress",
3941
+ "required": true
3942
+ }
3913
3943
  ],
3914
- "cancelLabel": "Back",
3915
- "entity": "@entity",
3916
- "mode": "edit",
3917
- "cancelEvent": "PREV"
3944
+ "type": "form-section",
3945
+ "submitLabel": "Continue"
3918
3946
  }
3919
3947
  ],
3948
+ "className": "max-w-xl mx-auto w-full",
3949
+ "type": "stack",
3920
3950
  "direction": "vertical"
3921
3951
  }
3922
3952
  ]
@@ -3926,6 +3956,12 @@
3926
3956
  "from": "review",
3927
3957
  "to": "complete",
3928
3958
  "event": "COMPLETE",
3959
+ "guard": [
3960
+ "and",
3961
+ "@entity.customerName",
3962
+ "@entity.email",
3963
+ "@entity.shippingAddress"
3964
+ ],
3929
3965
  "effects": [
3930
3966
  [
3931
3967
  "set",
@@ -3939,8 +3975,8 @@
3939
3975
  "@entity",
3940
3976
  {
3941
3977
  "emit": {
3942
- "failure": "CheckoutSaveFailed",
3943
- "success": "CheckoutSaved"
3978
+ "success": "CheckoutSaved",
3979
+ "failure": "CheckoutSaveFailed"
3944
3980
  }
3945
3981
  }
3946
3982
  ],
@@ -3960,35 +3996,35 @@
3960
3996
  "render-ui",
3961
3997
  "main",
3962
3998
  {
3963
- "align": "center",
3964
3999
  "className": "max-w-xl mx-auto w-full py-12",
3965
- "type": "stack",
3966
- "gap": "lg",
3967
4000
  "children": [
3968
4001
  {
3969
4002
  "type": "icon",
3970
4003
  "name": "check-circle"
3971
4004
  },
3972
4005
  {
3973
- "type": "typography",
4006
+ "content": "Order placed",
3974
4007
  "variant": "h2",
3975
- "content": "Order placed"
4008
+ "type": "typography"
3976
4009
  },
3977
4010
  {
3978
4011
  "content": "Your order is confirmed and on its way.",
4012
+ "variant": "body",
3979
4013
  "color": "muted",
3980
- "type": "typography",
3981
- "variant": "body"
4014
+ "type": "typography"
3982
4015
  },
3983
4016
  {
3984
- "icon": "rotate-ccw",
4017
+ "type": "button",
3985
4018
  "action": "RESTART",
4019
+ "label": "Start new order",
3986
4020
  "variant": "ghost",
3987
- "type": "button",
3988
- "label": "Start new order"
4021
+ "icon": "rotate-ccw"
3989
4022
  }
3990
4023
  ],
3991
- "direction": "vertical"
4024
+ "direction": "vertical",
4025
+ "type": "stack",
4026
+ "gap": "lg",
4027
+ "align": "center"
3992
4028
  }
3993
4029
  ]
3994
4030
  ]
@@ -4002,51 +4038,51 @@
4002
4038
  "render-ui",
4003
4039
  "main",
4004
4040
  {
4005
- "direction": "vertical",
4006
4041
  "gap": "lg",
4007
- "className": "max-w-xl mx-auto w-full",
4008
- "type": "stack",
4009
4042
  "children": [
4010
4043
  {
4011
- "variant": "h2",
4044
+ "content": "Checkout",
4012
4045
  "type": "typography",
4013
- "content": "Checkout"
4046
+ "variant": "h2"
4014
4047
  },
4015
4048
  {
4016
- "currentStep": 2.0,
4017
4049
  "steps": [
4018
4050
  "Customer Info",
4019
4051
  "Shipping",
4020
4052
  "Payment",
4021
4053
  "Review"
4022
4054
  ],
4055
+ "currentStep": 2.0,
4023
4056
  "type": "wizard-progress"
4024
4057
  },
4025
4058
  {
4026
4059
  "type": "divider"
4027
4060
  },
4028
4061
  {
4029
- "content": "Payment",
4030
4062
  "variant": "h3",
4063
+ "content": "Payment",
4031
4064
  "type": "typography"
4032
4065
  },
4033
4066
  "@trait.CheckoutPayment",
4034
4067
  {
4035
4068
  "justify": "start",
4069
+ "direction": "horizontal",
4070
+ "type": "stack",
4036
4071
  "children": [
4037
4072
  {
4073
+ "variant": "ghost",
4074
+ "label": "Back",
4038
4075
  "type": "button",
4039
4076
  "action": "PREV",
4040
- "variant": "ghost",
4041
- "icon": "arrow-left",
4042
- "label": "Back"
4077
+ "icon": "arrow-left"
4043
4078
  }
4044
4079
  ],
4045
- "type": "stack",
4046
- "gap": "sm",
4047
- "direction": "horizontal"
4080
+ "gap": "sm"
4048
4081
  }
4049
- ]
4082
+ ],
4083
+ "type": "stack",
4084
+ "direction": "vertical",
4085
+ "className": "max-w-xl mx-auto w-full"
4050
4086
  }
4051
4087
  ]
4052
4088
  ]
@@ -4086,14 +4122,11 @@
4086
4122
  "main",
4087
4123
  {
4088
4124
  "className": "max-w-xl mx-auto w-full",
4089
- "type": "stack",
4090
- "gap": "lg",
4091
- "direction": "vertical",
4092
4125
  "children": [
4093
4126
  {
4094
- "type": "typography",
4127
+ "content": "Checkout",
4095
4128
  "variant": "h2",
4096
- "content": "Checkout"
4129
+ "type": "typography"
4097
4130
  },
4098
4131
  {
4099
4132
  "type": "wizard-progress",
@@ -4109,22 +4142,33 @@
4109
4142
  "type": "divider"
4110
4143
  },
4111
4144
  {
4112
- "type": "typography",
4145
+ "variant": "h3",
4113
4146
  "content": "Customer Info",
4114
- "variant": "h3"
4147
+ "type": "typography"
4115
4148
  },
4116
4149
  {
4117
- "mode": "create",
4118
- "type": "form-section",
4119
- "submitEvent": "NEXT",
4120
4150
  "showCancel": false,
4121
4151
  "fields": [
4122
- "customerName",
4123
- "email"
4152
+ {
4153
+ "name": "customerName",
4154
+ "required": true,
4155
+ "min": 2.0
4156
+ },
4157
+ {
4158
+ "name": "email",
4159
+ "type": "email",
4160
+ "required": true
4161
+ }
4124
4162
  ],
4125
- "submitLabel": "Continue"
4163
+ "submitEvent": "NEXT",
4164
+ "mode": "create",
4165
+ "submitLabel": "Continue",
4166
+ "type": "form-section"
4126
4167
  }
4127
- ]
4168
+ ],
4169
+ "type": "stack",
4170
+ "direction": "vertical",
4171
+ "gap": "lg"
4128
4172
  }
4129
4173
  ]
4130
4174
  ]
@@ -4475,8 +4519,8 @@
4475
4519
  "OrderRecord",
4476
4520
  {
4477
4521
  "emit": {
4478
- "failure": "OrderRecordLoadFailed",
4479
- "success": "OrderRecordLoaded"
4522
+ "success": "OrderRecordLoaded",
4523
+ "failure": "OrderRecordLoadFailed"
4480
4524
  }
4481
4525
  }
4482
4526
  ],
@@ -4485,21 +4529,21 @@
4485
4529
  "main",
4486
4530
  {
4487
4531
  "type": "stack",
4532
+ "direction": "vertical",
4488
4533
  "gap": "md",
4489
4534
  "className": "py-12",
4490
- "align": "center",
4491
4535
  "children": [
4492
4536
  {
4493
4537
  "type": "spinner"
4494
4538
  },
4495
4539
  {
4496
- "content": "Loading…",
4497
- "variant": "caption",
4498
4540
  "color": "muted",
4499
- "type": "typography"
4541
+ "content": "Loading…",
4542
+ "type": "typography",
4543
+ "variant": "caption"
4500
4544
  }
4501
4545
  ],
4502
- "direction": "vertical"
4546
+ "align": "center"
4503
4547
  }
4504
4548
  ]
4505
4549
  ]
@@ -4515,74 +4559,62 @@
4515
4559
  {
4516
4560
  "children": [
4517
4561
  {
4562
+ "className": "max-w-5xl mx-auto w-full",
4563
+ "direction": "vertical",
4564
+ "gap": "lg",
4518
4565
  "children": [
4519
4566
  {
4520
- "align": "center",
4521
4567
  "gap": "md",
4522
- "direction": "horizontal",
4523
4568
  "type": "stack",
4569
+ "align": "center",
4570
+ "justify": "between",
4524
4571
  "children": [
4525
4572
  {
4526
- "gap": "sm",
4527
- "direction": "horizontal",
4528
- "align": "center",
4529
4573
  "type": "stack",
4530
4574
  "children": [
4531
4575
  {
4532
- "name": "clipboard-list",
4533
- "type": "icon"
4576
+ "type": "icon",
4577
+ "name": "clipboard-list"
4534
4578
  },
4535
4579
  {
4536
- "variant": "h2",
4580
+ "type": "typography",
4537
4581
  "content": "Order History",
4538
- "type": "typography"
4582
+ "variant": "h2"
4539
4583
  }
4540
- ]
4584
+ ],
4585
+ "gap": "sm",
4586
+ "direction": "horizontal",
4587
+ "align": "center"
4541
4588
  },
4542
4589
  {
4543
- "type": "stack",
4544
4590
  "gap": "sm",
4591
+ "direction": "horizontal",
4545
4592
  "children": [
4546
4593
  {
4547
4594
  "icon": "plus",
4548
- "action": "CREATE",
4595
+ "label": "Create OrderRecord",
4549
4596
  "type": "button",
4550
4597
  "variant": "primary",
4551
- "label": "Create OrderRecord"
4598
+ "action": "CREATE"
4552
4599
  }
4553
4600
  ],
4554
- "direction": "horizontal"
4601
+ "type": "stack"
4555
4602
  }
4556
4603
  ],
4557
- "justify": "between"
4604
+ "direction": "horizontal"
4558
4605
  },
4559
4606
  {
4560
4607
  "type": "divider"
4561
4608
  },
4562
4609
  {
4563
- "itemActions": [
4564
- {
4565
- "variant": "ghost",
4566
- "event": "VIEW",
4567
- "label": "View"
4568
- },
4569
- {
4570
- "event": "EDIT",
4571
- "variant": "ghost",
4572
- "label": "Edit"
4573
- },
4574
- {
4575
- "variant": "danger",
4576
- "label": "Delete",
4577
- "event": "DELETE"
4578
- }
4579
- ],
4580
- "type": "data-list",
4610
+ "variant": "card",
4611
+ "entity": "@payload.data",
4612
+ "gap": "sm",
4581
4613
  "fields": [
4582
4614
  {
4583
4615
  "name": "customerName",
4584
- "variant": "h3",
4585
4616
  "label": "Customer",
4617
+ "variant": "h3",
4586
4618
  "icon": "clipboard-list"
4587
4619
  },
4588
4620
  {
@@ -4592,35 +4624,49 @@
4592
4624
  {
4593
4625
  "name": "orderTotal",
4594
4626
  "format": "currency",
4595
- "label": "Total",
4596
- "variant": "h4"
4627
+ "variant": "h4",
4628
+ "label": "Total"
4597
4629
  },
4598
4630
  {
4599
- "variant": "caption",
4600
- "name": "email"
4631
+ "name": "email",
4632
+ "variant": "caption"
4601
4633
  },
4602
4634
  {
4603
- "label": "Address",
4604
4635
  "name": "shippingAddress",
4636
+ "label": "Address",
4605
4637
  "variant": "caption"
4606
4638
  }
4607
4639
  ],
4608
- "variant": "card",
4609
- "gap": "sm",
4610
- "entity": "@payload.data"
4640
+ "type": "data-list",
4641
+ "itemActions": [
4642
+ {
4643
+ "event": "VIEW",
4644
+ "variant": "ghost",
4645
+ "label": "View"
4646
+ },
4647
+ {
4648
+ "event": "EDIT",
4649
+ "variant": "ghost",
4650
+ "label": "Edit"
4651
+ },
4652
+ {
4653
+ "variant": "danger",
4654
+ "label": "Delete",
4655
+ "event": "DELETE"
4656
+ }
4657
+ ]
4611
4658
  }
4612
4659
  ],
4613
- "gap": "lg",
4614
- "direction": "vertical",
4615
- "className": "max-w-5xl mx-auto w-full",
4616
4660
  "type": "stack"
4617
4661
  }
4618
4662
  ],
4663
+ "appName": "EcommerceApp",
4664
+ "type": "dashboard-layout",
4619
4665
  "navItems": [
4620
4666
  {
4667
+ "icon": "package",
4621
4668
  "label": "Products",
4622
- "href": "/products",
4623
- "icon": "package"
4669
+ "href": "/products"
4624
4670
  },
4625
4671
  {
4626
4672
  "label": "Cart",
@@ -4629,17 +4675,15 @@
4629
4675
  },
4630
4676
  {
4631
4677
  "label": "Checkout",
4632
- "href": "/checkout",
4633
- "icon": "credit-card"
4678
+ "icon": "credit-card",
4679
+ "href": "/checkout"
4634
4680
  },
4635
4681
  {
4636
- "href": "/orders",
4637
4682
  "label": "Orders",
4683
+ "href": "/orders",
4638
4684
  "icon": "clipboard-list"
4639
4685
  }
4640
- ],
4641
- "appName": "EcommerceApp",
4642
- "type": "dashboard-layout"
4686
+ ]
4643
4687
  }
4644
4688
  ]
4645
4689
  ]
@@ -4653,10 +4697,8 @@
4653
4697
  "render-ui",
4654
4698
  "main",
4655
4699
  {
4656
- "className": "py-12",
4657
- "gap": "md",
4658
- "align": "center",
4659
4700
  "type": "stack",
4701
+ "className": "py-12",
4660
4702
  "children": [
4661
4703
  {
4662
4704
  "name": "alert-triangle",
@@ -4664,24 +4706,26 @@
4664
4706
  "type": "icon"
4665
4707
  },
4666
4708
  {
4667
- "content": "Failed to load orderrecord",
4668
4709
  "variant": "h3",
4710
+ "content": "Failed to load orderrecord",
4669
4711
  "type": "typography"
4670
4712
  },
4671
4713
  {
4672
- "type": "typography",
4673
- "color": "muted",
4714
+ "variant": "body",
4674
4715
  "content": "@payload.error",
4675
- "variant": "body"
4716
+ "type": "typography",
4717
+ "color": "muted"
4676
4718
  },
4677
4719
  {
4720
+ "label": "Retry",
4678
4721
  "icon": "rotate-ccw",
4722
+ "action": "INIT",
4679
4723
  "type": "button",
4680
- "label": "Retry",
4681
- "variant": "primary",
4682
- "action": "INIT"
4724
+ "variant": "primary"
4683
4725
  }
4684
4726
  ],
4727
+ "align": "center",
4728
+ "gap": "md",
4685
4729
  "direction": "vertical"
4686
4730
  }
4687
4731
  ]
@@ -4857,8 +4901,8 @@
4857
4901
  "OrderRecord",
4858
4902
  {
4859
4903
  "emit": {
4860
- "failure": "OrderRecordLoadFailed",
4861
- "success": "OrderRecordLoaded"
4904
+ "success": "OrderRecordLoaded",
4905
+ "failure": "OrderRecordLoadFailed"
4862
4906
  }
4863
4907
  }
4864
4908
  ]
@@ -4874,8 +4918,8 @@
4874
4918
  "OrderRecord",
4875
4919
  {
4876
4920
  "emit": {
4877
- "success": "OrderRecordLoaded",
4878
- "failure": "OrderRecordLoadFailed"
4921
+ "failure": "OrderRecordLoadFailed",
4922
+ "success": "OrderRecordLoaded"
4879
4923
  }
4880
4924
  }
4881
4925
  ],
@@ -4883,12 +4927,11 @@
4883
4927
  "render-ui",
4884
4928
  "modal",
4885
4929
  {
4886
- "gap": "md",
4887
- "direction": "vertical",
4930
+ "type": "stack",
4888
4931
  "children": [
4889
4932
  {
4890
- "gap": "sm",
4891
4933
  "direction": "horizontal",
4934
+ "gap": "sm",
4892
4935
  "type": "stack",
4893
4936
  "children": [
4894
4937
  {
@@ -4906,7 +4949,10 @@
4906
4949
  "type": "divider"
4907
4950
  },
4908
4951
  {
4952
+ "mode": "create",
4909
4953
  "cancelEvent": "CLOSE",
4954
+ "submitEvent": "SAVE",
4955
+ "type": "form-section",
4910
4956
  "fields": [
4911
4957
  "customerName",
4912
4958
  "email",
@@ -4914,13 +4960,11 @@
4914
4960
  "paymentMethod",
4915
4961
  "orderTotal",
4916
4962
  "status"
4917
- ],
4918
- "type": "form-section",
4919
- "mode": "create",
4920
- "submitEvent": "SAVE"
4963
+ ]
4921
4964
  }
4922
4965
  ],
4923
- "type": "stack"
4966
+ "direction": "vertical",
4967
+ "gap": "md"
4924
4968
  }
4925
4969
  ]
4926
4970
  ]
@@ -5199,30 +5243,31 @@
5199
5243
  "render-ui",
5200
5244
  "modal",
5201
5245
  {
5202
- "type": "stack",
5203
- "gap": "md",
5204
- "direction": "vertical",
5205
5246
  "children": [
5206
5247
  {
5248
+ "gap": "sm",
5207
5249
  "type": "stack",
5250
+ "direction": "horizontal",
5208
5251
  "children": [
5209
5252
  {
5210
- "type": "icon",
5211
- "name": "edit"
5253
+ "name": "edit",
5254
+ "type": "icon"
5212
5255
  },
5213
5256
  {
5214
- "type": "typography",
5215
5257
  "content": "Edit OrderRecord",
5216
- "variant": "h3"
5258
+ "variant": "h3",
5259
+ "type": "typography"
5217
5260
  }
5218
- ],
5219
- "gap": "sm",
5220
- "direction": "horizontal"
5261
+ ]
5221
5262
  },
5222
5263
  {
5223
5264
  "type": "divider"
5224
5265
  },
5225
5266
  {
5267
+ "entity": "@payload.row",
5268
+ "type": "form-section",
5269
+ "submitEvent": "SAVE",
5270
+ "cancelEvent": "CLOSE",
5226
5271
  "fields": [
5227
5272
  "customerName",
5228
5273
  "email",
@@ -5231,13 +5276,12 @@
5231
5276
  "orderTotal",
5232
5277
  "status"
5233
5278
  ],
5234
- "cancelEvent": "CLOSE",
5235
- "entity": "@payload.row",
5236
- "submitEvent": "SAVE",
5237
- "mode": "edit",
5238
- "type": "form-section"
5279
+ "mode": "edit"
5239
5280
  }
5240
- ]
5281
+ ],
5282
+ "direction": "vertical",
5283
+ "type": "stack",
5284
+ "gap": "md"
5241
5285
  }
5242
5286
  ]
5243
5287
  ]
@@ -5459,8 +5503,8 @@
5459
5503
  "OrderRecord",
5460
5504
  {
5461
5505
  "emit": {
5462
- "failure": "OrderRecordLoadFailed",
5463
- "success": "OrderRecordLoaded"
5506
+ "success": "OrderRecordLoaded",
5507
+ "failure": "OrderRecordLoadFailed"
5464
5508
  }
5465
5509
  }
5466
5510
  ]
@@ -5475,58 +5519,60 @@
5475
5519
  "fetch",
5476
5520
  "OrderRecord",
5477
5521
  {
5478
- "id": "@payload.id",
5479
5522
  "emit": {
5480
5523
  "failure": "OrderRecordLoadFailed",
5481
5524
  "success": "OrderRecordLoaded"
5482
- }
5525
+ },
5526
+ "id": "@payload.id"
5483
5527
  }
5484
5528
  ],
5485
5529
  [
5486
5530
  "render-ui",
5487
5531
  "modal",
5488
5532
  {
5533
+ "type": "stack",
5534
+ "direction": "vertical",
5535
+ "gap": "md",
5489
5536
  "children": [
5490
5537
  {
5538
+ "gap": "sm",
5491
5539
  "type": "stack",
5540
+ "direction": "horizontal",
5541
+ "align": "center",
5492
5542
  "children": [
5493
5543
  {
5494
5544
  "name": "eye",
5495
5545
  "type": "icon"
5496
5546
  },
5497
5547
  {
5548
+ "type": "typography",
5498
5549
  "variant": "h3",
5499
- "content": "@entity.customerName",
5500
- "type": "typography"
5550
+ "content": "@entity.customerName"
5501
5551
  }
5502
- ],
5503
- "gap": "sm",
5504
- "align": "center",
5505
- "direction": "horizontal"
5552
+ ]
5506
5553
  },
5507
5554
  {
5508
5555
  "type": "divider"
5509
5556
  },
5510
5557
  {
5511
- "direction": "horizontal",
5512
- "gap": "md",
5513
5558
  "children": [
5514
5559
  {
5515
- "content": "Customer Name",
5516
5560
  "type": "typography",
5561
+ "content": "Customer Name",
5517
5562
  "variant": "caption"
5518
5563
  },
5519
5564
  {
5520
- "content": "@entity.customerName",
5521
5565
  "type": "typography",
5522
- "variant": "body"
5566
+ "variant": "body",
5567
+ "content": "@entity.customerName"
5523
5568
  }
5524
5569
  ],
5525
- "type": "stack"
5570
+ "gap": "md",
5571
+ "type": "stack",
5572
+ "direction": "horizontal"
5526
5573
  },
5527
5574
  {
5528
5575
  "type": "stack",
5529
- "gap": "md",
5530
5576
  "children": [
5531
5577
  {
5532
5578
  "type": "typography",
@@ -5534,53 +5580,56 @@
5534
5580
  "content": "Email"
5535
5581
  },
5536
5582
  {
5537
- "type": "typography",
5583
+ "content": "@entity.email",
5538
5584
  "variant": "body",
5539
- "content": "@entity.email"
5585
+ "type": "typography"
5540
5586
  }
5541
5587
  ],
5588
+ "gap": "md",
5542
5589
  "direction": "horizontal"
5543
5590
  },
5544
5591
  {
5592
+ "direction": "horizontal",
5593
+ "type": "stack",
5545
5594
  "gap": "md",
5546
5595
  "children": [
5547
5596
  {
5548
5597
  "type": "typography",
5549
- "variant": "caption",
5550
- "content": "Shipping Address"
5598
+ "content": "Shipping Address",
5599
+ "variant": "caption"
5551
5600
  },
5552
5601
  {
5553
5602
  "variant": "body",
5554
5603
  "content": "@entity.shippingAddress",
5555
5604
  "type": "typography"
5556
5605
  }
5557
- ],
5558
- "direction": "horizontal",
5559
- "type": "stack"
5606
+ ]
5560
5607
  },
5561
5608
  {
5609
+ "type": "stack",
5610
+ "direction": "horizontal",
5562
5611
  "children": [
5563
5612
  {
5564
5613
  "type": "typography",
5565
- "variant": "caption",
5566
- "content": "Payment Method"
5614
+ "content": "Payment Method",
5615
+ "variant": "caption"
5567
5616
  },
5568
5617
  {
5569
5618
  "variant": "body",
5570
- "content": "@entity.paymentMethod",
5571
- "type": "typography"
5619
+ "type": "typography",
5620
+ "content": "@entity.paymentMethod"
5572
5621
  }
5573
5622
  ],
5574
- "type": "stack",
5575
- "direction": "horizontal",
5576
5623
  "gap": "md"
5577
5624
  },
5578
5625
  {
5626
+ "type": "stack",
5627
+ "gap": "md",
5579
5628
  "children": [
5580
5629
  {
5581
- "type": "typography",
5630
+ "content": "Order Total",
5582
5631
  "variant": "caption",
5583
- "content": "Order Total"
5632
+ "type": "typography"
5584
5633
  },
5585
5634
  {
5586
5635
  "type": "typography",
@@ -5588,55 +5637,50 @@
5588
5637
  "content": "@entity.orderTotal"
5589
5638
  }
5590
5639
  ],
5591
- "gap": "md",
5592
- "type": "stack",
5593
5640
  "direction": "horizontal"
5594
5641
  },
5595
5642
  {
5643
+ "type": "stack",
5644
+ "direction": "horizontal",
5596
5645
  "gap": "md",
5597
5646
  "children": [
5598
5647
  {
5599
- "variant": "caption",
5600
5648
  "type": "typography",
5649
+ "variant": "caption",
5601
5650
  "content": "Status"
5602
5651
  },
5603
5652
  {
5604
- "content": "@entity.status",
5653
+ "type": "typography",
5605
5654
  "variant": "body",
5606
- "type": "typography"
5655
+ "content": "@entity.status"
5607
5656
  }
5608
- ],
5609
- "direction": "horizontal",
5610
- "type": "stack"
5657
+ ]
5611
5658
  },
5612
5659
  {
5613
5660
  "type": "divider"
5614
5661
  },
5615
5662
  {
5663
+ "gap": "sm",
5616
5664
  "direction": "horizontal",
5617
- "type": "stack",
5618
5665
  "children": [
5619
5666
  {
5620
- "variant": "primary",
5621
5667
  "icon": "edit",
5622
5668
  "type": "button",
5623
- "action": "EDIT",
5624
- "label": "Edit"
5669
+ "variant": "primary",
5670
+ "label": "Edit",
5671
+ "action": "EDIT"
5625
5672
  },
5626
5673
  {
5627
- "label": "Close",
5628
- "type": "button",
5629
5674
  "action": "CLOSE",
5675
+ "type": "button",
5676
+ "label": "Close",
5630
5677
  "variant": "ghost"
5631
5678
  }
5632
5679
  ],
5633
- "justify": "end",
5634
- "gap": "sm"
5680
+ "type": "stack",
5681
+ "justify": "end"
5635
5682
  }
5636
- ],
5637
- "type": "stack",
5638
- "direction": "vertical",
5639
- "gap": "md"
5683
+ ]
5640
5684
  }
5641
5685
  ]
5642
5686
  ]
@@ -5858,8 +5902,8 @@
5858
5902
  "OrderRecord",
5859
5903
  {
5860
5904
  "emit": {
5861
- "success": "OrderRecordLoaded",
5862
- "failure": "OrderRecordLoadFailed"
5905
+ "failure": "OrderRecordLoadFailed",
5906
+ "success": "OrderRecordLoaded"
5863
5907
  }
5864
5908
  }
5865
5909
  ]
@@ -5879,23 +5923,21 @@
5879
5923
  "fetch",
5880
5924
  "OrderRecord",
5881
5925
  {
5882
- "id": "@payload.id",
5883
5926
  "emit": {
5884
5927
  "failure": "OrderRecordLoadFailed",
5885
5928
  "success": "OrderRecordLoaded"
5886
- }
5929
+ },
5930
+ "id": "@payload.id"
5887
5931
  }
5888
5932
  ],
5889
5933
  [
5890
5934
  "render-ui",
5891
5935
  "modal",
5892
5936
  {
5937
+ "gap": "md",
5893
5938
  "type": "stack",
5894
5939
  "children": [
5895
5940
  {
5896
- "direction": "horizontal",
5897
- "gap": "sm",
5898
- "type": "stack",
5899
5941
  "align": "center",
5900
5942
  "children": [
5901
5943
  {
@@ -5903,44 +5945,46 @@
5903
5945
  "type": "icon"
5904
5946
  },
5905
5947
  {
5906
- "content": "Delete OrderRecord",
5907
5948
  "type": "typography",
5949
+ "content": "Delete OrderRecord",
5908
5950
  "variant": "h3"
5909
5951
  }
5910
- ]
5952
+ ],
5953
+ "gap": "sm",
5954
+ "type": "stack",
5955
+ "direction": "horizontal"
5911
5956
  },
5912
5957
  {
5913
5958
  "type": "divider"
5914
5959
  },
5915
5960
  {
5916
5961
  "type": "alert",
5917
- "variant": "error",
5918
- "message": "This action cannot be undone."
5962
+ "message": "This action cannot be undone.",
5963
+ "variant": "error"
5919
5964
  },
5920
5965
  {
5921
- "direction": "horizontal",
5922
- "justify": "end",
5966
+ "gap": "sm",
5923
5967
  "children": [
5924
5968
  {
5925
- "variant": "ghost",
5926
- "action": "CANCEL",
5927
5969
  "type": "button",
5928
- "label": "Cancel"
5970
+ "label": "Cancel",
5971
+ "variant": "ghost",
5972
+ "action": "CANCEL"
5929
5973
  },
5930
5974
  {
5931
- "action": "CONFIRM_DELETE",
5932
- "type": "button",
5933
5975
  "variant": "danger",
5976
+ "type": "button",
5934
5977
  "label": "Delete",
5935
- "icon": "check"
5978
+ "icon": "check",
5979
+ "action": "CONFIRM_DELETE"
5936
5980
  }
5937
5981
  ],
5938
- "gap": "sm",
5939
- "type": "stack"
5982
+ "direction": "horizontal",
5983
+ "type": "stack",
5984
+ "justify": "end"
5940
5985
  }
5941
5986
  ],
5942
- "direction": "vertical",
5943
- "gap": "md"
5987
+ "direction": "vertical"
5944
5988
  }
5945
5989
  ]
5946
5990
  ]
@@ -5979,8 +6023,8 @@
5979
6023
  "OrderRecord",
5980
6024
  {
5981
6025
  "emit": {
5982
- "failure": "OrderRecordLoadFailed",
5983
- "success": "OrderRecordLoaded"
6026
+ "success": "OrderRecordLoaded",
6027
+ "failure": "OrderRecordLoadFailed"
5984
6028
  }
5985
6029
  }
5986
6030
  ],
@@ -6012,8 +6056,8 @@
6012
6056
  "OrderRecord",
6013
6057
  {
6014
6058
  "emit": {
6015
- "failure": "OrderRecordLoadFailed",
6016
- "success": "OrderRecordLoaded"
6059
+ "success": "OrderRecordLoaded",
6060
+ "failure": "OrderRecordLoadFailed"
6017
6061
  }
6018
6062
  }
6019
6063
  ]
@@ -6041,8 +6085,8 @@
6041
6085
  "OrderRecord",
6042
6086
  {
6043
6087
  "emit": {
6044
- "failure": "OrderRecordLoadFailed",
6045
- "success": "OrderRecordLoaded"
6088
+ "success": "OrderRecordLoaded",
6089
+ "failure": "OrderRecordLoadFailed"
6046
6090
  }
6047
6091
  }
6048
6092
  ]