Skip to main content

Frontend Packages

The frontend lives in web/ — a pnpm monorepo with 20 kits and 97+ miniapps assembled into a React 19 + Vite 5 SPA. It uses MUI v7, Tailwind v4, styled-components, and talks to the backend via the API gateway plus Supabase realtime for read-model subscriptions.

20
Kits
97+
Miniapps
React 19
Framework
Vite 5.4
Bundler
pnpm 10
Pkg mgr
17
Locales

The kit ecosystem​

Kits are domain-scoped React libraries. Miniapps are user-facing feature pages — they compose components from multiple kits.

Foundation

ui-kit · design-kit · core-kit

UI primitives, bento visuals, dashboards + login.

ui-kitdesign-kitcore-kit
Clinical

medical-kit · adt-kit · periops-kit

Worklists, encounters, admission/discharge, perioperative flows.

medical-kitadt-kitperiops-kit
Diagnostics

diagnostics-kit · inventory-kit

Lab, imaging, pathology, blood bank, supplies.

diagnostics-kitinventory-kit
RCM

rcm-kit · ltc-rcm-kit

Billing, cashier, claims, long-term-care RCM.

rcm-kitltc-rcm-kit
Ops

scheduling-kit · patient-roster · healthops-kit

Schedules, role-based worklists, ops dashboards.

scheduling-kitpatient-rosterhealthops-kit
Integrations

integration-kit · nursing-home-kit · admin-kit

E-forms, QR, nursing-home lifecycle, system admin.

integration-kitnursing-home-kitadmin-kit
Runtime

dynamic-modules

Runtime-configurable tables, graphs, modals, workflow editor.

dynamic-modules
Services

service-kit · shared-action · migration-kit

Redux slices, shared actions, migration utilities.

service-kitshared-actionmigration-kit

Tech stack composition​

Stack

Layers

Roughly equal weight between UI primitives, clinical domain, and RCM.

UI / Design / Core 4
Clinical / ADT / Periops 5
RCM / Billing 2
Ops / Scheduling / Roster 4
Integration / Admin 3
Services / Misc 2
Velocity

Kit + miniapp releases

Rolling 12-week release cadence.

Conventions​

  • Never write directly to Supabase read-model tables — call the gateway.
  • Styled via MUI v7, Tailwind v4, and styled-components layered together.
  • Each kit is a pnpm workspace (web/packages/<kit>), imported by path alias inside miniapps and the main shell.
  • 17 supported locales, including ja, fil, th, en.
  • Read web/CLAUDE.md and web/AGENTS.md before any non-trivial frontend change.