UNPKG

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

2 lines 3.36 kB
import{YakThemeProvider as e,useTheme as t,useTheme as n}from"next-yak/context";import r from"react";const i=Symbol(`yak`);var a=class{constructor(e){this.value=e||``}add(e){this.value+=(this.value&&` `)+e}has(e){return(` `+this.value+` `).includes(` `+e+` `)}delete(e){this.has(e)&&(this.value=this.value.split(` `).filter(t=>t!==e).join(` `))}};function o(...e){let t,n=[];for(let r of e)typeof r==`string`?t=r:typeof r==`function`?n.push(r):typeof r==`object`&&`style`in r&&n.push((e,t,n)=>{for(let t in r.style){let i=r.style[t];typeof i==`function`?n[t]=String(c(e,i)):n[t]=String(i)}});return n.length===0?Object.assign((e,n)=>{t&&n.add(t)},{$dynamic:!1}):Object.assign((e,r,i)=>{t&&r.add(t);for(let t=0;t<n.length;t++)s(e,n[t],r,i)},{$dynamic:!0})}const s=(e,t,n,r)=>{let i=t(e,n,r);for(;i;){if(typeof i==`function`){i=i(e,n,r);continue}else if(typeof i==`object`&&(`className`in i&&i.className&&n.add(i.className),`style`in i&&i.style))for(let e in i.style)r[e]=i.style[e];break}},c=(e,t)=>{let n=t(e);if(typeof n==`function`)return c(e,n);if(typeof n!=`string`&&typeof n!=`number`&&!(n instanceof String)&&process.env.NODE_ENV===`development`)throw Error(`Dynamic CSS functions must return a string or number but returned ${JSON.stringify(n)}\n\nDynamic CSS function: ${t.toString()}\n`);return n},l=(...e)=>{let t=new a,n=[];for(let r of e)typeof r==`string`?t.add(r):typeof r==`function`&&n.push(r);return o(t.value,...n)},u=(e,...t)=>{if(Array.isArray(e)&&`raw`in e){let n=e[0];for(let r=0;r<t.length;r++){let i=t[r];n+=i&&typeof i==`object`&&`__yak`in i?i.__yak:String(i),n+=e[r+1]}return{__yak:n}}let n=[];for(let e of t)typeof e==`function`&&n.push(e);return n.length===0?{className:``,style:void 0}:(e=>{for(let t=0;t<n.length;t++)d(e,n[t]);return{className:``,style:void 0}})};function d(e,t){let n=new Set,r={},i=t(e,n,r);for(;typeof i==`function`;)i=i(e,n,r);return i}const f=(e,...t)=>``,p=`$__a`,m=(e,t)=>e?t?e+` `+t:e:t||void 0,h=e=>Object.assign(g(e),{attrs:t=>g(e,t)}),g=(e,t)=>{let s=typeof e!=`string`&&i in e,[,c,l,u]=s?e[i]:[],d=s?u:e,f=y(t,c),m=f?.$sa;return(e,...t)=>{let s=b(o(e,...t),l),c=e=>{if((!f||m)&&!s.$dynamic){let t=m&&!(`$__a`in e)?v({...e,[p]:!0},m):e,n=_(t);if(!(`$__r`in t)){let e=new a(t.className);s(t,e,void 0),n.className=e.value||void 0}let i=d;return r.createElement(i,n)}let t=n(),i=`$__a`in e?{theme:t,...e}:v({theme:t,...e,[p]:!0},f?.({theme:t,...e}));if(!(`$__r`in i)){let e=new a(i.className),t=s.$dynamic?{...i.style}:i.style;s(i,e,t),i.$__r=!0,i.className=e.value||void 0,t!==i.style&&(i.style=t)}let{theme:o,...c}=i,l=_(o===t?c:i),u=d;return r.createElement(u,l)},u=c;return u[i]=[c,f,s,d],u}},_=e=>{let t={};for(let n in e)!n.startsWith(`$`)&&e[n]!==void 0&&(t[n]=e[n]);return t},v=(e,t)=>t?(e.className===t.className||!t.className)&&(e.style===t.style||!t.style)?{...e,...t}:{...e,...t,className:m(e.className,t.className),style:{...e.style,...t.style}}:e,y=(e,t)=>{let n=e&&(typeof e==`function`?e:()=>e);return n&&t?e=>{let r=t(e);return v(r,n(v(e,r)))}:n&&typeof e!=`function`?Object.assign(n,{$sa:e}):n||t},b=(e,t)=>e&&t?Object.assign((n,r,i)=>{t(n,r,i),e(n,r,i)},{$dynamic:e.$dynamic||t.$dynamic}):e||t,x=new Proxy(h,{get(e,t){return e(t)}}),S=(e,...t)=>{};export{e as YakThemeProvider,l as atoms,u as css,S as globalStyle,f as keyframes,x as styled,t as useTheme}; //# sourceMappingURL=index.js.map