{"_id":"@bloodgpt/widgets","name":"@bloodgpt/widgets","dist-tags":{"alpha":"0.1.0-alpha.0","latest":"0.1.0-alpha.0"},"versions":{"0.1.0-alpha.0":{"name":"@bloodgpt/widgets","version":"0.1.0-alpha.0","description":"BloodGPT React widgets — embed report list, test overview, parameters, and follow-ups in your own app","license":"Apache-2.0","type":"module","main":"./dist/index.cjs","module":"./dist/index.js","types":"./dist/index.d.ts","exports":{".":{"types":"./dist/index.d.ts","import":"./dist/index.js","require":"./dist/index.cjs"},"./styles.css":"./dist/styles.css"},"publishConfig":{"access":"public"},"sideEffects":["**/*.css"],"dependencies":{"clsx":"^2.1.1","lucide-react":"^0.475.0","tailwind-merge":"^3.3.1"},"peerDependencies":{"@tanstack/react-query":">=5.0.0","next-intl":">=4.0.0","react":">=18.0.0","react-dom":">=18.0.0"},"devDependencies":{"@tailwindcss/cli":"^4.1.11","@tanstack/react-query":"^5.0.0","@testing-library/jest-dom":"^6.6.3","@testing-library/react":"^16.1.0","@types/react":"^19.1.9","@types/react-dom":"^19.1.7","jsdom":"^26.0.0","next-intl":"^4.8.3","react":"19.1.7","react-dom":"19.1.7","tailwindcss":"^4.1.11","tsup":"^8.0.0","typescript":"^5","vitest":"^3.0.0","@repo/analysis-ui":"1.0.0","@repo/typescript-config":"0.0.0"},"scripts":{"build":"pnpm run build:js && pnpm run build:css","build:js":"tsup","build:css":"tailwindcss -i src/styles.css -o dist/styles.css --minify","dev":"tsup --watch","check-types":"tsc --noEmit","test":"vitest run","test:watch":"vitest","clean":"rm -rf dist"},"_id":"@bloodgpt/widgets@0.1.0-alpha.0","_integrity":"sha512-5Mhe5rwBvpINGcZWx+Rxbk0U55vbGe2uNuuN3JL0fDFlFJ8OIBVhltAra96dgoqqItguqcqAf6fPz6RBcjdIwg==","_resolved":"/private/var/folders/ts/169bs3fx5jg0_qgh2_4k9czm0000gp/T/d26c38e23905334ca8c73ffcd6a9717e/bloodgpt-widgets-0.1.0-alpha.0.tgz","_from":"file:bloodgpt-widgets-0.1.0-alpha.0.tgz","_nodeVersion":"22.22.0","_npmVersion":"10.9.4","dist":{"integrity":"sha512-5Mhe5rwBvpINGcZWx+Rxbk0U55vbGe2uNuuN3JL0fDFlFJ8OIBVhltAra96dgoqqItguqcqAf6fPz6RBcjdIwg==","shasum":"deb72ff5b8e201bf88bb12de3be17cfcf336d5da","tarball":"https://registry.npmjs.org/@bloodgpt/widgets/-/widgets-0.1.0-alpha.0.tgz","fileCount":11,"unpackedSize":22257956,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEYCIQCQ9K4UbW9KmtxfHB4uDTEoABYvIMVqxCcJ7nL6jVyPZAIhAIlGPhg12pfjj9OhzIeYAVgDSxooMStg8LAPk/y3sxAT"}]},"_npmUser":{"name":"ae.rai","email":"ae@realai.plus"},"directories":{},"maintainers":[{"name":"ae.rai","email":"ae@realai.plus"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/widgets_0.1.0-alpha.0_1780568524779_0.9253909176348998"},"_hasShrinkwrap":false}},"time":{"created":"2026-06-04T10:22:04.589Z","0.1.0-alpha.0":"2026-06-04T10:22:05.033Z","modified":"2026-06-04T10:22:05.312Z"},"maintainers":[{"name":"ae.rai","email":"ae@realai.plus"}],"description":"BloodGPT React widgets — embed report list, test overview, parameters, and follow-ups in your own app","license":"Apache-2.0","readme":"# @bloodgpt/widgets\n\nDrop-in React widgets that render BloodGPT reports inside your own application.\n\n> **Status — v0.1.0-alpha.** Code-complete on `feature/widgets-package`:\n> the backend endpoints (`/api/v1/widget-sessions`, `/api/v1/widgets/...`)\n> and every widget below are implemented. Not yet published to npm and the\n> branch isn't merged, so `WIDGET_SESSION_SECRET` must be set in the target\n> environment before the API serves tokens.\n\n## Install\n\n```bash\nnpm install @bloodgpt/widgets @tanstack/react-query next-intl\n```\n\nPeer dependencies:\n\n- `react` ≥ 18\n- `react-dom` ≥ 18\n- `@tanstack/react-query` ≥ 5\n- `next-intl` ≥ 4\n\nImport the stylesheet **once** in your app entry (e.g. `app/layout.tsx`):\n\n```ts\nimport \"@bloodgpt/widgets/styles.css\";\n```\n\n## Authentication\n\nThe widgets never see your API key. Your backend mints short-lived session\ntokens scoped to a single patient:\n\n```ts\n// in your server (Next.js route handler, Express, etc.)\nconst res = await fetch(\"https://sandbox.bloodgpt.com/api/v1/widget-sessions\", {\n  method: \"POST\",\n  headers: {\n    Authorization: `Bearer ${process.env.BLOODGPT_API_KEY}`,\n    \"Content-Type\": \"application/json\",\n  },\n  body: JSON.stringify({\n    external_patient_id: \"your-patient-id\",\n    ttl_seconds: 900, // optional, default 900 (15 min)\n  }),\n});\nconst { session_token } = await res.json();\n```\n\nHand `session_token` to the browser and pass it to the provider:\n\n```tsx\nimport { BloodGPTProvider, TestOverview } from \"@bloodgpt/widgets\";\n\nexport function PatientPage({ token, testId }: Props) {\n  return (\n    <BloodGPTProvider sessionToken={token}>\n      <TestOverview testId={testId} />\n    </BloodGPTProvider>\n  );\n}\n```\n\n## Widgets\n\n- `<ReportsList externalPatientId>` — the patient's reports, newest first\n- `<TestOverview testId>` — patient demographics + scan metrics + narrative summary\n- `<TestParameters testId>` — biomarker panels with filtering, sparklines, and per-parameter trend charts\n- `<TestFollowUps testId>` — follow-up schedule + priority retests\n- `<TestReport testId>` — composite of overview + parameters + follow-ups (the most common embed)\n\nEach widget also exports a hook (`useReports`, `useTestOverview`,\n`useTestParameters`, `useTestFollowUps`, `useTestTrends`) for customers who\nwant raw data plus their own rendering.\n\n### Trends\n\n`<TestParameters>` renders value-over-time charts inline once a parameter\nhas more than one measurement. For a standalone chart, pull the series with\n`useTestTrends(testId, parameterName)` and render it with your own chart or\nwith `TrendsChart` from `@repo/analysis-ui`:\n\n```tsx\nconst { data } = useTestTrends(testId, \"Hemoglobin\");\n// data?.trend is { parameterName, trend: { <ISO date>: number | null }, unit, ... }\n```\n\n## Locales\n\nEnglish ships bundled. Pass additional messages via the `messages` prop\non `BloodGPTProvider`:\n\n```tsx\nimport esMessages from \"./bloodgpt-es.json\";\n\n<BloodGPTProvider\n  sessionToken={token}\n  locale=\"es\"\n  messages={esMessages}\n>\n  ...\n</BloodGPTProvider>;\n```\n\n## Internal notes\n\nThis package is built from the `packages/analysis-ui` view components and\nthe public REST surface of `apps/b2b-api`. The adapter pattern is:\n\n```\n<Widget> = useQuery via the bundled HttpClient → render <View> from @repo/analysis-ui\n```\n\nThe package ships its own ~50-line `HttpClient` rather than depending on a\nseparate SDK — a standalone `@bloodgpt/sdk` is only worth extracting once a\nnon-React client needs a typed API client without the widgets.\n\n`@repo/analysis-ui` is bundled into the published artifact (via tsup\n`noExternal`) so customers don't need access to monorepo sources. Its\nchart renderer pulls in `chart.js`, which is bundled alongside it.\n","readmeFilename":"README.md","_rev":"1-2fbc6a6a598b10c1a9029a4cc6799dbd"}