# DiffStat

Lines added and removed for a change, with optional file count and blocks.

- **Use it for**: Lines added and removed beside a task, commit or pull request.
- **Not for**: The changes themselves. Try [CodeDiff](https://unseenui.com/components/code-diff/).

## Installation

```bash
npm install @stackunseen/ui
```

## Usage

```tsx
import { DiffStat } from '@stackunseen/ui';
import { CodeDiff } from '@stackunseen/ui';
import '@stackunseen/ui/styles.css';

<DiffStat added={15} removed={1} files={2} />
```

## All props

| Prop | Type | Description |
| --- | --- | --- |
| `added` (required) | `number` | Lines added, as the host counted them. |
| `blocks` | `boolean` | Five squares in proportion, as code hosts show beside a change. |
| `files` | `number` | Files changed, when known. |
| `removed` (required) | `number` | Lines removed. |

## Keyboard

Inert content; it adds no tab stop.

## Works with

[Card](https://unseenui.com/components/card/), [Table](https://unseenui.com/components/table/), [Tag](https://unseenui.com/components/tag/), [ElapsedTime](https://unseenui.com/components/elapsed-time/), [Numeric](https://unseenui.com/components/numeric/), [Kbd](https://unseenui.com/components/kbd/), [DotRing](https://unseenui.com/components/dot-ring/), [DotBars](https://unseenui.com/components/dot-bars/), [WeekStrip](https://unseenui.com/components/week-strip/), [HeatKeys](https://unseenui.com/components/heat-keys/), [Sparkline](https://unseenui.com/components/sparkline/), [BarList](https://unseenui.com/components/bar-list/)

Page: https://unseenui.com/components/diff-stat/
