Files
temetro/.agents/skills/bklit-ui/rules/composition.md
T
Khalid Abdi 929bec8f31 feat: AI-added records save with placeholders + "Added by AI" provenance
Stop blocking AI imports/proposals on missing non-critical fields. Records
the chat agent drafts now save with safe placeholders, auto-generated file
numbers, and a source="ai" marker that surfaces an "Added by AI" badge so a
clinician can review/edit them later.

Backend:
- add `source` (manual|ai) column to patients/appointments/prescriptions
  (migration 0014) + canonical types, services, validation schemas
- relax patient/appointment validation: empty file number allowed, demographic
  + type/provider/initials fall back to placeholders (initials derived from name)
- patients.generateFileNumber() auto-assigns an MRN when one is missing
- proposeAppointment accepts a name when no file number resolves; AI commits +
  /api/ai/import stamp source="ai"

Frontend:
- `source` on Appointment/Patient/Prescription types; AI commits send source="ai"
- reusable <AiBadge> shown on the Patients table/detail and prescriptions list

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-14 19:27:17 +03:00

1.7 KiB
Raw Blame History

Chart Composition

Root + children

Charts use a composable API. Always wrap series, axes, and overlays inside the root chart component.

Incorrect

<div className="h-80">
  <Line dataKey="users" />
  <XAxis />
</div>

Correct

<LineChart data={data}>
  <Grid horizontal />
  <Line dataKey="users" />
  <XAxis />
  <ChartTooltip />
</LineChart>

Axes and grid

  • Put Grid before series so lines render on top.
  • Use XAxis / YAxis as siblings inside the root chart — not outside the chart context.
  • For live streaming charts, use LiveXAxis and LiveYAxis inside LiveLineChart.

Tooltips and markers

  • ChartTooltip must be a child of the root chart so it can read hover state.
  • Custom tooltip content receives chart context — prefer useChart() when building custom indicators.
  • ChartMarkers and marker content render inside ChartTooltip when showing event callouts.

Multi-series charts

  • One Line / Bar / Area child per dataKey.
  • Use --chart-1--chart-5 or explicit stroke/fill props for series differentiation.
  • For combined line + bar, use ComposedChart instead of nesting unrelated roots.

Data shape

  • Cartesian charts: array of objects; set xDataKey on the root (default "date").
  • OHLC: use CandlestickChart with { date, open, high, low, close }.
  • Live line: { time, value } points with a separate value prop on the root.
  • Sankey / funnel / pie: follow each charts doc for node/link or slice shape.

Docs