# Meter

A bounded measurement that distinguishes a reading from task completion.

- Family: Status, imported from `mizu-ui` or `mizu-ui/status`
- Docs: https://mizu.user64bit.world/components/meter
- Source: https://github.com/0xuser64bit/mizu/blob/main/packages/mizu/src/status/Feedback.tsx

## Usage

```tsx
"use client";

import { Meter } from "mizu-ui";

export function Example() {
  return (
    <Meter
      label="Storage used"
      value={68}
      low={30}
      high={85}
      optimum={20}
      format={(v) => `${v} GB of 100 GB`}
    />
  );
}
```

## Copy it with the shadcn CLI

```sh
npx shadcn@latest init 0xuser64bit/mizu/preset # once, where there is no components.json
npx shadcn@latest add 0xuser64bit/mizu/meter
```

## Props

- `value / min / max`: `number`. Current reading and limits.
- `low / high / optimum`: `number`. Native measurement thresholds.
- `format`: `(value: number) => string`. Visible value formatting.

## Accessibility

Uses native meter semantics rather than progress. Text repeats the meaningful unit and value.

## Motion

CSS transitions explain state changes. Reduced motion removes travel.