@accelint/design-toolkit 8.1.1 → 9.0.0

package/dist/providers/theme-provider.js

@@ -1,4 +1,65 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+
 'use client';
 
-import {jsx}from'react/jsx-runtime';import'client-only';import {designTokens}from'@accelint/design-foundation/tokens/index';import {assign}from'radashi';import {createContext,useState,useEffect,useMemo,useContext}from'react';const u={mode:"dark",tokens:{...designTokens.dark,...designTokens.static},toggleMode:n=>{}},s=createContext(u);function P({children:n,defaultMode:d,onChange:m,overrides:r}){const[o,i]=useState(d??"dark");useEffect(()=>{if(document){const{documentElement:e}=document;e.classList.remove("dark","light"),e.classList.add(o);}},[o]);const a=useMemo(()=>{const e=assign(designTokens,r);return {...e[o],...e.static}},[o,r]);return jsx(s.Provider,{value:{mode:o,tokens:a,toggleMode:e=>{i(e),m?.(e);}},children:n})}function v(){return useContext(s)}export{P as ThemeProvider,v as useTheme};//# sourceMappingURL=theme-provider.js.map
+import "client-only";
+import { createContext, useContext, useEffect, useMemo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { designTokens } from "@accelint/design-foundation/tokens";
+import { assign } from "radashi";
+
+//#region src/providers/theme-provider.tsx
+const ThemeContext = createContext({
+	mode: "dark",
+	tokens: {
+		...designTokens.dark,
+		...designTokens.static
+	},
+	toggleMode: (_mode) => {}
+});
+function ThemeProvider({ children, defaultMode, onChange, overrides }) {
+	const [mode, setMode] = useState(defaultMode ?? "dark");
+	useEffect(() => {
+		if (document) {
+			const { documentElement } = document;
+			documentElement.classList.remove("dark", "light");
+			documentElement.classList.add(mode);
+		}
+	}, [mode]);
+	const tokens = useMemo(() => {
+		const tokensWithOverrides = assign(designTokens, overrides);
+		return {
+			...tokensWithOverrides[mode],
+			...tokensWithOverrides.static
+		};
+	}, [mode, overrides]);
+	return /* @__PURE__ */ jsx(ThemeContext.Provider, {
+		value: {
+			mode,
+			tokens,
+			toggleMode: (mode$1) => {
+				setMode(mode$1);
+				onChange?.(mode$1);
+			}
+		},
+		children
+	});
+}
+function useTheme() {
+	return useContext(ThemeContext);
+}
+
+//#endregion
+export { ThemeProvider, useTheme };
 //# sourceMappingURL=theme-provider.js.map

package/dist/providers/theme-provider.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/providers/theme-provider.tsx"],"names":["defaultContextValue","designTokens","_mode","ThemeContext","createContext","ThemeProvider","children","defaultMode","onChange","overrides","mode","setMode","useState","useEffect","documentElement","tokens","useMemo","tokensWithOverrides","assign","jsx","useTheme","useContext"],"mappings":"iOAyCA,MAAMA,EAAyC,CAC7C,IAAA,CAAM,MAAA,CACN,MAAA,CAAQ,CAAE,GAAGC,YAAAA,CAAa,IAAA,CAAM,GAAGA,aAAa,MAAO,CAAA,CACvD,UAAA,CAAaC,CAAAA,EAAU,CAEvB,CACF,CAAA,CACMC,CAAAA,CAAeC,aAAAA,CAAiCJ,CAAmB,CAAA,CASlE,SAASK,CAAAA,CAAc,CAC5B,SAAAC,CAAAA,CACA,WAAA,CAAAC,CAAAA,CACA,QAAA,CAAAC,EACA,SAAA,CAAAC,CACF,CAAA,CAAuB,CACrB,KAAM,CAACC,CAAAA,CAAMC,CAAO,CAAA,CAAIC,SAAoBL,CAAAA,EAAe,MAAM,CAAA,CAEjEM,SAAAA,CAAU,IAAM,CACd,GAAI,QAAA,CAAU,CACZ,KAAM,CAAE,eAAA,CAAAC,CAAgB,CAAA,CAAI,SAC5BA,CAAAA,CAAgB,SAAA,CAAU,MAAA,CAAO,MAAA,CAAQ,OAAO,CAAA,CAChDA,CAAAA,CAAgB,SAAA,CAAU,GAAA,CAAIJ,CAAI,EACpC,CACF,CAAA,CAAG,CAACA,CAAI,CAAC,CAAA,CAET,MAAMK,CAAAA,CAA6BC,QAAQ,IAAM,CAC/C,MAAMC,CAAAA,CAAsBC,OAAOjB,YAAAA,CAAcQ,CAAwB,CAAA,CACzE,OAAO,CACL,GAAGQ,CAAAA,CAAoBP,CAAI,CAAA,CAC3B,GAAGO,CAAAA,CAAoB,MACzB,CACF,CAAA,CAAG,CAACP,CAAAA,CAAMD,CAAS,CAAC,CAAA,CAEpB,OACEU,GAAAA,CAAChB,CAAAA,CAAa,QAAA,CAAb,CACC,MAAO,CACL,IAAA,CAAAO,CAAAA,CACA,MAAA,CAAAK,EACA,UAAA,CAAaL,CAAAA,EAAoB,CAC/BC,CAAAA,CAAQD,CAAI,CAAA,CACZF,CAAAA,GAAWE,CAAI,EACjB,CACF,CAAA,CAEC,QAAA,CAAAJ,CAAAA,CACH,CAEJ,CAEO,SAASc,CAAAA,EAAW,CACzB,OAAOC,UAAAA,CAAWlB,CAAY,CAChC","file":"theme-provider.js","sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\n\nimport 'client-only';\nimport { designTokens } from '@accelint/design-foundation/tokens/index';\nimport { assign } from 'radashi';\nimport {\n  createContext,\n  type PropsWithChildren,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport type {\n  SemanticColorTokens,\n  StaticColorTokens,\n  ThemeTokens,\n} from '@accelint/design-foundation/tokens/types';\nimport type { PartialDeep } from 'type-fest';\n\nexport type ThemeMode = 'dark' | 'light';\ntype ContextColorTokens = SemanticColorTokens & StaticColorTokens;\n\ntype ThemeContextValue = {\n  mode: ThemeMode;\n  tokens: ContextColorTokens;\n  toggleMode: (mode: ThemeMode) => void;\n};\n/** provide default context value to avoid optional chaining and null checks on the client */\nconst defaultContextValue: ThemeContextValue = {\n  mode: 'dark',\n  tokens: { ...designTokens.dark, ...designTokens.static },\n  toggleMode: (_mode) => {\n    // no-op\n  },\n};\nconst ThemeContext = createContext<ThemeContextValue>(defaultContextValue);\n\ntype ThemeProviderProps = PropsWithChildren & {\n  defaultMode?: ThemeMode;\n  onChange?: (mode: ThemeMode) => void;\n  /** override existing values in the theme */\n  overrides?: PartialDeep<ThemeTokens>;\n};\n\nexport function ThemeProvider({\n  children,\n  defaultMode,\n  onChange,\n  overrides,\n}: ThemeProviderProps) {\n  const [mode, setMode] = useState<ThemeMode>(defaultMode ?? 'dark');\n\n  useEffect(() => {\n    if (document) {\n      const { documentElement } = document;\n      documentElement.classList.remove('dark', 'light');\n      documentElement.classList.add(mode);\n    }\n  }, [mode]);\n\n  const tokens: ContextColorTokens = useMemo(() => {\n    const tokensWithOverrides = assign(designTokens, overrides as ThemeTokens);\n    return {\n      ...tokensWithOverrides[mode],\n      ...tokensWithOverrides.static,\n    };\n  }, [mode, overrides]);\n\n  return (\n    <ThemeContext.Provider\n      value={{\n        mode,\n        tokens,\n        toggleMode: (mode: ThemeMode) => {\n          setMode(mode);\n          onChange?.(mode);\n        },\n      }}\n    >\n      {children}\n    </ThemeContext.Provider>\n  );\n}\n\nexport function useTheme() {\n  return useContext(ThemeContext);\n}\n"]}
+{"version":3,"file":"theme-provider.js","names":["tokens: ContextColorTokens","mode"],"sources":["../../src/providers/theme-provider.tsx"],"sourcesContent":["/*\n * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\n\nimport 'client-only';\nimport { designTokens } from '@accelint/design-foundation/tokens';\nimport { assign } from 'radashi';\nimport {\n  createContext,\n  type PropsWithChildren,\n  useContext,\n  useEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport type {\n  SemanticColorTokens,\n  StaticColorTokens,\n  ThemeTokens,\n} from '@accelint/design-foundation/tokens/types';\nimport type { PartialDeep } from 'type-fest';\n\nexport type ThemeMode = 'dark' | 'light';\ntype ContextColorTokens = SemanticColorTokens & StaticColorTokens;\n\ntype ThemeContextValue = {\n  mode: ThemeMode;\n  tokens: ContextColorTokens;\n  toggleMode: (mode: ThemeMode) => void;\n};\n/** provide default context value to avoid optional chaining and null checks on the client */\nconst defaultContextValue: ThemeContextValue = {\n  mode: 'dark',\n  tokens: { ...designTokens.dark, ...designTokens.static },\n  toggleMode: (_mode) => {\n    // no-op\n  },\n};\nconst ThemeContext = createContext<ThemeContextValue>(defaultContextValue);\n\ntype ThemeProviderProps = PropsWithChildren & {\n  defaultMode?: ThemeMode;\n  onChange?: (mode: ThemeMode) => void;\n  /** override existing values in the theme */\n  overrides?: PartialDeep<ThemeTokens>;\n};\n\nexport function ThemeProvider({\n  children,\n  defaultMode,\n  onChange,\n  overrides,\n}: ThemeProviderProps) {\n  const [mode, setMode] = useState<ThemeMode>(defaultMode ?? 'dark');\n\n  useEffect(() => {\n    if (document) {\n      const { documentElement } = document;\n      documentElement.classList.remove('dark', 'light');\n      documentElement.classList.add(mode);\n    }\n  }, [mode]);\n\n  const tokens: ContextColorTokens = useMemo(() => {\n    const tokensWithOverrides = assign(designTokens, overrides as ThemeTokens);\n    return {\n      ...tokensWithOverrides[mode],\n      ...tokensWithOverrides.static,\n    };\n  }, [mode, overrides]);\n\n  return (\n    <ThemeContext.Provider\n      value={{\n        mode,\n        tokens,\n        toggleMode: (mode: ThemeMode) => {\n          setMode(mode);\n          onChange?.(mode);\n        },\n      }}\n    >\n      {children}\n    </ThemeContext.Provider>\n  );\n}\n\nexport function useTheme() {\n  return useContext(ThemeContext);\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAgDA,MAAM,eAAe,cAP0B;CAC7C,MAAM;CACN,QAAQ;EAAE,GAAG,aAAa;EAAM,GAAG,aAAa;EAAQ;CACxD,aAAa,UAAU;CAGxB,CACyE;AAS1E,SAAgB,cAAc,EAC5B,UACA,aACA,UACA,aACqB;CACrB,MAAM,CAAC,MAAM,WAAW,SAAoB,eAAe,OAAO;AAElE,iBAAgB;AACd,MAAI,UAAU;GACZ,MAAM,EAAE,oBAAoB;AAC5B,mBAAgB,UAAU,OAAO,QAAQ,QAAQ;AACjD,mBAAgB,UAAU,IAAI,KAAK;;IAEpC,CAAC,KAAK,CAAC;CAEV,MAAMA,SAA6B,cAAc;EAC/C,MAAM,sBAAsB,OAAO,cAAc,UAAyB;AAC1E,SAAO;GACL,GAAG,oBAAoB;GACvB,GAAG,oBAAoB;GACxB;IACA,CAAC,MAAM,UAAU,CAAC;AAErB,QACE,oBAAC,aAAa;EACZ,OAAO;GACL;GACA;GACA,aAAa,WAAoB;AAC/B,YAAQC,OAAK;AACb,eAAWA,OAAK;;GAEnB;EAEA;GACqB;;AAI5B,SAAgB,WAAW;AACzB,QAAO,WAAW,aAAa"}