effcss 4.5.1 → 4.6.0

package/README.md

@@ -23,7 +23,7 @@ EffCSS is a self-confident CSS-in-JS library based only on the browser APIs. Use
 -   zero-dependency,
 -   framework agnostic,
 -   selectors isolation and minification out of the box,
--   BEM based stylesheet types,
+-   flexible stylesheets types that can suggest available selectors (BEM and Atomic CSS compatible),
 -   compatible with any rendering (CSR, SSR, SSG).
 
 ## Links
@@ -98,28 +98,27 @@ Each CSS stylesheet corresponds to a single `Stylesheet maker`. `Stylesheet make
 import { useRef } from 'react';
 import { IStyleProvider, TStyleSheetMaker } from 'effcss';
 
-// you can describe your styles using BEM notation
+// you can describe your styles
 // so that other people can use them via TypeScript generics
 export type TCardMaker = {
     /**
-     * Card block
+     * Font-size utility
+     */
+    fsz: 16 | 20 | 24;
+    /**
+     * Card scope
      */
     card: {
         /**
-         * Card modifiers
+         * Card border radius
          */
-        '': {
-            /**
-             * Card border radius
-             */
-            rounded: '';
-            /**
-             * Card height
-             */
-            h: 'full' | 'half';
-        };
+        rounded: '';
+        /**
+         * Card height
+         */
+        h: 'full' | 'half';
         /**
-         * Card logo
+         * Card logo scope
          */
         logo: {
             /**
@@ -128,7 +127,7 @@ export type TCardMaker = {
             w: 's' | 'l';
         },
         /**
-         * Card footer
+         * Card footer scope
          */
         footer: {
             /**
@@ -143,9 +142,9 @@ export type TCardMaker = {
     };
 }
 
-const myStyleSheetMaker: TStyleSheetMaker = ({ bem, pseudo, at: { keyframes }, merge, palette, coef, size, units: {px} }) = {
+const myStyleSheetMaker: TStyleSheetMaker = ({ select, pseudo, at: { keyframes, property }, merge, palette, coef, size, units: {px} }) = {
     // specify selector variants via generic
-    const selector = bem<TCardMaker>;
+    const selector = select<TCardMaker>;
     // create property with unique identifier
     const widthProperty = property({
         ini: px(200),
@@ -179,18 +178,19 @@ const myStyleSheetMaker: TStyleSheetMaker = ({ bem, pseudo, at: { keyframes }, m
     return {
         ...sizeProperty,
         ...spin,
+        [selector('fsz:16')]: { ... },
         [selector('card')]: { ... },
         [selector('card.logo')]: cardLogoStyles,
-        [selector('card.logo.w.s')]: {
+        [selector('card.logo.w:s')]: {
             ...widthProperty(px(100))
         },
-        [selector('card.logo.w.l')]: widthProperty(px(300)),
-        [selector('card..rounded')]: { ... },
-        [selector('card..h.full')]: { ... },
+        [selector('card.logo.w:l')]: widthProperty(px(300)),
+        [selector('card.rounded:')]: { ... },
+        [selector('card.h:full')]: { ... },
         [selector('card.footer')]: { ... },
-        [selector('card.footer.visible')]: { ... },
+        [selector('card.footer.visible:')]: { ... },
         ...each(coef.short, (k, v) => ({
-            [selector(`card.footer.sz.${k}`)]: {
+            [selector(`card.footer.sz:${k}`)]: {
                 height: size(v)
             }
         }))
@@ -203,13 +203,14 @@ export const App = (props: {
     const { css } = props;
     const stylesRef = useRef();
     if (!stylesRef.current) {
-        const [card] = css.use(myStyleSheetMaker)<TCardMaker>;
+        const [card] = css.use(myStyleSheetMaker);
         // thanks to the TCardMaker type,
         // you don't need to look at the implementation - just create the necessary attributes
         stylesRef.current = {
-            card: card('card..rounded'),
-            // element with modifiers
-            footer: card({
+            // apply list of selectors
+            card: card.list<TCardMaker>('card.rounded:', 'fsz:24'),
+            // apply object with selectors
+            footer: card.obj<TCardMaker>({
                 card: {
                     footer: {
                         visible: '',

package/dist/index.js

@@ -1,7 +1,7 @@
 /*
-* EffCSS v4.5.1
+* EffCSS v4.6.0
 * {@link https://sourcecraft.dev/msabitov/effcss}
 * Copyright (c) Marat Sabitov
 * @license Apache-2.0
 */
-function e(e,t){var s={};for(var n in e)Object.prototype.hasOwnProperty.call(e,n)&&t.indexOf(n)<0&&(s[n]=e[n]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(n=Object.getOwnPropertySymbols(e);r<n.length;r++)t.indexOf(n[r])<0&&Object.prototype.propertyIsEnumerable.call(e,n[r])&&(s[n[r]]=e[n[r]])}return s}"function"==typeof SuppressedError&&SuppressedError;const t=(e,t,s)=>Object.entries(e).reduce(t,s),s=(e,t)=>{return`${s=e,s.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase()))}:${""+t};`;var s},n=Symbol("noParse"),r=(e,i,a)=>{var o,l,c;let u=""+e;return null==i?"":Array.isArray(i)?i.map((e=>s(u,e))).join(""):"object"!=typeof i||i.hasOwnProperty(n)?""===i?u+";":s(u,i):(!a||(null===(o=a.startsWith)||void 0===o?void 0:o.call(a,"@"))||(null===(l=u.startsWith)||void 0===l?void 0:l.call(u,"&"))||(null===(c=u.startsWith)||void 0===c?void 0:c.call(u,"@"))?"":"&")+u+`{${t(i,((e,t)=>e+r(...t,u)),"")}}`},i="@layer",a="@starting-style",o=e=>`(${e})`,l=e=>"string"==typeof e,c={and:(...e)=>Object.defineProperties({type:"and",value:e},{toString:{value:()=>e.filter(Boolean).map((e=>{const t=p(e);return"object"==typeof e&&"or"===e.type?o(t):t})).join(" and ")}}),or:(...e)=>Object.defineProperties({type:"or",value:e},{toString:{value:()=>e.filter(Boolean).map((e=>p(e))).join(" or ")}}),not:e=>"object"==typeof e&&"not"===e.type?e.value[0]:Object.defineProperties({type:"not",value:[e]},{toString:{value:()=>`not (${p(e,!0)})`}})},u=e=>{const t=t=>({toString:()=>`(min-${e}:${l(t)?t:t+"rem"})`}),s=t=>({toString:()=>`(max-${e}:${l(t)?t:t+"rem"})`}),n=(e,n)=>({toString:()=>`${t(e)} and ${s(n)}`});return{up:t,down:s,between:n,only:e=>n(e,e)}},h=u("width"),g=u("height"),m=u("inline-size"),d=u("block-size"),p=(e,t)=>e?"string"==typeof e?e.includes("(")||t?e:o(e):e+"":"",b=(e={})=>{const{type:t,condition:s}=e,n=p(s),r="object"==typeof s&&"or"===s.type,i=`@media${t?" "+t:""}${t&&n?" and":""}${n?" "+(t&&r?o(n):n):""}`;return Object.defineProperties((e=>({[i]:e})),{all:{get:()=>b({condition:s,type:"all"})},print:{get:()=>b({condition:s,type:"print"})},screen:{get:()=>b({condition:s,type:"screen"})},where:{value:e=>b({condition:e,type:t})},toString:{value:()=>i}})},$=b({}),f=({condition:e}={})=>{const t=p(e),s="@supports"+(t?" "+t:"");return Object.defineProperties((e=>({[s]:e})),{where:{value:e=>f({condition:e})},toString:{value:()=>s}})},y=f(),v=e=>({[a]:e});v.toString=a;const j=e=>{const{root:t="",limit:s="",mode:n=[!1,!1]}=e,r=`@scope ${t?`(${t}${n[0]?" > *":""})`:""}${t&&s?" ":""}${s?`to (${s}${n[1]?" > *":""})`:""}`;return Object.defineProperties((e=>({[r]:e})),{limit:{value:e=>j({root:t,limit:e,mode:n})},root:{value:e=>j({root:e,limit:s,mode:n})},both:{value:()=>j({root:t,limit:s,mode:[!1,!0]})},none:{value:()=>j({root:t,limit:s,mode:[!0,!1]})},low:{value:()=>j({root:t,limit:s,mode:[!0,!0]})},high:{value:()=>j({root:t,limit:s,mode:[!1,!1]})},toString:{value:()=>r}})},O=j({}),x=(e,t)=>`calc(${e} * 1${t})`,w=e=>x(e,"px"),S=e=>x(e,"vh"),k=e=>x(e,"vw"),_=e=>x(e,"vmin"),A=e=>x(e,"vmax"),z=e=>x(e,"em"),C=e=>x(e,"rem"),P=e=>x(e,"deg"),q=e=>x(e,"rad"),T=e=>x(e,"rad"),E=e=>x(e,"ms"),N=e=>x(e,"s"),M=e=>x(e,"%"),R=e=>x(e,"cqw"),B=e=>x(e,"cqh"),I=e=>x(e,"cqi"),W=e=>x(e,"cqb"),V=e=>x(e,"cqmin"),J=e=>x(e,"cqmax"),L=Object.fromEntries,H=Object.entries,D=":first-",K=":last-",U=":only-",F="child",Z=":nth-",G="of-type",Q=Z+F,X=":focus",Y="valid",ee="in"+Y,te=":user-",se={r:":root",h:":hover",f:X,fv:X+"-visible",a:":active",v:":visited",val:":"+Y,inv:":"+ee,uval:te+Y,uinv:te+ee,e:":empty",d:":disabled",rq:":required",o:":optional",m:":modal",l:":link",ph:":placeholder",ch:":checked",po:":popover-open",fc:D+F,lc:K+F,oc:U+F,odd:Q+"(odd)",even:Q+"(even)",ft:D+G,lt:K+G,ot:U+G,bef:"::before",aft:"::after",bd:"::backdrop"},ne={has:":has",not:":not",is:":is",wh:":where",st:":state",nthc:Q,ntho:Z+G,dir:":dir",lang:":lang"},re=e=>`oklch(${e})`,ie=e=>re(`from ${e}`),ae=(e,t=.1)=>ie(`${e} calc(l + ${t}) c h / alpha`),oe=(e,t=.1)=>ie(`${e} calc(l - ${t}) c h / alpha`),le=(e,t=.1)=>ie(`${e} l c h / calc(alpha + ${t})`),ce=(e,t=.1)=>ie(`${e} l c h / calc(alpha - ${t})`),ue=(e,t=.04)=>ie(`${e} l calc(c + ${t}) h / alpha`),he=(e,t=.04)=>ie(`${e} l calc(c - ${t}) h / alpha`),ge=(e,t=30)=>ie(`${e} l c calc(h${"number"==typeof t?t>0?" + "+t:" - "+-t:t}) / alpha`),me=e=>{const t=e("color");return{root:e=>e?ie(t+` ${e.l||"l"} ${e.c||"c"} ${e.h||"h"} / ${e.a||"1"}`):t,oklch:re,lighten:ae,darken:oe,saturate:ue,desaturate:he,fadein:le,fadeout:ce,spin:ge}},de=e=>{class t{constructor(e={}){this.state={l:"l",c:"base",h:"pri",a:1,m:"bg"},Object.assign(this,{[n]:!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:n,a:r,m:i}=this.state;return`oklch(${e(`lightness.${i}.${t}`)} ${e(`chroma.${i}.${s}`)} ${e(`hue.${n}`)} / ${r})`}}return new t},pe="coef",be=e=>{class t{constructor(e={}){this.state={center:8},this.state=Object.assign(this.state,e)}get min(){return e(`${pe}.${this.state.center-4}`)}get xxs(){return e(`${pe}.${this.state.center-3}`)}get xs(){return e(`${pe}.${this.state.center-2}`)}get s(){return e(`${pe}.${this.state.center-1}`)}get m(){return e(`${pe}.${this.state.center}`)}get l(){return e(`${pe}.${this.state.center+1}`)}get xl(){return e(`${pe}.${this.state.center+2}`)}get xxl(){return e(`${pe}.${this.state.center+3}`)}get max(){return e(`${pe}.${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},$e=Object.assign,fe=Object.entries,ye=Array.isArray,ve=e=>"object"==typeof e,je=(e,t)=>Array.from(Array(e).entries()).reduce(((e,[s])=>$e(e,t(s+1))),{}),Oe=(e,t)=>fe(e).reduce(((e,[s,n])=>$e(e,t(s,n))),{}),xe=(e,t,s={})=>e?t:s,we=(...e)=>e.join("-"),Se=(...e)=>e.join(),ke=(...e)=>e.join(" "),_e=(e,...t)=>t.length?t.reduce(((e,t)=>(t&&e&&ve(t)&&fe(t).forEach((([t,s])=>{s&&ve(s)&&e[t]?ye(e[t])&&ye(s)?e[t]=[...e[t],...s]:_e(e[t],s||{}):e[t]=s})),e)),e):e,Ae=Object.assign(L(H(se).map((([e,t])=>{function s(e=""){return e+t}return s.toString=()=>t,[e,s]}))),L(H(ne).map((([e,t])=>{function s(e,s=""){return s+t+`(${e})`}return s.toString=()=>t,[e,s]})))),ze={px:w,vh:S,vw:k,vmin:_,vmax:A,em:z,rem:C,deg:P,rad:q,turn:T,ms:E,s:N,pc:M,cqw:R,cqh:B,cqb:W,cqi:I,cqmin:V,cqmax:J},Ce=e=>1!==e?e+" * ":"",Pe=e=>{const{scope:s,globalKey:a}=e,o=s(a).varExp,l=(e=1)=>ze.ms(Ce(e)+o("time")),u=(e=1)=>ze.deg(Ce(e)+o("angle")),b=(e=1)=>ze.px(Ce(e)+o("size")),f=e=>e?`cubic-bezier(${e.x1||0},${e.y1||0},${e.x2||1},${e.y2||1})`:o("easing");return{compile:({key:e,maker:a})=>{const j=s(e),x=j.selector,w=(e=>{const t={cp:1,lay:1,kf:1,cq:1},s=(r={})=>{const{scroll:i,type:a,name:o,condition:l}=r,c=p(l),u=`@container${o?" "+o:""}${c?" "+c:""}`;return Object.defineProperties((e=>({[u]:e})),{container:{value:(o||"none")+" / "+(a&&i?`${a} scroll-state`:i?"scroll-state":a||"normal"),enumerable:!0},named:{get:()=>s({scroll:i,condition:l,name:o||e.name(["cq",t.cq++]),type:a})},size:{get:()=>s({name:o,scroll:i,condition:l,type:"size"})},isize:{get:()=>s({name:o,scroll:i,condition:l,type:"inline-size"})},scroll:{get:()=>s({name:o,scroll:!0,condition:l,type:a})},where:{value:e=>s({name:o,scroll:i,condition:e,type:a})},[n]:{value:!0},toString:{value:()=>u}})},r=({name:s}={})=>{const n=`${i}${s?" "+s:""}`,a=e=>({[n]:e});return a.toString=()=>n,Object.defineProperties(a,{named:{get:()=>r({name:s||e.name(["lay",t.lay++])})},list:{value:(...e)=>({[i+(e.map((e=>(e+"").split(i)[1])).filter(Boolean).join(",")||s)]:""})}})};return{layer:r(),supports:y,keyframes:s=>{const r=e.name(["kf",t.kf++]),i="@keyframes "+r;return Object.defineProperties((e=>{if(!e)return{animationName:r};const{dur:t,tf:s,del:n,ic:i,dir:a,ps:o,fm:l}=e;return{animation:[t,s,n,i,a,o,l,r].filter(Boolean).join(" ")}}),{[i]:{value:s,enumerable:!0},toString:{value:()=>r},[n]:{value:!0}})},property:(s={})=>{const{syn:r='"*"',inh:i=!0,ini:a,def:o}=s,l="--"+e.name(["cp",t.cp++]),c=`var(${l}${void 0!==o?","+o:""})`,u="@property "+l;return Object.defineProperties((e=>({[l]:e})),{[u]:{value:{syntax:r,inherits:i,initialValue:a},enumerable:!0},toString:{value:()=>c},fallback:{value:e=>`var(${l},${e})`},[n]:{value:!0}})},scope:O,media:$,container:s({}),startingStyle:v,$logic:c,$width:h,$height:g,$block:d,$inline:m}})(j),S=a({dash:we,comma:Se,space:ke,range:je,each:Oe,when:xe,merge:_e,themeVar:o,size:b,time:l,angle:u,easing:f,bem:x,pseudo:Ae,color:me(o),palette:de(o),coef:be(o),units:ze,at:w});return"string"==typeof S?S:(e=>t(e,((e,t)=>e+r(...t)),""))(S)}}},qe=Symbol("effcss-stylesheet");class Te{constructor(){this.disabled=!1,this.cssRules=[]}replaceSync(e){e&&(this.cssRules=[{cssText:e}])}}function Ee({initStyles:e,emulate:t}={}){const s={};null==e||e.forEach((e=>{var t;const n=null===(t=null==e?void 0:e.dataset)||void 0===t?void 0:t.effcss;n&&(s[n]=e)}));let n={},r={},i=[],a=[];const o=(e,t)=>t.hasOwnProperty(qe)?t:Object.defineProperties(t,{[qe]:{value:e}}),l=e=>{var t;return e.adoptedStyleSheets=[...(null===(t=e.adoptedStyleSheets)||void 0===t?void 0:t.length)?[...e.adoptedStyleSheets].filter((e=>!e.hasOwnProperty(qe))):[],...i]},c=()=>{a=a.reduce(((e,t)=>{const s=t.deref();return s&&(l(s),e.push(t)),e}),[])},u=e=>e?n[e]:void 0,h=(e,t)=>{if(!n[e]){n[e]=o(e,t),i.push(n[e]);const r=s[e];return r&&(r.disabled=!0),c(),!0}};return{get:u,all:()=>n,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 n[e],delete r[e]),c(),!0},removeAll:()=>(i.splice(0),n={},r={},c(),!0),pack:(e,s)=>{let r=n[e]||(!t&&globalThis.CSSStyleSheet?new globalThis.CSSStyleSheet:new Te);return r.replaceSync(s),r=o(e,r),!!r.cssRules.length&&h(e,r)},register:e=>{a.findIndex((t=>t.deref()===e))>=0||(a.push(new WeakRef(e)),l(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 Ne=({prefix:e})=>{let t=0;return{get initial(){return e+0},get current(){return e+t},next(){return t++,this.current}}},Me=({prefix:e})=>{const t=new Set,s=new Map,n=Ne({prefix:e});return{use(e){let r=this.key(e);return r||(r=n.current,t.add(r),s.set(e,r),n.next(),r)},remake(e,t){const n=s.get(t);return n?(s.delete(t),s.set(e,n),n):this.use(e)},key:e=>e?s.get(e)||"":n.initial,get keys(){return[...t]},get makers(){return Object.fromEntries(s.entries().map((([e,t])=>[t,e])))}}},Re=void 0,Be=Object.entries,Ie=Object.defineProperties,We=e=>"string"==typeof e,Ve=e=>null!==e&&"object"==typeof e,Je=e=>e.split("."),Le=(e,t)=>Be(e).reduce(((e,[s,n])=>{if(Ve(n)){const r=Be(n);r.length?e.push(...r.reduce(((e,[n,r])=>{if((e=>null!==e&&e!==Re)(n)&&t&&e.push([s,n,Re,Re]),Ve(r)){const t=Be(r);t.length&&e.push(...t.reduce(((e,[t,r])=>{const i=typeof r;return"string"!==i&&"number"!==i||e.push([s,n,t,r]),e}),[]))}return e}),[])):e.push([s,Re,Re,Re])}return e}),[]),He=(e,t,s,n)=>""+(((e,t)=>`${e||""}${t?"__"+t:""}`)(e,t)+(s?"_"+s:"")+(s&&n?"_"+n:""))||"_",De=(e,t)=>"."+(t?e+(t.startsWith("_")?"":"-")+t:e),Ke=(e,t)=>`[data-${e}${t?`~="${t}"`:""}]`;const Ue=e=>e||"",Fe=Object.assign,Ze=Object.entries,Ge="theme",Qe="delete",Xe="update",Ye="$light",et="$dark",tt="lightness",st="chroma",nt=e=>Number((.1*184+.9*e).toFixed(2)),rt={time:200,size:16,angle:30,color:"#2192a7",easing:"linear",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:nt(142),inf:nt(264),war:nt(109),dan:nt(29)},[Ye]:{[tt]:{bg:{xl:.98,l:.93,m:.88,s:.83,xs:.78},fg:{xl:0,l:.12,m:.24,s:.36,xs:.48}},[st]:{bg:{gray:0,pale:.01,base:.04,rich:.7},fg:{gray:0,pale:.07,base:.11,rich:.15}}},[et]:{[tt]:{bg:{xl:.24,l:.3,m:.36,s:.42,xs:.48},fg:{xl:.98,l:.93,m:.86,s:.79,xs:.72}},[st]:{bg:{pale:.02,base:.06,rich:.1},fg:{pale:.06,base:.1,rich:.14}}}},it=({provider:t,init:s,scope:n,onChange:r})=>{const i={"":rt},a=[],o=t=>{var{$light:s={},$dark:r={}}=t,i=e(t,["$light","$dark"]);function a(e,t=[]){return Ze(e).reduce(((e,[s,r])=>r&&"object"==typeof r?Fe(e,a(r,[...t,s])):(e[n.varName([...t,s])]=r,e)),{})}return Object.assign(Object.assign({},a(i)),{[Ye]:a(s),[et]:a(r)})},l={get:(e="")=>i[e],add(e,t){i[t]||(i[t]=_e({[Ye]:{},[et]:{}},e),a.push({type:"add",payload:{params:e,name:t}}),null==r||r())},delete(e){e&&i[e]&&(this.current===e&&this.switch(),delete i[e],a.push({type:Qe,payload:{name:e}}),null==r||r())},update(e,t=""){i[t]&&(i[t]=_e({[Ye]:{},[et]:{}},i[t],e),a.push({type:Xe,payload:{params:e,name:t}}),null==r||r())},switch(e=""){i[e]&&t.setAttribute(Ge,e)},vars(e=""){const t=this.get(e);return t?o(t):{[Ye]:{},[et]:{}}},makeThemeVars:o,get list(){const t=e(i,[""]);return Object.keys(t)},get current(){return t.getAttribute(Ge)||""},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 Qe:l.delete(t.name);break;case Xe:l.update(t.params,t.name)}})),l},at="effcss",ot=at+"-provider",lt=at+"-override",ct="script",ut="style",ht="size",gt="time",mt="angle",dt="color",pt="easing",bt=at+"changes",$t="data-"+at,ft="prefers-color-scheme",yt=`${ft}: light`,vt=`${ft}: dark`,jt={mode:"a",pre:"f"},Ot=e=>"boolean"==typeof e,xt=(e,t)=>{const s=((e,t)=>e.getAttribute(t)||jt[t])(e,t);return(e=>"string"==typeof e?Number(e):null)(s)},wt=(e,t,s)=>null===s?e.removeAttribute(t):e.setAttribute(t,s+""),St=e=>`:root:has([is=${ot}]${e?`[${e}]`:""})`,kt=e=>Object.entries(e).reduce(((e,[t,s])=>e+t+":"+s+";"),""),_t=({theme:t,attrs:s,scope:n})=>({bem:r,each:i,themeVar:a,merge:o,pseudo:{r:l},at:{media:c},units:{px:u}})=>{const h=s.size,g=s.time,m=s.angle,d=s.color,p=s.easing,b=t.vars(),{$dark:$={},$light:f={}}=b,y=e(b,["$dark","$light"]);return o({[St()]:Object.assign(Object.assign(Object.assign(Object.assign({},y),c.where(yt)(f)),c.where(vt)($)),{[l()]:{fontSize:u(a("size"))}})},i(t.list,((s,n)=>{const i=t.vars(n),{$dark:a={},$light:o={}}=i,l=e(i,["$dark","$light"]),u=Object.assign(Object.assign(Object.assign({},l),c.where(yt)(o)),c.where(vt)(a));return{[St(`theme=${s}`)]:u,[r(`..theme.${s}`)]:u}})),h&&{[St(ht)]:{[n.varName(ht)]:h}},g&&{[St(gt)]:{[n.varName(gt)]:g}},m&&{[St(mt)]:{[n.varName(mt)]:m}},d&&{[St(dt)]:{[n.varName(dt)]:d}},p&&{[St(pt)]:{[n.varName(pt)]:p}})},At=(e,t)=>({set(s){wt(e,t,s)},get:()=>xt(e,t)}),zt=(e,t)=>({set(s){wt(e,t,s)},get:()=>e.getAttribute(t)}),Ct=(e,{initStyles:t,emulate:s,onChange:n,globalMaker:r,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:At(e,ht),time:At(e,gt),angle:At(e,mt),color:zt(e,dt),easing:zt(e,pt)});const o=Me({prefix:e.pre}),l=((e={})=>{const{mode:t,min:s,dict:n={}}=e;let r;r="a"===t?Ke:De;const i=e=>{let s=0,n=Ue,a=Ue;const o=i.dict;o&&(o[e]||(o[e]={}),n=t=>{var n;return null!==(n=o[e][t])&&void 0!==n?n:o[e][t]=(s++).toString(36)},a=t=>o[e][t]);let l=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=Ue);const h=e=>"--"+l(We(e)?e.split("."):e),g=e=>{if(void 0===e)return function(e){const t=({b:s,e:n,m:r})=>({b:e=>t({b:e,e:"",m:{}}),e:e=>t({b:s,e:e,m:{}}),m:(e={})=>t({b:s,e:n,m:e}),get $(){return e({[s]:{[n]:r}})}});return t({b:"",e:"",m:{}})}(g);let t,s,n,r,i="";const o=We(e);return i=o||Array.isArray(e)?[...(o?[e]:e).reduce(((e,i)=>([t,s,n,r]=Je(i),e.add(u(a(He(t,s)))),n&&e.add(u(a(He(t,s,n,r)))),e)),new Set).values()].join(" "):e&&Le(e,!0).map((([e,t,s,n])=>u(a(He(e,t,s,n))))).join(" "),Ie({[c]:i},{toString:{value:()=>`${c}="${i}"`},$:{value:i}})};return{selector:t=>{const[s,i,a,o]=Je(t);return r(e,n(He(s,i,a,o)))},attr:g,name:l,varName:h,varExp:(e,t)=>`var(${h(e)}${void 0!==t?","+t:""})`}};return s&&(i.dict=n),i})({mode:e.mode,min:e.min,dict:null==a?void 0:a.dict}),c=l(o.key()),u=Pe({scope:l,globalKey:o.key()}),h=Ee({initStyles:t,emulate:s});e.theme=it({provider:e,init:null==a?void 0:a.theme,onChange:n,scope:c});const g=(({scope:e,collector:t,manager:s,processor:n,globalMaker:r})=>{const i=e=>"string"==typeof e?e:t.key(e),a=s=>e(s||t.key()).attr,o=(e,t)=>n.compile({key:t,maker:e}),l=e=>{let n=t.use(e);return s&&!s.get(n)&&s.pack(n,s.hydrate(n)||o(e,n)),a(n)},c=(...e)=>0===e.length?[l(r)]:e.map((e=>l(e)));return{use:c,remake:(e,n)=>{let r=t.key(n||e);return s&&s.get(r)?(n&&t.remake(e,n),s.pack(r,s.hydrate(r)||o(e,r)),a(r)):c(e)[0]},css:o,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:l,processor:u,manager:h,collector:o,globalMaker:r});Object.defineProperties(e,{_c:{value:o},_s:{value:l},_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 ${$t}="${e}">${[...t.cssRules].map((e=>e.cssText)).join("")}</style>`)).join("");let n=ut,r="";const a={is:ot,min:e.getAttribute("min"),mode:e.getAttribute("mode"),size:e.getAttribute(ht),time:e.getAttribute(gt),angle:e.getAttribute(mt),color:e.getAttribute(dt),easing:e.getAttribute(pt)};if(!i){n=ct,a.type="application/json";const t={theme:e.theme.actions};e.min&&o.keys.length>1&&(t.dict=l.dict),r=JSON.stringify(t)}return s+`<${n} ${Object.entries(a).map((([e,t])=>null!=t&&t!==jt[e]?""===t?e:`${e}="${t}"`:"")).filter(Boolean).join(" ")}${e.theme.current?` theme="${e.theme.current}"`:""}>${r}</${n}>`}}}),Object.assign(e,g)},Pt=Symbol(ot),qt=[ht,gt,mt,dt,pt],Tt=new Set(qt),Et=()=>null===globalThis||void 0===globalThis?void 0:globalThis.document.querySelector(`[is=${ot}]`);const Nt=(e={})=>{let{noscript:t,attrs:s={}}=e,{mode:n=jt.mode,min:r,pre:i=jt.prefix,size:a=null,time:o=null,angle:l=null,color:c=null,easing:u=null}=s;return new class{get tagName(){return""}get textContent(){return""}getAttribute(e){const t=this.attributes[e];return null!=t?Ot(t)?"":t+"":null}setAttribute(e,t){this.attributes[e]=t+"",Tt.has(e)&&this._customize()}removeAttribute(e){delete this.attributes[e]}get makers(){return this._c.makers}constructor(){this.attributes={size:a?a+"":null,time:o?o+"":null,angle:l?l+"":null,color:c||null,easing:u||null,pre:i,mode:n,min:r?"":null},this._customize=()=>{const e=this.size,t=this.time,s=this.angle,n=this.color,r=this.easing,i=_t({theme:this.theme,attrs:{size:e,time:t,angle:s,color:n,easing:r},scope:this._s(this._c.key())});this.remake(i,this._),this._=i},Ct(this,{emulate:!0,onChange:this._customize,globalMaker:this._,noscript:t}),this._customize()}}},Mt=(t={})=>{const{emulate:s,global:n}=t,r=e(t,["emulate","global"]),i=null===globalThis||void 0===globalThis?void 0:globalThis.document;let a;const o=globalThis[Pt];if(n&&o)a=o;else if(i&&!s){void 0===Mt.isDefined&&(Mt.isDefined=function(){const t=globalThis.document,s=globalThis.customElements;if(null==s?void 0:s.get(ot))return!1;{class n extends HTMLScriptElement{constructor(){super(...arguments),this._customize=()=>{const e=this.size,t=this.time,s=this.angle,n=this.color,r=this.easing,i=_t({theme:this.theme,attrs:{size:e,time:t,angle:s,color:n,easing:r},scope:this._s(this._c.key())});this.remake(i,this._),this._=i}}static get observedAttributes(){return qt}get makers(){return this._c.makers}attributeChangedCallback(){this.isConnected&&this._customize()}connectedCallback(){Ct(this,{initStyles:[...t.querySelectorAll(ut+`[${$t}]`)],onChange:this._customize,globalMaker:this._}),this._customize();const e=this;this._n={set adoptedStyleSheets(t){e.dispatchEvent(new CustomEvent(bt,{detail:{styles:t},bubbles:!0}))}},this._m.register(this._n),this._m.register(t)}}s.define(ot,n,{extends:ct});class r extends HTMLElement{static get observedAttributes(){return["values"]}_customize(){const t=Et();if(this.shadowRoot&&t){const s=this.getAttribute("values"),n=new CSSStyleSheet;if(s){const r=t.theme.makeThemeVars(JSON.parse(decodeURIComponent(s))),{$dark:i={},$light:a={}}=r,o=e(r,["$dark","$light"]);n.replaceSync(`:host{display:contents;${kt(o)}}@media(${yt}){:host{${kt(a)}}}@media(${vt}){:host{${kt(i)}}}`)}else n.replaceSync(":host{display:contents;}");this.shadowRoot.adoptedStyleSheets=[n]}}attributeChangedCallback(){this.isConnected&&this._customize()}connectedCallback(){this.attachShadow({mode:"open"}).innerHTML="<slot></slot>",this._customize()}}return s.define(lt,r),!0}}());const t=Et();if(t)a=t;else{const e=i.createElement(ct,{is:ot});e.setAttribute("is",ot);const t=null==r?void 0:r.attrs;t&&Object.entries(t).map((([t,s])=>s&&jt[t]!==s&&e.setAttribute(t,Ot(s)?"":s+""))),i.head.appendChild(e),a=e}}else a=Nt(r);return n&&!o&&(globalThis[Pt]=a),a},Rt=e=>encodeURIComponent(JSON.stringify(e));export{jt as DEFAULT_ATTRS,ot as TAG_NAME,lt as TAG_NAME_OVERRIDE,Rt as prepareOverrideValues,Mt as useStyleProvider};
+const e=(e,t,r)=>Object.entries(e).reduce(t,r),t=(e,t)=>{return`${r=e,r.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase()))}:${""+t};`;var r},r=Symbol("noParse"),s=(n,i,a)=>{let o=""+n;return null==i?"":Array.isArray(i)?i.map((e=>t(o,e))).join(""):"object"!=typeof i||i.hasOwnProperty(r)?""===i?o+";":t(o,i):(!a||a.startsWith?.("@")||o.startsWith?.("&")||o.startsWith?.("@")?"":"&")+o+`{${e(i,((e,t)=>e+s(...t,o)),"")}}`},n="@layer",i="@starting-style",a=e=>`(${e})`,o=e=>"string"==typeof e,l={and:(...e)=>Object.defineProperties({type:"and",value:e},{toString:{value:()=>e.filter(Boolean).map((e=>{const t=g(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=>g(e))).join(" or ")}}),not:e=>"object"==typeof e&&"not"===e.type?e.value[0]:Object.defineProperties({type:"not",value:[e]},{toString:{value:()=>`not (${g(e,!0)})`}})},c=e=>{const t=t=>({toString:()=>`(min-${e}:${o(t)?t:t+"rem"})`}),r=t=>({toString:()=>`(max-${e}:${o(t)?t:t+"rem"})`}),s=(e,s)=>({toString:()=>`${t(e)} and ${r(s)}`});return{up:t,down:r,between:s,only:e=>s(e,e)}},u=c("width"),h=c("height"),m=c("inline-size"),d=c("block-size"),g=(e,t)=>e?"string"==typeof e?e.includes("(")||t?e:a(e):e+"":"",p=(e={})=>{const{type:t,condition:r}=e,s=g(r),n="object"==typeof r&&"or"===r.type,i=`@media${t?" "+t:""}${t&&s?" and":""}${s?" "+(t&&n?a(s):s):""}`;return Object.defineProperties((e=>({[i]:e})),{all:{get:()=>p({condition:r,type:"all"})},print:{get:()=>p({condition:r,type:"print"})},screen:{get:()=>p({condition:r,type:"screen"})},where:{value:e=>p({condition:e,type:t})},toString:{value:()=>i}})},b=p({}),$=({condition:e}={})=>{const t=g(e),r="@supports"+(t?" "+t:"");return Object.defineProperties((e=>({[r]:e})),{where:{value:e=>$({condition:e})},toString:{value:()=>r}})},f=$(),y=e=>({[i]:e});y.toString=i;const v=e=>{const{root:t="",limit:r="",mode:s=[!1,!1]}=e,n=`@scope ${t?`(${t}${s[0]?" > *":""})`:""}${t&&r?" ":""}${r?`to (${r}${s[1]?" > *":""})`:""}`;return Object.defineProperties((e=>({[n]:e})),{limit:{value:e=>v({root:t,limit:e,mode:s})},root:{value:e=>v({root:e,limit:r,mode:s})},both:{value:()=>v({root:t,limit:r,mode:[!1,!0]})},none:{value:()=>v({root:t,limit:r,mode:[!0,!1]})},low:{value:()=>v({root:t,limit:r,mode:[!0,!0]})},high:{value:()=>v({root:t,limit:r,mode:[!1,!1]})},toString:{value:()=>n}})},x=v({}),w=(e,t)=>`calc(${e} * 1${t})`,S=e=>w(e,"px"),k=e=>w(e,"vh"),j=e=>w(e,"vw"),_=e=>w(e,"vmin"),O=e=>w(e,"vmax"),A=e=>w(e,"em"),z=e=>w(e,"rem"),C=e=>w(e,"deg"),q=e=>w(e,"rad"),P=e=>w(e,"rad"),E=e=>w(e,"ms"),N=e=>w(e,"s"),T=e=>w(e,"%"),M=e=>w(e,"cqw"),R=e=>w(e,"cqh"),B=e=>w(e,"cqi"),W=e=>w(e,"cqb"),I=e=>w(e,"cqmin"),V=e=>w(e,"cqmax"),J=Object.fromEntries,L=Object.entries,H=":first-",D=":last-",K=":only-",U="child",F=":nth-",Z="of-type",G=F+U,Q=":focus",X="valid",Y="in"+X,ee=":user-",te={r:":root",h:":hover",f:Q,fv:Q+"-visible",a:":active",v:":visited",val:":"+X,inv:":"+Y,uval:ee+X,uinv:ee+Y,e:":empty",d:":disabled",rq:":required",o:":optional",m:":modal",l:":link",ph:":placeholder",ch:":checked",po:":popover-open",fc:H+U,lc:D+U,oc:K+U,odd:G+"(odd)",even:G+"(even)",ft:H+Z,lt:D+Z,ot:K+Z,bef:"::before",aft:"::after",bd:"::backdrop"},re={has:":has",not:":not",is:":is",wh:":where",st:":state",nthc:G,ntho:F+Z,dir:":dir",lang:":lang"},se=e=>`oklch(${e})`,ne=e=>se(`from ${e}`),ie=(e,t=.1)=>ne(`${e} calc(l + ${t}) c h / alpha`),ae=(e,t=.1)=>ne(`${e} calc(l - ${t}) c h / alpha`),oe=(e,t=.1)=>ne(`${e} l c h / calc(alpha + ${t})`),le=(e,t=.1)=>ne(`${e} l c h / calc(alpha - ${t})`),ce=(e,t=.04)=>ne(`${e} l calc(c + ${t}) h / alpha`),ue=(e,t=.04)=>ne(`${e} l calc(c - ${t}) h / alpha`),he=(e,t=30)=>ne(`${e} l c calc(h${"number"==typeof t?t>0?" + "+t:" - "+-t:t}) / alpha`),me=e=>{const t=e("color");return{root:e=>e?ne(t+` ${e.l||"l"} ${e.c||"c"} ${e.h||"h"} / ${e.a||"1"}`):t,oklch:se,lighten:ie,darken:ae,saturate:ce,desaturate:ue,fadein:oe,fadeout:le,spin:he}},de=e=>{class t{state={l:"l",c:"base",h:"pri",a:"1",m:"bg"};constructor(e={}){Object.assign(this,{[r]:!0}),this.state=Object.assign(this.state,e)}get xs(){return new t({...this.state,l:"xs"})}get s(){return new t({...this.state,l:"s"})}get m(){return new t({...this.state,l:"m"})}get l(){return new t({...this.state,l:"l"})}get xl(){return new t({...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({...this.state,c:"gray"})}get pale(){return new t({...this.state,c:"pale"})}get base(){return new t({...this.state,c:"base"})}get rich(){return new t({...this.state,c:"rich"})}get chroma(){return{gray:this.gray,pale:this.pale,base:this.base,rich:this.rich}}get pri(){return new t({...this.state,h:"pri"})}get sec(){return new t({...this.state,h:"sec"})}get suc(){return new t({...this.state,h:"suc"})}get inf(){return new t({...this.state,h:"inf"})}get war(){return new t({...this.state,h:"war"})}get dan(){return new t({...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({...this.state,a:e+""})}get bg(){return new t({...this.state,m:"bg"})}get fg(){return new t({...this.state,m:"fg"})}toString(){const{l:t,c:r,h:s,a:n,m:i}=this.state;return`oklch(${e(`lightness.${i}.${t}`)} ${e(`chroma.${i}.${r}`)} ${e(`hue.${s}`)} / ${n})`}}return new t},ge="coef",pe=e=>{class t{state={center:8};constructor(e={}){this.state=Object.assign(this.state,e)}get min(){return e(`${ge}.${this.state.center-4}`)}get xxs(){return e(`${ge}.${this.state.center-3}`)}get xs(){return e(`${ge}.${this.state.center-2}`)}get s(){return e(`${ge}.${this.state.center-1}`)}get m(){return e(`${ge}.${this.state.center}`)}get l(){return e(`${ge}.${this.state.center+1}`)}get xl(){return e(`${ge}.${this.state.center+2}`)}get xxl(){return e(`${ge}.${this.state.center+3}`)}get max(){return e(`${ge}.${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{xs:this.xs,...this.short,xl:this.xl}}get long(){return{xxs:this.xxs,...this.base,xxl:this.xxl}}get full(){return{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},be=Object.assign,$e=Object.entries,fe=Array.isArray,ye=e=>"object"==typeof e,ve=(e,t)=>Array.from(Array(e).entries()).reduce(((e,[r])=>be(e,t(r+1))),{}),xe=(e,t)=>$e(e).reduce(((e,[r,s])=>be(e,t(r,s))),{}),we=(e,t,r={})=>e?t:r,Se=(...e)=>e.join("-"),ke=(...e)=>e.join(),je=(...e)=>e.join(" "),_e=(e,...t)=>t.length?t.reduce(((e,t)=>(t&&e&&ye(t)&&$e(t).forEach((([t,r])=>{r&&ye(r)&&e[t]?fe(e[t])&&fe(r)?e[t]=[...e[t],...r]:_e(e[t],r||{}):e[t]=r})),e)),e):e,Oe=Object.assign(J(L(te).map((([e,t])=>{function r(e=""){return e+t}return r.toString=()=>t,[e,r]}))),J(L(re).map((([e,t])=>{function r(e,r=""){return r+t+`(${e})`}return r.toString=()=>t,[e,r]})))),Ae={px:S,vh:k,vw:j,vmin:_,vmax:O,em:A,rem:z,deg:C,rad:q,turn:P,ms:E,s:N,pc:T,cqw:M,cqh:R,cqb:W,cqi:B,cqmin:I,cqmax:V},ze=e=>1!==e?e+" * ":"",Ce=t=>{const{scope:i,globalKey:a}=t,o=i(a).varExp,c=(e=1)=>Ae.ms(ze(e)+o("time")),p=(e=1)=>Ae.deg(ze(e)+o("angle")),$=(e=1)=>Ae.px(ze(e)+o("size")),v=e=>e?`cubic-bezier(${e.x1||0},${e.y1||0},${e.x2||1},${e.y2||1})`:o("easing");return{compile:({key:t,maker:a})=>{const w=i(t),S=w.selector,k=w.select,j=(e=>{const t={cp:1,lay:1,kf:1,cq:1},s=(n={})=>{const{scroll:i,type:a,name:o,condition:l}=n,c=g(l),u=`@container${o?" "+o:""}${c?" "+c:""}`;return Object.defineProperties((e=>({[u]:e})),{container:{value:(o||"none")+" / "+(a&&i?`${a} scroll-state`:i?"scroll-state":a||"normal"),enumerable:!0},named:{get:()=>s({scroll:i,condition:l,name:o||e.name(["cq",t.cq++]),type:a})},size:{get:()=>s({name:o,scroll:i,condition:l,type:"size"})},isize:{get:()=>s({name:o,scroll:i,condition:l,type:"inline-size"})},scroll:{get:()=>s({name:o,scroll:!0,condition:l,type:a})},where:{value:e=>s({name:o,scroll:i,condition:e,type:a})},[r]:{value:!0},toString:{value:()=>u}})},i=({name:r}={})=>{const s=`${n}${r?" "+r:""}`,a=e=>({[s]:e});return a.toString=()=>s,Object.defineProperties(a,{named:{get:()=>i({name:r||e.name(["lay",t.lay++])})},list:{value:(...e)=>({[n+(e.map((e=>(e+"").split(n)[1])).filter(Boolean).join(",")||r)]:""})}})};return{layer:i(),supports:f,keyframes:s=>{const n=e.name(["kf",t.kf++]),i="@keyframes "+n;return Object.defineProperties((e=>{if(!e)return{animationName:n};const{dur:t,tf:r,del:s,ic:i,dir:a,ps:o,fm:l}=e;return{animation:[t,r,s,i,a,o,l,n].filter(Boolean).join(" ")}}),{[i]:{value:s,enumerable:!0},toString:{value:()=>n},[r]:{value:!0}})},property:(s={})=>{let n,i,a='"*"',o=!0;"object"==typeof s?({syn:a=a,inh:o=o,ini:n,def:i}=s):(i=s,n=s,o=!1);const l="--"+e.name(["cp",t.cp++]),c=`var(${l}${void 0!==i?","+i:""})`,u="@property "+l;return Object.defineProperties((e=>({[l]:e})),{[u]:{value:{syntax:a,inherits:o,initialValue:n},enumerable:!0},toString:{value:()=>c},fallback:{value:e=>`var(${l},${e})`},[r]:{value:!0}})},scope:x,media:b,container:s({}),startingStyle:y,$logic:l,$width:u,$height:h,$block:d,$inline:m}})(w),_=a({dash:Se,comma:ke,space:je,range:ve,each:xe,when:we,merge:_e,themeVar:o,size:$,time:c,angle:p,easing:v,bem:S,select:k,pseudo:Oe,color:me(o),palette:de(o),coef:pe(o),units:Ae,at:j});return"string"==typeof _?_:(t=>e(t,((e,t)=>e+s(...t)),""))(_)}}},qe=Symbol("effcss-stylesheet");class Pe{disabled=!1;cssRules=[];replaceSync(e){e&&(this.cssRules=[{cssText:e}])}}function Ee({initStyles:e,emulate:t}={}){const r={};e?.forEach((e=>{const t=e?.dataset?.effcss;t&&(r[t]=e)}));let s={},n={},i=[],a=[];const o=(e,t)=>t.hasOwnProperty(qe)?t:Object.defineProperties(t,{[qe]:{value:e}}),l=e=>e.adoptedStyleSheets=[...e.adoptedStyleSheets?.length?[...e.adoptedStyleSheets].filter((e=>!e.hasOwnProperty(qe))):[],...i],c=()=>{a=a.reduce(((e,t)=>{const r=t.deref();return r&&(l(r),e.push(t)),e}),[])},u=e=>e?s[e]:void 0,h=(e,t)=>{if(!s[e]){s[e]=o(e,t),i.push(s[e]);const n=r[e];return n&&(n.disabled=!0),c(),!0}};return{get:u,all:()=>s,add:h,status:e=>{const t=u(e);return!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 r=(a=t,i.findIndex((e=>e===a)));var a;return r>-1&&(i.splice(r,1),delete s[e],delete n[e]),c(),!0},removeAll:()=>(i.splice(0),s={},n={},c(),!0),pack:(e,r)=>{let n=s[e]||(!t&&globalThis.CSSStyleSheet?new globalThis.CSSStyleSheet:new Pe);return n.replaceSync(r),n=o(e,n),!!n.cssRules.length&&h(e,n)},register:e=>{a.findIndex((t=>t.deref()===e))>=0||(a.push(new WeakRef(e)),l(e))},unregister:e=>{const t=a.findIndex((t=>t.deref()===e));t>=0&&a.splice(t,1)},hydrate:e=>r[e]&&!r[e].disabled&&r[e].textContent||void 0}}const Ne=({prefix:e})=>{let t=0;return{get initial(){return e+0},get current(){return e+t},next(){return t++,this.current}}},Te=({prefix:e})=>{const t=new Set,r=new Map,s=Ne({prefix:e});return{use(e){let n=this.key(e);return n||(n=s.current,t.add(n),r.set(e,n),s.next(),n)},remake(e,t){const s=r.get(t);return s?(r.delete(t),r.set(e,s),s):this.use(e)},key:e=>e?r.get(e)||"":s.initial,get keys(){return[...t]},get makers(){return Object.fromEntries(r.entries().map((([e,t])=>[t,e])))}}},Me=void 0,Re=Object.entries,Be=Object.defineProperties,We=e=>"string"==typeof e,Ie=e=>null!==e&&"object"==typeof e,Ve=e=>e.split("."),Je=(e,t="")=>Re(e).reduce(((e,[r,s])=>{const n=t?`${t}-${r}`:r;return"object"==typeof s?(e.add(n),e=e.union(Je(s,n))):e.add(n+`_${s}`),e}),new Set),Le=(e,t="")=>Re(e).reduce(((e,[r,s])=>{const n=t?`${t}-${r}`:r;if("object"==typeof s){const t=Le(s,n);t.size||e.add(n),e=e.union(t)}else t&&e.add(t),e.add(n+`_${s}`);return e}),new Set),He=(e,t)=>Re(e).reduce(((e,[r,s])=>{if(Ie(s)){const n=Re(s);n.length?e.push(...n.reduce(((e,[s,n])=>{if((e=>null!==e&&e!==Me)(s)&&t&&e.push([r,s,Me,Me]),Ie(n)){const t=Re(n);t.length&&e.push(...t.reduce(((e,[t,n])=>{const i=typeof n;return"string"!==i&&"number"!==i||e.push([r,s,t,n]),e}),[]))}return e}),[])):e.push([r,Me,Me,Me])}return e}),[]),De=(e,t,r,s)=>""+(((e,t)=>`${e||""}${t?"__"+t:""}`)(e,t)+(r?"_"+r:"")+(r&&s?"_"+s:""))||"_",Ke=(e,t)=>"."+(t?e+(t.startsWith("_")?"":"-")+t:e),Ue=(e,t)=>`[data-${e}${t?`~="${t}"`:""}]`;const Fe=e=>e||"",Ze=Object.assign,Ge=Object.entries,Qe="theme",Xe="delete",Ye="update",et="$light",tt="$dark",rt="lightness",st="chroma",nt=e=>Number((.1*184+.9*e).toFixed(2)),it={time:200,size:16,angle:30,color:"#2192a7",easing:"linear",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:3,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:nt(142),inf:nt(264),war:nt(109),dan:nt(29)},[et]:{[rt]:{bg:{xl:1,l:.94,m:.88,s:.83,xs:.78},fg:{xl:0,l:.12,m:.24,s:.36,xs:.48}},[st]:{bg:{gray:0,pale:.01,base:.04,rich:.7},fg:{gray:0,pale:.07,base:.11,rich:.15}}},[tt]:{[rt]:{bg:{xl:.24,l:.3,m:.36,s:.42,xs:.48},fg:{xl:1,l:.93,m:.86,s:.79,xs:.72}},[st]:{bg:{pale:.02,base:.06,rich:.1},fg:{pale:.06,base:.1,rich:.14}}}},at=({provider:e,init:t,scope:r,onChange:s})=>{const n={"":it},i=[],a=({$light:e={},$dark:t={},...s})=>{function n(e,t=[]){return Ge(e).reduce(((e,[s,i])=>i&&"object"==typeof i?Ze(e,n(i,[...t,s])):(e[r.varName([...t,s])]=i,e)),{})}return{...n(s),[et]:n(e),[tt]:n(t)}},o={get:(e="")=>n[e],add(e,t){n[t]||(n[t]=_e({[et]:{},[tt]:{}},e),i.push({type:"add",payload:{params:e,name:t}}),s?.())},delete(e){e&&n[e]&&(this.current===e&&this.switch(),delete n[e],i.push({type:Xe,payload:{name:e}}),s?.())},update(e,t=""){n[t]&&(n[t]=_e({[et]:{},[tt]:{}},n[t],e),i.push({type:Ye,payload:{params:e,name:t}}),s?.())},switch(t=""){n[t]&&e.setAttribute(Qe,t)},vars(e=""){const t=this.get(e);return t?a(t):{[et]:{},[tt]:{}}},makeThemeVars:a,get list(){const{"":e,...t}=n;return Object.keys(t)},get current(){return e.getAttribute(Qe)||""},get all(){return n},get actions(){return i}};return t?.forEach((({type:e,payload:t})=>{switch(e){case"add":o.add(t.params,t.name);break;case Xe:o.delete(t.name);break;case Ye:o.update(t.params,t.name)}})),o},ot="effcss",lt=ot+"-provider",ct=ot+"-override",ut="script",ht="style",mt="size",dt="time",gt="angle",pt="color",bt="easing",$t=ot+"changes",ft="data-"+ot,yt="prefers-color-scheme",vt=`${yt}: light`,xt=`${yt}: dark`,wt={mode:"a",pre:"f"},St=e=>"boolean"==typeof e,kt=(e,t)=>{const r=((e,t)=>e.getAttribute(t)||wt[t])(e,t);return(e=>"string"==typeof e?Number(e):null)(r)},jt=(e,t,r)=>null===r?e.removeAttribute(t):e.setAttribute(t,r+""),_t=e=>`:root:has([is=${lt}]${e?`[${e}]`:""})`,Ot=e=>Object.entries(e).reduce(((e,[t,r])=>e+t+":"+r+";"),""),At=({theme:e,attrs:t,scope:r})=>({bem:s,each:n,themeVar:i,merge:a,pseudo:{r:o},at:{media:l},units:{px:c}})=>{const u=t.size,h=t.time,m=t.angle,d=t.color,g=t.easing,{$dark:p={},$light:b={},...$}=e.vars();return a({[_t()]:{...$,...l.where(vt)(b),...l.where(xt)(p),[o()]:{fontSize:c(i("size"))}}},n(e.list,((t,r)=>{const{$dark:n={},$light:i={},...a}=e.vars(r),o={...a,...l.where(vt)(i),...l.where(xt)(n)};return{[_t(`theme=${t}`)]:o,[s(`..theme.${t}`)]:o}})),u&&{[_t(mt)]:{[r.varName(mt)]:u}},h&&{[_t(dt)]:{[r.varName(dt)]:h}},m&&{[_t(gt)]:{[r.varName(gt)]:m}},d&&{[_t(pt)]:{[r.varName(pt)]:d}},g&&{[_t(bt)]:{[r.varName(bt)]:g}})},zt=(e,t)=>({set(r){jt(e,t,r)},get:()=>kt(e,t)}),Ct=(e,t)=>({set(r){jt(e,t,r)},get:()=>e.getAttribute(t)}),qt=(e,{initStyles:t,emulate:r,onChange:s,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:zt(e,mt),time:zt(e,dt),angle:zt(e,gt),color:Ct(e,pt),easing:Ct(e,bt)});const o=Te({prefix:e.pre}),l=((e={})=>{const{mode:t,min:r,dict:s={}}=e;let n;n="a"===t?Ue:Ke;const i=e=>{let r=0,s=Fe,a=Fe;const o=i.dict;o&&(o[e]||(o[e]={}),s=t=>o[e][t]??(o[e][t]=(r++).toString(36)),a=t=>o[e][t]);let l=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=Fe);const h=e=>"--"+l(We(e)?e.split("."):e),m=e=>Be({[c]:e},{toString:{value:()=>`${c}="${e}"`},$:{value:e}}),d=e=>{if(void 0===e)return function(e){const t=({b:r,e:s,m:n})=>({b:e=>t({b:e,e:"",m:{}}),e:e=>t({b:r,e:e,m:{}}),m:(e={})=>t({b:r,e:s,m:e}),get $(){return e({[r]:{[s]:n}})}});return t({b:"",e:"",m:{}})}(d);let t,r,s,n,i="";const o=We(e);return i=o||Array.isArray(e)?[...(o?[e]:e).reduce(((e,i)=>([t,r,s,n]=Ve(i),e.add(u(a(De(t,r)))),s&&e.add(u(a(De(t,r,s,n)))),e)),new Set).values()].join(" "):e&&He(e,!0).map((([e,t,r,s])=>u(a(De(e,t,r,s))))).join(" "),m(i)};return d.list=(...e)=>{const t=[...e.reduce(((e,t)=>{const[r,s]=t.split(":");if(!r)return e;if(void 0===s)return e.add(r.replaceAll(".","-")),e;const n=r.split("."),i=n.pop(),a=n.join("-");return n.length?(e.add(a),e.add(a+`-${i}_${s}`)):e.add(`${i}_${s}`),e}),new Set).keys()].map((e=>u(a(e)))).join(" ");return m(t)},d.obj=(e,t)=>{let r=Le;"full"===t&&(r=Je);const s=[...r(e).values()].map((e=>u(a(e)))).join(" ");return m(s)},{select:t=>{const r=t.replaceAll(".","-").replace(":","_");return n(e,u(s(r)))},selector:t=>{const[r,i,a,o]=Ve(t);return n(e,s(De(r,i,a,o)))},attr:d,name:l,varName:h,varExp:(e,t)=>`var(${h(e)}${void 0!==t?","+t:""})`}};return r&&(i.dict=s),i})({mode:e.mode,min:e.min,dict:a?.dict}),c=l(o.key()),u=Ce({scope:l,globalKey:o.key()}),h=Ee({initStyles:t,emulate:r});e.theme=at({provider:e,init:a?.theme,onChange:s,scope:c});const m=(({scope:e,collector:t,manager:r,processor:s,globalMaker:n})=>{const i=e=>"string"==typeof e?e:t.key(e),a=r=>e(r||t.key()).attr,o=(e,t)=>s.compile({key:t,maker:e}),l=e=>{let s=t.use(e);return r&&!r.get(s)&&r.pack(s,r.hydrate(s)||o(e,s)),a(s)},c=(...e)=>0===e.length?[l(n)]:e.map((e=>l(e)));return{use:c,remake:(e,s)=>{let n=t.key(s||e);return r&&r.get(n)?(s&&t.remake(e,s),r.pack(n,r.hydrate(n)||o(e,n)),a(n)):c(e)[0]},css:o,status:e=>{const t=i(e);return!!t&&r.status(t)},on:(...e)=>r.on(...e.map(i)),off:(...e)=>r.off(...e.map(i)),stylesheets:(e=t.keys)=>e.map((e=>r.get(i(e))))}})({scope:l,processor:u,manager:h,collector:o,globalMaker:n});Object.defineProperties(e,{_c:{value:o},_s:{value:l},_p:{value:u},_m:{value:h},toString:{value:()=>{const t={...h.all()},r=Object.entries(t).filter((([e,t])=>!t.disabled)).map((([e,t])=>`<style ${ft}="${e}">${[...t.cssRules].map((e=>e.cssText)).join("")}</style>`)).join("");let s=ht,n="";const a={is:lt,min:e.getAttribute("min"),mode:e.getAttribute("mode"),size:e.getAttribute(mt),time:e.getAttribute(dt),angle:e.getAttribute(gt),color:e.getAttribute(pt),easing:e.getAttribute(bt)};if(!i){s=ut,a.type="application/json";const t={theme:e.theme.actions};e.min&&o.keys.length>1&&(t.dict=l.dict),n=JSON.stringify(t)}return r+`<${s} ${Object.entries(a).map((([e,t])=>null!=t&&t!==wt[e]?""===t?e:`${e}="${t}"`:"")).filter(Boolean).join(" ")}${e.theme.current?` theme="${e.theme.current}"`:""}>${n}</${s}>`}}}),Object.assign(e,m)},Pt=Symbol(lt),Et=[mt,dt,gt,pt,bt],Nt=new Set(Et),Tt=()=>globalThis?.document.querySelector(`[is=${lt}]`);const Mt=(e={})=>{let{noscript:t,attrs:r={}}=e,{mode:s=wt.mode,min:n,pre:i=wt.prefix,size:a=null,time:o=null,angle:l=null,color:c=null,easing:u=null}=r;return new class{get tagName(){return""}get textContent(){return""}attributes={size:a?a+"":null,time:o?o+"":null,angle:l?l+"":null,color:c||null,easing:u||null,pre:i,mode:s,min:n?"":null};getAttribute(e){const t=this.attributes[e];return null!=t?St(t)?"":t+"":null}setAttribute(e,t){this.attributes[e]=t+"",Nt.has(e)&&this._customize()}removeAttribute(e){delete this.attributes[e]}theme;pre;mode;min;size;angle;time;color;easing;use;remake;css;get makers(){return this._c.makers}status;on;off;stylesheets;_c;_m;_s;_p;_;_n;_customize=()=>{const e=this.size,t=this.time,r=this.angle,s=this.color,n=this.easing,i=At({theme:this.theme,attrs:{size:e,time:t,angle:r,color:s,easing:n},scope:this._s(this._c.key())});this.remake(i,this._),this._=i};constructor(){qt(this,{emulate:!0,onChange:this._customize,globalMaker:this._,noscript:t}),this._customize()}}},Rt=(e={})=>{const{emulate:t,global:r,...s}=e,n=globalThis?.document;let i;const a=globalThis[Pt];if(r&&a)i=a;else if(n&&!t){void 0===Rt.isDefined&&(Rt.isDefined=function(){const e=globalThis.document,t=globalThis.customElements;if(t?.get(lt))return!1;{class r extends HTMLScriptElement{static get observedAttributes(){return Et}theme;pre;mode;min;size;angle;time;color;easing;use;remake;css;get makers(){return this._c.makers}status;on;off;stylesheets;_c;_m;_s;_p;_;_n;_customize=()=>{const e=this.size,t=this.time,r=this.angle,s=this.color,n=this.easing,i=At({theme:this.theme,attrs:{size:e,time:t,angle:r,color:s,easing:n},scope:this._s(this._c.key())});this.remake(i,this._),this._=i};attributeChangedCallback(){this.isConnected&&this._customize()}connectedCallback(){qt(this,{initStyles:[...e.querySelectorAll(ht+`[${ft}]`)],onChange:this._customize,globalMaker:this._}),this._customize();const t=this;this._n={set adoptedStyleSheets(e){t.dispatchEvent(new CustomEvent($t,{detail:{styles:e},bubbles:!0}))}},this._m.register(this._n),this._m.register(e)}}t.define(lt,r,{extends:ut});class s extends HTMLElement{static get observedAttributes(){return["values"]}_customize(){const e=Tt();if(this.shadowRoot&&e){const t=this.getAttribute("values"),r=new CSSStyleSheet;if(t){const{$dark:s={},$light:n={},...i}=e.theme.makeThemeVars(JSON.parse(decodeURIComponent(t)));r.replaceSync(`:host{display:contents;${Ot(i)}}@media(${vt}){:host{${Ot(n)}}}@media(${xt}){:host{${Ot(s)}}}`)}else r.replaceSync(":host{display:contents;}");this.shadowRoot.adoptedStyleSheets=[r]}}attributeChangedCallback(){this.isConnected&&this._customize()}connectedCallback(){this.attachShadow({mode:"open"}).innerHTML="<slot></slot>",this._customize()}}return t.define(ct,s),!0}}());const e=Tt();if(e)i=e;else{const e=n.createElement(ut,{is:lt});e.setAttribute("is",lt);const t=s?.attrs;t&&Object.entries(t).map((([t,r])=>r&&wt[t]!==r&&e.setAttribute(t,St(r)?"":r+""))),n.head.appendChild(e),i=e}}else i=Mt(s);return r&&!a&&(globalThis[Pt]=i),i},Bt=e=>encodeURIComponent(JSON.stringify(e));export{wt as DEFAULT_ATTRS,lt as TAG_NAME,ct as TAG_NAME_OVERRIDE,Bt as prepareOverrideValues,Rt as useStyleProvider};

