@stitches/core
Advanced tools
@stitches/core - npm Package Compare versions
Comparing version 0.1.0-canary.20 to 0.1.0-canary.21
@@ -1,2 +0,2 @@ | ||
| (()=>{var{toPrimitive:e}=Symbol,t=Symbol.for("sxs.composers"),{assign:n,create:r,defineProperties:o,getOwnPropertyDescriptors:s}=Object,i=(t,r,i)=>n(o(t,s(i)),{[e]:()=>t[r],toString:()=>t[r]}),{from:l,isArray:a}=Array,{ownKeys:c}=Reflect,d=class extends Set{toString(){return l(this).join("")}get hasChanged(){const{size:e}=this;return()=>e<this.size}},g=d;d.prototype[e]=d.prototype.toString;var h=(e,t)=>e.reduce(((e,n)=>(e.push(...t.map((e=>/[ +>|~]/.test(n)&&/&[^]*&/.test(e)?e.replace(/&/g,`:is(${n})`):/&/.test(e)?e.replace(/&/g,n):e.replace(/^/,n+" ")))),e)),[]),p=e=>e!==Object(e)||!(e.constructor===Object||null==e.constructor),f=/(-columns|(^|[^e]-)padding|[^t]-spacing|l-align|rows|(^|(^border|[dkmnptx]|le|ne)-)width|^border|tom|[ek]-start|(o|[^e]-du)ration|us|(^|[^tv]-)left|(^|-)top|tance|rgin|e-offset|(er|g|n|t)-block|(^|[^tv]-)right|basis|[gnt]-inline|gap|(^|[^e]-)height|ness|(^|[^p]-)inset|[ek]-end|elay|tline|ve|dent|-rotate|n-rule|(c|ck|d|ne|t)-size)$/,u=/([+-])?((?:\d+(?:\.\d*)?|\.\d+)(?:[Ee][+-]?\d+)?)?(\$|--)([$\w-]+)/g,m=e=>e.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase())),b=e=>/^\$/.test(e)?"-"+e.replace(/\$/g,"-"):m(e),S=(e,t,n)=>f.test(m(e))&&Number(t)?String(t)+"px":String(t).replace(u,((t,r,o,s,i)=>"$"==s==!!o?t:(r||"--"==s?"calc(":"")+"var("+("$"===s?"--"+(!/\$/.test(i)&&e in n?n[e]+"-":"")+i.replace(/\$/g,"-"):s+i)+")"+(r||"--"==s?"*"+(r||"")+(o||"1")+")":""))),y=e=>{const{conditions:t,themeMap:n,utils:r}=e,o=Symbol.for("sxs.isOpen"),s=/\s*,\s*(?![^()]*\))/;return i=>{let l="";const c=[];let d,g;const f=(i,u)=>{const{when:m,...y}=i;m&&(y.when=m);for(let m of Reflect.ownKeys(y)){let k=y[m];const w=64==m.charCodeAt(0);k=w&&a(k)?k:[k];e:for(let a of k)if(p(a)){for(const e of c)e[o]||(l+=e,l+="{",e[o]=!0);if(u.length&&!u[o]&&(l+=u.join(", "),l+="{",u[o]=!0),m in r&&(m!=g||i!=d)){const t=r[m](e)(a);if(void 0!==t){t===Object(t)&&(g=m,f(d=t,u));continue e}}const t=w?m:b(m),s=w?a:S(m,a,n);l+=t+(w?" ":":")+s+";"}else{const e=(e,t,n)=>{const r=e?c.push(Object(t)):c.length;if(u.length&&u[o]&&(l+="}",u[o]=!1),f(n,e?u:u.length?h(u,t.split(s)):t.split(s)),e&&r)for(const e of c.splice(r-1))e[o]&&(l+="}",e[o]=!1)};if("when"===m)for(const n in a)e(!0,n in t?t[n]:n,a[n]);else e(w,m,a)}}u.length&&u[o]&&(l+="}",u[o]=!1)};return f(Object(i),[]),l}},k="colors",w="sizes",B="space",j={gap:B,gridGap:B,columnGap:B,gridColumnGap:B,rowGap:B,gridRowGap:B,inset:B,insetBlock:B,insetBlockEnd:B,insetBlockStart:B,insetInline:B,insetInlineEnd:B,insetInlineStart:B,margin:B,marginTop:B,marginRight:B,marginBottom:B,marginLeft:B,marginBlock:B,marginBlockEnd:B,marginBlockStart:B,marginInline:B,marginInlineEnd:B,marginInlineStart:B,padding:B,paddingTop:B,paddingRight:B,paddingBottom:B,paddingLeft:B,paddingBlock:B,paddingBlockEnd:B,paddingBlockStart:B,paddingInline:B,paddingInlineEnd:B,paddingInlineStart:B,top:B,right:B,bottom:B,left:B,scrollMargin:B,scrollMarginTop:B,scrollMarginRight:B,scrollMarginBottom:B,scrollMarginLeft:B,scrollMarginX:B,scrollMarginY:B,scrollMarginBlock:B,scrollMarginBlockEnd:B,scrollMarginBlockStart:B,scrollMarginInline:B,scrollMarginInlineEnd:B,scrollMarginInlineStart:B,scrollPadding:B,scrollPaddingTop:B,scrollPaddingRight:B,scrollPaddingBottom:B,scrollPaddingLeft:B,scrollPaddingX:B,scrollPaddingY:B,scrollPaddingBlock:B,scrollPaddingBlockEnd:B,scrollPaddingBlockStart:B,scrollPaddingInline:B,scrollPaddingInlineEnd:B,scrollPaddingInlineStart:B,fontSize:"fontSizes",background:k,backgroundColor:k,backgroundImage:k,border:k,borderBlock:k,borderBlockEnd:k,borderBlockStart:k,borderBottom:k,borderBottomColor:k,borderColor:k,borderInline:k,borderInlineEnd:k,borderInlineStart:k,borderLeft:k,borderLeftColor:k,borderRight:k,borderRightColor:k,borderTop:k,borderTopColor:k,caretColor:k,color:k,columnRuleColor:k,fill:k,outlineColor:k,stroke:k,textDecorationColor:k,fontFamily:"fonts",fontWeight:"fontWeights",lineHeight:"lineHeights",letterSpacing:"letterSpacings",blockSize:w,minBlockSize:w,maxBlockSize:w,inlineSize:w,minInlineSize:w,maxInlineSize:w,width:w,minWidth:w,maxWidth:w,height:w,minHeight:w,maxHeight:w,flexBasis:w,borderWidth:"borderWidths",borderTopWidth:"borderWidths",borderRightWidth:"borderWidths",borderBottomWidth:"borderWidths",borderLeftWidth:"borderWidths",borderStyle:"borderStyles",borderTopStyle:"borderStyles",borderRightStyle:"borderStyles",borderBottomStyle:"borderStyles",borderLeftStyle:"borderStyles",borderRadius:"radii",borderTopLeftRadius:"radii",borderTopRightRadius:"radii",borderBottomRightRadius:"radii",borderBottomLeftRadius:"radii",boxShadow:"shadows",textShadow:"shadows",transition:"transitions",zIndex:"zIndices"},C=e=>{const t={};for(const n in e)for(const r in e[n])t["$"+n+"-"+r]=String(e[n][r]).replace(/\$[$\w-]+/g,(e=>/[^]\$/.test(e)?e:"$"+n+e));return t},x=(e,t)=>{for(var n=JSON.stringify(t),r=n.length,o=9;r;)o=Math.imul(o^n.charCodeAt(--r),9**9);return e+(o^o>>>9).toString(36).slice(-5)},I=class{constructor(e,t,n){this.value=e,this.token=t,this.scale=n}get computedValue(){return"var("+this.variable+")"}get variable(){return"--"+this.scale+"-"+this.token}toString(){return this.computedValue}},O=class extends Array{toString(){return this.join("")}get hasChanged(){const e=String(this);return()=>e!==String(this)}},M=O;O.prototype[e]=O.prototype.toString;var v=e=>{const t="append"===e.insertMethod;let r=null,o=null,s="";return e=>{"object"==typeof document&&(r||(r=document.head||document.documentElement),o||(o=document.getElementById("stitches")||n(document.createElement("style"),{id:"stitches"})),o.parentNode||r[t?"append":"prepend"](o),s=s||o.textContent,e.split("}").every((e=>s.includes(e)))||(o.textContent=s=e))}},E=e=>{e=Object(e);const o=n({initial:"@media all"},e.conditions),s=Object(e.theme),a=Object(e.themeMap||j),d=Object(e.utils),h=new Set([].concat(e.passthru||["as","className"])),p=e.prefix||"sx",f=("function"==typeof e.insertMethod?e.insertMethod:v)(e),u="03kze",m={theme:s,conditions:o,prefix:p,themeMap:a,utils:d},b=y(m),S=new g,k=new g,w=new g,B=new g,O=new g([S,k,w,B]);let E="";const N=()=>{const e=l(O).join("");E!==e&&f(E=e)},R=(e,t)=>{t=e===Object(e)?e:Object(t),e="string"==typeof e?e:"";const n=C(t),o=(e=e||x(p,n)).replace(/^\w/,".$&"),s=e===p+u?"":b({[o]:n}),l=i(r(null),"className",{className:e,selector:o});for(const e in t){l[e]=r(null);for(const n in t[e])l[e][n]=new I(t[e][n],n,e)}return i(l,"className",{get className(){const{hasChanged:t}=k;return k.add(s),t()&&N(),e},selector:o})},P=(e,t="")=>{const n=new g,o=new g;for(const t in e)if(e[t]!==Object(e[t])||c(e[t]).length){const r=b({[t]:e[t]});("@import"===t?n:o).add(r)}const s=i(r(null),"name",{name:t}),l=i((()=>{let e=S.hasChanged,t=w.hasChanged;return n.forEach((e=>{S.add(e)})),o.forEach((e=>{w.add(e)})),(e()||t())&&N(),s}),"name",{get name(){return String(l())}});return l},$=e=>{const t=new g,n=new M,s=new g,i=new g([t,n,s]);let{variants:l,compoundVariants:a,defaultVariants:d,...h}=e;d=Object(d);const f=x(p,e),m="."+f,S=f===p+u?"":b({[m]:h});B.add(i);const y=r(null),k=[],w=[];for(const e in l)for(const t in l[e]){const n=l[e][t];w.push({[e]:t,css:n})}w.push(...a||[]);for(const e in w){const{css:t,...s}=w[e],i=c(s),l=i.length;for(const e of i)y[e]=y[e]||r(null),y[e][s[e]]=!0;const a=(e,r)=>{e={...e};for(const t in r)void 0!==e[t]||Object(y[t])[e[t]]||(e[t]=r[t]);const a=new Set;if(i.length&&i.every((t=>{const n=e[t],r=String(s[t]);if(r===String(n))return!0;if(n===Object(n))for(const e in n)if(r==String(n[e]))return a.add(e),!0}))){let e=Object(t);for(const t of a)e={[t in o?o[t]:t]:e};const r=f+x("",e)+"--"+(1===l?i[0]+"-"+s[i[0]]:"c"+l),c=b({["."+r]:e});return(n[l-1]||(n[l-1]=new g)).add(c),r}};k.push(a)}return{apply(e,r,o){const s=t.hasChanged,l=n.hasChanged;if(t.add(S),e){r.add(f);for(const t of k){const n=t(e,o);n&&r.add(n)}}if(s()||l())return B.add(i),!0},inline(e,t){const n=x("-",e),r=f==="-"+n?"":b({[m+n]:e});t.add(f+n);const{hasChanged:o}=s;return r&&s.add(r),o()},className:f,defaultVariants:d,selector:m,variantProps:y}},z=R(":root",s),W=i({css:(...e)=>{let o,s=[],a=r(null);for(const r of e)if(r===Object(r))if(t in r)for(const e of r[t])s.push(e),n(a,e.defaultVariants);else s.push(o=$(r)),n(a,o.defaultVariants);return o=o||$({}),i((e=>{const{css:n,...c}=Object(e),d=new Set;let g,p=!1;for(const e of s)p=e.apply(c,d,a)||p;n===Object(n)&&(g=o.inline(n,d)),(p||g)&&N();for(const e in o.variantProps)h.has(e)||delete c[e];"className"in c&&String(c.className).split(/\s+/).forEach(d.add,d);const f=l(d);return c.className=f.join(" "),i(r(null),"className",{get[t](){return s},className:c.className,props:c,selector:o.selector})}),"className",{get[t](){return s},get className(){return o.apply()&&N(),o.className},selector:o.selector})},config:m,global:P,keyframes:e=>{const t=x(p,e);return P({["@keyframes "+t]:e},t)},prefix:p,reset:()=>(S.clear(),k.clear(),w.clear(),B.clear(),z.className,W),theme:n(R,z),get cssText(){return E},getCssString:()=>E},"cssText",{});return W},N=()=>N.config||(N.config=E()),R=(...e)=>N().css(...e),P=(...e)=>N().global(...e),$=(...e)=>N().keyframes(...e);globalThis.stitches=E;stitches.createCss=E;stitches.css=R;stitches.defaultThemeMap=j;stitches.global=P;stitches.keyframes=$})() | ||
| var{toPrimitive:e}=Symbol,t=Symbol.for("sxs.composers"),{assign:n,create:r,defineProperties:o,getOwnPropertyDescriptors:i}=Object,a=(t,r,a)=>n(o(t,i(a)),{[e]:()=>t[r],toString:()=>t[r]}),s=e=>e.includes("-")?e:e.replace(/[A-Z]/g,(e=>"-"+e.toLowerCase())),l=(e,t)=>e.reduce(((e,n)=>(e.push(...t.map((e=>e.includes("&")?e.replace(/&/g,/[ +>|~]/.test(n)&&/&[^]*&/.test(e)?`:is(${n})`:n):n+" "+e))),e)),[]),c=/\s*,\s*(?![^()]*\))/,d=/(-columns|(^|[^e]-)padding|[^t]-spacing|l-align|rows|(^|(^border|[dkmnptx]|le|ne)-)width|^border|tom|[ek]-start|(o|[^e]-du)ration|us|(^|[^tv]-)left|(^|-)top|tance|rgin|e-offset|(er|g|n|t)-block|(^|[^tv]-)right|basis|[gnt]-inline|gap|(^|[^e]-)height|ness|(^|[^p]-)inset|[ek]-end|elay|tline|ve|dent|-rotate|n-rule|(c|ck|d|ne|t)-size)$/,g=/([+-])?((?:\d+(?:\.\d*)?|\.\d+)(?:[Ee][+-]?\d+)?)?(\$|--)([$\w-]+)/g,p=/\s+(?![^()]*\))/,h=e=>t=>e(..."string"==typeof t?String(t).split(p):[t]),m=/([\d.]+)([^]*)/,u={appearance:e=>({WebkitAppearance:e,appearance:e}),backfaceVisibility:e=>({WebkitBackfaceVisibility:e,backfaceVisibility:e}),backgroundClip:e=>({WebkitBackgroundClip:e,backgroundClip:e}),clipPath:e=>({WebkitClipPath:e,clipPath:e}),content:e=>({content:/^([^]*["'][^]*|[A-Za-z]+\([^]*|[^]*-quote|inherit|initial|none|normal|revert|unset)$/.test(e)?e:`"${e}"`}),hyphens:e=>({WebkitHyphens:e,hyphens:e}),maskImage:e=>({WebkitMaskImage:e,maskImage:e}),tabSize:e=>({MozTabSize:e,tabSize:e}),userSelect:e=>({WebkitUserSelect:e,userSelect:e}),marginBlock:h(((e,t)=>({marginBlockStart:e,marginBlockEnd:t||e}))),marginInline:h(((e,t)=>({marginInlineStart:e,marginInlineEnd:t||e}))),maxSize:h(((e,t)=>({maxBlockSize:e,maxInlineSize:t||e}))),minSize:h(((e,t)=>({minBlockSize:e,minInlineSize:t||e}))),paddingBlock:h(((e,t)=>({paddingBlockStart:e,paddingBlockEnd:t||e}))),paddingInline:h(((e,t)=>({paddingInlineStart:e,paddingInlineEnd:t||e})))},f=e=>{const{media:t,themeMap:n,utils:r}=e;let o,i,a,p;return h=>((e,t)=>{const n=new WeakSet;let r,o;const i=(e,a,d)=>{let g="";e:for(let p in e){const h=64===p.charCodeAt(0);for(const m of h?[].concat(e[p]):[e[p]]){if("function"==typeof t&&(p!==r||m!==o)){const n=t(p,m,e);if(null!==n){r=p,o=m,g+=n===Object(n)?i(n,a,d):null==n?"":n;continue e}}const h=64===p.charCodeAt(0);if(m!==Object(m)||"length"in m){for(let e=0;e<d.length;++e)n.has(d[e])||(n.add(d[e]),g+=d[e]+"{");a.length&&!n.has(a)&&(n.add(a),g+=a+"{");for(const e of/^@import/i.test(p)?[].concat(m):[m])g+=(h?p+" ":s(p)+":")+String(e)+";"}else{n.has(a)&&(n.delete(a),g+="}");const e=Object(p),t=h?a:a.length?l(a,p.split(c)):p.split(c);g+=i(m,t,h?d.concat(e):d),n.has(e)&&(n.delete(e),g+="}"),n.has(t)&&(n.delete(t),g+="}")}}}return g};return i(e,[],[])})(h,((l,c)=>{const h=l.charCodeAt(0),f=64===h?l:/[A-Z]/.test(b=l)?b:b.replace(/-[^]/g,(e=>e[1].toUpperCase()));var b;const S=64===h?l:s(l);if("function"==typeof r[l]&&(r[l]!=a||c!=p))return a=r[l],p=c,a(e)(p);if(p=c,"function"==typeof u[f]&&(u[f]!=o||c!=i))return o=u[f],i=c,o(i);let k=64===h?(l.slice(1)in t?"@media "+t[l.slice(1)]:l).replace(/\(\s*([\w-]+)\s*(=|<|<=|>|>=)\s*([\w-]+)\s*(?:(<|<=|>|>=)\s*([\w-]+)\s*)?\)/g,((e,t,n,r,o,i)=>{const a=m.test(t),s=.0625*(a?-1:1),[l,c]=a?[r,t]:[t,r];return"("+("="===n[0]?"":">"===n[0]===a?"max-":"min-")+l+":"+("="!==n[0]&&1===n.length?c.replace(m,((e,t,r)=>Number(t)+s*(">"===n?1:-1)+r)):c)+(o?") and ("+(">"===o[0]?"min-":"max-")+l+":"+(1===o.length?i.replace(m,((e,t,n)=>Number(t)+s*(">"===o?-1:1)+n)):i):"")+")"})):36===h?"-"+l.replace(/\$/g,"-"):l;const y=c===Object(c)?c:c&&"number"==typeof c&&d.test(S)?String(c)+"px":String(c).replace(g,((e,t,r,o,i)=>"$"==o==!!r?e:(t||"--"==o?"calc(":"")+"var("+("$"===o?"--"+(i.includes("$")?"":f in n?n[f]+"-":"")+i.replace(/\$/g,"-"):o+i)+")"+(t||"--"==o?"*"+(t||"")+(r||"1")+")":"")));return c!=y||S!=k?{[k]:y}:null}))},{from:b,isArray:S}=Array,{ownKeys:k}=Reflect,y=class extends Set{toString(){return b(this).join("")}get hasChanged(){const{size:e}=this;return()=>e<this.size}},B=y;y.prototype[e]=y.prototype.toString;var w="colors",I="sizes",C="space",x={gap:C,gridGap:C,columnGap:C,gridColumnGap:C,rowGap:C,gridRowGap:C,inset:C,insetBlock:C,insetBlockEnd:C,insetBlockStart:C,insetInline:C,insetInlineEnd:C,insetInlineStart:C,margin:C,marginTop:C,marginRight:C,marginBottom:C,marginLeft:C,marginBlock:C,marginBlockEnd:C,marginBlockStart:C,marginInline:C,marginInlineEnd:C,marginInlineStart:C,padding:C,paddingTop:C,paddingRight:C,paddingBottom:C,paddingLeft:C,paddingBlock:C,paddingBlockEnd:C,paddingBlockStart:C,paddingInline:C,paddingInlineEnd:C,paddingInlineStart:C,top:C,right:C,bottom:C,left:C,scrollMargin:C,scrollMarginTop:C,scrollMarginRight:C,scrollMarginBottom:C,scrollMarginLeft:C,scrollMarginX:C,scrollMarginY:C,scrollMarginBlock:C,scrollMarginBlockEnd:C,scrollMarginBlockStart:C,scrollMarginInline:C,scrollMarginInlineEnd:C,scrollMarginInlineStart:C,scrollPadding:C,scrollPaddingTop:C,scrollPaddingRight:C,scrollPaddingBottom:C,scrollPaddingLeft:C,scrollPaddingX:C,scrollPaddingY:C,scrollPaddingBlock:C,scrollPaddingBlockEnd:C,scrollPaddingBlockStart:C,scrollPaddingInline:C,scrollPaddingInlineEnd:C,scrollPaddingInlineStart:C,fontSize:"fontSizes",background:w,backgroundColor:w,backgroundImage:w,border:w,borderBlock:w,borderBlockEnd:w,borderBlockStart:w,borderBottom:w,borderBottomColor:w,borderColor:w,borderInline:w,borderInlineEnd:w,borderInlineStart:w,borderLeft:w,borderLeftColor:w,borderRight:w,borderRightColor:w,borderTop:w,borderTopColor:w,caretColor:w,color:w,columnRuleColor:w,fill:w,outlineColor:w,stroke:w,textDecorationColor:w,fontFamily:"fonts",fontWeight:"fontWeights",lineHeight:"lineHeights",letterSpacing:"letterSpacings",blockSize:I,minBlockSize:I,maxBlockSize:I,inlineSize:I,minInlineSize:I,maxInlineSize:I,width:I,minWidth:I,maxWidth:I,height:I,minHeight:I,maxHeight:I,flexBasis:I,gridTemplateColumns:I,gridTemplateRows:I,borderWidth:"borderWidths",borderTopWidth:"borderWidths",borderRightWidth:"borderWidths",borderBottomWidth:"borderWidths",borderLeftWidth:"borderWidths",borderStyle:"borderStyles",borderTopStyle:"borderStyles",borderRightStyle:"borderStyles",borderBottomStyle:"borderStyles",borderLeftStyle:"borderStyles",borderRadius:"radii",borderTopLeftRadius:"radii",borderTopRightRadius:"radii",borderBottomRightRadius:"radii",borderBottomLeftRadius:"radii",boxShadow:"shadows",textShadow:"shadows",transition:"transitions",zIndex:"zIndices"},z=e=>{const t={};for(const n in e)for(const r in e[n])t["$"+n+"-"+r]=String(e[n][r]).replace(/\$[$\w-]+/g,(e=>/[^]\$/.test(e)?e:"$"+n+e));return t},j=(e,t)=>{for(var n=JSON.stringify(t),r=n.length,o=9;r;)o=Math.imul(o^n.charCodeAt(--r),9**9);return e+(o^o>>>9).toString(36).slice(-5)},E=class{constructor(e,t,n){this.value=e,this.token=t,this.scale=n}get computedValue(){return"var("+this.variable+")"}get variable(){return"--"+this.scale+"-"+this.token}toString(){return this.computedValue}},M=class extends Array{toString(){return this.join("")}get hasChanged(){const e=String(this);return()=>e!==String(this)}},W=M;M.prototype[e]=M.prototype.toString;var v=e=>{const t="append"===e.insertionMethod;let r=null,o=null,i="";return e=>{"object"==typeof document&&(r||(r=document.head||document.documentElement),o||(o=document.getElementById("stitches")||n(document.createElement("style"),{id:"stitches"})),o.parentNode||r[t?"append":"prepend"](o),i=i||o.textContent,e.split("}").every((e=>i.includes(e)))||(o.textContent=i=e))}},O=e=>{e=Object(e);const o=n({initial:"all"},e.media),i=Object(e.theme),s=Object(e.themeMap||x),l=Object(e.utils),c=new Set([].concat(e.passthru||["as","className"])),d=e.prefix||"sx",g=("function"==typeof e.insertionMethod?e.insertionMethod:v)(e),p="03kze",h={theme:i,media:o,prefix:d,themeMap:s,utils:l},m=f(h),u=new B,S=new B,y=new B,w=new B,I=new B([u,S,y,w]);let C="";const M=()=>{const e=b(I).join("");C!==e&&g(C=e)},O=(e,t)=>{t=e===Object(e)?e:Object(t),e="string"==typeof e?e:"";const n=z(t),o=(e=e||j(d,n)).replace(/^\w/,".$&"),i=e===d+p?"":m({[o]:n}),s=a(r(null),"className",{className:e,selector:o});for(const e in t){s[e]=r(null);for(const n in t[e])s[e][n]=new E(t[e][n],n,e)}return a(s,"className",{get className(){const{hasChanged:t}=S;return S.add(i),t()&&M(),e},selector:o})},P=(e,t="")=>{const n=new B,o=new B;for(const t in e)if(e[t]!==Object(e[t])||k(e[t]).length){const r=m({[t]:e[t]});("@import"===t?n:o).add(r)}const i=a(r(null),"name",{name:t}),s=a((()=>{let e=u.hasChanged,t=y.hasChanged;return n.forEach((e=>{u.add(e)})),o.forEach((e=>{y.add(e)})),(e()||t())&&M(),i}),"name",{get name(){return String(s())}});return s},N=e=>{const t=new B,n=new W,o=new B,i=new B([t,n,o]);let{variants:a,compoundVariants:s,defaultVariants:l,...c}=e;l=Object(l);const g=j(d,e),h="."+g,u=g===d+p?"":m({[h]:c});w.add(i);const f=r(null),b=[],S=[];for(const e in a)for(const t in a[e]){const n=a[e][t];S.push({[e]:t,css:n})}S.push(...s||[]);for(const e in S){const{css:t,...o}=S[e],i=k(o),a=i.length;for(const e of i)f[e]=f[e]||r(null),f[e][o[e]]=!0;const s=(e,r)=>{e={...e};for(const t in r)void 0!==e[t]||Object(f[t])[e[t]]||(e[t]=r[t]);const s=new Set;if(i.length&&i.every((t=>{const n=e[t],r=String(o[t]);if(r===String(n))return!0;if(n===Object(n))for(const e in n)if(r==String(n[e])&&64===e.charCodeAt(0))return s.add(e),!0}))){let e=Object(t);for(const t of s)e={[t]:e};const r=g+j("",e)+"--"+(1===a?i[0]+"-"+o[i[0]]:"c"+a),l=m({["."+r]:e});return(n[a-1]||(n[a-1]=new B)).add(l),r}};b.push(s)}return{apply(e,r,o){const a=t.hasChanged,s=n.hasChanged;if(t.add(u),e){r.add(g);for(const t of b){const n=t(e,o);n&&r.add(n)}}if(a()||s())return w.add(i),!0},inline(e,t){const n=j("-",e),r=g==="-"+n?"":m({[h+n]:e});t.add(g+n);const{hasChanged:i}=o;return r&&o.add(r),i()},className:g,defaultVariants:l,selector:h,variantProps:f}},R=O(":root",i),$=a({css:(...e)=>{let o,i=[],s=r(null);for(const r of e)if(r===Object(r))if(t in r)for(const e of r[t])i.push(e),n(s,e.defaultVariants);else i.push(o=N(r)),n(s,o.defaultVariants);return o=o||N({}),a((e=>{const{css:n,...l}=Object(e),d=new Set;let g,p=!1;for(const e of i)p=e.apply(l,d,s)||p;n===Object(n)&&(g=o.inline(n,d)),(p||g)&&M();for(const e in o.variantProps)c.has(e)||delete l[e];"className"in l&&String(l.className).split(/\s+/).forEach(d.add,d);const h=b(d);return l.className=h.join(" "),a(r(null),"className",{get[t](){return i},className:l.className,props:l,selector:o.selector})}),"className",{get[t](){return i},get className(){return o.apply()&&M(),o.className},selector:o.selector})},config:h,global:P,keyframes:e=>{const t=j(d,e);return P({["@keyframes "+t]:e},t)},prefix:d,reset:()=>(u.clear(),S.clear(),y.clear(),w.clear(),R.className,$),theme:n(O,R),get cssText(){return C},getCssString:()=>C},"cssText",{});return $},P=()=>P.config||(P.config=O()),N=(...e)=>P().css(...e),R=(...e)=>P().global(...e),$=(...e)=>P().keyframes(...e);globalThis.stitches={createCss:O,css:N,defaultThemeMap:x,global:R,keyframes:$} | ||
| //# sourceMappingUrl=index.map |
| { | ||
| "name": "@stitches/core", | ||
| "version": "0.1.0-canary.20", | ||
| "version": "0.1.0-canary.21", | ||
| "description": "The modern CSS-in-JS library", | ||
@@ -66,3 +66,3 @@ "type": "module", | ||
| ], | ||
| "gitHead": "d01433fdd5b0cd3eaac83af06edb31231a51dc9e" | ||
| "gitHead": "78fcad59600237fb52955ae37222b6212e798e0e" | ||
| } |
@@ -58,8 +58,8 @@ # Stitches Core | ||
| // creates breakpoints with media queries | ||
| conditions: { | ||
| tablet: '@media (min-width: 700px)', | ||
| // creates named media queries | ||
| media: { | ||
| tablet: '(min-width: 700px)', | ||
| }, | ||
| // creates or configures css properties | ||
| // creates css properties | ||
| utils: { | ||
@@ -77,3 +77,3 @@ mX: (value) => ({ | ||
| css({ | ||
| const colorful = css({ | ||
| // assigns a custom property that resolves `tomato` | ||
@@ -86,8 +86,8 @@ color: '$red', | ||
| // assign "blue" when the breakpoint is matched | ||
| when: { | ||
| tablet: { | ||
| color: 'blue', | ||
| }, | ||
| '@tablet': { | ||
| color: 'blue', | ||
| }, | ||
| }) | ||
| document.querySelectorAll('section').forEach((el) => el.classList.add(colorful)) | ||
| ``` | ||
@@ -102,3 +102,3 @@ | ||
| export const { css } = createCss({ | ||
| export const { theme } = createCss({ | ||
| theme: { | ||
@@ -111,3 +111,3 @@ colors: { | ||
| export const curiousTheme = css.theme({ | ||
| export const curiousTheme = theme({ | ||
| colors: { | ||
@@ -117,2 +117,4 @@ primary: 'pink', | ||
| }) | ||
| document.querySelectorAll('.curious').forEach((el) => el.classList.add(curiousTheme)) | ||
| ``` |
@@ -5,3 +5,3 @@ import { DeclarationListWithRootAtRules, Properties } from './css-types' | ||
| export type CSSPropertiesToTokenScale = { | ||
| export interface CSSPropertiesToTokenScale { | ||
| gap: 'space' | ||
@@ -96,2 +96,4 @@ gridGap: 'space' | ||
| flexBasis: 'sizes' | ||
| gridTemplateColumns: 'sizes' | ||
| gridTemplateRows: 'sizes' | ||
@@ -126,5 +128,5 @@ borderWidth: 'borderWidths' | ||
| export declare const $variants: unique symbol | ||
| export declare const $conditions: unique symbol | ||
| export declare const $media: unique symbol | ||
| export type StitchesVariants<T> = T extends { [$variants]: infer V; [$conditions]: infer C } ? VariantsCall<V, C> : {} | ||
| export type StitchesVariants<T> = T extends { [$variants]: infer V; [$media]: infer C } ? VariantsCall<V, C> : {} | ||
| export type StitchesExtractVariantsStyles<T> = T extends { [$variants]: infer V } ? V : {} | ||
@@ -134,5 +136,3 @@ | ||
| export interface GlobalRule { | ||
| (): void | ||
| } | ||
| export type GlobalRule = () => void | ||
@@ -160,3 +160,3 @@ export interface ThemeRule { | ||
| // if we try to pre compute the keys or use a union | ||
| export type EmptyTheme = { | ||
| export interface EmptyTheme { | ||
| colors?: {} | ||
@@ -178,14 +178,20 @@ space?: {} | ||
| export type TConditions = { | ||
| /** This condition will always apply. */ | ||
| export interface TMedias { | ||
| /** This media will always apply. */ | ||
| initial: string | ||
| [k: string]: string | ||
| } | ||
| export type TTheme = { [k in keyof EmptyTheme]?: { [b: string]: number | string } } | ||
| export type TThemeMap = { [k in keyof Properties]?: keyof EmptyTheme } | ||
| /** Configuration of Stitches, including a default theme, prefix, custom conditions, and functional properties. */ | ||
| export interface IConfig<Conditions extends TConditions = {}, Theme extends TTheme = {}, Utils = {}, Prefix = '', ThemeMap = {}> { | ||
| conditions?: { | ||
| [k in keyof Conditions]?: Conditions[k] | ||
| /** Configuration of Stitches, including a default theme, prefix, custom medias, and functional properties. */ | ||
| export interface IConfig<Medias extends TMedias = TMedias, Theme extends TTheme = TTheme, Utils = {}, Prefix = '', ThemeMap = {}> { | ||
| /** Named CSS media queries. */ | ||
| media?: { | ||
| [k in keyof Medias]?: Medias[k] | ||
| } | ||
| /** Named theme scales containing theme tokens. */ | ||
| theme?: { | ||
@@ -197,24 +203,44 @@ [k in keyof Theme]: k extends keyof EmptyTheme ? Theme[k] : never | ||
| } | ||
| /** CSS properties corresponding to functions that accept CSS values and return new CSS object fragments. */ | ||
| utils?: { | ||
| [k in keyof Utils]: (config: UtilConfig<Conditions, Theme, Prefix, ThemeMap>) => (value: Utils[k]) => InternalCSS<Conditions, Theme, Utils, ThemeMap> | ||
| [k in keyof Utils]: (config: UtilConfig<Medias, Theme, Prefix, ThemeMap>) => (value: Utils[k]) => InternalCSS<Medias, Theme, Utils, ThemeMap> | ||
| } | ||
| themeMap?: { [k in keyof ThemeMap]?: ThemeMap[k] } | ||
| /** Prefix added before all generated class names. */ | ||
| prefix?: Prefix | ||
| /** Determines how the CSS file is inserted to a document. */ | ||
| insertMethod?: 'append' | 'prepend' | (() => (cssText: string) => void) | ||
| insertionMethod?: 'append' | 'prepend' | (() => (cssText: string) => void) | ||
| } | ||
| type UtilConfig<Conditions, Theme, Prefix, ThemeMap> = { | ||
| conditions: Conditions | ||
| interface UtilConfig<Medias, Theme, Prefix, ThemeMap> { | ||
| /** Named CSS media queries. */ | ||
| media: Medias | ||
| /** Named theme scales containing theme tokens. */ | ||
| theme: Theme | ||
| themeMap: ThemeMap | ||
| /** Prefix applied to all styled and themed rules. */ | ||
| prefix: Prefix | ||
| } | ||
| export interface InternalConfig<Conditions extends TConditions = {}, Theme extends TTheme = {}, Utils = {}, Prefix = '', ThemeMap = {}> { | ||
| conditions: Conditions | ||
| export interface InternalConfig<Medias extends TMedias = TMedias, Theme extends TTheme = TTheme, Utils = {}, Prefix = '', ThemeMap = {}> { | ||
| /** Named CSS media queries. */ | ||
| media: Medias | ||
| /** Named theme scales containing theme tokens. */ | ||
| theme: Theme | ||
| themeMap: ThemeMap | ||
| /** Prefix applied to all styled and themed rules. */ | ||
| prefix: Prefix | ||
| /** Functional properties whose values can be expanded into other properties. */ | ||
| utils: { | ||
| [k in keyof Utils]: (config: UtilConfig<Conditions, Theme, Prefix, ThemeMap>) => (value: Utils[k]) => InternalCSS<Conditions, Theme, Utils, ThemeMap> | ||
| [k in keyof Utils]: (config: UtilConfig<Medias, Theme, Prefix, ThemeMap>) => (value: Utils[k]) => InternalCSS<Medias, Theme, Utils, ThemeMap> | ||
| } | ||
| themeMap: ThemeMap | ||
| prefix: Prefix | ||
| } | ||
@@ -228,4 +254,4 @@ | ||
| export type InternalCSS< | ||
| Conditions = {}, | ||
| Theme extends TTheme = {}, | ||
| Medias extends TMedias = TMedias, | ||
| Theme extends TTheme = TTheme, | ||
| Utils = {}, | ||
@@ -235,4 +261,4 @@ ThemeMap extends { | ||
| } = CSSPropertiesToTokenScale | ||
| > = FlatInternalCSS<Conditions, Theme, Utils, ThemeMap> & { | ||
| [k: string]: InternalCSS<Conditions, Theme, Utils, ThemeMap> | number | string | undefined | { [k: string]: InternalCSS<Conditions, Theme, Utils, ThemeMap> } | ||
| > = FlatInternalCSS<Medias, Theme, Utils, ThemeMap> & { | ||
| [k: string]: InternalCSS<Medias, Theme, Utils, ThemeMap> | number | string | undefined | { [k: string]: InternalCSS<Medias, Theme, Utils, ThemeMap> } | ||
| } | ||
@@ -242,4 +268,4 @@ | ||
| export type LessInternalCSS< | ||
| Conditions = {}, | ||
| Theme extends TTheme = {}, | ||
| Medias extends TMedias = TMedias, | ||
| Theme extends TTheme = TTheme, | ||
| Utils = {}, | ||
@@ -249,8 +275,8 @@ ThemeMap extends { | ||
| } = CSSPropertiesToTokenScale | ||
| > = FlatInternalCSS<Conditions, Theme, Utils, ThemeMap> | ||
| > = FlatInternalCSS<Medias, Theme, Utils, ThemeMap> | ||
| // prettier-ignore | ||
| export type FlatInternalCSS< | ||
| Conditions = {}, | ||
| Theme extends TTheme = {}, | ||
| Medias extends TMedias = TMedias, | ||
| Theme extends TTheme = TTheme, | ||
| Utils = {}, | ||
@@ -268,11 +294,9 @@ ThemeMap extends { | ||
| /** Responsive variants: */ | ||
| when?: { | ||
| [k in keyof Conditions]?: ( | ||
| FlatInternalCSS<Conditions, Theme, Utils, ThemeMap> | ||
| & { | ||
| /** Unknown property. */ | ||
| [k in string]: unknown | ||
| } | ||
| ) | ||
| } | ||
| [k in `@${string & keyof Medias}`]?: ( | ||
| FlatInternalCSS<Medias, Theme, Utils, ThemeMap> | ||
| & { | ||
| /** Unknown property. */ | ||
| [k in string]: unknown | ||
| } | ||
| ) | ||
| } & { | ||
@@ -306,3 +330,11 @@ [k in keyof Utils]?: Utils[k] | ||
| export interface TStyledSheet<A extends TConditions = {}, B extends TTheme = {}, C = {}, D = '', ThemeMap = {}> { | ||
| export interface TStyledSheet< | ||
| /** Named CSS media queries. */ | ||
| A extends TMedias = TMedias, | ||
| /** Named theme scales containing theme tokens. */ | ||
| B extends TTheme = TTheme, | ||
| C = {}, | ||
| D = '', | ||
| ThemeMap = {} | ||
| > { | ||
| <Vars extends any[]>( | ||
@@ -347,2 +379,3 @@ ...styles: { | ||
| ( | ||
| /** Named theme scales containing theme tokens. */ | ||
| theme: Partial< | ||
@@ -357,2 +390,3 @@ { | ||
| themeName: string, | ||
| /** Named theme scales containing theme tokens. */ | ||
| theme: Partial< | ||
@@ -369,3 +403,5 @@ { | ||
| /** Returns a new styled rule. */ | ||
| /** | ||
| * Returns a new styled rule. | ||
| */ | ||
| css: { | ||
@@ -411,3 +447,3 @@ <Vars extends any[]>( | ||
| keyframes: (definition: { [k: string]: FlatInternalCSS<{}, B, C, ThemeMap> }) => GlobalRule | ||
| keyframes: (definition: { [k: string]: FlatInternalCSS<A, B, C, ThemeMap> }) => GlobalRule | ||
@@ -439,10 +475,10 @@ /** Clears all CSS rules from the sheet. */ | ||
| /** Conditions in which CSS would be applied. */ | ||
| conditions: A | ||
| /** Named CSS media queries. */ | ||
| media: A | ||
| /** Functional properties whose values can be expanded into other properties. */ | ||
| properties: C | ||
| /** Prefix applied to all styled and themed rules. */ | ||
| prefix: string | ||
| /** Functional properties whose values can be expanded into other properties. */ | ||
| utils: C | ||
| } | ||
@@ -453,19 +489,28 @@ | ||
| export type VariantsCall<Variants, Conditions> = { | ||
| [k in keyof Variants]?: MorphVariant<keyof Variants[k]> | { [I in keyof Conditions]?: MorphVariant<keyof Variants[k]> } | ||
| export type VariantsCall<Variants, Medias> = { | ||
| [k in keyof Variants]?: MorphVariant<keyof Variants[k]> | { [I in keyof Medias]?: MorphVariant<keyof Variants[k]> } | ||
| } | ||
| /** Extracts the css type from the */ | ||
| export type StitchesCss<T> = T extends { config: { conditions: infer Conditions; theme: infer Theme; utils: infer Utils; themeMap: infer ThemeMap } } ? InternalCSS<Conditions, Theme, MapUtils<Utils>, ThemeMap> : never | ||
| export type StitchesCss<T> = T extends { | ||
| config: { | ||
| media: infer Medias | ||
| theme: infer Theme | ||
| utils: infer Utils | ||
| themeMap: infer ThemeMap | ||
| } | ||
| } | ||
| ? InternalCSS<Medias extends TMedias ? Medias : never, Theme extends TTheme ? Theme : never, MapUtils<Utils>, ThemeMap> | ||
| : never | ||
| /* Output Styled Rule: | ||
| /* ========================================================================== */ | ||
| export interface IStyledRule<Variants, Conditions, Theme, Utils, ThemeMap> { | ||
| // | ||
| export interface IStyledRule<Variants, Medias extends TMedias = TMedias, Theme extends TTheme = TTheme, Utils = {}, ThemeMap = {}> { | ||
| ( | ||
| init?: VariantsCall<Variants, Conditions> & { | ||
| css?: InternalCSS<Conditions, Theme, Utils, ThemeMap> | ||
| init?: VariantsCall<Variants, Medias> & { | ||
| css?: InternalCSS<Medias, Theme, Utils, ThemeMap> | ||
| className?: string | ||
| }, | ||
| ): StyledExpression & string | ||
| toString(): string | ||
@@ -483,2 +528,3 @@ /** | ||
| */ | ||
| className: string | ||
@@ -499,4 +545,6 @@ /** | ||
| selector: string | ||
| variants: Variants | ||
| [$conditions]: Conditions | ||
| [$media]: Medias | ||
| [$variants]: Variants | ||
@@ -508,5 +556,5 @@ } | ||
| type TStyledSheetFactory = <Conditions extends TConditions = {}, Theme extends TTheme = {}, Utils = {}, Prefix = '', ThemeMap extends TThemeMap = CSSPropertiesToTokenScale>( | ||
| _config?: IConfig<Conditions, Theme, Utils, Prefix, ThemeMap>, | ||
| ) => TStyledSheet<Conditions & { initial: '' }, Theme, Utils, Prefix, ThemeMap> | ||
| type TStyledSheetFactory = <Medias extends TMedias = TMedias, Theme extends TTheme = TTheme, Utils = {}, Prefix = '', ThemeMap extends TThemeMap = CSSPropertiesToTokenScale>( | ||
| _config?: IConfig<Medias, Theme, Utils, Prefix, ThemeMap>, | ||
| ) => TStyledSheet<Medias & { initial: '' }, Theme, Utils, Prefix, ThemeMap> | ||
@@ -517,5 +565,5 @@ type TStyledSheetGlobal = (definition: OmitKey<Record<string, {}>, '@font-face' | '@import'> | DeclarationListWithRootAtRules) => GlobalRule | ||
| export declare const css: TStyledSheet<{ initial: '' }, {}, {}, '', CSSPropertiesToTokenScale> | ||
| export declare const global: (definition: OmitKey<Record<string, InternalCSS<{}, {}, {}, CSSPropertiesToTokenScale>>, '@font-face' | '@import'> | DeclarationListWithRootAtRules) => GlobalRule | ||
| export declare const keyframes: (definition: { [k: string]: FlatInternalCSS<{}, {}, {}, CSSPropertiesToTokenScale> }) => GlobalRule | ||
| export declare const global: (definition: OmitKey<Record<string, InternalCSS<{} & TMedias, {}, {}, CSSPropertiesToTokenScale>>, '@font-face' | '@import'> | DeclarationListWithRootAtRules) => GlobalRule | ||
| export declare const keyframes: (definition: { [k: string]: FlatInternalCSS<{} & TMedias, {}, {}, CSSPropertiesToTokenScale> }) => GlobalRule | ||
| export default createCss |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by0.49%
385514
- Number of lines in readme file
- increased by1.77%
115
Worsened metrics
- Number of package files
- decreased by-62.5%
9
- Lines of code
- decreased by-1.51%
6841
No dependency changes