optikos 0.3.0 → 0.4.0

package/dist/components/suggestfield.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-TZOQWCVH.js";import"../chunk-EV73ADN2.js";import"../chunk-5Q76ACVI.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-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 SuggestField};
+import{a}from"../chunk-4CWYF4O7.js";import"../chunk-N2LS4JD6.js";import"../chunk-H25XXQVH.js";import"../chunk-RG6SHPHF.js";import"../chunk-2YRQULDC.js";import"../chunk-DIOJGTUN.js";import"../chunk-OWEQT2HN.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-XR677UYD.js";import"../chunk-VV7CFMPZ.js";import"../chunk-TIPK3SCJ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-V5G5JECN.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as SuggestField};
 //# sourceMappingURL=suggestfield.js.map

package/dist/components/table.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-JBLRAM7Z.js";import"../chunk-LW2WRUVL.js";import"../chunk-OEAXCCVM.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as Table};
+import{a}from"../chunk-XFIREDWO.js";import"../chunk-TIPK3SCJ.js";import"../chunk-2HNQ2XRY.js";import"../chunk-XQHATUKN.js";import"../chunk-L5SQQFO7.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Table};
 //# sourceMappingURL=table.js.map

package/dist/components/tabs.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-CKXS375P.js";import"../chunk-XYZ6VZ5T.js";import"../chunk-ZWNQREWS.js";import"../chunk-VV7CFMPZ.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 Tabs};
+import{a}from"../chunk-3TCITFUU.js";import"../chunk-HRW25TMU.js";import"../chunk-DIOJGTUN.js";import"../chunk-BQEFLPDA.js";import"../chunk-VV7CFMPZ.js";import"../chunk-TIPK3SCJ.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Tabs};
 //# sourceMappingURL=tabs.js.map

package/dist/components/textarea.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-XHOBNSBO.js";import"../chunk-W3H7GTJY.js";import"../chunk-OWEQT2HN.js";import"../chunk-2ZRNGG2N.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 TextArea};
+import{a}from"../chunk-P4O57S6N.js";import"../chunk-2YRQULDC.js";import"../chunk-DIOJGTUN.js";import"../chunk-OWEQT2HN.js";import"../chunk-XR677UYD.js";import"../chunk-TIPK3SCJ.js";import"../chunk-V5G5JECN.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as TextArea};
 //# sourceMappingURL=textarea.js.map

package/dist/components/textfield.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-W3H7GTJY.js";import"../chunk-2ZRNGG2N.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 TextField};
+import{a}from"../chunk-2YRQULDC.js";import"../chunk-DIOJGTUN.js";import"../chunk-XR677UYD.js";import"../chunk-TIPK3SCJ.js";import"../chunk-V5G5JECN.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as TextField};
 //# sourceMappingURL=textfield.js.map

package/dist/components/timefield.js

@@ -0,0 +1,2 @@
+import{a}from"../chunk-M7FNPRV4.js";import"../chunk-2YRQULDC.js";import"../chunk-DIOJGTUN.js";import"../chunk-XR677UYD.js";import"../chunk-TIPK3SCJ.js";import"../chunk-V5G5JECN.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as TimeField};
+//# sourceMappingURL=timefield.js.map

package/dist/components/timefield.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/components/timeline.js

@@ -0,0 +1,2 @@
+import{a}from"../chunk-SB4ICXBV.js";import"../chunk-DIOJGTUN.js";import"../chunk-TIPK3SCJ.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Timeline};
+//# sourceMappingURL=timeline.js.map

package/dist/components/timeline.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/components/toast.js

@@ -1,2 +1,2 @@
-import{a,b}from"../chunk-IHE2MQ3W.js";import"../chunk-676AKAGF.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 Toast,b as toast};
+import{a,b}from"../chunk-J5QPFJ7M.js";import"../chunk-DIOJGTUN.js";import"../chunk-676AKAGF.js";import"../chunk-TIPK3SCJ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Toast,b as toast};
 //# sourceMappingURL=toast.js.map

package/dist/components/toggle.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-HXDTGP2K.js";import"../chunk-I4SP6JTU.js";import"../chunk-2ZRNGG2N.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 Toggle};
+import{a}from"../chunk-DWA45BWR.js";import"../chunk-Z6L55FTN.js";import"../chunk-DIOJGTUN.js";import"../chunk-XR677UYD.js";import"../chunk-TIPK3SCJ.js";import"../chunk-V5G5JECN.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Toggle};
 //# sourceMappingURL=toggle.js.map

