DataIndexSection
components/data/index-section/index.vue
One nav section on an index page (design c109): title (28 bold, a heading — not a link), an optional lede, a dot-separated row of listing links, a hairline and a summary of DataMachineMicros — as white cards by default (`cards`). The sibling of DataSurfaceSection and, like it, only the shell. By default it owns the summary grid — a DataMachineGroup of auto-fill columns at least minColumn wide — so bare micros align and every section on the page shares one column rhythm.
Inventory
What the fleet runs: providers, harnesses, models and the tools they reach.
Providers
5
Provider tokens
48.2
m
+12%
Provider spend
$
4.2k
Harness installs
37
Harness work
46.1
m
Models
12
Model tokens
47.8
m
Model spend
$
4.2k
MCP servers
9
MCP tool calls
1.3
k
MCP tools used
38
Skill installs
64
Skill invocations
412
Skills by team
17
Tools
52
Tool invocations
10
k
Tool success
94
%
Workspaces
63
Workspace tokens
41
m
Workspace spend
$
3.9k
Organization
Who uses it: teams, the people on them, and the endpoints they work from.
Activity
Scenarios
loading — nothing fetched yet: "—" everywhere, never 0
failed — one page banner + "—" in the micros (c108 D2)
Couldn't reach qdash — showing nothing rather than a guess.
Organization
empty — loaded, and the fleet has nothing yet: honest zeros
Inventory
Providers
0
Tokens
0
Spend
$
0
minimal — title + one micro, no links row
Cost
Spend
$
4.2k
overflow — long title, wrapping links, 360 px column
Organization, teams, people and every endpoint they sign in from
12 machines
A lede long enough to wrap onto a second line in a narrow column, to check it sits under the heading.
:grid="false" — the consumer's own layout (micros clustered by listing)
Inventory
Providers
Harnesses
MCP Servers
Repos & Workspaces
#links — the row replaced (doors with counts)
components/data/index-section/index.vue
Usage
<DataIndexSection
title = "—"
id = "from title"
lede = "undefined"
:links = "[]"
:grid = "true"
:minColumn = "190"
:cards = "true"
>
Content here
</DataIndexSection>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| title | String | — | The nav section's name (required) — a heading, not a link (c109 Q3) |
| id | String | from title | Anchor id; default derived from the title ("Inventory" → "inventory"). Jumps land under the sticky band (scroll-margin = --q-sticky-top-down + 16 px, as NavJumpPills) |
| lede | String | undefined | One line under the title (or #lede) |
| links | { to, label }[] | [] | The listing doors in nav order — 13 px medium primary, dot-separated, wrapping |
| grid | Boolean | true | The built-in micro grid (a DataMachineGroup, rowGap 20, column gap 32). false renders the default slot as-is |
| minColumn | Number | 190 | px — the narrowest a grid column (one micro) may be; auto-fill keeps empty tracks, so a short section doesn't stretch its micros |
| cards | Boolean | true | The micros inside render as cards (by injection) and the grid sits at 16 / 16 px gaps; false = flat micros at 48 / 48 |
Slots
| Slot | Description |
|---|---|
| default | The summary — bare DataMachineMicros (or DataMachines) when grid is on; anything when grid is off |
| links | Replaces the links row (doors with counts, an external link) |
| title-right | On the title's baseline at the right — a count or a caption |
| lede | Custom lede content |