# Vitals
> Body readings from a scale or wearable with BMI and its category, plus progress towards the targets the person set.
Source: https://docs.nasaqui.com/components/vitals
## Install
```bash
npx shadcn@latest add https://docs.nasaqui.com/r/vitals.json
```
Weight, BMI with its category, body water, visceral fat, muscle mass, metabolic age and resting heart rate as tiles,
then a card of progress towards targets. The BMI category is a name with an icon and a tone, and it comes with a note
that BMI is a rough screening figure. A missing reading says "Not measured".
## When to use
- A body composition screen fed by a smart scale or a wearable.
## When not to use
- Daily behaviour counts: use [`DailySummary`](https://docs.nasaqui.com/components/daily-summary).
## Import
```tsx
import { Vitals } from "@fadymondy/nasaq/web";
// inside this monorepo: "@nasaq/web"
```
## Quick start
```tsx
import { Vitals } from "@fadymondy/nasaq/web";
;
```
## Anatomy
```
Vitals data-slot="vitals"
├─ header title, measured date
├─ StatGrid one StatCard per reading (weight and heart rate carry a Sparkline)
├─ BMI note
└─ Card "Targets" one Meter per target, data-slot="vitals-target"
```
## API
| Prop | Type | Notes |
| --- | --- | --- |
| `vitals` | `VitalsData` | Every reading is optional. `bmi` wins over the one computed from weight and height. |
| `loading` | `boolean` | Skeleton. |
| `hideHeading` | `boolean` | For pages with their own heading. |
| `labels` | `Partial` | Override any string. |
Units: kilograms, percent, years through Intl; bpm, kg/m² and the visceral level are labelled from the vocabulary.
The pure helpers `computeBmi`, `bmiCategory`, `bmiTone`, `clampPercent` and `distanceToTarget` are exported too.
## Code
### React
```tsx
import { Vitals } from "@fadymondy/nasaq/web";
;
```
### shadcn
```tsx
import { Vitals } from "@/components/ui/vitals";
;
```
### Vue
```vue
```
### Blade
```blade
```
### HTML + Alpine
```html
Vitals
Weight
84.2 kg
Body mass index
26.6 kg/m²
Overweight
Body water
54.1%
Visceral fat
11
Muscle mass
Not measured
Metabolic age
Not measured
Resting heart rate
Not measured
Body mass index is a rough screening figure, not a diagnosis.