next-yak
Version:
next-yak is a CSS-in-JS solution tailored for Next.js that seamlessly combines the expressive power of styled-components syntax with efficient build-time extraction of CSS using Next.js's built-in CSS configuration
5 lines (4 loc) • 2.82 kB
JavaScript
import{useTheme as st,YakThemeProvider as nt}from"next-yak/context";var u=Symbol("yak");function p(...e){let t,s=[];for(let r of e)typeof r=="string"?t=r:typeof r=="function"?s.push(r):typeof r=="object"&&"style"in r&&s.push((n,o,i)=>{for(let a in r.style){let l=r.style[a];typeof l=="function"?i[a]=String(x(n,l)):i[a]=String(l)}});return s.length===0?(r,n)=>(t&&n.add(t),()=>{}):(r,n,o)=>{t&&n.add(t);for(let i=0;i<s.length;i++)I(r,s[i],n,o)}}var I=(e,t,s,r)=>{let n=t(e,s,r);for(;n;){if(typeof n=="function"){n=n(e,s,r);continue}else if(typeof n=="object"&&("className"in n&&n.className&&s.add(n.className),"style"in n&&n.style))for(let o in n.style)r[o]=n.style[o];break}},x=(e,t)=>{let s=t(e);if(typeof s=="function")return x(e,s);if(process.env.NODE_ENV==="development"&&typeof s!="string"&&typeof s!="number"&&!(s instanceof String))throw new Error(`Dynamic CSS functions must return a string or number but returned ${JSON.stringify(s)}
Dynamic CSS function: ${t.toString()}
`);return s};var b=(...e)=>{let t=[],s=[];for(let n of e)typeof n=="string"?t.push(...n.split(" ")):typeof n=="function"&&s.push(n);let r=t.length>0?[(n,o)=>{t.forEach(i=>o.add(i))},...s]:s;return p(...r)};var F=(e,...t)=>{let s=[];for(let r of t)typeof r=="function"&&s.push(r);return s.length===0?{className:"",style:void 0}:r=>{for(let n=0;n<s.length;n++)w(r,s[n]);return{className:"",style:void 0}}};function w(e,t){let s=new Set,r={},n=t(e,s,r);for(;typeof n=="function";)n=n(e,s,r);return n}var Y=(e,...t)=>"";import O from"react";import{useTheme as _}from"next-yak/context";var j={},v=e=>Object.assign(A(e),{attrs:t=>A(e,t)}),R=v,A=(e,t)=>{let s=typeof e!="string"&&u in e,[r,n,o]=s?e[u]:[],i=D(t,n);return(a,...l)=>{let S=p(a,...l),d=L(S,o),T=y=>{let m=i||S.length?_():j,c="$__attrs"in y?{theme:m,...y}:f({theme:m,...y,$__attrs:!0},i?.({theme:m,...y})),g=new Set("className"in c?c.className?.split(" "):[]),P={..."style"in c?c.style:{}};"$__runtimeStylesProcessed"in c||(d(c,g,P),c.$__runtimeStylesProcessed=!0),c.className=Array.from(g).join(" ")||void 0,c.style=P;let{theme:h,...N}=c,k=h===m?N:c,C=s?k:E(k);return r?r(C):O.createElement(e,{...C})};return Object.assign(T,{[u]:[T,i,d]})}},E=e=>{let t={};for(let s in e)!s.startsWith("$")&&e[s]!==void 0&&(t[s]=e[s]);return t},$=(e,t)=>{if(!(!e&&!t))return e?t?e+" "+t:e:t},f=(e,t)=>t?(e.className===t.className||!t.className)&&(e.style===t.style||!t.style)?{...e,...t}:{...e,...t,className:$(e.className,t.className),style:{...e.style||{},...t.style||{}}}:e,D=(e,t)=>{let s=e&&(typeof e=="function"?e:()=>e);return s&&t?r=>{let n=t(r);return f(n,s(f(r,n)))}:s||t},L=(e,t)=>e&&t?(r,n,o)=>{t(r,n,o),e(r,n,o)}:e||t;var M=new Proxy(R,{get(e,t){return e(t)}});export{nt as YakThemeProvider,b as atoms,F as css,Y as keyframes,M as styled,st as useTheme};
//# sourceMappingURL=index.js.map