@hashicorp/design-system-components 4.24.1-rc-20251103142516 → 4.24.1-rc-20251104193246

package/dist/services/hds-theming.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"hds-theming.js","sources":["../../src/services/hds-theming.ts"],"sourcesContent":["import Service from '@ember/service';\nimport { tracked } from '@glimmer/tracking';\n\nexport enum HdsThemeValues {\n  // system settings (prefers-color-scheme)\n  System = 'system',\n  // user settings for dark/light\n  Light = 'light',\n  Dark = 'dark',\n}\n\nenum HdsModesBaseValues {\n  Hds = 'hds', // TODO understand if it should be `default`\n}\n\nenum HdsModesLightValues {\n  CdsG0 = 'cds-g0',\n  CdsG10 = 'cds-g10',\n}\n\nenum HdsModesDarkValues {\n  CdsG90 = 'cds-g90',\n  CdsG100 = 'cds-g100',\n}\n\nexport enum HdsCssSelectorsValues {\n  Data = 'data',\n  Class = 'class',\n}\n\nexport type HdsThemes = `${HdsThemeValues}`;\nexport type HdsModes =\n  | `${HdsModesBaseValues}`\n  | `${HdsModesLightValues}`\n  | `${HdsModesDarkValues}`;\nexport type HdsModesLight = `${HdsModesLightValues}`;\nexport type HdsModesDark = `${HdsModesDarkValues}`;\nexport type HdsCssSelectors = `${HdsCssSelectorsValues}`;\n\ntype HdsThemingOptions = {\n  lightTheme: HdsModesLight;\n  darkTheme: HdsModesDark;\n  cssSelector: HdsCssSelectors;\n};\n\ntype SetThemeArgs = {\n  theme: HdsThemes | undefined;\n  options?: HdsThemingOptions;\n  onSetTheme?: OnSetThemeCallback;\n};\n\nexport type OnSetThemeCallbackArgs = {\n  currentTheme: HdsThemes | undefined;\n  currentMode: HdsModes | undefined;\n};\n\nexport type OnSetThemeCallback = (args: OnSetThemeCallbackArgs) => void;\n\nexport const THEMES: HdsThemes[] = Object.values(HdsThemeValues);\nexport const MODES_LIGHT: HdsModesLight[] = Object.values(HdsModesLightValues);\nexport const MODES_DARK: HdsModesDark[] = Object.values(HdsModesDarkValues);\nexport const MODES: HdsModes[] = [\n  ...Object.values(HdsModesBaseValues),\n  ...MODES_LIGHT,\n  ...MODES_DARK,\n];\n\nexport const HDS_THEMING_DATA_SELECTOR = 'data-hds-theme';\nexport const HDS_THEMING_CLASS_SELECTOR_PREFIX = 'hds-theme';\nexport const HDS_THEMING_CLASS_SELECTORS_LIST = [\n  ...MODES_LIGHT,\n  ...MODES_DARK,\n].map((mode) => `${HDS_THEMING_CLASS_SELECTOR_PREFIX}-${mode}`);\n\nexport const HDS_THEMING_LOCALSTORAGE_DATA = 'hds-theming-data';\n\nexport const DEFAULT_THEMING_OPTION_LIGHT_THEME = HdsModesLightValues.CdsG0;\nexport const DEFAULT_THEMING_OPTION_DARK_THEME = HdsModesDarkValues.CdsG100;\nexport const DEFAULT_THEMING_OPTION_CSS_SELECTOR = 'data';\n\nexport default class HdsThemingService extends Service {\n  @tracked _currentTheme: HdsThemes | undefined = undefined;\n  @tracked _currentMode: HdsModes | undefined = undefined;\n  @tracked _currentLightTheme: HdsModesLight =\n    DEFAULT_THEMING_OPTION_LIGHT_THEME;\n  @tracked _currentDarkTheme: HdsModesDark = DEFAULT_THEMING_OPTION_DARK_THEME;\n  @tracked _currentCssSelector: HdsCssSelectors =\n    DEFAULT_THEMING_OPTION_CSS_SELECTOR;\n  @tracked globalOnSetTheme: OnSetThemeCallback | undefined;\n\n  initializeTheme() {\n    const rawStoredThemingData = localStorage.getItem(\n      HDS_THEMING_LOCALSTORAGE_DATA\n    );\n    if (rawStoredThemingData !== null) {\n      const storedThemingData: unknown = JSON.parse(rawStoredThemingData);\n      if (storedThemingData) {\n        const { theme, options } = storedThemingData as {\n          theme: HdsThemes | undefined;\n          options: HdsThemingOptions;\n        };\n        this.setTheme({\n          theme,\n          options,\n        });\n      }\n    }\n  }\n\n  setTheme({ theme, options, onSetTheme }: SetThemeArgs) {\n    if (options !== undefined) {\n      // if we have new options, we override the current ones (`lightTheme` / `darkTheme` / `cssSelector`)\n      // these options can be used by consumers that want to customize how they apply theming\n      // (and used by the showcase for the custom theming / theme switching logic)\n      if (\n        Object.hasOwn(options, 'lightTheme') &&\n        Object.hasOwn(options, 'darkTheme') &&\n        Object.hasOwn(options, 'cssSelector')\n      ) {\n        const { lightTheme, darkTheme, cssSelector } = options;\n\n        this._currentLightTheme = lightTheme;\n        this._currentDarkTheme = darkTheme;\n        this._currentCssSelector = cssSelector;\n      } else {\n        // fallback if something goes wrong\n        this._currentLightTheme = DEFAULT_THEMING_OPTION_LIGHT_THEME;\n        this._currentDarkTheme = DEFAULT_THEMING_OPTION_DARK_THEME;\n        this._currentCssSelector = DEFAULT_THEMING_OPTION_CSS_SELECTOR;\n      }\n    }\n\n    // set the current theme/mode (`currentTheme` / `currentMode`)\n    if (\n      theme === undefined || // standard (no theming)\n      !THEMES.includes(theme) // handle possible errors\n    ) {\n      this._currentTheme = undefined;\n      this._currentMode = undefined;\n    } else if (\n      theme === HdsThemeValues.System // system (prefers-color-scheme)\n    ) {\n      this._currentTheme = HdsThemeValues.System;\n      this._currentMode = undefined;\n    } else {\n      this._currentTheme = theme;\n      if (this._currentTheme === HdsThemeValues.Light) {\n        this._currentMode = this._currentLightTheme;\n      }\n      if (this._currentTheme === HdsThemeValues.Dark) {\n        this._currentMode = this._currentDarkTheme;\n      }\n    }\n\n    // IMPORTANT: for this to work, it needs to be the HTML tag (it's the `:root` in CSS)\n    const rootElement = document.querySelector('html');\n\n    if (!rootElement) {\n      return;\n    }\n    // remove or update the CSS selectors applied to the root element (depending on the `theme` argument)\n    rootElement.removeAttribute(HDS_THEMING_DATA_SELECTOR);\n    rootElement.classList.remove(...HDS_THEMING_CLASS_SELECTORS_LIST);\n    if (this._currentMode !== undefined) {\n      if (this._currentCssSelector === 'data') {\n        rootElement.setAttribute(HDS_THEMING_DATA_SELECTOR, this._currentMode);\n      } else if (this._currentCssSelector === 'class') {\n        rootElement.classList.add(\n          `${HDS_THEMING_CLASS_SELECTOR_PREFIX}-${this._currentMode}`\n        );\n      }\n    }\n\n    // store the current theme and theming options in local storage (unless undefined)\n    localStorage.setItem(\n      HDS_THEMING_LOCALSTORAGE_DATA,\n      JSON.stringify({\n        theme: this._currentTheme,\n        options: {\n          lightTheme: this._currentLightTheme,\n          darkTheme: this._currentDarkTheme,\n          cssSelector: this._currentCssSelector,\n        },\n      })\n    );\n\n    // this is a general callback that can be defined globally (by extending the service)\n    if (this.globalOnSetTheme) {\n      this.globalOnSetTheme({\n        currentTheme: this._currentTheme,\n        currentMode: this._currentMode,\n      });\n    }\n\n    // this is a \"local\" callback that can be defined \"locally\" (eg. in a theme switcher)\n    if (onSetTheme) {\n      onSetTheme({\n        currentTheme: this._currentTheme,\n        currentMode: this._currentMode,\n      });\n    }\n  }\n\n  // getters used for reactivity in the components/services using this service\n\n  get currentTheme(): HdsThemes | undefined {\n    return this._currentTheme;\n  }\n\n  get currentMode(): HdsModes | undefined {\n    return this._currentMode;\n  }\n\n  get currentLightTheme(): HdsModesLight {\n    return this._currentLightTheme ?? DEFAULT_THEMING_OPTION_LIGHT_THEME;\n  }\n\n  get currentDarkTheme(): HdsModesDark {\n    return this._currentDarkTheme ?? DEFAULT_THEMING_OPTION_DARK_THEME;\n  }\n\n  get currentCssSelector(): HdsCssSelectors {\n    return this._currentCssSelector ?? DEFAULT_THEMING_OPTION_CSS_SELECTOR;\n  }\n}\n"],"names":["HdsThemeValues","HdsModesBaseValues","HdsModesLightValues","HdsModesDarkValues","HdsCssSelectorsValues","THEMES","Object","values","MODES_LIGHT","MODES_DARK","MODES","HDS_THEMING_DATA_SELECTOR","HDS_THEMING_CLASS_SELECTOR_PREFIX","HDS_THEMING_CLASS_SELECTORS_LIST","map","mode","HDS_THEMING_LOCALSTORAGE_DATA","DEFAULT_THEMING_OPTION_LIGHT_THEME","CdsG0","DEFAULT_THEMING_OPTION_DARK_THEME","CdsG100","DEFAULT_THEMING_OPTION_CSS_SELECTOR","HdsThemingService","Service","g","prototype","tracked","undefined","i","void 0","initializeTheme","rawStoredThemingData","localStorage","getItem","storedThemingData","JSON","parse","theme","options","setTheme","onSetTheme","hasOwn","lightTheme","darkTheme","cssSelector","_currentLightTheme","_currentDarkTheme","_currentCssSelector","includes","_currentTheme","_currentMode","System","Light","Dark","rootElement","document","querySelector","removeAttribute","classList","remove","setAttribute","add","setItem","stringify","globalOnSetTheme","currentTheme","currentMode","currentLightTheme","currentDarkTheme","currentCssSelector"],"mappings":"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"}