package/dist/components/toolbar.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-ZWNQREWS.js";import"../chunk-VV7CFMPZ.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as Toolbar};
+import{a}from"../chunk-3F4MN2BU.js";import"../chunk-SEW5OCQF.js";import"../chunk-BQEFLPDA.js";import"../chunk-VV7CFMPZ.js";import"../chunk-TIPK3SCJ.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Toolbar};
 //# sourceMappingURL=toolbar.js.map

package/dist/components/tree.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-DBMWS3O5.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 Tree};
+import{a}from"../chunk-MQ5BYGFY.js";import"../chunk-DIOJGTUN.js";import"../chunk-TIPK3SCJ.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Tree};
 //# sourceMappingURL=tree.js.map

package/dist/components/treegrid.js

@@ -0,0 +1,2 @@
+import{a,b}from"../chunk-GZIDE5K2.js";import"../chunk-DIOJGTUN.js";import"../chunk-TIPK3SCJ.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as flattenTree,b as treeGrid};
+//# sourceMappingURL=treegrid.js.map

package/dist/components/treegrid.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": [],
+  "sourcesContent": [],
+  "mappings": "",
+  "names": []
+}

package/dist/components/viewmanager.js

@@ -1,2 +1,2 @@
-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};
+import{a,b,c}from"../chunk-NQV4THNE.js";import"../chunk-5BMG5ZBY.js";import"../chunk-JE56CJX2.js";import"../chunk-UQRQH2JW.js";import"../chunk-HRW25TMU.js";import"../chunk-3F4MN2BU.js";import"../chunk-SEW5OCQF.js";import"../chunk-AQ3RTHG5.js";import"../chunk-MNSDGJKA.js";import"../chunk-RG6SHPHF.js";import"../chunk-2YRQULDC.js";import"../chunk-HLS5FI55.js";import"../chunk-DIOJGTUN.js";import"../chunk-BQEFLPDA.js";import"../chunk-E4VNLYO2.js";import"../chunk-676AKAGF.js";import"../chunk-XR677UYD.js";import"../chunk-VV7CFMPZ.js";import"../chunk-TIPK3SCJ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-V5G5JECN.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{c as ViewManager,a as localViewStorage,b as restViewStorage};
 //# sourceMappingURL=viewmanager.js.map

package/dist/components/viewport.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-TOLTUOZS.js";import"../chunk-ZWNQREWS.js";import"../chunk-A2NKDOYN.js";import"../chunk-PZSHOSOS.js";import"../chunk-TIPK3SCJ.js";import"../chunk-MW3RWBZ7.js";import"../chunk-4C666HHU.js";export{a as Viewport};
+import{a}from"../chunk-CWIE74NX.js";import"../chunk-BQEFLPDA.js";import"../chunk-TIPK3SCJ.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Viewport};
 //# sourceMappingURL=viewport.js.map

package/dist/components/widget.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-5BC72727.js";import"../chunk-LQRFNQ2N.js";import"../chunk-XYZ6VZ5T.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-ZWNQREWS.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.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 Widget};
+import{a}from"../chunk-JSEI44A7.js";import"../chunk-UQRQH2JW.js";import"../chunk-HRW25TMU.js";import"../chunk-3F4MN2BU.js";import"../chunk-SEW5OCQF.js";import"../chunk-HLS5FI55.js";import"../chunk-DIOJGTUN.js";import"../chunk-BQEFLPDA.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-TIPK3SCJ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Widget};
 //# sourceMappingURL=widget.js.map

package/dist/components/window.js

@@ -1,2 +1,2 @@
-import{a}from"../chunk-4LZZ244E.js";import"../chunk-LQRFNQ2N.js";import"../chunk-XYZ6VZ5T.js";import"../chunk-GNU4VOOE.js";import"../chunk-23XLG2EM.js";import"../chunk-ZWNQREWS.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.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 Window};
+import{a}from"../chunk-JE56CJX2.js";import"../chunk-UQRQH2JW.js";import"../chunk-HRW25TMU.js";import"../chunk-3F4MN2BU.js";import"../chunk-SEW5OCQF.js";import"../chunk-HLS5FI55.js";import"../chunk-DIOJGTUN.js";import"../chunk-BQEFLPDA.js";import"../chunk-676AKAGF.js";import"../chunk-VV7CFMPZ.js";import"../chunk-TIPK3SCJ.js";import"../chunk-4AA4FQEM.js";import"../chunk-2UPUC4RK.js";import"../chunk-UDXO3KM3.js";import"../chunk-PZSHOSOS.js";import"../chunk-3VDLX7ET.js";import"../chunk-S4QD5NID.js";import"../chunk-4C666HHU.js";export{a as Window};
 //# sourceMappingURL=window.js.map

