{"_id":"@amitkuzi/feedback-widget","name":"@amitkuzi/feedback-widget","dist-tags":{"latest":"0.1.0"},"versions":{"0.1.0":{"name":"@amitkuzi/feedback-widget","version":"0.1.0","description":"Storage-agnostic React feedback widget + admin inbox. Clients leave comments on any page; you collect them as tasks. Ships a Firestore adapter; bring your own backend.","license":"MIT","author":{"name":"amitkuzi"},"repository":{"type":"git","url":"git+https://github.com/amitkuzi/feadbackWidget.git"},"type":"module","sideEffects":false,"exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./firestore":{"types":"./dist/adapters/firestore.d.ts","import":"./dist/adapters/firestore.js","require":"./dist/adapters/firestore.cjs"}},"main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","scripts":{"build":"tsup","dev":"tsup --watch","typecheck":"tsc --noEmit","prepublishOnly":"npm run build"},"peerDependencies":{"firebase":">=10","react":">=18","react-dom":">=18"},"peerDependenciesMeta":{"firebase":{"optional":true}},"devDependencies":{"@types/react":"^18","@types/react-dom":"^18","firebase":"^11.9.1","react":"^18.3.1","react-dom":"^18.3.1","tsup":"^8.3.5","typescript":"^5"},"keywords":["feedback","widget","react","firestore","bug-report","annotation","comments"],"_id":"@amitkuzi/feedback-widget@0.1.0","gitHead":"f5ed1e46a4b3c9bde1466847c0af92081aef0208","bugs":{"url":"https://github.com/amitkuzi/feadbackWidget/issues"},"homepage":"https://github.com/amitkuzi/feadbackWidget#readme","_nodeVersion":"20.12.2","_npmVersion":"10.5.0","dist":{"integrity":"sha512-6AiPEC4izh+ZEU4Myb1ajN1DCpHruyXZfWqLFpn86gKLO0OHVWZ4clyfz8N+iA+aQr6eGQ7m18B2ctyKuo4iTw==","shasum":"653758ec862c026aa35c6415955240e495c75cc5","tarball":"https://registry.npmjs.org/@amitkuzi/feedback-widget/-/feedback-widget-0.1.0.tgz","fileCount":17,"unpackedSize":108361,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIFT8IABNQ5M8k+zGSGycQJzzKbkrnMEPTOO/n45HwpNdAiAhCx86LAD6FlCeciYTJAdnrE6vBAGVOW9nXy++6/EZQA=="}]},"_npmUser":{"name":"amitkuzi","email":"amitkuzi@gmail.com"},"directories":{},"maintainers":[{"name":"amitkuzi","email":"amitkuzi@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/feedback-widget_0.1.0_1782217748336_0.5617961647683911"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-23T12:29:08.161Z","0.1.0":"2026-06-23T12:29:08.515Z","modified":"2026-06-23T12:29:08.731Z"},"maintainers":[{"name":"amitkuzi","email":"amitkuzi@gmail.com"}],"description":"Storage-agnostic React feedback widget + admin inbox. Clients leave comments on any page; you collect them as tasks. Ships a Firestore adapter; bring your own backend.","homepage":"https://github.com/amitkuzi/feadbackWidget#readme","keywords":["feedback","widget","react","firestore","bug-report","annotation","comments"],"repository":{"type":"git","url":"git+https://github.com/amitkuzi/feadbackWidget.git"},"author":{"name":"amitkuzi"},"bugs":{"url":"https://github.com/amitkuzi/feadbackWidget/issues"},"license":"MIT","readme":"# @amitkuzi/feedback-widget\n\nA tiny, **storage-agnostic** React feedback widget + admin inbox. Drop it into any\napp so clients/testers can leave comments on any page; you collect them as tasks.\n\n- `<FeedbackWidget>` — a floating button + form for reporters.\n- `<FeedbackInbox>` — an admin list to read items and mark them done.\n- Bring your own backend via a small `FeedbackStore` adapter. A **Firestore**\n  adapter ships in the box; `firebase` is an *optional* peer dependency.\n- No CSS framework needed — styles are self-contained inline styles. RTL aware.\n\n## Install\n\n```bash\nnpm install @amitkuzi/feedback-widget\n# only if you use the Firestore adapter:\nnpm install firebase\n```\n\nPeer deps: `react >=18`, `react-dom >=18`, and (optional) `firebase >=10`.\n\n## Quick start (Firestore)\n\n```tsx\n\"use client\";\nimport { useMemo } from \"react\";\nimport { FeedbackWidget } from \"@amitkuzi/feedback-widget\";\nimport { createFirestoreStore } from \"@amitkuzi/feedback-widget/firestore\";\nimport { db } from \"@/lib/firebase\"; // your own Firestore instance\n\nexport function Feedback() {\n  const store = useMemo(\n    () => createFirestoreStore({ db, collectionName: \"feedback\" }),\n    []\n  );\n  return <FeedbackWidget store={store} project=\"my-app\" />;\n}\n```\n\n### Admin inbox\n\n```tsx\n\"use client\";\nimport { FeedbackInbox } from \"@amitkuzi/feedback-widget\";\nimport { createFirestoreStore } from \"@amitkuzi/feedback-widget/firestore\";\nimport { db } from \"@/lib/firebase\";\n\nconst store = createFirestoreStore({ db });\nexport default function Page() {\n  // protect this route yourself (auth check / middleware)\n  return <FeedbackInbox store={store} project=\"my-app\" />;\n}\n```\n\n### Firestore security rules\n\n```\nmatch /feedback/{id} {\n  allow create: if request.auth != null\n    && request.resource.data.message is string\n    && request.resource.data.message.size() > 0\n    && request.resource.data.message.size() < 5000\n    && request.resource.data.status == \"open\";\n  allow read, update, delete: if request.auth != null\n    && request.auth.token.email in ['you@example.com'];\n}\n```\n\n## Bring your own backend\n\nImplement the `FeedbackStore` interface against anything (Supabase, REST, …):\n\n```ts\nimport type { FeedbackStore } from \"@amitkuzi/feedback-widget\";\n\nexport function createRestStore(baseUrl: string): FeedbackStore {\n  return {\n    async submit(input) {\n      const res = await fetch(`${baseUrl}/feedback`, {\n        method: \"POST\",\n        headers: { \"content-type\": \"application/json\" },\n        body: JSON.stringify(input),\n      });\n      const { id } = await res.json();\n      return id;\n    },\n    // optional: subscribe / list / update / remove for the inbox\n  };\n}\n```\n\nOnly `submit` is required for the widget. `<FeedbackInbox>` additionally uses\n`subscribe` (or `list`) and `update`/`remove`.\n\n## Props\n\n### `<FeedbackWidget>`\n| prop | type | default | notes |\n|---|---|---|---|\n| `store` | `FeedbackStore` | — | required |\n| `project` | `string` | — | tag so one store serves many apps |\n| `reporter` | `{ name?; email? }` | — | prefill/attach reporter identity |\n| `categories` | `string[]` | — | shows a select when provided |\n| `position` | `\"bottom-right\" \\| \"bottom-left\"` | `\"bottom-right\"` | |\n| `dir` | `\"ltr\" \\| \"rtl\"` | auto from `document.dir` | |\n| `enabled` | `boolean` | `true` | set false to render nothing (env gating) |\n| `metadata` | `Record<string, unknown>` | — | extra fields on every submission |\n| `buttonLabel` / `title` | `string` | | UI copy |\n| `onSubmitted` | `(id: string) => void` | — | success callback |\n\n### `<FeedbackInbox>`\n| prop | type | default |\n|---|---|---|\n| `store` | `FeedbackStore` | — |\n| `project` | `string` | — |\n| `title` | `string` | `\"Feedback\"` |\n\n## License\n\nMIT\n","readmeFilename":"README.md","_rev":"1-ee05f5d9558ac0be0d2594a98fa85c47"}