mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
zeekay
05fc512820
Upstream sync from shadcn-ui/ui (1686 commits since last merge base). Key changes: - packages/shadcn upgraded to 4.1.0 (CLI font transformers, scaffold from github, chart colors) - apps/v4 replaces apps/www as the primary docs/registry app - Font system: 25+ heading font registries, font markers utility, @supports override - Chart improvements: recharts v3 compat, radial chart fixes - templates/ updated with monorepo variants (astro, vite, react-router, start) - skills/shadcn AI skill definitions added - deprecated/ removed (auth, auth-firebase, cli, www) Preserved Hanzo-only paths: app/, pkg/, demo/, docs/, template/next/
49 lines
1.2 KiB
TypeScript
49 lines
1.2 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
import { useTheme } from "next-themes"
|
|
|
|
import { useMetaColor } from "@/hooks/use-meta-color"
|
|
|
|
export function useThemeToggle() {
|
|
const { setTheme, resolvedTheme } = useTheme()
|
|
const { setMetaColor, metaColor } = useMetaColor()
|
|
|
|
React.useEffect(() => {
|
|
setMetaColor(metaColor)
|
|
}, [metaColor, setMetaColor])
|
|
|
|
const toggleTheme = React.useCallback(() => {
|
|
setTheme(resolvedTheme === "dark" ? "light" : "dark")
|
|
}, [resolvedTheme, setTheme])
|
|
|
|
// Listen for the D key to toggle theme.
|
|
React.useEffect(() => {
|
|
const down = (e: KeyboardEvent) => {
|
|
if (
|
|
(e.key === "d" || e.key === "D") &&
|
|
!e.metaKey &&
|
|
!e.ctrlKey &&
|
|
!e.altKey
|
|
) {
|
|
if (
|
|
(e.target instanceof HTMLElement && e.target.isContentEditable) ||
|
|
e.target instanceof HTMLInputElement ||
|
|
e.target instanceof HTMLTextAreaElement ||
|
|
e.target instanceof HTMLSelectElement
|
|
) {
|
|
return
|
|
}
|
|
|
|
e.preventDefault()
|
|
toggleTheme()
|
|
}
|
|
}
|
|
|
|
document.addEventListener("keydown", down)
|
|
return () => document.removeEventListener("keydown", down)
|
|
}, [toggleTheme])
|
|
|
|
return { toggleTheme }
|
|
}
|