package/dist/core.js

@@ -1,2 +1,2 @@
-import{a as u}from"./chunk-GZ7X34QP.js";import{a as D,b as E}from"./chunk-OWEQT2HN.js";import{a as q,b as r,c as s}from"./chunk-ZWNQREWS.js";import{a as y,b as z}from"./chunk-E4VNLYO2.js";import{a as v,b as w,c as x}from"./chunk-676AKAGF.js";import{a as A,b as B,c as C}from"./chunk-VV7CFMPZ.js";import{a as t}from"./chunk-2ZRNGG2N.js";import{i as F}from"./chunk-5JEXM5S7.js";import{a as m}from"./chunk-A2NKDOYN.js";import{a as b,b as c,c as d,d as e,e as f,f as g}from"./chunk-PZSHOSOS.js";import{a as n,b as o,c as p}from"./chunk-TIPK3SCJ.js";import{a,b as h,c as i,d as j,e as k,f as l}from"./chunk-MW3RWBZ7.js";import"./chunk-4C666HHU.js";export{m as Component,s as Container,a as Emitter,t as Field,k as addMessages,b as attr,g as clamp,p as create,r as createLayout,F as date,A as focusables,j as getLocale,o as getType,c as h,e as kebab,v as layer,h as locales,x as lockModal,E as measure,y as place,f as px,n as register,q as registerLayout,C as roving,i as setLocale,l as t,w as toLayer,z as track,B as trapFocus,d as uid,u as validators,D as virtualize};
+import{a as E}from"./chunk-7Y2GHQRB.js";import{a as B,b as C,c as D}from"./chunk-YLFSCQL3.js";import{a as v,b as w,c as x}from"./chunk-BQEFLPDA.js";import{i as P}from"./chunk-2GKIF7A6.js";import{a as N,b as O}from"./chunk-OWEQT2HN.js";import{a as I,b as J}from"./chunk-E4VNLYO2.js";import{a as F,b as G,c as H}from"./chunk-676AKAGF.js";import{a as A}from"./chunk-XR677UYD.js";import{a as K,b as L,c as M}from"./chunk-VV7CFMPZ.js";import{a as s,b as t,c as u}from"./chunk-TIPK3SCJ.js";import{a as y,b as z}from"./chunk-V5G5JECN.js";import{a as n,b as o,c as p,e as q,f as r}from"./chunk-UDXO3KM3.js";import{a as b,b as c,c as d,d as e,e as f,f as g}from"./chunk-PZSHOSOS.js";import{a}from"./chunk-3VDLX7ET.js";import{a as h,b as i,c as j,d as k,e as l,f as m}from"./chunk-S4QD5NID.js";import"./chunk-4C666HHU.js";export{r as Component,x as Container,a as Emitter,A as Field,l as addMessages,p as allowed,b as attr,g as clamp,u as create,w as createLayout,P as date,K as focusables,q as gate,k as getLocale,y as getPath,t as getType,c as h,e as kebab,F as layer,C as loadState,h as locales,H as lockModal,O as measure,I as place,f as px,s as register,v as registerLayout,M as roving,D as saveState,j as setCurrency,i as setLocale,z as setPath,o as setPermissionMode,n as setPermissionResolver,B as setStateStorage,m as t,G as toLayer,J as track,L as trapFocus,d as uid,E as validators,N as virtualize};
 //# sourceMappingURL=core.js.map

package/dist/css/avatar.css

