@ttoss/fsl-theme 1.1.13 → 1.1.15

package/dist/ssrScript-CRfrN8Pm.cjs

@@ -0,0 +1,202 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+const require_helpers = require('./helpers-4p4-QVt_.cjs');
+
+//#region src/themeBootstrap.ts
+/**
+* Reads persisted mode from localStorage and resolves the effective
+* `mode` and `resolvedMode` (never `'system'`).
+*
+* Does **not** touch the DOM — DOM writes are performed by `apply()` inside
+* `createThemeRuntime`, which is the single owner of all attribute mutations.
+*/
+const resolveTheme = cfg => {
+  let stored = null;
+  try {
+    const raw = localStorage.getItem(cfg.storageKey);
+    if (raw) stored = JSON.parse(raw);
+  } catch {}
+  const mode = stored != null && stored.mode != null && cfg.validModes.indexOf(stored.mode) !== -1 ? stored.mode : cfg.defaultMode;
+  return {
+    mode,
+    resolvedMode: mode === "system" ? typeof window !== "undefined" && window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : mode
+  };
+};
+
+//#endregion
+//#region src/runtime.ts
+const DATA_THEME_ATTR = "data-tt-theme";
+const DATA_MODE_ATTR = "data-tt-mode";
+const DEFAULT_STORAGE_KEY = "tt-theme";
+/** Valid values for the `mode` field. Used to sanitize localStorage input. */
+const VALID_MODES = ["light", "dark", "system"];
+const writeStorage = (key, data) => {
+  try {
+    localStorage.setItem(key, JSON.stringify(data));
+  } catch {}
+};
+/**
+* Creates a framework-agnostic runtime that manages theme switching.
+*
+* - Sets `data-tt-mode` (and `data-tt-theme` when `defaultTheme` is provided) attributes on the root element.
+* - Updates `style.colorScheme` for native dark/light UI.
+* - Persists `{ mode }` to localStorage.
+* - Listens to `prefers-color-scheme` media query when mode is `'system'`.
+* - Pub/sub pattern for state changes.
+*
+* @example
+* ```ts
+* const runtime = createThemeRuntime({ defaultMode: 'dark' });
+* runtime.setMode('system');
+* const unsub = runtime.subscribe(console.log);
+* runtime.destroy();
+* ```
+*/
+const createThemeRuntime = (config = {}) => {
+  const {
+    defaultTheme,
+    defaultMode = "system",
+    storageKey = DEFAULT_STORAGE_KEY,
+    root = document.documentElement
+  } = config;
+  const listeners = /* @__PURE__ */new Set();
+  let destroyed = false;
+  const init = resolveTheme({
+    storageKey,
+    defaultMode,
+    validModes: VALID_MODES
+  });
+  let mode = init.mode;
+  let resolvedMode = init.resolvedMode;
+  const apply = () => {
+    if (defaultTheme) root.setAttribute(DATA_THEME_ATTR, defaultTheme);else root.removeAttribute(DATA_THEME_ATTR);
+    root.setAttribute(DATA_MODE_ATTR, resolvedMode);
+    root.style.colorScheme = resolvedMode;
+  };
+  const getState = () => {
+    return {
+      mode,
+      resolvedMode
+    };
+  };
+  apply();
+  let prevMode = mode;
+  let prevResolvedMode = resolvedMode;
+  const applyState = ({
+    persist
+  }) => {
+    if (mode === prevMode && resolvedMode === prevResolvedMode) return;
+    prevMode = mode;
+    prevResolvedMode = resolvedMode;
+    apply();
+    if (persist) writeStorage(storageKey, {
+      mode
+    });
+    const state = getState();
+    for (const listener of listeners) listener(state);
+  };
+  const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+  const onSystemChange = () => {
+    resolvedMode = mediaQuery.matches ? "dark" : "light";
+    applyState({
+      persist: false
+    });
+  };
+  const syncMediaListener = active => {
+    mediaQuery.removeEventListener("change", onSystemChange);
+    if (active) mediaQuery.addEventListener("change", onSystemChange);
+  };
+  syncMediaListener(mode === "system");
+  const setMode = newMode => {
+    if (destroyed || !VALID_MODES.includes(newMode)) return;
+    mode = newMode;
+    resolvedMode = mode === "system" ? mediaQuery.matches ? "dark" : "light" : mode;
+    syncMediaListener(mode === "system");
+    applyState({
+      persist: true
+    });
+  };
+  const subscribe = listener => {
+    if (destroyed) return () => {};
+    listeners.add(listener);
+    return () => {
+      listeners.delete(listener);
+    };
+  };
+  const destroy = () => {
+    destroyed = true;
+    syncMediaListener(false);
+    listeners.clear();
+  };
+  return {
+    getState,
+    setMode,
+    subscribe,
+    destroy
+  };
+};
+
+//#endregion
+//#region src/ssrScript.ts
+/**
+* Returns self-contained JavaScript code that prevents theme flash on SSR/SSG.
+*
+* Insert the returned string into an inline `<script>` tag in the `<head>`,
+* before any stylesheets or the app bundle.
+*
+* @example
+* ```tsx
+* // Next.js app/layout.tsx
+* import { getThemeScriptContent } from '@ttoss/fsl-theme/runtime';
+*
+* export default function RootLayout({ children }) {
+*   return (
+*     <html lang="en">
+*       <head>
+*         <script dangerouslySetInnerHTML={{ __html: getThemeScriptContent() }} />
+*       </head>
+*       <body>{children}</body>
+*     </html>
+*   );
+* }
+* ```
+*/
+const getThemeScriptContent = (config = {}) => {
+  const {
+    defaultTheme,
+    defaultMode = "system",
+    storageKey = DEFAULT_STORAGE_KEY
+  } = config;
+  if (defaultTheme !== void 0 && !require_helpers.SAFE_ID_RE.test(defaultTheme)) throw new Error(`Invalid defaultTheme "${defaultTheme}". Only alphanumeric characters, hyphens, and underscores are allowed.`);
+  return `(function(){var cfg=${JSON.stringify({
+    storageKey,
+    defaultTheme,
+    defaultMode,
+    validModes: [...VALID_MODES]
+  })};var d=document.documentElement;var s=null;try{var r=localStorage.getItem(cfg.storageKey);if(r)s=JSON.parse(r);}catch(e){}var m=(s!=null&&s.mode!=null&&cfg.validModes.indexOf(s.mode)!==-1)?s.mode:cfg.defaultMode;var rm=m==="system"?(window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"):m;if(cfg.defaultTheme){d.setAttribute("data-tt-theme",cfg.defaultTheme);}else{d.removeAttribute("data-tt-theme");}d.setAttribute("data-tt-mode",rm);d.style.colorScheme=rm;})()`;
+};
+
+//#endregion
+Object.defineProperty(exports, 'DATA_MODE_ATTR', {
+  enumerable: true,
+  get: function () {
+    return DATA_MODE_ATTR;
+  }
+});
+Object.defineProperty(exports, 'DATA_THEME_ATTR', {
+  enumerable: true,
+  get: function () {
+    return DATA_THEME_ATTR;
+  }
+});
+Object.defineProperty(exports, 'createThemeRuntime', {
+  enumerable: true,
+  get: function () {
+    return createThemeRuntime;
+  }
+});
+Object.defineProperty(exports, 'getThemeScriptContent', {
+  enumerable: true,
+  get: function () {
+    return getThemeScriptContent;
+  }
+});

