import { useAppearance } from '@/hooks/useAppearance' import { cn } from '@/lib/utils' import { RgbaColor, RgbaColorPicker } from 'react-colorful' import { IconColorPicker } from '@tabler/icons-react' import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger, } from '@/components/ui/dropdown-menu' export function ColorPickerAppMainView() { const { appMainViewBgColor, setAppMainViewBgColor } = useAppearance() const predefineAppMainViewBgColor: RgbaColor[] = [ { r: 251, g: 251, b: 251, a: 1, }, { r: 24, g: 24, b: 24, a: 1, }, ] return (
{predefineAppMainViewBgColor.map((item, i) => { const isSelected = item.r === appMainViewBgColor.r && item.g === appMainViewBgColor.g && item.b === appMainViewBgColor.b && item.a === appMainViewBgColor.a return (
{ setAppMainViewBgColor(item) }} style={{ backgroundColor: `rgba(${item.r}, ${item.g}, ${item.b}, ${item.a})`, }} /> ) })}
setAppMainViewBgColor(color)} />
) }