# Shadcn Server Config

> Vertical table with server configuration details

- Type: example, free and open source (MIT)
- Component: [Table](https://reui.io/components/table.md)
- Page: https://reui.io/components/table/c-table-17
- Docs (Base UI): https://ui.shadcn.com/docs/components/base/table.md
- Docs (Radix UI): https://ui.shadcn.com/docs/components/radix/table.md
- MCP: `get_example("c-table-17")`
- Registry item: https://reui.io/r/styles/base-nova/c-table-17.json
- Uses: Badge, Frame, Table

## Best for

A titled server panel with a pulsing status dot, CPU and memory usage bars and secondary tag badges

## Agent notes

- The CPU and memory bars are plain divs whose inline `width` is hardcoded at 42% and 67%; drive it from your metrics
- The pulsing status dot uses fixed green classes with `animate-ping` and no reduced motion guard
- Each label sits in a `TableCell`, so screen readers get no row header; a `TableHead` with scope row fixes that

## When not to use

- A person's record with a photo, job title and contact email: use [Employee Profile](https://reui.io/components/table/c-table-16.md) (`get_example("c-table-16")`)

## Install

```bash
npx shadcn@latest add @reui/c-table-17
```

## About Shadcn Table

### When to use

- Short lists of records such as invoices, orders, members, files or API keys, one per row
- Rows that carry status badges, avatars, a totals footer or a menu of row actions
- Label and value pairs describing one record, such as an employee profile or a server

### When not to use

- Rows the reader sorts, filters, pages or selects with checkboxes: use [Data Grid](https://reui.io/components/data-grid.md) (`get_component("data-grid")`)
- A ready made records section with a title bar, toolbar filters and a pager: use the [Base blocks](https://reui.io/blocks/data-grid/base.md)
- An account page where a person edits their avatar, name, email and regional settings: use the [Profile blocks](https://reui.io/blocks/application/profile.md)

### Agent notes

- `Table` wraps the table in its own overflow-x-auto div, and `className` lands on the inner table, never on that scroll wrapper
- `TableCell` and `TableHead` are nowrap in every style, so a long value widens the table and scrolls it sideways instead of wrapping

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.