package/dist/ssrScript-D3kGPQpi.mjs

@@ -0,0 +1,179 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+import { n as SAFE_ID_RE } from "./helpers-CaswNJMy.mjs";
+
+//#region src/themeBootstrap.ts
+/**
+* Reads persisted mode from localStorage and resolves the effective
+* `mode` and `resolvedMode` (never `'system'`).
+*
+* Does **not** touch the DOM — DOM writes are performed by `apply()` inside
+* `createThemeRuntime`, which is the single owner of all attribute mutations.
+*/
+const resolveTheme = cfg => {
+  let stored = null;
+  try {
+    const raw = localStorage.getItem(cfg.storageKey);
+    if (raw) stored = JSON.parse(raw);
+  } catch {}
+  const mode = stored != null && stored.mode != null && cfg.validModes.indexOf(stored.mode) !== -1 ? stored.mode : cfg.defaultMode;
+  return {
+    mode,
+    resolvedMode: mode === "system" ? typeof window !== "undefined" && window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light" : mode
+  };
+};
+
+//#endregion
+//#region src/runtime.ts
+const DATA_THEME_ATTR = "data-tt-theme";
+const DATA_MODE_ATTR = "data-tt-mode";
+const DEFAULT_STORAGE_KEY = "tt-theme";
+/** Valid values for the `mode` field. Used to sanitize localStorage input. */
+const VALID_MODES = ["light", "dark", "system"];
+const writeStorage = (key, data) => {
+  try {
+    localStorage.setItem(key, JSON.stringify(data));
+  } catch {}
+};
+/**
+* Creates a framework-agnostic runtime that manages theme switching.
+*
+* - Sets `data-tt-mode` (and `data-tt-theme` when `defaultTheme` is provided) attributes on the root element.
+* - Updates `style.colorScheme` for native dark/light UI.
+* - Persists `{ mode }` to localStorage.
+* - Listens to `prefers-color-scheme` media query when mode is `'system'`.
+* - Pub/sub pattern for state changes.
+*
+* @example
+* ```ts
+* const runtime = createThemeRuntime({ defaultMode: 'dark' });
+* runtime.setMode('system');
+* const unsub = runtime.subscribe(console.log);
+* runtime.destroy();
+* ```
+*/
+const createThemeRuntime = (config = {}) => {
+  const {
+    defaultTheme,
+    defaultMode = "system",
+    storageKey = DEFAULT_STORAGE_KEY,
+    root = document.documentElement
+  } = config;
+  const listeners = /* @__PURE__ */new Set();
+  let destroyed = false;
+  const init = resolveTheme({
+    storageKey,
+    defaultMode,
+    validModes: VALID_MODES
+  });
+  let mode = init.mode;
+  let resolvedMode = init.resolvedMode;
+  const apply = () => {
+    if (defaultTheme) root.setAttribute(DATA_THEME_ATTR, defaultTheme);else root.removeAttribute(DATA_THEME_ATTR);
+    root.setAttribute(DATA_MODE_ATTR, resolvedMode);
+    root.style.colorScheme = resolvedMode;
+  };
+  const getState = () => {
+    return {
+      mode,
+      resolvedMode
+    };
+  };
+  apply();
+  let prevMode = mode;
+  let prevResolvedMode = resolvedMode;
+  const applyState = ({
+    persist
+  }) => {
+    if (mode === prevMode && resolvedMode === prevResolvedMode) return;
+    prevMode = mode;
+    prevResolvedMode = resolvedMode;
+    apply();
+    if (persist) writeStorage(storageKey, {
+      mode
+    });
+    const state = getState();
+    for (const listener of listeners) listener(state);
+  };
+  const mediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
+  const onSystemChange = () => {
+    resolvedMode = mediaQuery.matches ? "dark" : "light";
+    applyState({
+      persist: false
+    });
+  };
+  const syncMediaListener = active => {
+    mediaQuery.removeEventListener("change", onSystemChange);
+    if (active) mediaQuery.addEventListener("change", onSystemChange);
+  };
+  syncMediaListener(mode === "system");
+  const setMode = newMode => {
+    if (destroyed || !VALID_MODES.includes(newMode)) return;
+    mode = newMode;
+    resolvedMode = mode === "system" ? mediaQuery.matches ? "dark" : "light" : mode;
+    syncMediaListener(mode === "system");
+    applyState({
+      persist: true
+    });
+  };
+  const subscribe = listener => {
+    if (destroyed) return () => {};
+    listeners.add(listener);
+    return () => {
+      listeners.delete(listener);
+    };
+  };
+  const destroy = () => {
+    destroyed = true;
+    syncMediaListener(false);
+    listeners.clear();
+  };
+  return {
+    getState,
+    setMode,
+    subscribe,
+    destroy
+  };
+};
+
+//#endregion
+//#region src/ssrScript.ts
+/**
+* Returns self-contained JavaScript code that prevents theme flash on SSR/SSG.
+*
+* Insert the returned string into an inline `<script>` tag in the `<head>`,
+* before any stylesheets or the app bundle.
+*
+* @example
+* ```tsx
+* // Next.js app/layout.tsx
+* import { getThemeScriptContent } from '@ttoss/fsl-theme/runtime';
+*
+* export default function RootLayout({ children }) {
+*   return (
+*     <html lang="en">
+*       <head>
+*         <script dangerouslySetInnerHTML={{ __html: getThemeScriptContent() }} />
+*       </head>
+*       <body>{children}</body>
+*     </html>
+*   );
+* }
+* ```
+*/
+const getThemeScriptContent = (config = {}) => {
+  const {
+    defaultTheme,
+    defaultMode = "system",
+    storageKey = DEFAULT_STORAGE_KEY
+  } = config;
+  if (defaultTheme !== void 0 && !SAFE_ID_RE.test(defaultTheme)) throw new Error(`Invalid defaultTheme "${defaultTheme}". Only alphanumeric characters, hyphens, and underscores are allowed.`);
+  return `(function(){var cfg=${JSON.stringify({
+    storageKey,
+    defaultTheme,
+    defaultMode,
+    validModes: [...VALID_MODES]
+  })};var d=document.documentElement;var s=null;try{var r=localStorage.getItem(cfg.storageKey);if(r)s=JSON.parse(r);}catch(e){}var m=(s!=null&&s.mode!=null&&cfg.validModes.indexOf(s.mode)!==-1)?s.mode:cfg.defaultMode;var rm=m==="system"?(window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches?"dark":"light"):m;if(cfg.defaultTheme){d.setAttribute("data-tt-theme",cfg.defaultTheme);}else{d.removeAttribute("data-tt-theme");}d.setAttribute("data-tt-mode",rm);d.style.colorScheme=rm;})()`;
+};
+
+//#endregion
+export { createThemeRuntime as i, DATA_MODE_ATTR as n, DATA_THEME_ATTR as r, getThemeScriptContent as t };

