MCPcopy Create free account
hub / github.com/SyntaxUI/syntaxui / ThemeToggle

Function ThemeToggle

src/components/ThemeToggle.tsx:37–57  ·  view source on GitHub ↗
()

Source from the content-addressed store, hash-verified

35}))
36
37export function ThemeToggle() {
38 let { resolvedTheme, setTheme } = useTheme()
39 let otherTheme = resolvedTheme === 'dark' ? 'light' : 'dark'
40 const { mounted, setMounted } = useMountedStore()
41
42 useEffect(() => {
43 setMounted(true)
44 }, [setMounted])
45
46 return (
47 <button
48 type="button"
49 className="flex h-6 w-6 items-center justify-center rounded-md transition hover:bg-zinc-900/5 dark:hover:bg-white/5"
50 aria-label={mounted ? `Switch to ${otherTheme} theme` : 'Toggle theme'}
51 onClick={() => setTheme(otherTheme)}
52 >
53 <SunIcon className="h-5 w-5 stroke-zinc-900 dark:hidden" />
54 <MoonIcon className="hidden h-5 w-5 stroke-white dark:block" />
55 </button>
56 )
57}

Callers

nothing calls this directly

Calls

no outgoing calls

Tested by

no test coverage detected