@@ -0,0 +1,68 @@
+@layer optikos {
+  :root {
+    --op-avatar-size: 2.25rem;
+    --op-avatar-dot: 0.625rem;
+    --op-avatar-size-sm: 1.5rem;
+    --op-avatar-size-lg: 3rem;
+    --op-avatar-size-xl: 4.5rem;
+    --op-avatar-ring: 2px;
+  }
+  .op-avatar {
+    position: relative;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex: none;
+    inline-size: var(--op-avatar-size);
+    block-size: var(--op-avatar-size);
+    background: var(--op-avatar-c, var(--op-chart-1, var(--op-color-primary)));
+    color: var(--op-color-surface);
+    font-family: var(--op-font-family);
+    font-size: calc(var(--op-avatar-size) * 0.4);
+    font-weight: 600;
+    line-height: 1;
+    user-select: none;
+  }
+  .op-avatar--circle {
+    border-radius: 50%;
+  }
+  .op-avatar--square {
+    border-radius: var(--op-avatar-radius, var(--op-radius));
+  }
+  .op-avatar--sm {
+    --op-avatar-size: var(--op-avatar-size-sm);
+  }
+  .op-avatar--lg {
+    --op-avatar-size: var(--op-avatar-size-lg);
+  }
+  .op-avatar--xl {
+    --op-avatar-size: var(--op-avatar-size-xl);
+  }
+  .op-avatar__img {
+    position: absolute;
+    inset: 0;
+    inline-size: 100%;
+    block-size: 100%;
+    object-fit: cover;
+    border-radius: inherit;
+  }
+  .op-avatar__status {
+    position: absolute;
+    inset-block-end: 0;
+    inset-inline-end: 0;
+    inline-size: var(--op-avatar-dot);
+    block-size: var(--op-avatar-dot);
+    border-radius: 50%;
+    background: var(--op-color-fg-muted);
+    box-shadow: 0 0 0 var(--op-avatar-ring) var(--op-color-surface);
+  }
+  .op-avatar__status.is-online {
+    background: var(--op-color-success);
+  }
+  .op-avatar__status.is-away {
+    background: var(--op-color-warning);
+  }
+  .op-avatar__status.is-busy {
+    background: var(--op-color-danger);
+  }
+}

package/dist/css/base.css

@@ -61,6 +61,15 @@
     --op-color-warning-soft: #fcecc9;
     --op-color-info: #1f5fa8;
     --op-color-info-soft: #dfeaf8;
+
+    /* categorical series colors (charts, avatars): distinct for color-blind eyes, 3:1 or more on the surface; the first one, unless a theme sets it, is its primary */
+    --op-chart-2: #b45309;
+    --op-chart-3: #1e7a4d;
+    --op-chart-4: #7e3fa8;
+    --op-chart-5: #0e7490;
+    --op-chart-6: #b3261e;
+    --op-chart-7: #8a6d00;
+    --op-chart-8: #5b6676;
     --op-color-focus: #2f7bd6;
     --op-color-disabled-fg: #9aa4b2;
     --op-color-disabled-bg: #eef1f5;

package/dist/css/carousel.css