package/dist/themes/bruttal.cjs

@@ -0,0 +1,75 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+Object.defineProperty(exports, Symbol.toStringTag, {
+  value: 'Module'
+});
+const require_createTheme = require('../createTheme-Cv6RP9D6.cjs');
+const require_helpers = require('../helpers-4p4-QVt_.cjs');
+const require_withDataviz = require('../withDataviz-B4pVsOwV.cjs');
+
+//#region src/themes/bruttal.ts
+/**
+* Bruttal — warm brown brand palette with a brutalist visual identity.
+*
+* Semantic drift from the default theme:
+* - Sharp corners: `radii.control` and `radii.surface` collapse to `core.radii.none`.
+* - Flat surfaces: every `elevation.surface.*` stratum maps to `core.elevation.level.0`
+*   (and to `core.elevation.emphatic.0` in the dark alternate), expressing a brutalist
+*   "no shadows" aesthetic in both modes.
+*
+* Brand palette note:
+* - `brand.500` is tuned to `#6D5D4F` (≈7.3:1 on `neutral.0`) so that semantic slots
+*   using `brand.500` as a filled background with `neutral.0` text meet WCAG AA Normal.
+*
+* The dark alternate inherits `darkAlternate`'s colour remaps and only overrides
+* `elevation.surface.*` to preserve the flat brutalist identity under dark mode.
+*/
+const bundle = require_createTheme.createTheme({
+  overrides: {
+    core: {
+      colors: {
+        brand: {
+          50: "#FBF8F5",
+          100: "#F3EDE6",
+          200: "#E4D7CC",
+          300: "#CCBCAE",
+          400: "#96836F",
+          500: "#6D5D4F",
+          600: "#594A3F",
+          700: "#4E4239",
+          800: "#312921",
+          900: "#1A150E"
+        }
+      }
+    },
+    semantic: {
+      radii: {
+        control: "{core.radii.none}",
+        surface: "{core.radii.none}"
+      },
+      elevation: {
+        surface: {
+          flat: "{core.elevation.level.0}",
+          raised: "{core.elevation.level.0}",
+          overlay: "{core.elevation.level.0}",
+          blocking: "{core.elevation.level.0}"
+        }
+      }
+    }
+  },
+  alternate: require_helpers.deepMerge(require_createTheme.darkAlternate, {
+    semantic: {
+      elevation: {
+        surface: {
+          flat: "{core.elevation.emphatic.0}",
+          raised: "{core.elevation.emphatic.0}",
+          overlay: "{core.elevation.emphatic.0}",
+          blocking: "{core.elevation.emphatic.0}"
+        }
+      }
+    }
+  })
+});
+const bruttal = require_withDataviz.withDataviz(bundle);
+
+//#endregion
+exports.bruttal = bruttal;