package/dist/types/_provider/_process/atrules.d.ts

@@ -1,6 +1,6 @@
 import type { TCreateScope } from '../scope';
 type TProperty = {
-    (val: string | number | boolean): object;
+    (val: string | number | boolean | object): object;
     /**
      * Use property with fallback value
      */
@@ -150,7 +150,7 @@ export declare const resolveAtRules: (ctx: ReturnType<ReturnType<TCreateScope>>)
      * Scoped `@property` rule maker
      * @param config - property params
      */
-    property: (config?: {
+    property: (config?: string | number | {
         /**
          * Syntax
          */
@@ -166,7 +166,7 @@ export declare const resolveAtRules: (ctx: ReturnType<ReturnType<TCreateScope>>)
         /**
          * Default value
          */
-        def?: string | number | boolean;
+        def?: string | number | boolean | object;
     }) => TProperty;
     /**
      * `@scope` rule maker

package/dist/types/_provider/_process/coef.d.ts

@@ -4,15 +4,7 @@ export type TMainRange = 'min' | 'm' | 'max';
 export type TBaseRange = 'xs' | TShortRange | 'xl';
 export type TLongRange = 'xxs' | TBaseRange | 'xxl';
 export type TFullRange = 'min' | TLongRange | 'max';
-export type TSparseRange = 'min' | 'xs' | 'm' | 'xl' | 'max';
-export type TRangeConfig = Record<'xxs' | 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl' | 'xxl', number>;
-export type TCoefConfig = {
-    $0_: TRangeConfig;
-    $1_: TRangeConfig;
-    $2_: TRangeConfig;
-    $16_: TRangeConfig;
-    max: number;
-};
+export type TSparseRange = TMainRange | 'xs' | 'xl';
 /**
  * Coefficient generator
  * @description

package/dist/types/_provider/_process/palette.d.ts

@@ -1,8 +1,8 @@
 import type { TCreateScope } from '../../_provider/scope';
-type THue = 'pri' | 'sec' | 'suc' | 'inf' | 'war' | 'dan';
-type TLightness = 'xs' | 's' | 'm' | 'l' | 'xl';
-type TChroma = 'gray' | 'pale' | 'base' | 'rich';
-type TMode = 'bg' | 'fg';
+export type TPaletteHue = 'pri' | 'sec' | 'suc' | 'inf' | 'war' | 'dan';
+export type TPaletteLightness = 'xs' | 's' | 'm' | 'l' | 'xl';
+export type TPaletteChroma = 'gray' | 'pale' | 'base' | 'rich';
+export type TPaletteMode = 'bg' | 'fg';
 /**
  * Palette generator
  * @description
@@ -10,11 +10,11 @@ type TMode = 'bg' | 'fg';
  */
 export interface IPalette {
     state: {
-        l: TLightness;
-        c: TChroma;
-        h: THue;
-        a: number;
-        m: TMode;
+        l: TPaletteLightness;
+        c: TPaletteChroma;
+        h: TPaletteHue;
+        a: string;
+        m: TPaletteMode;
     };
     /**
      * Returns `xs` lightness color
@@ -39,7 +39,7 @@ export interface IPalette {
     /**
      * Returns lightness color dictionary
      */
-    get lightness(): Record<TLightness, IPalette>;
+    get lightness(): Record<TPaletteLightness, IPalette>;
     /**
      * Returns zero chroma color
      */
@@ -59,7 +59,7 @@ export interface IPalette {
     /**
      * Returns chroma color dictionary
      */
-    get chroma(): Record<TChroma, IPalette>;
+    get chroma(): Record<TPaletteChroma, IPalette>;
     /**
      * Returns primary hue color
      */
@@ -87,11 +87,11 @@ export interface IPalette {
     /**
      * Returns hue color dictionary
      */
-    get hue(): Record<THue, IPalette>;
+    get hue(): Record<TPaletteHue, IPalette>;
     /**
      * Returns specified alpha color
      */
-    alpha(a?: number): IPalette;
+    alpha(a?: number | string | object): IPalette;
     /**
      * Returns background color
      */
@@ -102,4 +102,3 @@ export interface IPalette {
     get fg(): IPalette;
 }
 export declare const resolvePalette: (varExp: ReturnType<ReturnType<TCreateScope>>["varExp"]) => IPalette;
-export {};

package/dist/types/_provider/process.d.ts

@@ -13,6 +13,7 @@ type TBezier = {
     x2?: number;
     y2?: number;
 };
+type TRelative = (coef?: number | string | object) => string;
 export interface IMakerParams {
     dash: typeof dash;
     comma: typeof comma;
@@ -21,6 +22,7 @@ export interface IMakerParams {
     each: typeof each;
     merge: typeof merge;
     when: typeof when;
+    select: TScope['select'];
     /**
      * BEM selector resolver
      */
@@ -58,15 +60,15 @@ export interface IMakerParams {
     /**
      * Scalable size value
      */
-    size: (coef?: number | string) => string;
+    size: TRelative;
     /**
      * Scalable time value
      */
-    time: (coef?: number | string) => string;
+    time: TRelative;
     /**
      * Scalable angle value
      */
-    angle: (coef?: number | string) => string;
+    angle: TRelative;
     /**
      * Easing function
      */

package/dist/types/_provider/scope.d.ts

@@ -17,6 +17,14 @@ type TMods<T> = T extends object ? {
 type TStringBEM<T> = TBlocks<T> | TMods<T> | TElems<T>;
 type TBEM<T> = TDeepPartial<T> | TStringBEM<T> | TStringBEM<T>[];
 type TStyleSheet = Record<string, Record<string, Record<string, string | number>>>;
+type TPrimitive<T> = T extends string ? T : T extends number ? T : '';
+type TModifiers<T> = T extends object ? {
+    [K in keyof T]: `${Exclude<K, symbol>}${T[K] extends object ? `.${TModifiers<T[K]>}` : `:${TPrimitive<T[K]>}`}`;
+}[keyof T] : '';
+type TNodes<T> = T extends object ? {
+    [K in keyof T]: T[K] extends object ? (`${Exclude<K, symbol>}` | `${Exclude<K, symbol>}.${TNodes<T[K]>}`) : never;
+}[keyof T] : never;
+type TSelectors<T> = TNodes<T> | TModifiers<T>;
 export type Leaves<T> = T extends object ? {
     [K in keyof T]: `${Exclude<K, symbol>}${Leaves<T[K]> extends never ? '' : `.${Leaves<T[K]>}`}`;
 }[keyof T] : never;
@@ -43,10 +51,28 @@ export type TMonoResolver<T extends TStyleSheet, B extends keyof T, E extends ke
         [key in string]: string;
     };
 };
+type TStyles = {
+    [key in string]: string | number | Record<string, never> | TStyles;
+};
+type TAttrs = {
+    $: string;
+};
+type TSelect = <T extends TStyles>(value: TSelectors<T>) => string;
 type TResolveSelector = <T extends TStyleSheet>(params: TStringBEM<T>) => string;
 type TResolveAttr = {
     <T extends TStyleSheet>(params: TBEM<T>): Record<string, string>;
     <T extends TStyleSheet>(): TMonoResolver<T, "", "">;
+    /**
+     * Use list of selectors
+     * @param args - selectors
+     */
+    list<T extends TStyles>(...args: TSelectors<T>[]): TAttrs;
+    /**
+     * Use selectors from object
+     * @param arg - selectors object
+     * @param type - which selectors to emit. Use `full` to emit all described selectors
+     */
+    obj<T extends TStyles>(arg: TDeepPartial<T>, type?: 'full'): TAttrs;
 };
 type TParts = (string | number)[];
 export type TDefaultTheme = {
@@ -59,12 +85,16 @@ export type TDefaultTheme = {
     chroma: Record<'bg' | 'fg', Record<'pale' | 'base' | 'rich' | 'gray', number>>;
 };
 export type TScope = {
+    /**
+     * Scoped selector resolver
+     */
+    select: TSelect;
     /**
      * BEM selector resolver
      */
     selector: TResolveSelector;
     /**
-     * BEM attribute resolver
+     * Attribute resolver
      */
     attr: TResolveAttr;
     /**

package/dist/types/index.d.ts

@@ -1,3 +1,5 @@
+export type { TShortRange, TMainRange, TBaseRange, TLongRange, TFullRange, TSparseRange } from './_provider/_process/coef';
+export type { TPaletteHue, TPaletteChroma, TPaletteLightness, TPaletteMode } from './_provider/_process/palette';
 import type { TProcessor } from './_provider/process';
 import type { TCollector } from './_provider/collect';
 import type { TScopeResolver } from './_provider/scope';
@@ -239,4 +241,3 @@ export declare const useStyleProvider: TUseStyleProvider;
  * @param values - CSS variables
  */
 export declare const prepareOverrideValues: (values: object) => string;
-export {};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "effcss",
-    "version": "4.5.1",
+    "version": "4.6.0",
     "description": "Self-confident CSS-in-JS",
     "type": "module",
     "scripts": {