react18-themes
Version:
Unleash the Power of React Server Components! Use multiple themes on your site with confidence, without losing any advantages of React Server Components.
2 lines (1 loc) • 2.65 kB
JavaScript
;var E=Object.defineProperty;var V=Object.getOwnPropertyDescriptor;var G=Object.getOwnPropertyNames;var b=Object.prototype.hasOwnProperty;var K=(t,e)=>{for(var o in e)E(t,o,{get:e[o],enumerable:!0})},_=(t,e,o,a)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of G(e))!b.call(t,s)&&s!==o&&E(t,s,{get:()=>e[s],enumerable:!(a=V(e,s))||a.enumerable});return t};var q=t=>_(E({},"__esModule",{value:!0}),t);var j={};K(j,{ThemeSwitcher:()=>W});module.exports=q(j);var S=require("react");var L=(t,e,o,a,s)=>{window.m=matchMedia("(prefers-color-scheme: dark)");let P=["color-scheme","csp","theme","th"];window.u=n=>{var U;let i=(U=document.querySelector(t))!=null?U:document.documentElement,d=[];P.forEach((h,C)=>{d.push(`${h}-${n[C]}`),i.setAttribute(`data-${h}`,n[C])}),d[0]=n[0],o&&(d=d.map(h=>{var C;return(C=o[h])!=null?C:h})),i.className=d.join(" ")};let y=localStorage.getItem(t),T={...y?JSON.parse(y):e,s:m.matches?e.d:e.l},l,p,c,F;window.f=(n,i)=>{p=F=n,l=c=i},window.g=(n,i)=>{p=F!=null?F:n,l=c!=null?c:i},f(a,s),window.r=n=>{let i=l!=null?l:n.c,d=i===e.c?n.s:i,U=d===""?n.t:d===e.d?n.d:n.l,h=p!=null?p:U;return[d||n.s,i,h,p!=null?p:n.t]},u(r(T))};var M=require("r18gs");var w="rth",v="light",R="dark",k="system";var x={t:"",d:R,l:v,c:k,s:v},A=t=>{let e=t!=null?t:`#${w}`;return(0,M.useRGS)(e,()=>{let o=typeof m!="undefined"&&localStorage.getItem(e);return o?{...JSON.parse(o),s:m.matches?R:v}:x})},J=t=>{let e=`${t!=null?t:`#${w}`}-`;return(0,M.useRGS)(e,{})};var $=require("react/jsx-runtime"),I,D,O,N,H,Q=(0,S.memo)(({k:t,n:e="",s:o,t:a,c:s})=>(typeof m!="undefined"&&([I,D,O,N,H]=[m,u,r,f,g]),(0,$.jsx)("script",{suppressHydrationWarning:!0,dangerouslySetInnerHTML:{__html:`(${L.toString()})(${JSON.stringify([t,x,o,a,s]).slice(1,-1)})`},nonce:e})),()=>!0),Y=(t="none")=>{let e=document.createElement("style");return e.textContent=`transition: ${t.split(";")[0]} !important;`,document.head.appendChild(e),()=>{getComputedStyle(document.body),setTimeout(()=>document.head.removeChild(e),1)}},W=({forcedTheme:t,forcedColorScheme:e,targetSelector:o,themeTransition:a,styles:s,nonce:P})=>{let y=o||`#${w}`;typeof window!="undefined"&&!window.m&&L(y,x,s,t,e);let[T,l]=A(o),[p]=J(o);return(0,S.useEffect)(()=>{I.addEventListener("change",()=>l(c=>({...c,s:I.matches?R:v}))),addEventListener("storage",c=>{c.key===y&&l(F=>({...F,...JSON.parse(c.newValue||"{}")}))})},[]),(0,S.useEffect)(()=>{let c=Y(a);D(O(T)),c(),localStorage.setItem(y,JSON.stringify(T))},[T]),(0,S.useEffect)(()=>{N(t,e),D(O(T))},[e,t]),(0,S.useEffect)(()=>{H(p.f,p.fc),D(O(T))},[p]),(0,$.jsx)(Q,{k:y,n:P,s,t,c:e})};0&&(module.exports={ThemeSwitcher});