A list of items, each with a title, an optional detail line and a status or category, above a row of chips (All plus one per status, with counts) that actually filter it. Tapping a chip shows only the matching rows and updates the "Showing X of Y" count. Self-contained, so it works without any other atom; on a static surface it degrades to the full list.
| Field | Type | Required |
|---|---|---|
| title | string (optional, heading above the list) | optional |
| items | array (required). Array of {title (or name), detail? (or subtitle), status? (or whichever field filter_field names), meta? (right-aligned small text), icon? (an emoji)}. Items with no value for the filter field show only under All. | required |
| filter_field | string (optional, default "status"). Which item field the chips filter on, e.g. "category" or "assignee". | optional |
| filters | array. Chips to show, as plain strings or {value, label?, color? (hex)}. Default: one chip per distinct value, in first-seen order. | optional |
| colors | object. Map from a status or category value to a hex colour for its chip and row badge. Default: a distinct colour per chip. | optional |
| show_counts | bool (optional, default true). Show how many rows each chip matches. | optional |
| empty_text | string (optional, shown when a filter matches nothing) | optional |
{
"type": "filterable_list",
"items": [
{
"label": "Item 1"
},
{
"label": "Item 2"
}
]
}{
"identifier": "urn:air:a2uicatalog.ai:atom:filterable_list",
"displayName": "Filterable List",
"type": "application/vnd.a2ui.atom+json",
"url": "https://a2uicatalog.ai/atoms/filterable_list",
"capabilities": [
"web",
"mcp-apps",
"android"
],
"description": "A list of items, each with a title, an optional detail line and a status or category, above a row of chips (All plus one per status, with counts) that actually filter it. Tapping a chip shows only the matching rows and updates the \"Showing X of Y\" count. Self-contained, so it works without any other atom; on a static surface it degrades to the full list.",
"representativeQueries": [
"show a list with status chips that filter its rows \u2014 items with title, detail, status; All plus one chip per status, with counts",
"a list of items, each with a title, an optional detail line and a status or category, above a row of",
"render a filterable list"
]
}The renderer is an open-source Google Apps Script web app. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.
git clone https://github.com/a2uicatalog/a2ui
cd a2ui/apps-script-surface/gas-wired-renderer
clasp push && clasp deploy