package/dist/themes/bruttal.d.cts

@@ -0,0 +1,3 @@
+
+import { i as bruttal } from "../index-CsIjfw86.cjs";
+export { bruttal };

package/dist/themes/bruttal.d.mts

@@ -0,0 +1,3 @@
+
+import { i as bruttal } from "../index-nJrjI0BA.mjs";
+export { bruttal };

package/dist/themes/bruttal.mjs

@@ -0,0 +1,72 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+import { i as darkAlternate, n as createTheme } from "../createTheme-BLNYztZU.mjs";
+import { r as deepMerge } from "../helpers-CaswNJMy.mjs";
+import { t as withDataviz } from "../withDataviz-DY5s7R51.mjs";
+
+//#region src/themes/bruttal.ts
+/**
+* Bruttal — warm brown brand palette with a brutalist visual identity.
+*
+* Semantic drift from the default theme:
+* - Sharp corners: `radii.control` and `radii.surface` collapse to `core.radii.none`.
+* - Flat surfaces: every `elevation.surface.*` stratum maps to `core.elevation.level.0`
+*   (and to `core.elevation.emphatic.0` in the dark alternate), expressing a brutalist
+*   "no shadows" aesthetic in both modes.
+*
+* Brand palette note:
+* - `brand.500` is tuned to `#6D5D4F` (≈7.3:1 on `neutral.0`) so that semantic slots
+*   using `brand.500` as a filled background with `neutral.0` text meet WCAG AA Normal.
+*
+* The dark alternate inherits `darkAlternate`'s colour remaps and only overrides
+* `elevation.surface.*` to preserve the flat brutalist identity under dark mode.
+*/
+const bundle = createTheme({
+  overrides: {
+    core: {
+      colors: {
+        brand: {
+          50: "#FBF8F5",
+          100: "#F3EDE6",
+          200: "#E4D7CC",
+          300: "#CCBCAE",
+          400: "#96836F",
+          500: "#6D5D4F",
+          600: "#594A3F",
+          700: "#4E4239",
+          800: "#312921",
+          900: "#1A150E"
+        }
+      }
+    },
+    semantic: {
+      radii: {
+        control: "{core.radii.none}",
+        surface: "{core.radii.none}"
+      },
+      elevation: {
+        surface: {
+          flat: "{core.elevation.level.0}",
+          raised: "{core.elevation.level.0}",
+          overlay: "{core.elevation.level.0}",
+          blocking: "{core.elevation.level.0}"
+        }
+      }
+    }
+  },
+  alternate: deepMerge(darkAlternate, {
+    semantic: {
+      elevation: {
+        surface: {
+          flat: "{core.elevation.emphatic.0}",
+          raised: "{core.elevation.emphatic.0}",
+          overlay: "{core.elevation.emphatic.0}",
+          blocking: "{core.elevation.emphatic.0}"
+        }
+      }
+    }
+  })
+});
+const bruttal = withDataviz(bundle);
+
+//#endregion
+export { bruttal };

