Something went wrong. Try again.
This repository has no description
Something went wrong. Try again.
651 B · 27 lines
TypeScript
at main
12345678910111213141516171819202122232425262728import { computed, ref, watchEffect } from 'vue'
export type Theme = 'dark' | 'light'
const STORAGE_KEY = 'loom-theme'
function initialTheme(): Theme { return localStorage.getItem(STORAGE_KEY) === 'light' ? 'light' : 'dark'}
const theme = ref<Theme>(initialTheme())const nextTheme = computed<Theme>(() => (theme.value === 'dark' ? 'light' : 'dark'))
watchEffect( () => { document.documentElement.dataset.theme = theme.value }, { flush: 'sync' },)
export function useTheme() { const toggle = () => { theme.value = nextTheme.value localStorage.setItem(STORAGE_KEY, theme.value) } return { theme, nextTheme, toggle }}