@@ -0,0 +1,119 @@
+@layer optikos {
+  :root {
+    --op-carousel-dot-size: 0.5rem;
+    --op-carousel-gap: 0rem;
+  }
+  .op-carousel {
+    display: flex;
+    flex-direction: column;
+    gap: var(--op-space-2);
+    min-inline-size: 0;
+    font-family: var(--op-font-family);
+  }
+  .op-carousel__viewport {
+    position: relative;
+  }
+  .op-carousel__track {
+    position: relative;
+    display: flex;
+    gap: var(--op-carousel-gap);
+    overflow-x: auto;
+    scroll-snap-type: x mandatory;
+    scroll-behavior: smooth;
+    scrollbar-width: none;
+    border-radius: var(--op-carousel-radius, var(--op-radius));
+  }
+  .op-carousel__track::-webkit-scrollbar {
+    display: none;
+  }
+  .op-carousel__track:focus-visible {
+    outline: var(--op-focus-width) solid var(--op-color-focus);
+    outline-offset: var(--op-focus-offset);
+  }
+  .op-carousel__track > * {
+    flex: 0 0 calc((100% - (var(--op-carousel-per-view, 1) - 1) * var(--op-carousel-gap)) / var(--op-carousel-per-view, 1));
+    min-inline-size: 0;
+    scroll-snap-align: start;
+  }
+  .op-carousel__prev,
+  .op-carousel__next {
+    position: absolute;
+    inset-block-start: 50%;
+    translate: 0 -50%;
+    display: inline-flex;
+    padding: var(--op-space-2);
+    color: var(--op-carousel-arrow-fg, var(--op-color-fg));
+    background: var(--op-carousel-arrow-bg, var(--op-color-surface));
+    border: var(--op-border-width) solid var(--op-color-border);
+    border-radius: 50%;
+    box-shadow: var(--op-shadow);
+    cursor: pointer;
+  }
+  .op-carousel__prev {
+    inset-inline-start: var(--op-space-2);
+  }
+  .op-carousel__next {
+    inset-inline-end: var(--op-space-2);
+  }
+  [dir='rtl'] .op-carousel__prev .op-icon,
+  [dir='rtl'] .op-carousel__next .op-icon {
+    scale: -1 1;
+  }
+  .op-carousel__prev:disabled,
+  .op-carousel__next:disabled {
+    opacity: 0.4;
+    cursor: default;
+  }
+  .op-carousel__bar {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: var(--op-space-3);
+  }
+  .op-carousel__bar:not(:has(:not([hidden]))) {
+    display: none;
+  }
+  .op-carousel__dots {
+    display: flex;
+    gap: var(--op-space-1);
+  }
+  .op-carousel__dot {
+    inline-size: var(--op-carousel-dot-size);
+    block-size: var(--op-carousel-dot-size);
+    padding: 0;
+    background: var(--op-carousel-dot-bg, var(--op-color-border-strong));
+    border: 0;
+    border-radius: 50%;
+    cursor: pointer;
+  }
+  .op-carousel__dot[aria-current] {
+    background: var(--op-carousel-dot-active-bg, var(--op-color-primary));
+  }
+  .op-carousel__toggle {
+    display: inline-flex;
+    padding: var(--op-space-1);
+    color: var(--op-color-fg);
+    background: none;
+    border: 0;
+    border-radius: var(--op-radius);
+    cursor: pointer;
+  }
+  .op-carousel__prev:focus-visible,
+  .op-carousel__next:focus-visible,
+  .op-carousel__dot:focus-visible,
+  .op-carousel__toggle:focus-visible {
+    outline: var(--op-focus-width) solid var(--op-color-focus);
+    outline-offset: var(--op-focus-offset);
+  }
+  .op-carousel__prev[hidden],
+  .op-carousel__next[hidden],
+  .op-carousel__toggle[hidden],
+  .op-carousel__dots[hidden] {
+    display: none;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .op-carousel__track {
+      scroll-behavior: auto;
+    }
+  }
+}

package/dist/css/chart.css

