Skip to content

web-ui: records tables and filter lists - #1058

Open
time-attack wants to merge 1 commit into
bui/05-tool-chips-codefrom
bui/06-tables-filters
Open

web-ui: records tables and filter lists#1058
time-attack wants to merge 1 commit into
bui/05-tool-chips-codefrom
bui/06-tables-filters

Conversation

@time-attack

@time-attack time-attack commented Sep 10, 2026

Copy link
Copy Markdown
Collaborator

Summary

Markdown tables render as the records grid: a rounded hairline container with
horizontal scroll, a sticky inset header, row numbers, hairline dividers, hover
wash and honoured column alignment; the shared sanitizer also forbids the
background and bgcolor cell attributes. Every list page becomes the filter
table: resource tabs are status chips with coloured dots, rows sit in a hairline
table with mono dates, and status pills are tinted by state. Crons and deploys
share the same chip row instead of their own.

Demo

Hovering the records grid rows, then the Files and Skills list pages with their filter controls and hairline rows.

07-tables-filters.gif

Verification

Typecheck, the full plugins/web-ui suite, eslint and prettier pass at this level of the stack (each level is verified on its own, on top of the previous one). Live QA of the finished stack ran in a browser-only dev-instance against a seeded conversation (tool run, markdown table, TypeScript and diff fences, a pending approval, ⌘K, list pages, settings), in light and dark and at phone width.

Stack

Merge in order; each PR is based on the one above it and retargets automatically when its base merges.

# PR Change
1 #1053 Beautiful UI foundation — tokens, fonts, styles scaffold
2 #1054 loading state and the live thinking trace
3 #1055 chat rows, session header and empty state
4 #1056 approval card with a pager
5 #1057 tool chips and code blocks
6 #1058 (this) records tables and filter lists
7 #1059 search palette
8 #1060 settings as inspector cards
9 #1061 selection actions toolbar
10 #1062 recommendation card

Markdown tables render as the records grid: a rounded hairline container with
horizontal scroll, a sticky inset header, row numbers, hairline dividers, hover
wash and honoured column alignment; the shared sanitizer also forbids the
background and bgcolor cell attributes. Every list page becomes the filter
table: resource tabs are status chips with coloured dots, rows sit in a hairline
table with mono dates, and status pills are tinted by state. Crons and deploys
share the same chip row instead of their own.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant