{"_id":"@airnauts/airside-integration-react","_rev":"5-3e73fa18706d01c9b4b94d91e14327c3","name":"@airnauts/airside-integration-react","dist-tags":{"latest":"0.10.1"},"versions":{"0.8.2":{"name":"@airnauts/airside-integration-react","version":"0.8.2","keywords":["comments","commenting","annotations","feedback","airnauts","react","widget"],"author":{"name":"Airnauts"},"license":"MIT","_id":"@airnauts/airside-integration-react@0.8.2","maintainers":[{"name":"jkrzemie","email":"hello@airnauts.com"},{"name":"mateuszpaulski","email":"mateusz@airnauts.com"}],"homepage":"https://github.com/Airnauts/airside#readme","bugs":{"url":"https://github.com/Airnauts/airside/issues"},"dist":{"shasum":"993a4587cbe208fdbb398fd67fecdb52b82677a4","tarball":"https://registry.npmjs.org/@airnauts/airside-integration-react/-/airside-integration-react-0.8.2.tgz","fileCount":9,"integrity":"sha512-52aAN3wJvH5P2ZRLGnNYefeRjlFPAteVUMD0cvh+wC422WomuHIx/v6LiWebdt3j9T1/mGPsRHinIWnAIusG0w==","signatures":[{"sig":"MEQCIBe6W5ofQ3ns0/yrtqq9InvqMENg22NaouM4/2zBd1xRAiBvKuBpD1Iu+90JPVo+Zr4iLv7y+9ObZvWTpUmKZQ7IKw==","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":7738},"type":"module","_from":"file:airnauts-airside-integration-react-0.8.2.tgz","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"}},"scripts":{"test":"vitest run","build":"tsup && tsc --build --force","typecheck":"tsc --build"},"_npmUser":{"name":"mateuszpaulski","email":"mateusz@airnauts.com"},"_resolved":"/tmp/99a6131da0ba1e80d630ccc859ba5c0f/airnauts-airside-integration-react-0.8.2.tgz","_integrity":"sha512-52aAN3wJvH5P2ZRLGnNYefeRjlFPAteVUMD0cvh+wC422WomuHIx/v6LiWebdt3j9T1/mGPsRHinIWnAIusG0w==","repository":{"url":"git+https://github.com/Airnauts/airside.git","type":"git","directory":"packages/integration-react"},"_npmVersion":"10.9.8","description":"React mount () for embedding the Airside commenting widget in any React host.","directories":{},"_nodeVersion":"22.22.3","dependencies":{"@airnauts/airside-client":"^0.8.2"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jsdom":"^26.0.0","react":"^19.0.0","react-dom":"^19.0.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0","@vitejs/plugin-react":"^4.3.4","@testing-library/react":"^16.2.0","@testing-library/jest-dom":"^6.6.3"},"peerDependencies":{"react":"^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/airside-integration-react_0.8.2_1781621639215_0.9379353101759957","host":"s3://npm-registry-packages-npm-production"}},"0.9.0":{"name":"@airnauts/airside-integration-react","version":"0.9.0","keywords":["comments","commenting","annotations","feedback","airnauts","react","widget"],"author":{"name":"Airnauts"},"license":"MIT","_id":"@airnauts/airside-integration-react@0.9.0","maintainers":[{"name":"jkrzemie","email":"hello@airnauts.com"},{"name":"mateuszpaulski","email":"mateusz@airnauts.com"}],"homepage":"https://github.com/Airnauts/airside#readme","bugs":{"url":"https://github.com/Airnauts/airside/issues"},"dist":{"shasum":"068be4f88b8161a9ec444eab587f620d8bea3ba3","tarball":"https://registry.npmjs.org/@airnauts/airside-integration-react/-/airside-integration-react-0.9.0.tgz","fileCount":9,"integrity":"sha512-VLu00BWI5j6/6u8HSOz8fR1bYy4w3tcKRWPYM/rVg9qVRB0EQwBaa0ada6OZlnA5p3Da1FWQfEg+ANt3GbJGDw==","signatures":[{"sig":"MEUCIQCtU75jmJXCVDu6chgcgvVvE6pEAwLKMbTsQyO79MRuxAIgI+vs2/g9fn5jqpjf1mJvobkz9gtDG4BlSzFO0h1/uxY=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":7738},"type":"module","_from":"file:airnauts-airside-integration-react-0.9.0.tgz","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"}},"scripts":{"test":"vitest run","build":"tsup && tsc --build --force","typecheck":"tsc --build"},"_npmUser":{"name":"mateuszpaulski","email":"mateusz@airnauts.com"},"_resolved":"/tmp/15bd463f223efe72a04728ef2590353e/airnauts-airside-integration-react-0.9.0.tgz","_integrity":"sha512-VLu00BWI5j6/6u8HSOz8fR1bYy4w3tcKRWPYM/rVg9qVRB0EQwBaa0ada6OZlnA5p3Da1FWQfEg+ANt3GbJGDw==","repository":{"url":"git+https://github.com/Airnauts/airside.git","type":"git","directory":"packages/integration-react"},"_npmVersion":"10.9.8","description":"React mount () for embedding the Airside commenting widget in any React host.","directories":{},"_nodeVersion":"22.22.3","dependencies":{"@airnauts/airside-client":"^0.9.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jsdom":"^26.0.0","react":"^19.0.0","react-dom":"^19.0.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0","@vitejs/plugin-react":"^4.3.4","@testing-library/react":"^16.2.0","@testing-library/jest-dom":"^6.6.3"},"peerDependencies":{"react":"^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/airside-integration-react_0.9.0_1781622015592_0.05176943731517447","host":"s3://npm-registry-packages-npm-production"}},"0.9.1":{"name":"@airnauts/airside-integration-react","version":"0.9.1","keywords":["comments","commenting","annotations","feedback","airnauts","react","widget"],"author":{"name":"Airnauts"},"license":"MIT","_id":"@airnauts/airside-integration-react@0.9.1","maintainers":[{"name":"jkrzemie","email":"hello@airnauts.com"},{"name":"mateuszpaulski","email":"mateusz@airnauts.com"}],"homepage":"https://github.com/Airnauts/airside#readme","bugs":{"url":"https://github.com/Airnauts/airside/issues"},"dist":{"shasum":"d88e4c520cda36b464389ad0b5ee016ce85be554","tarball":"https://registry.npmjs.org/@airnauts/airside-integration-react/-/airside-integration-react-0.9.1.tgz","fileCount":9,"integrity":"sha512-Ccl8KoEg4A3tOyx24QZCii1O6DIszNWORzJVgT/7S4FhA9bdhDPUQv64qYpJFd0CQ39hl92Db9ccMGOxFD1zLA==","signatures":[{"sig":"MEUCIF/1Jgs8uUJqRXREd5DkwJx9HV1K3204BDMQ81XTuJzDAiEA9cNyODd7L6l/5OclcHq+CPQ2gJ9GNEQ8Cz0Jbwia240=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":9862},"type":"module","_from":"file:airnauts-airside-integration-react-0.9.1.tgz","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"}},"scripts":{"test":"vitest run","build":"tsup && tsc --build --force","typecheck":"tsc --build"},"_npmUser":{"name":"mateuszpaulski","email":"mateusz@airnauts.com"},"_resolved":"/tmp/c2705da3fd3df948067a0d7188579412/airnauts-airside-integration-react-0.9.1.tgz","_integrity":"sha512-Ccl8KoEg4A3tOyx24QZCii1O6DIszNWORzJVgT/7S4FhA9bdhDPUQv64qYpJFd0CQ39hl92Db9ccMGOxFD1zLA==","repository":{"url":"git+https://github.com/Airnauts/airside.git","type":"git","directory":"packages/integration-react"},"_npmVersion":"10.9.8","description":"React mount () for embedding the Airside commenting widget in any React host.","directories":{},"_nodeVersion":"22.22.3","dependencies":{"@airnauts/airside-client":"^0.9.1"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jsdom":"^26.0.0","react":"^19.0.0","react-dom":"^19.0.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0","@vitejs/plugin-react":"^4.3.4","@testing-library/react":"^16.2.0","@testing-library/jest-dom":"^6.6.3"},"peerDependencies":{"react":"^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/airside-integration-react_0.9.1_1781770414648_0.7733121283827407","host":"s3://npm-registry-packages-npm-production"}},"0.10.0":{"name":"@airnauts/airside-integration-react","version":"0.10.0","keywords":["comments","commenting","annotations","feedback","airnauts","react","widget"],"author":{"name":"Airnauts"},"license":"MIT","_id":"@airnauts/airside-integration-react@0.10.0","maintainers":[{"name":"jkrzemie","email":"hello@airnauts.com"},{"name":"mateuszpaulski","email":"mateusz@airnauts.com"}],"homepage":"https://github.com/Airnauts/airside#readme","bugs":{"url":"https://github.com/Airnauts/airside/issues"},"dist":{"shasum":"04dd955db8cd365bb4a69b541f92ff20c8cd7922","tarball":"https://registry.npmjs.org/@airnauts/airside-integration-react/-/airside-integration-react-0.10.0.tgz","fileCount":9,"integrity":"sha512-h113BabwxBgAJiWUeEe7X4FZtQ4hOV79IVsB7DubuLshDBAVDMPzgMPWTUvDkuyEgp13clvkNd0ZY9/j4cGKnQ==","signatures":[{"sig":"MEYCIQCai585lPWLxwCUgiuk9PNB3KFQfrptpo+URjYOhqiNmgIhAOcxeUU2CCcoOjo8ZCuxVqrDP8Rp87c7H4nDIJbiV0p7","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":9864},"type":"module","_from":"file:airnauts-airside-integration-react-0.10.0.tgz","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"}},"scripts":{"test":"vitest run","build":"tsup && tsc --build --force","typecheck":"tsc --build"},"_npmUser":{"name":"mateuszpaulski","email":"mateusz@airnauts.com"},"_resolved":"/tmp/7ecdad019f10493d56b7880b9bf6639c/airnauts-airside-integration-react-0.10.0.tgz","_integrity":"sha512-h113BabwxBgAJiWUeEe7X4FZtQ4hOV79IVsB7DubuLshDBAVDMPzgMPWTUvDkuyEgp13clvkNd0ZY9/j4cGKnQ==","repository":{"url":"git+https://github.com/Airnauts/airside.git","type":"git","directory":"packages/integration-react"},"_npmVersion":"10.9.8","description":"React mount () for embedding the Airside commenting widget in any React host.","directories":{},"_nodeVersion":"22.23.0","dependencies":{"@airnauts/airside-client":"^0.10.0"},"publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"jsdom":"^26.0.0","react":"^19.0.0","react-dom":"^19.0.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0","@vitejs/plugin-react":"^4.3.4","@testing-library/react":"^16.2.0","@testing-library/jest-dom":"^6.6.3"},"peerDependencies":{"react":"^19.0.0"},"_npmOperationalInternal":{"tmp":"tmp/airside-integration-react_0.10.0_1782730555653_0.2554094890847538","host":"s3://npm-registry-packages-npm-production"}},"0.10.1":{"name":"@airnauts/airside-integration-react","version":"0.10.1","description":"React mount () for embedding the Airside commenting widget in any React host.","keywords":["comments","commenting","annotations","feedback","airnauts","react","widget"],"license":"MIT","author":{"name":"Airnauts"},"homepage":"https://github.com/Airnauts/airside#readme","repository":{"type":"git","url":"git+https://github.com/Airnauts/airside.git","directory":"packages/integration-react"},"bugs":{"url":"https://github.com/Airnauts/airside/issues"},"type":"module","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js"}},"publishConfig":{"access":"public"},"dependencies":{"@airnauts/airside-client":"^0.10.1"},"peerDependencies":{"react":"^19.0.0"},"devDependencies":{"@testing-library/jest-dom":"^6.6.3","@testing-library/react":"^16.2.0","@types/react":"^19.0.0","@types/react-dom":"^19.0.0","@vitejs/plugin-react":"^4.3.4","jsdom":"^26.0.0","react":"^19.0.0","react-dom":"^19.0.0"},"scripts":{"build":"tsup && tsc --build --force","typecheck":"tsc --build","test":"vitest run"},"_id":"@airnauts/airside-integration-react@0.10.1","_integrity":"sha512-IcyebmpmPsMeXTGSuDRffQzJ1aqDRC8DFTr1Pd/4IVg83b0e4Rl2c2SNigVvH1E+oDSgGi2X7IBTJXyLdSHIqg==","_resolved":"/tmp/7b8a88b46b40cdb65dda256b5382a54b/airnauts-airside-integration-react-0.10.1.tgz","_from":"file:airnauts-airside-integration-react-0.10.1.tgz","_nodeVersion":"22.23.0","_npmVersion":"10.9.8","dist":{"integrity":"sha512-IcyebmpmPsMeXTGSuDRffQzJ1aqDRC8DFTr1Pd/4IVg83b0e4Rl2c2SNigVvH1E+oDSgGi2X7IBTJXyLdSHIqg==","shasum":"75b431cf074ea7829288df6c4f649de3ebd37416","tarball":"https://registry.npmjs.org/@airnauts/airside-integration-react/-/airside-integration-react-0.10.1.tgz","fileCount":9,"unpackedSize":9864,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIG2CrtSNk1JGI8qPCGHPf+7d4j37SvhZIMlRFXnKJvXtAiEAmeXlZ6O9AI2lNApyr6ZN6+2cPRd4xlSiECcMCt4/Lfk="}]},"_npmUser":{"name":"mateuszpaulski","email":"mateusz@airnauts.com"},"directories":{},"maintainers":[{"name":"jkrzemie","email":"hello@airnauts.com"},{"name":"mateuszpaulski","email":"mateusz@airnauts.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/airside-integration-react_0.10.1_1782737641935_0.8408989447518966"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-16T14:53:59.016Z","modified":"2026-06-29T12:54:02.221Z","0.8.2":"2026-06-16T14:53:59.327Z","0.9.0":"2026-06-16T15:00:15.726Z","0.9.1":"2026-06-18T08:13:34.773Z","0.10.0":"2026-06-29T10:55:55.798Z","0.10.1":"2026-06-29T12:54:02.094Z"},"bugs":{"url":"https://github.com/Airnauts/airside/issues"},"author":{"name":"Airnauts"},"license":"MIT","homepage":"https://github.com/Airnauts/airside#readme","keywords":["comments","commenting","annotations","feedback","airnauts","react","widget"],"repository":{"type":"git","url":"git+https://github.com/Airnauts/airside.git","directory":"packages/integration-react"},"description":"React mount () for embedding the Airside commenting widget in any React host.","maintainers":[{"name":"jkrzemie","email":"hello@airnauts.com"},{"name":"mateuszpaulski","email":"mateusz@airnauts.com"}],"readme":"

\n \n \n \n \"Airside\"\n \n \n

\nEmbeddable Commenting Tool\n

\n

\n\n# @airnauts/airside-integration-react\n\nThe `` React mount for [Airside](https://github.com/Airnauts/airside). Drop it anywhere in a React tree to embed the commenting widget; it calls `airside.init()` on mount and tears down on unmount. The widget bundles its own React, so this wrapper only needs the host's `react` as a peer.\n\n## Installation\n\n```bash\npnpm add @airnauts/airside-integration-react react\n# npm install @airnauts/airside-integration-react react\n```\n\n## Quick start\n\nThe built module ships a `'use client'` banner, so you can render it directly in a React Server Component tree:\n\n```tsx\nimport { AirsideLayer } from '@airnauts/airside-integration-react'\n\nexport function App() {\n return \n}\n```\n\n`init()`'s activation gate keeps the widget inert until the page is opened once with `?airside-key=…`, so `` can render unconditionally. The `key` prop name is reserved by React, so the secret is passed as `airsideKey`; every other `init()` option (`endpoint`, `pageKey`, `features`, …) is accepted as-is.\n\n> **Next.js:** `@airnauts/airside-integration-next` re-exports `AirsideLayer` from `@airnauts/airside-integration-next/client`, so a Next app can install a single package for both the API route and the widget mount.\n\n## API reference\n\n### `AirsideLayer`\n\n```tsx\nimport { AirsideLayer } from '@airnauts/airside-integration-react'\n\n\n```\n\nA React component that calls `airside.init()` on mount and `handle.destroy()` on unmount. Re-initialises only when `airsideKey`, `endpoint`, or `keyParam` change — not on every render.\n\nReturns `null` (renders nothing into the DOM).\n\n#### `AirsideLayerProps`\n\nAll props from [`InitOptions`](https://github.com/Airnauts/airside/blob/main/packages/client/README.md#initoptions) are accepted, except `key` (reserved by React) which is replaced by `airsideKey`:\n\n| Prop | Type | Required | Description |\n|---|---|---|---|\n| `airsideKey` | `string` | ✓ | The secret key (`key` in `InitOptions`); sent as `x-airside-key` on every API request |\n| `endpoint` | `string` | ✓ | Base URL of the comments API, e.g. `\"/api/airside\"` |\n| `pageKey` | `(url: string) => string` | | Override the default `origin + pathname` page identity |\n| `keyParam` | `string` | | URL param the activation gate reads (default `\"airside-key\"`) |\n| `threadParam` | `string` | | URL param used for thread deep-links (default `\"airside-thread\"`) |\n| `features.screenshots` | `boolean` | | Enable screenshot capture (default off) |\n| `features.textAnchors` | `boolean` | | Enable text-selection anchoring (default off) |\n| `provenance` | `Provenance` | | Optional deploy metadata attached to new threads (`commitSha`, `branch`, `deploymentId`) |\n\n## Peer dependencies & requirements\n\n| Peer | Required | Notes |\n|---|---|---|\n| `react` | `^19.0.0` | Host app's React; the widget bundles its own copy separately |\n\n- Node.js ≥ 18 (for server-side rendering stubs; the widget itself only runs in the browser)\n\n## Related packages\n\n- **`@airnauts/airside-client`** — the widget engine this component wraps (`airside.init()`)\n- **`@airnauts/airside-integration-next`** — Next.js integration that re-exports `AirsideLayer` from its `/client` subpath\n- **`@airnauts/airside-server`** — the HTTP API the widget connects to\n\n## License\n\nMIT © [Airnauts](https://www.airnauts.com/)\n","readmeFilename":"README.md"}