UNPKG

@frank-auth/react

Version:

Flexible and customizable React UI components for Frank Authentication

57 lines (56 loc) 2.5 kB
'use client'; "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),c=require("@emotion/react"),b=require("react"),p=require("./context.cjs"),x=require("./theme.cjs"),w=r=>c.css` // * { // box-sizing: border-box; // } // // html, // body { // margin: 0; // padding: 0; // font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', // 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', // 'Helvetica Neue', sans-serif; // -webkit-font-smoothing: antialiased; // -moz-osx-font-smoothing: grayscale; // background-color: ${r.colors.background.primary}; // color: ${r.colors.text.primary}; // font-size: ${r.fontSizes.base}; // line-height: ${r.lineHeights.normal}; // transition: background-color ${r.transitions.normal}, color ${r.transitions.normal}; // } // // button { // font-family: inherit; // } // // input, // textarea, // select { // font-family: inherit; // } // // * { // border: 0 solid ${r.colors.border.primary}; // } // // /* Scrollbar styling for dark mode */ // ::-webkit-scrollbar { // width: 8px; // height: 8px; // } // // ::-webkit-scrollbar-track { // background: ${r.colors.background.secondary}; // } // // ::-webkit-scrollbar-thumb { // background: ${r.colors.border.secondary}; // border-radius: 4px; // } // // ::-webkit-scrollbar-thumb:hover { // background: ${r.colors.border.tertiary}; // } `,$=({children:r,defaultMode:f="light",customTheme:d,enableSystem:i=!0,enableLocalStorage:o=!0,storageKey:t="heroui-theme"})=>{const[n,l]=b.useState(()=>{if(o&&typeof window<"u"){const e=localStorage.getItem(t);if(e==="light"||e==="dark")return e}return i&&typeof window<"u"?window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light":f}),u=e=>{l(e),o&&typeof window<"u"&&localStorage.setItem(t,e)},g=()=>{u(n==="light"?"dark":"light")};b.useEffect(()=>{if(!i)return;const e=window.matchMedia("(prefers-color-scheme: dark)"),h=y=>{(!o||!localStorage.getItem(t))&&l(y.matches?"dark":"light")};return e.addListener(h),()=>e.removeListener(h)},[i,o,t]);const m=x.createTheme(n),s=d?{...m,...d}:m,k={mode:n,setMode:u,toggleMode:g,theme:s};return a.jsx(p.ThemeContext.Provider,{value:k,children:a.jsxs(c.ThemeProvider,{theme:s,children:[a.jsx(c.Global,{styles:w(s)}),r]})})};exports.ThemeProvider=$; //# sourceMappingURL=provider.cjs.map