{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "manual-image-upload-demo",
  "registryDependencies": [
    "shttps://reusables.vercel.app/r/single-image-upload",
    "https://reusables.vercel.app/r/notify"
  ],
  "files": [
    {
      "path": "registry/example/manual-image-upload-demo.tsx",
      "content": "\"use client\"\n\nimport { useState } from \"react\"\nimport { toast } from \"@/packages/notify/src\"\n\nimport { useFileUpload } from \"@/hooks/use-file-upload\"\nimport { Button } from \"@/components/ui/button\"\n\nimport { SingleImageDropzone } from \"@/components/single-image-upload\"\n\nexport default function ManualImageUploadDemo() {\n  const manualUpload = useFileUpload({\n    onSuccess: () => toast.success(\" Upload Successful!\"),\n    onError: (error) => toast.error(error),\n  })\n  const [manualFile, setManualFile] = useState<File | undefined>()\n\n  return (\n    <div className=\"mx-auto w-full max-w-3xl space-y-4 px-5 py-12 md:px-7 md:py-0\">\n      <SingleImageDropzone\n        width={\"100%\"}\n        height={\"300px\"}\n        directUpload={false}\n        progress={manualUpload.progress}\n        disabled={manualUpload.isUploading}\n        value={manualFile}\n        dropzoneOptions={{\n          maxSize: 5 * 1024 * 1024,\n        }}\n        onChange={setManualFile}\n        progressType=\"circular\"\n      />\n\n      <Button\n        onClick={() => {\n          manualFile && manualUpload.handleFileUpload(manualFile)\n          manualUpload.isUploading && toast.loading(\"Uploading...\")\n        }}\n        disabled={!manualFile || manualUpload.isUploading}\n      >\n        {manualUpload.isUploading ? \"Uploading...\" : \"Start Upload\"}\n      </Button>\n    </div>\n  )\n}\n",
      "type": "registry:example",
      "target": "components/manual-image-upload-demo.tsx"
    }
  ],
  "type": "registry:example"
}