@@ -0,0 +1,168 @@
+@layer optikos {
+  :root {
+    --op-chart-line-width: 2px;
+    --op-chart-font-size: 0.75rem;
+    --op-chart-area-opacity: 0.18;
+    --op-chart-tip-width: 11rem;
+    --op-chart-swatch: 0.625rem;
+    --op-chart-total-size: 1.125rem;
+    --op-chart-bar-radius: 2px;
+  }
+  .op-chart {
+    display: flex;
+    flex-direction: column;
+    gap: var(--op-space-2);
+    min-inline-size: 0;
+    font-family: var(--op-font-family);
+    color: var(--op-chart-fg, var(--op-color-fg));
+  }
+  .op-chart__plot {
+    position: relative;
+  }
+  .op-chart__svg {
+    display: block;
+    inline-size: 100%;
+    overflow: visible;
+    touch-action: pan-y;
+  }
+  .op-chart__svg:focus-visible {
+    outline: var(--op-focus-width) solid var(--op-color-focus);
+    outline-offset: var(--op-focus-offset);
+  }
+  .op-chart__grid line {
+    stroke: var(--op-chart-grid, var(--op-color-border));
+    stroke-width: var(--op-border-width);
+  }
+  .op-chart__grid .op-chart__axis {
+    stroke: var(--op-color-border-strong);
+  }
+  .op-chart__tick,
+  .op-chart__empty {
+    fill: var(--op-color-fg-muted);
+    font-size: var(--op-chart-font-size);
+  }
+  .op-chart__total {
+    fill: var(--op-chart-fg, var(--op-color-fg));
+    font-size: var(--op-chart-total-size);
+    font-weight: 600;
+  }
+  .op-chart__series {
+    --op-chart-c: var(--op-chart-1, var(--op-color-primary));
+  }
+  .op-chart__bar {
+    fill: var(--op-chart-c);
+  }
+  .op-chart__line {
+    fill: none;
+    stroke: var(--op-chart-c);
+    stroke-width: var(--op-chart-line-width);
+    stroke-linejoin: round;
+    stroke-linecap: round;
+  }
+  .op-chart__area {
+    fill: var(--op-chart-c);
+    fill-opacity: var(--op-chart-area-opacity);
+    stroke: none;
+  }
+  .op-chart__dot {
+    fill: var(--op-color-surface);
+    stroke: var(--op-chart-c);
+    stroke-width: var(--op-chart-line-width);
+  }
+  .op-chart--sparkline .op-chart__dot {
+    fill: var(--op-chart-c);
+  }
+  .op-chart__slice {
+    fill: var(--op-chart-c);
+    stroke: var(--op-color-surface);
+    stroke-width: var(--op-chart-line-width);
+    transition: opacity var(--op-duration) var(--op-easing);
+  }
+  .op-chart__svg:has(.is-active) .op-chart__slice:not(.is-active) {
+    opacity: 0.55;
+  }
+  .op-chart__hit {
+    fill: transparent;
+  }
+  .op-chart__guide {
+    stroke: var(--op-color-border-strong);
+    stroke-width: var(--op-border-width);
+    visibility: hidden;
+  }
+  .op-chart__guide.is-on {
+    visibility: visible;
+  }
+  .op-chart__tip {
+    position: absolute;
+    inset-block-start: 0;
+    z-index: 1;
+    inline-size: max-content;
+    max-inline-size: var(--op-chart-tip-width);
+    padding: var(--op-space-2) var(--op-space-3);
+    transform: translateX(var(--op-space-3));
+    background: var(--op-color-surface);
+    color: var(--op-color-fg);
+    border: var(--op-border-width) solid var(--op-color-border);
+    border-radius: var(--op-radius);
+    box-shadow: var(--op-shadow);
+    font-size: var(--op-chart-font-size);
+    pointer-events: none;
+  }
+  .op-chart__tip.is-left {
+    transform: translateX(calc(-100% - var(--op-space-3)));
+  }
+  .op-chart__tip-head {
+    font-weight: 600;
+    margin-block-end: var(--op-space-1);
+  }
+  .op-chart__tip-row {
+    display: flex;
+    align-items: center;
+    gap: var(--op-space-2);
+  }
+  .op-chart__tip-row b {
+    margin-inline-start: auto;
+    padding-inline-start: var(--op-space-3);
+    font-variant-numeric: tabular-nums;
+  }
+  .op-chart__legend {
+    display: flex;
+    flex-wrap: wrap;
+    gap: var(--op-space-1) var(--op-space-3);
+  }
+  .op-chart__key {
+    display: inline-flex;
+    align-items: center;
+    gap: var(--op-space-2);
+    padding: 0;
+    border: 0;
+    background: none;
+    font: inherit;
+    font-size: var(--op-chart-font-size);
+    color: var(--op-color-fg);
+    cursor: pointer;
+  }
+  .op-chart__key.is-off {
+    color: var(--op-color-fg-muted);
+    text-decoration: line-through;
+  }
+  .op-chart__key:focus-visible {
+    outline: var(--op-focus-width) solid var(--op-color-focus);
+    outline-offset: var(--op-focus-offset);
+  }
+  .op-chart__swatch {
+    inline-size: var(--op-chart-swatch);
+    block-size: var(--op-chart-swatch);
+    border-radius: var(--op-chart-bar-radius);
+    background: var(--op-chart-c);
+    flex: none;
+  }
+  .op-chart__key.is-off .op-chart__swatch {
+    opacity: 0.35;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    .op-chart__slice {
+      transition: none;
+    }
+  }
+}

package/dist/css/core.css

@@ -85,4 +85,40 @@
     outline: var(--op-focus-width) solid var(--op-color-focus);
     outline-offset: var(--op-focus-offset);
   }
+
+  /* print: the page, not the application chrome (Grid has printGrid for what its virtual list does not render) */
+  @media print {
+    .op-no-print,
+    .op-layer,
+    .op-navmenu,
+    .op-formactions,
+    .op-pagination,
+    .op-toast,
+    .op-mask,
+    .op-tabs__list,
+    .op-viewport > .op-toolbar,
+    .op-button {
+      display: none !important;
+    }
+    .op-viewport,
+    .op-viewport > *,
+    .op-panel,
+    .op-form {
+      position: static !important;
+      overflow: visible !important;
+      block-size: auto !important;
+      box-shadow: none !important;
+    }
+    .op-field,
+    .op-panel,
+    .op-fieldset {
+      break-inside: avoid;
+    }
+    .op-field__control input,
+    .op-field__control textarea {
+      border-color: transparent;
+      background: none;
+      padding-inline: 0;
+    }
+  }
 }

