{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tailwind-colorswatch",
  "type": "registry:ui",
  "title": "ColorSwatch",
  "dependencies": [
    "react",
    "react-aria-components",
    "tailwindcss-react-aria-components",
    "tw-animate-css"
  ],
  "registryDependencies": [
    "https://react-aria.adobe.com/registry/tailwind-utils.json"
  ],
  "files": [
    {
      "path": "components/ui/ColorSwatch.tsx",
      "type": "registry:ui",
      "content": "'use client';\nimport React from 'react';\nimport {\n  ColorSwatch as AriaColorSwatch,\n  type ColorSwatchProps\n} from 'react-aria-components/ColorSwatch';\nimport {composeTailwindRenderProps} from '@/registry/react-aria/lib/react-aria-utils';\n\nexport function ColorSwatch(props: ColorSwatchProps) {\n  return (\n    <AriaColorSwatch\n      {...props}\n      className={composeTailwindRenderProps(\n        props.className,\n        'w-8 h-8 box-border rounded-md border border-black/10'\n      )}\n      style={({color}) => ({\n        background: `linear-gradient(${color}, ${color}),\n          repeating-conic-gradient(#CCC 0% 25%, white 0% 50%) 50% / 16px 16px`\n      })}\n    />\n  );\n}\n"
    }
  ],
  "css": {
    "@plugin \"tailwindcss-react-aria-components\"": {},
    "@import \"tw-animate-css\"": {}
  }
}