16-6f3d62e08cff4c56ee38.js.map

{"version":3,"sources":["webpack:///./src/components/DarkModeToggler/DarkModeToggler.module.scss","webpack:///./src/components/DarkModeToggler/DarkModeToggler.js"],"names":["module","exports","ThemeToggler","initTheme","document","documentElement","dataset","theme","useState","setTheme","useEffect","localStorage","setItem","className","styles","type","onClick","hidden"],"mappings":"+EACAA,EAAOC,QAAU,CAAC,QAAU,2C,+HC8BbC,MA5Bf,WACE,IAAMC,EAAYC,SAASC,gBAAgBC,QAAQC,MAD7B,EAEIC,mBAASL,GAA5BI,EAFe,KAERE,EAFQ,KAetB,OAXAC,qBAAU,WACRC,aAAaC,QAAQ,QAASL,GAC9BH,SAASC,gBAAgBC,QAAQC,MAAQA,IAE3C,CAACA,IAQC,yBAAKM,UAAWC,IAAM,SACpB,+BACE,2BACEC,KAAK,WACLC,QAAS,WARfP,EAD2B,SAAVF,EAAmB,QAAU,SAUxCU,QAAQ,IACJV,EALR","file":"16-6f3d62e08cff4c56ee38.js","sourcesContent":["// extracted by mini-css-extract-plugin\nmodule.exports = {\"toggler\":\"DarkModeToggler-module--toggler--3yMxx\"};","import React, { useState, useEffect } from 'react';\nimport styles from './DarkModeToggler.module.scss';\n\nfunction ThemeToggler() {\n  const initTheme = document.documentElement.dataset.theme;\n  const [theme, setTheme] = useState(initTheme);\n\n  useEffect(() => {\n    localStorage.setItem('theme', theme);\n    document.documentElement.dataset.theme = theme;\n  },\n  [theme]);\n\n  function toggleTheme() {\n    const newTheme = theme === 'dark' ? 'light' : 'dark';\n    setTheme(newTheme);\n  }\n\n  return (\n    <div className={styles['toggler']}>\n      <label>\n        <input\n          type=\"checkbox\"\n          onClick={() => toggleTheme()}\n          hidden={true}\n        />{`${theme} mode`}\n      </label>\n    </div>\n  );\n}\n\nexport default ThemeToggler;"],"sourceRoot":""}