{"_id":"@booyaka101/fudog-js","name":"@booyaka101/fudog-js","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"@booyaka101/fudog-js","version":"1.0.0","private":false,"main":"dist/index.js","module":"dist/index.mjs","exports":{".":{"import":"./dist/index.mjs","require":"./dist/index.js","default":"./dist/index.mjs"}},"types":"index.d.ts","sideEffects":false,"publishConfig":{"access":"public"},"scripts":{"build":"tsup --config tsup.config.cjs","prepare":"npm run build","dev":"tsup --config tsup.config.cjs --watch"},"peerDependencies":{"@emotion/react":"^11.0.0","@emotion/styled":"^11.0.0","@mui/material":"^6.0.0","react":"^18.0.0","react-dom":"^18.0.0"},"devDependencies":{"tsup":"^8.0.0","typescript":"^5.9.3","@types/react":"^18.0.0","@types/react-dom":"^18.0.0"},"dependencies":{},"repository":{"type":"git","url":"git+https://github.com/booyaka101/fudog-js.git"},"keywords":["react","ndi","preview","mjpeg","video","mui","component"],"author":{"name":"booyaka101"},"license":"ISC","bugs":{"url":"https://github.com/booyaka101/fudog-js/issues"},"homepage":"https://github.com/booyaka101/fudog-js#readme","description":"React NDI preview component for MJPEG streams on Linux.","gitHead":"e24fb8b297d38d85f845cc552b71983266de2716","_id":"@booyaka101/fudog-js@1.0.0","_nodeVersion":"18.19.1","_npmVersion":"9.2.0","dist":{"integrity":"sha512-vDVxaD4IYto4dGhtRU2r1ejxP+J9IiZVxvbFiZuRtEr4XTghwbZSBa5+aaO7s5hjFZDOdKOzp+oo+kGMFLr8QQ==","shasum":"b7acdd5f4f04999f4ac267da6367bee3ee835c71","tarball":"https://registry.npmjs.org/@booyaka101/fudog-js/-/fudog-js-1.0.0.tgz","fileCount":5,"unpackedSize":28821,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCIHRTmA4wbWCIVQfIond02jic+O992PVFT6vFwoA6zMsIAiEA0vWNHjaI5jmOokI4oaMtWsiCSB3NxyAyGx6pD0+CrtQ="}]},"_npmUser":{"name":"booyaka","email":"cbosch101@gmail.com"},"directories":{},"maintainers":[{"name":"booyaka","email":"cbosch101@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/fudog-js_1.0.0_1764821113224_0.22997679746158894"},"_hasShrinkwrap":false}},"time":{"created":"2025-12-04T04:05:13.115Z","1.0.0":"2025-12-04T04:05:13.387Z","modified":"2025-12-04T04:05:13.640Z"},"maintainers":[{"name":"booyaka","email":"cbosch101@gmail.com"}],"description":"React NDI preview component for MJPEG streams on Linux.","homepage":"https://github.com/booyaka101/fudog-js#readme","keywords":["react","ndi","preview","mjpeg","video","mui","component"],"repository":{"type":"git","url":"git+https://github.com/booyaka101/fudog-js.git"},"author":{"name":"booyaka101"},"bugs":{"url":"https://github.com/booyaka101/fudog-js/issues"},"license":"ISC","readme":"# @booyaka101/fudog-js\n\nReact components for previewing NDI sources via MJPEG streams on Linux.\n\n## Installation\n\n```bash\nnpm install @booyaka101/fudog-js\n# or\nyarn add @booyaka101/fudog-js\n```\n\n## Usage\n\n```jsx\nimport NDIPreview, { MJPEG } from '@booyaka101/fudog-js'\n\nfunction Example() {\n  return (\n    <NDIPreview\n      sourceName=\"NDI Source Name\"\n      sessionId=\"unique-session-id\"\n      baseUrl=\"http://localhost:3000\" // your backend providing /preview\n      maxHeight={300}\n      showLabel\n    />\n  )\n}\n```\n\n`NDIPreview` internally uses the `MJPEG` component to render a live MJPEG stream from:\n\n```text\n${baseUrl}/preview?stream=${encodeURIComponent(sourceName)}&session=${encodeURIComponent(sessionId)}\n```\n\n## Peer dependencies\n\nThis package expects the following to be present in your app:\n\n- react\n- react-dom\n- @mui/material\n- @emotion/react\n- @emotion/styled\n\n## Development\n\n- Build: `npm run build`\n- Watch build: `npm run dev`\n- The package is built with `tsup` and outputs both CJS (`dist/index.cjs`) and ESM (`dist/index.js`).\n\n## API\n\n### NDIPreview\n\n- `sourceName` – NDI source name to preview (required for preview)\n- `sessionId` – unique session identifier\n- `baseUrl` – base URL of your backend (e.g. `http://localhost:3000`)\n- `maxHeight` – maximum height in pixels (default: 300)\n- `showLabel` – whether to show the source name label (default: true)\n- `containerSx` – MUI `sx` for the outer `Paper`\n- `paperProps` – props forwarded to the outer `Paper`\n- `previewBoxProps` – props forwarded to the inner preview `Box`\n- `mjpegProps` – additional props forwarded to the underlying `MJPEG` component\n\n### MJPEG\n\n- `url` – MJPEG stream URL\n- `containerSx` – MUI `sx` for the outer container\n- `frameSx` – MUI `sx` for the frame wrapper\n- `onResolution(width, height)` – called when the stream resolution is known\n- `maxRetries` – maximum number of retry attempts (default: 3)\n- `retryDelay` – delay between retries in ms (default: 1000)\n- `connectTimeout` – timeout before considering the initial connection as failed (default: 1500ms)\n- `onLoad()` – called when the stream has loaded\n- `onError(error)` – called when an error occurs\n- `onLoadingChange(loading)` – called whenever loading state changes\n- `debug` – enables verbose console logging when true\n\n## Publishing\n\n1. Log in to npm: `npm login`\n2. Build: `npm run build`\n3. (Optional) Test the tarball: `npm pack`\n4. Publish as public scoped package:\n\n   ```bash\n   npm publish --access public\n   ```\n","readmeFilename":"README.md","_rev":"1-8f83fd96af6287652c9f3b08e302a789"}