{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "file-upload",
  "title": "File Upload",
  "description": "MateChat File Upload",
  "files": [
    {
      "path": "src/file-upload.tsx",
      "content": "import clsx from \"clsx\";\nimport type React from \"react\";\nimport { useCallback, useRef } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport Appendix from \"@/icons/appendix.svg\";\n\nexport interface FileUploadProps extends React.ComponentProps<\"button\"> {\n  onFilesSelect?: (files: File[]) => void;\n}\n\nexport function FileUpload({\n  className,\n  onFilesSelect,\n  ...props\n}: FileUploadProps) {\n  const fileInputRef = useRef<HTMLInputElement>(null);\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const files = Array.from(e.target.files ?? []);\n      onFilesSelect?.(files);\n      if (fileInputRef.current) fileInputRef.current.value = \"\";\n    },\n    [onFilesSelect],\n  );\n\n  return (\n    <button\n      data-slot=\"file-upload\"\n      type=\"button\"\n      className={twMerge(\n        clsx(\"cursor-pointer text-gray-500 hover:text-gray-500/80\", className),\n      )}\n      onClick={() => fileInputRef.current?.click()}\n      {...props}\n    >\n      <img\n        src={Appendix}\n        alt=\"upload\"\n        className=\"w-5 h-5 dark:filter dark:filter-invert hover:scale-105\"\n      />\n      <input\n        type=\"file\"\n        className=\"hidden\"\n        ref={fileInputRef}\n        onChange={handleChange}\n        multiple\n      />\n    </button>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}