# Dashboard 02 - Analytics (`dashboard-02`) - SignalOS page block

> Content-only analytics layout: KPI strip, then a data table beside a radial-gauge health panel. Mounts inside any shell; gauges stack below xl.

- **Version:** 0.1.2
- **Kind:** block (group: dashboard) · **Category:** pages
- **Install:** `npx shadcn@latest add @signalos/dashboard-02`
- **Registry dependencies (pulled automatically):** @signalos/tokens, @signalos/utils, @signalos/skeleton, @signalos/circular-progress, @signalos/data-table, @signalos/metric-tile
- **npm dependencies:** @tanstack/react-table@^8.21.3
- **Files installed:** `src/components/blocks/dashboard-02/Dashboard02.tsx`, `src/components/blocks/dashboard-02/Dashboard02.types.ts`

## Access

This is a private registry: pulling source requires a `SIGNALOS_REGISTRY_TOKEN`
(GitHub fine-grained PAT with read access to the signal-widgets repo) and an
`@signalos` entry in components.json `"registries"`. Previews and this document are public.

## Usage

```tsx
// after: npx shadcn@latest add @signalos/dashboard-02
// mount the pulled page in a route, e.g. src/app/dashboard/page.tsx
import { Dashboard02 } from "@/components/blocks/dashboard-02/Dashboard02"

export default function Page() {
  return <Dashboard02 />
}
```

## Props

### `Dashboard02Gauge`

| Prop | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `label` | `string` | yes | - | Label under the gauge, e.g. "SLA compliance". |
| `value` | `number` | yes | - | 0–100. |
| `colorClass` | `string \| undefined` | no | `"text-primary"` | Tailwind text-* class for the arc. |
| `caption` | `string \| undefined` | no | - | Small caption under the label, e.g. "target 95%". |

### `Dashboard02Props`

| Prop | Type | Required | Default | Description |
| --- | --- | --- | --- | --- |
| `pageTitle` | `string \| undefined` | no | `"Analytics"` |  |
| `pageSubtitle` | `string \| undefined` | no | - |  |
| `actions` | `ReactNode` | no | - | Right-aligned header slot (timeframe picker, export button). |
| `metrics` | `MetricTileProps[]` | yes | - | KPI strip (max 3 recommended - sits above the two-column area). |
| `gauges` | `Dashboard02Gauge[]` | yes | - | Radial gauges rendered in the side panel. |
| `gaugesTitle` | `string \| undefined` | no | `"Health"` |  |
| `tableTitle` | `string \| undefined` | no | - | Table card. |
| `columns` | `ColumnDef<TData, TValue>[]` | yes | - |  |
| `rows` | `TData[]` | yes | - |  |
| `pagination` | `PaginationConfig \| undefined` | no | - |  |
| `onRowClick` | `((row: TData) => void) \| undefined` | no | - |  |
| `emptyMessage` | `string \| undefined` | no | `"No data for this period."` |  |
| `isLoading` | `boolean \| undefined` | no | - |  |
| `error` | `DataTableErrorConfig \| null \| undefined` | no | - |  |
| `className` | `string \| undefined` | no | - |  |

## Changelog

# dashboard-02

## 0.1.2

- Content sync fix to bring source in line with published registry payload.


## 0.1.1

- Standardize inline comment formatting (em dash → hyphen); no runtime or API change.

## 0.1.0

- Initial release: analytics page variant - KPI strip + table + radial-gauge
  health panel, content-only (bring your own shell), generic over the row type.