Source identity
| Field | Recorded value |
|---|---|
| Source type | GitHub source |
| Original record | Janady13/llms-txt-hub / packages/design-system/components/custom/mode-toggle.tsx |
| Date | Not specified in source |
| Repository | Janady13/llms-txt-hub |
| Revision | e0f4bf978d4df168369c7601d9c5f5ea89e84377 |
| Branch | main |
| Path or archive member | packages/design-system/components/custom/mode-toggle.tsx |
| Original SHA-256 | fae2d28ef98c01654ff024ba9e65c3d23cbe508c796de685031d2538438c377c |
| Git blob SHA | c94a8f4642928899ef4b5be0e43151ab30313872 |
| Reading-copy SHA-256 | fae2d28ef98c01654ff024ba9e65c3d23cbe508c796de685031d2538438c377c |
Recovered source transcript
Download complete source text ↓45 lines · 1.4 KB
'use client'
import { MoonIcon, SunIcon } from '@radix-ui/react-icons'
import { useTheme } from 'next-themes'
import { Button } from '../shadcn/button'
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger
} from '../shadcn/dropdown-menu'
const themes = [
{ label: 'Light', value: 'light' },
{ label: 'Dark', value: 'dark' },
{ label: 'System', value: 'system' }
]
export const ModeToggle = () => {
const { setTheme } = useTheme()
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" size="icon" className="shrink-0 text-foreground">
<SunIcon className="dark:-rotate-90 h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:scale-0" />
<MoonIcon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
<span className="sr-only">Toggle theme</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end" className="w-40">
{themes.map(({ label, value }) => (
<DropdownMenuItem
key={value}
onClick={() => setTheme(value)}
className="text-sm cursor-pointer"
>
<span className="cursor-pointer">{label}</span>
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
)
}