effcss 3.12.1 → 4.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -7
- package/dist/index.js +2 -2
- package/dist/types/_provider/_process/atrules.d.ts +222 -0
- package/dist/types/_provider/_process/coef.d.ts +131 -0
- package/dist/types/_provider/_process/color.d.ts +37 -0
- package/dist/types/_provider/_process/palette.d.ts +105 -0
- package/dist/types/{src/_provider → _provider}/collect.d.ts +14 -10
- package/dist/types/{src/_provider → _provider}/manage.d.ts +17 -33
- package/dist/types/_provider/process.d.ts +84 -0
- package/dist/types/{src/_provider → _provider}/scope.d.ts +21 -6
- package/dist/types/_provider/theme.d.ts +49 -0
- package/dist/types/_provider/utils.d.ts +10 -0
- package/dist/types/{src/index.d.ts → index.d.ts} +60 -64
- package/package.json +3 -8
- package/dist/build/define-provider.min.js +0 -7
- package/dist/consumer.js +0 -7
- package/dist/types/build/defineProvider.d.ts +0 -1
- package/dist/types/src/_provider/_process/atrules.d.ts +0 -330
- package/dist/types/src/_provider/_process/base.d.ts +0 -11
- package/dist/types/src/_provider/_process/coef.d.ts +0 -3
- package/dist/types/src/_provider/_process/color.d.ts +0 -98
- package/dist/types/src/_provider/_process/palette.d.ts +0 -3
- package/dist/types/src/_provider/name.d.ts +0 -24
- package/dist/types/src/_provider/process.d.ts +0 -125
- package/dist/types/src/common.d.ts +0 -525
- package/dist/types/src/consumer.d.ts +0 -8
- /package/dist/types/{src/_provider → _provider}/_process/pseudo.d.ts +0 -0
- /package/dist/types/{src/_provider → _provider}/_process/units.d.ts +0 -0
- /package/dist/types/{src/_provider → _provider}/_process/utils.d.ts +0 -0
package/README.md
CHANGED
|
@@ -36,7 +36,11 @@ EffCSS is a self-confident CSS-in-JS library based only on the browser APIs. Use
|
|
|
36
36
|
- [Mozilla Firefox](https://addons.mozilla.org/ru/firefox/addon/effcss-developer-tools/)
|
|
37
37
|
- [zip for Chromium based browsers](https://storage.yandexcloud.net/effcss-devtools/chromium-based.zip), that can be installed using [chrome://extensions](https://www.geeksforgeeks.org/installation-guide/how-to-add-extensions-in-google-chrome-browser/)
|
|
38
38
|
|
|
39
|
-
## Examples
|
|
39
|
+
## v3 Examples
|
|
40
|
+
|
|
41
|
+
Coming soon.
|
|
42
|
+
|
|
43
|
+
## v3 Examples
|
|
40
44
|
|
|
41
45
|
- [Vanilla TS](https://stackblitz.com/edit/effcss-3-ts-vitejs?file=index.html)
|
|
42
46
|
- [React](https://stackblitz.com/edit/effcss-3-react-vitejs?file=index.html)
|
|
@@ -92,7 +96,7 @@ import { IStyleProvider, TStyleSheetMaker } from 'effcss';
|
|
|
92
96
|
|
|
93
97
|
// you can describe your styles using BEM notation
|
|
94
98
|
// so that other people can use them via TypeScript generics
|
|
95
|
-
export interface
|
|
99
|
+
export interface TCardMaker {
|
|
96
100
|
/**
|
|
97
101
|
* Card block
|
|
98
102
|
*/
|
|
@@ -132,7 +136,7 @@ export interface ICardMaker {
|
|
|
132
136
|
|
|
133
137
|
const myStyleSheetMaker: TStyleSheetMaker = ({ bem, pseudo, at: { keyframes }, merge, palette, coef, size }) = {
|
|
134
138
|
// specify selector variants via generic
|
|
135
|
-
const selector = bem<
|
|
139
|
+
const selector = bem<TCardMaker>;
|
|
136
140
|
// creates unique keyframes identifier
|
|
137
141
|
const spin = keyframes({
|
|
138
142
|
from: {
|
|
@@ -178,13 +182,13 @@ export const App = (props: {
|
|
|
178
182
|
const { css } = props;
|
|
179
183
|
const stylesRef = useRef();
|
|
180
184
|
if (!stylesRef.current) {
|
|
181
|
-
const
|
|
182
|
-
// thanks to the
|
|
185
|
+
const [card] = css.use(myStyleSheetMaker)<TCardMaker>;
|
|
186
|
+
// thanks to the TCardMaker type,
|
|
183
187
|
// you don't need to look at the implementation - just create the necessary attributes
|
|
184
188
|
stylesRef.current = {
|
|
185
|
-
card:
|
|
189
|
+
card: card('card..rounded'),
|
|
186
190
|
// element with modifiers
|
|
187
|
-
footer:
|
|
191
|
+
footer: card({
|
|
188
192
|
card: {
|
|
189
193
|
footer: {
|
|
190
194
|
visible: '',
|
package/dist/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/*
|
|
2
|
-
* EffCSS
|
|
2
|
+
* EffCSS v4.0.0
|
|
3
3
|
* {@link https://gitverse.ru/msabitov/effcss}
|
|
4
4
|
* Copyright (c) Marat Sabitov
|
|
5
5
|
* @license Apache-2.0
|
|
6
6
|
*/
|
|
7
|
-
function t(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}"function"==typeof SuppressedError&&SuppressedError;const e=Object.entries,s=Array.isArray,r=(t,...n)=>n.length?n.reduce(((t,n)=>(e(n).forEach((([e,n])=>{n&&"object"==typeof n&&t[e]?s(t[e])&&s(n)?t[e]=[...t[e],...n]:r(t[e],n||{}):t[e]=n})),t)),t):t,n={def:.75,c:.05,s:.65,m:.75,l:.85,n:.9},i={mode:"a",prefix:"f"},a=t=>Number((.1*184+.9*t).toFixed(2)),c={l:{dark:{bg:{xl:.24,l:.3,m:.36,s:.42,xs:.48},fg:{xl:.98,l:.93,m:.86,s:.79,xs:.72}},light:{bg:{xl:.98,l:.93,m:.88,s:.83,xs:.78},fg:{xl:0,l:.12,m:.24,s:.36,xs:.48}}},c:{dark:{bg:{pale:.02,base:.06,rich:.1},fg:{pale:.06,base:.1,rich:.14}},light:{bg:{pale:.01,base:.04,rich:.7},fg:{pale:.07,base:.11,rich:.15}}},h:{pri:184,sec:290,suc:a(142),inf:a(264),war:a(109),dan:a(29)}},o={bp:{"3xs":18,"2xs":24,xs:30,sm:40,md:48,lg:64,xl:80,"2xl":96},vars:{"":{rtime:"200ms",rem:"16px",rangle:"30deg",l:n,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:n},dark:{l:{def:.4,n:.25,s:.3,m:.4,l:.5,c:.95}}},palette:c,coef:{$0_:{xxs:.0625,xs:.125,s:.25,m:.5,l:.75,xl:.875,xxl:.9375},$1_:{xxs:1.0625,xs:1.125,s:1.25,m:1.5,l:1.75,xl:1.875,xxl:1.9375},$2_:{xxs:2.5,xs:4,s:5,m:7.5,l:10,xl:12,xxl:15},$16_:{xxs:20,xs:28,s:36,m:48,l:64,xl:80,xxl:120},max:150}},l=(t,e,s)=>Object.entries(t).reduce(e,s),u=Symbol("noParse"),h=(t,e,s)=>{var r,n,i;let a=""+t;return null==e?"":"object"!=typeof e||e.hasOwnProperty(u)?`${c=a,c.replace(/[A-Z]/g,(t=>"-"+t.toLowerCase()))}:${""+e};`:(!s||(null===(r=s.startsWith)||void 0===r?void 0:r.call(s,"@"))||(null===(n=a.startsWith)||void 0===n?void 0:n.call(a,"&"))||(null===(i=a.startsWith)||void 0===i?void 0:i.call(a,"@"))?"":"&")+a+`{${l(e,((t,e)=>t+h(...e,a)),"")}}`;var c},g="@media",m="@container",p="@property",d="@keyframes",b="@layer",f="@scope",y="@supports",x="@starting-style",v=(t,e)=>{const s=g+` ${e||""}${e?" and ":""}(${t})`;return{s:s,q:t,t:e,toString:()=>s}};v.toString=()=>g;const $=t=>`(${t})`,j=t=>"string"==typeof t;function O(t){var e;if(!(null===(e=null==t?void 0:t.args)||void 0===e?void 0:e.length))return"";switch(t.key){case"or":return t.args.map((t=>j(t)?$(t):O(t))).join(" or ");case"and":return t.args.map((t=>{const e=!j(t);return e&&"or"===t.key?$(O(t)):e?O(t):$(t)})).join(" and ");case"not":const e=t.args[0];return"not "+(j(e)?$(e):$(O(e)))}}const k=(t,e)=>{let s="";return t.length&&(s=t.join(" ")),e&&(s=s+(s?" and ":"")+(s&&"or"===e.key?$(O(e)):O(e))),s},_=(t={})=>{const{type:e=[],state:s}=t;return Object.defineProperties((t=>{const r=k(e,s);return{[`${g}${r?" "+r:""}`]:t}}),{key:{value:null==s?void 0:s.key},args:{value:null==s?void 0:s.args},all:{get:()=>_({state:s,type:["all"]})},print:{get:()=>_({state:s,type:["print"]})},screen:{get:()=>_({state:s,type:["screen"]})},and:{value:(...t)=>_({type:e,state:{key:"and",args:s?[s,...t]:t}})},or:{value:(...t)=>_({type:e,state:{key:"or",args:s?[s,...t]:t}})},not:{get:()=>_(s?{type:e,state:j(s)||"not"!==(null==s?void 0:s.key)?{key:"not",args:[s]}:s.args[0]}:{type:2===e.length?[e[1]]:["not",e[0]||"all"],state:s})}})},w=t=>{const{root:e="",limit:s="",mode:r=[!1,!1]}=t;return Object.defineProperties((t=>({[f+` ${e?`(${e}${r[0]?" > *":""})`:""}${e&&s?" ":""}${s?`to (${s}${r[1]?" > *":""})`:""}`]:t})),{limit:{value:t=>w({root:e,limit:t,mode:r})},root:{value:t=>w({root:t,limit:s,mode:r})},both:{value:()=>w({root:e,limit:s,mode:[!1,!0]})},none:{value:()=>w({root:e,limit:s,mode:[!0,!1]})},low:{value:()=>w({root:e,limit:s,mode:[!0,!0]})},high:{value:()=>w({root:e,limit:s,mode:[!1,!1]})},toString:{value:()=>":scope"}})},S=t=>({[x]:t}),q=t=>{const e={cp:1,lay:1,kf:1,cq:1},s=(s,r)=>{const n="string"==typeof r?r:t.name("cq",e.cq++),i=m+` ${n?n+" ":""}(${s})`;return{c:n,q:s,s:i,toString:()=>i}};s.toString=()=>m;const r=(s={})=>{const{scroll:n,type:i,name:a,state:c}=s;return Object.defineProperties((t=>{const e=k([],c);return{[`${m}${a?" "+a:""}${e?" "+e:""}`]:t}}),{container:{value:(a||"none")+" / "+(i&&n?`${i} scroll-state`:n?"scroll-state":i||"normal"),enumerable:!0},key:{value:null==c?void 0:c.key},args:{value:null==c?void 0:c.args},named:{get:()=>r({scroll:n,state:c,name:a||t.name("cq",e.cq++),type:i})},size:{get:()=>r({name:a,scroll:n,state:c,type:"size"})},isize:{get:()=>r({name:a,scroll:n,state:c,type:"inline-size"})},scroll:{get:()=>r({name:a,scroll:!0,state:c,type:i})},and:{value:(...t)=>r({name:a,scroll:n,type:i,state:{key:"and",args:c?[c,...t]:t}})},or:{value:(...t)=>r({name:a,scroll:n,type:i,state:{key:"or",args:c?[c,...t]:t}})},not:{value:t=>r({name:a,scroll:n,type:i,state:{key:"not",args:[t]}})},[u]:{value:!0}})},n=(s,r)=>{const n="--"+(s||t.name("cp",e.cp++)),i=p+" "+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}};n.toString=()=>p;const i=s=>{const r=s||t.name("kf",e.kf++),n=d+" "+r;return{k:r,s:n,toString:()=>n}};i.toString=()=>d;const a=s=>{const r=s||t.name("lay",e.lay++),n=b+" "+r;return{k:r,s:n,toString:()=>n}};a.toString=()=>b;a.toString=()=>f;const c=(t="",e=!1)=>{const s=y+` ${e?"not ":""}(${t})`;return{c:t,n:e,s:s,toString:()=>s}};return c.toString=()=>y,{pr:n,kf:i,mq:v,cq:s,lay:a,sc:(t="",e="")=>{const s=f+` ${t?`(${t})`:""}${t&&e?" ":""}${e?`to (${e})`:""}`;return{r:t,l:e,s:s,toString:()=>s}},sup:c,keyframes:s=>{const r=t.name("kf",e.kf++),n=d+" "+r;return Object.defineProperties((t=>{if(!t)return{animationName:r};const{dur:e,tf:s,del:n,ic:i,dir:a,ps:c,fm:o}=t;return{animation:[e,s,n,i,a,c,o,r].filter(Boolean).join(" ")}}),{[n]:{value:s,enumerable:!0},toString:{value:()=>r},[u]:{value:!0}})},property:(s={})=>{const{syn:r='"*"',inh:n=!0,ini:i,def:a}=s,c="--"+t.name("cp",e.cp++),o=`var(${c}${void 0!==a?","+a:""})`,l=p+" "+c;return Object.defineProperties((t=>({[c]:t})),{[l]:{value:{syntax:r,inherits:n,initialValue:i},enumerable:!0},toString:{value:()=>o},fallback:{value:t=>`var(${c},${t})`},[u]:{value:!0}})},scope:w({}),media:_({}),container:r({}),startingStyle:S}},A=t=>t+"px",E=t=>t+"vh",P=t=>t+"vw",C=t=>t+"vmin",z=t=>t+"vmax",M=t=>t+"em",N=t=>t+"rem",W=t=>t+"deg",I=t=>t+"rad",K=t=>t+"rad",T=t=>t+"ms",B=t=>t+"s",J=t=>t+"%",D=t=>t+"cqw",L=t=>t+"cqh",R=t=>t+"cqi",V=t=>t+"cqb",F=t=>t+"cqmin",H=t=>t+"cqmax",Z=Object.fromEntries,G=Object.entries,Q=":first-",U=":last-",X=":only-",Y="child",tt=":nth-",et="of-type",st=tt+Y,rt=":focus",nt={r:":root",h:":hover",f:rt,fv:rt+"-visible",a:":active",v:":visited",val:":valid",inv:":invalid",e:":empty",d:":disabled",rq:":required",o:":optional",m:":modal",l:":link",ph:":placeholder",ch:":checked",po:":popover-open",fc:Q+Y,lc:U+Y,oc:X+Y,odd:st+"(odd)",even:st+"(even)",ft:Q+et,lt:U+et,ot:X+et,bef:"::before",aft:"::after",bd:"::backdrop"},it={has:":has",not:":not",is:":is",wh:":where",st:":state",nthc:st,ntho:tt+et,dir:":dir",lang:":lang"},at="oklch",ct=t=>at+`(${t})`,ot=t=>ct(`from ${t}`),lt="def",ut=t=>{const e=(e,s)=>"string"==typeof s?t(e,s):s;class s{constructor(t={}){this.state={l:e("l",lt),c:e("c",lt),h:e("h",lt),a:e("a",lt)},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 ct(`${t} ${e} ${s} / ${r}`)}}return t=>new s(t)},ht=(t,e=.1)=>ot(`${t} calc(l + ${e}) c h / alpha)`),gt=(t,e=.1)=>ot(`${t} calc(l - ${e}) c h / alpha)`),mt=(t,e=.1)=>ot(`${t} l c h / calc(alpha + ${e}))`),pt=(t,e=.1)=>ot(`${t} l c h / calc(alpha - ${e}))`),dt=(t,e=.04)=>ot(`${t} l calc(c + ${e}) h / alpha)`),bt=(t,e=.04)=>ot(`${t} l calc(c - ${e}) h / alpha)`),ft=(t,e=30)=>ot(`${t} l c calc(h${"number"==typeof e?e>0?" + "+e:" - "+-e:e}) / alpha)`),yt=({base:t,mixin:e,method:s,bpart:r,mpart:n})=>`color-mix(in ${s||at}, ${t}${void 0!==r?` ${r}%`:""}, ${e}${void 0!==n?` ${n}%`:""})`,xt=t=>({create:ut(t),oklch:ct,lighten:ht,darken:gt,saturate:dt,desaturate:bt,fadein:mt,fadeout:pt,spin:ft,mix:yt}),vt="palette",$t=t=>{class e{constructor(t={}){this.state={l:"l",c:"base",h:"pri",a:1,m:"bg"},Object.assign(this,{[u]:!0}),this.state=Object.assign(this.state,t)}get xs(){return new e(Object.assign(Object.assign({},this.state),{l:"xs"}))}get s(){return new e(Object.assign(Object.assign({},this.state),{l:"s"}))}get m(){return new e(Object.assign(Object.assign({},this.state),{l:"m"}))}get l(){return new e(Object.assign(Object.assign({},this.state),{l:"l"}))}get xl(){return new e(Object.assign(Object.assign({},this.state),{l:"xl"}))}get lightness(){return{xs:this.xs,s:this.s,m:this.m,l:this.l,xl:this.xl}}get gray(){return new e(Object.assign(Object.assign({},this.state),{c:"gray"}))}get pale(){return new e(Object.assign(Object.assign({},this.state),{c:"pale"}))}get base(){return new e(Object.assign(Object.assign({},this.state),{c:"base"}))}get rich(){return new e(Object.assign(Object.assign({},this.state),{c:"rich"}))}get chroma(){return{gray:this.gray,pale:this.pale,base:this.base,rich:this.rich}}get pri(){return new e(Object.assign(Object.assign({},this.state),{h:"pri"}))}get sec(){return new e(Object.assign(Object.assign({},this.state),{h:"sec"}))}get suc(){return new e(Object.assign(Object.assign({},this.state),{h:"suc"}))}get inf(){return new e(Object.assign(Object.assign({},this.state),{h:"inf"}))}get war(){return new e(Object.assign(Object.assign({},this.state),{h:"war"}))}get dan(){return new e(Object.assign(Object.assign({},this.state),{h:"dan"}))}get hue(){return{pri:this.pri,sec:this.sec,suc:this.suc,inf:this.inf,war:this.war,dan:this.dan}}alpha(t=1){return new e(Object.assign(Object.assign({},this.state),{a:t}))}get bg(){return new e(Object.assign(Object.assign({},this.state),{m:"bg"}))}get fg(){return new e(Object.assign(Object.assign({},this.state),{m:"fg"}))}toString(){const{l:e,c:s,h:r,a:n,m:i}=this.state;return`oklch(${t(vt,"l",i,e)} ${t(vt,"c",i,s)} ${t(vt,"h",r)} / ${n})`}}return new e},jt="coef",Ot=t=>{class e{constructor(t={}){this.state={center:8},this.state=Object.assign(this.state,t)}get min(){return t(jt,this.state.center-4)}get xxs(){return t(jt,this.state.center-3)}get xs(){return t(jt,this.state.center-2)}get s(){return t(jt,this.state.center-1)}get m(){return t(jt,this.state.center)}get l(){return t(jt,this.state.center+1)}get xl(){return t(jt,this.state.center+2)}get xxl(){return t(jt,this.state.center+3)}get max(){return t(jt,this.state.center+4)}get $0_(){return new e({center:4})}get $1_(){return new e({center:12})}get $2_(){return new e({center:20})}get $16_(){return new e({center:28})}get $1(){return new e({center:8})}get $2(){return new e({center:16})}get $16(){return new e({center:24})}get short(){return{s:this.s,m:this.m,l:this.l}}get base(){return Object.assign(Object.assign({xs:this.xs},this.short),{xl:this.xl})}get long(){return Object.assign(Object.assign({xxs:this.xxs},this.base),{xxl:this.xxl})}get full(){return Object.assign(Object.assign({min:this.min},this.long),{max:this.max})}get main(){return{min:this.min,m:this.m,max:this.max}}get sparse(){return{min:this.min,xs:this.xs,m:this.m,xl:this.xl,max:this.max}}}return new e},kt=Object.assign,_t=Object.entries,wt={dash:(...t)=>t.join("-"),comma:(...t)=>t.join(),space:(...t)=>t.join(" "),range:(t,e)=>Array.from(Array(t).entries()).reduce(((t,[s])=>kt(t,e(s+1))),{}),each:(t,e)=>_t(t).reduce(((t,[s,r])=>kt(t,e(s,r))),{}),when:(t,e,s={})=>t?e:s},St="width: ",qt=t=>{const{scope:e,globalKey:s="",bp:n={}}=t,i=e(s).varExp,a=t=>i(...t.split(".")),c=(t=1)=>`calc(${t} * ${a("rtime")})`,o=(t=1)=>`calc(${t} * ${a("rangle")})`,u=(t=1)=>`calc(${t} * 1rem)`;return{compile:({key:t,maker:s})=>{const g=e(t),m=q(g),p=t=>{const e=n[t]||t;return"number"==typeof e?e+"rem":""},d=t=>"min-"+St+p(t),b=t=>"max-"+St+p(t),f=(t,e)=>"string"==typeof e?m.cq(t,e):m.mq(t),y=(t,e,s)=>""+f(d(t)+") and ("+b(e),s),x={up:(t,e)=>""+f(d(t),e),down:(t,e)=>""+f(b(t),e),between:y,only:(t,e)=>y(t,t,e)};return v=s(Object.assign(wt,{key:t,vars:a,size:u,time:c,angle:o,bem:g.selector,pseudo:Object.assign(Z(G(nt).map((([t,e])=>{function s(t=""){return t+e}return s.toString=()=>e,[t,s]}))),Z(G(it).map((([t,e])=>{function s(t,s=""){return s+e+`(${t})`}return s.toString=()=>e,[t,s]})))),color:xt(i),palette:$t(i),coef:Ot(i),units:{px:A,vh:E,vw:P,vmin:C,vmax:z,em:M,rem:N,deg:W,rad:I,turn:K,ms:T,s:B,pc:J,cqw:D,cqh:L,cqb:V,cqi:R,cqmin:F,cqmax:H},at:m,limit:x,merge:r})),l(v,((t,e)=>t+h(...e)),"");var v}}};const At=()=>{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 Object.entries(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])))}}},Et=({prefix:t=i.prefix})=>{let e=1;return{get base(){return t+0},get current(){return t+e},next(){return e++,this.current},reset(){e=1}}},Pt=void 0,Ct=Object.entries,zt=Object.defineProperties,Mt=t=>"string"==typeof t,Nt=t=>null!==t&&"object"==typeof t,Wt=t=>t.split("."),It=(t,e)=>Ct(t).reduce(((t,[s,r])=>{if(Nt(r)){const n=Ct(r);n.length?t.push(...n.reduce(((t,[r,n])=>{if((t=>null!==t&&t!==Pt)(r)&&e&&t.push([s,r,Pt,Pt]),Nt(n)){const e=Ct(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,Pt,Pt,Pt])}return t}),[]),Kt=(t,e,s,r)=>""+(((t,e)=>`${t||""}${e?"__"+e:""}`)(t,e)+(s?"_"+s:"")+(s&&r?"_"+r:""))||"_",Tt=(t,e)=>"."+(e?t+(e.startsWith("_")?"":"-")+e:t),Bt=(t,e)=>`[data-${t}${e?`~="${e}"`:""}]`;const Jt=t=>t||"",Dt=(t={})=>{const{mode:e,min:s,dict:r={}}=t;let n;n="a"===e?Bt:Tt;const i=t=>{let s=0,r=Jt,a=Jt;const c=i.dict;c&&(c[t]||(c[t]={}),r=e=>{var r;return null!==(r=c[t][e])&&void 0!==r?r:c[t][e]=(s++).toString(36)},a=e=>c[t][e]);let o=(...e)=>[t,...e].filter(Boolean).join("-"),l="class",u=e=>e?t+(e.startsWith("_")?"":"-")+e:void 0===e?void 0:t;"a"===e&&(l="data-"+t,u=Jt);const h=(...t)=>"--"+o(...t),g=t=>{if(void 0===t)return function(t){const e=({b:s,e:r,m:n})=>({b:t=>e({b:t,e:"",m:{}}),e:t=>e({b:s,e:t,m:{}}),m:(t={})=>e({b:s,e:r,m:t}),get $(){return t({[s]:{[r]:n}})}});return e({b:"",e:"",m:{}})}(g);let e,s,r,n,i="";const c=Mt(t);return i=c||Array.isArray(t)?[...(c?[t]:t).reduce(((t,i)=>([e,s,r,n]=Wt(i),t.add(u(a(Kt(e,s)))),r&&t.add(u(a(Kt(e,s,r,n)))),t)),new Set).values()].join(" "):t&&It(t,!0).map((([t,e,s,r])=>u(a(Kt(t,e,s,r))))).join(" "),zt({[l]:i},{toString:{value:()=>`${l}="${i}"`},$:{value:i}})};return{selector:e=>{let s,i,a,c;return Mt(e)?([s,i,a,c]=Wt(e),n(t,r(Kt(s,i,a,c)))):e&&It(e).map((([e,s,i,a])=>n(t,r(Kt(e,s,i,a))))).join(",")},attr:g,name:o,varName:h,varExp:(...t)=>`var(${h(...t)})`}};return s&&(i.dict=r),i},Lt="effcss-provider",Rt="script",Vt="theme",Ft="size",Ht="time",Zt="angle",Gt="palette",Qt="data-effcss",Ut=Qt+"-scope",Xt="application/json",Yt=Object.assign,te=Object.entries,ee=Object.fromEntries,se=t=>"boolean"==typeof t,re=(t,e)=>t.getAttribute(e)||i[e],ne=(t,e)=>(t=>null!==t?Number(t):null)(re(t,e)),ie=(t,e,s)=>null===s?t.removeAttribute(e):t.setAttribute(e,s+""),ae=t=>`:root:has(${Rt}[is=${Lt}]${t?`[${t}]`:""})`,ce=t=>[t.xxs,t.xs,t.s,t.m,t.l,t.xl,t.xxl],oe=["xs","s","m","l","xl"],le=["pale","base","rich"],ue=({scope:e,keyMaker:s,provider:r})=>{const n=r.settings,i=null==n?void 0:n.vars,{varName:a}=e(s.base),c=t=>a("",t);function o(t,e){return te(t).reduce(((t,[s,r])=>r&&"object"==typeof r?Yt(t,o(r,[...e,s])):(t[a(...e,s)]=r,t)),{})}const l=ee(te(i||{}).map((([t,e])=>[t,o(e,[])]))),{"":u={},dark:h,light:g}=l,m=t(l,["","dark","light"]),p=r.size,d=r.time,b=r.angle,{l:f,c:y,h:x}=n.palette,v=n.coef,$=[0,...ce(v.$0_),1,...ce(v.$1_),2,...ce(v.$2_),16,...ce(v.$16_),v.max];return({bem:t,each:e,when:s,vars:r,merge:n,at:{media:i},units:{px:o,ms:h,deg:g}})=>{const v="prefers-color-scheme",j={light:`${v}: light`,dark:`${v}: dark`};return n({[ae()]:n({fontSize:r("rem")},u,e($,((t,e)=>({[a("coef",t)]:e}))),e(x,((t,e)=>({[a(Gt,"h",t)]:e}))),{[a(Gt,"c","bg","gray")]:0,[a(Gt,"c","fg","gray")]:0},e(j,((t,s)=>i.and(s)(n(l[t]||{},e(oe,((e,s)=>({[a(Gt,"l","bg",s)]:f[t].bg[s],[a(Gt,"l","fg",s)]:f[t].fg[s]}))),e(le,((e,s)=>({[a(Gt,"c","bg",s)]:y[t].bg[s],[a(Gt,"c","fg",s)]:y[t].fg[s]}))))))))},e(m,((e,s)=>({[ae(`${Vt}=${e}`)]:s,[t(`..theme.${e}`)]:s}))),s(!!p,{[ae(Ft)]:{[c("rem")]:o(p)}}),s(!!d,{[ae(Ht)]:{[c("rtime")]:h(d)}}),s(!!b,{[ae(Zt)]:{[c("rangle")]:g(b)}}))}},he=({scope:t,keyMaker:e,collector:s,manager:r,processor:n})=>{const i=t=>"string"==typeof t?t:s.getKey(t),a=s=>t(s||e.base).attr,c=(t,e)=>n.compile({key:e,maker:t}),o=(t,n,i)=>{const o=n||e.current;let l=s.use(t,o);return(i||r&&!r.has(l))&&(r.pack(l,r.hydrate(l)||c(t,l)),n||e.next()),a(l)};return{key:i,resolve:a,use:o,usePublic:t=>ee(te(t).map((([t,e])=>[t,o(e,t)]))),usePrivate:t=>t.map((t=>o(t))),css:c,status:t=>{const e=i(t);return!!e&&r.status(e)},on:(...t)=>r.on(...t.map(i)),off:(...t)=>r.off(...t.map(i)),stylesheets:(...t)=>{let e;return e=t.length?1===t.length&&Array.isArray(t[0])?t[0]:t:s.keys,e.map((t=>r.get(i(t))))}}},ge=t=>Object.defineProperties(t,{prefix:{get:()=>t.getAttribute("prefix")||"f"},mode:{get:()=>t.getAttribute("mode")||"a"},min:{get:()=>""===t.getAttribute("min")},hydrate:{get:()=>""===t.getAttribute("hydrate")},theme:{set(e){ie(t,Vt,e)},get:()=>re(t,Vt)||""},size:{set(e){ie(t,Ft,e)},get:()=>ne(t,Ft)},time:{set(e){ie(t,Ht,e)},get:()=>ne(t,Ht)},angle:{set(e){ie(t,Zt,e)},get:()=>ne(t,Zt)}});function me(t={}){const e=globalThis.document,s=globalThis.customElements;if(null==s?void 0:s.get(Lt))return!1;{class n extends HTMLScriptElement{constructor(){super(...arguments),this._c=At(),this._settings=o,this._cust=()=>{this._=ue({scope:this._s,keyMaker:this._k,provider:this}),this.use(this._,this._k.base,!0)}}static get observedAttributes(){return[Ft,Ht,Zt]}get settings(){return this._settings}set settings(t){var e,s,n;const i=r({},this._settings,t),{makers:a,bp:c,off:o}=i;(c&&(null===(e=this._settings)||void 0===e?void 0:e.bp)!==c||!this._p)&&(this._p=qt({scope:this._s,globalKey:this._k.base,bp:c})),a&&(null===(s=this._settings)||void 0===s?void 0:s.makers)!==a&&(this._c.useMany(a),this.usePublic(a),(null==o?void 0:o.length)&&this._settings.off!==o&&this.off(...o)),this._settings=i,(!(null===(n=this._m)||void 0===n?void 0:n.has(this._k.base))||t.vars||t.palette||t.coef)&&this._cust()}get makers(){return this._c.makers}attributeChangedCallback(){this._k&&this._cust()}connectedCallback(){var s;this.textContent?this._settings=r(this._settings,JSON.parse(this.textContent)):t&&(this._settings=r(this._settings,t)),ge(this);const n=null===(s=e.querySelector(`script[${Ut}]`))||void 0===s?void 0:s.textContent;this._k=Et({prefix:this.prefix}),this._s=Dt({mode:this.mode,min:this.min,dict:n&&JSON.parse(n)}),this._p=qt({scope:this._s,globalKey:this._k.base,bp:t.bp||this.settings.bp}),this._m=function(t){const e={};null==t||t.forEach((t=>{const s=t.dataset.effcss;s&&(e[s]=t)}));let s={},r={},n=[],i=[];const a=(t,e)=>(e.toString=()=>"effcss-"+t,e),c=t=>{var e;return t.adoptedStyleSheets=[...(null===(e=t.adoptedStyleSheets)||void 0===e?void 0:e.length)?[...t.adoptedStyleSheets].filter((t=>!(t+"").startsWith("effcss-"))):[],...n]},o=()=>{i=i.reduce(((t,e)=>{const s=e.deref();return s&&(c(s),t.push(e)),t}),[])},l=t=>n.findIndex((e=>e===t)),u=t=>t?s[t]:void 0,h=(t,r)=>{if(!s[t]){s[t]=a(t,r),n.push(s[t]);const i=e[t];return i&&(i.disabled=!0),o(),!0}},g=t=>{const e=u(t);return!!e&&-1!==l(e)};return{apply:c,notify:o,getIndex:l,get:u,has:t=>!!t&&!!u(t),getAll:()=>s,add:h,status:g,on:(...t)=>{const e=t.reduce(((t,e)=>{const s=u(e);return!(!s||g(e))&&(n.push(s),t)}),!0);return o(),e},off:(...t)=>{const e=t.reduce(((t,e)=>{const s=u(e);if(s&&g(e)){const e=l(s);return n.splice(e,1),t}return!1}),!0);return o(),e},remove:t=>{const e=u(t);if(!e)return;const i=l(e);return i>-1&&(n.splice(i,1),delete s[t],delete r[t]),o(),!0},removeAll:()=>(n.splice(0),s={},r={},o(),!0),pack:(t,e)=>{let r=s[t]||new CSSStyleSheet;return r.replaceSync(e),r=a(t,r),!!r.cssRules.length&&h(t,r)},replace:(t,e)=>{const r=s[t];if(r)return r.replaceSync(e),o(),!0},register:t=>{i.findIndex((e=>e.deref()===t))>=0||(i.push(new WeakRef(t)),c(t))},unregister:t=>{const e=i.findIndex((e=>e.deref()===t));e>=0&&i.splice(e,1)},hydrate:t=>e[t]&&!e[t].disabled&&e[t].textContent||void 0}}(e.querySelectorAll(`style[${Qt}]`));const i=he({scope:this._s,processor:this._p,keyMaker:this._k,manager:this._m,collector:this._c});Object.assign(this,i),this._cust();const a=this;this._n={set adoptedStyleSheets(t){a.dispatchEvent(new CustomEvent("effcsschanges",{detail:{styles:t},bubbles:!0}))}},this._m.register(this._n),this._m.register(e)}toString(){const t=[...this.attributes].map((t=>t.value?`${t.name}="${t.value}"`:""===t.value?t.name:"")).filter(Boolean).join(" ");return`<${Rt} ${t}>${this.textContent}</${Rt}>`}}return s.define(Lt,n,{extends:Rt}),!0}}const pe=(e={})=>{let{noscript:s,attrs:n={}}=e,a=t(e,["noscript","attrs"]);const c=r(o,a);let{mode:l=i.mode,min:u,prefix:h=i.prefix,theme:g,hydrate:m,size:p,time:d,angle:b}=n;const f=Et({prefix:h}),y=Dt({mode:l,min:u}),x=qt({scope:y,globalKey:f.base,bp:c.bp}),v=At(),$={},j=[],O=t=>j.findIndex((e=>e===t)),k=he({scope:y,processor:x,keyMaker:f,manager:{hydrate(t){},get:t=>t?$[t]:void 0,pack(t,e){const s=$[t]||{key:t,styles:e};if(!$[t])return $[t]=s,j.push(s),!0},has(t){return!!t&&!!this.get(t)},status(t){const e=this.get(t);return!!e&&-1!==O(e)},on(...t){return t.reduce(((t,e)=>{const s=this.get(e);return!(!s||this.status(e))&&(j.push(s),t)}),!0)},off(...t){return t.reduce(((t,e)=>{const s=this.get(e);if(s&&this.status(e)){const e=O(s);return j.splice(e,1),t}return!1}),!0)}},collector:v}),_=Object.assign(Object.assign({tagName:"",attributes:{prefix:h,mode:l,hydrate:m,min:u,theme:g,size:p,time:d,angle:b},getAttribute(t){const e=this.attributes[t];return e?se(e)?"":e:null},setAttribute(t,e){this.attributes[t]=e},removeAttribute(t){delete this.attributes[t]},get makers(){return v.makers},get settings(){return c},set settings(t){}},k),{toString(){const t=[{key:f.base,styles:k.css(ue({scope:y,keyMaker:f,provider:this}),f.base)},...j].map((({key:t,styles:e})=>`<style ${Qt}="${t}">${e}</style>`)).join("");if(s)return t;const e=u&&v.keys.length>1?`<${Rt} ${Ut} type="${Xt}">${JSON.stringify(y.dict)}</${Rt}>`:"",r=Object.keys(a).length?JSON.stringify(a):"",n=Object.entries(Object.assign({is:Lt,type:Xt},this.attributes)).map((([t,e])=>e&&e!==i[t]?se(e)?t:`${t}="${e}"`:"")).filter(Boolean).join(" ");return t+e+`<${Rt} ${n}>${r}</${Rt}>`}});return ge(_)},de=(e={})=>{const{emulate:s}=e,r=t(e,["emulate"]),n=null===globalThis||void 0===globalThis?void 0:globalThis.document;if(n&&!s){void 0===de.isDefined&&(de.isDefined=me(r));const t=n.querySelector(Rt+`[is=${Lt}]`);if(t)return t;const e=n.createElement(Rt,{is:Lt});e.setAttribute("is",Lt);const s=null==r?void 0:r.attrs;return s&&Object.entries(s).map((([t,s])=>s&&i[t]!==s&&e.setAttribute(t,se(s)?"":s+""))),n.head.appendChild(e),e}return pe(r)};export{Lt as TAG_NAME,me as defineProvider,de as useStyleProvider};
|
|
7
|
+
function e(e,t){var s={};for(var r in e)Object.prototype.hasOwnProperty.call(e,r)&&t.indexOf(r)<0&&(s[r]=e[r]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var n=0;for(r=Object.getOwnPropertySymbols(e);n<r.length;n++)t.indexOf(r[n])<0&&Object.prototype.propertyIsEnumerable.call(e,r[n])&&(s[r[n]]=e[r[n]])}return s}"function"==typeof SuppressedError&&SuppressedError;const t=(e,t,s)=>Object.entries(e).reduce(t,s),s=Symbol("noParse"),r=(e,n,i)=>{var a,l,o;let c=""+e;return null==n?"":"object"!=typeof n||n.hasOwnProperty(s)?""===n?c+";":`${u=c,u.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase()))}:${""+n};`:(!i||(null===(a=i.startsWith)||void 0===a?void 0:a.call(i,"@"))||(null===(l=c.startsWith)||void 0===l?void 0:l.call(c,"&"))||(null===(o=c.startsWith)||void 0===o?void 0:o.call(c,"@"))?"":"&")+c+`{${t(n,((e,t)=>e+r(...t,c)),"")}}`;var u},n="@layer",i="@starting-style",a=e=>`(${e})`,l=e=>"string"==typeof e,o=()=>{const e=e=>({toString:()=>`(min-width:${l(e)?e:e+"rem"})`}),t=e=>({toString:()=>`(max-width:${l(e)?e:e+"rem"})`}),s=(s,r)=>({toString:()=>`${e(s)} and ${t(r)}`});return{up:e,down:t,between:s,only:e=>s(e,e)}},c=(e,t)=>e?"string"==typeof e?e.includes("(")||t?e:a(e):e+"":"",u=(e={})=>{const{type:t,condition:s}=e,r=c(s),n="object"==typeof s&&"or"===s.type,i=`@media${t?" "+t:""}${t&&r?" and":""}${r?" "+(t&&n?a(r):r):""}`;return Object.defineProperties((e=>({[i]:e})),{all:{get:()=>u({condition:s,type:"all"})},print:{get:()=>u({condition:s,type:"print"})},screen:{get:()=>u({condition:s,type:"screen"})},where:{value:e=>u({condition:e,type:t})},toString:{value:()=>i}})},h=({condition:e}={})=>{const t=c(e),s="@supports"+(t?" "+t:"");return Object.defineProperties((e=>({[s]:e})),{where:{value:e=>h({condition:e})},toString:{value:()=>s}})},g=e=>({[i]:e});g.toString=i;const m=e=>{const{root:t="",limit:s="",mode:r=[!1,!1]}=e,n=`@scope ${t?`(${t}${r[0]?" > *":""})`:""}${t&&s?" ":""}${s?`to (${s}${r[1]?" > *":""})`:""}`;return Object.defineProperties((e=>({[n]:e})),{limit:{value:e=>m({root:t,limit:e,mode:r})},root:{value:e=>m({root:e,limit:s,mode:r})},both:{value:()=>m({root:t,limit:s,mode:[!1,!0]})},none:{value:()=>m({root:t,limit:s,mode:[!0,!1]})},low:{value:()=>m({root:t,limit:s,mode:[!0,!0]})},high:{value:()=>m({root:t,limit:s,mode:[!1,!1]})},toString:{value:()=>n}})},d=e=>{const t={cp:1,lay:1,kf:1,cq:1},r=(n={})=>{const{scroll:i,type:a,name:l,condition:o}=n,u=c(o),h=`@container${l?" "+l:""}${u?" "+u:""}`;return Object.defineProperties((e=>({[h]:e})),{container:{value:(l||"none")+" / "+(a&&i?`${a} scroll-state`:i?"scroll-state":a||"normal"),enumerable:!0},named:{get:()=>r({scroll:i,condition:o,name:l||e.name(["cq",t.cq++]),type:a})},size:{get:()=>r({name:l,scroll:i,condition:o,type:"size"})},isize:{get:()=>r({name:l,scroll:i,condition:o,type:"inline-size"})},scroll:{get:()=>r({name:l,scroll:!0,condition:o,type:a})},where:{value:e=>r({name:l,scroll:i,condition:e,type:a})},[s]:{value:!0},toString:{value:()=>h}})},i=({name:s}={})=>{const r=`${n}${s?" "+s:""}`,a=e=>({[r]:e});return a.toString=()=>r,Object.defineProperties(a,{named:{get:()=>i({name:s||e.name(["lay",t.lay++])})},list:{value:(...e)=>({[n+(e.map((e=>(e+"").split(n)[1])).filter(Boolean).join(",")||s)]:""})}})};return{layer:i(),supports:h(),keyframes:r=>{const n=e.name(["kf",t.kf++]),i="@keyframes "+n;return Object.defineProperties((e=>{if(!e)return{animationName:n};const{dur:t,tf:s,del:r,ic:i,dir:a,ps:l,fm:o}=e;return{animation:[t,s,r,i,a,l,o,n].filter(Boolean).join(" ")}}),{[i]:{value:r,enumerable:!0},toString:{value:()=>n},[s]:{value:!0}})},property:(r={})=>{const{syn:n='"*"',inh:i=!0,ini:a,def:l}=r,o="--"+e.name(["cp",t.cp++]),c=`var(${o}${void 0!==l?","+l:""})`,u="@property "+o;return Object.defineProperties((e=>({[o]:e})),{[u]:{value:{syntax:n,inherits:i,initialValue:a},enumerable:!0},toString:{value:()=>c},fallback:{value:e=>`var(${o},${e})`},[s]:{value:!0}})},scope:m({}),media:u({}),container:r({}),startingStyle:g,$logic:{and:(...e)=>Object.defineProperties({type:"and",value:e},{toString:{value:()=>e.filter(Boolean).map((e=>{const t=c(e);return"object"==typeof e&&"or"===e.type?a(t):t})).join(" and ")}}),or:(...e)=>Object.defineProperties({type:"or",value:e},{toString:{value:()=>e.filter(Boolean).map((e=>c(e))).join(" or ")}}),not:e=>"object"==typeof e&&"not"===e.type?e.value[0]:Object.defineProperties({type:"not",value:[e]},{toString:{value:()=>`not (${c(e,!0)})`}})},$width:o()}},p=(e,t)=>`calc(${e} * 1${t})`,b=e=>p(e,"px"),f=e=>p(e,"vh"),$=e=>p(e,"vw"),y=e=>p(e,"vmin"),v=e=>p(e,"vmax"),j=e=>p(e,"em"),O=e=>p(e,"rem"),x=e=>p(e,"deg"),w=e=>p(e,"rad"),k=e=>p(e,"rad"),S=e=>p(e,"ms"),_=e=>p(e,"s"),z=e=>p(e,"%"),A=e=>p(e,"cqw"),P=e=>p(e,"cqh"),q=e=>p(e,"cqi"),C=e=>p(e,"cqb"),E=e=>p(e,"cqmin"),N=e=>p(e,"cqmax"),T=Object.fromEntries,M=Object.entries,B=":first-",W=":last-",R=":only-",I="child",V=":nth-",D="of-type",J=V+I,K=":focus",L={r:":root",h:":hover",f:K,fv:K+"-visible",a:":active",v:":visited",val:":valid",inv:":invalid",e:":empty",d:":disabled",rq:":required",o:":optional",m:":modal",l:":link",ph:":placeholder",ch:":checked",po:":popover-open",fc:B+I,lc:W+I,oc:R+I,odd:J+"(odd)",even:J+"(even)",ft:B+D,lt:W+D,ot:R+D,bef:"::before",aft:"::after",bd:"::backdrop"},F={has:":has",not:":not",is:":is",wh:":where",st:":state",nthc:J,ntho:V+D,dir:":dir",lang:":lang"},H=e=>`oklch(${e})`,Z=e=>H(`from ${e}`),G=(e,t=.1)=>Z(`${e} calc(l + ${t}) c h / alpha)`),Q=(e,t=.1)=>Z(`${e} calc(l - ${t}) c h / alpha)`),U=(e,t=.1)=>Z(`${e} l c h / calc(alpha + ${t}))`),X=(e,t=.1)=>Z(`${e} l c h / calc(alpha - ${t}))`),Y=(e,t=.04)=>Z(`${e} l calc(c + ${t}) h / alpha)`),ee=(e,t=.04)=>Z(`${e} l calc(c - ${t}) h / alpha)`),te=(e,t=30)=>Z(`${e} l c calc(h${"number"==typeof t?t>0?" + "+t:" - "+-t:t}) / alpha)`),se=e=>{class t{constructor(e={}){this.state={l:"l",c:"base",h:"pri",a:1,m:"bg"},Object.assign(this,{[s]:!0}),this.state=Object.assign(this.state,e)}get xs(){return new t(Object.assign(Object.assign({},this.state),{l:"xs"}))}get s(){return new t(Object.assign(Object.assign({},this.state),{l:"s"}))}get m(){return new t(Object.assign(Object.assign({},this.state),{l:"m"}))}get l(){return new t(Object.assign(Object.assign({},this.state),{l:"l"}))}get xl(){return new t(Object.assign(Object.assign({},this.state),{l:"xl"}))}get lightness(){return{xs:this.xs,s:this.s,m:this.m,l:this.l,xl:this.xl}}get gray(){return new t(Object.assign(Object.assign({},this.state),{c:"gray"}))}get pale(){return new t(Object.assign(Object.assign({},this.state),{c:"pale"}))}get base(){return new t(Object.assign(Object.assign({},this.state),{c:"base"}))}get rich(){return new t(Object.assign(Object.assign({},this.state),{c:"rich"}))}get chroma(){return{gray:this.gray,pale:this.pale,base:this.base,rich:this.rich}}get pri(){return new t(Object.assign(Object.assign({},this.state),{h:"pri"}))}get sec(){return new t(Object.assign(Object.assign({},this.state),{h:"sec"}))}get suc(){return new t(Object.assign(Object.assign({},this.state),{h:"suc"}))}get inf(){return new t(Object.assign(Object.assign({},this.state),{h:"inf"}))}get war(){return new t(Object.assign(Object.assign({},this.state),{h:"war"}))}get dan(){return new t(Object.assign(Object.assign({},this.state),{h:"dan"}))}get hue(){return{pri:this.pri,sec:this.sec,suc:this.suc,inf:this.inf,war:this.war,dan:this.dan}}alpha(e=1){return new t(Object.assign(Object.assign({},this.state),{a:e}))}get bg(){return new t(Object.assign(Object.assign({},this.state),{m:"bg"}))}get fg(){return new t(Object.assign(Object.assign({},this.state),{m:"fg"}))}toString(){const{l:t,c:s,h:r,a:n,m:i}=this.state;return`oklch(${e(`lightness.${i}.${t}`)} ${e(`chroma.${i}.${s}`)} ${e(`hue.${r}`)} / ${n})`}}return new t},re="coef",ne=e=>{class t{constructor(e={}){this.state={center:8},this.state=Object.assign(this.state,e)}get min(){return e(`${re}.${this.state.center-4}`)}get xxs(){return e(`${re}.${this.state.center-3}`)}get xs(){return e(`${re}.${this.state.center-2}`)}get s(){return e(`${re}.${this.state.center-1}`)}get m(){return e(`${re}.${this.state.center}`)}get l(){return e(`${re}.${this.state.center+1}`)}get xl(){return e(`${re}.${this.state.center+2}`)}get xxl(){return e(`${re}.${this.state.center+3}`)}get max(){return e(`${re}.${this.state.center+4}`)}get $xxs(){return new t({center:4})}get $xs(){return new t({center:8})}get $s(){return new t({center:12})}get $m(){return new t({center:16})}get $l(){return new t({center:20})}get $xl(){return new t({center:24})}get $xxl(){return new t({center:28})}get short(){return{s:this.s,m:this.m,l:this.l}}get base(){return Object.assign(Object.assign({xs:this.xs},this.short),{xl:this.xl})}get long(){return Object.assign(Object.assign({xxs:this.xxs},this.base),{xxl:this.xxl})}get full(){return Object.assign(Object.assign({min:this.min},this.long),{max:this.max})}get main(){return{min:this.min,m:this.m,max:this.max}}get sparse(){return{min:this.min,xs:this.xs,m:this.m,xl:this.xl,max:this.max}}}return new t},ie=Object.assign,ae=Object.entries,le=Array.isArray,oe=(e,t)=>Array.from(Array(e).entries()).reduce(((e,[s])=>ie(e,t(s+1))),{}),ce=(e,t)=>ae(e).reduce(((e,[s,r])=>ie(e,t(s,r))),{}),ue=(e,t,s={})=>e?t:s,he=(...e)=>e.join("-"),ge=(...e)=>e.join(),me=(...e)=>e.join(" "),de=(e,...t)=>t.length?t.reduce(((e,t)=>(t&&e&&"object"==typeof t&&ae(t).forEach((([t,s])=>{s&&"object"==typeof s&&e[t]?le(e[t])&&le(s)?e[t]=[...e[t],...s]:de(e[t],s||{}):e[t]=s})),e)),e):e,pe=e=>{const{scope:s,globalKey:n}=e,i=s(n).varExp,a=(e=1)=>`calc(${1!==e?e+" * ":""}${i("time")} * 1ms)`,l=(e=1)=>`calc(${1!==e?e+" * ":""}${i("angle")} * 1deg)`,o=(e=1)=>`calc(${1!==e?e+" * ":""}${i("size")} * 1px)`;return{compile:({key:e,maker:n})=>{const c=s(e),u=c.selector,h=d(c);return g=n({dash:he,comma:ge,space:me,range:oe,each:ce,when:ue,merge:de,themeVar:i,size:o,time:a,angle:l,bem:u,pseudo:Object.assign(T(M(L).map((([e,t])=>{function s(e=""){return e+t}return s.toString=()=>t,[e,s]}))),T(M(F).map((([e,t])=>{function s(e,s=""){return s+t+`(${e})`}return s.toString=()=>t,[e,s]})))),color:{oklch:H,lighten:G,darken:Q,saturate:Y,desaturate:ee,fadein:U,fadeout:X,spin:te},palette:se(i),coef:ne(i),units:{px:b,vh:f,vw:$,vmin:y,vmax:v,em:j,rem:O,deg:x,rad:w,turn:k,ms:S,s:_,pc:z,cqw:A,cqh:P,cqb:C,cqi:q,cqmin:E,cqmax:N},at:h}),t(g,((e,t)=>e+r(...t)),"");var g}}},be=Symbol("effcss-stylesheet");class fe{constructor(){this.disabled=!1,this.cssRules=[]}replaceSync(e){e&&(this.cssRules=[{cssText:e}])}}function $e({initStyles:e,emulate:t}={}){const s={};null==e||e.forEach((e=>{var t;const r=null===(t=null==e?void 0:e.dataset)||void 0===t?void 0:t.effcss;r&&(s[r]=e)}));let r={},n={},i=[],a=[];const l=(e,t)=>t.hasOwnProperty(be)?t:Object.defineProperties(t,{[be]:{value:e}}),o=e=>{var t;return e.adoptedStyleSheets=[...(null===(t=e.adoptedStyleSheets)||void 0===t?void 0:t.length)?[...e.adoptedStyleSheets].filter((e=>!e.hasOwnProperty(be))):[],...i]},c=()=>{a=a.reduce(((e,t)=>{const s=t.deref();return s&&(o(s),e.push(t)),e}),[])},u=e=>e?r[e]:void 0,h=(e,t)=>{if(!r[e]){r[e]=l(e,t),i.push(r[e]);const n=s[e];return n&&(n.disabled=!0),c(),!0}};return{get:u,all:()=>r,add:h,status:e=>{const t=u(e);return!(null==t?void 0:t.disabled)},on:(...e)=>{e.forEach((e=>{const t=u(e);t&&(t.disabled=!1)})),c()},off:(...e)=>{e.forEach((e=>{const t=u(e);t&&(t.disabled=!0)})),c()},remove:e=>{const t=u(e);if(!t)return;const s=(a=t,i.findIndex((e=>e===a)));var a;return s>-1&&(i.splice(s,1),delete r[e],delete n[e]),c(),!0},removeAll:()=>(i.splice(0),r={},n={},c(),!0),pack:(e,s)=>{let n=r[e]||(!t&&globalThis.CSSStyleSheet?new globalThis.CSSStyleSheet:new fe);return n.replaceSync(s),n=l(e,n),!!n.cssRules.length&&h(e,n)},register:e=>{a.findIndex((t=>t.deref()===e))>=0||(a.push(new WeakRef(e)),o(e))},unregister:e=>{const t=a.findIndex((t=>t.deref()===e));t>=0&&a.splice(t,1)},hydrate:e=>s[e]&&!s[e].disabled&&s[e].textContent||void 0}}const ye=({prefix:e})=>{let t=0;return{get initial(){return e+0},get current(){return e+t},next(){return t++,this.current}}},ve=({prefix:e})=>{const t=new Set,s=new Map,r=ye({prefix:e});return{use(e){let n=this.key(e);return n||(n=r.current,t.add(n),s.set(e,n),r.next(),n)},remake(e,t){const r=s.get(t);return r?(s.delete(t),s.set(e,r),r):this.use(e)},key:e=>e?s.get(e)||"":r.initial,get keys(){return[...t]},get makers(){return Object.fromEntries(s.entries().map((([e,t])=>[t,e])))}}},je=void 0,Oe=Object.entries,xe=Object.defineProperties,we=e=>"string"==typeof e,ke=e=>null!==e&&"object"==typeof e,Se=e=>e.split("."),_e=(e,t)=>Oe(e).reduce(((e,[s,r])=>{if(ke(r)){const n=Oe(r);n.length?e.push(...n.reduce(((e,[r,n])=>{if((e=>null!==e&&e!==je)(r)&&t&&e.push([s,r,je,je]),ke(n)){const t=Oe(n);t.length&&e.push(...t.reduce(((e,[t,n])=>{const i=typeof n;return"string"!==i&&"number"!==i||e.push([s,r,t,n]),e}),[]))}return e}),[])):e.push([s,je,je,je])}return e}),[]),ze=(e,t,s,r)=>""+(((e,t)=>`${e||""}${t?"__"+t:""}`)(e,t)+(s?"_"+s:"")+(s&&r?"_"+r:""))||"_",Ae=(e,t)=>"."+(t?e+(t.startsWith("_")?"":"-")+t:e),Pe=(e,t)=>`[data-${e}${t?`~="${t}"`:""}]`;const qe=e=>e||"",Ce=Object.assign,Ee=Object.entries,Ne="theme",Te=e=>Number((.1*184+.9*e).toFixed(2)),Me={time:200,size:16,angle:30,coef:{0:0,1:.0625,2:.125,3:.25,4:.5,5:.75,6:.875,7:.9375,8:1,9:1.0625,10:1.125,11:1.25,12:1.5,13:1.75,14:1.875,15:1.9375,16:2,17:2.5,18:4,19:5,20:7.5,21:10,22:12,23:15,24:16,25:20,26:28,27:36,28:48,29:64,30:80,31:120,32:150},hue:{pri:184,sec:290,suc:Te(142),inf:Te(264),war:Te(109),dan:Te(29)},$light:{lightness:{bg:{xl:.98,l:.93,m:.88,s:.83,xs:.78},fg:{xl:0,l:.12,m:.24,s:.36,xs:.48}},chroma:{bg:{gray:0,pale:.01,base:.04,rich:.7},fg:{gray:0,pale:.07,base:.11,rich:.15}}},$dark:{lightness:{bg:{xl:.24,l:.3,m:.36,s:.42,xs:.48},fg:{xl:.98,l:.93,m:.86,s:.79,xs:.72}},chroma:{bg:{pale:.02,base:.06,rich:.1},fg:{pale:.06,base:.1,rich:.14}}}},Be=({provider:t,init:s,scope:r,onChange:n})=>{const i={"":Me},a=[],l={get:(e="")=>i[e],add(e,t){i[t]||(i[t]=de({$light:{},$dark:{}},e),a.push({type:"add",payload:{params:e,name:t}}),null==n||n())},delete(e){i[e]&&""!==e&&(this.current===e&&this.switch(),delete i[e],a.push({type:"delete",payload:{name:e}}),null==n||n())},update(e,t=""){i[t]&&(i[t]=de({$light:{},$dark:{}},i[t],e),a.push({type:"update",payload:{params:e,name:t}}),null==n||n())},switch(e=""){i[e]&&t.setAttribute(Ne,e)},vars(t=""){const s=this.get(t);return s?(t=>{var{$light:s={},$dark:n={}}=t,i=e(t,["$light","$dark"]);function a(e,t=[]){return Ee(e).reduce(((e,[s,n])=>n&&"object"==typeof n?Ce(e,a(n,[...t,s])):(e[r.varName([...t,s])]=n,e)),{})}return Object.assign(Object.assign({},a(i)),{$light:a(s),$dark:a(n)})})(s):{$light:{},$dark:{}}},get list(){const t=e(i,[""]);return Object.keys(t)},get current(){return t.getAttribute(Ne)||""},get all(){return i},get actions(){return a}};return null==s||s.forEach((({type:e,payload:t})=>{switch(e){case"add":l.add(t.params,t.name);break;case"delete":l.delete(t.name);break;case"update":l.update(t.params,t.name)}})),l},We="effcss",Re=We+"-provider",Ie="script",Ve="style",De="size",Je="time",Ke="angle",Le=We+"changes",Fe="data-"+We,He="prefers-color-scheme",Ze=`${He}: light`,Ge=`${He}: dark`,Qe={mode:"a",pre:"f"},Ue=e=>"boolean"==typeof e,Xe=(e,t)=>{const s=((e,t)=>e.getAttribute(t)||Qe[t])(e,t);return(e=>"string"==typeof e?Number(e):null)(s)},Ye=(e,t,s)=>null===s?e.removeAttribute(t):e.setAttribute(t,s+""),et=e=>`:root:has([is=${Re}]${e?`[${e}]`:""})`,tt=({theme:t,attrs:s,scope:r})=>({bem:n,each:i,themeVar:a,merge:l,pseudo:{r:o},at:{media:c},units:{px:u}})=>{const h=s.size,g=s.time,m=s.angle,d=t.vars(),{$dark:p={},$light:b={}}=d,f=e(d,["$dark","$light"]);return l({[et()]:Object.assign(Object.assign(Object.assign(Object.assign({},f),c.where(Ze)(b)),c.where(Ge)(p)),{[o()]:{fontSize:u(a("size"))}})},i(t.list,((s,r)=>{const i=t.vars(r),{$dark:a={},$light:l={}}=i,o=e(i,["$dark","$light"]),u=Object.assign(Object.assign(Object.assign({},o),c.where(Ze)(l)),c.where(Ge)(a));return{[et(`theme=${s}`)]:u,[n(`..theme.${s}`)]:u}})),h&&{[et(De)]:{[r.varName("size")]:h}},g&&{[et(Je)]:{[r.varName("time")]:g}},m&&{[et(Ke)]:{[r.varName("angle")]:m}})},st=(e,{initStyles:t,emulate:s,onChange:r,globalMaker:n,noscript:i})=>{let a;e.textContent&&(a=JSON.parse(e.textContent)),Object.defineProperties(e,{pre:{get:()=>e.getAttribute("pre")||"f"},mode:{get:()=>e.getAttribute("mode")||"a"},min:{get:()=>""===e.getAttribute("min")},size:{set(t){Ye(e,De,t)},get:()=>Xe(e,De)},time:{set(t){Ye(e,Je,t)},get:()=>Xe(e,Je)},angle:{set(t){Ye(e,Ke,t)},get:()=>Xe(e,Ke)}});const l=ve({prefix:e.pre}),o=((e={})=>{const{mode:t,min:s,dict:r={}}=e;let n;n="a"===t?Pe:Ae;const i=e=>{let s=0,r=qe,a=qe;const l=i.dict;l&&(l[e]||(l[e]={}),r=t=>{var r;return null!==(r=l[e][t])&&void 0!==r?r:l[e][t]=(s++).toString(36)},a=t=>l[e][t]);let o=t=>[e,...we(t)?t.split("."):t].filter(Boolean).join("-"),c="class",u=t=>t?e+(t.startsWith("_")?"":"-")+t:void 0===t?void 0:e;"a"===t&&(c="data-"+e,u=qe);const h=e=>"--"+o(we(e)?e.split("."):e),g=e=>{if(void 0===e)return function(e){const t=({b:s,e:r,m:n})=>({b:e=>t({b:e,e:"",m:{}}),e:e=>t({b:s,e:e,m:{}}),m:(e={})=>t({b:s,e:r,m:e}),get $(){return e({[s]:{[r]:n}})}});return t({b:"",e:"",m:{}})}(g);let t,s,r,n,i="";const l=we(e);return i=l||Array.isArray(e)?[...(l?[e]:e).reduce(((e,i)=>([t,s,r,n]=Se(i),e.add(u(a(ze(t,s)))),r&&e.add(u(a(ze(t,s,r,n)))),e)),new Set).values()].join(" "):e&&_e(e,!0).map((([e,t,s,r])=>u(a(ze(e,t,s,r))))).join(" "),xe({[c]:i},{toString:{value:()=>`${c}="${i}"`},$:{value:i}})};return{selector:t=>{const[s,i,a,l]=Se(t);return n(e,r(ze(s,i,a,l)))},attr:g,name:o,varName:h,varExp:(e,t)=>`var(${h(e)}${void 0!==t?","+t:""})`}};return s&&(i.dict=r),i})({mode:e.mode,min:e.min,dict:null==a?void 0:a.dict}),c=o(l.key()),u=pe({scope:o,globalKey:l.key()}),h=$e({initStyles:t,emulate:s});e.theme=Be({provider:e,init:null==a?void 0:a.theme,onChange:r,scope:c});const g=(({scope:e,collector:t,manager:s,processor:r,globalMaker:n})=>{const i=e=>"string"==typeof e?e:t.key(e),a=s=>e(s||t.key()).attr,l=(e,t)=>r.compile({key:t,maker:e}),o=e=>{let r=t.use(e);return s&&!s.get(r)&&s.pack(r,s.hydrate(r)||l(e,r)),a(r)},c=(...e)=>0===e.length?[o(n)]:e.map((e=>o(e)));return{use:c,remake:(e,r)=>{let n=t.key(r||e);return s&&s.get(n)?(r&&t.remake(e,r),s.pack(n,s.hydrate(n)||l(e,n)),a(n)):c(e)[0]},css:l,status:e=>{const t=i(e);return!!t&&s.status(t)},on:(...e)=>s.on(...e.map(i)),off:(...e)=>s.off(...e.map(i)),stylesheets:(e=t.keys)=>e.map((e=>s.get(i(e))))}})({scope:o,processor:u,manager:h,collector:l,globalMaker:n});Object.defineProperties(e,{_c:{value:l},_s:{value:o},_p:{value:u},_m:{value:h},toString:{value:()=>{const t=Object.assign({},h.all()),s=Object.entries(t).filter((([e,t])=>!t.disabled)).map((([e,t])=>`<style ${Fe}="${e}">${[...t.cssRules].map((e=>e.cssText)).join("")}</style>`)).join("");let r=Ve,n="";const a={is:Re,min:e.getAttribute("min"),mode:e.getAttribute("mode"),size:e.getAttribute("size"),time:e.getAttribute("time"),angle:e.getAttribute("angle")};if(!i){r=Ie,a.type="application/json";const t={theme:e.theme.actions};e.min&&l.keys.length>1&&(t.dict=o.dict),n=JSON.stringify(t)}return s+`<${r} ${Object.entries(a).map((([e,t])=>null!=t&&t!==Qe[e]?""===t?e:`${e}="${t}"`:"")).filter(Boolean).join(" ")}${e.theme.current?` theme="${e.theme.current}"`:""}>${n}</${r}>`}}}),Object.assign(e,g)};const rt=(e={})=>{let{noscript:t,attrs:s={}}=e,{mode:r=Qe.mode,min:n,pre:i=Qe.prefix,size:a=null,time:l=null,angle:o=null}=s;return new class{get tagName(){return""}get textContent(){return""}getAttribute(e){const t=this.attributes[e];return null!=t?Ue(t)?"":t+"":null}setAttribute(e,t){this.attributes[e]=t+"",e!==De&&e!==Je&&e!==Ke||this._customize()}removeAttribute(e){delete this.attributes[e]}get makers(){return this._c.makers}constructor(){this.attributes={size:a?a+"":null,time:l?l+"":null,angle:o?o+"":null,pre:i,mode:r,min:n?"":null},this._customize=()=>{const e=this.size,t=this.time,s=this.angle,r=tt({theme:this.theme,attrs:{size:e,time:t,angle:s},scope:this._s(this._c.key())});this.remake(r,this._),this._=r},st(this,{emulate:!0,onChange:this._customize,globalMaker:this._,noscript:t}),this._customize()}}},nt=(t={})=>{const{emulate:s}=t,r=e(t,["emulate"]),n=null===globalThis||void 0===globalThis?void 0:globalThis.document;if(n&&!s){void 0===nt.isDefined&&(nt.isDefined=function(){const e=globalThis.document,t=globalThis.customElements;if(null==t?void 0:t.get(Re))return!1;{class s extends HTMLScriptElement{constructor(){super(...arguments),this._customize=()=>{const e=this.size,t=this.time,s=this.angle,r=tt({theme:this.theme,attrs:{size:e,time:t,angle:s},scope:this._s(this._c.key())});this.remake(r,this._),this._=r}}static get observedAttributes(){return[De,Je,Ke]}get makers(){return this._c.makers}attributeChangedCallback(){this.isConnected&&this._customize()}connectedCallback(){st(this,{initStyles:[...e.querySelectorAll(Ve+`[${Fe}]`)],onChange:this._customize,globalMaker:this._}),this._customize();const t=this;this._n={set adoptedStyleSheets(e){t.dispatchEvent(new CustomEvent(Le,{detail:{styles:e},bubbles:!0}))}},this._m.register(this._n),this._m.register(e)}}return t.define(Re,s,{extends:Ie}),!0}}());const e=n.querySelector(`[is=${Re}]`);if(e)return e;const t=n.createElement(Ie,{is:Re});t.setAttribute("is",Re);const s=null==r?void 0:r.attrs;return s&&Object.entries(s).map((([e,s])=>s&&Qe[e]!==s&&t.setAttribute(e,Ue(s)?"":s+""))),n.head.appendChild(t),t}return rt(r)};export{Qe as DEFAULT_ATTRS,Re as TAG_NAME,nt as useStyleProvider};
|
|
@@ -0,0 +1,222 @@
|
|
|
1
|
+
import type { TCreateScope } from '../scope';
|
|
2
|
+
type TProperty = {
|
|
3
|
+
(val: string | number | boolean): object;
|
|
4
|
+
/**
|
|
5
|
+
* Use property with fallback value
|
|
6
|
+
*/
|
|
7
|
+
fallback(val: string | number): string;
|
|
8
|
+
};
|
|
9
|
+
type TKeyframes = {
|
|
10
|
+
(config?: Partial<{
|
|
11
|
+
/**
|
|
12
|
+
* Duration
|
|
13
|
+
*/
|
|
14
|
+
dur: string;
|
|
15
|
+
/**
|
|
16
|
+
* Delay
|
|
17
|
+
*/
|
|
18
|
+
del: string;
|
|
19
|
+
/**
|
|
20
|
+
* Iteration-count
|
|
21
|
+
*/
|
|
22
|
+
ic: string;
|
|
23
|
+
/**
|
|
24
|
+
* Direction
|
|
25
|
+
*/
|
|
26
|
+
dir: string;
|
|
27
|
+
/**
|
|
28
|
+
* Timing-function
|
|
29
|
+
*/
|
|
30
|
+
tf: string;
|
|
31
|
+
/**
|
|
32
|
+
* Play-state
|
|
33
|
+
*/
|
|
34
|
+
ps: string;
|
|
35
|
+
/**
|
|
36
|
+
* Fill-mode
|
|
37
|
+
*/
|
|
38
|
+
fm: string;
|
|
39
|
+
}>): object;
|
|
40
|
+
};
|
|
41
|
+
type TScope = {
|
|
42
|
+
(val: object): object;
|
|
43
|
+
/**
|
|
44
|
+
* High bound
|
|
45
|
+
*/
|
|
46
|
+
limit: (val: string) => TScope;
|
|
47
|
+
/**
|
|
48
|
+
* Low bound
|
|
49
|
+
*/
|
|
50
|
+
root: (val: string) => TScope;
|
|
51
|
+
/**
|
|
52
|
+
* Both bounds inclusive
|
|
53
|
+
*/
|
|
54
|
+
both: () => TScope;
|
|
55
|
+
/**
|
|
56
|
+
* None bounds inclusive
|
|
57
|
+
*/
|
|
58
|
+
none: () => TScope;
|
|
59
|
+
/**
|
|
60
|
+
* High bound inclusive
|
|
61
|
+
*/
|
|
62
|
+
high: () => TScope;
|
|
63
|
+
/**
|
|
64
|
+
* Low bound inclusive
|
|
65
|
+
*/
|
|
66
|
+
low: () => TScope;
|
|
67
|
+
};
|
|
68
|
+
type TSupports = {
|
|
69
|
+
(rules: object): object;
|
|
70
|
+
/**
|
|
71
|
+
* Supports condition
|
|
72
|
+
*/
|
|
73
|
+
where: (condition: string | object) => TSupports;
|
|
74
|
+
};
|
|
75
|
+
type TMedia = {
|
|
76
|
+
(val: object): object;
|
|
77
|
+
/**
|
|
78
|
+
* `screen` media type
|
|
79
|
+
*/
|
|
80
|
+
screen: TMedia;
|
|
81
|
+
/**
|
|
82
|
+
* `all` media type
|
|
83
|
+
*/
|
|
84
|
+
all: TMedia;
|
|
85
|
+
/**
|
|
86
|
+
* `print` media type
|
|
87
|
+
*/
|
|
88
|
+
print: TMedia;
|
|
89
|
+
/**
|
|
90
|
+
* Media condition
|
|
91
|
+
*/
|
|
92
|
+
where: (condition: string | object) => TMedia;
|
|
93
|
+
};
|
|
94
|
+
type TContainer = {
|
|
95
|
+
(val: object): object;
|
|
96
|
+
/**
|
|
97
|
+
* Get named container
|
|
98
|
+
*/
|
|
99
|
+
named: TContainer;
|
|
100
|
+
/**
|
|
101
|
+
* `inline-size` container type
|
|
102
|
+
*/
|
|
103
|
+
isize: TContainer;
|
|
104
|
+
/**
|
|
105
|
+
* `size` container type
|
|
106
|
+
*/
|
|
107
|
+
size: TContainer;
|
|
108
|
+
/**
|
|
109
|
+
* `scroll-state` container type
|
|
110
|
+
*/
|
|
111
|
+
scroll: TContainer;
|
|
112
|
+
/**
|
|
113
|
+
* Container condition
|
|
114
|
+
*/
|
|
115
|
+
where: (condition: string | object) => TContainer;
|
|
116
|
+
};
|
|
117
|
+
type TLayer = {
|
|
118
|
+
(val: object): object;
|
|
119
|
+
/**
|
|
120
|
+
* Get named layer
|
|
121
|
+
*/
|
|
122
|
+
named: TLayer;
|
|
123
|
+
/**
|
|
124
|
+
* Declare layers order
|
|
125
|
+
* @param args
|
|
126
|
+
*/
|
|
127
|
+
list(...args: TLayer[]): object;
|
|
128
|
+
};
|
|
129
|
+
type TCondition = {
|
|
130
|
+
type: 'and' | 'or' | 'not';
|
|
131
|
+
value: (TCondition | string)[];
|
|
132
|
+
};
|
|
133
|
+
export declare const resolveAtRules: (ctx: ReturnType<ReturnType<TCreateScope>>) => {
|
|
134
|
+
/**
|
|
135
|
+
* `@layer` rule maker
|
|
136
|
+
* @param rules - nested rules
|
|
137
|
+
*/
|
|
138
|
+
layer: TLayer;
|
|
139
|
+
/**
|
|
140
|
+
* `@supports` rule maker
|
|
141
|
+
* @param rules - nested rules
|
|
142
|
+
*/
|
|
143
|
+
supports: TSupports;
|
|
144
|
+
/**
|
|
145
|
+
* Scoped `@keyframes` rule maker
|
|
146
|
+
* @param config - keyframes
|
|
147
|
+
*/
|
|
148
|
+
keyframes: (config: Record<string, object>) => TKeyframes;
|
|
149
|
+
/**
|
|
150
|
+
* Scoped `@property` rule maker
|
|
151
|
+
* @param config - property params
|
|
152
|
+
*/
|
|
153
|
+
property: (config?: {
|
|
154
|
+
/**
|
|
155
|
+
* Syntax
|
|
156
|
+
*/
|
|
157
|
+
syn?: string;
|
|
158
|
+
/**
|
|
159
|
+
* Inherits
|
|
160
|
+
*/
|
|
161
|
+
inh?: boolean;
|
|
162
|
+
/**
|
|
163
|
+
* Initial value
|
|
164
|
+
*/
|
|
165
|
+
ini?: string | number | boolean;
|
|
166
|
+
/**
|
|
167
|
+
* Default value
|
|
168
|
+
*/
|
|
169
|
+
def?: string | number | boolean;
|
|
170
|
+
}) => TProperty;
|
|
171
|
+
/**
|
|
172
|
+
* `@scope` rule maker
|
|
173
|
+
* @param rules - nested rules
|
|
174
|
+
*/
|
|
175
|
+
scope: TScope;
|
|
176
|
+
/**
|
|
177
|
+
* `@media` rule maker
|
|
178
|
+
* @param rules - nested rules
|
|
179
|
+
*/
|
|
180
|
+
media: TMedia;
|
|
181
|
+
/**
|
|
182
|
+
* `@container` rule maker
|
|
183
|
+
* @param rules - nested rules
|
|
184
|
+
*/
|
|
185
|
+
container: TContainer;
|
|
186
|
+
/**
|
|
187
|
+
* `@starting-style` rule maker
|
|
188
|
+
* @param rules - nested rules
|
|
189
|
+
*/
|
|
190
|
+
startingStyle: {
|
|
191
|
+
(rules: object): {
|
|
192
|
+
"@starting-style": object;
|
|
193
|
+
};
|
|
194
|
+
toString: string;
|
|
195
|
+
};
|
|
196
|
+
/**
|
|
197
|
+
* Complex logic condition maker
|
|
198
|
+
*/
|
|
199
|
+
$logic: {
|
|
200
|
+
and: (...value: (string | TCondition)[]) => TCondition;
|
|
201
|
+
or: (...value: (string | TCondition)[]) => TCondition;
|
|
202
|
+
not: (value: string | TCondition) => TCondition | string;
|
|
203
|
+
};
|
|
204
|
+
/**
|
|
205
|
+
* Width condition maker
|
|
206
|
+
*/
|
|
207
|
+
$width: {
|
|
208
|
+
up: (val: string | number) => {
|
|
209
|
+
toString: () => string;
|
|
210
|
+
};
|
|
211
|
+
down: (val: string | number) => {
|
|
212
|
+
toString: () => string;
|
|
213
|
+
};
|
|
214
|
+
between: (from: string | number, to: string | number) => {
|
|
215
|
+
toString: () => string;
|
|
216
|
+
};
|
|
217
|
+
only: (val: string | number) => {
|
|
218
|
+
toString: () => string;
|
|
219
|
+
};
|
|
220
|
+
};
|
|
221
|
+
};
|
|
222
|
+
export {};
|
|
@@ -0,0 +1,131 @@
|
|
|
1
|
+
import type { TCreateScope } from '../scope';
|
|
2
|
+
export type TShortRange = 's' | 'm' | 'l';
|
|
3
|
+
export type TMainRange = 'min' | 'm' | 'max';
|
|
4
|
+
export type TBaseRange = 'xs' | TShortRange | 'xl';
|
|
5
|
+
export type TLongRange = 'xxs' | TBaseRange | 'xxl';
|
|
6
|
+
export type TFullRange = 'min' | TLongRange | 'max';
|
|
7
|
+
export type TSparseRange = 'min' | 'xs' | 'm' | 'xl' | 'max';
|
|
8
|
+
export type TRangeConfig = Record<'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxl', number>;
|
|
9
|
+
export type TCoefConfig = {
|
|
10
|
+
$0_: TRangeConfig;
|
|
11
|
+
$1_: TRangeConfig;
|
|
12
|
+
$2_: TRangeConfig;
|
|
13
|
+
$16_: TRangeConfig;
|
|
14
|
+
max: number;
|
|
15
|
+
};
|
|
16
|
+
/**
|
|
17
|
+
* Coefficient generator
|
|
18
|
+
* @description
|
|
19
|
+
* Allows to create coefficient ranges
|
|
20
|
+
*/
|
|
21
|
+
export interface ICoef {
|
|
22
|
+
/**
|
|
23
|
+
* Coefficient state
|
|
24
|
+
*/
|
|
25
|
+
state: {
|
|
26
|
+
center: number;
|
|
27
|
+
};
|
|
28
|
+
/**
|
|
29
|
+
* Returns `xxs` coefficient
|
|
30
|
+
*/
|
|
31
|
+
get min(): string;
|
|
32
|
+
/**
|
|
33
|
+
* Returns `xxs` coefficient
|
|
34
|
+
*/
|
|
35
|
+
get xxs(): string;
|
|
36
|
+
/**
|
|
37
|
+
* Returns `xs` coefficient
|
|
38
|
+
*/
|
|
39
|
+
get xs(): string;
|
|
40
|
+
/**
|
|
41
|
+
* Returns `s` coefficient
|
|
42
|
+
*/
|
|
43
|
+
get s(): string;
|
|
44
|
+
/**
|
|
45
|
+
* Returns `m` coefficient
|
|
46
|
+
*/
|
|
47
|
+
get m(): string;
|
|
48
|
+
/**
|
|
49
|
+
* Returns `l` coefficient
|
|
50
|
+
*/
|
|
51
|
+
get l(): string;
|
|
52
|
+
/**
|
|
53
|
+
* Returns `xl` coefficient
|
|
54
|
+
*/
|
|
55
|
+
get xl(): string;
|
|
56
|
+
/**
|
|
57
|
+
* Returns `xxl` coefficient
|
|
58
|
+
*/
|
|
59
|
+
get xxl(): string;
|
|
60
|
+
/**
|
|
61
|
+
* Returns `xxl` coefficient
|
|
62
|
+
*/
|
|
63
|
+
get max(): string;
|
|
64
|
+
/**
|
|
65
|
+
* Extremly small range center
|
|
66
|
+
* @description
|
|
67
|
+
* Around 4 coef
|
|
68
|
+
*/
|
|
69
|
+
get $xxs(): ICoef;
|
|
70
|
+
/**
|
|
71
|
+
* Very small range center
|
|
72
|
+
* @description
|
|
73
|
+
* Around 8 coef
|
|
74
|
+
*/
|
|
75
|
+
get $xs(): ICoef;
|
|
76
|
+
/**
|
|
77
|
+
* Small range center
|
|
78
|
+
* @description
|
|
79
|
+
* Around 12 coef
|
|
80
|
+
*/
|
|
81
|
+
get $s(): ICoef;
|
|
82
|
+
/**
|
|
83
|
+
* Medium range center
|
|
84
|
+
* @description
|
|
85
|
+
* Around 16 coef
|
|
86
|
+
*/
|
|
87
|
+
get $m(): ICoef;
|
|
88
|
+
/**
|
|
89
|
+
* Large range center
|
|
90
|
+
* @description
|
|
91
|
+
* Around 20 coef
|
|
92
|
+
*/
|
|
93
|
+
get $l(): ICoef;
|
|
94
|
+
/**
|
|
95
|
+
* Very large range center
|
|
96
|
+
* @description
|
|
97
|
+
* Around 24 coef
|
|
98
|
+
*/
|
|
99
|
+
get $xl(): ICoef;
|
|
100
|
+
/**
|
|
101
|
+
* Extremly large range center
|
|
102
|
+
* @description
|
|
103
|
+
* Around 28 coef
|
|
104
|
+
*/
|
|
105
|
+
get $xxl(): ICoef;
|
|
106
|
+
/**
|
|
107
|
+
* Short range dictionary
|
|
108
|
+
*/
|
|
109
|
+
get short(): Record<TShortRange, string>;
|
|
110
|
+
/**
|
|
111
|
+
* Base range dictionary
|
|
112
|
+
*/
|
|
113
|
+
get base(): Record<TBaseRange, string>;
|
|
114
|
+
/**
|
|
115
|
+
* Long range dictionary
|
|
116
|
+
*/
|
|
117
|
+
get long(): Record<TLongRange, string>;
|
|
118
|
+
/**
|
|
119
|
+
* Full range dictionary
|
|
120
|
+
*/
|
|
121
|
+
get full(): Record<TFullRange, string>;
|
|
122
|
+
/**
|
|
123
|
+
* Main range dictionary
|
|
124
|
+
*/
|
|
125
|
+
get main(): Record<TMainRange, string>;
|
|
126
|
+
/**
|
|
127
|
+
* Sparse range dictionary
|
|
128
|
+
*/
|
|
129
|
+
get sparse(): Record<TSparseRange, string>;
|
|
130
|
+
}
|
|
131
|
+
export declare const resolveCoef: (varExp: ReturnType<ReturnType<TCreateScope>>["varExp"]) => ICoef;
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
type TChangeStr = (val: string) => string;
|
|
2
|
+
type TChangeColor = (color: string | object, val?: number | string) => string;
|
|
3
|
+
export declare const resolveColor: () => {
|
|
4
|
+
/**
|
|
5
|
+
* oklch()
|
|
6
|
+
*/
|
|
7
|
+
oklch: TChangeStr;
|
|
8
|
+
/**
|
|
9
|
+
* Increase color lightness
|
|
10
|
+
*/
|
|
11
|
+
lighten: TChangeColor;
|
|
12
|
+
/**
|
|
13
|
+
* Decrease color lightness
|
|
14
|
+
*/
|
|
15
|
+
darken: TChangeColor;
|
|
16
|
+
/**
|
|
17
|
+
* Increase color chroma
|
|
18
|
+
*/
|
|
19
|
+
saturate: TChangeColor;
|
|
20
|
+
/**
|
|
21
|
+
* Decrease color chroma
|
|
22
|
+
*/
|
|
23
|
+
desaturate: TChangeColor;
|
|
24
|
+
/**
|
|
25
|
+
* Increase color alpha
|
|
26
|
+
*/
|
|
27
|
+
fadein: TChangeColor;
|
|
28
|
+
/**
|
|
29
|
+
* Decrease color alpha
|
|
30
|
+
*/
|
|
31
|
+
fadeout: TChangeColor;
|
|
32
|
+
/**
|
|
33
|
+
* Rotate color hue
|
|
34
|
+
*/
|
|
35
|
+
spin: TChangeColor;
|
|
36
|
+
};
|
|
37
|
+
export {};
|
|
@@ -0,0 +1,105 @@
|
|
|
1
|
+
import type { TCreateScope } from '../../_provider/scope';
|
|
2
|
+
type THue = 'pri' | 'sec' | 'suc' | 'inf' | 'war' | 'dan';
|
|
3
|
+
type TLightness = 'xs' | 's' | 'm' | 'l' | 'xl';
|
|
4
|
+
type TChroma = 'gray' | 'pale' | 'base' | 'rich';
|
|
5
|
+
type TMode = 'bg' | 'fg';
|
|
6
|
+
/**
|
|
7
|
+
* Palette generator
|
|
8
|
+
* @description
|
|
9
|
+
* Allows to create palette colors
|
|
10
|
+
*/
|
|
11
|
+
export interface IPalette {
|
|
12
|
+
state: {
|
|
13
|
+
l: TLightness;
|
|
14
|
+
c: TChroma;
|
|
15
|
+
h: THue;
|
|
16
|
+
a: number;
|
|
17
|
+
m: TMode;
|
|
18
|
+
};
|
|
19
|
+
/**
|
|
20
|
+
* Returns `xs` lightness color
|
|
21
|
+
*/
|
|
22
|
+
get xs(): IPalette;
|
|
23
|
+
/**
|
|
24
|
+
* Returns `s` lightness color
|
|
25
|
+
*/
|
|
26
|
+
get s(): IPalette;
|
|
27
|
+
/**
|
|
28
|
+
* Returns `m` lightness color
|
|
29
|
+
*/
|
|
30
|
+
get m(): IPalette;
|
|
31
|
+
/**
|
|
32
|
+
* Returns `l` lightness color
|
|
33
|
+
*/
|
|
34
|
+
get l(): IPalette;
|
|
35
|
+
/**
|
|
36
|
+
* Returns `xl` lightness color
|
|
37
|
+
*/
|
|
38
|
+
get xl(): IPalette;
|
|
39
|
+
/**
|
|
40
|
+
* Returns lightness color dictionary
|
|
41
|
+
*/
|
|
42
|
+
get lightness(): Record<TLightness, IPalette>;
|
|
43
|
+
/**
|
|
44
|
+
* Returns zero chroma color
|
|
45
|
+
*/
|
|
46
|
+
get gray(): IPalette;
|
|
47
|
+
/**
|
|
48
|
+
* Returns pale chroma color
|
|
49
|
+
*/
|
|
50
|
+
get pale(): IPalette;
|
|
51
|
+
/**
|
|
52
|
+
* Returns base chroma color
|
|
53
|
+
*/
|
|
54
|
+
get base(): IPalette;
|
|
55
|
+
/**
|
|
56
|
+
* Returns rich chroma color
|
|
57
|
+
*/
|
|
58
|
+
get rich(): IPalette;
|
|
59
|
+
/**
|
|
60
|
+
* Returns chroma color dictionary
|
|
61
|
+
*/
|
|
62
|
+
get chroma(): Record<TChroma, IPalette>;
|
|
63
|
+
/**
|
|
64
|
+
* Returns primary hue color
|
|
65
|
+
*/
|
|
66
|
+
get pri(): IPalette;
|
|
67
|
+
/**
|
|
68
|
+
* Returns secondary hue color
|
|
69
|
+
*/
|
|
70
|
+
get sec(): IPalette;
|
|
71
|
+
/**
|
|
72
|
+
* Returns success hue color
|
|
73
|
+
*/
|
|
74
|
+
get suc(): IPalette;
|
|
75
|
+
/**
|
|
76
|
+
* Returns info hue color
|
|
77
|
+
*/
|
|
78
|
+
get inf(): IPalette;
|
|
79
|
+
/**
|
|
80
|
+
* Returns warning hue color
|
|
81
|
+
*/
|
|
82
|
+
get war(): IPalette;
|
|
83
|
+
/**
|
|
84
|
+
* Returns danger hue color
|
|
85
|
+
*/
|
|
86
|
+
get dan(): IPalette;
|
|
87
|
+
/**
|
|
88
|
+
* Returns hue color dictionary
|
|
89
|
+
*/
|
|
90
|
+
get hue(): Record<THue, IPalette>;
|
|
91
|
+
/**
|
|
92
|
+
* Returns specified alpha color
|
|
93
|
+
*/
|
|
94
|
+
alpha(a?: number): IPalette;
|
|
95
|
+
/**
|
|
96
|
+
* Returns background color
|
|
97
|
+
*/
|
|
98
|
+
get bg(): IPalette;
|
|
99
|
+
/**
|
|
100
|
+
* Returns foreground color
|
|
101
|
+
*/
|
|
102
|
+
get fg(): IPalette;
|
|
103
|
+
}
|
|
104
|
+
export declare const resolvePalette: (varExp: ReturnType<ReturnType<TCreateScope>>["varExp"]) => IPalette;
|
|
105
|
+
export {};
|