optikos 0.2.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (46) hide show
  1. package/CHANGELOG.md +18 -1
  2. package/dist/{chunk-3DBEZGOY.js → chunk-2YZB6XQR.js} +2 -2
  3. package/dist/{chunk-ATFJ7PNA.js → chunk-4EQEHJB3.js} +2 -2
  4. package/dist/{chunk-CUN5QO4T.js → chunk-EJGWCKE4.js} +2 -2
  5. package/dist/chunk-GD5JGKM7.js +2 -0
  6. package/dist/chunk-GD5JGKM7.js.map +7 -0
  7. package/dist/{chunk-II6ITOA6.js → chunk-Q26YZYTD.js} +2 -2
  8. package/dist/{chunk-GBPLNXMP.js → chunk-UB5RYS7T.js} +2 -2
  9. package/dist/{chunk-BXYWVRKJ.js → chunk-UXXJOU5J.js} +2 -2
  10. package/dist/chunk-W2BAFOCN.js +3 -0
  11. package/dist/chunk-W2BAFOCN.js.map +7 -0
  12. package/dist/chunk-WFGTQZIQ.js +2 -0
  13. package/dist/chunk-WFGTQZIQ.js.map +7 -0
  14. package/dist/{chunk-VF7BGP6L.js → chunk-YF75HKL6.js} +2 -2
  15. package/dist/components/breadcrumb.js +1 -1
  16. package/dist/components/filterbuilder.js +1 -1
  17. package/dist/components/grid.js +1 -1
  18. package/dist/components/lookupfield.js +1 -1
  19. package/dist/components/menu.js +1 -1
  20. package/dist/components/navmenu.js +1 -1
  21. package/dist/components/searchgrid.js +1 -1
  22. package/dist/components/stepform.js +1 -1
  23. package/dist/components/viewmanager.js +1 -1
  24. package/dist/css/menu.css +9 -0
  25. package/dist/css/navmenu.css +9 -7
  26. package/dist/css/stepform.css +9 -0
  27. package/dist/index.js +1 -1
  28. package/dist/optikos.css +27 -7
  29. package/dist/types/components/form/stepform/stepform.d.ts +28 -4
  30. package/dist/types/components/navigation/navmenu/navmenu.d.ts +6 -0
  31. package/dist/types/components/overlays/menu/menu.d.ts +2 -0
  32. package/dist/ui.js +1 -1
  33. package/package.json +1 -1
  34. package/dist/chunk-27UZFEXD.js +0 -2
  35. package/dist/chunk-27UZFEXD.js.map +0 -7
  36. package/dist/chunk-5YS7OD5E.js +0 -2
  37. package/dist/chunk-5YS7OD5E.js.map +0 -7
  38. package/dist/chunk-FHM5NUS4.js +0 -3
  39. package/dist/chunk-FHM5NUS4.js.map +0 -7
  40. /package/dist/{chunk-3DBEZGOY.js.map → chunk-2YZB6XQR.js.map} +0 -0
  41. /package/dist/{chunk-ATFJ7PNA.js.map → chunk-4EQEHJB3.js.map} +0 -0
  42. /package/dist/{chunk-CUN5QO4T.js.map → chunk-EJGWCKE4.js.map} +0 -0
  43. /package/dist/{chunk-II6ITOA6.js.map → chunk-Q26YZYTD.js.map} +0 -0
  44. /package/dist/{chunk-GBPLNXMP.js.map → chunk-UB5RYS7T.js.map} +0 -0
  45. /package/dist/{chunk-BXYWVRKJ.js.map → chunk-UXXJOU5J.js.map} +0 -0
  46. /package/dist/{chunk-VF7BGP6L.js.map → chunk-YF75HKL6.js.map} +0 -0
@@ -1,2 +1,2 @@
1
- import{a}from"../chunk-3DBEZGOY.js";import"../chunk-7KMIFXHZ.js";import"../chunk-3TAW4AKH.js";import"../chunk-FHM5NUS4.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-G2DAD3MQ.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-5JEXM5S7.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as FilterBuilder};
1
+ import{a}from"../chunk-2YZB6XQR.js";import"../chunk-7KMIFXHZ.js";import"../chunk-3TAW4AKH.js";import"../chunk-W2BAFOCN.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-G2DAD3MQ.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-5JEXM5S7.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as FilterBuilder};
2
2
  //# sourceMappingURL=filterbuilder.js.map
@@ -1,2 +1,2 @@
1
- import{a}from"../chunk-VF7BGP6L.js";import"../chunk-ZVK4L5GK.js";import"../chunk-FHM5NUS4.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-OWEQT2HN.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-LW2WRUVL.js";import"../chunk-OEAXCCVM.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as Grid};
1
+ import{a}from"../chunk-YF75HKL6.js";import"../chunk-ZVK4L5GK.js";import"../chunk-W2BAFOCN.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-OWEQT2HN.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-LW2WRUVL.js";import"../chunk-OEAXCCVM.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as Grid};
2
2
  //# sourceMappingURL=grid.js.map
@@ -1,2 +1,2 @@
1
- import{a}from"../chunk-GBPLNXMP.js";import"../chunk-TZOQWCVH.js";import"../chunk-EV73ADN2.js";import"../chunk-5Q76ACVI.js";import"../chunk-CUN5QO4T.js";import"../chunk-VF7BGP6L.js";import"../chunk-4LZZ244E.js";import"../chunk-LQRFNQ2N.js";import"../chunk-XYZ6VZ5T.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-ZVK4L5GK.js";import"../chunk-FHM5NUS4.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-OWEQT2HN.js";import"../chunk-ZWNQREWS.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-LW2WRUVL.js";import"../chunk-OEAXCCVM.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as LookupField};
1
+ import{a}from"../chunk-UB5RYS7T.js";import"../chunk-TZOQWCVH.js";import"../chunk-EV73ADN2.js";import"../chunk-5Q76ACVI.js";import"../chunk-EJGWCKE4.js";import"../chunk-YF75HKL6.js";import"../chunk-4LZZ244E.js";import"../chunk-LQRFNQ2N.js";import"../chunk-XYZ6VZ5T.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-ZVK4L5GK.js";import"../chunk-W2BAFOCN.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-OWEQT2HN.js";import"../chunk-ZWNQREWS.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-LW2WRUVL.js";import"../chunk-OEAXCCVM.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as LookupField};
2
2
  //# sourceMappingURL=lookupfield.js.map
@@ -1,2 +1,2 @@
1
- import{a}from"../chunk-FHM5NUS4.js";import"../chunk-Z2JBUHKA.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as Menu};
1
+ import{a}from"../chunk-W2BAFOCN.js";import"../chunk-Z2JBUHKA.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as Menu};
2
2
  //# sourceMappingURL=menu.js.map
@@ -1,2 +1,2 @@
1
- import{a}from"../chunk-5YS7OD5E.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as NavMenu};
1
+ import{a}from"../chunk-GD5JGKM7.js";import"../chunk-W2BAFOCN.js";import"../chunk-Z2JBUHKA.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as NavMenu};
2
2
  //# sourceMappingURL=navmenu.js.map
@@ -1,2 +1,2 @@
1
- import{a,b,c,d}from"../chunk-CUN5QO4T.js";import"../chunk-VF7BGP6L.js";import"../chunk-ZVK4L5GK.js";import"../chunk-FHM5NUS4.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-OWEQT2HN.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-LW2WRUVL.js";import"../chunk-OEAXCCVM.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{d as SearchGrid,c as lookupStore,a as registerLookup,b as resolveLookup};
1
+ import{a,b,c,d}from"../chunk-EJGWCKE4.js";import"../chunk-YF75HKL6.js";import"../chunk-ZVK4L5GK.js";import"../chunk-W2BAFOCN.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-OWEQT2HN.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-LW2WRUVL.js";import"../chunk-OEAXCCVM.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{d as SearchGrid,c as lookupStore,a as registerLookup,b as resolveLookup};
2
2
  //# sourceMappingURL=searchgrid.js.map
@@ -1,2 +1,2 @@
1
- import{a}from"../chunk-27UZFEXD.js";import"../chunk-JOFQJGZK.js";import"../chunk-ELYARUCN.js";import"../chunk-VU3GIDZ3.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-ZWNQREWS.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as StepForm};
1
+ import{a}from"../chunk-WFGTQZIQ.js";import"../chunk-JOFQJGZK.js";import"../chunk-ELYARUCN.js";import"../chunk-VU3GIDZ3.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-ZWNQREWS.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as StepForm};
2
2
  //# sourceMappingURL=stepform.js.map
@@ -1,2 +1,2 @@
1
- import{a,b,c}from"../chunk-BXYWVRKJ.js";import"../chunk-KLLAY2IM.js";import"../chunk-4LZZ244E.js";import"../chunk-LQRFNQ2N.js";import"../chunk-XYZ6VZ5T.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-YHEMA56R.js";import"../chunk-FHM5NUS4.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-ZWNQREWS.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{c as ViewManager,a as localViewStorage,b as restViewStorage};
1
+ import{a,b,c}from"../chunk-UXXJOU5J.js";import"../chunk-KLLAY2IM.js";import"../chunk-4LZZ244E.js";import"../chunk-LQRFNQ2N.js";import"../chunk-XYZ6VZ5T.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-YHEMA56R.js";import"../chunk-W2BAFOCN.js";import"../chunk-Z2JBUHKA.js";import"../chunk-W3H7GTJY.js";import"../chunk-ZWNQREWS.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-2ZRNGG2N.js";import"../chunk-2ZUZ5HDL.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-4EZJ5FKJ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{c as ViewManager,a as localViewStorage,b as restViewStorage};
2
2
  //# sourceMappingURL=viewmanager.js.map
package/dist/css/menu.css CHANGED
@@ -89,4 +89,13 @@
89
89
  letter-spacing: var(--op-menu-group-tracking);
90
90
  text-transform: uppercase;
91
91
  }
92
+ .op-menu__badge {
93
+ min-inline-size: var(--op-space-4);
94
+ padding: 0 var(--op-space-1);
95
+ color: var(--op-menu-badge-fg, var(--op-color-primary-fg));
96
+ background: var(--op-menu-badge-bg, var(--op-color-primary));
97
+ border-radius: var(--op-radius-pill);
98
+ font-size: var(--op-font-size-sm);
99
+ text-align: center;
100
+ }
92
101
  }
@@ -95,19 +95,21 @@
95
95
  inline-size: var(--op-navmenu-rail-width);
96
96
  }
97
97
  .op-navmenu.is-rail .op-navmenu__text,