package/dist/css/datetimefield.css

@@ -0,0 +1,15 @@
+@layer optikos {
+  .op-datetimefield__parts {
+    display: flex;
+    gap: var(--op-datetimefield-gap, var(--op-space-2));
+  }
+  .op-datetimefield__parts > .op-field {
+    margin: 0;
+  }
+  .op-datetimefield__parts > .op-field:first-child {
+    flex: 1 1 60%;
+  }
+  .op-datetimefield__parts > .op-field:last-child {
+    flex: 1 1 40%;
+  }
+}

package/dist/css/grid.css

@@ -10,6 +10,7 @@
     --op-grid-action-idle-opacity: 0.45;
     --op-grid-action-disabled-opacity: 0.3;
     --op-grid-selected-bar-width: 0.125rem;
+    --op-grid-lock-shadow-size: 0.375rem;
   }
   .op-grid {
     --_border: var(--op-grid-border, var(--op-color-border));
@@ -375,4 +376,43 @@
   .op-grid__colgroup ~ .op-grid__colitem {
     padding-inline-start: var(--op-space-4);
   }
+
+  /* locked columns: body cells stick, header cells are shifted by the scroll (the header scrolls by script, not natively) */
+  .op-grid__cell.is-locked {
+    z-index: 1;
+    background: var(--op-grid-bg, var(--op-color-surface));
+  }
+  .op-grid__body-row .is-locked-start {
+    position: sticky;
+    inset-inline-start: var(--_lock);
+  }
+  .op-grid__body-row .is-locked-end {
+    position: sticky;
+    inset-inline-end: var(--_lock);
+  }
+  .op-grid__hcell.is-locked {
+    position: relative;
+    background: var(--op-grid-header-bg, var(--op-color-surface-2));
+  }
+  .op-grid__hcell.is-locked-start {
+    inset-inline-start: var(--op-grid-scroll-x);
+  }
+  .op-grid__hcell.is-locked-end {
+    inset-inline-start: calc(-1 * var(--op-grid-scroll-end));
+  }
+  .op-grid__body-row:hover .is-locked {
+    background: var(--op-grid-row-hover-bg, var(--op-color-hover));
+  }
+  .op-grid--striped .op-grid__body-row.is-odd .is-locked {
+    background: var(--op-grid-row-stripe-bg, var(--op-color-surface-2));
+  }
+  .op-grid__body-row.is-selected .is-locked {
+    background: var(--op-grid-row-selected-bg, var(--op-color-selected));
+  }
+  .op-grid.is-scrolled-start .is-lock-edge.is-locked-start {
+    box-shadow: var(--op-grid-lock-shadow-size) 0 var(--op-grid-lock-shadow-size) calc(-1 * var(--op-grid-lock-shadow-size)) var(--op-color-border-strong);
+  }
+  .op-grid.is-scrolled-end .is-lock-edge.is-locked-end {
+    box-shadow: calc(-1 * var(--op-grid-lock-shadow-size)) 0 var(--op-grid-lock-shadow-size) calc(-1 * var(--op-grid-lock-shadow-size)) var(--op-color-border-strong);
+  }
 }

package/dist/css/gridexport.css

@@ -0,0 +1,35 @@
+@layer optikos {
+  .op-print-sheet {
+    display: none;
+  }
+  @media print {
+    html.op-printing body > *:not(.op-print-sheet) {
+      display: none !important;
+    }
+    html.op-printing .op-print-sheet {
+      display: block;
+      font-family: var(--op-font-family);
+      color: var(--op-color-fg);
+    }
+    .op-print-sheet table {
+      inline-size: 100%;
+      border-collapse: collapse;
+      font-size: var(--op-font-size-sm);
+    }
+    .op-print-sheet thead {
+      display: table-header-group;
+    }
+    .op-print-sheet tr {
+      break-inside: avoid;
+    }
+    .op-print-sheet th,
+    .op-print-sheet td {
+      padding: var(--op-space-1) var(--op-space-2);
+      border-block-end: var(--op-border-width) solid var(--op-color-border);
+      text-align: start;
+    }
+    .op-print-sheet th {
+      border-block-end-color: var(--op-color-fg);
+    }
+  }
+}