package/dist/themes/corporate.cjs

@@ -0,0 +1,34 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+Object.defineProperty(exports, Symbol.toStringTag, {
+  value: 'Module'
+});
+const require_createTheme = require('../createTheme-Cv6RP9D6.cjs');
+const require_withDataviz = require('../withDataviz-B4pVsOwV.cjs');
+
+//#region src/themes/corporate.ts
+const bundle = require_createTheme.createTheme({
+  overrides: {
+    core: {
+      colors: {
+        brand: {
+          50: "#E3F2FF",
+          100: "#B3DAFF",
+          200: "#80BFFF",
+          300: "#4DA5FF",
+          400: "#1A8AFF",
+          500: "#0469E3",
+          600: "#0352A6",
+          700: "#022D66",
+          800: "#011923",
+          900: "#000000"
+        }
+      }
+    },
+    semantic: {}
+  },
+  alternate: void 0
+});
+const corporate = require_withDataviz.withDataviz(bundle);
+
+//#endregion
+exports.corporate = corporate;

package/dist/themes/corporate.d.cts

@@ -0,0 +1,3 @@
+
+import { r as corporate } from "../index-CsIjfw86.cjs";
+export { corporate };

package/dist/themes/corporate.d.mts

@@ -0,0 +1,3 @@
+
+import { r as corporate } from "../index-nJrjI0BA.mjs";
+export { corporate };

