@kaizen/components 0.0.0-canary-cg-test-20231011234329 → 0.0.0-canary-cg-test-20231012014902

package/dist/cjs/KaizenProvider/KaizenProvider.cjs

@@ -3,17 +3,16 @@
 var React = require('react');
 var OptionalIntlProvider = require('./OptionalIntlProvider/OptionalIntlProvider.cjs');
 var ThemeProvider = require('./ThemeProvider/ThemeProvider.cjs');
-require('@kaizen/design-tokens');
 const KaizenProvider = /*#__PURE__*/function () {
   const KaizenProvider = function (_a) {
     var children = _a.children,
-      themeManager = _a.themeManager,
+      theme = _a.theme,
       _b = _a.locale,
       locale = _b === void 0 ? "en" : _b;
     return React.createElement(OptionalIntlProvider.OptionalIntlProvider, {
       locale: locale
     }, React.createElement(ThemeProvider.ThemeProvider, {
-      themeManager: themeManager
+      theme: theme
     }, children));
   };
   KaizenProvider.displayName = "KaizenProvider";

package/dist/cjs/KaizenProvider/KaizenProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"KaizenProvider.cjs","sources":["../../../src/KaizenProvider/KaizenProvider.tsx"],"sourcesContent":["import React from \"react\"\nimport { OptionalIntlProvider } from \"./OptionalIntlProvider\"\nimport { ThemeProvider, ThemeManager } from \"./ThemeProvider\"\n\nexport type KaizenProviderProps = {\n  children: React.ReactNode\n  themeManager?: ThemeManager\n  locale?: string\n}\n\nexport const KaizenProvider = ({\n  children,\n  themeManager,\n  locale = \"en\",\n}: KaizenProviderProps): JSX.Element => (\n  <OptionalIntlProvider locale={locale}>\n    <ThemeProvider themeManager={themeManager}>{children}</ThemeProvider>\n  </OptionalIntlProvider>\n)\n\nKaizenProvider.displayName = \"KaizenProvider\"\n"],"names":["KaizenProvider","_a","children","themeManager","_b","locale","React","createElement","OptionalIntlProvider","ThemeProvider","displayName"],"mappings":";;;;;;MAUaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAIT,EAAA;QAHpBC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,YAAY,GAAAF,EAAA,CAAAE,YAAA;MACZC,cAAa;MAAbC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,IAAI,GAAAA,EAAA;IACyB,OACtCE,KAAC,CAAAC,aAAA,CAAAC,oBAAoB,CAAAA,oBAAA,EAAC;MAAAH,MAAM,EAAEA;IAAM,CAAA,EAClCC,KAAC,CAAAC,aAAA,CAAAE,2BAAa;MAACN,YAAY,EAAEA;IAAe,CAAA,EAAAD,QAAQ,CAAiB,CAChD;EAHe,CAIvC;EAEDF,cAAc,CAACU,WAAW,GAAG,gBAAgB;EAAA,OAVhCV,cAAc;AAAA;"}
+{"version":3,"file":"KaizenProvider.cjs","sources":["../../../src/KaizenProvider/KaizenProvider.tsx"],"sourcesContent":["import React from \"react\"\nimport { Theme as BaseTheme } from \"@kaizen/design-tokens\"\nimport { OptionalIntlProvider } from \"./OptionalIntlProvider\"\nimport { ThemeProvider } from \"./ThemeProvider\"\n\nexport type KaizenProviderProps<Theme extends BaseTheme = BaseTheme> = {\n  children: React.ReactNode\n  theme?: Theme\n  locale?: string\n}\n\nexport const KaizenProvider = ({\n  children,\n  theme,\n  locale = \"en\",\n}: KaizenProviderProps): JSX.Element => (\n  <OptionalIntlProvider locale={locale}>\n    <ThemeProvider theme={theme}>{children}</ThemeProvider>\n  </OptionalIntlProvider>\n)\n\nKaizenProvider.displayName = \"KaizenProvider\"\n"],"names":["KaizenProvider","_a","children","theme","_b","locale","React","createElement","OptionalIntlProvider","ThemeProvider","displayName"],"mappings":";;;;;MAWaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAIT,EAAA;QAHpBC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,KAAK,GAAAF,EAAA,CAAAE,KAAA;MACLC,cAAa;MAAbC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,IAAI,GAAAA,EAAA;IACyB,OACtCE,KAAC,CAAAC,aAAA,CAAAC,oBAAoB,CAAAA,oBAAA,EAAC;MAAAH,MAAM,EAAEA;IAAM,CAAA,EAClCC,KAAC,CAAAC,aAAA,CAAAE,2BAAa;MAACN,KAAK,EAAEA;IAAQ,CAAA,EAAAD,QAAQ,CAAiB,CAClC;EAHe,CAIvC;EAEDF,cAAc,CAACU,WAAW,GAAG,gBAAgB;EAAA,OAVhCV,cAAc;AAAA;"}

package/dist/cjs/KaizenProvider/ThemeProvider/ThemeProvider.cjs

@@ -2,33 +2,17 @@
 
 var tslib = require('tslib');
 var React = require('react');
-var ThemeManager = require('./ThemeManager.cjs');
 var index = require('./themes/index.cjs');
