@transkripid/flowbite-react/lib/hooks/use-theme-mode.mjs.map

Official React components built for Flowbite and Tailwind CSS - Transkrip.id fork

{"version":3,"file":"use-theme-mode.mjs","sources":["../../src/hooks/use-theme-mode.ts"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\nimport { isClient } from '../helpers/is-client';\nimport { useWatchLocalStorageValue } from '../hooks/use-watch-localstorage-value';\nimport { getThemeMode } from '../theme-store';\n\nconst DEFAULT_MODE: ThemeMode = 'light';\nconst LS_THEME_MODE = 'flowbite-theme-mode';\nconst SYNC_THEME_MODE = 'flowbite-theme-mode-sync';\n\nexport type ThemeMode = 'light' | 'dark' | 'auto';\n\nexport const useThemeMode = () => {\n  const [mode, setMode] = useState<ThemeMode>(getInitialMode(getThemeMode()));\n\n  /**\n   * Persist `mode` in local storage and add/remove `dark` class on `html`\n   */\n  useEffect(() => {\n    setModeInLS(mode);\n    setModeInDOM(mode);\n  }, []); // eslint-disable-line\n\n  /**\n   * Sync all tabs with the latest theme mode value\n   */\n  useWatchLocalStorageValue({\n    key: LS_THEME_MODE,\n    onChange(newValue) {\n      if (newValue) return handleSetMode(newValue as ThemeMode);\n    },\n  });\n\n  /**\n   * Keep the other instances of the hook in sync (bi-directional)\n   */\n  useSyncMode((mode) => setMode(mode));\n\n  /**\n   * Sets `mode` to a given value: `light | dark` | `auto`\n   */\n  const handleSetMode = (mode: ThemeMode) => {\n    setMode(mode);\n    setModeInLS(mode);\n    setModeInDOM(mode);\n    document.dispatchEvent(new CustomEvent(SYNC_THEME_MODE, { detail: mode }));\n  };\n\n  /**\n   * Toggles between: `light | dark`\n   */\n  const toggleMode = () => {\n    let newMode = mode;\n\n    if (newMode === 'auto') newMode = computeModeValue(newMode);\n\n    newMode = newMode === 'dark' ? 'light' : 'dark';\n\n    handleSetMode(newMode);\n  };\n\n  /**\n   * Sets the value to `<Flowbite theme={{ mode }}>` prop\n   */\n  const clearMode = () => {\n    const newMode = getThemeMode() ?? DEFAULT_MODE;\n\n    handleSetMode(newMode);\n  };\n\n  return { mode, computedMode: computeModeValue(mode), setMode: handleSetMode, toggleMode, clearMode };\n};\n\n/**\n * Custom event listener on `SYNC_THEME_MODE`\n */\nconst useSyncMode = (onChange: (mode: ThemeMode) => void) => {\n  useEffect(() => {\n    function handleSync(e: Event) {\n      const mode = (e as CustomEvent<ThemeMode>).detail;\n\n      onChange(mode);\n    }\n\n    document.addEventListener(SYNC_THEME_MODE, handleSync);\n    return () => document.removeEventListener(SYNC_THEME_MODE, handleSync);\n  }, []); // eslint-disable-line\n};\n\n/**\n * Sets the give value in local storage\n */\nconst setModeInLS = (mode: ThemeMode) => localStorage.setItem(LS_THEME_MODE, mode);\n\n/**\n * Add or remove class `dark` on `html` element\n */\nconst setModeInDOM = (mode: ThemeMode) => {\n  const computedMode = computeModeValue(mode);\n\n  if (computedMode === 'dark') {\n    document.documentElement.classList.add('dark');\n  } else {\n    document.documentElement.classList.remove('dark');\n  }\n};\n\nconst getInitialMode = (defaultMode?: ThemeMode): ThemeMode => {\n  if (!isClient()) return DEFAULT_MODE;\n\n  const LSMode = localStorage.getItem(LS_THEME_MODE) as ThemeMode | undefined;\n\n  return LSMode ?? defaultMode ?? DEFAULT_MODE;\n};\n\n/**\n * Parse `auto` mode value to either `light` or `dark`\n * @returns `light` | `dark`\n */\nconst computeModeValue = (mode: ThemeMode): ThemeMode => {\n  return mode === 'auto' ? prefersColorScheme() : mode;\n};\n\n/**\n * Get browser prefered color scheme\n * @returns `light` | `dark`\n */\nconst prefersColorScheme = (): ThemeMode => {\n  return window.matchMedia?.('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';\n};\n"],"names":["DEFAULT_MODE","LS_THEME_MODE","SYNC_THEME_MODE","useThemeMode","$","_c","t0","Symbol","for","getInitialMode","getThemeMode","mode","setMode","useState","t1","setModeInLS","setModeInDOM","t2","useEffect","useWatchLocalStorageValue","key","onChange","newValue","handleSetMode","t3","mode_0","useSyncMode","mode_1","dispatchEvent","CustomEvent","detail","t4","newMode","toggleMode","t5","newMode_0","clearMode","t6","computeModeValue","t8","t7","computedMode","handleSync","e","addEventListener","document","removeEventListener","localStorage","setItem","documentElement","classList","add","remove","defaultMode","isClient","getItem","prefersColorScheme","window","matchMedia","matches"],"mappings":"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"}