{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "button-14",
  "title": "Hover rotate refresh",
  "description": "Refresh button whose icon rotates a full 360° on each click.",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button"
  ],
  "files": [
    {
      "path": "registry/patterns/button/button-14.tsx",
      "content": "'use client'\n\nimport { RefreshCwIcon } from 'lucide-react'\nimport { useState } from 'react'\n\nimport { Button } from '@/components/ui/button'\n\nexport function Button14() {\n  const [turns, setTurns] = useState(0)\n\n  return (\n    <Button variant=\"outline\" onClick={() => setTurns((value) => value + 1)}>\n      <RefreshCwIcon\n        data-icon=\"inline-start\"\n        className=\"transition-transform duration-500 ease-in-out\"\n        style={{ transform: `rotate(${turns * 360}deg)` }}\n      />\n      Refresh\n    </Button>\n  )\n}\n",
      "type": "registry:component",
      "target": "components/flx/patterns/button/button-14.tsx"
    }
  ],
  "type": "registry:block"
}