-var ThemeContext = React.createContext(index.defaultTheme);
+var useThemeManager = require('./useThemeManager.cjs');
+var ThemeContext = React.createContext(null);
 /**
  * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.
  * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.
  */
 var ThemeProvider = function (_a) {
-  var themeManager = _a.themeManager,
-    props = tslib.__rest(_a, ["themeManager"]);
-  var themeManagerInstance = React.useState(function () {
-    return themeManager || new ThemeManager.ThemeManager(index.defaultTheme);
-  })[0];
-  var _b = React.useState(themeManagerInstance.getCurrentTheme()),
-    theme = _b[0],
-    setTheme = _b[1];
-  React.useEffect(function () {
-    var cancelled = false;
-    var listener = function (newTheme) {
-      if (!cancelled) setTheme(newTheme);
-    };
-    themeManagerInstance.addThemeChangeListener(listener);
-    return function () {
-      cancelled = true;
-      themeManagerInstance.removeThemeChangeListener(listener);
-    };
-  }, []);
+  var userTheme = _a.theme,
+    props = tslib.__rest(_a, ["theme"]);
+  var theme = useThemeManager.useThemeManager(userTheme !== null && userTheme !== void 0 ? userTheme : index.defaultTheme).theme;
   return React.createElement(React.Fragment, null, React.createElement(ThemeContext.Provider, {
     value: theme
   }, props.children), React.createElement("link", {
@@ -64,7 +48,11 @@ var ThemeProvider = function (_a) {
   }));
 };
 var useTheme = function () {
-  return React.useContext(ThemeContext);
+  var context = React.useContext(ThemeContext);
+  if (!context) {
+    throw new Error("useTheme must be used within the ThemeContext.Provider");
+  }
+  return context;
 };
 exports.ThemeContext = ThemeContext;
 exports.ThemeProvider = ThemeProvider;

package/dist/cjs/KaizenProvider/ThemeProvider/ThemeProvider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.cjs","sources":["../../../../src/KaizenProvider/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import React, {\n  Context,\n  createContext,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\"\nimport { ThemeManager } from \"./ThemeManager\"\nimport { defaultTheme, Theme } from \"./themes\"\n\nexport const ThemeContext: Context<Theme> = createContext<Theme>(defaultTheme)\n\n/**\n * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.\n * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.\n */\nexport const ThemeProvider = ({\n  themeManager,\n  ...props\n}: {\n  themeManager?: ThemeManager\n  children: React.ReactNode\n}): JSX.Element => {\n  const [themeManagerInstance] = useState<ThemeManager>(\n    () => themeManager || new ThemeManager(defaultTheme)\n  )\n\n  const [theme, setTheme] = useState<Theme>(\n    themeManagerInstance.getCurrentTheme()\n  )\n\n  useEffect(() => {\n    let cancelled = false\n    const listener = (newTheme: Theme): void => {\n      if (!cancelled) setTheme(newTheme)\n    }\n    themeManagerInstance.addThemeChangeListener(listener)\n    return () => {\n      cancelled = true\n      themeManagerInstance.removeThemeChangeListener(listener)\n    }\n  }, [])\n\n  return (\n    <>\n      <ThemeContext.Provider value={theme}>\n        {props.children}\n      </ThemeContext.Provider>\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n    </>\n  )\n}\n\nexport const useTheme = (): Theme => useContext(ThemeContext)\n"],"names":["ThemeContext","createContext","defaultTheme","ThemeProvider","_a","themeManager","props","__rest","themeManagerInstance","useState","ThemeManager","_b","getCurrentTheme","theme","setTheme","useEffect","cancelled","listener","newTheme","addThemeChangeListener","removeThemeChangeListener","React","createElement","Fragment","Provider","value","children","rel","href","as","type","crossOrigin","useTheme","useContext"],"mappings":";;;;;;IAUaA,YAAY,GAAmBC,KAAa,CAAAA,aAAA,CAAQC,kBAAY,CAAC;AAE9E;;;AAGG;AACI,IAAMC,aAAa,GAAG,SAAAA,CAACC,EAM7B,EAAA;EALC,IAAAC,YAAY,GAAAD,EAAA,CAAAC,YAAA;IACTC,KAAK,GAAAC,KAAAA,CAAAA,MAAA,CAAAH,EAAA,EAFoB,gBAG7B,CADS;EAKD,IAAAI,oBAAoB,GAAIC,KAAAA,CAAAA,QAAQ,CACrC,YAAA;IAAM,OAAAJ,YAAY,IAAI,IAAIK,YAAY,CAAAA,YAAA,CAACR,kBAAY,CAAC;GAAA,CACrD,GAF0B;EAIrB,IAAAS,EAAoB,GAAAF,KAAQ,CAAAA,QAAA,CAChCD,oBAAoB,CAACI,eAAe,CAAE,CAAA,CACvC;IAFMC,KAAK,GAAAF,EAAA,CAAA,CAAA,CAAA;IAAEG,QAAQ,QAErB;EAEDC,KAAAA,CAAAA,SAAS,CAAC,YAAA;IACR,IAAIC,SAAS,GAAG,KAAK;IACrB,IAAMC,QAAQ,GAAG,SAAAA,CAACC,QAAe,EAAA;MAC/B,IAAI,CAACF,SAAS,EAAEF,QAAQ,CAACI,QAAQ,CAAC;IACpC,CAAC;IACDV,oBAAoB,CAACW,sBAAsB,CAACF,QAAQ,CAAC;IACrD,OAAO,YAAA;MACLD,SAAS,GAAG,IAAI;MAChBR,oBAAoB,CAACY,yBAAyB,CAACH,QAAQ,CAAC;IAC1D,CAAC;EACF,CAAA,EAAE,EAAE,CAAC;EAEN,OACEI,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EACEF,KAAC,CAAAC,aAAA,CAAAtB,YAAY,CAACwB,QAAQ,EAAC;IAAAC,KAAK,EAAEZ;EAAK,CAChC,EAAAP,KAAK,CAACoB,QAAQ,CACO,EACxBL,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,oEAAoE;IACzEC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,yEAAyE;IAC9EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,sEAAsE;IAC3EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,uEAAuE;IAC5EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KACE,CAAAC,aAAA,CAAA,MAAA,EAAA;IAAAK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,iFAAiF;IACtFC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CAAA,CACvB,CACD;AAEP,CAAC;AAEM,IAAMC,QAAQ,GAAG,SAAAA,CAAA,EAAa;EAAA,OAAAC,KAAU,CAAAA,UAAA,CAACjC,YAAY,CAAC;AAAxB,CAAA;;;"}
+{"version":3,"file":"ThemeProvider.cjs","sources":["../../../../src/KaizenProvider/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\"\nimport { defaultTheme, Theme as BaseTheme } from \"./themes\"\nimport { useThemeManager } from \"./useThemeManager\"\n\n// We set the generic default value to `any` as SelectContext\n// is instantiated as a constant which does not accept generics.\ntype ThemeContextValue<Theme extends BaseTheme = any> = Theme\n\nexport const ThemeContext = createContext<ThemeContextValue | null>(null)\n\n/**\n * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.\n * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.\n */\nexport const ThemeProvider = <Theme extends BaseTheme = BaseTheme>({\n  theme: userTheme,\n  ...props\n}: {\n  theme?: Theme\n  children: React.ReactNode\n}): JSX.Element => {\n  const { theme } = useThemeManager(userTheme ?? defaultTheme)\n\n  return (\n    <>\n      <ThemeContext.Provider value={theme}>\n        {props.children}\n      </ThemeContext.Provider>\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n    </>\n  )\n}\n\nexport const useTheme = <\n  Theme extends BaseTheme = BaseTheme,\n>(): ThemeContextValue<Theme> => {\n  const context = useContext(ThemeContext)\n\n  if (!context) {\n    throw new Error(\"useTheme must be used within the ThemeContext.Provider\")\n  }\n\n  return context\n}\n"],"names":["ThemeContext","createContext","ThemeProvider","_a","userTheme","theme","props","__rest","useThemeManager","defaultTheme","React","createElement","Fragment","Provider","value","children","rel","href","as","type","crossOrigin","useTheme","context","useContext","Error"],"mappings":";;;;;;IAQaA,YAAY,GAAGC,KAAa,CAAAA,aAAA,CAA2B,IAAI,CAAC;AAEzE;;;AAGG;AACI,IAAMC,aAAa,GAAG,SAAAA,CAAsCC,EAMlE,EAAA;EALC,IAAOC,SAAS,GAAAD,EAAA,CAAAE,KAAA;IACbC,KAAK,GAAAC,KAAAA,CAAAA,MAAA,CAAAJ,EAAA,EAFyD,SAGlE,CADS;EAKA,IAAAE,KAAK,GAAKG,eAAAA,CAAAA,eAAe,CAACJ,SAAS,KAAA,IAAA,IAATA,SAAS,KAAA,KAAA,CAAA,GAATA,SAAS,GAAIK,kBAAY,CAAC,MAA/C;EAEb,OACEC,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,EACEF,KAAC,CAAAC,aAAA,CAAAX,YAAY,CAACa,QAAQ,EAAC;IAAAC,KAAK,EAAET;EAAK,CAChC,EAAAC,KAAK,CAACS,QAAQ,CACO,EACxBL,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,oEAAoE;IACzEC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,yEAAyE;IAC9EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,sEAAsE;IAC3EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,uEAAuE;IAC5EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,EACFV,KACE,CAAAC,aAAA,CAAA,MAAA,EAAA;IAAAK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,iFAAiF;IACtFC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CAAA,CACvB,CACD;AAEP,CAAC;AAEY,IAAAC,QAAQ,GAAG,SAAAA,CAAA,EAAA;EAGtB,IAAMC,OAAO,GAAGC,gBAAU,CAACvB,YAAY,CAAC;EAExC,IAAI,CAACsB,OAAO,EAAE;IACZ,MAAM,IAAIE,KAAK,CAAC,wDAAwD,CAAC;EAC1E;EAED,OAAOF,OAAO;AAChB,CAAA;;;"}

package/dist/cjs/KaizenProvider/ThemeProvider/useThemeManager.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+var React = require('react');
+var designTokens = require('@kaizen/design-tokens');
+var useThemeManager = function (theme, rootElementId, apply) {
+  if (apply === void 0) {
+    apply = true;
+  }
+  var _a = React.useState(null),
+    rootElement = _a[0],
+    setRootElement = _a[1];
+  var applyTheme = function () {
+    if (rootElement) {
+      var cssVariableDefinitions = designTokens.makeCssVariableDefinitionsMap(theme);
+      Object.entries(cssVariableDefinitions).forEach(function (_a) {
+        var key = _a[0],
+          value = _a[1];
+        rootElement.style.setProperty(key, value);
+      });
+    }
+  };
+  React.useEffect(function () {
+    if (typeof window !== "undefined") {
+      setRootElement(rootElementId ? document.getElementById(rootElementId) : document.documentElement);
+    }
+  }, []);
+  React.useEffect(function () {
+    if (apply && rootElement) {
+      applyTheme();
+    }
+  }, [rootElement]);
+  return {
+    theme: theme
+  };
+};
+exports.useThemeManager = useThemeManager;
+//# sourceMappingURL=useThemeManager.cjs.map

