{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "appearance-tabs",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "tabs",
    "@launch/use-appearance"
  ],
  "files": [
    {
      "path": "registry/new-york-v4/components/appearance-tabs.tsx",
      "content": "import type { LucideIcon } from \"lucide-react\";\nimport { Monitor, Moon, Sun } from \"lucide-react\";\nimport type { HTMLAttributes } from \"react\";\nimport type { Appearance } from \"@/hooks/use-appearance\";\nimport { useAppearance } from \"@/hooks/use-appearance\";\nimport { cn } from \"@/lib/utils\";\n\nexport default function AppearanceToggleTab({\n    className = \"\",\n    ...props\n}: HTMLAttributes<HTMLDivElement>) {\n    const { appearance, updateAppearance } = useAppearance();\n\n    const tabs: { value: Appearance; icon: LucideIcon; label: string }[] = [\n        { value: \"light\", icon: Sun, label: \"Light\" },\n        { value: \"dark\", icon: Moon, label: \"Dark\" },\n        { value: \"system\", icon: Monitor, label: \"System\" },\n    ];\n\n    return (\n        <div\n            className={cn(\n                \"inline-flex gap-1 rounded-lg bg-neutral-100 p-1 dark:bg-neutral-800\",\n                className,\n            )}\n            {...props}\n        >\n            {tabs.map(({ value, icon: Icon, label }) => (\n                <button\n                    key={value}\n                    onClick={() => updateAppearance(value)}\n                    className={cn(\n                        \"flex items-center rounded-md px-3.5 py-1.5 transition-colors\",\n                        appearance === value\n                            ? \"bg-white shadow-xs dark:bg-neutral-700 dark:text-neutral-100\"\n                            : \"text-neutral-500 hover:bg-neutral-200/60 hover:text-black dark:text-neutral-400 dark:hover:bg-neutral-700/60\",\n                    )}\n                >\n                    <Icon className=\"-ml-1 h-4 w-4\" />\n                    <span className=\"ml-1.5 text-sm\">{label}</span>\n                </button>\n            ))}\n        </div>\n    );\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}