{"_id":"@a4smanjorg5/react-serial","_rev":"2-e628cb3cf38f71ddd0ffb638611a53a4","name":"@a4smanjorg5/react-serial","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.0":{"name":"@a4smanjorg5/react-serial","version":"0.1.0","license":"MIT","_id":"@a4smanjorg5/react-serial@0.1.0","maintainers":[{"name":"a4smanjorg5","email":"a4smanjorg5@protonmail.com"}],"dist":{"shasum":"f51ae64c71c7495960358a76f184e54acbea74aa","tarball":"https://registry.npmjs.org/@a4smanjorg5/react-serial/-/react-serial-0.1.0.tgz","fileCount":12,"integrity":"sha512-WLv6Gx9mGd8cmZv81YQGauE2u8dzjVhKdNE6/mudD3HEiX5YZJ7A/EqSZIE80wfgh2MVIiz4ZuR5weXN4XXajw==","signatures":[{"sig":"MEUCIENLw/Y59qSWL9Fa3FaBsh2zhZSVqVhYpRy1Si8VGPJlAiEAxuIITPTFV8zL7YaoU2+vcABynxf1CKdpp/reeBi+OeQ=","keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U"}],"unpackedSize":23599},"main":"dist/index.js","types":"dist/index.d.ts","module":"dist/index.mjs","scripts":{"lint":"tsc --noEmit & biome ci","build":"tsup","start":"tsup --watch"},"_npmUser":{"name":"a4smanjorg5","email":"a4smanjorg5@protonmail.com"},"directories":{},"_nodeVersion":"22.21.1","_hasShrinkwrap":false,"devDependencies":{"tsup":"^8.5.1","react":"^19.2.7","@swc/core":"^1.15.41","typescript":"~5.9.3","@types/react":"^19.2.17","@biomejs/biome":"2.4.16","@types/dom-serial":"^1.0.6"},"peerDependencies":{"react":"^18 || ^19"},"_npmOperationalInternal":{"tmp":"tmp/react-serial_0.1.0_1781228787685_0.7537087275897443","host":"s3://npm-registry-packages-npm-production"}},"0.1.1":{"name":"@a4smanjorg5/react-serial","license":"MIT","version":"0.1.1","main":"dist/index.js","module":"dist/index.mjs","types":"dist/index.d.ts","peerDependencies":{"react":"^18 || ^19"},"devDependencies":{"@biomejs/biome":"2.4.16","@swc/core":"^1.15.41","@types/dom-serial":"^1.0.6","@types/react":"^19.2.17","react":"^19.2.7","tsup":"^8.5.1","typescript":"~5.9.3"},"scripts":{"build":"tsup","start":"tsup --watch","lint":"tsc --noEmit & biome ci"},"_id":"@a4smanjorg5/react-serial@0.1.1","description":"A tiny React hook for talking to serial devices from the browser via the [Web Serial API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API).","_integrity":"sha512-MPHaDh1CqIXNUF0H/cTKtZEAPQPIMIK9HET05kQijrvAwfM6OzzQ+N08Y2UYbZT6RgO7m5hetxR+/cw2hLvSuQ==","_resolved":"C:\\Users\\workmate\\AppData\\Local\\Temp\\1f7630fffda348acbdc28932aef1564b\\a4smanjorg5-react-serial-0.1.1.tgz","_from":"file:a4smanjorg5-react-serial-0.1.1.tgz","_nodeVersion":"22.21.1","_npmVersion":"10.9.4","dist":{"integrity":"sha512-MPHaDh1CqIXNUF0H/cTKtZEAPQPIMIK9HET05kQijrvAwfM6OzzQ+N08Y2UYbZT6RgO7m5hetxR+/cw2hLvSuQ==","shasum":"ed9940300bc6f4dcf9ebdcfa1959726e8f661b40","tarball":"https://registry.npmjs.org/@a4smanjorg5/react-serial/-/react-serial-0.1.1.tgz","fileCount":12,"unpackedSize":27277,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEQCIGz3TkDkrIzfhxw9gNQ1+wRtKoe2KHYG7AF4rtvCk4GOAiA+mkKLhqFwzAdgLro95tmwpU3tYtImaKL9ubbrezU76g=="}]},"_npmUser":{"name":"a4smanjorg5","email":"a4smanjorg5@protonmail.com"},"directories":{},"maintainers":[{"name":"a4smanjorg5","email":"a4smanjorg5@protonmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/react-serial_0.1.1_1783063068872_0.06434085575680126"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-12T01:46:27.470Z","modified":"2026-07-03T07:17:49.118Z","0.1.0":"2026-06-12T01:46:27.835Z","0.1.1":"2026-07-03T07:17:49.004Z"},"license":"MIT","maintainers":[{"name":"a4smanjorg5","email":"a4smanjorg5@protonmail.com"}],"readme":"# @a4smanjorg5/react-serial\n\nA tiny React hook for talking to serial devices from the browser via the [Web Serial API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API).\n\n`useSerial` handles port selection, opening the connection, continuously reading the incoming stream into React state, writing data back, and cleanly tearing everything down on unmount.\n\n## Requirements\n\n- **React** `^18 || ^19` (peer dependency)\n- A browser that supports the Web Serial API — **Chrome / Edge** (desktop). The hook will `alert` and bail out where `navigator.serial` is unavailable.\n- The Web Serial API only works in a **secure context** (HTTPS or `localhost`) and must be triggered by a user gesture (e.g. a button click).\n\n## Installation\n\n```bash\nnpm install @a4smanjorg5/react-serial\n# or\npnpm add @a4smanjorg5/react-serial\n# or\nyarn add @a4smanjorg5/react-serial\n```\n\n## Usage\n\n```tsx\nimport { useSerial } from '@a4smanjorg5/react-serial'\n\nexport function SerialMonitor() {\n const { isConnected, receivedData, connectSerial, disconnectSerial, sendData } =\n useSerial()\n\n return (\n
\n {isConnected ? (\n \n ) : (\n // Must be called from a user gesture\n \n )}\n\n
\n )\n}\n```\n\nBy default incoming bytes are decoded as UTF-8 text, so `receivedData` is a `string`.\n\n## API\n\n```ts\nconst { isConnected, receivedData, connectSerial, disconnectSerial, sendData } =\n useSerial(onData?, options?)\n```\n\n### Parameters\n\n| Parameter | Type | Description |\n| --- | --- | --- |\n| `onData` | `(data?: Uint8Array, prev?: Uint8Array \\| T) => T` | Reducer called for every chunk read from the port. Receives the raw bytes and the previous accumulated value, and returns the new value stored in `receivedData`. Defaults to UTF-8 decoding each chunk to a `string`. |\n| `options` | `SerialPortRequestOptions` | Passed to `navigator.serial.requestPort()`, e.g. `{ filters: [{ usbVendorId: 0x2341 }] }`, to limit the devices shown in the picker. |\n\n### Return value\n\n| Field | Type | Description |\n| --- | --- | --- |\n| `isConnected` | `boolean` | Whether a port is currently open. |\n| `receivedData` | `T \\| undefined` | Latest value produced by `onData` (a `string` by default). |\n| `connectSerial` | `(options?: SerialOptions) => void` | Prompts the user to pick a port and opens it. Defaults to `{ baudRate: 9600 }`. Must be invoked from a user gesture. |\n| `disconnectSerial` | `() => void` | Cancels the reader and closes the port cleanly. |\n| `sendData` | `(message: Uint8Array) => void` | Writes bytes to the device. No-op when the port is not writable. |\n\n### `SerialOptions`\n\nPassed to `port.open()`:\n\n| Field | Type | Default |\n| --- | --- | --- |\n| `baudRate` | `number` | `9600` |\n| `dataBits` | `number` | — |\n| `stopBits` | `number` | — |\n| `parity` | `'none' \\| 'even' \\| 'odd' \\| 'mark' \\| 'space'` | — |\n| `bufferSize` | `number` | — |\n| `flowControl` | `'none' \\| 'hardware'` | — |\n\n## Custom data handling\n\nPass an `onData` reducer to accumulate or transform incoming bytes. For example, to keep a running log of all decoded text:\n\n```tsx\nconst decoder = new TextDecoder()\n\nconst { receivedData } = useSerial((data, prev = '') =>\n prev + decoder.decode(data),\n)\n```\n\nBecause the return type is generic, you can also build up structured state (e.g. parsing newline-delimited frames) by typing the hook accordingly: `useSerial(...)`.\n\n## Development\n\nThis package builds with [tsup](https://tsup.egoist.dev/) and lints/formats with [Biome](https://biomejs.dev/).\n\n```bash\nnpm run build # one-off build (ESM + CJS + type declarations) into dist/\nnpm run start # build in watch mode\nnpm run lint # checks code quality\n```\n\n## License\n\nSee the repository for license details.\n","readmeFilename":"README.md","description":"A tiny React hook for talking to serial devices from the browser via the [Web Serial API](https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API)."}