Bus UI Filter Toolbar

One compact form for filtering and reset actions.

Use the filter toolbar when a list or report needs a labeled filter strip with submit and reset controls, but the module still owns the actual filtering logic. The toolbar composes field nodes first and leaves filtering policy in the host.

Component boundary

Function	Props type	Import path
`FilterToolbar`	`FilterToolbarProps`	`github.com/busdk/bus-ui/pkg/ui`

When to use it

Use the filter toolbar when a data view needs a set of fields plus submit and reset controls that belong to the owning module. Fields is the preferred composition path. HTML body slots remain available for explicit render-boundary integrations.

See also Field, Submit control, Form, and Reference.

Example

Loading FilterToolbar demo...

Go API

import "github.com/busdk/bus-gx/pkg/gx"

toolbarNodes := []gx.Node{
  gx.Element("label", gx.Props{"for": "search"}, gx.Text("Search")),
  gx.Element("input", gx.Props{
    "id":   "search",
    "name": "search",
    "type": "search",
  }),
  gx.Element("button", gx.Props{"type": "submit"}, gx.Text("Filter")),
  gx.Element("button", gx.Props{"type": "reset"}, gx.Text("Reset")),
}

.gx source

In .gx source, author the visible component state as GX markup. Keep the Go API block above for the package helper or render-boundary call.

package busuiexamples

import gx "github.com/busdk/bus-gx/pkg/gx"

func FilterToolbarExample() gx.Node {
  return <form class="filter-toolbar" method="get">
  <input name="query" placeholder="Search files" type="search"></input>
  <button type="submit"><Text value={"Filter"}></Text></button>
</form>
}

Use the public toolbar API when the host wants this node set wrapped as a shared filter surface.