component

TuxTable

Wraps UTable. Adds the maroon-wash header, uppercase tracked labels, brand-tinted row hover, and a rounded card frame. Body cells default to font-mono because most of what lands in our tables is IDs, paths, and short strings — override per-column with a #{column}-cell slot.

auto status cell

With `status-accessor`

Point status-accessor at a column key and TuxTable auto-renders that cell as a TuxBadge :status.

TitleOwnerStatusUpdated
Rural intersection safety — Phase IIM. Ortizcompleted2026-04-22 09:14
Corridor speed study — I-35 north of AustinA. Nguyenrunning2026-04-24 11:02
Connected-vehicle pilot — preliminary findingsJ. Reesefailed2026-04-24 10:47
Bridge deck condition inventoryK. Patelqueued—
<tux-table
  :data="projects"
  :columns="columns"
  status-accessor="status"
/>

custom cell slots

Override a column

Any column slot from UTable is forwarded. Use #{accessorKey}-cell to replace a column's renderer — e.g. turn titles into links.

TitleOwnerStatusUpdated
Rural intersection safety — Phase IIM. Ortizcompleted2026-04-22 09:14
Corridor speed study — I-35 north of AustinA. Nguyenrunning2026-04-24 11:02
Connected-vehicle pilot — preliminary findingsJ. Reesefailed2026-04-24 10:47
Bridge deck condition inventoryK. Patelqueued—
<tux-table :data="projects" :columns="columns" status-accessor="status">
  <!-- custom cell override -->
  <template #title-cell="{ row }">
    <NuxtLink :to="`/projects/${row.id}`" class="font-mono">
      {{ '{{ row.title }}' }}
    </NuxtLink>
  </template>
</tux-table>