{
  "name": "pending-switch-demo",
  "type": "registry:example",
  "registryDependencies": [
    "pending",
    "switch",
    "label"
  ],
  "files": [
    {
      "path": "examples/pending-switch-demo.tsx",
      "type": "registry:example",
      "content": "\"use client\";\n\nimport * as React from \"react\";\n\nimport { Pending } from \"@/registry/bases/radix/components/pending\";\nimport { Label } from \"@/registry/bases/radix/ui/label\";\nimport { Switch } from \"@/registry/bases/radix/ui/switch\";\n\nexport default function PendingSwitchDemo() {\n  const [isEnabled, setIsEnabled] = React.useState(false);\n  const [isPending, setIsPending] = React.useState(false);\n\n  const onToggle = React.useCallback(() => {\n    setIsPending(true);\n\n    // Simulate async API call to save setting\n    setTimeout(() => {\n      setIsEnabled((prev) => !prev);\n      setIsPending(false);\n    }, 1500);\n  }, []);\n\n  return (\n    <div className=\"flex flex-col gap-6\">\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex flex-col gap-1\">\n          <Label htmlFor=\"notifications\">Email Notifications</Label>\n          <p className=\"text-sm text-muted-foreground\">\n            {isPending\n              ? \"Saving...\"\n              : \"Receive email about your account activity\"}\n          </p>\n        </div>\n        <Pending isPending={isPending}>\n          <Switch\n            id=\"notifications\"\n            checked={isEnabled}\n            onCheckedChange={onToggle}\n            className=\"data-pending:cursor-wait data-pending:opacity-70\"\n          />\n        </Pending>\n      </div>\n\n      <div className=\"flex items-center justify-between\">\n        <div className=\"flex flex-col gap-1\">\n          <Label htmlFor=\"marketing\">Marketing Updates</Label>\n          <p className=\"text-sm text-muted-foreground\">\n            Get tips, updates, and special offers\n          </p>\n        </div>\n        <Switch id=\"marketing\" />\n      </div>\n    </div>\n  );\n}\n",
      "target": ""
    }
  ]
}