filterRow

Composite filter row — search input + toggle checkboxes + sort dropdown + counter + action buttons. Captures the pattern every list view re-implements (entities, logs, assets, scripts, animation_browser). Caller owns all bound values; the widget is stateless. Each piece is optional; an empty opts produces an empty hbox.

Exports

• filterRow(opts: FilterRowOpts?) -> WidgetNode — assemble the row from the optional pieces in opts. Callback ids fire as <id>-search, <id>-toggle-<key>, <id>-sort, plus each action's onClick verbatim.

Types:

• FilterRowOpts = { id: string?, search: SearchOpts?, toggles: { ToggleOpts }?, sort: SortOpts?, counter: CounterOpts?, actions: { ActionOpts }?, searchClass: string?, toggleClass: string?, sortClass: string?, class: string?, gap: number?, marginBottom: number?, padding: any?, align: string? }
• SearchOpts = { value: any?, placeholder: string?, class: string?, minWidth: number? }
• ToggleOpts = { key: any, label: string?, value: boolean?, class: string? }
• SortOpts = { options: { string }?, selected: number?, class: string?, minWidth: number? }
• CounterOpts = { visible: number?, total: number?, class: string?, fontSize: number? }
• ActionOpts = { label: string?, onClick: string?, variant: string?, padding: { number }?, minWidth: number?, tooltip: string?, class: string? }
• WidgetNode = { [string]: any }

Usage

local Z = require("@builtin::modules.zui")

return Z.filterRow({
    id      = "logs-filter",
    search  = { value = state.q, placeholder = "Search...", minWidth = 160 },
    toggles = {
        { key = "info", label = "Info", value = state.showInfo },
        { key = "warn", label = "Warn", value = state.showWarn },
    },
    sort    = { options = LOG_TYPES, selected = state.typeIdx },
    counter = { visible = #filtered, total = #all },
    actions = { { label = "Clear", onClick = "logs-clear", variant = "danger" } },
})

Notes

• Stateless. Caller owns every bound value; the widget only routes events through the <id>-* callback ids.
• When counter or actions are present, a flex spacer is inserted first so they right-align to the trailing edge of the row.
• Action variant of "primary" / "danger" selects a coloured background from the active theme; anything else falls back to theme.panel_alt.