package/dist/{esm/chunk-TPMN75JM.js → themes/corporate.mjs}

@@ -1,9 +1,9 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-import { withDataviz } from "./chunk-FBVUI2PK.js";
-import { createTheme } from "./chunk-SE5Z52RE.js";
+import { n as createTheme } from "../createTheme-BLNYztZU.mjs";
+import { t as withDataviz } from "../withDataviz-DY5s7R51.mjs";
 
-// src/themes/corporate.ts
-var bundle = createTheme({
+//#region src/themes/corporate.ts
+const bundle = createTheme({
   overrides: {
     core: {
       colors: {
@@ -25,5 +25,7 @@ var bundle = createTheme({
   },
   alternate: void 0
 });
-var corporate = withDataviz(bundle);
+const corporate = withDataviz(bundle);
+
+//#endregion
 export { corporate };

package/dist/themes/oca.cjs

@@ -0,0 +1,34 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+Object.defineProperty(exports, Symbol.toStringTag, {
+  value: 'Module'
+});
+const require_createTheme = require('../createTheme-Cv6RP9D6.cjs');
+const require_withDataviz = require('../withDataviz-B4pVsOwV.cjs');
+
+//#region src/themes/oca.ts
+const bundle = require_createTheme.createTheme({
+  overrides: {
+    core: {
+      colors: {
+        brand: {
+          50: "#F5FBEA",
+          100: "#E4F6C2",
+          200: "#CAED8A",
+          300: "#ABDF4E",
+          400: "#8ECE1F",
+          500: "#6DB800",
+          600: "#549100",
+          700: "#3C6A00",
+          800: "#254300",
+          900: "#111F00"
+        }
+      }
+    },
+    semantic: {}
+  },
+  alternate: void 0
+});
+const oca = require_withDataviz.withDataviz(bundle);
+
+//#endregion
+exports.oca = oca;

package/dist/themes/oca.d.cts

@@ -0,0 +1,3 @@
+
+import { n as oca } from "../index-CsIjfw86.cjs";
+export { oca };

package/dist/themes/oca.d.mts

@@ -0,0 +1,3 @@
+
+import { n as oca } from "../index-nJrjI0BA.mjs";
+export { oca };

package/dist/{esm/chunk-DU4QDQUC.js → themes/oca.mjs}

@@ -1,9 +1,9 @@
 /** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
-import { withDataviz } from "./chunk-FBVUI2PK.js";
-import { createTheme } from "./chunk-SE5Z52RE.js";
+import { n as createTheme } from "../createTheme-BLNYztZU.mjs";
+import { t as withDataviz } from "../withDataviz-DY5s7R51.mjs";
 
-// src/themes/oca.ts
-var bundle = createTheme({
+//#region src/themes/oca.ts
+const bundle = createTheme({
   overrides: {
     core: {
       colors: {
@@ -25,5 +25,7 @@ var bundle = createTheme({
   },
   alternate: void 0
 });
-var oca = withDataviz(bundle);
+const oca = withDataviz(bundle);
+
+//#endregion
 export { oca };