package/dist/cjs/KaizenProvider/ThemeProvider/useThemeManager.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThemeManager.cjs","sources":["../../../../src/KaizenProvider/ThemeProvider/useThemeManager.ts"],"sourcesContent":["import { useEffect, useState } from \"react\"\nimport { makeCssVariableDefinitionsMap } from \"@kaizen/design-tokens\"\nimport { Theme as BaseTheme } from \"./themes\"\n\ntype UseThemeManagerReturn<Theme extends BaseTheme = BaseTheme> = {\n  theme: Theme\n}\n\nexport const useThemeManager = <Theme extends BaseTheme = BaseTheme>(\n  theme: Theme,\n  rootElementId?: string,\n  apply: boolean = true\n): UseThemeManagerReturn<Theme> => {\n  const [rootElement, setRootElement] = useState<HTMLElement | null>(null)\n\n  const applyTheme = (): void => {\n    if (rootElement) {\n      const cssVariableDefinitions = makeCssVariableDefinitionsMap(theme)\n      Object.entries(cssVariableDefinitions).forEach(([key, value]) => {\n        rootElement.style.setProperty(key, value)\n      })\n    }\n  }\n\n  useEffect(() => {\n    if (typeof window !== \"undefined\") {\n      setRootElement(\n        rootElementId\n          ? document.getElementById(rootElementId)\n          : document.documentElement\n      )\n    }\n  }, [])\n\n  useEffect(() => {\n    if (apply && rootElement) {\n      applyTheme()\n    }\n  }, [rootElement])\n\n  return {\n    theme,\n  }\n}\n"],"names":["useThemeManager","theme","rootElementId","apply","_a","useState","rootElement","setRootElement","applyTheme","cssVariableDefinitions","makeCssVariableDefinitionsMap","Object","entries","forEach","key","value","style","setProperty","useEffect","window","document","getElementById","documentElement"],"mappings":";;;;IAQaA,eAAe,GAAG,SAAAA,CAC7BC,KAAY,EACZC,aAAsB,EACtBC,KAAqB,EAAA;EAArB,IAAAA,KAAA,KAAA,KAAA,CAAA,EAAA;IAAAA,KAAqB,GAAA,IAAA;EAAA;EAEf,IAAAC,EAAA,GAAgCC,KAAAA,CAAAA,QAAQ,CAAqB,IAAI,CAAC;IAAjEC,WAAW,GAAAF,EAAA,CAAA,CAAA,CAAA;IAAEG,cAAc,GAAAH,EAAA,CAAA,CAAA,CAAsC;EAExE,IAAMI,UAAU,GAAG,SAAAA,CAAA,EAAA;IACjB,IAAIF,WAAW,EAAE;MACf,IAAMG,sBAAsB,GAAGC,0CAA6B,CAACT,KAAK,CAAC;MACnEU,MAAM,CAACC,OAAO,CAACH,sBAAsB,CAAC,CAACI,OAAO,CAAC,UAACT,EAAY,EAAA;YAAXU,GAAG,GAAAV,EAAA,CAAA,CAAA,CAAA;UAAEW,KAAK,GAAAX,EAAA,CAAA,CAAA,CAAA;QACzDE,WAAW,CAACU,KAAK,CAACC,WAAW,CAACH,GAAG,EAAEC,KAAK,CAAC;MAC3C,CAAC,CAAC;IACH;EACH,CAAC;EAEDG,KAAAA,CAAAA,SAAS,CAAC,YAAA;IACR,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;MACjCZ,cAAc,CACZL,aAAa,GACTkB,QAAQ,CAACC,cAAc,CAACnB,aAAa,CAAC,GACtCkB,QAAQ,CAACE,eAAe,CAC7B;IACF;EACF,CAAA,EAAE,EAAE,CAAC;EAENJ,KAAAA,CAAAA,SAAS,CAAC,YAAA;IACR,IAAIf,KAAK,IAAIG,WAAW,EAAE;MACxBE,UAAU,EAAE;IACb;EACH,CAAC,EAAE,CAACF,WAAW,CAAC,CAAC;EAEjB,OAAO;IACLL,KAAK,EAAAA;GACN;AACH,CAAA;"}