98
- .op-navmenu.is-rail .op-navmenu__chevron,
99
- .op-navmenu.is-rail .op-navmenu__item.is-group .op-navmenu__icon {
98
+ .op-navmenu.is-rail .op-navmenu__chevron {
100
99
  display: none;
101
100
  }
102
101
  .op-navmenu.is-rail .op-navmenu__item {
103
102
  justify-content: center;
104
103
  padding-inline: 0;
105
104
  }
106
- .op-navmenu.is-rail .op-navmenu__item.is-group {
107
- min-block-size: var(--op-space-3);
108
- border-block-start: var(--op-border-width) solid var(--op-color-border);
109
- border-radius: 0;
110
- pointer-events: none;
105
+ /* in the rail a group is an icon that opens a floating menu; it lights up when the active page is inside */
106
+ .op-navmenu.is-rail .op-navmenu__item.is-group .op-navmenu__icon {
107
+ font-weight: var(--op-font-weight-bold);
108
+ }
109
+ .op-navmenu.is-rail .op-navmenu__item.has-active,
110
+ .op-navmenu.is-rail .op-navmenu__item[aria-expanded='true'] {
111
+ color: var(--op-navmenu-active-fg, var(--op-color-primary));
112
+ background: var(--op-navmenu-active-bg, var(--op-color-primary-soft));
111
113
  }
112
114
  .op-navmenu.is-rail .op-navmenu__badge {
113
115
  display: none;
@@ -43,4 +43,13 @@
43
43
  margin: 0;
44
44
  overflow-wrap: anywhere;
45
45
  }
46
+ /* a step's general message (its validate returned a string) */
47
+ .op-stepform__note {
48
+ margin-block-end: var(--op-space-3);
49
+ padding: var(--op-space-2) var(--op-space-3);
50
+ color: var(--op-color-danger);
51
+ background: var(--op-color-danger-soft);
52
+ border-radius: var(--op-radius);
53
+ font-size: var(--op-font-size-sm);
54
+ }
46
55
  }
package/dist/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import{a as Gr,b as Jr}from"./chunk-IHE2MQ3W.js";import{a as Kr,b as Nr}from"./chunk-SA53QUBF.js";import{a as Or}from"./chunk-5BC72727.js";import{a as Sr}from"./chunk-II6ITOA6.js";import{a as qr}from"./chunk-5YS7OD5E.js";import{a as zr}from"./chunk-CKXS375P.js";import{a as Fr}from"./chunk-4SYIIX5A.js";import{a as Lr}from"./chunk-5QUY72FX.js";import{a as Rr}from"./chunk-27UZFEXD.js";import{a as Mr}from"./chunk-JOFQJGZK.js";import"./chunk-ELYARUCN.js";import{a as Ir}from"./chunk-REW4LR46.js";import{a as Pr}from"./chunk-TOLTUOZS.js";import{a as wr}from"./chunk-RNN55473.js";import{a as Cr}from"./chunk-LBJSMXLV.js";import{a as Dr}from"./chunk-3S24ZRPK.js";import{a as Br}from"./chunk-YBAYEU25.js";import{a as Hr}from"./chunk-HOF4JGMQ.js";import{a as $r}from"./chunk-JBLRAM7Z.js";import{a as jr}from"./chunk-DBMWS3O5.js";import{a as Vr,b as Er,c as kr}from"./chunk-BXYWVRKJ.js";import{a as Ar}from"./chunk-5DJTP53N.js";import{a as lr}from"./chunk-ZPPELYNJ.js";import{a as gr,b as hr}from"./chunk-XX2MVWFS.js";import{a as yr}from"./chunk-FEHGU6EP.js";import{a as Tr}from"./chunk-KCEUD232.js";import{a as br}from"./chunk-M242VYZA.js";import{a as vr}from"./chunk-3DBEZGOY.js";import{a as C}from"./chunk-GZ7X34QP.js";import{a as K,b as N}from"./chunk-X2ASKUFD.js";import"./chunk-X6AULZI4.js";import{a as tr,b as mr,c as pr,d as fr,e as nr,f as xr,g as ir,h as sr,i as ar,j as cr,k as ur}from"./chunk-ATFJ7PNA.js";import{a as Do}from"./chunk-HXDTGP2K.js";import{a as er}from"./chunk-VU3GIDZ3.js";import{a as Ho}from"./chunk-6VBK2I5B.js";import{a as _o}from"./chunk-NXSTUFS7.js";import{a as Ro}from"./chunk-G2KUK6AT.js";import{a as or}from"./chunk-Z2Z52GFT.js";import{a as jo}from"./chunk-XHOBNSBO.js";import{a as Co}from"./chunk-I4SP6JTU.js";import{a as Bo}from"./chunk-OGRFQTXA.js";import{a as Io}from"./chunk-JI265XFO.js";import{a as wo}from"./chunk-EDUMAMK4.js";import{a as rr}from"./chunk-JK74QK3M.js";import{a as Xo}from"./chunk-GBPLNXMP.js";import{a as Po}from"./chunk-TZOQWCVH.js";import{a as Mo}from"./chunk-EV73ADN2.js";import{a as Lo}from"./chunk-5Q76ACVI.js";import{a as Oo,b as Qo,c as Uo,d as Wo}from"./chunk-CUN5QO4T.js";import{a as No}from"./chunk-VF7BGP6L.js";import{a as Zo}from"./chunk-KLLAY2IM.js";import{a as Go}from"./chunk-4LZZ244E.js";import{a as Fo}from"./chunk-LQRFNQ2N.js";import"./chunk-XYZ6VZ5T.js";import{a as qo}from"./chunk-GNU4VOOE.js";import{a as So}from"./chunk-23XLG2EM.js";import{a as Yo}from"./chunk-YHEMA56R.js";import{a as Jo}from"./chunk-ZVK4L5GK.js";import{a as Vo}from"./chunk-7KMIFXHZ.js";import{a as Ao}from"./chunk-3TAW4AKH.js";import{a as Ko}from"./chunk-FHM5NUS4.js";import{a as Eo}from"./chunk-Z2JBUHKA.js";import{a as $o}from"./chunk-W3H7GTJY.js";import{a as ko}from"./chunk-G2DAD3MQ.js";import{a as S,b as q}from"./chunk-OWEQT2HN.js";import{a as E,b as k,c as A}from"./chunk-ZWNQREWS.js";import{a as L,b as M}from"./chunk-E4VNLYO2.js";import{a as D,b as B,c as H}from"./chunk-676AKAGF.js";import{a as R,b as I,c as P}from"./chunk-VV7CFMPZ.js";import{a as w}from"./chunk-2ZRNGG2N.js";import{i as z}from"./chunk-5JEXM5S7.js";import{a as O,b as Q,c as U}from"./chunk-LW2WRUVL.js";import{a as F,b as G,c as J}from"./chunk-OEAXCCVM.js";import{a as no,b as xo,c as io,d as so,e as ao,f as co,g as uo,h as lo,i as go,j as ho}from"./chunk-6NCXO5ZP.js";import{a as dr}from"./chunk-MB3MU6HR.js";import{a as zo}from"./chunk-2ZUZ5HDL.js";import{a as Z,b as _,c as oo,d as ro,e as eo,f as to,g as mo,h as po,i as fo}from"./chunk-4AA4FQEM.js";import{a as W,b as X,c as Y}from"./chunk-2UPUC4RK.js";import{a as yo,b as To,c as bo,d as vo}from"./chunk-4EZJ5FKJ.js";import{a as v}from"./chunk-A2NKDOYN.js";import{a,b as c,c as u,d as m,e as d,f as l}from"./chunk-PZSHOSOS.js";import{a as $,b as j,c as V}from"./chunk-TIPK3SCJ.js";import{a as s,b as g,c as h,d as y,e as T,f as b}from"./chunk-MW3RWBZ7.js";import"./chunk-4C666HHU.js";function x(e,t="custom"){let p=[];for(let r in e){let o=e[r];if(o!=null)if(typeof o!="object")p.push(` --op-${m(r)}: ${o};`);else for(let n in o)p.push(` --op-${m(r)}-${m(n)}: ${o[n]};`)}let f=`@layer optikos {
1
+ import{a as Gr,b as Jr}from"./chunk-IHE2MQ3W.js";import{a as Kr,b as Nr}from"./chunk-SA53QUBF.js";import{a as Or}from"./chunk-5BC72727.js";import{a as Sr}from"./chunk-Q26YZYTD.js";import{a as qr}from"./chunk-GD5JGKM7.js";import{a as zr}from"./chunk-CKXS375P.js";import{a as Fr}from"./chunk-4SYIIX5A.js";import{a as Lr}from"./chunk-5QUY72FX.js";import{a as Rr}from"./chunk-WFGTQZIQ.js";import{a as Mr}from"./chunk-JOFQJGZK.js";import"./chunk-ELYARUCN.js";import{a as Ir}from"./chunk-REW4LR46.js";import{a as Pr}from"./chunk-TOLTUOZS.js";import{a as wr}from"./chunk-RNN55473.js";import{a as Cr}from"./chunk-LBJSMXLV.js";import{a as Dr}from"./chunk-3S24ZRPK.js";import{a as Br}from"./chunk-YBAYEU25.js";import{a as Hr}from"./chunk-HOF4JGMQ.js";import{a as $r}from"./chunk-JBLRAM7Z.js";import{a as jr}from"./chunk-DBMWS3O5.js";import{a as Vr,b as Er,c as kr}from"./chunk-UXXJOU5J.js";import{a as Ar}from"./chunk-5DJTP53N.js";import{a as lr}from"./chunk-ZPPELYNJ.js";import{a as gr,b as hr}from"./chunk-XX2MVWFS.js";import{a as yr}from"./chunk-FEHGU6EP.js";import{a as Tr}from"./chunk-KCEUD232.js";import{a as br}from"./chunk-M242VYZA.js";import{a as vr}from"./chunk-2YZB6XQR.js";import{a as C}from"./chunk-GZ7X34QP.js";import{a as K,b as N}from"./chunk-X2ASKUFD.js";import"./chunk-X6AULZI4.js";import{a as tr,b as mr,c as pr,d as fr,e as nr,f as xr,g as ir,h as sr,i as ar,j as cr,k as ur}from"./chunk-4EQEHJB3.js";import{a as Do}from"./chunk-HXDTGP2K.js";import{a as er}from"./chunk-VU3GIDZ3.js";import{a as Ho}from"./chunk-6VBK2I5B.js";import{a as _o}from"./chunk-NXSTUFS7.js";import{a as Ro}from"./chunk-G2KUK6AT.js";import{a as or}from"./chunk-Z2Z52GFT.js";import{a as jo}from"./chunk-XHOBNSBO.js";import{a as Co}from"./chunk-I4SP6JTU.js";import{a as Bo}from"./chunk-OGRFQTXA.js";import{a as Io}from"./chunk-JI265XFO.js";import{a as wo}from"./chunk-EDUMAMK4.js";import{a as rr}from"./chunk-JK74QK3M.js";import{a as Xo}from"./chunk-UB5RYS7T.js";import{a as Po}from"./chunk-TZOQWCVH.js";import{a as Mo}from"./chunk-EV73ADN2.js";import{a as Lo}from"./chunk-5Q76ACVI.js";import{a as Oo,b as Qo,c as Uo,d as Wo}from"./chunk-EJGWCKE4.js";import{a as No}from"./chunk-YF75HKL6.js";import{a as Zo}from"./chunk-KLLAY2IM.js";import{a as Go}from"./chunk-4LZZ244E.js";import{a as Fo}from"./chunk-LQRFNQ2N.js";import"./chunk-XYZ6VZ5T.js";import{a as qo}from"./chunk-GNU4VOOE.js";import{a as So}from"./chunk-23XLG2EM.js";import{a as Yo}from"./chunk-YHEMA56R.js";import{a as Jo}from"./chunk-ZVK4L5GK.js";import{a as Vo}from"./chunk-7KMIFXHZ.js";import{a as Ao}from"./chunk-3TAW4AKH.js";import{a as Ko}from"./chunk-W2BAFOCN.js";import{a as Eo}from"./chunk-Z2JBUHKA.js";import{a as $o}from"./chunk-W3H7GTJY.js";import{a as ko}from"./chunk-G2DAD3MQ.js";import{a as S,b as q}from"./chunk-OWEQT2HN.js";import{a as E,b as k,c as A}from"./chunk-ZWNQREWS.js";import{a as L,b as M}from"./chunk-E4VNLYO2.js";import{a as D,b as B,c as H}from"./chunk-676AKAGF.js";import{a as R,b as I,c as P}from"./chunk-VV7CFMPZ.js";import{a as w}from"./chunk-2ZRNGG2N.js";import{i as z}from"./chunk-5JEXM5S7.js";import{a as O,b as Q,c as U}from"./chunk-LW2WRUVL.js";import{a as F,b as G,c as J}from"./chunk-OEAXCCVM.js";import{a as no,b as xo,c as io,d as so,e as ao,f as co,g as uo,h as lo,i as go,j as ho}from"./chunk-6NCXO5ZP.js";import{a as dr}from"./chunk-MB3MU6HR.js";import{a as zo}from"./chunk-2ZUZ5HDL.js";import{a as Z,b as _,c as oo,d as ro,e as eo,f as to,g as mo,h as po,i as fo}from"./chunk-4AA4FQEM.js";import{a as W,b as X,c as Y}from"./chunk-2UPUC4RK.js";import{a as yo,b as To,c as bo,d as vo}from"./chunk-4EZJ5FKJ.js";import{a as v}from"./chunk-A2NKDOYN.js";import{a,b as c,c as u,d as m,e as d,f as l}from"./chunk-PZSHOSOS.js";import{a as $,b as j,c as V}from"./chunk-TIPK3SCJ.js";import{a as s,b as g,c as h,d as y,e as T,f as b}from"./chunk-MW3RWBZ7.js";import"./chunk-4C666HHU.js";function x(e,t="custom"){let p=[];for(let r in e){let o=e[r];if(o!=null)if(typeof o!="object")p.push(` --op-${m(r)}: ${o};`);else for(let n in o)p.push(` --op-${m(r)}-${m(n)}: ${o[n]};`)}let f=`@layer optikos {
2
2
  [data-op-theme~='${t}'] {
3
3
  ${p.join(`
4
4
  `)}
package/dist/optikos.css CHANGED
@@ -3048,6 +3048,15 @@
3048
3048
  margin: 0;
3049
3049
  overflow-wrap: anywhere;
3050
3050
  }
3051
+ /* a step's general message (its validate returned a string) */
3052
+ .op-stepform__note {
3053
+ margin-block-end: var(--op-space-3);
3054
+ padding: var(--op-space-2) var(--op-space-3);
3055
+ color: var(--op-color-danger);
3056
+ background: var(--op-color-danger-soft);
3057
+ border-radius: var(--op-radius);
3058
+ font-size: var(--op-font-size-sm);
3059
+ }
3051
3060
  }
3052
3061
 
3053
3062
  @layer optikos {
@@ -3394,19 +3403,21 @@
3394
3403
  inline-size: var(--op-navmenu-rail-width);
3395
3404
  }
3396
3405
  .op-navmenu.is-rail .op-navmenu__text,
3397
- .op-navmenu.is-rail .op-navmenu__chevron,
3398
- .op-navmenu.is-rail .op-navmenu__item.is-group .op-navmenu__icon {
3406
+ .op-navmenu.is-rail .op-navmenu__chevron {
3399
3407
  display: none;
3400
3408
  }
3401
3409
  .op-navmenu.is-rail .op-navmenu__item {
3402
3410
  justify-content: center;
3403
3411
  padding-inline: 0;
3404
3412
  }
3405
- .op-navmenu.is-rail .op-navmenu__item.is-group {
3406
- min-block-size: var(--op-space-3);
3407
- border-block-start: var(--op-border-width) solid var(--op-color-border);
3408
- border-radius: 0;
3409
- pointer-events: none;
3413
+ /* in the rail a group is an icon that opens a floating menu; it lights up when the active page is inside */
3414
+ .op-navmenu.is-rail .op-navmenu__item.is-group .op-navmenu__icon {
3415
+ font-weight: var(--op-font-weight-bold);
3416
+ }
3417
+ .op-navmenu.is-rail .op-navmenu__item.has-active,
3418
+ .op-navmenu.is-rail .op-navmenu__item[aria-expanded='true'] {
3419
+ color: var(--op-navmenu-active-fg, var(--op-color-primary));
3420
+ background: var(--op-navmenu-active-bg, var(--op-color-primary-soft));
3410
3421
  }
3411
3422
  .op-navmenu.is-rail .op-navmenu__badge {
3412
3423
  display: none;
@@ -3918,6 +3929,15 @@
3918
3929
  letter-spacing: var(--op-menu-group-tracking);
3919
3930
  text-transform: uppercase;
3920
3931
  }
3932
+ .op-menu__badge {
3933
+ min-inline-size: var(--op-space-4);
3934
+ padding: 0 var(--op-space-1);
3935
+ color: var(--op-menu-badge-fg, var(--op-color-primary-fg));
3936
+ background: var(--op-menu-badge-bg, var(--op-color-primary));
3937
+ border-radius: var(--op-radius-pill);
3938
+ font-size: var(--op-font-size-sm);
3939
+ text-align: center;
3940
+ }
3921
3941
  }
3922
3942
 
3923
3943
  @layer optikos {
@@ -12,7 +12,14 @@ export interface FormStep {
12
12
  items: ContainerConfig['items'];
13
13
  /** Default: two columns (one on a phone). */
14
14
  layout?: LayoutSpec;
15
+ /**
16
+ * A check that may ask the server (an email already taken, a free slug), run when leaving the step forward and on Finish.
17
+ * Return `true`, a message for the whole step, or `{ field: message }`. The signal aborts when the user goes elsewhere.
18
+ */
19
+ validate?: (values: Record<string, any>, form: StepForm, signal: AbortSignal) => StepCheck | Promise<StepCheck>;
15
20
  }
21
+ /** The result of a step's `validate`: ok, a message for the whole step, or messages per field name. */
22
+ export type StepCheck = true | string | Record<string, string>;
16
23
  export interface StepFormConfig extends FormConfig {
17
24
  steps: FormStep[];
18
25
  /** Moving forward validates the steps on the way. `false` lets the user click any step. Default true. */
@@ -38,6 +45,11 @@ export declare class StepForm extends Form {
38
45
  private nextBtn;
39
46
  private finishBtn;
40
47
  private index;
48
+ /** The step check in flight (Next waits for it; going elsewhere aborts it). */
49
+ private pending?;
50
+ /** Each step's general message (from its `validate`), shown in one alert line above the steps. */
51
+ private notes;
52
+ private noteEl?;
41
53
  constructor(config: StepFormConfig);
42
54
  private cfg;
43
55
  private count;
@@ -48,10 +60,22 @@ export declare class StepForm extends Form {
48
60
  private stepFields;
49
61
  /** Validates one step's fields (marks the errors, sets its state on the stepper). */
50
62
  validateStep(i: number): boolean;
51
- /** Moves to a step. Forward with `linear` validates the steps on the way and stops at the first invalid one. Returns whether it got there. */
52
- goTo(j: number): boolean;
53
- next(): boolean;
54
- back(): boolean;
63
+ /** Sets step `i`'s general message ('' clears it); it shows while that step is the current one. */
64
+ private note;
65
+ private showNote;
66
+ /** Busy while a step check runs: Next and Finish show their loading state. */
67
+ private busy;
68
+ /** Cancels the step check in flight, if any. */
69
+ private stop;
70
+ /** Runs step `k`'s `validate`. A failure marks the fields or shows the step's message. Resolves false when aborted too. */
71
+ private check;
72
+ /**
73
+ * Moves to a step. Forward with `linear` validates the steps on the way (their fields, then their `validate`) and stops
74
+ * at the first invalid one. Resolves with whether it got there; without a step `validate` on the way it moves at once.
75
+ */
76
+ goTo(j: number): Promise<boolean>;
77
+ next(): Promise<boolean>;
78
+ back(): Promise<boolean>;
55
79
  /** The card layout changed the visible step (by `goTo`, or because `validate` brought an invalid field into view). */
56
80
  private onActivate;
57
81
  private refreshReview;
@@ -30,6 +30,10 @@ export declare class NavMenu extends Component<NavMenuConfig> {
30
30
  private query;
31
31
  private focusId?;
32
32
  private root;
33
+ /** Rail mode: the floating menu of a group, and the group it belongs to. */
34
+ private flyout?;
35
+ private flyoutOf?;
36
+ private hoverTimer?;
33
37
  protected onRender(): void;
34
38
  getItem(id: string, list?: NavItem[]): NavItem | undefined;
35
39
  private parentsOf;
@@ -54,6 +58,8 @@ export declare class NavMenu extends Component<NavMenuConfig> {
54
58
  setItems(items: NavItem[]): void;
55
59
  /** Changes an item in place (a badge, a label, disabled...). */
56
60
  updateItem(id: string, patch: Partial<NavItem>): void;
61
+ /** Rail mode: a group's children in a Menu beside its icon (title as the header, badges kept). */
62
+ private openFlyout;
57
63
  setCollapsed(collapsed: boolean): void;
58
64
  /** Hides what does not match and opens the groups that have a match; empty text clears the filter. */
59
65
  filter(text: string): void;
@@ -10,6 +10,8 @@ export interface MenuItem {
10
10
  items?: MenuEntry[];
11
11
  /** Items with the same group sit together under its name (ungrouped items come first). */
12
12
  group?: string;
13
+ /** A count or short label at the end of the row. */
14
+ badge?: string | number;
13
15
  }
14
16
  export type MenuEntry = MenuItem | '-';
15
17
  export interface MenuConfig extends ComponentConfig {
package/dist/ui.js CHANGED
@@ -1,2 +1,2 @@
1
- import{a,b,c,d,e,f,g,h,i,j,k}from"./chunk-ATFJ7PNA.js";import"./chunk-HXDTGP2K.js";import"./chunk-VU3GIDZ3.js";import"./chunk-6VBK2I5B.js";import"./chunk-NXSTUFS7.js";import"./chunk-G2KUK6AT.js";import"./chunk-Z2Z52GFT.js";import"./chunk-XHOBNSBO.js";import"./chunk-I4SP6JTU.js";import"./chunk-OGRFQTXA.js";import"./chunk-JI265XFO.js";import"./chunk-EDUMAMK4.js";import"./chunk-JK74QK3M.js";import"./chunk-GBPLNXMP.js";import"./chunk-TZOQWCVH.js";import"./chunk-EV73ADN2.js";import"./chunk-5Q76ACVI.js";import"./chunk-CUN5QO4T.js";import"./chunk-VF7BGP6L.js";import"./chunk-KLLAY2IM.js";import"./chunk-4LZZ244E.js";import"./chunk-LQRFNQ2N.js";import"./chunk-XYZ6VZ5T.js";import"./chunk-GNU4VOOE.js";import"./chunk-23XLG2EM.js";import"./chunk-YHEMA56R.js";import"./chunk-ZVK4L5GK.js";import"./chunk-7KMIFXHZ.js";import"./chunk-3TAW4AKH.js";import"./chunk-FHM5NUS4.js";import"./chunk-Z2JBUHKA.js";import"./chunk-W3H7GTJY.js";import"./chunk-G2DAD3MQ.js";import"./chunk-OWEQT2HN.js";import"./chunk-ZWNQREWS.js";import"./chunk-E4VNLYO2.js";import"./chunk-676AKAGF.js";import"./chunk-VV7CFMPZ.js";import"./chunk-2ZRNGG2N.js";import"./chunk-5JEXM5S7.js";import"./chunk-LW2WRUVL.js";import"./chunk-OEAXCCVM.js";import"./chunk-6NCXO5ZP.js";import"./chunk-2ZUZ5HDL.js";import"./chunk-4AA4FQEM.js";import"./chunk-2UPUC4RK.js";import"./chunk-4EZJ5FKJ.js";import"./chunk-A2NKDOYN.js";import"./chunk-PZSHOSOS.js";import"./chunk-TIPK3SCJ.js";import"./chunk-MW3RWBZ7.js";import"./chunk-4C666HHU.js";export{d as Direction,c as LabelPos,g as LayoutKind,j as Op,e as Region,h as Selection,f as Side,k as ThemeName,i as ToastType,b as Variant,a as ui};
1
+ import{a,b,c,d,e,f,g,h,i,j,k}from"./chunk-4EQEHJB3.js";import"./chunk-HXDTGP2K.js";import"./chunk-VU3GIDZ3.js";import"./chunk-6VBK2I5B.js";import"./chunk-NXSTUFS7.js";import"./chunk-G2KUK6AT.js";import"./chunk-Z2Z52GFT.js";import"./chunk-XHOBNSBO.js";import"./chunk-I4SP6JTU.js";import"./chunk-OGRFQTXA.js";import"./chunk-JI265XFO.js";import"./chunk-EDUMAMK4.js";import"./chunk-JK74QK3M.js";import"./chunk-UB5RYS7T.js";import"./chunk-TZOQWCVH.js";import"./chunk-EV73ADN2.js";import"./chunk-5Q76ACVI.js";import"./chunk-EJGWCKE4.js";import"./chunk-YF75HKL6.js";import"./chunk-KLLAY2IM.js";import"./chunk-4LZZ244E.js";import"./chunk-LQRFNQ2N.js";import"./chunk-XYZ6VZ5T.js";import"./chunk-GNU4VOOE.js";import"./chunk-23XLG2EM.js";import"./chunk-YHEMA56R.js";import"./chunk-ZVK4L5GK.js";import"./chunk-7KMIFXHZ.js";import"./chunk-3TAW4AKH.js";import"./chunk-W2BAFOCN.js";import"./chunk-Z2JBUHKA.js";import"./chunk-W3H7GTJY.js";import"./chunk-G2DAD3MQ.js";import"./chunk-OWEQT2HN.js";import"./chunk-ZWNQREWS.js";import"./chunk-E4VNLYO2.js";import"./chunk-676AKAGF.js";import"./chunk-VV7CFMPZ.js";import"./chunk-2ZRNGG2N.js";import"./chunk-5JEXM5S7.js";import"./chunk-LW2WRUVL.js";import"./chunk-OEAXCCVM.js";import"./chunk-6NCXO5ZP.js";import"./chunk-2ZUZ5HDL.js";import"./chunk-4AA4FQEM.js";import"./chunk-2UPUC4RK.js";import"./chunk-4EZJ5FKJ.js";import"./chunk-A2NKDOYN.js";import"./chunk-PZSHOSOS.js";import"./chunk-TIPK3SCJ.js";import"./chunk-MW3RWBZ7.js";import"./chunk-4C666HHU.js";export{d as Direction,c as LabelPos,g as LayoutKind,j as Op,e as Region,h as Selection,f as Side,k as ThemeName,i as ToastType,b as Variant,a as ui};
2
2
  //# sourceMappingURL=ui.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "optikos",
3
- "version": "0.2.0",
3
+ "version": "0.3.0",
4
4
  "description": "Declarative UI components in plain TypeScript: forms, grids, windows and themes. No runtime dependencies.",
5
5
  "keywords": [
6
6
  "ui",
@@ -1,2 +0,0 @@
1
- import{a as S}from"./chunk-JOFQJGZK.js";import{a as F}from"./chunk-VU3GIDZ3.js";import{a as w}from"./chunk-GNU4VOOE.js";import{c as f}from"./chunk-ZWNQREWS.js";import{a as y}from"./chunk-2ZRNGG2N.js";import{a as l}from"./chunk-2ZUZ5HDL.js";import{a as v}from"./chunk-A2NKDOYN.js";import{b as p}from"./chunk-PZSHOSOS.js";import{a as x}from"./chunk-TIPK3SCJ.js";import{e as c,f as a}from"./chunk-MW3RWBZ7.js";c("en",{stepBack:"Back",stepNext:"Next",stepFinish:"Finish",stepReview:"Review"});c("pt-BR",{stepBack:"Voltar",stepNext:"Pr\xF3ximo",stepFinish:"Concluir",stepReview:"Revis\xE3o"});var d=class extends v{baseCls="op-stepform__review";setContent(e){this.el.replaceChildren(...e)}},m=class extends F{baseCls="op-form op-stepform";stepper;body;pane;backBtn;nextBtn;finishBtn;index=0;constructor(e){let t,i=e.steps??[],s=e.review?new d:void 0,r=new S({steps:[...i.map(({title:o,description:k,icon:_,optional:A})=>({title:o,description:k,icon:_,optional:A})),...s?[{title:e.reviewTitle??a("stepReview")}]:[]]}),n=[...i.map(o=>({type:"container",title:o.title,cls:"op-stepform__step",layout:o.layout??{type:"grid",columns:2,gap:12},items:o.items})),...s?[{type:"container",title:e.reviewTitle??a("stepReview"),cls:"op-stepform__step",items:[s]}]:[]],h=new f({cls:"op-stepform__body",flex:1,layout:{type:"card"},items:n}),u=new l({text:e.backText??a("stepBack"),handler:()=>t.back()}),b=new l({text:e.nextText??a("stepNext"),variant:"primary",handler:()=>t.next()}),g=new l({text:e.finishText??a("stepFinish"),variant:"primary",htmlType:"submit"}),B=e.cancelText?[new l({text:e.cancelText,variant:"ghost",handler:()=>t.emit("cancel")})]:[],T=new w({cls:"op-stepform__footer",items:[...B,"->",u,b,g]});super({...e,layout:{type:"vbox"},items:[r,h,T]}),t=this,Object.assign(this,{stepper:r,body:h,pane:s,backBtn:u,nextBtn:b,finishBtn:g}),r.on("before-select",o=>(t.goTo(o),!1)),h.on("activate",()=>t.onActivate())}cfg(){return this.config}count(){return this.body.items.length}real(){return this.count()-(this.pane?1:0)}getStep(){return this.index}getStepCount(){return this.count()}getStepper(){return this.stepper}stepFields(e){let t=this.body.items[e];return t instanceof f?t.query(i=>i instanceof y):[]}validateStep(e){if(e>=this.real())return!0;let t=this.stepFields(e).filter(i=>!i.validate());return this.stepper.setStepState(e,t.length?"error":"done"),!t.length}goTo(e){if(e<0||e>=this.count()||e===this.index||this.emit("before-step-change",this.index,e)===!1)return!1;let t=e;if(this.cfg().linear!==!1&&e>this.index){for(let i=this.index;i<e;i++)if(!this.validateStep(i)){t=i;break}}return t!==this.index&&this.body.setActiveItem(t),t!==e&&this.stepFields(t).find(i=>i.getError())?.focus(),t===e}next(){return this.goTo(this.index+1)}back(){return this.goTo(this.index-1)}onActivate(){let e=this.body.items.indexOf(this.body.getActiveItem());if(e<0)return;let t=this.index;this.index=e,this.stepper.setActive(e);let i=this.count()-1;this.backBtn.config.hidden=e===0,this.nextBtn.config.hidden=e===i,this.finishBtn.config.hidden=e!==i;for(let[s,r]of[[this.backBtn,e===0],[this.nextBtn,e===i],[this.finishBtn,e!==i]])s.rendered&&(s.el.hidden=r);if(this.pane&&e===i&&this.refreshReview(),e!==t&&(this.emit("step-change",e,t),this.rendered&&this.el.isConnected&&!this.stepFields(e).some(s=>s.getError()))){let s=this.body.items[e]?.el;this.config.autoFocus?this.stepFields(e)[0]?.focus():s&&(s.tabIndex=-1,s.focus())}}refreshReview(){let e=this.getValues(),t=this.cfg().review;if(typeof t=="function")return this.pane.setContent([t(e,this)]);let i=[];for(let s=0;s<this.real();s++){let r=this.stepFields(s).filter(n=>n.name);r.length&&(i.push(p("h3","op-stepform__review-title",{},String(this.body.items[s].config.title??""))),i.push(p("dl","op-stepform__review-list",{},...r.flatMap(n=>[p("dt","",{},n.config.label??n.config.boxLabel??n.name),p("dd","",{},this.show_(n))]))))}this.pane.setContent(i)}show_(e){let t=e.getValue();if(typeof t=="boolean")return t?"\u2713":"\u2014";if(e.config.inputType==="password")return t?"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022":"\u2014";let i=e.getDisplayText();return i||(t&&typeof t=="object"&&!Array.isArray(t)?Object.values(t).filter(Boolean).join(" \u2013 ")||"\u2014":Array.isArray(t)&&t.join(", ")||"\u2014")}submit(){if(this.index<this.count()-1)return this.next(),!1;let e=super.submit();for(let t=0;t<this.real();t++)this.stepper.setStepState(t,this.stepFields(t).some(i=>i.getError())?"error":"done");return e&&this.emit("finish",this.getValues()),e}reset(){super.reset(),this.clearErrors();for(let e=0;e<this.count();e++)this.stepper.setStepState(e,"pending");this.index!==0&&this.body.setActiveItem(0)}};x("stepform",m);export{m as a};
2
- //# sourceMappingURL=chunk-27UZFEXD.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../src/components/form/stepform/stepform.ts"],
4
- "sourcesContent": ["import { Form, type FormConfig } from '../form/form';\nimport { Container, type ContainerConfig } from '../../../core/container';\nimport { Component } from '../../../core/component';\nimport { Field } from '../../../core/field';\nimport { register } from '../../../core/registry';\nimport { h } from '../../../core/dom';\nimport { t, addMessages } from '../../../core/i18n';\nimport type { LayoutSpec } from '../../../layout/layout';\nimport { Stepper } from '../../navigation/stepper/stepper';\nimport { Button } from '../../base/button/button';\nimport { Toolbar } from '../../layout/toolbar/toolbar';\nimport '../../layout/container/container';\n\naddMessages('en', {\n stepBack: 'Back',\n stepNext: 'Next',\n stepFinish: 'Finish',\n stepReview: 'Review',\n});\naddMessages('pt-BR', {\n stepBack: 'Voltar',\n stepNext: 'Pr\u00F3ximo',\n stepFinish: 'Concluir',\n stepReview: 'Revis\u00E3o',\n});\n\nexport interface FormStep {\n title: string;\n description?: string;\n icon?: string;\n /** May be left alone: the stepper says \"optional\" (its fields are still validated if filled wrongly). */\n optional?: boolean;\n items: ContainerConfig['items'];\n /** Default: two columns (one on a phone). */\n layout?: LayoutSpec;\n}\n\nexport interface StepFormConfig extends FormConfig {\n steps: FormStep[];\n /** Moving forward validates the steps on the way. `false` lets the user click any step. Default true. */\n linear?: boolean;\n /** Adds a last \"Review\" step with a summary of the values; a function renders the summary yourself. */\n review?: boolean | ((values: Record<string, any>, form: StepForm) => string | Node);\n reviewTitle?: string;\n backText?: string;\n nextText?: string;\n finishText?: string;\n /** Shows a Cancel button (fires `cancel`). */\n cancelText?: string;\n /** On a new step, focus its first field (a phone keyboard pops up). Default false: the step panel gets the focus. */\n autoFocus?: boolean;\n}\n\n/** The summary pane of the review step. */\nclass ReviewPane extends Component {\n protected override baseCls = 'op-stepform__review';\n setContent(nodes: Array<Node | string>) {\n this.el.replaceChildren(...nodes);\n }\n}\n\n/** One form, several steps: a Stepper on top, one step at a time, Back / Next / Finish, validation per step and an optional review. */\nexport class StepForm extends Form {\n protected override baseCls = 'op-form op-stepform';\n private stepper!: Stepper;\n private body!: Container;\n private pane?: ReviewPane;\n private backBtn!: Button;\n private nextBtn!: Button;\n private finishBtn!: Button;\n private index = 0;\n\n constructor(config: StepFormConfig) {\n let me!: StepForm;\n const steps = config.steps ?? [];\n const review = config.review ? new ReviewPane() : undefined;\n const stepper = new Stepper({ steps: [...steps.map(({ title, description, icon, optional }) => ({ title, description, icon, optional })), ...(review ? [{ title: config.reviewTitle ?? t('stepReview') }] : [])] });\n const panels = [\n ...steps.map((s) => ({ type: 'container', title: s.title, cls: 'op-stepform__step', layout: s.layout ?? { type: 'grid', columns: 2, gap: 12 }, items: s.items })),\n ...(review ? [{ type: 'container', title: config.reviewTitle ?? t('stepReview'), cls: 'op-stepform__step', items: [review] }] : []),\n ];\n const body = new Container({ cls: 'op-stepform__body', flex: 1, layout: { type: 'card' }, items: panels as never });\n const backBtn = new Button({ text: config.backText ?? t('stepBack'), handler: () => me.back() });\n const nextBtn = new Button({ text: config.nextText ?? t('stepNext'), variant: 'primary', handler: () => me.next() });\n const finishBtn = new Button({ text: config.finishText ?? t('stepFinish'), variant: 'primary', htmlType: 'submit' });\n const cancel = config.cancelText ? [new Button({ text: config.cancelText, variant: 'ghost', handler: () => me.emit('cancel') })] : [];\n const footer = new Toolbar({ cls: 'op-stepform__footer', items: [...cancel, '->', backBtn, nextBtn, finishBtn] });\n super({ ...config, layout: { type: 'vbox' }, items: [stepper, body, footer] });\n me = this;\n Object.assign(this, { stepper, body, pane: review, backBtn, nextBtn, finishBtn });\n stepper.on('before-select', (i: number) => (me.goTo(i), false));\n body.on('activate', () => me.onActivate());\n }\n\n private cfg(): StepFormConfig {\n return this.config as unknown as StepFormConfig;\n }\n\n private count(): number {\n return this.body.items.length;\n }\n private real(): number {\n return this.count() - (this.pane ? 1 : 0);\n }\n\n getStep(): number {\n return this.index;\n }\n getStepCount(): number {\n return this.count();\n }\n getStepper(): Stepper {\n return this.stepper;\n }\n\n private stepFields(i: number): Field<any>[] {\n const step = this.body.items[i];\n return step instanceof Container ? (step.query((c) => c instanceof Field) as Field<any>[]) : [];\n }\n\n /** Validates one step's fields (marks the errors, sets its state on the stepper). */\n validateStep(i: number): boolean {\n if (i >= this.real()) return true;\n const bad = this.stepFields(i).filter((f) => !f.validate());\n this.stepper.setStepState(i, bad.length ? 'error' : 'done');\n return !bad.length;\n }\n\n /** Moves to a step. Forward with `linear` validates the steps on the way and stops at the first invalid one. Returns whether it got there. */\n goTo(j: number): boolean {\n if (j < 0 || j >= this.count() || j === this.index) return false;\n if (this.emit('before-step-change', this.index, j) === false) return false;\n let target = j;\n if (this.cfg().linear !== false && j > this.index) {\n for (let k = this.index; k < j; k++) {\n if (!this.validateStep(k)) {\n target = k;\n break;\n }\n }\n }\n if (target !== this.index) this.body.setActiveItem(target);\n if (target !== j) this.stepFields(target).find((f) => f.getError())?.focus();\n return target === j;\n }\n next(): boolean {\n return this.goTo(this.index + 1);\n }\n back(): boolean {\n return this.goTo(this.index - 1);\n }\n\n /** The card layout changed the visible step (by `goTo`, or because `validate` brought an invalid field into view). */\n private onActivate(): void {\n const i = this.body.items.indexOf(this.body.getActiveItem()!);\n if (i < 0) return;\n const from = this.index;\n this.index = i;\n this.stepper.setActive(i);\n const last = this.count() - 1;\n this.backBtn.config.hidden = i === 0;\n this.nextBtn.config.hidden = i === last;\n this.finishBtn.config.hidden = i !== last;\n for (const [b, hide] of [[this.backBtn, i === 0], [this.nextBtn, i === last], [this.finishBtn, i !== last]] as const) if (b.rendered) b.el.hidden = hide;\n if (this.pane && i === last) this.refreshReview();\n if (i !== from) {\n this.emit('step-change', i, from);\n if (this.rendered && this.el.isConnected && !this.stepFields(i).some((f) => f.getError())) {\n const panel = this.body.items[i]?.el;\n if ((this.config as StepFormConfig).autoFocus) this.stepFields(i)[0]?.focus();\n else if (panel) ((panel.tabIndex = -1), panel.focus());\n }\n }\n }\n\n private refreshReview(): void {\n const values = this.getValues();\n const fn = this.cfg().review;\n if (typeof fn === 'function') return this.pane!.setContent([fn(values, this)]);\n const out: Array<Node | string> = [];\n for (let i = 0; i < this.real(); i++) {\n const rows = this.stepFields(i).filter((f) => f.name);\n if (!rows.length) continue;\n out.push(h('h3', 'op-stepform__review-title', {}, String((this.body.items[i].config as { title?: string }).title ?? '')));\n out.push(h('dl', 'op-stepform__review-list', {}, ...rows.flatMap((f) => [h('dt', '', {}, f.config.label ?? (f.config as { boxLabel?: string }).boxLabel ?? f.name!), h('dd', '', {}, this.show_(f))])));\n }\n this.pane!.setContent(out);\n }\n\n /** What the user sees for a field (its display text; ticks for booleans, dots for passwords). */\n private show_(f: Field<any>): string {\n const v = f.getValue();\n if (typeof v === 'boolean') return v ? '\u2713' : '\u2014';\n if ((f.config as { inputType?: string }).inputType === 'password') return v ? '\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022' : '\u2014';\n const text = f.getDisplayText();\n if (text) return text;\n return v && typeof v === 'object' && !Array.isArray(v) ? Object.values(v).filter(Boolean).join(' \u2013 ') || '\u2014' : Array.isArray(v) ? v.join(', ') || '\u2014' : '\u2014';\n }\n\n /** Enter and the Finish button: Next on every step but the last; on the last, validate everything and `finish`. */\n override submit(): boolean {\n if (this.index < this.count() - 1) {\n this.next();\n return false;\n }\n const ok = super.submit();\n for (let i = 0; i < this.real(); i++) this.stepper.setStepState(i, this.stepFields(i).some((f) => f.getError()) ? 'error' : 'done');\n if (ok) this.emit('finish', this.getValues());\n return ok;\n }\n\n /** Clears the values and goes back to the first step. */\n override reset(): void {\n super.reset();\n this.clearErrors();\n for (let i = 0; i < this.count(); i++) this.stepper.setStepState(i, 'pending');\n if (this.index !== 0) this.body.setActiveItem(0);\n }\n}\nregister('stepform', StepForm);\n"],
5
- "mappings": "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",
6
- "names": ["addMessages", "ReviewPane", "Component", "nodes", "StepForm", "Form", "config", "me", "steps", "review", "stepper", "Stepper", "title", "description", "icon", "optional", "t", "panels", "s", "body", "Container", "backBtn", "Button", "nextBtn", "finishBtn", "cancel", "footer", "Toolbar", "i", "step", "c", "Field", "bad", "f", "j", "target", "k", "from", "last", "b", "hide", "panel", "values", "fn", "out", "rows", "h", "v", "text", "ok", "register"]
7
- }
@@ -1,2 +0,0 @@
1
- import{c}from"./chunk-4EZJ5FKJ.js";import{a as d}from"./chunk-A2NKDOYN.js";import{b as a}from"./chunk-PZSHOSOS.js";import{a as p}from"./chunk-TIPK3SCJ.js";var l=class extends d{baseCls="op-navmenu";tag="nav";items=[];open=new Set;active;query="";focusId;root;onRender(){let e=this.config;this.items=e.items??[],this.active=e.active;let t=i=>i.forEach(s=>(s.expanded&&this.open.add(s.id),s.items&&t(s.items)));t(this.items),this.active&&this.openParents(this.active),this.root=a("ul","op-navmenu__tree",{role:"tree","aria-label":e.ariaLabel??null}),this.el.append(this.root),this.listen(this.root,"click",i=>{let s=i.target.closest(".op-navmenu__item");s&&this.activate(s.dataset.id)}),this.listen(this.root,"keydown",i=>this.onKey(i)),this.listen(this.root,"focusin",i=>{let s=i.target.closest(".op-navmenu__item");s&&(this.focusId=s.dataset.id)}),this.paint()}getItem(e,t=this.items){for(let i of t){if(i.id===e)return i;let s=i.items&&this.getItem(e,i.items);if(s)return s}}parentsOf(e,t=this.items,i=[]){for(let s of t){if(s.id===e)return i;let n=s.items&&this.parentsOf(e,s.items,[...i,s]);if(n)return n}}openParents(e){for(let t of this.parentsOf(e)??[])this.open.add(t.id)}matches(e,t){return e.text.toLowerCase().includes(t)||!!e.items?.some(i=>this.matches(i,t))}visible(e){return e.hidden||this.query&&!this.matches(e,this.query)?!1:!e.items||e.items.some(t=>this.visible(t))}isOpen(e){return this.query||this.config.collapsed?!0:this.open.has(e.id)}paint(){this.el.classList.toggle("is-rail",!!this.config.collapsed),this.root.replaceChildren(...this.items.filter(i=>this.visible(i)).map(i=>this.node(i,1)));let t=this.focusId&&this.root.querySelector(`[data-id="${CSS.escape(this.focusId)}"]`)||this.root.querySelector(".op-navmenu__item.is-active")||this.root.querySelector(".op-navmenu__item");this.root.querySelectorAll(".op-navmenu__item").forEach(i=>i.tabIndex=i===t?0:-1)}node(e,t){let i=!!e.items,s=i&&this.isOpen(e),n=!!this.config.collapsed,r=a("li","op-navmenu__node",{role:"none"}),o=a("div",`op-navmenu__item${i?" is-group":""}${s?" is-expanded":""}${e.id===this.active?" is-active":""}${e.disabled?" is-disabled":""}`,{role:"treeitem","data-id":e.id,"aria-level":t,"aria-expanded":i?String(s):null,"aria-current":e.id===this.active?"page":null,"aria-disabled":e.disabled?"true":null,title:n?e.text:null,tabindex:-1});return o.style.setProperty("--_level",String(t-1)),o.append(a("span","op-navmenu__icon",{},e.icon?c(e.icon):""),a("span","op-navmenu__text",{},e.text)),e.badge!=null&&e.badge!==""&&o.append(a("span","op-navmenu__badge",{},String(e.badge))),i&&o.append(a("span","op-navmenu__chevron",{"aria-hidden":"true"},c("chevron-down"))),r.append(o),i&&s&&r.append(a("ul","op-navmenu__group",{role:"group"},...e.items.filter(h=>this.visible(h)).map(h=>this.node(h,t+1)))),r}activate(e){let t=this.getItem(e);if(!(!t||t.disabled)){if(t.items)return this.toggle(e);this.select(e)}}select(e){let t=this.getItem(e);!t||t.disabled||this.emit("before-select",t)===!1||(this.setActive(e),this.emit("select",t))}setActive(e){this.active=e,this.config.active=e,e&&(this.openParents(e),this.focusId=e),this.rendered&&this.paint()}getActive(){return this.active?this.getItem(this.active):void 0}expand(e){let t=this.getItem(e);if(!(!t?.items||this.open.has(e))){if(this.config.accordion)for(let i of this.siblings(e))this.open.delete(i.id);this.open.add(e),this.rendered&&this.paint(),this.emit("expand",t)}}collapse(e){let t=this.getItem(e);!t?.items||!this.open.delete(e)||(this.rendered&&this.paint(),this.emit("collapse",t))}toggle(e){this.open.has(e)?this.collapse(e):this.expand(e)}siblings(e){let t=this.parentsOf(e)??[];return(t.length?t[t.length-1].items:this.items).filter(s=>s.id!==e&&s.items)}expandAll(){let e=t=>t.forEach(i=>i.items&&(this.open.add(i.id),e(i.items)));e(this.items),this.rendered&&this.paint()}collapseAll(){this.open.clear(),this.active&&this.openParents(this.active),this.rendered&&this.paint()}setItems(e){this.items=e,this.config.items=e,this.rendered&&this.paint()}updateItem(e,t){let i=this.getItem(e);i&&(Object.assign(i,t),this.rendered&&this.paint())}setCollapsed(e){this.config.collapsed=e,this.rendered&&this.paint()}filter(e){this.query=e.trim().toLowerCase(),this.rendered&&this.paint()}rows(){return Array.from(this.root.querySelectorAll(".op-navmenu__item"))}focusRow(e){e&&(this.rows().forEach(t=>t.tabIndex=t===e?0:-1),e.focus())}onKey(e){let t=e.target.closest(".op-navmenu__item");if(!t)return;let i=this.rows(),s=i.indexOf(t),n=this.getItem(t.dataset.id),r=t.getAttribute("aria-expanded")==="true";switch(e.key){case"ArrowDown":this.focusRow(i[s+1]);break;case"ArrowUp":this.focusRow(i[s-1]);break;case"Home":this.focusRow(i[0]);break;case"End":this.focusRow(i[i.length-1]);break;case"ArrowRight":n.items&&!r?this.expand(n.id):n.items&&this.focusRow(i[s+1]);break;case"ArrowLeft":if(n.items&&r)this.collapse(n.id);else{let h=this.parentsOf(n.id)?.pop();h&&this.focusRow(this.root.querySelector(`[data-id="${CSS.escape(h.id)}"]`)??void 0)}break;case"Enter":case" ":this.activate(n.id);break;default:return}e.preventDefault(),this.focusId=document.activeElement?.dataset?.id??n.id;let o=this.root.querySelector(`[data-id="${CSS.escape(this.focusId)}"]`);o&&document.activeElement!==o&&this.focusRow(o)}};p("navmenu",l);export{l as a};
2
- //# sourceMappingURL=chunk-5YS7OD5E.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../src/components/navigation/navmenu/navmenu.ts"],
4
- "sourcesContent": ["import { Component, type ComponentConfig } from '../../../core/component';\nimport { register } from '../../../core/registry';\nimport { h } from '../../../core/dom';\nimport { iconEl } from '../../base/icon/icon';\n\nexport interface NavItem {\n id: string;\n text: string;\n icon?: string;\n badge?: string | number;\n items?: NavItem[];\n disabled?: boolean;\n hidden?: boolean;\n /** Groups: start open. */\n expanded?: boolean;\n data?: unknown;\n}\n\nexport interface NavMenuConfig extends ComponentConfig {\n items?: NavItem[];\n /** id of the active leaf. */\n active?: string;\n /** Rail: icons only. */\n collapsed?: boolean;\n /** Opening a group closes the others at its level. */\n accordion?: boolean;\n}\n\n/** Sidebar tree: groups that open and close, one active leaf, badges, rail mode, filter and the APG tree keyboard model. */\nexport class NavMenu extends Component<NavMenuConfig> {\n protected override baseCls = 'op-navmenu';\n protected override tag = 'nav' as const;\n private items: NavItem[] = [];\n private open = new Set<string>();\n private active?: string;\n private query = '';\n private focusId?: string;\n private root!: HTMLElement;\n\n protected override onRender() {\n const c = this.config;\n this.items = c.items ?? [];\n this.active = c.active;\n const seed = (list: NavItem[]) => list.forEach((i) => (i.expanded && this.open.add(i.id), i.items && seed(i.items)));\n seed(this.items);\n if (this.active) this.openParents(this.active);\n this.root = h('ul', 'op-navmenu__tree', { role: 'tree', 'aria-label': c.ariaLabel ?? null });\n this.el.append(this.root);\n this.listen(this.root, 'click', (e: Event) => {\n const row = (e.target as HTMLElement).closest<HTMLElement>('.op-navmenu__item');\n if (row) this.activate(row.dataset.id!);\n });\n this.listen(this.root, 'keydown', (e: KeyboardEvent) => this.onKey(e));\n this.listen(this.root, 'focusin', (e: Event) => {\n const row = (e.target as HTMLElement).closest<HTMLElement>('.op-navmenu__item');\n if (row) this.focusId = row.dataset.id;\n });\n this.paint();\n }\n\n // ---- model -----------------------------------------------------------------------------------\n\n getItem(id: string, list = this.items): NavItem | undefined {\n for (const i of list) {\n if (i.id === id) return i;\n const hit = i.items && this.getItem(id, i.items);\n if (hit) return hit;\n }\n }\n private parentsOf(id: string, list = this.items, trail: NavItem[] = []): NavItem[] | undefined {\n for (const i of list) {\n if (i.id === id) return trail;\n const hit = i.items && this.parentsOf(id, i.items, [...trail, i]);\n if (hit) return hit;\n }\n }\n private openParents(id: string) {\n for (const p of this.parentsOf(id) ?? []) this.open.add(p.id);\n }\n private matches(i: NavItem, q: string): boolean {\n return i.text.toLowerCase().includes(q) || !!i.items?.some((c) => this.matches(c, q));\n }\n /** Visible = not hidden, matches the filter, and a group has at least one visible child. */\n private visible(i: NavItem): boolean {\n if (i.hidden) return false;\n if (this.query && !this.matches(i, this.query)) return false;\n return !i.items || i.items.some((c) => this.visible(c));\n }\n private isOpen(i: NavItem): boolean {\n return this.query || this.config.collapsed ? true : this.open.has(i.id);\n }\n\n // ---- rendering -------------------------------------------------------------------------------\n\n private paint() {\n this.el.classList.toggle('is-rail', !!this.config.collapsed);\n this.root.replaceChildren(...this.items.filter((i) => this.visible(i)).map((i) => this.node(i, 1)));\n const f = this.focusId && this.root.querySelector<HTMLElement>(`[data-id=\"${CSS.escape(this.focusId)}\"]`);\n const first = f || this.root.querySelector<HTMLElement>('.op-navmenu__item.is-active') || this.root.querySelector<HTMLElement>('.op-navmenu__item');\n this.root.querySelectorAll<HTMLElement>('.op-navmenu__item').forEach((r) => (r.tabIndex = r === first ? 0 : -1));\n }\n\n private node(i: NavItem, level: number): HTMLElement {\n const group = !!i.items;\n const open = group && this.isOpen(i);\n const rail = !!this.config.collapsed;\n const li = h('li', 'op-navmenu__node', { role: 'none' });\n const row = h('div', `op-navmenu__item${group ? ' is-group' : ''}${open ? ' is-expanded' : ''}${i.id === this.active ? ' is-active' : ''}${i.disabled ? ' is-disabled' : ''}`, {\n role: 'treeitem', 'data-id': i.id, 'aria-level': level, 'aria-expanded': group ? String(open) : null, 'aria-current': i.id === this.active ? 'page' : null,\n 'aria-disabled': i.disabled ? 'true' : null, title: rail ? i.text : null, tabindex: -1,\n });\n row.style.setProperty('--_level', String(level - 1));\n row.append(h('span', 'op-navmenu__icon', {}, i.icon ? iconEl(i.icon) : ''), h('span', 'op-navmenu__text', {}, i.text));\n if (i.badge != null && i.badge !== '') row.append(h('span', 'op-navmenu__badge', {}, String(i.badge)));\n if (group) row.append(h('span', 'op-navmenu__chevron', { 'aria-hidden': 'true' }, iconEl('chevron-down')));\n li.append(row);\n if (group && open) li.append(h('ul', 'op-navmenu__group', { role: 'group' }, ...i.items!.filter((c) => this.visible(c)).map((c) => this.node(c, level + 1))));\n return li;\n }\n\n // ---- behavior --------------------------------------------------------------------------------\n\n private activate(id: string) {\n const i = this.getItem(id);\n if (!i || i.disabled) return;\n if (i.items) return this.toggle(id);\n this.select(id);\n }\n\n private select(id: string) {\n const i = this.getItem(id);\n if (!i || i.disabled || this.emit('before-select', i) === false) return;\n this.setActive(id);\n this.emit('select', i);\n }\n\n /** Marks a leaf as the active page (and opens its parents). Does not emit `select`. */\n setActive(id: string | undefined) {\n this.active = id;\n this.config.active = id;\n if (id) {\n this.openParents(id);\n this.focusId = id;\n }\n if (this.rendered) this.paint();\n }\n getActive(): NavItem | undefined {\n return this.active ? this.getItem(this.active) : undefined;\n }\n\n expand(id: string) {\n const i = this.getItem(id);\n if (!i?.items || this.open.has(id)) return;\n if (this.config.accordion) for (const sib of this.siblings(id)) this.open.delete(sib.id);\n this.open.add(id);\n this.rendered && this.paint();\n this.emit('expand', i);\n }\n collapse(id: string) {\n const i = this.getItem(id);\n if (!i?.items || !this.open.delete(id)) return;\n this.rendered && this.paint();\n this.emit('collapse', i);\n }\n toggle(id: string) {\n if (this.open.has(id)) this.collapse(id);\n else this.expand(id);\n }\n private siblings(id: string): NavItem[] {\n const parents = this.parentsOf(id) ?? [];\n const list = parents.length ? parents[parents.length - 1].items! : this.items;\n return list.filter((x) => x.id !== id && x.items);\n }\n expandAll() {\n const walk = (l: NavItem[]) => l.forEach((i) => i.items && (this.open.add(i.id), walk(i.items)));\n walk(this.items);\n this.rendered && this.paint();\n }\n collapseAll() {\n this.open.clear();\n if (this.active) this.openParents(this.active);\n this.rendered && this.paint();\n }\n\n setItems(items: NavItem[]) {\n this.items = items;\n this.config.items = items;\n if (this.rendered) this.paint();\n }\n /** Changes an item in place (a badge, a label, disabled...). */\n updateItem(id: string, patch: Partial<NavItem>) {\n const i = this.getItem(id);\n if (!i) return;\n Object.assign(i, patch);\n if (this.rendered) this.paint();\n }\n setCollapsed(collapsed: boolean) {\n this.config.collapsed = collapsed;\n if (this.rendered) this.paint();\n }\n /** Hides what does not match and opens the groups that have a match; empty text clears the filter. */\n filter(text: string) {\n this.query = text.trim().toLowerCase();\n if (this.rendered) this.paint();\n }\n\n // ---- keyboard (APG tree) ---------------------------------------------------------------------\n\n private rows(): HTMLElement[] {\n return Array.from(this.root.querySelectorAll<HTMLElement>('.op-navmenu__item'));\n }\n private focusRow(row?: HTMLElement) {\n if (!row) return;\n this.rows().forEach((r) => (r.tabIndex = r === row ? 0 : -1));\n row.focus();\n }\n\n private onKey(e: KeyboardEvent) {\n const row = (e.target as HTMLElement).closest<HTMLElement>('.op-navmenu__item');\n if (!row) return;\n const rows = this.rows();\n const i = rows.indexOf(row);\n const item = this.getItem(row.dataset.id!)!;\n const open = row.getAttribute('aria-expanded') === 'true';\n switch (e.key) {\n case 'ArrowDown': this.focusRow(rows[i + 1]); break;\n case 'ArrowUp': this.focusRow(rows[i - 1]); break;\n case 'Home': this.focusRow(rows[0]); break;\n case 'End': this.focusRow(rows[rows.length - 1]); break;\n case 'ArrowRight':\n if (item.items && !open) this.expand(item.id);\n else if (item.items) this.focusRow(rows[i + 1]);\n break;\n case 'ArrowLeft':\n if (item.items && open) this.collapse(item.id);\n else {\n const parent = this.parentsOf(item.id)?.pop();\n if (parent) this.focusRow(this.root.querySelector<HTMLElement>(`[data-id=\"${CSS.escape(parent.id)}\"]`) ?? undefined);\n }\n break;\n case 'Enter':\n case ' ': this.activate(item.id); break;\n default: return;\n }\n e.preventDefault();\n this.focusId = (document.activeElement as HTMLElement | null)?.dataset?.id ?? item.id;\n // a repaint (expand/collapse/select) rebuilt the rows: put the focus back on the one the user is on\n const again = this.root.querySelector<HTMLElement>(`[data-id=\"${CSS.escape(this.focusId)}\"]`);\n if (again && document.activeElement !== again) this.focusRow(again);\n }\n}\nregister('navmenu', NavMenu);\n"],
5
- "mappings": "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",
6
- "names": ["NavMenu", "Component", "c", "seed", "list", "i", "h", "e", "row", "id", "hit", "trail", "p", "q", "first", "r", "level", "group", "open", "rail", "li", "iconEl", "sib", "parents", "x", "walk", "l", "items", "patch", "collapsed", "text", "rows", "item", "parent", "again", "register"]
7
- }
@@ -1,3 +0,0 @@
1
- import{a as v}from"./chunk-Z2JBUHKA.js";import{c as f}from"./chunk-VV7CFMPZ.js";import{e as b}from"./chunk-4AA4FQEM.js";import{c as h}from"./chunk-4EZJ5FKJ.js";import{a as d}from"./chunk-A2NKDOYN.js";import{b as s}from"./chunk-PZSHOSOS.js";import{a as m}from"./chunk-TIPK3SCJ.js";import{f as a}from"./chunk-MW3RWBZ7.js";var n=".op-menu__item",p=class E extends d{baseCls="op-menu";parentMenu;dd;sub;subOwner;opener=null;hoverCancel;list;searchEl;emptyEl;build(){return s("div","op-menu")}shell(){let t=!!this.config.search;t&&!this.searchEl&&(this.searchEl=s("input","op-menu__search",{type:"search",placeholder:`${a("search")}\u2026`,"aria-label":a("search"),autocomplete:"off"}),this.emptyEl=s("div","op-menu__empty",{},a("noResults")),this.listen(this.searchEl,"input",()=>this.filter()),this.listen(this.searchEl,"keydown",e=>{let i=this.first();i&&(e.key==="ArrowDown"||e.key==="Enter")&&(e.preventDefault(),e.key==="Enter"?this.activate(i):i.focus())})),this.list=t?this.list!==this.el&&this.list||s("div","op-menu__list",{role:"menu"}):this.el,this.el.setAttribute("role",t?"none":"menu"),t&&this.el.replaceChildren(this.searchEl,this.list,this.emptyEl)}first(){return this.list.querySelector(`${n}:not([hidden]):not([aria-disabled=true])`)}filter(){let t=(this.searchEl?.value??"").trim().toLowerCase();this.el.classList.toggle("is-searching",!!t);for(let e of Array.from(this.list.querySelectorAll(n))){let i=e.parentElement.getAttribute("aria-label")??"";e.hidden=!!t&&!`${i}
2
- ${e.textContent}`.toLowerCase().includes(t)}this.emptyEl&&(this.emptyEl.hidden=!!this.first()||!this.list.querySelector(n))}onRender(){this.shell(),this.renderItems();let t=f(this.el,{selector:n,orientation:"vertical"});this.own(()=>t.destroy()),this.listen(this.el,"click",e=>{let i=e.target.closest(n);i&&this.activate(i)}),this.listen(this.el,"keydown",e=>{let i=e.target.closest(n);if(e.target!==this.searchEl){if(e.key==="Tab")return this.closeAll();if(this.searchEl&&e.key.length===1&&e.key!==" "&&!e.ctrlKey&&!e.metaKey&&!e.altKey)return e.preventDefault(),this.searchEl.focus(),this.searchEl.value+=e.key,this.filter();i&&(e.key==="Enter"||e.key===" "?(e.preventDefault(),this.activate(i)):e.key==="ArrowRight"&&i.getAttribute("aria-haspopup")?(e.preventDefault(),this.openSub(i,!0)):e.key==="ArrowLeft"&&this.parentMenu&&(e.preventDefault(),this.hide()))}}),this.listen(this.el,"pointerover",e=>{let i=e.target.closest(n);!i||i.getAttribute("aria-disabled")==="true"||(this.hoverCancel?.(),i.focus(),i.getAttribute("aria-haspopup")?this.hoverCancel=this.later(()=>this.openSub(i,!1),150):this.sub?.hide())})}entries(){return this.config.items??[]}renderItems(){let t=this.entries(),e=t.map((r,o)=>{if(r==="-")return s("div","op-menu__sep",{role:"separator"});let l=r.checked!==void 0,u=s("div","op-menu__item",{role:l?"menuitemcheckbox":"menuitem",tabindex:-1,"data-i":o,"aria-disabled":r.disabled?"true":null,"aria-checked":l?String(!!r.checked):null,"aria-haspopup":r.items?"menu":null,"aria-expanded":r.items?"false":null});return u.append(s("span","op-menu__icon",{},r.icon?h(r.icon):l&&r.checked?h("check"):null),s("span","op-menu__text",{},r.text??"")),r.items&&u.append(s("span","op-menu__arrow",{},h("chevron-right"))),u}),i=r=>t[r]==="-"?"":t[r].group??"",c=[...new Set(t.map((r,o)=>i(o)).filter(Boolean))];if(!c.length)return this.list.replaceChildren(...e),this.filter();this.list.replaceChildren(...e.filter((r,o)=>!i(o)),...c.map(r=>s("div","op-menu__group",{role:"group","aria-label":r},s("div","op-menu__group-label",{"aria-hidden":"true"},r),...e.filter((o,l)=>i(l)===r)))),this.filter()}setItems(t){this.config.items=t,this.rendered&&this.renderItems()}setSearch(t){this.config.search=t,this.rendered&&(this.shell(),this.renderItems())}activate(t){let e=this.entries()[Number(t.dataset.i)];if(!(!e||e.disabled)){if(e.items)return this.openSub(t,!0);e.checked!==void 0&&(e.checked=!e.checked),e.handler?.(e),this.root().emit("click",e),this.root().hide()}}root(){return this.parentMenu?this.parentMenu.root():this}openSub(t,e){let i=this.entries()[Number(t.dataset.i)];if(this.sub&&this.subOwner===t&&this.sub.isOpen())return e?this.sub.focusFirst():void 0;this.sub?.destroy(),this.sub=new E({items:i.items}),this.sub.parentMenu=this,this.subOwner=t,this.sub.on("hide",()=>t.setAttribute("aria-expanded","false")),t.setAttribute("aria-expanded","true"),this.sub.showBy(t,"right-start",e)}isOpen(){return!!this.dd?.isOpen()}focusFirst(){this.first()?.focus()}showBy(t,e="bottom-start",i=!0){this.open({anchor:t,placement:e},i)}showAt(t,e){this.open({anchor:{x:t,y:e},placement:"bottom-start"},!0)}open(t,e){this.opener=document.activeElement,this.dd?(this.dd.setAnchor(t.anchor),this.dd.setPlacement(t.placement)):(this.dd=new v({...t,content:this.el,role:"presentation",flip:!0}),this.dd.on("close",()=>{this.sub?.hide(),this.emit("hide")})),this.searchEl&&this.config.search&&(this.searchEl.value="",this.filter()),this.dd.open(),b(Array.from(this.el.querySelectorAll(n)),{dy:4}),e&&this.focusFirst(),this.emit("show")}hide(){if(!this.dd?.isOpen())return;this.dd.close();let t=this.parentMenu?this.parentMenu.subOwner:this.opener;t instanceof HTMLElement&&t.isConnected&&t.focus()}closeAll(){this.root().hide()}onDestroy(){this.sub?.destroy(),this.dd?.destroy()}};m("menu",p);export{p as a};
3
- //# sourceMappingURL=chunk-FHM5NUS4.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../src/components/overlays/menu/menu.ts"],
4
- "sourcesContent": ["import { Component, type ComponentConfig } from '../../../core/component';\nimport { register } from '../../../core/registry';\nimport { h } from '../../../core/dom';\nimport { t } from '../../../core/i18n';\nimport { roving } from '../../../core/focus';\nimport type { Placement } from '../../../core/position';\nimport { iconEl } from '../../base/icon/icon';\nimport { Dropdown } from '../dropdown/dropdown';\nimport { stagger } from '../../../motion/core';\n\nexport interface MenuItem {\n text?: string;\n icon?: string;\n handler?: (item: MenuItem) => void;\n disabled?: boolean;\n /** Present (true/false) makes it a checkable item. */\n checked?: boolean;\n items?: MenuEntry[];\n /** Items with the same group sit together under its name (ungrouped items come first). */\n group?: string;\n}\nexport type MenuEntry = MenuItem | '-';\n\nexport interface MenuConfig extends ComponentConfig {\n items?: MenuEntry[];\n /** A search field over the items: filters as you type; a search that names a group shows the whole group. */\n search?: boolean;\n}\n\nconst ITEM = '.op-menu__item';\n\n/** Floating menu with submenus. Use `showBy(button)` for button menus and `showAt(x, y)` for context menus. */\nexport class Menu extends Component<MenuConfig> {\n protected override baseCls = 'op-menu';\n parentMenu?: Menu;\n private dd?: Dropdown;\n private sub?: Menu;\n private subOwner?: HTMLElement;\n private opener: Element | null = null;\n private hoverCancel?: () => void;\n /** The `role=menu` element: the root itself, or a list under the search field. */\n private list!: HTMLElement;\n private searchEl?: HTMLInputElement;\n private emptyEl?: HTMLElement;\n\n protected override build() {\n return h('div', 'op-menu');\n }\n\n /** Without search the root is the menu; with it, the root holds the field, the menu and the \"no results\" line. */\n private shell() {\n const on = !!this.config.search;\n if (on && !this.searchEl) {\n this.searchEl = h('input', 'op-menu__search', { type: 'search', placeholder: `${t('search')}\u2026`, 'aria-label': t('search'), autocomplete: 'off' });\n this.emptyEl = h('div', 'op-menu__empty', {}, t('noResults'));\n this.listen(this.searchEl, 'input', () => this.filter());\n this.listen(this.searchEl, 'keydown', (e: KeyboardEvent) => {\n const first = this.first();\n if (first && (e.key === 'ArrowDown' || e.key === 'Enter')) (e.preventDefault(), e.key === 'Enter' ? this.activate(first) : first.focus());\n });\n }\n this.list = on ? (this.list !== this.el && this.list) || h('div', 'op-menu__list', { role: 'menu' }) : this.el;\n this.el.setAttribute('role', on ? 'none' : 'menu');\n if (on) this.el.replaceChildren(this.searchEl!, this.list, this.emptyEl!);\n }\n\n private first(): HTMLElement | null {\n return this.list.querySelector<HTMLElement>(`${ITEM}:not([hidden]):not([aria-disabled=true])`);\n }\n\n /** Hides the items that do not match the search (a group whose name matches keeps all of them); empty groups hide in CSS. */\n private filter() {\n const q = (this.searchEl?.value ?? '').trim().toLowerCase();\n this.el.classList.toggle('is-searching', !!q);\n for (const row of Array.from(this.list.querySelectorAll<HTMLElement>(ITEM))) {\n const group = row.parentElement!.getAttribute('aria-label') ?? '';\n row.hidden = !!q && !`${group}\\n${row.textContent}`.toLowerCase().includes(q);\n }\n if (this.emptyEl) this.emptyEl.hidden = !!this.first() || !this.list.querySelector(ITEM);\n }\n\n protected override onRender() {\n this.shell();\n this.renderItems();\n const rover = roving(this.el, { selector: ITEM, orientation: 'vertical' });\n this.own(() => rover.destroy());\n this.listen(this.el, 'click', (e: Event) => {\n const row = (e.target as HTMLElement).closest<HTMLElement>(ITEM);\n if (row) this.activate(row);\n });\n this.listen(this.el, 'keydown', (e: KeyboardEvent) => {\n const row = (e.target as HTMLElement).closest<HTMLElement>(ITEM);\n if (e.target === this.searchEl) return;\n if (e.key === 'Tab') return this.closeAll();\n // type to search: a printable key on an item goes to the search field\n if (this.searchEl && e.key.length === 1 && e.key !== ' ' && !e.ctrlKey && !e.metaKey && !e.altKey) {\n e.preventDefault();\n this.searchEl.focus();\n this.searchEl.value += e.key;\n return this.filter();\n }\n if (!row) return;\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this.activate(row);\n } else if (e.key === 'ArrowRight' && row.getAttribute('aria-haspopup')) {\n e.preventDefault();\n this.openSub(row, true);\n } else if (e.key === 'ArrowLeft' && this.parentMenu) {\n e.preventDefault();\n this.hide();\n }\n });\n this.listen(this.el, 'pointerover', (e: Event) => {\n const row = (e.target as HTMLElement).closest<HTMLElement>(ITEM);\n if (!row || row.getAttribute('aria-disabled') === 'true') return;\n this.hoverCancel?.();\n row.focus();\n if (row.getAttribute('aria-haspopup')) this.hoverCancel = this.later(() => this.openSub(row, false), 150);\n else this.sub?.hide();\n });\n }\n\n private entries(): MenuEntry[] {\n return this.config.items ?? [];\n }\n\n private renderItems() {\n const entries = this.entries();\n const rows = entries.map((it, i) => {\n if (it === '-') return h('div', 'op-menu__sep', { role: 'separator' });\n const checkable = it.checked !== undefined;\n const row = h('div', 'op-menu__item', {\n role: checkable ? 'menuitemcheckbox' : 'menuitem',\n tabindex: -1,\n 'data-i': i,\n 'aria-disabled': it.disabled ? 'true' : null,\n 'aria-checked': checkable ? String(!!it.checked) : null,\n 'aria-haspopup': it.items ? 'menu' : null,\n 'aria-expanded': it.items ? 'false' : null,\n });\n row.append(h('span', 'op-menu__icon', {}, it.icon ? iconEl(it.icon) : checkable && it.checked ? iconEl('check') : null), h('span', 'op-menu__text', {}, it.text ?? ''));\n if (it.items) row.append(h('span', 'op-menu__arrow', {}, iconEl('chevron-right')));\n return row;\n });\n const groupOf = (i: number) => (entries[i] === '-' ? '' : ((entries[i] as MenuItem).group ?? ''));\n const groups = [...new Set(entries.map((_, i) => groupOf(i)).filter(Boolean))];\n if (!groups.length) return (this.list.replaceChildren(...rows), this.filter());\n // ungrouped entries first, then one role=group per name (its header is only visual: the group carries the name)\n this.list.replaceChildren(\n ...rows.filter((_, i) => !groupOf(i)),\n ...groups.map((g) => h('div', 'op-menu__group', { role: 'group', 'aria-label': g }, h('div', 'op-menu__group-label', { 'aria-hidden': 'true' }, g), ...rows.filter((_, i) => groupOf(i) === g))),\n );\n this.filter();\n }\n\n setItems(items: MenuEntry[]) {\n this.config.items = items;\n if (this.rendered) this.renderItems();\n }\n\n /** Turns the search field on or off. */\n setSearch(search: boolean) {\n this.config.search = search;\n if (!this.rendered) return;\n this.shell();\n this.renderItems();\n }\n\n private activate(row: HTMLElement) {\n const item = this.entries()[Number(row.dataset.i)] as MenuItem;\n if (!item || item.disabled) return;\n if (item.items) return this.openSub(row, true);\n if (item.checked !== undefined) item.checked = !item.checked;\n item.handler?.(item);\n this.root().emit('click', item);\n this.root().hide();\n }\n\n private root(): Menu {\n return this.parentMenu ? this.parentMenu.root() : this;\n }\n\n private openSub(row: HTMLElement, focus: boolean) {\n const item = this.entries()[Number(row.dataset.i)] as MenuItem;\n if (this.sub && this.subOwner === row && this.sub.isOpen()) return focus ? this.sub.focusFirst() : undefined;\n this.sub?.destroy();\n this.sub = new Menu({ items: item.items });\n this.sub.parentMenu = this;\n this.subOwner = row;\n this.sub.on('hide', () => row.setAttribute('aria-expanded', 'false'));\n row.setAttribute('aria-expanded', 'true');\n this.sub.showBy(row, 'right-start', focus);\n }\n\n isOpen(): boolean {\n return !!this.dd?.isOpen();\n }\n\n private focusFirst() {\n this.first()?.focus(); // never the search field on open: a phone keyboard would cover the menu\n }\n\n showBy(anchor: HTMLElement | Component, placement: Placement = 'bottom-start', focus = true) {\n this.open({ anchor, placement }, focus);\n }\n\n showAt(x: number, y: number) {\n this.open({ anchor: { x, y }, placement: 'bottom-start' }, true);\n }\n\n private open(cfg: { anchor: HTMLElement | Component | { x: number; y: number }; placement: Placement }, focus: boolean) {\n this.opener = document.activeElement;\n if (!this.dd) {\n this.dd = new Dropdown({ ...cfg, content: this.el, role: 'presentation', flip: true });\n this.dd.on('close', () => {\n this.sub?.hide();\n this.emit('hide');\n });\n } else {\n this.dd.setAnchor(cfg.anchor);\n this.dd.setPlacement(cfg.placement);\n }\n if (this.searchEl && this.config.search) {\n this.searchEl.value = '';\n this.filter();\n }\n this.dd.open();\n void stagger(Array.from(this.el.querySelectorAll(ITEM)), { dy: 4 }); // the rows settle one after the other\n if (focus) this.focusFirst();\n this.emit('show');\n }\n\n override hide() {\n if (!this.dd?.isOpen()) return;\n this.dd.close();\n // Closing a submenu returns to its parent item; closing the root returns to whatever opened it.\n const back = this.parentMenu ? this.parentMenu.subOwner : this.opener;\n if (back instanceof HTMLElement && back.isConnected) back.focus();\n }\n\n closeAll() {\n this.root().hide();\n }\n\n protected override onDestroy() {\n this.sub?.destroy();\n this.dd?.destroy();\n }\n}\nregister('menu', Menu);\n"],
5
- "mappings": "gUA6BA,IAAMA,EAAO,iBAGAC,EAAN,MAAMC,UAAaC,CAAsB,CAC3B,QAAU,UAC7B,WACQ,GACA,IACA,SACA,OAAyB,KACzB,YAEA,KACA,SACA,QAEW,OAAQ,CACzB,OAAOC,EAAE,MAAO,SAAS,CAC3B,CAGQ,OAAQ,CACd,IAAMC,EAAK,CAAC,CAAC,KAAK,OAAO,OACrBA,GAAM,CAAC,KAAK,WACd,KAAK,SAAWD,EAAE,QAAS,kBAAmB,CAAE,KAAM,SAAU,YAAa,GAAGE,EAAE,QAAQ,CAAC,SAAK,aAAcA,EAAE,QAAQ,EAAG,aAAc,KAAM,CAAC,EAChJ,KAAK,QAAUF,EAAE,MAAO,iBAAkB,CAAC,EAAGE,EAAE,WAAW,CAAC,EAC5D,KAAK,OAAO,KAAK,SAAU,QAAS,IAAM,KAAK,OAAO,CAAC,EACvD,KAAK,OAAO,KAAK,SAAU,UAAY,GAAqB,CAC1D,IAAMC,EAAQ,KAAK,MAAM,EACrBA,IAAU,EAAE,MAAQ,aAAe,EAAE,MAAQ,WAAW,EAAE,eAAe,EAAG,EAAE,MAAQ,QAAU,KAAK,SAASA,CAAK,EAAIA,EAAM,MAAM,EACzI,CAAC,GAEH,KAAK,KAAOF,EAAM,KAAK,OAAS,KAAK,IAAM,KAAK,MAASD,EAAE,MAAO,gBAAiB,CAAE,KAAM,MAAO,CAAC,EAAI,KAAK,GAC5G,KAAK,GAAG,aAAa,OAAQC,EAAK,OAAS,MAAM,EAC7CA,GAAI,KAAK,GAAG,gBAAgB,KAAK,SAAW,KAAK,KAAM,KAAK,OAAQ,CAC1E,CAEQ,OAA4B,CAClC,OAAO,KAAK,KAAK,cAA2B,GAAGL,CAAI,0CAA0C,CAC/F,CAGQ,QAAS,CACf,IAAMQ,GAAK,KAAK,UAAU,OAAS,IAAI,KAAK,EAAE,YAAY,EAC1D,KAAK,GAAG,UAAU,OAAO,eAAgB,CAAC,CAACA,CAAC,EAC5C,QAAWC,KAAO,MAAM,KAAK,KAAK,KAAK,iBAA8BT,CAAI,CAAC,EAAG,CAC3E,IAAMU,EAAQD,EAAI,cAAe,aAAa,YAAY,GAAK,GAC/DA,EAAI,OAAS,CAAC,CAACD,GAAK,CAAC,GAAGE,CAAK;AAAA,EAAKD,EAAI,WAAW,GAAG,YAAY,EAAE,SAASD,CAAC,CAC9E,CACI,KAAK,UAAS,KAAK,QAAQ,OAAS,CAAC,CAAC,KAAK,MAAM,GAAK,CAAC,KAAK,KAAK,cAAcR,CAAI,EACzF,CAEmB,UAAW,CAC5B,KAAK,MAAM,EACX,KAAK,YAAY,EACjB,IAAMW,EAAQC,EAAO,KAAK,GAAI,CAAE,SAAUZ,EAAM,YAAa,UAAW,CAAC,EACzE,KAAK,IAAI,IAAMW,EAAM,QAAQ,CAAC,EAC9B,KAAK,OAAO,KAAK,GAAI,QAAU,GAAa,CAC1C,IAAMF,EAAO,EAAE,OAAuB,QAAqBT,CAAI,EAC3DS,GAAK,KAAK,SAASA,CAAG,CAC5B,CAAC,EACD,KAAK,OAAO,KAAK,GAAI,UAAY,GAAqB,CACpD,IAAMA,EAAO,EAAE,OAAuB,QAAqBT,CAAI,EAC/D,GAAI,EAAE,SAAW,KAAK,SACtB,IAAI,EAAE,MAAQ,MAAO,OAAO,KAAK,SAAS,EAE1C,GAAI,KAAK,UAAY,EAAE,IAAI,SAAW,GAAK,EAAE,MAAQ,KAAO,CAAC,EAAE,SAAW,CAAC,EAAE,SAAW,CAAC,EAAE,OACzF,SAAE,eAAe,EACjB,KAAK,SAAS,MAAM,EACpB,KAAK,SAAS,OAAS,EAAE,IAClB,KAAK,OAAO,EAEhBS,IACD,EAAE,MAAQ,SAAW,EAAE,MAAQ,KACjC,EAAE,eAAe,EACjB,KAAK,SAASA,CAAG,GACR,EAAE,MAAQ,cAAgBA,EAAI,aAAa,eAAe,GACnE,EAAE,eAAe,EACjB,KAAK,QAAQA,EAAK,EAAI,GACb,EAAE,MAAQ,aAAe,KAAK,aACvC,EAAE,eAAe,EACjB,KAAK,KAAK,IAEd,CAAC,EACD,KAAK,OAAO,KAAK,GAAI,cAAgB,GAAa,CAChD,IAAMA,EAAO,EAAE,OAAuB,QAAqBT,CAAI,EAC3D,CAACS,GAAOA,EAAI,aAAa,eAAe,IAAM,SAClD,KAAK,cAAc,EACnBA,EAAI,MAAM,EACNA,EAAI,aAAa,eAAe,EAAG,KAAK,YAAc,KAAK,MAAM,IAAM,KAAK,QAAQA,EAAK,EAAK,EAAG,GAAG,EACnG,KAAK,KAAK,KAAK,EACtB,CAAC,CACH,CAEQ,SAAuB,CAC7B,OAAO,KAAK,OAAO,OAAS,CAAC,CAC/B,CAEQ,aAAc,CACpB,IAAMI,EAAU,KAAK,QAAQ,EACvBC,EAAOD,EAAQ,IAAI,CAACE,EAAIC,IAAM,CAChC,GAAID,IAAO,IAAK,OAAOX,EAAE,MAAO,eAAgB,CAAE,KAAM,WAAY,CAAC,EACrE,IAAMa,EAAYF,EAAG,UAAY,OAC3BN,EAAML,EAAE,MAAO,gBAAiB,CACpC,KAAMa,EAAY,mBAAqB,WACvC,SAAU,GACV,SAAUD,EACV,gBAAiBD,EAAG,SAAW,OAAS,KACxC,eAAgBE,EAAY,OAAO,CAAC,CAACF,EAAG,OAAO,EAAI,KACnD,gBAAiBA,EAAG,MAAQ,OAAS,KACrC,gBAAiBA,EAAG,MAAQ,QAAU,IACxC,CAAC,EACD,OAAAN,EAAI,OAAOL,EAAE,OAAQ,gBAAiB,CAAC,EAAGW,EAAG,KAAOG,EAAOH,EAAG,IAAI,EAAIE,GAAaF,EAAG,QAAUG,EAAO,OAAO,EAAI,IAAI,EAAGd,EAAE,OAAQ,gBAAiB,CAAC,EAAGW,EAAG,MAAQ,EAAE,CAAC,EAClKA,EAAG,OAAON,EAAI,OAAOL,EAAE,OAAQ,iBAAkB,CAAC,EAAGc,EAAO,eAAe,CAAC,CAAC,EAC1ET,CACT,CAAC,EACGU,EAAWH,GAAeH,EAAQG,CAAC,IAAM,IAAM,GAAOH,EAAQG,CAAC,EAAe,OAAS,GACvFI,EAAS,CAAC,GAAG,IAAI,IAAIP,EAAQ,IAAI,CAACQ,EAAGL,IAAMG,EAAQH,CAAC,CAAC,EAAE,OAAO,OAAO,CAAC,CAAC,EAC7E,GAAI,CAACI,EAAO,OAAQ,OAAQ,KAAK,KAAK,gBAAgB,GAAGN,CAAI,EAAG,KAAK,OAAO,EAE5E,KAAK,KAAK,gBACR,GAAGA,EAAK,OAAO,CAACO,EAAGL,IAAM,CAACG,EAAQH,CAAC,CAAC,EACpC,GAAGI,EAAO,IAAKE,GAAMlB,EAAE,MAAO,iBAAkB,CAAE,KAAM,QAAS,aAAckB,CAAE,EAAGlB,EAAE,MAAO,uBAAwB,CAAE,cAAe,MAAO,EAAGkB,CAAC,EAAG,GAAGR,EAAK,OAAO,CAACO,EAAGL,IAAMG,EAAQH,CAAC,IAAMM,CAAC,CAAC,CAAC,CACjM,EACA,KAAK,OAAO,CACd,CAEA,SAASC,EAAoB,CAC3B,KAAK,OAAO,MAAQA,EAChB,KAAK,UAAU,KAAK,YAAY,CACtC,CAGA,UAAUC,EAAiB,CACzB,KAAK,OAAO,OAASA,EAChB,KAAK,WACV,KAAK,MAAM,EACX,KAAK,YAAY,EACnB,CAEQ,SAASf,EAAkB,CACjC,IAAMgB,EAAO,KAAK,QAAQ,EAAE,OAAOhB,EAAI,QAAQ,CAAC,CAAC,EACjD,GAAI,GAACgB,GAAQA,EAAK,UAClB,IAAIA,EAAK,MAAO,OAAO,KAAK,QAAQhB,EAAK,EAAI,EACzCgB,EAAK,UAAY,SAAWA,EAAK,QAAU,CAACA,EAAK,SACrDA,EAAK,UAAUA,CAAI,EACnB,KAAK,KAAK,EAAE,KAAK,QAASA,CAAI,EAC9B,KAAK,KAAK,EAAE,KAAK,EACnB,CAEQ,MAAa,CACnB,OAAO,KAAK,WAAa,KAAK,WAAW,KAAK,EAAI,IACpD,CAEQ,QAAQhB,EAAkBiB,EAAgB,CAChD,IAAMD,EAAO,KAAK,QAAQ,EAAE,OAAOhB,EAAI,QAAQ,CAAC,CAAC,EACjD,GAAI,KAAK,KAAO,KAAK,WAAaA,GAAO,KAAK,IAAI,OAAO,EAAG,OAAOiB,EAAQ,KAAK,IAAI,WAAW,EAAI,OACnG,KAAK,KAAK,QAAQ,EAClB,KAAK,IAAM,IAAIxB,EAAK,CAAE,MAAOuB,EAAK,KAAM,CAAC,EACzC,KAAK,IAAI,WAAa,KACtB,KAAK,SAAWhB,EAChB,KAAK,IAAI,GAAG,OAAQ,IAAMA,EAAI,aAAa,gBAAiB,OAAO,CAAC,EACpEA,EAAI,aAAa,gBAAiB,MAAM,EACxC,KAAK,IAAI,OAAOA,EAAK,cAAeiB,CAAK,CAC3C,CAEA,QAAkB,CAChB,MAAO,CAAC,CAAC,KAAK,IAAI,OAAO,CAC3B,CAEQ,YAAa,CACnB,KAAK,MAAM,GAAG,MAAM,CACtB,CAEA,OAAOC,EAAiCC,EAAuB,eAAgBF,EAAQ,GAAM,CAC3F,KAAK,KAAK,CAAE,OAAAC,EAAQ,UAAAC,CAAU,EAAGF,CAAK,CACxC,CAEA,OAAOG,EAAWC,EAAW,CAC3B,KAAK,KAAK,CAAE,OAAQ,CAAE,EAAAD,EAAG,EAAAC,CAAE,EAAG,UAAW,cAAe,EAAG,EAAI,CACjE,CAEQ,KAAKC,EAA2FL,EAAgB,CACtH,KAAK,OAAS,SAAS,cAClB,KAAK,IAOR,KAAK,GAAG,UAAUK,EAAI,MAAM,EAC5B,KAAK,GAAG,aAAaA,EAAI,SAAS,IAPlC,KAAK,GAAK,IAAIC,EAAS,CAAE,GAAGD,EAAK,QAAS,KAAK,GAAI,KAAM,eAAgB,KAAM,EAAK,CAAC,EACrF,KAAK,GAAG,GAAG,QAAS,IAAM,CACxB,KAAK,KAAK,KAAK,EACf,KAAK,KAAK,MAAM,CAClB,CAAC,GAKC,KAAK,UAAY,KAAK,OAAO,SAC/B,KAAK,SAAS,MAAQ,GACtB,KAAK,OAAO,GAEd,KAAK,GAAG,KAAK,EACRE,EAAQ,MAAM,KAAK,KAAK,GAAG,iBAAiBjC,CAAI,CAAC,EAAG,CAAE,GAAI,CAAE,CAAC,EAC9D0B,GAAO,KAAK,WAAW,EAC3B,KAAK,KAAK,MAAM,CAClB,CAES,MAAO,CACd,GAAI,CAAC,KAAK,IAAI,OAAO,EAAG,OACxB,KAAK,GAAG,MAAM,EAEd,IAAMQ,EAAO,KAAK,WAAa,KAAK,WAAW,SAAW,KAAK,OAC3DA,aAAgB,aAAeA,EAAK,aAAaA,EAAK,MAAM,CAClE,CAEA,UAAW,CACT,KAAK,KAAK,EAAE,KAAK,CACnB,CAEmB,WAAY,CAC7B,KAAK,KAAK,QAAQ,EAClB,KAAK,IAAI,QAAQ,CACnB,CACF,EACAC,EAAS,OAAQlC,CAAI",
6
- "names": ["ITEM", "Menu", "_Menu", "Component", "h", "on", "t", "first", "q", "row", "group", "rover", "roving", "entries", "rows", "it", "i", "checkable", "iconEl", "groupOf", "groups", "_", "g", "items", "search", "item", "focus", "anchor", "placement", "x", "y", "cfg", "Dropdown", "stagger", "back", "register"]
7
- }