{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "feature-flag-toggle",
  "type": "registry:ui",
  "title": "Feature flag toggle",
  "description": "A settings row for flipping a feature flag on or off: flag name, optional description and a labeled switch, wired as a controlled React component.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/label.json",
    "https://ui.minidev.pro/r/switch.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/feature-flag-toggle.tsx",
      "type": "registry:ui",
      "target": "components/ui/feature-flag-toggle.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { Switch } from \"@/components/ui/switch\"\nimport { Label } from \"@/components/ui/label\"\n\nfunction FeatureFlagToggle({\n  name,\n  description,\n  checked,\n  onCheckedChange,\n  className,\n}: {\n  name: string\n  description?: string\n  checked?: boolean\n  onCheckedChange?: (checked: boolean) => void\n  className?: string\n}) {\n  const id = React.useId()\n  return (\n    <div\n      data-slot=\"feature-flag-toggle\"\n      className={cn(\n        \"flex items-start justify-between gap-4 rounded-xl border border-border bg-surface px-4 py-3\",\n        className\n      )}\n    >\n      <div className=\"min-w-0\">\n        <Label htmlFor={id} className=\"text-sm font-medium text-fg\">{name}</Label>\n        {description ? <p className=\"mt-0.5 text-xs text-fg-muted\">{description}</p> : null}\n      </div>\n      <Switch id={id} checked={checked} onCheckedChange={onCheckedChange} aria-label={name} />\n    </div>\n  )\n}\nexport { FeatureFlagToggle }\n"
    }
  ]
}