package/dist/cjs/dts/KaizenProvider/KaizenProvider.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
-import { ThemeManager } from "./ThemeProvider";
-export type KaizenProviderProps = {
+import { Theme as BaseTheme } from "@kaizen/design-tokens";
+export type KaizenProviderProps<Theme extends BaseTheme = BaseTheme> = {
     children: React.ReactNode;
-    themeManager?: ThemeManager;
+    theme?: Theme;
     locale?: string;
 };
 export declare const KaizenProvider: {
-    ({ children, themeManager, locale, }: KaizenProviderProps): JSX.Element;
+    ({ children, theme, locale, }: KaizenProviderProps): JSX.Element;
     displayName: string;
 };

package/dist/cjs/dts/KaizenProvider/ThemeProvider/ThemeProvider.d.ts

@@ -1,13 +1,14 @@
-import React, { Context } from "react";
-import { ThemeManager } from "./ThemeManager";
-import { Theme } from "./themes";
-export declare const ThemeContext: Context<Theme>;
+import React from "react";
+import { Theme as BaseTheme } from "./themes";
+type ThemeContextValue<Theme extends BaseTheme = any> = Theme;
+export declare const ThemeContext: React.Context<any>;
 /**
  * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.
  * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.
  */
-export declare const ThemeProvider: ({ themeManager, ...props }: {
-    themeManager?: ThemeManager<import("@kaizen/design-tokens").Theme> | undefined;
+export declare const ThemeProvider: <Theme extends BaseTheme = BaseTheme>({ theme: userTheme, ...props }: {
+    theme?: Theme | undefined;
     children: React.ReactNode;
 }) => JSX.Element;
-export declare const useTheme: () => Theme;
+export declare const useTheme: <Theme extends BaseTheme = BaseTheme>() => Theme;
+export {};

package/dist/cjs/dts/KaizenProvider/ThemeProvider/index.d.ts

@@ -1,3 +1,2 @@
 export * from "./ThemeProvider";
-export * from "./ThemeManager";
 export * from "./themes";

package/dist/cjs/dts/KaizenProvider/ThemeProvider/useThemeManager.d.ts

@@ -0,0 +1,6 @@
+import { Theme as BaseTheme } from "./themes";
+type UseThemeManagerReturn<Theme extends BaseTheme = BaseTheme> = {
+    theme: Theme;
+};
+export declare const useThemeManager: <Theme extends BaseTheme = BaseTheme>(theme: Theme, rootElementId?: string, apply?: boolean) => UseThemeManagerReturn<Theme>;
+export {};

package/dist/cjs/index.cjs

@@ -285,7 +285,6 @@ var InputRange = require('./Input/InputRange/InputRange.cjs');
 var InputSearch = require('./Input/InputSearch/InputSearch.cjs');
 var KaizenProvider = require('./KaizenProvider/KaizenProvider.cjs');
 var ThemeProvider = require('./KaizenProvider/ThemeProvider/ThemeProvider.cjs');
-var ThemeManager = require('./KaizenProvider/ThemeProvider/ThemeManager.cjs');
 var index = require('./KaizenProvider/ThemeProvider/themes/index.cjs');
 var Label = require('./Label/Label.cjs');
 var LabelledMessage = require('./LabelledMessage/LabelledMessage.cjs');
@@ -592,7 +591,6 @@ exports.KaizenProvider = KaizenProvider.KaizenProvider;
 exports.ThemeContext = ThemeProvider.ThemeContext;
 exports.ThemeProvider = ThemeProvider.ThemeProvider;
 exports.useTheme = ThemeProvider.useTheme;
-exports.ThemeManager = ThemeManager.ThemeManager;
 exports.defaultTheme = index.defaultTheme;
 exports.Label = Label.Label;
 exports.LabelledMessage = LabelledMessage.LabelledMessage;

package/dist/cjs/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/cjs/index.css

@@ -3,13 +3,13 @@
 .Popover-module_popover__B7k5I{background:var(--color-white,#fff);border-radius:var(--border-solid-border-radius,7px);box-shadow:var(--shadow-large-box-shadow,0 8px 40px rgba(0,0,0,.08),0 3px 9px rgba(0,0,0,.1));box-sizing:border-box;overflow:auto}
 .Main-module_main__hMyB1{z-index:0}
 .Wrapper-module_wrapper__89WmC{background:var(--color-gray-100,#f9f9f9);display:grid;grid-template-rows:min-content 1fr min-content;min-height:100vh;position:relative}
-.FooterRoot-module_footerRoot__N-6nQ{align-items:center;background:var(--color-blue-500,#0168b3);display:grid;flex-grow:1;gap:var(--spacing-16,1rem);grid-template-areas:"prev stepper next";grid-template-columns:1fr 2fr 1fr;justify-content:center;padding:var(--spacing-24,1.5rem) var(--spacing-12,.75rem)}@media (min-width:768px){.FooterRoot-module_footerRoot__N-6nQ{bottom:0;grid-template-columns:1fr 5fr 1fr;padding:var(--spacing-24,1.5rem) var(--spacing-32,2rem);position:sticky;z-index:1}}
-.Actions-module_actions__Prrp0{align-items:center;display:flex;flex-direction:column;flex-grow:1;grid-area:actions;justify-content:center}@media (min-width:768px){.Actions-module_actions__Prrp0{align-items:flex-start;flex-direction:row;justify-content:flex-end;margin-top:calc(var(--spacing-12, .75rem)*-1)}}
-.FooterActions-module_footerAction__v7eL-{display:flex;flex-basis:auto;flex-grow:1}.FooterActions-module_footerActionPrevious__2XByZ{grid-area:"prev";justify-content:start}.FooterActions-module_footerActionNext__IKRta{grid-area:"next";justify-content:end}
 .Titles-module_titles__JYwU0{align-items:center;flex-grow:1;grid-area:titles;justify-content:center}.Titles-module_pageTitle__YDp9S,.Titles-module_titles__JYwU0{display:flex;flex-direction:column}.Titles-module_prefix__40x8n{margin-bottom:var(--spacing-4,.25rem)}.Titles-module_status__huuP7{margin-top:var(--spacing-8,.5rem)}
-.Branding-module_branding__4h-rD{display:flex;flex-grow:1;grid-area:branding;justify-content:center;padding-top:var(--spacing-4,.25rem)}@media (min-width:768px){.Branding-module_branding__4h-rD{justify-content:unset}}.Branding-module_logo__vqqec{flex-basis:7.5rem}
+.FooterActions-module_footerAction__v7eL-{display:flex;flex-basis:auto;flex-grow:1}.FooterActions-module_footerActionPrevious__2XByZ{grid-area:"prev";justify-content:start}.FooterActions-module_footerActionNext__IKRta{grid-area:"next";justify-content:end}
+.FooterRoot-module_footerRoot__N-6nQ{align-items:center;background:var(--color-blue-500,#0168b3);display:grid;flex-grow:1;gap:var(--spacing-16,1rem);grid-template-areas:"prev stepper next";grid-template-columns:1fr 2fr 1fr;justify-content:center;padding:var(--spacing-24,1.5rem) var(--spacing-12,.75rem)}@media (min-width:768px){.FooterRoot-module_footerRoot__N-6nQ{bottom:0;grid-template-columns:1fr 5fr 1fr;padding:var(--spacing-24,1.5rem) var(--spacing-32,2rem);position:sticky;z-index:1}}
 .ProgressStepper-module_stepsContainer__WMxXN{grid-area:stepper;width:100%}.ProgressStepper-module_stepList__b1wWX{align-items:flex-end;display:none;justify-content:center;list-style:none;margin:0;padding:0}@media (min-width:768px){.ProgressStepper-module_stepList__b1wWX{display:flex}}.ProgressStepper-module_step__-Ep19{container:step/inline-size;display:flex;flex-basis:100%;flex-grow:1;justify-content:center;max-width:var(--spacing-96,6rem);overflow-wrap:break-word;position:relative}.ProgressStepper-module_stepContent__B4uFS{align-items:center;display:flex;flex-direction:column}.ProgressStepper-module_stepIndicator__-qEWT{height:1.25rem;position:relative;width:1.25rem}.ProgressStepper-module_stepName__hS4lp{display:none;font-weight:var(--typography-paragraph-bold-font-weight,600);margin-bottom:var(--spacing-12,.75rem);text-align:center}.ProgressStepper-module_stepIcon__0Kh4y{color:var(--color-white,#fff);height:1.25rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:1.25rem}.ProgressStepper-module_stepDivider__KEZPU{border:var(--spacing-1,.0625rem) solid var(--color-white,#fff);border-radius:var(--border-solid-border-radius,7px);display:flex;flex-grow:1;height:0;left:100%;margin:0;min-width:calc(100% - var(--spacing-24, 1.5rem));position:absolute;top:calc(100% - .625rem);transform:translateX(-50%)}[dir=rtl] .ProgressStepper-module_stepDivider__KEZPU{left:unset;right:100%;transform:translateX(50%)}.ProgressStepper-module_stepperDescription__B00hX{display:flex;justify-content:center}@media (min-width:768px){.ProgressStepper-module_stepperDescription__B00hX{height:0;overflow:hidden;position:absolute;width:0}}@container step (min-width: 4.5rem){.ProgressStepper-module_stepName__hS4lp{display:inline}}
+.Branding-module_branding__4h-rD{display:flex;flex-grow:1;grid-area:branding;justify-content:center;padding-top:var(--spacing-4,.25rem)}@media (min-width:768px){.Branding-module_branding__4h-rD{justify-content:unset}}.Branding-module_logo__vqqec{flex-basis:7.5rem}
 .Root-module_root__7DVw5{align-items:center;background-color:var(--color-white,#fff);box-shadow:var(--shadow-small-box-shadow,0 3px 16px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.1));display:grid;flex-grow:1;gap:var(--spacing-16,1rem);grid-template:"branding" min-content "titles" max-content "actions" min-content/1fr;justify-content:center;padding:var(--spacing-24,1.5rem);text-align:center}@media (min-width:768px){.Root-module_root__7DVw5{align-items:start;grid-template:"branding titles actions" min-content/1fr max-content 1fr;position:sticky;top:0;z-index:1}}
+.Actions-module_actions__Prrp0{align-items:center;display:flex;flex-direction:column;flex-grow:1;grid-area:actions;justify-content:center}@media (min-width:768px){.Actions-module_actions__Prrp0{align-items:flex-start;flex-direction:row;justify-content:flex-end;margin-top:calc(var(--spacing-12, .75rem)*-1)}}
 .SVG-module_icon__8J5Ev{display:inline-block;height:20px;width:20px}.SVG-module_icon__8J5Ev>use{pointer-events:none}@media screen and (-ms-high-contrast:active){.SVG-module_icon__8J5Ev{color:#000}}@media screen and (-ms-high-contrast:white-on-black){.SVG-module_icon__8J5Ev{color:#fff}}@media screen and (-ms-high-contrast:black-on-white){.SVG-module_icon__8J5Ev{color:#000}}.SVG-module_inheritSize__Q8iam{display:block;height:inherit;width:inherit}
 .Avatar-module_wrapper__LY2q2{align-items:center;background:var(--color-gray-300,#eaeaec);border-radius:100%;box-sizing:border-box;display:flex;justify-content:center;overflow:hidden}.Avatar-module_wrapper__LY2q2:not(.Avatar-module_small__PeksS){border:3px solid var(--color-white,#fff);box-shadow:var(--shadow-small-box-shadow,0 3px 16px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.1))}.Avatar-module_wrapper__LY2q2.Avatar-module_personal__2U7--{background:var(--color-orange-100,#fff0e8)}.Avatar-module_wrapper__LY2q2.Avatar-module_otherUser__b-drl{background:var(--color-gray-300,#eaeaec)}.Avatar-module_wrapper__LY2q2.Avatar-module_company__2qtJE{background:var(--color-white,#fff);border:0;border-radius:var(--border-solid-border-radius,7px);padding:6px}.Avatar-module_wrapper__LY2q2.Avatar-module_small__PeksS{height:1.25rem;width:1.25rem}.Avatar-module_wrapper__LY2q2.Avatar-module_small__PeksS .Avatar-module_initials__VDY2Q{margin-bottom:-1px}.Avatar-module_wrapper__LY2q2.Avatar-module_small__PeksS.Avatar-module_company__2qtJE{padding:0}.Avatar-module_wrapper__LY2q2.Avatar-module_medium__Vy3V8{height:3rem;width:3rem}.Avatar-module_wrapper__LY2q2.Avatar-module_medium__Vy3V8 .Avatar-module_initials__VDY2Q{margin-bottom:-1px}.Avatar-module_wrapper__LY2q2.Avatar-module_large__qiNWs{height:4.5rem;width:4.5rem}.Avatar-module_wrapper__LY2q2.Avatar-module_xlarge__Vx4IG{height:6rem;width:6rem}.Avatar-module_wrapper__LY2q2.Avatar-module_xxlarge__oOoGq{height:7.75rem;width:7.75rem}.Avatar-module_wrapper__LY2q2 .Avatar-module_initials__VDY2Q{speak-as:spell-out;border-bottom:none;text-decoration:none}.Avatar-module_avatarImage__FuULy{height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.Avatar-module_loading__i9V-D .Avatar-module_avatarImage__FuULy{display:none}.Avatar-module_companyAvatarImage__7rlfG{border-radius:4px;box-sizing:border-box;-o-object-fit:contain;object-fit:contain}.Avatar-module_fallbackIcon__MPWxq{color:rgba(var(--color-purple-800-rgb,47,36,56),.7);width:28px}.Avatar-module_xxlarge__oOoGq .Avatar-module_fallbackIcon__MPWxq{width:75px}.Avatar-module_xlarge__Vx4IG .Avatar-module_fallbackIcon__MPWxq{width:60px}.Avatar-module_large__qiNWs .Avatar-module_fallbackIcon__MPWxq{width:35px}.Avatar-module_medium__Vy3V8 .Avatar-module_fallbackIcon__MPWxq{margin-bottom:-1px;width:25px}.Avatar-module_small__PeksS .Avatar-module_fallbackIcon__MPWxq{margin-bottom:-1px;width:10px}.Avatar-module_initials__VDY2Q{box-sizing:border-box;color:var(--color-purple-800,#2f2438);font-family:var(--typography-heading-1-font-family,"Inter","Noto Sans",Helvetica,Arial,sans-serif);font-size:22px;font-weight:var(--typography-heading-1-font-weight,700);letter-spacing:var(--typography-heading-3-letter-spacing,normal);padding-left:5px;padding-right:5px;text-align:center;width:100%}.Avatar-module_initials__VDY2Q:not(.Avatar-module_longName__31Yuf):before{content:"";display:block;margin-top:-.001em}.Avatar-module_xlarge__Vx4IG .Avatar-module_initials__VDY2Q,.Avatar-module_xxlarge__oOoGq .Avatar-module_initials__VDY2Q{font-size:34px;letter-spacing:var(--typography-heading-1-letter-spacing,normal)}.Avatar-module_medium__Vy3V8 .Avatar-module_initials__VDY2Q{font-size:16px}.Avatar-module_medium__Vy3V8 .Avatar-module_initials__VDY2Q,.Avatar-module_small__PeksS .Avatar-module_initials__VDY2Q{font-weight:var(--typography-heading-5-font-weight,600);letter-spacing:var(--typography-heading-5-letter-spacing,normal)}.Avatar-module_small__PeksS .Avatar-module_initials__VDY2Q{font-size:8px}
 .AvatarGroup-module_AvatarGroup__bdL0o{display:inline-flex;list-style:none;margin:0;padding:0}.AvatarGroup-module_small__7uv8k .AvatarGroup-module_AvatarGroupItem__xQol-+.AvatarGroup-module_AvatarGroupItem__xQol-{margin-inline-start:-.625rem}[dir=rtl] .AvatarGroup-module_small__7uv8k .AvatarGroup-module_AvatarGroupItem__xQol-+.AvatarGroup-module_AvatarGroupItem__xQol-{margin-left:0}.AvatarGroup-module_medium__af52y .AvatarGroup-module_AvatarGroupItem__xQol-+.AvatarGroup-module_AvatarGroupItem__xQol-{margin-inline-start:-1.5rem}[dir=rtl] .AvatarGroup-module_medium__af52y .AvatarGroup-module_AvatarGroupItem__xQol-+.AvatarGroup-module_AvatarGroupItem__xQol-{margin-left:0}.AvatarGroup-module_large__HN9Yy .AvatarGroup-module_AvatarGroupItem__xQol-+.AvatarGroup-module_AvatarGroupItem__xQol-{margin-inline-start:-2.25rem}[dir=rtl] .AvatarGroup-module_large__HN9Yy .AvatarGroup-module_AvatarGroupItem__xQol-+.AvatarGroup-module_AvatarGroupItem__xQol-{margin-left:0}.AvatarGroup-module_AvatarCounter__PKFzl{align-items:center;background:var(--color-gray-300,#eaeaec);border:3px solid var(--color-white,#fff);border-radius:100%;box-shadow:var(--shadow-small-box-shadow,0 3px 16px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.1));box-sizing:border-box;display:flex;justify-content:center;overflow:hidden}.AvatarGroup-module_small__7uv8k .AvatarGroup-module_AvatarCounter__PKFzl{border:none;box-shadow:none;font-size:.5rem;height:1.25rem;width:1.25rem}.AvatarGroup-module_medium__af52y .AvatarGroup-module_AvatarCounter__PKFzl,.AvatarGroup-module_small__7uv8k .AvatarGroup-module_AvatarCounter__PKFzl{font-family:var(--typography-heading-5-font-family,"Inter","Noto Sans",Helvetica,Arial,sans-serif);font-weight:var(--typography-heading-5-font-weight,600);letter-spacing:var(--typography-heading-5-letter-spacing,normal)}.AvatarGroup-module_medium__af52y .AvatarGroup-module_AvatarCounter__PKFzl{font-size:var(--typography-heading-5-font-size,1rem);height:3rem;width:3rem}.AvatarGroup-module_large__HN9Yy .AvatarGroup-module_AvatarCounter__PKFzl{font-family:var(--typography-heading-3-font-family,"Inter","Noto Sans",Helvetica,Arial,sans-serif);font-size:var(--typography-heading-3-font-size,1.375rem);font-weight:var(--typography-heading-3-font-weight,700);height:4.5rem;letter-spacing:var(--typography-heading-3-letter-spacing,normal);width:4.5rem}[dir=rtl] .AvatarGroup-module_AvatarCounter__PKFzl{direction:ltr;margin-left:0}

package/dist/esm/KaizenProvider/KaizenProvider.mjs

@@ -1,17 +1,16 @@
 import React from 'react';
 import { OptionalIntlProvider } from './OptionalIntlProvider/OptionalIntlProvider.mjs';
 import { ThemeProvider } from './ThemeProvider/ThemeProvider.mjs';
-import '@kaizen/design-tokens';
 const KaizenProvider = /*#__PURE__*/function () {
   const KaizenProvider = function (_a) {
     var children = _a.children,
-      themeManager = _a.themeManager,
+      theme = _a.theme,
       _b = _a.locale,
       locale = _b === void 0 ? "en" : _b;
     return /*#__PURE__*/React.createElement(OptionalIntlProvider, {
       locale: locale
     }, /*#__PURE__*/React.createElement(ThemeProvider, {
-      themeManager: themeManager
+      theme: theme
     }, children));
   };
   KaizenProvider.displayName = "KaizenProvider";

package/dist/esm/KaizenProvider/KaizenProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"KaizenProvider.mjs","sources":["../../../src/KaizenProvider/KaizenProvider.tsx"],"sourcesContent":["import React from \"react\"\nimport { OptionalIntlProvider } from \"./OptionalIntlProvider\"\nimport { ThemeProvider, ThemeManager } from \"./ThemeProvider\"\n\nexport type KaizenProviderProps = {\n  children: React.ReactNode\n  themeManager?: ThemeManager\n  locale?: string\n}\n\nexport const KaizenProvider = ({\n  children,\n  themeManager,\n  locale = \"en\",\n}: KaizenProviderProps): JSX.Element => (\n  <OptionalIntlProvider locale={locale}>\n    <ThemeProvider themeManager={themeManager}>{children}</ThemeProvider>\n  </OptionalIntlProvider>\n)\n\nKaizenProvider.displayName = \"KaizenProvider\"\n"],"names":["KaizenProvider","_a","children","themeManager","_b","locale","React","createElement","OptionalIntlProvider","ThemeProvider","displayName"],"mappings":";;;;MAUaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAIT,EAAA;QAHpBC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,YAAY,GAAAF,EAAA,CAAAE,YAAA;MACZC,cAAa;MAAbC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,IAAI,GAAAA,EAAA;IACyB,oBACtCE,KAAC,CAAAC,aAAA,CAAAC,oBAAoB,EAAC;MAAAH,MAAM,EAAEA;IAAM,CAAA,eAClCC,KAAC,CAAAC,aAAA,CAAAE,aAAa;MAACN,YAAY,EAAEA;IAAe,CAAA,EAAAD,QAAQ,CAAiB,CAChD;EAHe,CAIvC;EAEDF,cAAc,CAACU,WAAW,GAAG,gBAAgB;EAAA,OAVhCV,cAAc;AAAA;"}
+{"version":3,"file":"KaizenProvider.mjs","sources":["../../../src/KaizenProvider/KaizenProvider.tsx"],"sourcesContent":["import React from \"react\"\nimport { Theme as BaseTheme } from \"@kaizen/design-tokens\"\nimport { OptionalIntlProvider } from \"./OptionalIntlProvider\"\nimport { ThemeProvider } from \"./ThemeProvider\"\n\nexport type KaizenProviderProps<Theme extends BaseTheme = BaseTheme> = {\n  children: React.ReactNode\n  theme?: Theme\n  locale?: string\n}\n\nexport const KaizenProvider = ({\n  children,\n  theme,\n  locale = \"en\",\n}: KaizenProviderProps): JSX.Element => (\n  <OptionalIntlProvider locale={locale}>\n    <ThemeProvider theme={theme}>{children}</ThemeProvider>\n  </OptionalIntlProvider>\n)\n\nKaizenProvider.displayName = \"KaizenProvider\"\n"],"names":["KaizenProvider","_a","children","theme","_b","locale","React","createElement","OptionalIntlProvider","ThemeProvider","displayName"],"mappings":";;;MAWaA,cAAc;EAAA,MAAdA,cAAc,GAAG,SAAAA,CAACC,EAIT,EAAA;QAHpBC,QAAQ,GAAAD,EAAA,CAAAC,QAAA;MACRC,KAAK,GAAAF,EAAA,CAAAE,KAAA;MACLC,cAAa;MAAbC,MAAM,GAAGD,EAAA,KAAA,KAAA,CAAA,GAAA,IAAI,GAAAA,EAAA;IACyB,oBACtCE,KAAC,CAAAC,aAAA,CAAAC,oBAAoB,EAAC;MAAAH,MAAM,EAAEA;IAAM,CAAA,eAClCC,KAAC,CAAAC,aAAA,CAAAE,aAAa;MAACN,KAAK,EAAEA;IAAQ,CAAA,EAAAD,QAAQ,CAAiB,CAClC;EAHe,CAIvC;EAEDF,cAAc,CAACU,WAAW,GAAG,gBAAgB;EAAA,OAVhCV,cAAc;AAAA;"}

package/dist/esm/KaizenProvider/ThemeProvider/ThemeProvider.mjs

@@ -1,32 +1,16 @@
 import { __rest } from 'tslib';
-import React, { createContext, useState, useEffect, useContext } from 'react';
-import { ThemeManager } from './ThemeManager.mjs';
+import React, { createContext, useContext } from 'react';
 import { defaultTheme } from './themes/index.mjs';
-var ThemeContext = /*#__PURE__*/createContext(defaultTheme);
+import { useThemeManager } from './useThemeManager.mjs';
+var ThemeContext = /*#__PURE__*/createContext(null);
 /**
  * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.
  * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.
  */
 var ThemeProvider = function (_a) {
-  var themeManager = _a.themeManager,
-    props = __rest(_a, ["themeManager"]);
-  var themeManagerInstance = useState(function () {
-    return themeManager || new ThemeManager(defaultTheme);
-  })[0];
-  var _b = useState(themeManagerInstance.getCurrentTheme()),
-    theme = _b[0],
-    setTheme = _b[1];
-  useEffect(function () {
-    var cancelled = false;
-    var listener = function (newTheme) {
-      if (!cancelled) setTheme(newTheme);
-    };
-    themeManagerInstance.addThemeChangeListener(listener);
-    return function () {
-      cancelled = true;
-      themeManagerInstance.removeThemeChangeListener(listener);
-    };
-  }, []);
+  var userTheme = _a.theme,
+    props = __rest(_a, ["theme"]);
+  var theme = useThemeManager(userTheme !== null && userTheme !== void 0 ? userTheme : defaultTheme).theme;
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(ThemeContext.Provider, {
     value: theme
   }, props.children), /*#__PURE__*/React.createElement("link", {
@@ -62,7 +46,11 @@ var ThemeProvider = function (_a) {
   }));
 };
 var useTheme = function () {
-  return useContext(ThemeContext);
+  var context = useContext(ThemeContext);
+  if (!context) {
+    throw new Error("useTheme must be used within the ThemeContext.Provider");
+  }
+  return context;
 };
 export { ThemeContext, ThemeProvider, useTheme };
 //# sourceMappingURL=ThemeProvider.mjs.map

package/dist/esm/KaizenProvider/ThemeProvider/ThemeProvider.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.mjs","sources":["../../../../src/KaizenProvider/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import React, {\n  Context,\n  createContext,\n  useContext,\n  useEffect,\n  useState,\n} from \"react\"\nimport { ThemeManager } from \"./ThemeManager\"\nimport { defaultTheme, Theme } from \"./themes\"\n\nexport const ThemeContext: Context<Theme> = createContext<Theme>(defaultTheme)\n\n/**\n * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.\n * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.\n */\nexport const ThemeProvider = ({\n  themeManager,\n  ...props\n}: {\n  themeManager?: ThemeManager\n  children: React.ReactNode\n}): JSX.Element => {\n  const [themeManagerInstance] = useState<ThemeManager>(\n    () => themeManager || new ThemeManager(defaultTheme)\n  )\n\n  const [theme, setTheme] = useState<Theme>(\n    themeManagerInstance.getCurrentTheme()\n  )\n\n  useEffect(() => {\n    let cancelled = false\n    const listener = (newTheme: Theme): void => {\n      if (!cancelled) setTheme(newTheme)\n    }\n    themeManagerInstance.addThemeChangeListener(listener)\n    return () => {\n      cancelled = true\n      themeManagerInstance.removeThemeChangeListener(listener)\n    }\n  }, [])\n\n  return (\n    <>\n      <ThemeContext.Provider value={theme}>\n        {props.children}\n      </ThemeContext.Provider>\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n    </>\n  )\n}\n\nexport const useTheme = (): Theme => useContext(ThemeContext)\n"],"names":["ThemeContext","createContext","defaultTheme","ThemeProvider","_a","themeManager","props","__rest","themeManagerInstance","useState","ThemeManager","_b","getCurrentTheme","theme","setTheme","useEffect","cancelled","listener","newTheme","addThemeChangeListener","removeThemeChangeListener","React","createElement","Fragment","Provider","value","children","rel","href","as","type","crossOrigin","useTheme","useContext"],"mappings":";;;;IAUaA,YAAY,gBAAmBC,aAAa,CAAQC,YAAY,CAAC;AAE9E;;;AAGG;AACI,IAAMC,aAAa,GAAG,SAAAA,CAACC,EAM7B,EAAA;EALC,IAAAC,YAAY,GAAAD,EAAA,CAAAC,YAAA;IACTC,KAAK,GAAAC,MAAA,CAAAH,EAAA,EAFoB,gBAG7B,CADS;EAKD,IAAAI,oBAAoB,GAAIC,QAAQ,CACrC,YAAA;IAAM,OAAAJ,YAAY,IAAI,IAAIK,YAAY,CAACR,YAAY,CAAC;GAAA,CACrD,GAF0B;EAIrB,IAAAS,EAAoB,GAAAF,QAAQ,CAChCD,oBAAoB,CAACI,eAAe,CAAE,CAAA,CACvC;IAFMC,KAAK,GAAAF,EAAA,CAAA,CAAA,CAAA;IAAEG,QAAQ,QAErB;EAEDC,SAAS,CAAC,YAAA;IACR,IAAIC,SAAS,GAAG,KAAK;IACrB,IAAMC,QAAQ,GAAG,SAAAA,CAACC,QAAe,EAAA;MAC/B,IAAI,CAACF,SAAS,EAAEF,QAAQ,CAACI,QAAQ,CAAC;IACpC,CAAC;IACDV,oBAAoB,CAACW,sBAAsB,CAACF,QAAQ,CAAC;IACrD,OAAO,YAAA;MACLD,SAAS,GAAG,IAAI;MAChBR,oBAAoB,CAACY,yBAAyB,CAACH,QAAQ,CAAC;IAC1D,CAAC;EACF,CAAA,EAAE,EAAE,CAAC;EAEN,oBACEI,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,eACEF,KAAC,CAAAC,aAAA,CAAAtB,YAAY,CAACwB,QAAQ,EAAC;IAAAC,KAAK,EAAEZ;EAAK,CAChC,EAAAP,KAAK,CAACoB,QAAQ,CACO,eACxBL,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,oEAAoE;IACzEC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,yEAAyE;IAC9EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,sEAAsE;IAC3EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,uEAAuE;IAC5EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KACE,CAAAC,aAAA,CAAA,MAAA,EAAA;IAAAK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,iFAAiF;IACtFC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CAAA,CACvB,CACD;AAEP,CAAC;AAEM,IAAMC,QAAQ,GAAG,SAAAA,CAAA,EAAa;EAAA,OAAAC,UAAU,CAACjC,YAAY,CAAC;AAAxB,CAAA;"}
+{"version":3,"file":"ThemeProvider.mjs","sources":["../../../../src/KaizenProvider/ThemeProvider/ThemeProvider.tsx"],"sourcesContent":["import React, { createContext, useContext } from \"react\"\nimport { defaultTheme, Theme as BaseTheme } from \"./themes\"\nimport { useThemeManager } from \"./useThemeManager\"\n\n// We set the generic default value to `any` as SelectContext\n// is instantiated as a constant which does not accept generics.\ntype ThemeContextValue<Theme extends BaseTheme = any> = Theme\n\nexport const ThemeContext = createContext<ThemeContextValue | null>(null)\n\n/**\n * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.\n * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.\n */\nexport const ThemeProvider = <Theme extends BaseTheme = BaseTheme>({\n  theme: userTheme,\n  ...props\n}: {\n  theme?: Theme\n  children: React.ReactNode\n}): JSX.Element => {\n  const { theme } = useThemeManager(userTheme ?? defaultTheme)\n\n  return (\n    <>\n      <ThemeContext.Provider value={theme}>\n        {props.children}\n      </ThemeContext.Provider>\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-demi-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-medium.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/inter/inter-regular.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n      <link\n        rel=\"preload\"\n        href=\"https://d1e7r7b0lb8p4d.cloudfront.net/fonts/tiempos/tiempos-headline-bold.woff2\"\n        as=\"font\"\n        type=\"font/woff2\"\n        crossOrigin=\"anonymous\"\n      />\n    </>\n  )\n}\n\nexport const useTheme = <\n  Theme extends BaseTheme = BaseTheme,\n>(): ThemeContextValue<Theme> => {\n  const context = useContext(ThemeContext)\n\n  if (!context) {\n    throw new Error(\"useTheme must be used within the ThemeContext.Provider\")\n  }\n\n  return context\n}\n"],"names":["ThemeContext","createContext","ThemeProvider","_a","userTheme","theme","props","__rest","useThemeManager","defaultTheme","React","createElement","Fragment","Provider","value","children","rel","href","as","type","crossOrigin","useTheme","context","useContext","Error"],"mappings":";;;;IAQaA,YAAY,gBAAGC,aAAa,CAA2B,IAAI,CAAC;AAEzE;;;AAGG;AACI,IAAMC,aAAa,GAAG,SAAAA,CAAsCC,EAMlE,EAAA;EALC,IAAOC,SAAS,GAAAD,EAAA,CAAAE,KAAA;IACbC,KAAK,GAAAC,MAAA,CAAAJ,EAAA,EAFyD,SAGlE,CADS;EAKA,IAAAE,KAAK,GAAKG,eAAe,CAACJ,SAAS,KAAA,IAAA,IAATA,SAAS,KAAA,KAAA,CAAA,GAATA,SAAS,GAAIK,YAAY,CAAC,MAA/C;EAEb,oBACEC,KAAA,CAAAC,aAAA,CAAAD,KAAA,CAAAE,QAAA,EAAA,IAAA,eACEF,KAAC,CAAAC,aAAA,CAAAX,YAAY,CAACa,QAAQ,EAAC;IAAAC,KAAK,EAAET;EAAK,CAChC,EAAAC,KAAK,CAACS,QAAQ,CACO,eACxBL,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,oEAAoE;IACzEC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,yEAAyE;IAC9EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,sEAAsE;IAC3EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;IACEK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,uEAAuE;IAC5EC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CACvB,CAAA,eACFV,KACE,CAAAC,aAAA,CAAA,MAAA,EAAA;IAAAK,GAAG,EAAC,SAAS;IACbC,IAAI,EAAC,iFAAiF;IACtFC,EAAE,EAAC,MAAM;IACTC,IAAI,EAAC,YAAY;IACjBC,WAAW,EAAC;EAAW,CAAA,CACvB,CACD;AAEP,CAAC;AAEY,IAAAC,QAAQ,GAAG,SAAAA,CAAA,EAAA;EAGtB,IAAMC,OAAO,GAAGC,UAAU,CAACvB,YAAY,CAAC;EAExC,IAAI,CAACsB,OAAO,EAAE;IACZ,MAAM,IAAIE,KAAK,CAAC,wDAAwD,CAAC;EAC1E;EAED,OAAOF,OAAO;AAChB,CAAA;"}

package/dist/esm/KaizenProvider/ThemeProvider/useThemeManager.mjs

@@ -0,0 +1,35 @@
+import { useState, useEffect } from 'react';
+import { makeCssVariableDefinitionsMap } from '@kaizen/design-tokens';
+var useThemeManager = function (theme, rootElementId, apply) {
+  if (apply === void 0) {
+    apply = true;
+  }
+  var _a = useState(null),
+    rootElement = _a[0],
+    setRootElement = _a[1];
+  var applyTheme = function () {
+    if (rootElement) {
+      var cssVariableDefinitions = makeCssVariableDefinitionsMap(theme);
+      Object.entries(cssVariableDefinitions).forEach(function (_a) {
+        var key = _a[0],
+          value = _a[1];
+        rootElement.style.setProperty(key, value);
+      });
+    }
+  };
+  useEffect(function () {
+    if (typeof window !== "undefined") {
+      setRootElement(rootElementId ? document.getElementById(rootElementId) : document.documentElement);
+    }
+  }, []);
+  useEffect(function () {
+    if (apply && rootElement) {
+      applyTheme();
+    }
+  }, [rootElement]);
+  return {
+    theme: theme
+  };
+};
+export { useThemeManager };
+//# sourceMappingURL=useThemeManager.mjs.map

package/dist/esm/KaizenProvider/ThemeProvider/useThemeManager.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useThemeManager.mjs","sources":["../../../../src/KaizenProvider/ThemeProvider/useThemeManager.ts"],"sourcesContent":["import { useEffect, useState } from \"react\"\nimport { makeCssVariableDefinitionsMap } from \"@kaizen/design-tokens\"\nimport { Theme as BaseTheme } from \"./themes\"\n\ntype UseThemeManagerReturn<Theme extends BaseTheme = BaseTheme> = {\n  theme: Theme\n}\n\nexport const useThemeManager = <Theme extends BaseTheme = BaseTheme>(\n  theme: Theme,\n  rootElementId?: string,\n  apply: boolean = true\n): UseThemeManagerReturn<Theme> => {\n  const [rootElement, setRootElement] = useState<HTMLElement | null>(null)\n\n  const applyTheme = (): void => {\n    if (rootElement) {\n      const cssVariableDefinitions = makeCssVariableDefinitionsMap(theme)\n      Object.entries(cssVariableDefinitions).forEach(([key, value]) => {\n        rootElement.style.setProperty(key, value)\n      })\n    }\n  }\n\n  useEffect(() => {\n    if (typeof window !== \"undefined\") {\n      setRootElement(\n        rootElementId\n          ? document.getElementById(rootElementId)\n          : document.documentElement\n      )\n    }\n  }, [])\n\n  useEffect(() => {\n    if (apply && rootElement) {\n      applyTheme()\n    }\n  }, [rootElement])\n\n  return {\n    theme,\n  }\n}\n"],"names":["useThemeManager","theme","rootElementId","apply","_a","useState","rootElement","setRootElement","applyTheme","cssVariableDefinitions","makeCssVariableDefinitionsMap","Object","entries","forEach","key","value","style","setProperty","useEffect","window","document","getElementById","documentElement"],"mappings":";;IAQaA,eAAe,GAAG,SAAAA,CAC7BC,KAAY,EACZC,aAAsB,EACtBC,KAAqB,EAAA;EAArB,IAAAA,KAAA,KAAA,KAAA,CAAA,EAAA;IAAAA,KAAqB,GAAA,IAAA;EAAA;EAEf,IAAAC,EAAA,GAAgCC,QAAQ,CAAqB,IAAI,CAAC;IAAjEC,WAAW,GAAAF,EAAA,CAAA,CAAA,CAAA;IAAEG,cAAc,GAAAH,EAAA,CAAA,CAAA,CAAsC;EAExE,IAAMI,UAAU,GAAG,SAAAA,CAAA,EAAA;IACjB,IAAIF,WAAW,EAAE;MACf,IAAMG,sBAAsB,GAAGC,6BAA6B,CAACT,KAAK,CAAC;MACnEU,MAAM,CAACC,OAAO,CAACH,sBAAsB,CAAC,CAACI,OAAO,CAAC,UAACT,EAAY,EAAA;YAAXU,GAAG,GAAAV,EAAA,CAAA,CAAA,CAAA;UAAEW,KAAK,GAAAX,EAAA,CAAA,CAAA,CAAA;QACzDE,WAAW,CAACU,KAAK,CAACC,WAAW,CAACH,GAAG,EAAEC,KAAK,CAAC;MAC3C,CAAC,CAAC;IACH;EACH,CAAC;EAEDG,SAAS,CAAC,YAAA;IACR,IAAI,OAAOC,MAAM,KAAK,WAAW,EAAE;MACjCZ,cAAc,CACZL,aAAa,GACTkB,QAAQ,CAACC,cAAc,CAACnB,aAAa,CAAC,GACtCkB,QAAQ,CAACE,eAAe,CAC7B;IACF;EACF,CAAA,EAAE,EAAE,CAAC;EAENJ,SAAS,CAAC,YAAA;IACR,IAAIf,KAAK,IAAIG,WAAW,EAAE;MACxBE,UAAU,EAAE;IACb;EACH,CAAC,EAAE,CAACF,WAAW,CAAC,CAAC;EAEjB,OAAO;IACLL,KAAK,EAAAA;GACN;AACH,CAAA;"}

package/dist/esm/dts/KaizenProvider/KaizenProvider.d.ts

@@ -1,11 +1,11 @@
 import React from "react";
-import { ThemeManager } from "./ThemeProvider";
-export type KaizenProviderProps = {
+import { Theme as BaseTheme } from "@kaizen/design-tokens";
+export type KaizenProviderProps<Theme extends BaseTheme = BaseTheme> = {
     children: React.ReactNode;
-    themeManager?: ThemeManager;
+    theme?: Theme;
     locale?: string;
 };
 export declare const KaizenProvider: {
-    ({ children, themeManager, locale, }: KaizenProviderProps): JSX.Element;
+    ({ children, theme, locale, }: KaizenProviderProps): JSX.Element;
     displayName: string;
 };

package/dist/esm/dts/KaizenProvider/ThemeProvider/ThemeProvider.d.ts

@@ -1,13 +1,14 @@
-import React, { Context } from "react";
-import { ThemeManager } from "./ThemeManager";
-import { Theme } from "./themes";
-export declare const ThemeContext: Context<Theme>;
+import React from "react";
+import { Theme as BaseTheme } from "./themes";
+type ThemeContextValue<Theme extends BaseTheme = any> = Theme;
+export declare const ThemeContext: React.Context<any>;
 /**
  * Wrap your application in this provider using a ThemeManager, to synchronise it with a react context.
  * This allows child react elements to more easily use theme variables, using the {@link useTheme} hook.
  */
-export declare const ThemeProvider: ({ themeManager, ...props }: {
-    themeManager?: ThemeManager<import("@kaizen/design-tokens").Theme> | undefined;
+export declare const ThemeProvider: <Theme extends BaseTheme = BaseTheme>({ theme: userTheme, ...props }: {
+    theme?: Theme | undefined;
     children: React.ReactNode;
 }) => JSX.Element;
-export declare const useTheme: () => Theme;
+export declare const useTheme: <Theme extends BaseTheme = BaseTheme>() => Theme;
+export {};

package/dist/esm/dts/KaizenProvider/ThemeProvider/index.d.ts

@@ -1,3 +1,2 @@
 export * from "./ThemeProvider";
-export * from "./ThemeManager";
 export * from "./themes";

package/dist/esm/dts/KaizenProvider/ThemeProvider/useThemeManager.d.ts

@@ -0,0 +1,6 @@
+import { Theme as BaseTheme } from "./themes";
+type UseThemeManagerReturn<Theme extends BaseTheme = BaseTheme> = {
+    theme: Theme;
+};
+export declare const useThemeManager: <Theme extends BaseTheme = BaseTheme>(theme: Theme, rootElementId?: string, apply?: boolean) => UseThemeManagerReturn<Theme>;
+export {};

package/dist/esm/index.css

@@ -4,9 +4,9 @@
 .Popover-module_popover__B7k5I{background:var(--color-white,#fff);border-radius:var(--border-solid-border-radius,7px);box-shadow:var(--shadow-large-box-shadow,0 8px 40px rgba(0,0,0,.08),0 3px 9px rgba(0,0,0,.1));box-sizing:border-box;overflow:auto}
 .Wrapper-module_wrapper__89WmC{background:var(--color-gray-100,#f9f9f9);display:grid;grid-template-rows:min-content 1fr min-content;min-height:100vh;position:relative}
 .FooterRoot-module_footerRoot__N-6nQ{align-items:center;background:var(--color-blue-500,#0168b3);display:grid;flex-grow:1;gap:var(--spacing-16,1rem);grid-template-areas:"prev stepper next";grid-template-columns:1fr 2fr 1fr;justify-content:center;padding:var(--spacing-24,1.5rem) var(--spacing-12,.75rem)}@media (min-width:768px){.FooterRoot-module_footerRoot__N-6nQ{bottom:0;grid-template-columns:1fr 5fr 1fr;padding:var(--spacing-24,1.5rem) var(--spacing-32,2rem);position:sticky;z-index:1}}
+.FooterActions-module_footerAction__v7eL-{display:flex;flex-basis:auto;flex-grow:1}.FooterActions-module_footerActionPrevious__2XByZ{grid-area:"prev";justify-content:start}.FooterActions-module_footerActionNext__IKRta{grid-area:"next";justify-content:end}
 .Titles-module_titles__JYwU0{align-items:center;flex-grow:1;grid-area:titles;justify-content:center}.Titles-module_pageTitle__YDp9S,.Titles-module_titles__JYwU0{display:flex;flex-direction:column}.Titles-module_prefix__40x8n{margin-bottom:var(--spacing-4,.25rem)}.Titles-module_status__huuP7{margin-top:var(--spacing-8,.5rem)}
 .Actions-module_actions__Prrp0{align-items:center;display:flex;flex-direction:column;flex-grow:1;grid-area:actions;justify-content:center}@media (min-width:768px){.Actions-module_actions__Prrp0{align-items:flex-start;flex-direction:row;justify-content:flex-end;margin-top:calc(var(--spacing-12, .75rem)*-1)}}
-.FooterActions-module_footerAction__v7eL-{display:flex;flex-basis:auto;flex-grow:1}.FooterActions-module_footerActionPrevious__2XByZ{grid-area:"prev";justify-content:start}.FooterActions-module_footerActionNext__IKRta{grid-area:"next";justify-content:end}
 .Branding-module_branding__4h-rD{display:flex;flex-grow:1;grid-area:branding;justify-content:center;padding-top:var(--spacing-4,.25rem)}@media (min-width:768px){.Branding-module_branding__4h-rD{justify-content:unset}}.Branding-module_logo__vqqec{flex-basis:7.5rem}
 .ProgressStepper-module_stepsContainer__WMxXN{grid-area:stepper;width:100%}.ProgressStepper-module_stepList__b1wWX{align-items:flex-end;display:none;justify-content:center;list-style:none;margin:0;padding:0}@media (min-width:768px){.ProgressStepper-module_stepList__b1wWX{display:flex}}.ProgressStepper-module_step__-Ep19{container:step/inline-size;display:flex;flex-basis:100%;flex-grow:1;justify-content:center;max-width:var(--spacing-96,6rem);overflow-wrap:break-word;position:relative}.ProgressStepper-module_stepContent__B4uFS{align-items:center;display:flex;flex-direction:column}.ProgressStepper-module_stepIndicator__-qEWT{height:1.25rem;position:relative;width:1.25rem}.ProgressStepper-module_stepName__hS4lp{display:none;font-weight:var(--typography-paragraph-bold-font-weight,600);margin-bottom:var(--spacing-12,.75rem);text-align:center}.ProgressStepper-module_stepIcon__0Kh4y{color:var(--color-white,#fff);height:1.25rem;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);width:1.25rem}.ProgressStepper-module_stepDivider__KEZPU{border:var(--spacing-1,.0625rem) solid var(--color-white,#fff);border-radius:var(--border-solid-border-radius,7px);display:flex;flex-grow:1;height:0;left:100%;margin:0;min-width:calc(100% - var(--spacing-24, 1.5rem));position:absolute;top:calc(100% - .625rem);transform:translateX(-50%)}[dir=rtl] .ProgressStepper-module_stepDivider__KEZPU{left:unset;right:100%;transform:translateX(50%)}.ProgressStepper-module_stepperDescription__B00hX{display:flex;justify-content:center}@media (min-width:768px){.ProgressStepper-module_stepperDescription__B00hX{height:0;overflow:hidden;position:absolute;width:0}}@container step (min-width: 4.5rem){.ProgressStepper-module_stepName__hS4lp{display:inline}}
 .Root-module_root__7DVw5{align-items:center;background-color:var(--color-white,#fff);box-shadow:var(--shadow-small-box-shadow,0 3px 16px rgba(0,0,0,.06),0 1px 3px rgba(0,0,0,.1));display:grid;flex-grow:1;gap:var(--spacing-16,1rem);grid-template:"branding" min-content "titles" max-content "actions" min-content/1fr;justify-content:center;padding:var(--spacing-24,1.5rem);text-align:center}@media (min-width:768px){.Root-module_root__7DVw5{align-items:start;grid-template:"branding titles actions" min-content/1fr max-content 1fr;position:sticky;top:0;z-index:1}}

package/dist/esm/index.mjs

@@ -283,7 +283,6 @@ export { InputRange } from './Input/InputRange/InputRange.mjs';
 export { InputSearch } from './Input/InputSearch/InputSearch.mjs';
 export { KaizenProvider } from './KaizenProvider/KaizenProvider.mjs';
 export { ThemeContext, ThemeProvider, useTheme } from './KaizenProvider/ThemeProvider/ThemeProvider.mjs';
-export { ThemeManager } from './KaizenProvider/ThemeProvider/ThemeManager.mjs';
 export { defaultTheme } from './KaizenProvider/ThemeProvider/themes/index.mjs';
 export { Label } from './Label/Label.mjs';
 export { LabelledMessage } from './LabelledMessage/LabelledMessage.mjs';

package/dist/esm/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}