{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "use-set-demo",
  "title": "UseSetDemo",
  "description": "use-set's hook in action.",
  "registryDependencies": [
    "card",
    "button",
    "input",
    "https://guarahooks.com/r/use-set.json"
  ],
  "files": [
    {
      "path": "registry/example/use-set-demo.tsx",
      "content": "'use client';\n\nimport React, { useState } from 'react';\n\nimport { Button } from '@/components/ui/button';\nimport {\n  Card,\n  CardContent,\n  CardDescription,\n  CardFooter,\n  CardHeader,\n  CardTitle,\n} from '@/components/ui/card';\nimport { Input } from '@/components/ui/input';\n\nimport { useSet } from '@/hooks/guarahooks/use-set';\n\nexport default function UseSetDemo() {\n  const {\n    getAll,\n    add,\n    delete: remove,\n    has,\n    clear,\n    reset,\n  } = useSet<string>(['apple', 'banana']);\n\n  const [input, setInput] = useState('');\n\n  return (\n    <Card className=\"relative max-w-md w-full\">\n      <CardHeader>\n        <CardTitle>useSet</CardTitle>\n        <CardDescription>\n          This component uses the <code>useSet</code> hook to manage a set of\n          values.\n        </CardDescription>\n      </CardHeader>\n      <CardContent className=\"space-y-4\">\n        <Input\n          value={input}\n          onChange={(e) => setInput(e.target.value)}\n          placeholder=\"Add fruit\"\n        />\n        <div className=\"flex items-center gap-2\">\n          <Button onClick={() => add(input)}>Add</Button>\n          <Button onClick={() => remove(input)} variant=\"destructive\">\n            Remove\n          </Button>\n          <Button onClick={clear} variant=\"secondary\">\n            Clear\n          </Button>\n          <Button onClick={reset} variant=\"secondary\">\n            Reset\n          </Button>\n        </div>\n        <p>Fruits in the Set:</p>\n        <ul className=\"list-disc list-inside mt-2\">\n          {[...getAll()].map((fruit: string) => (\n            <li key={fruit}>{fruit}</li>\n          ))}\n        </ul>\n      </CardContent>\n      <CardFooter>\n        <p className=\"text-muted-foreground text-sm\">\n          Set (doesn't modify the state): {JSON.stringify(Array.from(getAll()))}\n        </p>\n      </CardFooter>\n    </Card>\n  );\n}\n",
      "type": "registry:example",
      "target": "components/example/use-set-demo.tsx"
    }
  ],
  "type": "registry:example"
}