{"_id":"@bunny.net/upload-vue","_rev":"2-405f5a48098117b48b02a49a9468e39c","name":"@bunny.net/upload-vue","dist-tags":{"latest":"0.0.2"},"versions":{"0.0.1":{"name":"@bunny.net/upload-vue","version":"0.0.1","_id":"@bunny.net/upload-vue@0.0.1","maintainers":[{"name":"kevin_at_bunny","email":"kevin@bunny.net"},{"name":"antho-bunny","email":"anthony@bunny.net"},{"name":"notrab","email":"jamie@notrab.dev"},{"name":"bogdan-at-bunny","email":"bogdan@bunny.net"}],"dist":{"shasum":"8d3bef8ba299636fa03739bf33786055e28621e0","tarball":"https://registry.npmjs.org/@bunny.net/upload-vue/-/upload-vue-0.0.1.tgz","fileCount":8,"integrity":"sha512-CrvM19D5LNdwoDbXp7giVVtBqzRT1VlYiMVzQ9dIrieirhZlkc15HMxU+FNB0N9JNibPDPdbSXHWUQhvlXzP7w==","signatures":[{"sig":"MEQCIAR+beggZmse3pTEnykJyDzODITjc3QRy+P+lFgp9Ib+AiASh3NBn7rNVWD6vEHLTCV6Fo5/V59zZQpQ/qV3GgR7ew==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":137090},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"require":{"types":"./dist/index.d.cts","default":"./dist/index.cjs"}}},"gitHead":"e30b7b82d2997aaa97925aead3cee193bfe1935e","scripts":{"dev":"tsup --watch","test":"vitest run --passWithNoTests","build":"tsup","clean":"rm -rf dist","typecheck":"tsc --noEmit"},"_npmUser":{"name":"notrab","email":"jamie@notrab.dev"},"_npmVersion":"10.8.2","description":"Vue composable and drop-in component for [bunny-upload](../../README.md).","directories":{},"_nodeVersion":"20.20.1","dependencies":{"@bunny.net/upload-core":"workspace:*"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vue":"^3.5.0","tsup":"^8.0.0","vitest":"^2.0.0","typescript":"^5.5.0"},"peerDependencies":{"vue":"^3.3.0"},"_npmOperationalInternal":{"tmp":"tmp/upload-vue_0.0.1_1774534843504_0.0977411138955484","host":"s3://npm-registry-packages-npm-production"}},"0.0.2":{"name":"@bunny.net/upload-vue","publishConfig":{"access":"public"},"version":"0.0.2","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"import":{"types":"./dist/index.d.ts","default":"./dist/index.js"},"require":{"types":"./dist/index.d.cts","default":"./dist/index.cjs"}}},"scripts":{"build":"tsup","dev":"tsup --watch","test":"vitest run --passWithNoTests","typecheck":"tsc --noEmit","clean":"rm -rf dist"},"dependencies":{"@bunny.net/upload-core":"0.0.2"},"peerDependencies":{"vue":"^3.3.0"},"devDependencies":{"vue":"^3.5.0","tsup":"^8.0.0","typescript":"^5.5.0","vitest":"^2.0.0"},"_id":"@bunny.net/upload-vue@0.0.2","gitHead":"93aa8ca7a45d19966df2a8f738e18ca517a03e01","description":"Vue composable and drop-in component for [bunny-upload](../../README.md).","_nodeVersion":"20.20.1","_npmVersion":"10.8.2","dist":{"integrity":"sha512-Q1aK04X+yeAT5G2wtxFVxV583FeTLhGdnHiNVysP0BFvthgqJbyR0a8FGVzH4Ks3tJiHANsPC7+cRwseiQ2POw==","shasum":"00539629dad760248c5e975d5d77bb5cc09755dc","tarball":"https://registry.npmjs.org/@bunny.net/upload-vue/-/upload-vue-0.0.2.tgz","fileCount":8,"unpackedSize":137084,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCICEuO5/PysdNcc5fpAHz9cY5GMOvvaqiqpVu9G7W4yN6AiEA4ZtddTy94ccB4n8b3FqgwhQaSbd3dLU8GisIIKGJ+KA="}]},"_npmUser":{"name":"notrab","email":"jamie@notrab.dev"},"directories":{},"maintainers":[{"name":"kevin_at_bunny","email":"kevin@bunny.net"},{"name":"antho-bunny","email":"anthony@bunny.net"},{"name":"notrab","email":"jamie@notrab.dev"},{"name":"bogdan-at-bunny","email":"bogdan@bunny.net"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/upload-vue_0.0.2_1774539277023_0.9988188462239012"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-26T14:20:43.383Z","modified":"2026-03-26T15:34:37.344Z","0.0.1":"2026-03-26T14:20:43.660Z","0.0.2":"2026-03-26T15:34:37.178Z"},"description":"Vue composable and drop-in component for [bunny-upload](../../README.md).","maintainers":[{"name":"kevin_at_bunny","email":"kevin@bunny.net"},{"name":"antho-bunny","email":"anthony@bunny.net"},{"name":"notrab","email":"jamie@notrab.dev"},{"name":"bogdan-at-bunny","email":"bogdan@bunny.net"}],"readme":"# @bunny.net/upload-vue\n\nVue composable and drop-in component for [bunny-upload](../../README.md).\n\n## Install\n\n```bash\nnpm install @bunny.net/upload-vue @bunny.net/upload-handler\n```\n\n## Drop-in component\n\n```vue\n<script setup lang=\"ts\">\nimport { BunnyUpload, type UploadResult } from \"@bunny.net/upload-vue\";\n\nfunction onComplete(files: UploadResult[]) {\n  console.log(\"Uploaded:\", files);\n}\n</script>\n\n<template>\n  <BunnyUpload\n    :accept=\"['image/*']\"\n    max-size=\"10mb\"\n    :max-files=\"5\"\n    @complete=\"onComplete\"\n  />\n</template>\n```\n\n### Props\n\n| Prop | Type | Default | Description |\n|---|---|---|---|\n| `endpoint` | `string` | `\"/.bunny/upload\"` | Server upload endpoint |\n| `accept` | `string[]` | — | Allowed MIME types (e.g. `[\"image/*\"]`) |\n| `maxSize` | `string \\| number` | — | Max file size (e.g. `\"10mb\"`) |\n| `maxFiles` | `number` | — | Max number of files |\n| `autoUpload` | `boolean` | `true` | Upload immediately when files are added |\n\n### Events\n\n| Event | Payload | Description |\n|---|---|---|\n| `complete` | `UploadResult[]` | All uploads finished |\n| `error` | `Error` | An upload failed |\n\n## Headless composable\n\nFor full control over the UI:\n\n```vue\n<script setup lang=\"ts\">\nimport { useBunnyUpload } from \"@bunny.net/upload-vue\";\n\nconst { files, addFiles, removeFile, upload, reset, isUploading } = useBunnyUpload({\n  accept: [\"image/*\"],\n  maxSize: \"10mb\",\n  maxFiles: 5,\n  onComplete: (results) => console.log(results),\n});\n\nfunction onFileChange(event: Event) {\n  const input = event.target as HTMLInputElement;\n  if (input.files) addFiles(input.files);\n}\n</script>\n\n<template>\n  <div>\n    <input type=\"file\" multiple @change=\"onFileChange\" />\n    <div v-for=\"file in files.value\" :key=\"file.id\">\n      {{ file.name }} — {{ file.status }} ({{ file.progress }}%)\n      <button @click=\"removeFile(file.id)\">Remove</button>\n    </div>\n    <button @click=\"upload\" :disabled=\"isUploading.value\">Upload</button>\n  </div>\n</template>\n```\n\n## Shared defaults\n\nUse `configureBunnyUpload` to set defaults across your app:\n\n```ts\nimport { configureBunnyUpload } from \"@bunny.net/upload-vue\";\n\nconst { BunnyUpload, useBunnyUpload } = configureBunnyUpload({\n  accept: [\"image/*\"],\n  maxSize: \"10mb\",\n  maxFiles: 5,\n});\n\nexport { BunnyUpload, useBunnyUpload };\n```\n\n## Server setup\n\nYou'll need a server route to handle uploads. See the [handler docs](../handler) for full options.\n\nFor Nuxt, see [`@bunny.net/upload-nuxt`](../nuxt). For other backends, the handler works with any framework that supports standard `Request`/`Response`.\n","readmeFilename":"README.md"}