Number value — dir/ui

Format numbers, money, and percentage points without an editing control.

# Number value

Format numbers, money, and percentage points without an editing control.

## Install

```sh
npx shadcn@4.21.0 add lr-run/dir-ui/number-value#v0.1.2
```

[Registry item with source and dependencies](https://github.com/lr-run/dir-ui/blob/v0.1.2/registry.json)

Requires React 19, Tailwind CSS 4 and shadcn initialized with Base UI. Registry target placeholders resolve through components.json: @ui, @components, @hooks and @lib. Imports below use the conventional @/ prefix for illustration; the CLI rewrites them to your configured aliases. Shared components are installed once through registryDependencies. Theme CSS is imported by the UI modules. Existing files are never forcibly overwritten; review CLI conflicts before accepting changes. No Dir runtime is required.

## NumberValue, formatNumber

```tsx
import { NumberValue, formatNumber } from '@/components/ui/value.tsx'
```

| Prop | Type | Default / required | Notes |
| --- | --- | --- | --- |
| value | number \| null \| undefined | Required |  |
| format | "number" \| "currency" \| "percent" | number |  |
| currency | string | USD |  |
| locale | string | en-US |  |
| maximumFractionDigits | number | 2 |  |

Percent values use percentage points: 60 renders as 60%. Null, undefined, and non-finite values render an em dash.