{"_id":"@amphivox/react","_rev":"4-96e39720cecdc8048ea75eed2fd0589c","name":"@amphivox/react","dist-tags":{"latest":"0.3.1"},"versions":{"0.1.0":{"name":"@amphivox/react","version":"0.1.0","keywords":["voice","voiceform","amphivox","react","widget","iframe"],"license":"MIT","_id":"@amphivox/react@0.1.0","maintainers":[{"name":"fava007","email":"swapnil.strange0707@gmail.com"}],"homepage":"https://voiceformai.com","bugs":{"url":"https://voiceformai.com"},"dist":{"shasum":"2263b25abd7729b1081e4b9352bc3716c2db880b","tarball":"https://registry.npmjs.org/@amphivox/react/-/react-0.1.0.tgz","fileCount":10,"integrity":"sha512-gm+220s5q9X4uP1AKxmT4p7PyY2ZRVczP+kDA6u0NdCkSMXcS8OQ2HoCCop7NCt4+sCzcJNM7Ggk5KduU0Clwg==","signatures":[{"sig":"MEYCIQC9GlXPs3HhzYidcafHzuSrCQo0MvRNVs9ylOpzATJPeAIhAJvT0oKgOKL16taOWkc84PL7HXIRtm6P/qmCtbeExM5X","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":14894},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"gitHead":"2f2d70ba38f9cb329124d4d5f5e7238c9a7e5e81","scripts":{"test":"vitest run","build":"vite build","test:watch":"vitest","prepublishOnly":"npm run build"},"_npmUser":{"name":"fava007","email":"swapnil.strange0707@gmail.com"},"_npmVersion":"10.2.5","description":"React integration for Amphivox / VoiceForm voice widgets","directories":{},"sideEffects":false,"_nodeVersion":"24.15.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","jsdom":"^24.0.0","react":"^18.0.0","vitest":"^2.0.0","react-dom":"^18.0.0","typescript":"^5.0.0","@types/react":"^18.0.0","vite-plugin-dts":"^3.0.0","@types/react-dom":"^18.0.0","@vitejs/plugin-react":"^4.0.0","@testing-library/react":"^16.0.0","@testing-library/jest-dom":"^6.0.0"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/react_0.1.0_1781069545045_0.306120657328506","host":"s3://npm-registry-packages-npm-production"}},"0.2.0":{"name":"@amphivox/react","version":"0.2.0","keywords":["voice","voiceform","amphivox","react","widget","iframe"],"license":"MIT","_id":"@amphivox/react@0.2.0","maintainers":[{"name":"fava007","email":"swapnil.strange0707@gmail.com"}],"homepage":"https://amphivox.com","bugs":{"email":"contactus@amphivox.com"},"dist":{"shasum":"5c7c9e34b57b06fb100054b90b887eb07b71f3f9","tarball":"https://registry.npmjs.org/@amphivox/react/-/react-0.2.0.tgz","fileCount":10,"integrity":"sha512-IwzErSoL2oEs6iKnSCE1JfpyNUjAhmmroY8EsDaeUSsIkjw01NjbpdTk4bglXVucfnAsut2uKBh+YuJGl1P0NQ==","signatures":[{"sig":"MEUCIQCjIccyJaDr3fdPmfDHKQo7aO2xh5SWIkO+GnDKudWySAIgPz6Bf/vNwvA0JSsbqixsVhilc5kaIxcFmU/9iG6O1hc=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":19423},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"gitHead":"330eb841b095628507a156d8f6751e6e0d8cced2","scripts":{"test":"vitest run","build":"vite build","test:watch":"vitest","prepublishOnly":"npm run build"},"_npmUser":{"name":"fava007","email":"swapnil.strange0707@gmail.com"},"_npmVersion":"10.2.5","description":"React component and hook for embedding an AmphiVox AI voice agent that fills your forms by conversation.","directories":{},"sideEffects":false,"_nodeVersion":"24.15.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","jsdom":"^24.0.0","react":"^18.0.0","vitest":"^2.0.0","react-dom":"^18.0.0","typescript":"^5.0.0","@types/react":"^18.0.0","vite-plugin-dts":"^3.0.0","@types/react-dom":"^18.0.0","@vitejs/plugin-react":"^4.0.0","@testing-library/react":"^16.0.0","@testing-library/jest-dom":"^6.0.0"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/react_0.2.0_1785833616308_0.8780014211217086","host":"s3://npm-registry-packages-npm-production"}},"0.3.0":{"name":"@amphivox/react","version":"0.3.0","keywords":["voice","voiceform","amphivox","react","widget","iframe"],"license":"MIT","_id":"@amphivox/react@0.3.0","maintainers":[{"name":"fava007","email":"swapnil.strange0707@gmail.com"}],"homepage":"https://amphivox.com","bugs":{"email":"contactus@amphivox.com"},"dist":{"shasum":"ad7ce5f1e8eee86234f742717f98b8924a4931f4","tarball":"https://registry.npmjs.org/@amphivox/react/-/react-0.3.0.tgz","fileCount":10,"integrity":"sha512-FfW/esSJora3nmK+eui3IJ1dBMLQqxeVwqf7sgdfmEzhokDtHPKYnHRl6BNGeTH6+1x3U4zOlt5eANz5WlJxUA==","signatures":[{"sig":"MEYCIQCV8+SH6SsqoxWSJM9nnedvFgxkp1Bhv5/S0H5E8BFiQwIhANJqAJMQ1Pti7U19F2wy/2Ci7WO49cUycsvXvGrRnepK","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":22089},"main":"./dist/index.cjs","type":"module","types":"./dist/index.d.ts","module":"./dist/index.js","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"}},"gitHead":"912fe22933eda87e348111c250851183fc366941","scripts":{"test":"vitest run","build":"vite build","test:watch":"vitest","prepublishOnly":"npm run build"},"_npmUser":{"name":"fava007","email":"swapnil.strange0707@gmail.com"},"_npmVersion":"10.2.5","description":"React component and hook for embedding an AmphiVox AI voice agent that fills your forms by conversation.","directories":{},"sideEffects":false,"_nodeVersion":"24.15.0","publishConfig":{"access":"public"},"_hasShrinkwrap":false,"devDependencies":{"vite":"^5.0.0","jsdom":"^24.0.0","react":"^18.0.0","vitest":"^2.0.0","react-dom":"^18.0.0","typescript":"^5.0.0","@types/react":"^18.0.0","vite-plugin-dts":"^3.0.0","@types/react-dom":"^18.0.0","@vitejs/plugin-react":"^4.0.0","@testing-library/react":"^16.0.0","@testing-library/jest-dom":"^6.0.0"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"_npmOperationalInternal":{"tmp":"tmp/react_0.3.0_1786007148521_0.002480651417444024","host":"s3://npm-registry-packages-npm-production"}},"0.3.1":{"name":"@amphivox/react","version":"0.3.1","description":"React component and hook for embedding an AmphiVox AI voice agent that fills your forms by conversation.","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"import":"./dist/index.js","require":"./dist/index.cjs","types":"./dist/index.d.ts"}},"sideEffects":false,"keywords":["voice","voiceform","amphivox","react","widget","iframe"],"license":"MIT","homepage":"https://amphivox.com","bugs":{"email":"contactus@amphivox.com"},"publishConfig":{"access":"public"},"peerDependencies":{"react":">=16.8.0","react-dom":">=16.8.0"},"devDependencies":{"@testing-library/jest-dom":"^6.0.0","@testing-library/react":"^16.0.0","@types/react":"^18.0.0","@types/react-dom":"^18.0.0","@vitejs/plugin-react":"^4.0.0","jsdom":"^24.0.0","react":"^18.0.0","react-dom":"^18.0.0","typescript":"^5.0.0","vite":"^5.0.0","vite-plugin-dts":"^3.0.0","vitest":"^2.0.0"},"scripts":{"build":"vite build","test":"vitest run","test:watch":"vitest","prepublishOnly":"npm run build"},"_id":"@amphivox/react@0.3.1","gitHead":"f11ab54ae4c6759280eafc8ce01ae0d8d6a46c2f","_nodeVersion":"24.15.0","_npmVersion":"10.2.5","dist":{"integrity":"sha512-EQnn6n4hBThHalQS9yYqI/LeC4ArSrJxqUh+GIIC2l45xorAsqpU+iE6Lff5afvP/a6KytZJa7LJslwXrEy74w==","shasum":"1f1363be6213dd9e465f5ff68308be782e78f0e7","tarball":"https://registry.npmjs.org/@amphivox/react/-/react-0.3.1.tgz","fileCount":10,"unpackedSize":22094,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIQC0b5TXENn2DAy7g9J7eTqoDJLlZDdXVT3vfhflEVWcGwIgV3hFfFbY2pYxY6shxRDj/fu0+NYgl3Z7t35bLOR5Zts="}]},"_npmUser":{"name":"fava007","email":"swapnil.strange0707@gmail.com"},"directories":{},"maintainers":[{"name":"fava007","email":"swapnil.strange0707@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react_0.3.1_1786243887796_0.5942223050727262"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-10T05:32:24.906Z","modified":"2026-08-09T02:51:28.076Z","0.1.0":"2026-06-10T05:32:25.176Z","0.2.0":"2026-08-04T08:53:36.445Z","0.3.0":"2026-08-06T09:05:48.658Z","0.3.1":"2026-08-09T02:51:27.942Z"},"bugs":{"email":"contactus@amphivox.com"},"license":"MIT","homepage":"https://amphivox.com","keywords":["voice","voiceform","amphivox","react","widget","iframe"],"description":"React component and hook for embedding an AmphiVox AI voice agent that fills your forms by conversation.","maintainers":[{"name":"fava007","email":"swapnil.strange0707@gmail.com"}],"readme":"# @amphivox/react\r\n\r\nOfficial React integration for [**AmphiVox**](https://amphivox.com) โ replace static form inputs with an AI voice conversation. Your visitors speak their answers; the agent fills your form in real time.\r\n\r\nA component and a hook wrapping the voice widget โ no script tags, no DOM IDs, no lifecycle management. Zero runtime dependencies.\r\n\r\n๐ **[Full documentation](https://amphivox.com/docs/widget/react)** ยท [Not using React?](https://amphivox.com/docs/widget/javascript) ยท [amphivox.com](https://amphivox.com)\r\n\r\n## Install\r\n\r\n```bash\r\nnpm install @amphivox/react\r\n```\r\n\r\nRequires React 16.8+. Get your `formId` and widget key from your form's **Developers** page on [amphivox.com](https://amphivox.com), and add your app's origin to the key's allowed-domains list.\r\n\r\n> Serve your app over HTTPS โ microphone access requires a secure context (`localhost` is exempt).\r\n\r\n## Quick start\r\n\r\nDrop it anywhere. It renders nothing itself; the floating mic button appears bottom-right.\r\n\r\n```tsx\r\nimport { useState } from 'react'\r\nimport { VoiceWidget } from '@amphivox/react'\r\n\r\nfunction ContactForm() {\r\n const [name, setName] = useState('')\r\n\r\n return (\r\n \r\n )\r\n}\r\n```\r\n\r\n## Your own UI\r\n\r\nUse the hook for imperative control, and `hidden` to replace our dock entirely:\r\n\r\n```tsx\r\nimport { useVoiceWidget } from '@amphivox/react'\r\n\r\nfunction VoiceButton() {\r\n const { open, close } = useVoiceWidget({\r\n formId: 'YOUR_FORM_ID',\r\n widgetKey: 'YOUR_WIDGET_KEY',\r\n hidden: true, // no built-in dock\r\n onSpeaking: (who, active) => {/* animate */},\r\n onField: (field, value) => {/* your state */},\r\n })\r\n\r\n return \r\n}\r\n```\r\n\r\nโ ๏ธ Use the `hidden` prop rather than your own `display: none`. The iframe must stay rendered or the browser throttles its keepalive and the session gets dropped mid-conversation. โ [details](https://amphivox.com/docs/widget/react#bring-your-own-ui)\r\n\r\n## Props\r\n\r\n| Prop | Default | |\r\n| --- | --- | --- |\r\n| `formId` ยท `widgetKey` | โ | **Required.** |\r\n| `language` | `'en'` | 45 languages โ [see the list](https://amphivox.com/docs/widget/react#languages) |\r\n| `voiceGender` | `'female'` | or `'male'` |\r\n| `hidden` | `false` | Hide the dock, drive it yourself |\r\n| `prefillData` | `null` | Values you already have, so the agent skips those fields |\r\n| `position` | `'bottom-right'` | or `'bottom-left'`; plus `offsetX` / `offsetY` |\r\n| `showTranscript` | `true` | Transcript panel inside the dock |\r\n| `origin` | `https://amphivox.com` | Override for local dev / self-hosting |\r\n\r\n**Callbacks:** `onReady`, `onField(field, value)`, `onComplete`, `onTimeout`, `onError(error)`, `onTranscript(speaker, text)`, `onThinking(active)`, `onSpeaking(who, active)`, `onMuteChange(muted)`.\r\n\r\n**Controls** from `useVoiceWidget`: `open()`, `close()`, `mute()`, `unmute()`, `setLanguage(code)`, `setVoiceGender('female' | 'male')`.\r\n\r\n**Types:** `VoiceWidgetOptions`, `VoiceWidgetControls`, `VoiceGender`, `VoicePrefillData`, `VoicePrefillValue`, `VoicePrefillScalar`.\r\n\r\nโ [Full prop reference](https://amphivox.com/docs/widget/react#props)\r\n\r\n## Good to know\r\n\r\n- **`onField` values aren't always strings.** Phone is `{ e164, country, national }` and address is an object of components โ `String(value)` on either renders `[object Object]`. โ [value shapes](https://amphivox.com/docs/widget/react#field-value-shapes)\r\n- **Next.js / SSR:** all DOM work happens in effects, so it never runs on the server. In the App Router add `'use client'` to the importing file.\r\n- **`language` and `voiceGender` are seeds, not locks.** The visitor can change both from the dock, and `setLanguage` / `setVoiceGender` apply to the *next* session, not the one in progress.\r\n- **`prefillData` keys are AmphiVox field IDs**, not your state keys โ the reverse of the `FIELD_MAP` you write in `onField`. Read at the start of the *next* session; empty values are dropped but `false` and `0` are kept; phone should be an E.164 string. It is sent to AmphiVox and enters the agent's context, so it is not local to the page. โ [prefill](https://amphivox.com/docs/widget/react#skip-what-you-already-know--prefilldata)\r\n- Only `formId`, `widgetKey`, or `origin` changing re-injects the iframe โ other prop changes never restart a live session.\r\n- **Multiple widgets on one page are safe**, including two on the same `formId` โ each instance only handles messages from its own iframe (fixed in `0.3.0`; earlier versions cross-delivered).\r\n\r\n## Documentation\r\n\r\nLanguage catalog, field mapping, CSP setup, custom UI and troubleshooting:\r\n**[amphivox.com/docs/widget/react](https://amphivox.com/docs/widget/react)**\r\n\r\nQuestions: [contactus@amphivox.com](mailto:contactus@amphivox.com)\r\n\r\n## License\r\n\r\nMIT\r\n","readmeFilename":"README.md"}