effcss 2.2.1 → 3.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -15,40 +15,45 @@
15
15
 
16
16
  </div>
17
17
 
18
- EffCSS is a self-confident CSS-in-JS library based only on the browser APIs.
18
+ EffCSS is a self-confident CSS-in-JS library based only on the browser APIs. Use the full power of JS & TS when creating styles!
19
19
 
20
20
  ## Some features
21
21
 
22
- - zero-dependency
23
- - framework agnostic
24
- - runtime stylesheets generation
25
- - built-in BEM support
26
- - server-side rendering compatible
22
+ - zero-dependency
23
+ - framework agnostic
24
+ - runtime stylesheets generation
25
+ - built-in BEM support
26
+ - server-side rendering compatible
27
27
 
28
28
  ## Links
29
29
 
30
- - [Docs](https://effcss.surge.sh)
31
- - [Repository](https://gitverse.ru/msabitov/effcss)
32
- - [Github mirror](https://github.com/msabitov/effcss)
33
-
34
- ## Use with
35
-
36
- - [React](https://stackblitz.com/edit/vitejs-react-effcss?file=index.html)
37
- - [React SSR](https://stackblitz.com/edit/vitejs-react-ssr-effcss?file=index.html)
38
- - [Svelte](https://stackblitz.com/edit/vitejs-svelte-effcss?file=index.html)
39
- - [Svelte SSR](https://stackblitz.com/edit/vitejs-svelte-ssr-effcss?file=index.html)
40
- - [Vue](https://stackblitz.com/edit/vitejs-vue-effcss?file=index.html)
41
- - [Preact](https://stackblitz.com/edit/vitejs-preact-effcss?file=index.html)
42
- - [Qwik](https://stackblitz.com/edit/vitejs-qwik-effcss?file=index.html)
43
- - [Solid js](https://stackblitz.com/edit/vitejs-solid-effcss?file=index.html)
44
- - [Lit](https://stackblitz.com/edit/vitejs-lit-effcss?file=index.html)
45
- - [Angular](https://stackblitz.com/edit/angular-effcss?file=src%2Findex.html)
46
- - [HTML only](https://stackblitz.com/edit/static-effcss?file=index.html)
47
-
48
- ## Try with
49
-
50
- - [Storybook](https://stackblitz.com/edit/storybook-react-effcss?file=src%2Findex.ts)
51
- - [Vitest benchmarking](https://stackblitz.com/edit/vitest-bench-effcss?file=tests%2FPublic.bench.ts)
30
+ - [Docs](https://effcss.surge.sh)
31
+ - [Repository](https://gitverse.ru/msabitov/effcss)
32
+ - [Github mirror](https://github.com/msabitov/effcss)
33
+
34
+ ## V3 examples
35
+
36
+ - [Vanilla TS](https://stackblitz.com/edit/effcss-3-ts-vitejs?file=index.html)
37
+ - [React](https://stackblitz.com/edit/effcss-3-react-vitejs?file=index.html)
38
+ - [React SSR](https://stackblitz.com/edit/effcss-3-react-ssr-vitejs?file=index.html)
39
+ - [Svelte](https://stackblitz.com/edit/effcss-3-svelte-vitejs?file=index.html)
40
+ - [Svelte SSR](https://stackblitz.com/edit/effcss-3-svelte-ssr-vitejs?file=index.html)
41
+
42
+ ## V2 examples
43
+
44
+ - [React](https://stackblitz.com/edit/vitejs-react-effcss?file=index.html)
45
+ - [React SSR](https://stackblitz.com/edit/vitejs-react-ssr-effcss?file=index.html)
46
+ - [Svelte](https://stackblitz.com/edit/vitejs-svelte-effcss?file=index.html)
47
+ - [Svelte SSR](https://stackblitz.com/edit/vitejs-svelte-ssr-effcss?file=index.html)
48
+ - [Vue](https://stackblitz.com/edit/vitejs-vue-effcss?file=index.html)
49
+ - [Preact](https://stackblitz.com/edit/vitejs-preact-effcss?file=index.html)
50
+ - [Qwik](https://stackblitz.com/edit/vitejs-qwik-effcss?file=index.html)
51
+ - [Solid js](https://stackblitz.com/edit/vitejs-solid-effcss?file=index.html)
52
+ - [Lit](https://stackblitz.com/edit/vitejs-lit-effcss?file=index.html)
53
+ - [Angular](https://stackblitz.com/edit/angular-effcss?file=src%2Findex.html)
54
+ - [HTML only](https://stackblitz.com/edit/static-effcss?file=index.html)
55
+ - [Storybook](https://stackblitz.com/edit/storybook-react-effcss?file=src%2Findex.ts)
56
+ - [Vitest benchmarking](https://stackblitz.com/edit/vitest-bench-effcss?file=tests%2FPublic.bench.ts)
52
57
 
53
58
  ## Installation
54
59
 
@@ -67,95 +72,148 @@ yarn add effcss
67
72
 
68
73
  ## Quick start
69
74
 
70
- First you need to connect the `<style-provider>`:
75
+ First, define and add `Style provider` to your HTML:
71
76
 
72
77
  ```html
73
78
  <!DOCTYPE html>
74
79
  <html lang="en">
75
- <head>
76
- <script src="https://unpkg.com/effcss/dist/build/define-provider.min.js" crossorigin="anonymous"></script>
77
- </head>
78
- <body>
79
- <style-provider>
80
- <div id="root"></div>
81
- </style-provider>
82
- </body>
80
+ <head>
81
+ <!-- the first script defines the style provider custom element -->
82
+ <script src="https://unpkg.com/effcss/dist/build/define-provider.min.js" crossorigin="anonymous"></script>
83
+ <!-- the second script is the style provider itself -->
84
+ <script is="effcss-provider"></script>
85
+ </head>
86
+ <body>
87
+ <div id="root"></div>
88
+ </body>
83
89
  </html>
84
90
  ```
85
91
 
86
- Then you only need to create the necessary styles before rendering. The easiest way to do this is via the `Style Dispatcher`:
92
+ Second, use `Style consumer` to operate styles in your code:
87
93
 
88
94
  **main.js**
89
95
 
90
96
  ```jsx
91
- import { createDispatcher } from "effcss/utils/browser";
97
+ import { createConsumer } from "effcss/consumer";
92
98
 
93
- const styleDispatcher = createDispatcher();
99
+ const consumer = createConsumer();
94
100
 
95
- const root = createRoot(document.getElementById('root'));
96
- root.render(<App css={styleDispatcher}/>);
101
+ const root = createRoot(document.getElementById("root"));
102
+ root.render(<App css={consumer} />);
97
103
  ```
98
104
 
105
+ Each CSS stylesheet corresponds to a single `Stylesheet maker`. `Stylesheet maker` is a pure JS function that should return object with style rules:
106
+
99
107
  **App.js**
100
108
 
101
109
  ```jsx
102
- import { useRef } from 'react'
103
-
104
- const cardStyle = {
105
- c: {
106
- // BEM block
107
- _: {
108
- display: 'flex'
109
- },
110
- // BEM element
111
- __logo: {
112
- padding: '2em'
113
- },
114
- // BEM boolean element modifier
115
- __logo_c_: {
116
- color: '#888',
117
- ':hover': {
118
- color: 'black',
119
- }
120
- },
121
- // BEM element modifier with value
122
- __logo_sz_lg: {
123
- width: '5rem'
124
- },
125
- // ordinary CSS
126
- '.square': {
127
- aspectRatio: 1,
128
- ':focus': {
129
- aspectRatio: '1/2'
130
- }
131
- }
132
- }
110
+ import { useRef } from 'react';
111
+ import { TStyleSheetMaker } from 'effcss';
112
+
113
+ // describe your styles in BEM notation so that other people can use them
114
+
115
+ export interface ICardMaker {
116
+ /**
117
+ * Card block
118
+ */
119
+ card: {
120
+ /**
121
+ * Card modifiers
122
+ */
123
+ '': {
124
+ /**
125
+ * Card border radius
126
+ */
127
+ rounded: '';
128
+ /**
129
+ * Card height
130
+ */
131
+ h: 'full' | 'half';
132
+ };
133
+ /**
134
+ * Card logo
135
+ */
136
+ logo: {},
137
+ /**
138
+ * Card footer
139
+ */
140
+ footer: {
141
+ /**
142
+ * Footer visibility
143
+ */
144
+ visible: '';
145
+ /**
146
+ * Footer size
147
+ */
148
+ sz: 's' | 'm' | 'l';
149
+ };
150
+ };
151
+ }
152
+
153
+ const myStyleSheetMaker: TStyleSheetMaker = ({ bem, pseudo, at: { kf }, merge }) = {
154
+ // creates unique keyframes identifier
155
+ const spin = kf();
156
+ // deeply merges objects
157
+ const cardLogoStyles = merge({
158
+ animation: `${spin.k} infinite 20s linear`,
159
+ [pseudo.h()]: {
160
+ filter: "drop-shadow(0 0 2em #61dafbaa)",
161
+ }
162
+ }, {
163
+ border: 'none',
164
+ aspectRatio: 1,
165
+ [pseudo.h()]: {
166
+ opacity: 0.5
167
+ }
168
+ });
169
+ return {
170
+ [spin.s]: {
171
+ from: {
172
+ transform: 'rotate(0deg)',
173
+ },
174
+ to: {
175
+ transform: 'rotate(360deg)',
176
+ },
177
+ },
178
+ [bem<ICardMaker>('card')]: { ... },
179
+ [bem<ICardMaker>('card.logo')]: cardLogoStyles,
180
+ [bem<ICardMaker>('card..rounded')]: { ... },
181
+ [bem<ICardMaker>('card..h.full')]: { ... },
182
+ [bem<ICardMaker>('card.footer')]: { ... },
183
+ [bem<ICardMaker>('card.footer.visible')]: { ... },
184
+ [bem<ICardMaker>('card.footer.sz.m')]: { ... },
185
+ };
133
186
  };
134
187
 
135
188
  export const App = (props) => {
136
- const { css } = props;
137
- const stylesRef = useRef();
138
- if (!stylesRef.current) {
139
- const cardCSS = css.use(cardStyle);
140
- stylesRef.current = {
141
- // just block selector
142
- block: cardCSS()(),
143
- // element with modifiers
144
- logo: cardCSS('logo')({
145
- c: '',
146
- sz: 'lg'
147
- }),
148
- };
149
- }
150
- const styles = stylesRef.current;
151
-
152
- // apply attributes to appropriate nodes
153
- return <div {...styles.block}>
154
- <div {...styles.logo}>
155
- ...
156
- </div>
157
- </div>;
158
- }
189
+ const { css } = props;
190
+ const stylesRef = useRef();
191
+ if (!stylesRef.current) {
192
+ const bem = css.use(myStyleSheetMaker);
193
+ // thanks to the ICardMaker interface,
194
+ // you don't need to look at the implementation - just create the necessary attributes
195
+ stylesRef.current = {
196
+ card: bem<ICardMaker>('card..rounded'),
197
+ // element with modifiers
198
+ footer: bem<ICardMaker>({
199
+ card: {
200
+ footer: {
201
+ visible: '',
202
+ size: 'm'
203
+ }
204
+ }
205
+ })
206
+ };
207
+ }
208
+ const styles = stylesRef.current;
209
+
210
+ // just apply attributes to appropriate elements
211
+ return (
212
+ <div {...styles.card}>
213
+ <div {...styles.footer}>...</div>
214
+ </div>
215
+ );
216
+ };
159
217
  ```
160
218
 
161
219
  That's all. Enjoy simplicity.
@@ -1,7 +1,7 @@
1
1
  /*
2
- * EffCSS v2.2.1
2
+ * EffCSS v3.0.1
3
3
  * {@link https://gitverse.ru/msabitov/effcss}
4
4
  * Copyright (c) Marat Sabitov
5
5
  * @license Apache 2.0
6
6
  */
7
- const t=Object.entries,s=(s,e,i)=>t(s).reduce(e,i),e=t=>"object"==typeof t,i=t=>`{${t}}`,r=Object.assign.bind(Object),n=(t,s)=>`${t}:${s};`,o=(t,s)=>["@property",t,i(n("syntax",s.syn||'"*"')+n("inherits",s.inh||!1)+(s.ini?n("initial-value",s.ini):""))].join(" "),l=t=>`var(${t})`,a=({l:t,c:s,h:e,a:i=1})=>`oklch(${t} ${s} ${e} / ${i})`,c=["l","c","h","a"];class h{constructor(h){this._k={},this._s={},this._sel=t=>{let s,e,i,r,n;return[s,n]=t.split(":"),s.startsWith("__")?[e,i,r]=s.slice(2).split("_"):[e,i,r]=s.split("_"),{e:e,m:i,mv:r,s:n}},this._var=(...t)=>this._r.varName(...t),this._kf=(...t)=>this._r.kfName(...t),this.compile=(h,m)=>{const{_:f,kf:d,k:b={},v:p={},c:u}=m,g=this._r.selector.bind(this),_=this._sel;let v=r({},u),$=r({},b),y=r({_:{}},p),x="";if(f)for(let t in f){const s=f[t];if("c"===s.typ){const e={};c.forEach((i=>{const r=t+i,n=this._var(h,r);e[i]=n,$["_"+r]=e[i],x+=o(n,s)})),y._[t]=a({l:l(e.l),c:l(e.c),h:l(e.h),a:l(e.a)}),s.all&&(v["_"+t+"l"]=`&lig=>${this._var(h,t+"l")}:{1}`,v["_"+t+"c"]=`&chr=>${this._var(h,t+"c")}:{1}`,v["_"+t+"h"]=`&hue=>${this._var(h,t+"h")}:{1}`,v["_"+t+"a"]=`&alp=>${this._var(h,t+"a")}:{1}`)}else{const e=this._var(h,t);$["_"+t]=e,y._[t]=l(e),x+=o(e,s)}}const w=t=>$[t]||this._k[t],k=t=>{var s;return y[t]||this._s[t]||(null===(s=this._s)||void 0===s?void 0:s.root[t])},j=t=>t.replaceAll(/\{(.+?)\}/g,((t,s)=>{const[e,i]=s.split(".");let r;if(i){const t=k(e);r=(null==t?void 0:t[i])||(null==t?void 0:t.def)||""}else r=w(e)||"";return""+r})),z=s=>{const e=s.split("?");let i;for(let s in e){const r=e[s],[n,o]=r.split("=>"),l=n.match(/(\w+)(\[[\w,]+\])?/);if(!l)continue;const[a,c,h]=l,m=k(c);if(!m)continue;i=m;let f=t(i);const d=null==h?void 0:h.slice(1,-1).split(",");if(d){const t=new Set(d);f=f.filter((([s,e])=>t.has(s)))}if(o){let[t,s]=o.split("|");void 0===s&&(s=t,t=""),f=f.map((([e,i])=>[t.replace("{0}",e)||e,j(s.replaceAll("{1}",""+i))]))}(d||o)&&(i=Object.fromEntries(f));break}return i};function O(t,r,o){var l,a,c,m;let f=""+t;if((null===(l=null==t?void 0:t.startsWith)||void 0===l?void 0:l.call(t,"$"))&&(f=""+w(t.slice(1)),!f))return"";if(Array.isArray(r))return O(f,Object.assign({},...r.map((t=>"string"==typeof t?z(t):t))),o);if(null==r)return"";if(e(r)){const t=!o||(null===(a=o.startsWith)||void 0===a?void 0:a.call(o,"@"))||f.startsWith("&")||f.startsWith("@")?"":"&";if(f.startsWith("_")){const{e:n,m:o,mv:l}=_(f);return o&&"string"!=typeof l?s(r,((r,[l,a])=>{let c;return c=e(a)?s(a,((t,s)=>t+O(...s,f)),""):a+";",r+t+g({b:h,e:n,m:o,mv:l})+i(c)}),""):t+g({b:h,e:n,m:o,mv:l})+i(s(r,((t,s)=>t+O(...s,f)),""))}return t+f+i(s(r,((t,s)=>t+O(...s,f)),""))}{let t=""+r;return(null===(c=null==t?void 0:t.startsWith)||void 0===c?void 0:c.call(t,"&"))?O(f,z(t.slice(1)),o):(null===(m=null==t?void 0:t.includes)||void 0===m?void 0:m.call(t,"{"))?O(f,j(t),o):n(f.replace(/[A-Z]/g,(t=>"-"+t.toLowerCase())),t)}}let S="";if(d)for(let t in d){const e=d[t],r=this._kf(h,t);$["kf_"+t]=r,S+=`@keyframes ${r} `+i(s(e,((t,[e,r])=>t+e+(String(+e)===e?"%":"")+i(s(r,((t,s)=>t+O(...s)),""))),""))}return x+S+s(v,((t,s)=>t+O(...s)),"")};const{sets:m,keys:f,resolver:d}=h;this._r=d,f&&(this._k=f),m&&(this._s=m)}}const m=t=>Array.isArray(t)?t:[t];class f{constructor(){this._s={},this._r={},this._a=[],this._l=[],this.getIndex=t=>this._a.findIndex((s=>s===t)),this.get=t=>this._s[t],this.has=t=>!!t&&!!this.get(t),this.getAll=()=>this._s,this.add=(t,s)=>{if(!this._s[t])return this._s[t]=s,this._a.push(s),this.notify(),!0},this.status=t=>{const s=this.get(t);return!!s&&-1!==this.getIndex(s)},this.on=t=>{const s=m(t).reduce(((t,s)=>{const e=this.get(s);return!(!e||this.status(s))&&(this._a.push(e),t)}),!0);return this.notify(),s},this.off=t=>{const s=m(t).reduce(((t,s)=>{const e=this.get(s);if(e&&this.status(s)){const s=this.getIndex(e);return this._a.splice(s,1),t}return!1}),!0);return this.notify(),s},this.remove=t=>{const s=this.get(t);if(!s)return;const e=this.getIndex(s);return e>-1&&(this._a.splice(e,1),delete this._s[t],delete this._r[t]),this.notify(),!0},this.pack=(t,s)=>{const e=new CSSStyleSheet;if(e.replaceSync(s),e.cssRules.length)return this.add(t,e);console.log(`StyleSheet '${t}' is empty`)},this.replace=(t,s)=>{const e=this._s[t];if(e)return e.replaceSync(s),this.notify(),!0},this.apply=t=>{t.adoptedStyleSheets=this._a},this.registerNode=t=>{this._l.findIndex((s=>s.deref()===t))>=0||(this._l.push(new WeakRef(t)),this.apply(t))},this.unregisterNode=t=>{const s=this._l.findIndex((s=>s.deref()===t));s>=0&&this._l.splice(s,1)},this.notify=()=>{this._l=this._l.reduce(((t,s)=>{const e=s.deref();return e&&(this.apply(e),t.push(s)),t}),[])}}removeAll(){return this._a.splice(0),this._s={},this._r={},this.notify(),!0}}const d=(...t)=>t.join(","),b="rem",p="-",u=" ",g="-x",_="-y",v="down",$="horizontal",y="vertical",x="text",w=x+p,k="font",j=k+p,z="column",O=z+p,S="max-",A="min-",E="content",C=E+"s",N="-items",W="self",I="inline",P="block",K="size",q="-radius",M="direction",R="outline",B="style",F=p+B,J="end",L=p+J,G="start",H=p+G,T="center",Z="word",D="line",Q="break",U=Q+p,V="wrap",X="no"+V,Y="rule",tt="object",st="top",et=p+st,it="left",rt=p+it,nt="bottom",ot=p+nt,lt="right",at=p+lt,ct="width",ht=p+ct,mt="color",ft=p+mt,dt="overflow",bt="align",pt="type",ut="transform",gt="all",_t="height",vt="normal",$t="opacity",yt="visibility",xt="scale",wt="box",kt=p+wt,jt="border",zt="position",Ot="none",St="auto",At="fill",Et="stroke",Ct="reverse",Nt="space",Wt="fixed",It="origin",Pt="alpha",Kt="luminance",qt="clip",Mt="zoom",Rt="scroll",Bt="padding",Ft="margin",Jt="both",Lt="mode",Gt="repeat",Ht="light",Tt="linear",Zt="hidden",Dt="shadow",Qt="behavior",Ut="orientation",Vt="name",Xt="after",Yt="before",ts="image",ss="list"+F,es=ss+p+pt,is=ss+p+zt,rs=ss+p+ts,ns=mt+"-scheme",os=jt+ot,ls=jt+rt,as=jt+at,cs=jt+et,hs=jt+p+P,ms=jt+p+I,fs=hs+H,ds=hs+L,bs=ms+H,ps=ms+L,us=jt+ht,gs=os+ht,_s=ls+ht,vs=as+ht,$s=cs+ht,ys=hs+ht,xs=ms+ht,ws=fs+ht,ks=ds+ht,js=bs+ht,zs=ps+ht,Os=jt+q,Ss=os+rt+q,As=os+at+q,Es=cs+rt+q,Cs=cs+at+q,Ns=jt+H+L+q,Ws=jt+H+H+q,Is=jt+L+L+q,Ps=jt+L+H+q,Ks=jt+ft,qs=ls+ft,Ms=as+ft,Rs=cs+ft,Bs=os+ft,Fs=hs+ft,Js=ms+ft,Ls=fs+ft,Gs=ds+ft,Hs=bs+ft,Ts=ps+ft,Zs=jt+F,Ds=ls+F,Qs=as+F,Us=cs+F,Vs=os+F,Xs=hs+F,Ys=ms+F,te=fs+F,se=ds+F,ee=bs+F,ie=ps+F,re=R+ft,ne=R+ht,oe=R+F,le=R+p+"offset",ae=dt+g,ce=dt+_,he=tt+p+"fit",me=tt+p+zt,fe=xt+p+v,de=wt+p+Dt,be=Bt+kt,pe=jt+kt,ue=E+kt,ge=At+kt,_e=Et+kt,ve="view"+kt,$e="no-"+qt,ye=Gt+g,xe=Gt+_,we="no-"+Gt,ke=Bt+rt,je=Bt+et,ze=Bt+at,Oe=Bt+ot,Se=Ft+rt,Ae=Ft+et,Ee=Ft+at,Ce=Ft+ot,Ne="grid",We="row",Ie="gap",Pe="justify",Ke="flex",qe=Ke+p,Me="place"+N,Re=I+p+Ke,Be=qe+"basis",Fe=qe+"grow",Je=qe+"shrink",Le=qe+M,Ge=qe+V,He=Pe+p+E,Te=Pe+N,Ze=bt+N,De=bt+p+E,Qe=bt+p+W,Ue=Ne+p+"template",Ve=Ue+p+We+"s",Xe=Ue+p+z+"s",Ye=We+p+Ie,ti=O+Ie,si=Pe+p+W,ei=Ne+p+We,ii=ei+L,ri=ei+H,ni=Ne+p+z,oi=ni+L,li=ni+H,ai=O+"count",ci=O+At,hi=O+Y,mi=hi+ft,fi=hi+F,di=hi+ht,bi=O+"span",pi=z+ht,ui=We+p+Ct,gi=O+Ct,_i=V+p+Ct,vi=Ke+L,$i=Ke+H,yi=Nt+"-between",xi=Nt+"-around",wi=Nt+"-evenly",ki=I+p+Ne,ji="mask-",zi=ji+qt,Oi=ji+"composite",Si=ji+Lt,Ai=ji+It,Ei=ji+zt,Ci=ji+Gt,Ni=ji+K,Wi=ji+pt,Ii="timing-function",Pi="delay",Ki="duration",qi="animation",Mi=qi+p,Ri=Mi+Vt,Bi=Mi+Ii,Fi=Mi+M,Ji=Mi+"iteration-count",Li=Mi+Ki,Gi=Mi+Pi,Hi=Mi+"play-state",Ti=Mi+At+p+Lt,Zi="transition",Di=Zi+p,Qi=Di+Qt,Ui=Di+"property",Vi=Di+Ii,Xi=Di+Ki,Yi=Di+Pi,tr="alternate",sr=tr+p+Ct,er="-out",ir="ease",rr=ir+"-in",nr=rr+er,or=ir+er,lr="step",ar=lr+H,cr=lr+L,hr="translate",mr="rotate",fr="perspective",dr=fr+p+It,br=it+u+st,pr=lt+u+st,ur=it+u+nt,gr=lt+u+nt,_r="inset",vr=_r+p,$r=ut+kt,yr=ut+p+It,xr=ut+F,wr=vr+P,kr=wr+L,jr=wr+H,zr=vr+I,Or=zr+L,Sr=zr+H,Ar="fit-"+E,Er=A+E,Cr=S+E,Nr=wt+"-sizing",Wr=S+ct,Ir=A+ct,Pr=S+_t,Kr=A+_t,qr=P+p+K,Mr=S+qr,Rr=A+qr,Br=I+p+K,Fr=S+Br,Jr=A+Br,Lr=Rt+p+Qt,Gr=Rt+p+Ft,Hr=Gr+et,Tr=Gr+ot,Zr=Gr+rt,Dr=Gr+at,Qr=Gr+p+P,Ur=Qr+L,Vr=Qr+H,Xr=Gr+p+I,Yr=Xr+L,tn=Xr+H,sn=Rt+p+Bt,en=sn+et,rn=sn+ot,nn=sn+rt,on=sn+at,ln=sn+p+P,an=ln+L,cn=ln+H,hn=sn+p+I,mn=hn+L,fn=hn+H,dn=Rt+p+"snap",bn=dn+p+bt,pn=dn+p+"stop",un=dn+p+pt,gn="over"+Lr,_n=" mandatory",vn="x"+_n,$n="y"+_n,yn=P+_n,xn=I+_n,wn=Jt+_n,kn=" proximity",jn="x"+kn,zn="y"+kn,On=P+kn,Sn=I+kn,An=Jt+kn,En=w+"decoration",Cn=En+p+mt,Nn=En+p+"thickness",Wn=En+p+B,In=En+p+D,Pn="white-"+Nt,Kn=w+ut,qn=w+bt,Mn=y+p+bt,Rn=w+dt,Bn=w+Ut,Fn=w+"rendering",Jn=w+Dt,Ln=w+"emphasis",Gn=Ln+ft,Hn=Ln+p+zt,Tn=Ln+F,Zn=w+V,Dn=Zn+p+Lt,Qn=Zn+F,Un=Z+p+Q,Vn=j+K,Xn=j+"weight",Yn=j+"family",to=j+B,so=j+"synthesis",eo=j+"variant",io=eo+p+tr+"s",ro=eo+"-caps",no=eo+"-numeric",oo=eo+p+zt,lo=eo+"-east-asian",ao=eo+"-ligatures",co=eo+"-settings",ho="writing-"+Lt,mo=D+p+_t,fo=D+p+Q,bo=D+"-through",po="over"+D,uo="under"+D,go="pre",_o=go+p+D,vo=go+p+V,$o=U+Nt+"s",yo=U+gt,xo=U+Z,wo=U+Xt,ko=U+Yt,jo=$+"-tb",zo=y+"-lr",Oo=y+"-rl",So="keep-"+gt,Ao="pointer",Eo="pan",Co=Eo+g,No=Eo+rt,Wo=Eo+at,Io=Eo+_,Po=Eo+p+v,Ko="pinch-"+Mt,qo=y+p+x,Mo="grab",Ro=Mo+"bing",Bo="resize",Fo="col-"+Bo,Jo="row-"+Bo,Lo="n-"+Bo,Go="e-"+Bo,Ho="s-"+Bo,To="w-"+Bo,Zo="ne-"+Bo,Do="ew-"+Bo,Qo="nw-"+Bo,Uo="se-"+Bo,Vo="sw-"+Bo,Xo="ns-"+Bo,Yo="nesw-"+Bo,tl="nwse-"+Bo,sl=Mt+p+"in",el=Mt+p+"out",il=Ao+"-events",rl=Rt+p+zt,nl="caret"+ft,ol="accent"+ft,ll="filter",al="backdrop-"+ll,cl="background",hl=cl+p,ml=hl+ts,fl=hl+mt,dl=hl+qt,bl=hl+It,pl=hl+zt,ul=pl+g,gl=pl+_,_l=hl+Gt,vl=hl+K,$l=hl+"blend-"+Lt,yl=hl+"attachment",xl="gradient",wl=Tt+p+xl,kl="radial-"+xl,jl="conic-"+xl,zl=E+p+yt,Ol=Et+ht,Sl=Et+p+$t,Al=At+p+Y,El=At+p+$t,Cl=mt+"-dodge",Nl=mt+"-burn",Wl="hard-"+Ht,Il="soft-"+Ht,Pl=mt+"-mix",Kl="revert",ql=Kl+"-layer",Ml="container",Rl=Ml+p+pt,Bl=Ml+p+Vt,Fl=":first-",Jl=":last-",Ll=":only-",Gl="child",Hl="of-type",Tl=":nth-child",Zl="prefers-",Dl=Zl+ns,Ql="@media",Ul=mt+"-gamut",Vl=Zl+"contrast",Xl="scripting",Yl="::"+Xt,ta="::"+Yt,sa="sideways",ea=sa+at,ia={0:0,"1/12":"0.0833","1/10":"0.1","1/6":"0.1667","1/5":"0.2","1/4":"0.25","3/10":"0.3","1/3":"0.3333","2/5":"0.4","5/12":"0.4167","1/2":"0.5","7/12":"0.5833","3/5":"0.6","2/3":"0.6667","7/10":"0.7","3/4":"0.75","4/5":"0.8","5/6":"0.8333","9/10":"0.9","11/12":"0.9167",1:"1"},ra=[...Array(12).keys()].reduce(((t,s)=>(t[s]=s,t)),{}),na={u:{ini:"initial",inh:"inherit",u:"unset",r:Kl,rl:ql},rep:{rx:ye,ry:xe,r:Gt,s:Nt,ro:"round",nr:we},cnt:{n:vt,s:K,is:Br},time:{def:300,xs:100,s:200,m:300,l:450,xl:600,no:0,min:50,max:750},lig:{def:.75,c:.05,s:.65,m:.75,l:.85,n:.9},hue:{def:261.35,b:261.35,i:194.77,e:29.23,w:70.66,s:142.49},chr:{def:.03,xs:.03,s:.06,m:.1,l:.15,xl:.25},alp:{def:1,min:0,xs:.1,s:.25,m:.5,l:.75,xl:.9,max:1},cu:{c:"currentColor",t:"transparent"},ff:{def:"Roboto, sans-serif",h:"Georgia, serif"},fwg:{xs:100,s:200,m:400,l:600,xl:700},fsz:{xs:.25,s:.5,m:1,l:1.5,xl:2},fst:{i:"italic",n:vt,o:"oblique"},lsp:{no:0,s:.05,m:.1,l:.2},ws:{n:vt,nw:X,p:go,pl:_o,pw:vo,bs:$o},wb:{n:vt,ba:yo,ka:So,bw:xo},wm:{htb:jo,vlr:zo,vrl:Oo},hyp:{no:Ot,m:"manual",a:St},tt:{l:"lowercase",u:"uppercase",c:"capitalize"},td:{lt:bo,o:po,u:uo},tor:{m:"mixed",u:"upright",sr:ea,s:sa,ugo:"use-glyph-"+Ut},ta:{l:it,c:T,j:Pe,r:lt,s:G,e:J},fr:ia,coef:ra,rat:{1:1,"2/1":2,"1/2":.5,"4/3":1.3333,"3/4":.75,"9/16":.5625,"16/9":1.7778},sp:{"3xs":.125,"2xs":.25,xs:.5,s:.75,m:1,l:1.25,xl:1.5,"2xl":2,"3xl":4},sz:{"3xs":1,"2xs":1.5,xs:2,s:5,m:10,l:15,xl:20,"2xl":25,"3xl":30},usz:{a:"auto",no:0,min:Er,max:Cr,fit:Ar},rad:{s:.5,m:1,l:2},th:{s:.1,m:.25,l:.5},csz:{cv:"cover",cn:"contain",a:St,f:At,sd:fe},box:{c:ue,p:be,b:pe,f:ge,s:_e,v:ve,nc:$e,t:x},sc:{xs:.5,s:.67,m:1,l:1.5,xl:2},tr:{xs:.25,s:.5,m:1,l:1.5,xl:2},sk:{xs:-15,s:-10,m:0,l:10,xl:15},rot:{xs:-180,s:-90,m:0,l:90,xl:180},z:{s:.8,m:1,l:1.2},pers:{s:10,m:15,l:20},ali:{s:G,e:J,c:T,st:"stretch",sb:yi,sa:xi,se:wi,b:"baseline",fs:$i,fe:vi,no:Ot},dis:{g:Ne,ig:ki,f:Ke,if:Re,b:P,i:I},ca:ra,co:ra,ra:ra,ro:ra,fd:{r:We,rr:ui,c:z,cr:gi},fb:ia,fo:ra,fg:ra,fs:ra,fw:{w:V,nw:X,wr:_i},lh:{xs:1,s:1.25,m:1.5,l:1.75,xl:2},lb:{a:St,any:"anywhere",n:vt,l:"loose",s:"strict"},ls:{no:Ot,dt:"dotted",i:_r,h:Zt,ds:"dashed",s:"solid",db:"double",o:"outset",r:"ridge",g:"groove"},ov:{h:Zt,s:Rt,a:St,c:qt,e:"ellipsis"},v:{h:Zt,v:"visible",c:"collapse",a:St},o:{min:0,xs:.1,s:.25,m:.5,l:.75,xl:.9,max:1},zi:{min:-1,1:1,2:2,3:3,4:4,5:5,max:10},ttf:{l:Tt,e:ir,ei:rr,eo:or,eio:nr,ss:ar,se:cr},tp:{col:d(mt,fl,Ks,Cn),icon:d(At,Et),flt:d(ll,al),ind:d(Bt,Ft),sz:d(ct,Wr,Ir,_t,Pr,Kr),esz:d(Rr,qr,Mr,Jr,Br,Fr),o:$t,b:jt,f:Ke,g:Ne,pos:d(zt,it,st,nt,lt),tf:d(ut,hr,xt,mr,"skew",fr)},tb:{ad:"allow-discrete",n:vt},aic:{inf:"infinite",1:1,2:2,3:3,4:4,5:5},wc:{a:St,sp:rl,c:C,tf:ut,o:$t,i:_r,tfi:d(ut,_r)},afm:{no:Ot,f:"forwards",b:"backwards",both:Jt},adir:{r:Ct,a:tr,ar:sr},aps:{r:"running",p:"paused"},pe:{a:St,no:Ot,all:gt,f:At,s:Et},cur:{h:"help",a:St,p:Ao,cm:"context-menu",pr:"progress",w:"wait",cell:"cell",crh:"crosshair",t:x,vt:qo,cp:"copy",m:"move",g:Mo,gng:Ro,cr:Fo,rr:Jo,nr:Lo,er:Go,sr:Ho,wr:To,ner:Zo,ewr:Do,nwr:Qo,ser:Uo,swr:Vo,nsr:Xo,neswr:Yo,nwser:tl,zi:sl,zo:el},res:{n:Ot,v:y,h:$,b:Jt},toa:{a:St,no:Ot,px:Co,pl:No,pr:Wo,py:Io,pu:"pan-up",pd:Po,pz:Ko,m:"manipulation"},us:{n:Ot,t:x,all:gt,a:St},sb:{a:St,s:"smooth"},sss:{n:vt,a:"always"},sst:{n:Ot,x:"x",y:"y",b:P,i:I,both:Jt,xm:vn,ym:$n,bm:yn,im:xn,bothm:wn,xp:jn,yp:zn,bp:On,ip:Sn,bothp:An},pos:{r:"relative",a:"absolute",f:Wt,s:"static"},posv:{b:nt,t:st,c:T,l:it,r:lt,lt:br,rt:pr,lb:ur,rb:gr},cf:{a:St,b:"balance"},cs:{no:Ot,all:gt},mc:{a:"add",s:"subtract",i:"intersect",e:"exclude"},mt:{a:Pt,l:Kt},mm:{a:Pt,l:Kt,m:"match-source"},bgbm:{n:vt,m:"multiply",scr:"screen",o:"overlay",d:"darken",l:Ht+"en",dif:"difference",exc:"exclusion",h:"hue",sat:"saturation",c:mt,lum:"luminosity",cd:Cl,cb:Nl,hl:Wl,sl:Il},bga:{s:Rt,f:Wt,l:"local"}},oa={a:qi,an:Ri,adur:Li,adel:Gi,aps:Hi,afm:Ti,adir:Fi,aic:Ji,atf:Bi,tn:Zi,tdur:Xi,tdel:Yi,tb:Qi,tp:Ui,ttf:Vi,ba:wo,bb:ko,bor:jt,bw:us,br:Os,bs:Zs,bls:Ds,brs:Qs,bts:Us,bbs:Vs,bbls:Xs,bis:Ys,bbss:te,bbes:se,biss:ee,bies:ie,brw:vs,blw:_s,btw:$s,bbw:gs,btlr:Es,btrr:Cs,bbrr:As,bblr:Ss,biw:xs,bblw:ys,bbew:ks,bbsw:ws,bisw:js,biew:zs,besr:Ps,beer:Is,bssr:Ws,bser:Ns,bc:Ks,blc:qs,brc:Ms,btc:Rs,bbc:Bs,bblc:Fs,bic:Js,bbsc:Ls,bbec:Gs,bisc:Hs,biec:Ts,bg:cl,bgi:ml,bgc:fl,c:mt,cmix:Pl,csh:ns,acc:ol,ctc:nl,st:Et,stw:Ol,sto:Sl,fi:At,fir:Al,fio:El,flt:ll,bf:al,dis:"display",g:Ne,jc:He,ji:Te,ai:Ze,pi:Me,ac:De,gt:Ue,gtr:Ve,gtc:Xe,gp:Ie,rg:Ye,cg:ti,as:Qe,js:si,gr:ei,gre:ii,grs:ri,gc:ni,gce:oi,gcs:li,fx:Ke,fxd:Le,fxw:Ge,fxs:Je,fxg:Fe,fxb:Be,ord:"order",dir:M,m:Ft,ml:Se,mr:Ee,mt:Ae,mb:Ce,p:Bt,pl:ke,pr:ze,pt:je,pb:Oe,out:R,oc:re,ow:ne,os:oe,oo:le,l:it,r:lt,t:st,b:nt,ins:_r,ib:wr,ibe:kr,ibs:jr,ii:zr,iie:Or,iis:Sr,wc:"will-change",app:"appearance",pe:il,cur:"cursor",toa:"touch-action",us:"user-select",res:Bo,lis:ss,lisp:is,lisi:rs,list:es,sb:Lr,ssa:bn,sss:pn,sst:un,sm:Gr,sml:Zr,smr:Dr,smt:Hr,smb:Tr,sp:sn,spl:nn,spr:on,spt:en,spb:rn,smbl:Qr,smbe:Ur,smbs:Vr,smi:Xr,smie:Yr,smis:tn,spbl:ln,spbe:an,spbs:cn,spi:hn,spie:mn,spis:fn,osb:gn,ar:"aspect-ratio",w:ct,maxw:Wr,minw:Ir,h:_t,minh:Kr,maxh:Pr,bl:qr,maxb:Mr,minb:Rr,i:Br,mini:Jr,maxi:Fr,per:fr,pero:dr,rot:mr,sc:xt,tf:ut,tfb:$r,tfo:yr,tfs:xr,tr:hr,z:Mt,lts:"letter-spacing",lh:mo,lb:fo,f:k,fst:to,ff:Yn,fwg:Xn,fsz:Vn,fsn:so,fv:eo,fva:io,fvc:ro,fvea:lo,fvl:ao,fvn:no,fvs:co,fvp:oo,tt:Kn,td:En,tdt:Nn,tds:Wn,tdl:In,ta:qn,to:Rn,trg:Fn,ts:Jn,te:Ln,tep:Hn,tec:Gn,tes:Tn,tw:Zn,twm:Dn,tws:Qn,va:Mn,ws:Pn,tor:Bn,wb:Un,wm:ho,hyp:"hyphens",bsz:Nr,bsh:de,pos:zt,cf:ci,crs:fi,crc:mi,crw:di,cs:bi,cw:pi,cc:ai,bgcl:dl,bgp:pl,bgpx:ul,bgpy:gl,bgbm:$l,bgo:bl,bgr:_l,bga:yl,bgsz:vl,mcl:zi,mcm:Oi,mm:Si,mo:Ai,mp:Ei,mre:Ci,msz:Ni,mtp:Wi,obf:he,obp:me,con:E,ov:dt,ovx:ae,ovy:ce,v:yt,cv:zl,o:$t,zi:"z-index",lgr:wl,rgr:kl,cgr:jl,inf:"infinite",cnt:Rl,cnn:Bl,$:":root",$u:"*",$h:":hover",$f:":focus",$fv:":focus-visible",$a:":active",$v:":visited",$val:":valid",$inv:":invalid",$e:":empty",$d:":disabled",$r:":required",$o:":optional",$m:":modal",$l:":link",$fc:Fl+Gl,$lc:Jl+Gl,$oc:Ll+Gl,$1:Tl+"(odd)",$2:Tl+"(even)",$ft:Fl+Hl,$lt:Jl+Hl,$ot:Ll+Hl,$bef:ta,$aft:Yl,$bd:"::backdrop",$ba:`&${ta},&${Yl}`,$pl:":placeholder",$light:Ql+`(${Dl}: light)`,$dark:Ql+`(${Dl}: dark)`,$red_m:Ql+"(prefers-reduced-motion: reduce)",$ori_l:Ql+`(${Ut}: landscape)`,$ori_p:Ql+`(${Ut}: portrait)`,$gam_srgb:Ql+`(${Ul}: srgb)`,$gam_p3:Ql+`(${Ul}: p3)`,$gam_rec:Ql+`(${Ul}: rec2020)`,$con_no:Ql+`(${Vl}: no-preference)`,$con_m:Ql+`(${Vl}: more)`,$con_l:Ql+`(${Vl}: less)`,$con_c:Ql+`(${Vl}: custom)`,$scr_no:Ql+`(${Xl}: none)`,$scr_ini:Ql+`(${Xl}: initial-only)`,$scr_en:Ql+`(${Xl}: enabled)`,$ss:"@starting-style",$ns:"@namespace"},la={xs:30+b,sm:40+b,md:48+b,lg:64+b,xl:80+b},aa={xs:10+b,sm:20+b,md:30+b,lg:40+b,xl:48+b},ca={$c:"{u.inh}",$fsz:"16px",$ff:"{ff.def}",$$u:{$c:"{u.inh}",$fsz:"16px",$ff:"{ff.def}"}},ha={light:{lig:{def:.75,c:.05,s:.65,m:.75,l:.85,n:.9}},dark:{lig:{def:.4,n:.25,s:.3,m:.4,l:.5,c:.95}}},ma="{1}rem",fa="{1}deg",da="span {1}",ba={fb:"calc(100% * {1})",ra:da,ca:da,sz:ma,sp:ma,rad:ma,th:ma,bp:ma,cbp:ma,fsz:ma,lsp:ma,tr:ma,pers:ma,sk:fa,rot:fa,time:"{1}ms"},pa="style-provider",ua=t=>"object"==typeof t;class ga{constructor({prefix:t,initContent:s,hydrate:e}={}){this._c=0,this._k=new Set,this._=new Map,this.use=(t,s)=>{const e=this._.get(t);if(e)return e;const i=s||this._p+this._c.toString(36);return this._k.add(i),this._.set(t,i),this._c++,i},this.mutate=(t,s)=>Object.assign(this.getConfigs()[t],s),this.getKey=t=>this._.get(t),this.getKeys=()=>[...this._k],this.getConfigs=()=>Object.fromEntries(this._.entries().map((([t,s])=>[s,t]))),this._p=t||"eff",s&&Object.entries(s).forEach((([t,s])=>this.use(s,t))),e&&(this._c=0)}}const _a=Object.entries,va=t=>"application/json"===(null==t?void 0:t.getAttribute("type")),$a=t=>Array.isArray(t)?t:[t];!function(t={}){const{name:s=pa,styles:e={},settings:i={}}=t,r=window.document,n=window.customElements;!(null==n?void 0:n.get(s))&&(n.define(s,class extends HTMLElement{constructor(){super(...arguments),this._setState=()=>{const{units:t={},keys:e={},sets:i,mediaBP:r=la,containerBP:n=aa,rootStyle:o=ca,themes:l=ha}=this.settingsContent,a=Object.assign(Object.assign({},ba),t),c=Object.assign(Object.assign({},oa),e),h=Object.assign({},na);i&&_a(i).forEach((([t,s])=>h[t]=Object.assign({},s)));const m=_a(l);if(a)for(const t in a)h[t]=h[t]&&Object.fromEntries(_a(h[t]).map((([s,e])=>[s,a[t].replace("{1}",""+e)])));r&&_a(r).forEach((([t,s])=>{c[`min_${t}_`]=`@media (min-width:${s})`,c[`max_${t}_`]=`@media (max-width:${s})`})),n&&_a(n).forEach((([t,s])=>{c[`cmin_${t}_`]=`@container (min-width:${s})`,c[`cmax_${t}_`]=`@container (max-width:${s})`}));const f={},d={};l&&h&&m.forEach((([t,s])=>{const e={};_a(s).forEach((([t,s])=>{_a(s).forEach((([s,i])=>{var r;const n=this._r.varName(this.prefix,t,s);a[t]?e[n]=a[t].replace("{1}",""+i):e[n]=i,f[n]||(f[n]=(null===(r=h[t])||void 0===r?void 0:r[s])||"unset",h[t]||(h[t]={}),h[t][s]=`var(${n})`)}))})),d[t]=e})),this._d={sets:h,keys:c},this._mc={c:Object.assign(Object.assign({[s]:{display:"contents"},_theme:d,$$:Object.assign(f,o)},(null==d?void 0:d.dark)?{$$dark:{$$:d.dark}}:{}),(null==d?void 0:d.light)?{$$light:{$$:d.light}}:{})}},this._res=t=>"string"==typeof t?t:this._c.getKey(t),this.use=(t,s)=>{let e=this._c.use(t,s);return this._m&&!this._m.has(s)&&this._m.pack(e,this.css(t,e)),this.resolve(e)},this.alter=(t,s)=>{const e=this._res(t);if(e){const t=this._c.mutate(e,s);this._m.replace(e,this.css(t,e))}return this.resolve(e)},this.usePublic=t=>Object.fromEntries(_a(t).map((([t,s])=>[t,this.use(s,t)]))),this.usePrivate=t=>t.map((t=>this.use(t))),this.css=(t,s)=>{var e;return null===(e=this._p)||void 0===e?void 0:e.compile(s,t)},this.status=t=>{const s=this._res(t);return!!s&&this._m.status(s)},this.on=t=>this._m.on($a(t).map(this._res)),this.off=t=>this._m.off($a(t).map(this._res)),this.get=(t=this._mc)=>this._m.get(this._res(t)),this.getMany=(t=this._c.getKeys())=>t.map((t=>this.get(t))),this.resolve=t=>this._r.attr(t||this._c.getKey(this._mc)),this.subscribe=t=>this._m.registerNode(t),this.unsubscribe=t=>this._m.unregisterNode(t)}get prefix(){return this.getAttribute("prefix")||"eff"}get mode(){return this.getAttribute("mode")||"a"}get isolated(){return null!==this.getAttribute("isolated")}get hydrate(){return null!==this.getAttribute("hydrate")}get eventName(){return this.getAttribute("eventname")||"effcsschanges"}get settingsContent(){const t=null==r?void 0:r.querySelector("#"+(this.getAttribute("settingsid")||"effcss"));let s;return s=va(t)?JSON.parse((null==t?void 0:t.textContent)||"{}"):t?null==t?void 0:t.effcss:i,s||{}}get initContent(){const t=r.querySelectorAll("."+(this.getAttribute("initcls")||"effcss_init"));let s=e||{};return t.forEach((t=>{let e;e=va(t)?JSON.parse((null==t?void 0:t.textContent)||"{}"):null==t?void 0:t.effcss,s=Object.assign(Object.assign({},s),e||{})})),s}get configs(){return this._c.getConfigs()}connectedCallback(){this._r=(t=>{const{mode:s}=t,e=t=>Object.entries(t).reduce(((t,[s,e])=>(void 0!==e&&t.push(s+(e?"-"+e:"")),t)),[]).join(" "),i=(t,s)=>Object.defineProperties({[t]:s},{k:{value:t},v:{value:s}}),r=(...t)=>"--"+t.join("-"),n=(...t)=>t.join("-");return"c"===s?{selector:({b:t,e:s,m:e,mv:i})=>`.${t}${(s?"__"+s:"")+(e?"_"+e:"")+(e&&i?"_"+i:"")}`,attr:t=>s=>r=>{let n=r||"";ua(n)&&(n=e(n));const o=t+(s?"__"+s:"");return n=o+(n?" "+(null==n?void 0:n.split(" ").map((t=>o+"_"+t.split("-").join("_"))).join(" ")):""),i("class",n)},varName:r,kfName:n}:{selector:({b:t,e:s,m:e,mv:i})=>`[data-${t}${s?"-"+s:""}${e?'~="'+(e||"")+(i?"-"+i:"")+'"':""}]`,attr:t=>s=>r=>{const n=`data-${t}${s?"-"+s:""}`;let o=r||"";return ua(o)&&(o=e(o)),i(n,o)},varName:r,kfName:n}})({mode:this.mode}),this._setState();const t=this.initContent,s=this.prefix;var e;this._c=(e={hydrate:this.hydrate,prefix:s,initContent:t},new ga(e)),this._p=function(t){return new h(t)}({sets:this._d.sets,keys:this._d.keys,resolver:this._r}),this._m=new f;const i=t=>this.dispatchEvent(new CustomEvent(this.eventName,{detail:{styles:t},bubbles:!0}));this._n={set adoptedStyleSheets(t){i(t)}},this.subscribe(this._n),this.use(this._mc),this.usePublic(t),r&&!this.isolated&&this._m.registerNode(r)}}),window.__EFFCSS_PARAMS__={name:s,styles:e,settings:i})}();
7
+ "function"==typeof SuppressedError&&SuppressedError;const t="@media",e="@container",s="@property",r="@keyframes",n="@layer",i="@scope",o="@supports",c=(e,s)=>{const r=t+` ${s||""}${s?" and ":""}(${e})`;return{s:r,q:e,t:s,toString:()=>r}};c.toString=()=>t;const a=t=>t+"px",l=t=>t+"vh",h=t=>t+"vw",u=t=>t+"rem",d=t=>t+"deg",p=t=>t+"ms",m=t=>t+"%",f=t=>t+"cqw",g=t=>t+"cqh",$=t=>t+"cqi",y=t=>t+"cqb",v=t=>t+"cqmin",b=t=>t+"cqmax",_=Object.fromEntries,k=Object.entries,x=":first-",S=":last-",j=":only-",w="child",q=":nth-",O="of-type",A=q+w,E=":focus",P={r:":root",h:":hover",f:E,fv:E+"-visible",a:":active",v:":visited",val:":valid",inv:":invalid",e:":empty",d:":disabled",rq:":required",o:":optional",m:":modal",l:":link",ph:":placeholder",fc:x+w,lc:S+w,oc:j+w,odd:A+"(odd)",even:A+"(even)",ft:x+O,lt:S+O,ot:j+O,bef:"::before",aft:"::after",bd:"::backdrop"},C={has:":has",not:":not",is:":is",wh:":where",st:":state",nthc:A,ntho:q+O,dir:":dir",lang:":lang"},I="oklch",K=t=>I+`(${t})`,M=t=>K(`from ${t}`),W="def",B=t=>{const e=(e,s)=>"string"==typeof s?t(e,s):s;class s{constructor(t={}){this.state={l:e("l",W),c:e("c",W),h:e("h",W),a:e("a",W)},this.merge=t=>new s(Object.assign(this.state,t)),this.l=t=>this.merge({l:e("l",t)}),this.c=t=>this.merge({c:e("c",t)}),this.h=t=>this.merge({h:e("h",t)}),this.a=t=>this.merge({a:e("a",t)}),this.state=Object.assign(this.state,t)}get s(){return this.toString()}toString(){const{l:t,c:e,h:s,a:r}=this.state;return K(`${t} ${e} ${s} / ${r}`)}}return t=>new s(t)},L=(t,e=.1)=>M(`${t} calc(l + ${e}) c h / alpha)`),N=(t,e=.1)=>M(`${t} calc(l - ${e}) c h / alpha)`),R=(t,e=.1)=>M(`${t} l c h / calc(alpha + ${e}))`),z=(t,e=.1)=>M(`${t} l c h / calc(alpha - ${e}))`),H=(t,e=.04)=>M(`${t} l calc(c + ${e}) h / alpha)`),T=(t,e=.04)=>M(`${t} l calc(c - ${e}) h / alpha)`),V=(t,e=30)=>M(`${t} l c calc(h${"number"==typeof e?e>0?" + "+e:" - "+-e:e}) / alpha)`),Z=({base:t,mixin:e,method:s,bpart:r,mpart:n})=>`color-mix(in ${s||I}, ${t}${void 0!==r?` ${r}%`:""}, ${e}${void 0!==n?` ${n}%`:""})`,D=t=>({create:B(t),oklch:K,lighten:L,darken:N,saturate:H,desaturate:T,fadein:R,fadeout:z,spin:V,mix:Z}),F=Object.assign,G=Object.entries,J=Array.isArray,Q=(t,...e)=>e.length?e.reduce(((t,e)=>(G(e).forEach((([e,s])=>{s&&"object"==typeof s&&t[e]?J(t[e])&&J(s)?t[e]=[...t[e],...s]:Q(t[e],s||{}):t[e]=s})),t)),t):t,U=(t,e,s)=>Object.entries(t).reduce(e,s),X=(t,e,s)=>{var r,n,i;let o=""+t;return null==e?"":"object"==typeof e?(!s||(null===(r=s.startsWith)||void 0===r?void 0:r.call(s,"@"))||(null===(n=o.startsWith)||void 0===n?void 0:n.call(o,"&"))||(null===(i=o.startsWith)||void 0===i?void 0:i.call(o,"@"))?"":"&")+o+`{${U(e,((t,e)=>t+X(...e,o)),"")}}`:`${c=o,c.replace(/[A-Z]/g,(t=>"-"+t.toLowerCase()))}:${""+e};`;var c},Y={dash:(...t)=>t.join("-"),comma:(...t)=>t.join(),space:(...t)=>t.join(" "),range:(t,e)=>Array.from(Array(t).entries()).reduce(((t,[s])=>F(t,e(s+1))),{}),each:(t,e)=>G(t).reduce(((t,[s,r])=>F(t,e(s,r))),{}),merge:Q,when:(t,e,s={})=>t?e:s},tt="width: ",et=t=>{const{scope:x,globalKey:S="",bp:j={}}=t,w=x(S),q=t=>w.varExp(...t.split("."));return{compile:({key:t,maker:S})=>{const O=x(t),A=(t=>{const a={cp:1,lay:1,kf:1,cq:1},l=(s,r)=>{const n="string"==typeof r?r:t.name("cq",a.cq++),i=e+` ${n?n+" ":""}(${s})`;return{c:n,q:s,s:i,toString:()=>i}};l.toString=()=>e;const h=(e,r)=>{const n="--"+(e||t.name("cp",a.cp++)),i=s+" "+n;return{k:n,v:`var(${n})`,s:i,r:{[i]:{syntax:(null==r?void 0:r.syn)||'"*"',inherits:(null==r?void 0:r.inh)||!1,initialValue:null==r?void 0:r.ini}},toString:()=>i}};h.toString=()=>s;const u=e=>{const s=e||t.name("kf",a.kf++),n=r+" "+s;return{k:s,s:n,toString:()=>n}};u.toString=()=>r;const d=e=>{const s=e||t.name("lay",a.lay++),r=n+" "+s;return{k:s,s:r,toString:()=>r}};d.toString=()=>n,d.toString=()=>i;const p=(t="",e=!1)=>{const s=o+` ${e?"not ":""}(${t})`;return{c:t,n:e,s:s,toString:()=>s}};return p.toString=()=>o,{pr:h,kf:u,mq:c,cq:l,lay:d,sc:(t="",e="")=>{const s=i+` ${t?`(${t})`:""}${t&&e?" ":""}${e?`to (${e})`:""}`;return{r:t,l:e,s:s,toString:()=>s}},sup:p}})(O),E=t=>{const e=j[t]||t;return"number"==typeof e?e+"rem":""},I=t=>"min-"+tt+E(t),K=t=>"max-"+tt+E(t),M=(t,e)=>"string"==typeof e?A.cq(t,e):A.mq(t),W=(t,e,s)=>""+M(I(t)+") and ("+K(e),s),B={up:(t,e)=>""+M(I(t),e),down:(t,e)=>""+M(K(t),e),between:W,only:(t,e)=>W(t,t,e)};return L=S(Object.assign(Y,{key:t,vars:q,bem:O.selector,pseudo:Object.assign(_(k(P).map((([t,e])=>{function s(t=""){return t+e}return s.toString=()=>e,[t,s]}))),_(k(C).map((([t,e])=>{function s(t,s=""){return s+e+`(${t})`}return s.toString=()=>e,[t,s]})))),color:D(w.varExp),units:{px:a,vh:l,vw:h,rem:u,deg:d,ms:p,pc:m,cqw:f,cqh:g,cqb:y,cqi:$,cqmin:v,cqmax:b},at:A,limit:B})),U(L,((t,e)=>t+X(...e)),"");var L}}};const st=void 0,rt=Object.entries,nt=Object.defineProperties,it=t=>`data-${t}`,ot=t=>"string"==typeof t,ct=t=>null!==t&&"object"==typeof t,at=(t,e)=>`${t}${e?"__"+e:""}`,lt=t=>t.split("."),ht=(t,e)=>rt(t).reduce(((t,[s,r])=>{if(ct(r)){const n=rt(r);n.length?t.push(...n.reduce(((t,[r,n])=>{if((t=>null!==t&&t!==st)(r)&&e&&t.push([s,r,st,st]),ct(n)){const e=rt(n);e.length&&t.push(...e.reduce(((t,[e,n])=>{const i=typeof n;return"string"!==i&&"number"!==i||t.push([s,r,e,n]),t}),[]))}return t}),[])):t.push([s,st,st,st])}return t}),[]),ut=(t,e,s,r)=>""+(at(t,e)+(s?"_"+s:"")+(s&&r?"_"+r:"")),dt=(t,e,s,r)=>"."+ut(t,e,s,r),pt=(t,e,s,r)=>`[${it(at(t,e))}${s&&r?`~="${s}_${r}"`:s?`~="${s}"`:""}]`,mt={def:.75,c:.05,s:.65,m:.75,l:.85,n:.9},ft="effcss-provider",gt={theme:null,hydrate:null,mode:"a",prefix:"f"},$t={bp:{"3xs":18,"2xs":24,xs:30,sm:40,md:48,lg:64,xl:80,"2xl":96},vars:{"":{rem:16,l:mt,h:{def:261.35,b:261.35,i:194.77,e:29.23,w:70.66,s:142.49},c:{def:.03,xs:.03,s:.06,m:.1,l:.15,xl:.25},a:{def:1,min:0,xs:.1,s:.25,m:.5,l:.75,xl:.9,max:1},t:{def:300,xs:100,s:200,m:300,l:450,xl:600,no:0,min:50,max:750},int:[...Array(12).keys()],fr:{0:0,"1/12":"0.0833","1/10":"0.1","1/6":"0.1667","1/5":"0.2","1/4":"0.25","3/10":"0.3","1/3":"0.3333","2/5":"0.4","5/12":"0.4167","1/2":"0.5","7/12":"0.5833","3/5":"0.6","2/3":"0.6667","7/10":"0.7","3/4":"0.75","4/5":"0.8","5/6":"0.8333","9/10":"0.9","11/12":"0.9167",1:"1"},ar:{1:1,"2/1":2,"1/2":.5,"4/3":1.3333,"3/4":.75,"9/16":.5625,"16/9":1.7778}},light:{l:mt},dark:{l:{def:.4,n:.25,s:.3,m:.4,l:.5,c:.95}}}},yt=({prefix:t})=>{let e=1;return{get base(){return t+0},get current(){return t+e},next(){return e++,this.current},reset(){e=1}}},vt=()=>{const t=new Set,e=new Map;return{use(s,r){const n=e.get(s);return n||(t.add(r),e.set(s,r),r)},useMany(t){return rt(t).map((([t,e])=>this.use(e,t)))},getKey:t=>e.get(t),get keys(){return[...t]},get makers(){return Object.fromEntries(e.entries().map((([t,e])=>[e,t])))}}},bt="theme",_t=Object.assign,kt=Object.entries,xt=Object.fromEntries,St=(t,e)=>t.getAttribute(e)||gt[e];!function(t={}){const e=window.document,s=window.customElements;if(null==s?void 0:s.get(ft))return!1;{class r extends HTMLScriptElement{constructor(){super(...arguments),this._c=vt(),this._m=function(){let t={},e={},s=[],r=[];const n=t=>t.adoptedStyleSheets=s,i=()=>{r=r.reduce(((t,e)=>{const s=e.deref();return s&&(n(s),t.push(e)),t}),[])},o=t=>s.findIndex((e=>e===t)),c=e=>e?t[e]:void 0,a=(e,r)=>{if(!t[e])return t[e]=r,s.push(r),i(),!0},l=t=>{const e=c(t);return!!e&&-1!==o(e)};return{apply:n,notify:i,getIndex:o,get:c,has:t=>!!t&&!!c(t),getAll:()=>t,add:a,status:l,on:(...t)=>{const e=t.reduce(((t,e)=>{const r=c(e);return!(!r||l(e))&&(s.push(r),t)}),!0);return i(),e},off:(...t)=>{const e=t.reduce(((t,e)=>{const r=c(e);if(r&&l(e)){const e=o(r);return s.splice(e,1),t}return!1}),!0);return i(),e},remove:r=>{const n=c(r);if(!n)return;const a=o(n);return a>-1&&(s.splice(a,1),delete t[r],delete e[r]),i(),!0},removeAll:()=>(s.splice(0),t={},e={},i(),!0),pack:(t,e)=>{const s=new CSSStyleSheet;return s.replaceSync(e),!!s.cssRules.length&&a(t,s)},replace:(e,s)=>{const r=t[e];if(r)return r.replaceSync(s),i(),!0},register:t=>{r.findIndex((e=>e.deref()===t))>=0||(r.push(new WeakRef(t)),n(t))},unregister:t=>{const e=r.findIndex((e=>e.deref()===t));e>=0&&r.splice(e,1)}}}(),this._cust=(t={})=>{const{varName:e}=this._s(this._k.base);function s(t,r){return kt(t).reduce(((t,[n,i])=>i&&"object"==typeof i?_t(t,s(i,[...r,n])):(t[e(...r,n)]=i,t)),{})}const r=xt(kt(t||{}).map((([t,e])=>[t,s(e,[])]))),{"":n={},dark:i,light:o}=r,c=function(t,e){var s={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(s[r]=t[r]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(r=Object.getOwnPropertySymbols(t);n<r.length;n++)e.indexOf(r[n])<0&&Object.prototype.propertyIsEnumerable.call(t,r[n])&&(s[r[n]]=t[r[n]])}return s}(r,["","dark","light"]);this._=({bem:t,each:e,when:s,vars:r,merge:a,at:{mq:l}})=>{const h="prefers-color-scheme",u={light:`${h}: light`,dark:`${h}: dark`};return a({[`:root:has(script[is=${ft}])`]:a({fontSize:r("rem")},n)},s(!!i,{[l(u.dark).s]:i}),s(!!o,{[l(u.light).s]:o}),e(c,((e,s)=>({[`:root:has(script[is=${ft}][${bt}=${e}])`]:s,[t(`..theme.${e}`)]:s}))))},this.use(this._,this._k.base)},this.use=(t,e)=>{const s=e||this._k.current;let r=this._c.use(t,s);return this._m&&!this._m.has(e)&&this._m.pack(r,this.css(t,r)),e||this._k.next(),this.resolve(r)},this.usePublic=t=>xt(kt(t).map((([t,e])=>[t,this.use(e,t)]))),this.usePrivate=t=>t.map((t=>this.use(t))),this.resolve=t=>this._s(t||this._k.base).attr,this.css=(t,e)=>this._p.compile({key:e,maker:t}),this.status=t=>{const e=this.key(t);return!!e&&this._m.status(e)},this.on=(...t)=>this._m.on(...t.map(this.key)),this.off=(...t)=>this._m.off(...t.map(this.key)),this.key=t=>"string"==typeof t?t:this._c.getKey(t),this.stylesheets=(t=this._c.keys)=>t.map((t=>this._m.get(this.key(t))))}get prefix(){return St(this,"prefix")||""}get mode(){return St(this,"mode")}get hydrate(){return""===this.getAttribute("hydrate")}get settings(){return this._settings}set settings(t){var e,s,r;const n=_t({},this._settings,t),{makers:i,vars:o,bp:c,off:a}=n;c&&(null===(e=this._settings)||void 0===e?void 0:e.bp)!==c&&(this._p=et({scope:this._s,globalKey:this._k.base,bp:c})),o&&(null===(s=this._settings)||void 0===s?void 0:s.vars)!==o&&this._cust(o),i&&(null===(r=this._settings)||void 0===r?void 0:r.makers)!==i&&(this._c.useMany(i),this.usePublic(i),(null==a?void 0:a.length)&&this._settings.off!==a&&this.off(...a),this.hydrate&&this._k.reset()),this._settings=n}set theme(t){t?this.setAttribute(bt,t):this.removeAttribute(bt)}get theme(){return St(this,bt)||""}connectedCallback(){this._k=yt({prefix:this.prefix}),this._s=((t={})=>{const{mode:e}=t;let s,r;return t=>{const n=(...e)=>""+e.filter(Boolean).reduce(((t,e)=>`${t}-${e}`),t),i=(...t)=>"--"+n(...t);return"c"===e?(s=t=>{let e,s,r,i;return ot(t)?([e,s,r,i]=lt(t),dt(n(e),s,r,i)):t&&ht(t).map((([t,e,s,r])=>dt(n(t),e,s,r))).join(",")},r=t=>{let e,s,r,i;const o="class";let c="";return Array.isArray(t)?c=[...t.reduce(((t,o)=>([e,s,r,i]=lt(o),t.add(ut(n(e),s)),r&&t.add(ut(n(e),s,r,i)),t)),new Set).values()].join(" "):ot(t)?([e,s,r,i]=lt(t),c=ut(n(e),s,r,i)):c=t&&ht(t,!0).map((([t,e,s,r])=>ut(n(t),e,s,r))).join(" "),nt({[o]:c},{toString:{value:()=>`${o}="${c}"`}})}):(s=t=>{let e,s,r,i;return ot(t)?([e,s,r,i]=lt(t),pt(n(e),s,r,i)):t&&ht(t).map((([t,e,s,r])=>pt(n(t),e,s,r))).join(",")},r=t=>{let e,s,r,i,o,c,a="";if(Array.isArray(t))c=t.reduce(((t,c)=>{[e,s,r,i]=lt(c);const l=at(n(e),s);return o=it(l),a=r?i?`${r}_${i}`:`${r}`:"",t[o]&&a?t[o]=t[o]+" "+a:t[o]=a,t}),{});else if(ot(t)){[e,s,r,i]=lt(t);const l=at(n(e),s);o=it(l),a=r?i?`${r}_${i}`:`${r}`:"",c={[o]:a}}else c=t&&ht(t,!0).reduce(((t,[e,s,r,i])=>{const c=at(n(e),s);o=it(c);const l=r?i?`${r}_${i}`:`${r}`:"";return a=t[o]?t[o]+" "+l:l,t[o]=a,t}),{});return nt(c,{toString:{value:()=>rt(c).map((([t,e])=>`${t}="${e}"`)).join(" ")}}),c}),{selector:s,attr:r,name:n,varName:i,varExp:(...t)=>`var(${i(...t)})`}}})({mode:this.mode});const s=this;this._n={set adoptedStyleSheets(t){s.dispatchEvent(new CustomEvent("effcsschanges",{detail:{styles:t},bubbles:!0}))}},this._m.register(this._n),this._m.register(e),this.settings=_t({},$t,t)}toString(){return`<script ${[...this.attributes].map((t=>t.value?`${t.name}="${t.value}"`:""===t.value?t.name:"")).filter(Boolean).join(" ")}>${this.textContent}<\/script>`}}s.define(ft,r,{extends:"script"})}}();
@@ -0,0 +1,7 @@
1
+ /*
2
+ * EffCSS v3.0.1
3
+ * {@link https://gitverse.ru/msabitov/effcss}
4
+ * Copyright (c) Marat Sabitov
5
+ * @license Apache 2.0
6
+ */
7
+ const e=void 0,t=Object.entries,r=Object.defineProperties,n=e=>`data-${e}`,s=e=>"string"==typeof e,u=e=>null!==e&&"object"==typeof e,o=(e,t)=>`${e}${t?"__"+t:""}`,i=e=>e.split("."),a=(r,n)=>t(r).reduce(((r,[s,o])=>{if(u(o)){const i=t(o);i.length?r.push(...i.reduce(((r,[o,i])=>{if((t=>null!==t&&t!==e)(o)&&n&&r.push([s,o,e,e]),u(i)){const e=t(i);e.length&&r.push(...e.reduce(((e,[t,r])=>{const n=typeof r;return"string"!==n&&"number"!==n||e.push([s,o,t,r]),e}),[]))}return r}),[])):r.push([s,e,e,e])}return r}),[]),c=(e,t,r,n)=>""+(o(e,t)+(r?"_"+r:"")+(r&&n?"_"+n:"")),l=(e,t,r,n)=>"."+c(e,t,r,n),d=(e,t,r,s)=>`[${n(o(e,t))}${r&&s?`~="${r}_${s}"`:r?`~="${r}"`:""}]`,p="effcss-provider",m={theme:null,hydrate:null,mode:"a",prefix:"f"};Array(12).keys();const $=({prefix:e})=>{let t=1;return{get base(){return e+0},get current(){return e+t},next(){return t++,this.current},reset(){t=1}}},f=()=>{const e=new Set,r=new Map;return{use(t,n){const s=r.get(t);return s||(e.add(n),r.set(t,n),n)},useMany(e){return t(e).map((([e,t])=>this.use(t,e)))},getKey:e=>r.get(e),get keys(){return[...e]},get makers(){return Object.fromEntries(r.entries().map((([e,t])=>[t,e])))}}},g=(e={})=>{var u;let g,h,y,b,v=null===(u=null===globalThis||void 0===globalThis?void 0:globalThis.document)||void 0===u?void 0:u.querySelector(`script[is=${p}]`);if(v)return v;({prefix:h,mode:y,hydrate:b,theme:g}=Object.assign({},m,e));const j=new Set,x=()=>h||m.prefix,S=()=>y||m.mode,k=()=>""===b,O=$({prefix:x()}),_=((e={})=>{const{mode:u}=e;let p,m;return e=>{const $=(...t)=>""+t.filter(Boolean).reduce(((e,t)=>`${e}-${t}`),e),f=(...e)=>"--"+$(...e);return"c"===u?(p=e=>{let t,r,n,u;return s(e)?([t,r,n,u]=i(e),l($(t),r,n,u)):e&&a(e).map((([e,t,r,n])=>l($(e),t,r,n))).join(",")},m=e=>{let t,n,u,o;const l="class";let d="";return Array.isArray(e)?d=[...e.reduce(((e,r)=>([t,n,u,o]=i(r),e.add(c($(t),n)),u&&e.add(c($(t),n,u,o)),e)),new Set).values()].join(" "):s(e)?([t,n,u,o]=i(e),d=c($(t),n,u,o)):d=e&&a(e,!0).map((([e,t,r,n])=>c($(e),t,r,n))).join(" "),r({[l]:d},{toString:{value:()=>`${l}="${d}"`}})}):(p=e=>{let t,r,n,u;return s(e)?([t,r,n,u]=i(e),d($(t),r,n,u)):e&&a(e).map((([e,t,r,n])=>d($(e),t,r,n))).join(",")},m=e=>{let u,c,l,d,p,m,f="";if(Array.isArray(e))m=e.reduce(((e,t)=>{[u,c,l,d]=i(t);const r=o($(u),c);return p=n(r),f=l?d?`${l}_${d}`:`${l}`:"",e[p]&&f?e[p]=e[p]+" "+f:e[p]=f,e}),{});else if(s(e)){[u,c,l,d]=i(e);const t=o($(u),c);p=n(t),f=l?d?`${l}_${d}`:`${l}`:"",m={[p]:f}}else m=e&&a(e,!0).reduce(((e,[t,r,s,u])=>{const i=o($(t),r);p=n(i);const a=s?u?`${s}_${u}`:`${s}`:"";return f=e[p]?e[p]+" "+a:a,e[p]=f,e}),{});return r(m,{toString:{value:()=>t(m).map((([e,t])=>`${e}="${t}"`)).join(" ")}}),m}),{selector:p,attr:m,name:$,varName:f,varExp:(...e)=>`var(${f(...e)})`}}})({mode:S()}),A=f(),w=e=>"string"==typeof e?e:A.getKey(e),E=e=>_(e||O.base).attr,P=(e,t)=>{const r=t||O.current;let n=A.use(e,r);return t||O.next(),E(n)};return{get prefix(){return x()},get mode(){return S()},get hydrate(){return k()},set theme(e){g=e},get theme(){return g||""},get settings(){return{bp:undefined,vars:undefined,off:[...j],makers:A.makers}},set settings(e){},resolve:E,use:P,usePublic:e=>Object.fromEntries(Object.entries(e).map((([e,t])=>[e,P(t,e)]))),usePrivate:e=>e.map((e=>P(e))),css:()=>"",key:w,status:e=>{const t=w(e);return!!t&&!j.has(t)},on:(...e)=>e.map(w).reduce(((e,t)=>e&&!!t&&j.delete(t)),!0),off:(...e)=>e.map(w).reduce(((e,t)=>e&&!!t&&!!j.add(t)),!0),stylesheets:()=>[],toString(){const e=A.makers;delete e[O.base];const t=Object.entries({is:p,prefix:x(),mode:S(),hydrate:k(),theme:g}).map((([e,t])=>t?`${e}="${t}"`:""===t?e:"")).filter(Boolean).join(" "),r=`document.currentScript.settings = {makers: {${e?Object.entries(e).reduce(((e,[t,r])=>e+`${e?",":""}${t}: ${r.toString().replaceAll(/\s+/g," ")}`),""):""}},${j.size?` off: [${[...j]}]`:""}}`;return`<script ${t}>${r}<\/script>`}}};export{g as createConsumer};
package/dist/index.js CHANGED
@@ -1 +1,7 @@
1
- import{units as t,keys as s,sets as e,PREFIX as i,EVENT_NAME as n,SETTINGS_SCRIPT_ID as r,STYLES_SCRIPT_CLS as h,PROVIDER_TAG_NAME as o,mediaBP as l,containerBP as c,rootStyle as a,themes as u}from"./constants.js";import{createResolver as _,createCollector as d}from"./utils/common.js";const f=Object.entries,m=(t,s,e)=>f(t).reduce(s,e),g=t=>"object"==typeof t,p=t=>`{${t}}`,v=Object.assign.bind(Object),y=(t,s)=>`${t}:${s};`,b=(t,s)=>["@property",t,p(y("syntax",s.syn||'"*"')+y("inherits",s.inh||!1)+(s.ini?y("initial-value",s.ini):""))].join(" "),$=t=>`var(${t})`,j=({l:t,c:s,h:e,a:i=1})=>`oklch(${t} ${s} ${e} / ${i})`,k=["l","c","h","a"];class S{constructor(t){this._k={},this._s={},this._sel=t=>{let s,e,i,n,r;return[s,r]=t.split(":"),s.startsWith("__")?[e,i,n]=s.slice(2).split("_"):[e,i,n]=s.split("_"),{e:e,m:i,mv:n,s:r}},this._var=(...t)=>this._r.varName(...t),this._kf=(...t)=>this._r.kfName(...t),this.compile=(t,s)=>{const{_:e,kf:i,k:n={},v:r={},c:h}=s,o=this._r.selector.bind(this),l=this._sel;let c=v({},h),a=v({},n),u=v({_:{}},r),_="";if(e)for(let s in e){const i=e[s];if("c"===i.typ){const e={};k.forEach((n=>{const r=s+n,h=this._var(t,r);e[n]=h,a["_"+r]=e[n],_+=b(h,i)})),u._[s]=j({l:$(e.l),c:$(e.c),h:$(e.h),a:$(e.a)}),i.all&&(c["_"+s+"l"]=`&lig=>${this._var(t,s+"l")}:{1}`,c["_"+s+"c"]=`&chr=>${this._var(t,s+"c")}:{1}`,c["_"+s+"h"]=`&hue=>${this._var(t,s+"h")}:{1}`,c["_"+s+"a"]=`&alp=>${this._var(t,s+"a")}:{1}`)}else{const e=this._var(t,s);a["_"+s]=e,u._[s]=$(e),_+=b(e,i)}}const d=t=>a[t]||this._k[t],S=t=>{var s;return u[t]||this._s[t]||(null===(s=this._s)||void 0===s?void 0:s.root[t])},A=t=>t.replaceAll(/\{(.+?)\}/g,((t,s)=>{const[e,i]=s.split(".");let n;if(i){const t=S(e);n=(null==t?void 0:t[i])||(null==t?void 0:t.def)||""}else n=d(e)||"";return""+n})),x=t=>{const s=t.split("?");let e;for(let t in s){const i=s[t],[n,r]=i.split("=>"),h=n.match(/(\w+)(\[[\w,]+\])?/);if(!h)continue;const[o,l,c]=h,a=S(l);if(!a)continue;e=a;let u=f(e);const _=null==c?void 0:c.slice(1,-1).split(",");if(_){const t=new Set(_);u=u.filter((([s,e])=>t.has(s)))}if(r){let[t,s]=r.split("|");void 0===s&&(s=t,t=""),u=u.map((([e,i])=>[t.replace("{0}",e)||e,A(s.replaceAll("{1}",""+i))]))}(_||r)&&(e=Object.fromEntries(u));break}return e};function O(s,e,i){var n,r,h,c;let a=""+s;if((null===(n=null==s?void 0:s.startsWith)||void 0===n?void 0:n.call(s,"$"))&&(a=""+d(s.slice(1)),!a))return"";if(Array.isArray(e))return O(a,Object.assign({},...e.map((t=>"string"==typeof t?x(t):t))),i);if(null==e)return"";if(g(e)){const s=!i||(null===(r=i.startsWith)||void 0===r?void 0:r.call(i,"@"))||a.startsWith("&")||a.startsWith("@")?"":"&";if(a.startsWith("_")){const{e:i,m:n,mv:r}=l(a);return n&&"string"!=typeof r?m(e,((e,[r,h])=>{let l;return l=g(h)?m(h,((t,s)=>t+O(...s,a)),""):h+";",e+s+o({b:t,e:i,m:n,mv:r})+p(l)}),""):s+o({b:t,e:i,m:n,mv:r})+p(m(e,((t,s)=>t+O(...s,a)),""))}return s+a+p(m(e,((t,s)=>t+O(...s,a)),""))}{let t=""+e;return(null===(h=null==t?void 0:t.startsWith)||void 0===h?void 0:h.call(t,"&"))?O(a,x(t.slice(1)),i):(null===(c=null==t?void 0:t.includes)||void 0===c?void 0:c.call(t,"{"))?O(a,A(t),i):y(a.replace(/[A-Z]/g,(t=>"-"+t.toLowerCase())),t)}}let w="";if(i)for(let s in i){const e=i[s],n=this._kf(t,s);a["kf_"+s]=n,w+=`@keyframes ${n} `+p(m(e,((t,[s,e])=>t+s+(String(+s)===s?"%":"")+p(m(e,((t,s)=>t+O(...s)),""))),""))}return _+w+m(c,((t,s)=>t+O(...s)),"")};const{sets:s,keys:e,resolver:i}=t;this._r=i,e&&(this._k=e),s&&(this._s=s)}}const A=t=>Array.isArray(t)?t:[t];class x{constructor(){this._s={},this._r={},this._a=[],this._l=[],this.getIndex=t=>this._a.findIndex((s=>s===t)),this.get=t=>this._s[t],this.has=t=>!!t&&!!this.get(t),this.getAll=()=>this._s,this.add=(t,s)=>{if(!this._s[t])return this._s[t]=s,this._a.push(s),this.notify(),!0},this.status=t=>{const s=this.get(t);return!!s&&-1!==this.getIndex(s)},this.on=t=>{const s=A(t).reduce(((t,s)=>{const e=this.get(s);return!(!e||this.status(s))&&(this._a.push(e),t)}),!0);return this.notify(),s},this.off=t=>{const s=A(t).reduce(((t,s)=>{const e=this.get(s);if(e&&this.status(s)){const s=this.getIndex(e);return this._a.splice(s,1),t}return!1}),!0);return this.notify(),s},this.remove=t=>{const s=this.get(t);if(!s)return;const e=this.getIndex(s);return e>-1&&(this._a.splice(e,1),delete this._s[t],delete this._r[t]),this.notify(),!0},this.pack=(t,s)=>{const e=new CSSStyleSheet;if(e.replaceSync(s),e.cssRules.length)return this.add(t,e);console.log(`StyleSheet '${t}' is empty`)},this.replace=(t,s)=>{const e=this._s[t];if(e)return e.replaceSync(s),this.notify(),!0},this.apply=t=>{t.adoptedStyleSheets=this._a},this.registerNode=t=>{this._l.findIndex((s=>s.deref()===t))>=0||(this._l.push(new WeakRef(t)),this.apply(t))},this.unregisterNode=t=>{const s=this._l.findIndex((s=>s.deref()===t));s>=0&&this._l.splice(s,1)},this.notify=()=>{this._l=this._l.reduce(((t,s)=>{const e=s.deref();return e&&(this.apply(e),t.push(s)),t}),[])}}removeAll(){return this._a.splice(0),this._s={},this._r={},this.notify(),!0}}const O=Object.entries,w=t=>"application/json"===(null==t?void 0:t.getAttribute("type")),E=t=>Array.isArray(t)?t:[t];function C(f={}){const{name:m=o,styles:g={},settings:p={}}=f,v=window.document,y=window.customElements;return!(null==y?void 0:y.get(m))&&(y.define(m,class extends HTMLElement{constructor(){super(...arguments),this._setState=()=>{const{units:i={},keys:n={},sets:r,mediaBP:h=l,containerBP:o=c,rootStyle:_=a,themes:d=u}=this.settingsContent,f=Object.assign(Object.assign({},t),i),g=Object.assign(Object.assign({},s),n),p=Object.assign({},e);r&&O(r).forEach((([t,s])=>p[t]=Object.assign({},s)));const v=O(d);if(f)for(const t in f)p[t]=p[t]&&Object.fromEntries(O(p[t]).map((([s,e])=>[s,f[t].replace("{1}",""+e)])));h&&O(h).forEach((([t,s])=>{g[`min_${t}_`]=`@media (min-width:${s})`,g[`max_${t}_`]=`@media (max-width:${s})`})),o&&O(o).forEach((([t,s])=>{g[`cmin_${t}_`]=`@container (min-width:${s})`,g[`cmax_${t}_`]=`@container (max-width:${s})`}));const y={},b={};d&&p&&v.forEach((([t,s])=>{const e={};O(s).forEach((([t,s])=>{O(s).forEach((([s,i])=>{var n;const r=this._r.varName(this.prefix,t,s);f[t]?e[r]=f[t].replace("{1}",""+i):e[r]=i,y[r]||(y[r]=(null===(n=p[t])||void 0===n?void 0:n[s])||"unset",p[t]||(p[t]={}),p[t][s]=`var(${r})`)}))})),b[t]=e})),this._d={sets:p,keys:g},this._mc={c:Object.assign(Object.assign({[m]:{display:"contents"},_theme:b,$$:Object.assign(y,_)},(null==b?void 0:b.dark)?{$$dark:{$$:b.dark}}:{}),(null==b?void 0:b.light)?{$$light:{$$:b.light}}:{})}},this._res=t=>"string"==typeof t?t:this._c.getKey(t),this.use=(t,s)=>{let e=this._c.use(t,s);return this._m&&!this._m.has(s)&&this._m.pack(e,this.css(t,e)),this.resolve(e)},this.alter=(t,s)=>{const e=this._res(t);if(e){const t=this._c.mutate(e,s);this._m.replace(e,this.css(t,e))}return this.resolve(e)},this.usePublic=t=>Object.fromEntries(O(t).map((([t,s])=>[t,this.use(s,t)]))),this.usePrivate=t=>t.map((t=>this.use(t))),this.css=(t,s)=>{var e;return null===(e=this._p)||void 0===e?void 0:e.compile(s,t)},this.status=t=>{const s=this._res(t);return!!s&&this._m.status(s)},this.on=t=>this._m.on(E(t).map(this._res)),this.off=t=>this._m.off(E(t).map(this._res)),this.get=(t=this._mc)=>this._m.get(this._res(t)),this.getMany=(t=this._c.getKeys())=>t.map((t=>this.get(t))),this.resolve=t=>this._r.attr(t||this._c.getKey(this._mc)),this.subscribe=t=>this._m.registerNode(t),this.unsubscribe=t=>this._m.unregisterNode(t)}get prefix(){return this.getAttribute("prefix")||i}get mode(){return this.getAttribute("mode")||"a"}get isolated(){return null!==this.getAttribute("isolated")}get hydrate(){return null!==this.getAttribute("hydrate")}get eventName(){return this.getAttribute("eventname")||n}get settingsContent(){const t=null==v?void 0:v.querySelector("#"+(this.getAttribute("settingsid")||r));let s;return s=w(t)?JSON.parse((null==t?void 0:t.textContent)||"{}"):t?null==t?void 0:t.effcss:p,s||{}}get initContent(){const t=v.querySelectorAll("."+(this.getAttribute("initcls")||h));let s=g||{};return t.forEach((t=>{let e;e=w(t)?JSON.parse((null==t?void 0:t.textContent)||"{}"):null==t?void 0:t.effcss,s=Object.assign(Object.assign({},s),e||{})})),s}get configs(){return this._c.getConfigs()}connectedCallback(){this._r=_({mode:this.mode}),this._setState();const t=this.initContent,s=this.prefix;var e;this._c=d({hydrate:this.hydrate,prefix:s,initContent:t}),this._p=(e={sets:this._d.sets,keys:this._d.keys,resolver:this._r},new S(e)),this._m=new x;const i=t=>this.dispatchEvent(new CustomEvent(this.eventName,{detail:{styles:t},bubbles:!0}));this._n={set adoptedStyleSheets(t){i(t)}},this.subscribe(this._n),this.use(this._mc),this.usePublic(t),v&&!this.isolated&&this._m.registerNode(v)}}),window.__EFFCSS_PARAMS__={name:m,styles:g,settings:p},!0)}export{C as defineProvider};
1
+ /*
2
+ * EffCSS v3.0.1
3
+ * {@link https://gitverse.ru/msabitov/effcss}
4
+ * Copyright (c) Marat Sabitov
5
+ * @license Apache 2.0
6
+ */
7
+ "function"==typeof SuppressedError&&SuppressedError;const t="@media",e="@container",s="@property",r="@keyframes",n="@layer",i="@scope",o="@supports",c=(e,s)=>{const r=t+` ${s||""}${s?" and ":""}(${e})`;return{s:r,q:e,t:s,toString:()=>r}};c.toString=()=>t;const a=t=>t+"px",l=t=>t+"vh",h=t=>t+"vw",u=t=>t+"rem",d=t=>t+"deg",p=t=>t+"ms",m=t=>t+"%",f=t=>t+"cqw",g=t=>t+"cqh",$=t=>t+"cqi",y=t=>t+"cqb",v=t=>t+"cqmin",b=t=>t+"cqmax",_=Object.fromEntries,k=Object.entries,x=":first-",S=":last-",j=":only-",w="child",q=":nth-",O="of-type",A=q+w,E=":focus",P={r:":root",h:":hover",f:E,fv:E+"-visible",a:":active",v:":visited",val:":valid",inv:":invalid",e:":empty",d:":disabled",rq:":required",o:":optional",m:":modal",l:":link",ph:":placeholder",fc:x+w,lc:S+w,oc:j+w,odd:A+"(odd)",even:A+"(even)",ft:x+O,lt:S+O,ot:j+O,bef:"::before",aft:"::after",bd:"::backdrop"},C={has:":has",not:":not",is:":is",wh:":where",st:":state",nthc:A,ntho:q+O,dir:":dir",lang:":lang"},I="oklch",K=t=>I+`(${t})`,M=t=>K(`from ${t}`),W="def",B=t=>{const e=(e,s)=>"string"==typeof s?t(e,s):s;class s{constructor(t={}){this.state={l:e("l",W),c:e("c",W),h:e("h",W),a:e("a",W)},this.merge=t=>new s(Object.assign(this.state,t)),this.l=t=>this.merge({l:e("l",t)}),this.c=t=>this.merge({c:e("c",t)}),this.h=t=>this.merge({h:e("h",t)}),this.a=t=>this.merge({a:e("a",t)}),this.state=Object.assign(this.state,t)}get s(){return this.toString()}toString(){const{l:t,c:e,h:s,a:r}=this.state;return K(`${t} ${e} ${s} / ${r}`)}}return t=>new s(t)},L=(t,e=.1)=>M(`${t} calc(l + ${e}) c h / alpha)`),N=(t,e=.1)=>M(`${t} calc(l - ${e}) c h / alpha)`),R=(t,e=.1)=>M(`${t} l c h / calc(alpha + ${e}))`),z=(t,e=.1)=>M(`${t} l c h / calc(alpha - ${e}))`),H=(t,e=.04)=>M(`${t} l calc(c + ${e}) h / alpha)`),T=(t,e=.04)=>M(`${t} l calc(c - ${e}) h / alpha)`),V=(t,e=30)=>M(`${t} l c calc(h${"number"==typeof e?e>0?" + "+e:" - "+-e:e}) / alpha)`),Z=({base:t,mixin:e,method:s,bpart:r,mpart:n})=>`color-mix(in ${s||I}, ${t}${void 0!==r?` ${r}%`:""}, ${e}${void 0!==n?` ${n}%`:""})`,D=t=>({create:B(t),oklch:K,lighten:L,darken:N,saturate:H,desaturate:T,fadein:R,fadeout:z,spin:V,mix:Z}),F=Object.assign,G=Object.entries,J=Array.isArray,Q=(t,...e)=>e.length?e.reduce(((t,e)=>(G(e).forEach((([e,s])=>{s&&"object"==typeof s&&t[e]?J(t[e])&&J(s)?t[e]=[...t[e],...s]:Q(t[e],s||{}):t[e]=s})),t)),t):t,U=(t,e,s)=>Object.entries(t).reduce(e,s),X=(t,e,s)=>{var r,n,i;let o=""+t;return null==e?"":"object"==typeof e?(!s||(null===(r=s.startsWith)||void 0===r?void 0:r.call(s,"@"))||(null===(n=o.startsWith)||void 0===n?void 0:n.call(o,"&"))||(null===(i=o.startsWith)||void 0===i?void 0:i.call(o,"@"))?"":"&")+o+`{${U(e,((t,e)=>t+X(...e,o)),"")}}`:`${c=o,c.replace(/[A-Z]/g,(t=>"-"+t.toLowerCase()))}:${""+e};`;var c},Y={dash:(...t)=>t.join("-"),comma:(...t)=>t.join(),space:(...t)=>t.join(" "),range:(t,e)=>Array.from(Array(t).entries()).reduce(((t,[s])=>F(t,e(s+1))),{}),each:(t,e)=>G(t).reduce(((t,[s,r])=>F(t,e(s,r))),{}),merge:Q,when:(t,e,s={})=>t?e:s},tt="width: ",et=t=>{const{scope:x,globalKey:S="",bp:j={}}=t,w=x(S),q=t=>w.varExp(...t.split("."));return{compile:({key:t,maker:S})=>{const O=x(t),A=(t=>{const a={cp:1,lay:1,kf:1,cq:1},l=(s,r)=>{const n="string"==typeof r?r:t.name("cq",a.cq++),i=e+` ${n?n+" ":""}(${s})`;return{c:n,q:s,s:i,toString:()=>i}};l.toString=()=>e;const h=(e,r)=>{const n="--"+(e||t.name("cp",a.cp++)),i=s+" "+n;return{k:n,v:`var(${n})`,s:i,r:{[i]:{syntax:(null==r?void 0:r.syn)||'"*"',inherits:(null==r?void 0:r.inh)||!1,initialValue:null==r?void 0:r.ini}},toString:()=>i}};h.toString=()=>s;const u=e=>{const s=e||t.name("kf",a.kf++),n=r+" "+s;return{k:s,s:n,toString:()=>n}};u.toString=()=>r;const d=e=>{const s=e||t.name("lay",a.lay++),r=n+" "+s;return{k:s,s:r,toString:()=>r}};d.toString=()=>n,d.toString=()=>i;const p=(t="",e=!1)=>{const s=o+` ${e?"not ":""}(${t})`;return{c:t,n:e,s:s,toString:()=>s}};return p.toString=()=>o,{pr:h,kf:u,mq:c,cq:l,lay:d,sc:(t="",e="")=>{const s=i+` ${t?`(${t})`:""}${t&&e?" ":""}${e?`to (${e})`:""}`;return{r:t,l:e,s:s,toString:()=>s}},sup:p}})(O),E=t=>{const e=j[t]||t;return"number"==typeof e?e+"rem":""},I=t=>"min-"+tt+E(t),K=t=>"max-"+tt+E(t),M=(t,e)=>"string"==typeof e?A.cq(t,e):A.mq(t),W=(t,e,s)=>""+M(I(t)+") and ("+K(e),s),B={up:(t,e)=>""+M(I(t),e),down:(t,e)=>""+M(K(t),e),between:W,only:(t,e)=>W(t,t,e)};return L=S(Object.assign(Y,{key:t,vars:q,bem:O.selector,pseudo:Object.assign(_(k(P).map((([t,e])=>{function s(t=""){return t+e}return s.toString=()=>e,[t,s]}))),_(k(C).map((([t,e])=>{function s(t,s=""){return s+e+`(${t})`}return s.toString=()=>e,[t,s]})))),color:D(w.varExp),units:{px:a,vh:l,vw:h,rem:u,deg:d,ms:p,pc:m,cqw:f,cqh:g,cqb:y,cqi:$,cqmin:v,cqmax:b},at:A,limit:B})),U(L,((t,e)=>t+X(...e)),"");var L}}};const st=void 0,rt=Object.entries,nt=Object.defineProperties,it=t=>`data-${t}`,ot=t=>"string"==typeof t,ct=t=>null!==t&&"object"==typeof t,at=(t,e)=>`${t}${e?"__"+e:""}`,lt=t=>t.split("."),ht=(t,e)=>rt(t).reduce(((t,[s,r])=>{if(ct(r)){const n=rt(r);n.length?t.push(...n.reduce(((t,[r,n])=>{if((t=>null!==t&&t!==st)(r)&&e&&t.push([s,r,st,st]),ct(n)){const e=rt(n);e.length&&t.push(...e.reduce(((t,[e,n])=>{const i=typeof n;return"string"!==i&&"number"!==i||t.push([s,r,e,n]),t}),[]))}return t}),[])):t.push([s,st,st,st])}return t}),[]),ut=(t,e,s,r)=>""+(at(t,e)+(s?"_"+s:"")+(s&&r?"_"+r:"")),dt=(t,e,s,r)=>"."+ut(t,e,s,r),pt=(t,e,s,r)=>`[${it(at(t,e))}${s&&r?`~="${s}_${r}"`:s?`~="${s}"`:""}]`,mt={def:.75,c:.05,s:.65,m:.75,l:.85,n:.9},ft="effcss-provider",gt={theme:null,hydrate:null,mode:"a",prefix:"f"},$t={bp:{"3xs":18,"2xs":24,xs:30,sm:40,md:48,lg:64,xl:80,"2xl":96},vars:{"":{rem:16,l:mt,h:{def:261.35,b:261.35,i:194.77,e:29.23,w:70.66,s:142.49},c:{def:.03,xs:.03,s:.06,m:.1,l:.15,xl:.25},a:{def:1,min:0,xs:.1,s:.25,m:.5,l:.75,xl:.9,max:1},t:{def:300,xs:100,s:200,m:300,l:450,xl:600,no:0,min:50,max:750},int:[...Array(12).keys()],fr:{0:0,"1/12":"0.0833","1/10":"0.1","1/6":"0.1667","1/5":"0.2","1/4":"0.25","3/10":"0.3","1/3":"0.3333","2/5":"0.4","5/12":"0.4167","1/2":"0.5","7/12":"0.5833","3/5":"0.6","2/3":"0.6667","7/10":"0.7","3/4":"0.75","4/5":"0.8","5/6":"0.8333","9/10":"0.9","11/12":"0.9167",1:"1"},ar:{1:1,"2/1":2,"1/2":.5,"4/3":1.3333,"3/4":.75,"9/16":.5625,"16/9":1.7778}},light:{l:mt},dark:{l:{def:.4,n:.25,s:.3,m:.4,l:.5,c:.95}}}},yt=({prefix:t})=>{let e=1;return{get base(){return t+0},get current(){return t+e},next(){return e++,this.current},reset(){e=1}}},vt=()=>{const t=new Set,e=new Map;return{use(s,r){const n=e.get(s);return n||(t.add(r),e.set(s,r),r)},useMany(t){return rt(t).map((([t,e])=>this.use(e,t)))},getKey:t=>e.get(t),get keys(){return[...t]},get makers(){return Object.fromEntries(e.entries().map((([t,e])=>[e,t])))}}},bt="theme",_t=Object.assign,kt=Object.entries,xt=Object.fromEntries,St=(t,e)=>t.getAttribute(e)||gt[e];function jt(t={}){const e=window.document,s=window.customElements;if(null==s?void 0:s.get(ft))return!1;{class r extends HTMLScriptElement{constructor(){super(...arguments),this._c=vt(),this._m=function(){let t={},e={},s=[],r=[];const n=t=>t.adoptedStyleSheets=s,i=()=>{r=r.reduce(((t,e)=>{const s=e.deref();return s&&(n(s),t.push(e)),t}),[])},o=t=>s.findIndex((e=>e===t)),c=e=>e?t[e]:void 0,a=(e,r)=>{if(!t[e])return t[e]=r,s.push(r),i(),!0},l=t=>{const e=c(t);return!!e&&-1!==o(e)};return{apply:n,notify:i,getIndex:o,get:c,has:t=>!!t&&!!c(t),getAll:()=>t,add:a,status:l,on:(...t)=>{const e=t.reduce(((t,e)=>{const r=c(e);return!(!r||l(e))&&(s.push(r),t)}),!0);return i(),e},off:(...t)=>{const e=t.reduce(((t,e)=>{const r=c(e);if(r&&l(e)){const e=o(r);return s.splice(e,1),t}return!1}),!0);return i(),e},remove:r=>{const n=c(r);if(!n)return;const a=o(n);return a>-1&&(s.splice(a,1),delete t[r],delete e[r]),i(),!0},removeAll:()=>(s.splice(0),t={},e={},i(),!0),pack:(t,e)=>{const s=new CSSStyleSheet;return s.replaceSync(e),!!s.cssRules.length&&a(t,s)},replace:(e,s)=>{const r=t[e];if(r)return r.replaceSync(s),i(),!0},register:t=>{r.findIndex((e=>e.deref()===t))>=0||(r.push(new WeakRef(t)),n(t))},unregister:t=>{const e=r.findIndex((e=>e.deref()===t));e>=0&&r.splice(e,1)}}}(),this._cust=(t={})=>{const{varName:e}=this._s(this._k.base);function s(t,r){return kt(t).reduce(((t,[n,i])=>i&&"object"==typeof i?_t(t,s(i,[...r,n])):(t[e(...r,n)]=i,t)),{})}const r=xt(kt(t||{}).map((([t,e])=>[t,s(e,[])]))),{"":n={},dark:i,light:o}=r,c=function(t,e){var s={};for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&e.indexOf(r)<0&&(s[r]=t[r]);if(null!=t&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(r=Object.getOwnPropertySymbols(t);n<r.length;n++)e.indexOf(r[n])<0&&Object.prototype.propertyIsEnumerable.call(t,r[n])&&(s[r[n]]=t[r[n]])}return s}(r,["","dark","light"]);this._=({bem:t,each:e,when:s,vars:r,merge:a,at:{mq:l}})=>{const h="prefers-color-scheme",u={light:`${h}: light`,dark:`${h}: dark`};return a({[`:root:has(script[is=${ft}])`]:a({fontSize:r("rem")},n)},s(!!i,{[l(u.dark).s]:i}),s(!!o,{[l(u.light).s]:o}),e(c,((e,s)=>({[`:root:has(script[is=${ft}][${bt}=${e}])`]:s,[t(`..theme.${e}`)]:s}))))},this.use(this._,this._k.base)},this.use=(t,e)=>{const s=e||this._k.current;let r=this._c.use(t,s);return this._m&&!this._m.has(e)&&this._m.pack(r,this.css(t,r)),e||this._k.next(),this.resolve(r)},this.usePublic=t=>xt(kt(t).map((([t,e])=>[t,this.use(e,t)]))),this.usePrivate=t=>t.map((t=>this.use(t))),this.resolve=t=>this._s(t||this._k.base).attr,this.css=(t,e)=>this._p.compile({key:e,maker:t}),this.status=t=>{const e=this.key(t);return!!e&&this._m.status(e)},this.on=(...t)=>this._m.on(...t.map(this.key)),this.off=(...t)=>this._m.off(...t.map(this.key)),this.key=t=>"string"==typeof t?t:this._c.getKey(t),this.stylesheets=(t=this._c.keys)=>t.map((t=>this._m.get(this.key(t))))}get prefix(){return St(this,"prefix")||""}get mode(){return St(this,"mode")}get hydrate(){return""===this.getAttribute("hydrate")}get settings(){return this._settings}set settings(t){var e,s,r;const n=_t({},this._settings,t),{makers:i,vars:o,bp:c,off:a}=n;c&&(null===(e=this._settings)||void 0===e?void 0:e.bp)!==c&&(this._p=et({scope:this._s,globalKey:this._k.base,bp:c})),o&&(null===(s=this._settings)||void 0===s?void 0:s.vars)!==o&&this._cust(o),i&&(null===(r=this._settings)||void 0===r?void 0:r.makers)!==i&&(this._c.useMany(i),this.usePublic(i),(null==a?void 0:a.length)&&this._settings.off!==a&&this.off(...a),this.hydrate&&this._k.reset()),this._settings=n}set theme(t){t?this.setAttribute(bt,t):this.removeAttribute(bt)}get theme(){return St(this,bt)||""}connectedCallback(){this._k=yt({prefix:this.prefix}),this._s=((t={})=>{const{mode:e}=t;let s,r;return t=>{const n=(...e)=>""+e.filter(Boolean).reduce(((t,e)=>`${t}-${e}`),t),i=(...t)=>"--"+n(...t);return"c"===e?(s=t=>{let e,s,r,i;return ot(t)?([e,s,r,i]=lt(t),dt(n(e),s,r,i)):t&&ht(t).map((([t,e,s,r])=>dt(n(t),e,s,r))).join(",")},r=t=>{let e,s,r,i;const o="class";let c="";return Array.isArray(t)?c=[...t.reduce(((t,o)=>([e,s,r,i]=lt(o),t.add(ut(n(e),s)),r&&t.add(ut(n(e),s,r,i)),t)),new Set).values()].join(" "):ot(t)?([e,s,r,i]=lt(t),c=ut(n(e),s,r,i)):c=t&&ht(t,!0).map((([t,e,s,r])=>ut(n(t),e,s,r))).join(" "),nt({[o]:c},{toString:{value:()=>`${o}="${c}"`}})}):(s=t=>{let e,s,r,i;return ot(t)?([e,s,r,i]=lt(t),pt(n(e),s,r,i)):t&&ht(t).map((([t,e,s,r])=>pt(n(t),e,s,r))).join(",")},r=t=>{let e,s,r,i,o,c,a="";if(Array.isArray(t))c=t.reduce(((t,c)=>{[e,s,r,i]=lt(c);const l=at(n(e),s);return o=it(l),a=r?i?`${r}_${i}`:`${r}`:"",t[o]&&a?t[o]=t[o]+" "+a:t[o]=a,t}),{});else if(ot(t)){[e,s,r,i]=lt(t);const l=at(n(e),s);o=it(l),a=r?i?`${r}_${i}`:`${r}`:"",c={[o]:a}}else c=t&&ht(t,!0).reduce(((t,[e,s,r,i])=>{const c=at(n(e),s);o=it(c);const l=r?i?`${r}_${i}`:`${r}`:"";return a=t[o]?t[o]+" "+l:l,t[o]=a,t}),{});return nt(c,{toString:{value:()=>rt(c).map((([t,e])=>`${t}="${e}"`)).join(" ")}}),c}),{selector:s,attr:r,name:n,varName:i,varExp:(...t)=>`var(${i(...t)})`}}})({mode:this.mode});const s=this;this._n={set adoptedStyleSheets(t){s.dispatchEvent(new CustomEvent("effcsschanges",{detail:{styles:t},bubbles:!0}))}},this._m.register(this._n),this._m.register(e),this.settings=_t({},$t,t)}toString(){return`<script ${[...this.attributes].map((t=>t.value?`${t.name}="${t.value}"`:""===t.value?t.name:"")).filter(Boolean).join(" ")}>${this.textContent}<\/script>`}}return s.define(ft,r,{extends:"script"}),!0}}export{jt as defineProvider};
@@ -0,0 +1,148 @@
1
+ import { TCreateScope } from '../../common';
2
+ export declare const resolveAtRules: (scope: ReturnType<ReturnType<TCreateScope>>) => {
3
+ /**
4
+ * `@property` selector
5
+ * @param name - property name
6
+ */
7
+ pr: {
8
+ (n?: string | number, p?: {
9
+ syn?: string;
10
+ inh?: boolean;
11
+ ini?: string | number | boolean;
12
+ }): {
13
+ /**
14
+ * Key
15
+ */
16
+ k: string;
17
+ /**
18
+ * Value
19
+ */
20
+ v: string;
21
+ /**
22
+ * Selector
23
+ */
24
+ s: string;
25
+ /**
26
+ * Rule
27
+ */
28
+ r: { [key in string]: {
29
+ syntax: string;
30
+ inherits: boolean;
31
+ initialValue?: string | number | boolean;
32
+ }; };
33
+ toString(): string;
34
+ };
35
+ toString(): string;
36
+ };
37
+ /**
38
+ * `@keyframes` selector
39
+ * @param name - keyframes name
40
+ */
41
+ kf: {
42
+ (name?: string): {
43
+ /**
44
+ * Key
45
+ */
46
+ k: string;
47
+ /**
48
+ * Selector
49
+ */
50
+ s: string;
51
+ toString(): string;
52
+ };
53
+ toString(): string;
54
+ };
55
+ /**
56
+ * `@media` selector
57
+ */
58
+ mq: {
59
+ (q: string, t?: string): {
60
+ s: string;
61
+ q: string;
62
+ t: string | undefined;
63
+ toString: () => string;
64
+ };
65
+ toString(): string;
66
+ };
67
+ /**
68
+ * `@container` selector
69
+ */
70
+ cq: {
71
+ (q: string, c?: string): {
72
+ /**
73
+ * Container
74
+ */
75
+ c: string;
76
+ /**
77
+ * Query
78
+ */
79
+ q: string;
80
+ /**
81
+ * Selector
82
+ */
83
+ s: string;
84
+ toString(): string;
85
+ };
86
+ toString(): string;
87
+ };
88
+ /**
89
+ * `@layer` selector
90
+ */
91
+ lay: {
92
+ (name?: string): {
93
+ /**
94
+ * Key
95
+ */
96
+ k: string;
97
+ /**
98
+ * Selector
99
+ */
100
+ s: string;
101
+ toString(): string;
102
+ };
103
+ toString(): string;
104
+ };
105
+ /**
106
+ * `@scope` selector
107
+ * @param r - scope root
108
+ * @param l - scope limit
109
+ */
110
+ sc: (r?: string, l?: string) => {
111
+ /**
112
+ * Root
113
+ */
114
+ r: string;
115
+ /**
116
+ * Limit
117
+ */
118
+ l: string;
119
+ /**
120
+ * Selector
121
+ */
122
+ s: string;
123
+ toString(): string;
124
+ };
125
+ /**
126
+ * `@supports` selector
127
+ * @param c - condition
128
+ * @param n - inverse condition
129
+ */
130
+ sup: {
131
+ (c?: string, n?: boolean): {
132
+ /**
133
+ * Condition
134
+ */
135
+ c: string;
136
+ /**
137
+ * Not
138
+ */
139
+ n: boolean;
140
+ /**
141
+ * Selector
142
+ */
143
+ s: string;
144
+ toString(): string;
145
+ };
146
+ toString(): string;
147
+ };
148
+ };
@@ -0,0 +1,12 @@
1
+ type TStrOrNum = string | number;
2
+ type TJoinArr = (...val: TStrOrNum[]) => string;
3
+ export declare const getBaseHandlers: () => {
4
+ dash: TJoinArr;
5
+ comma: TJoinArr;
6
+ space: TJoinArr;
7
+ range: (size: number, handler: (k: number) => object) => object;
8
+ each: <V extends Record<string | number, any>>(rules: V, handler: (k: V extends ArrayLike<any> ? string : keyof V, v: V extends ArrayLike<any> ? NoInfer<V[number]> : NoInfer<V[keyof V]>) => object) => object;
9
+ merge: (target: Record<string, any>, ...sources: Record<string, any>[]) => Record<string, any>;
10
+ when: (condition: boolean | undefined, rules: object, otherwise?: object) => object;
11
+ };
12
+ export {};