{
  "name": "dashboard-filter-bar",
  "kind": "block",
  "primary": "grid-ui",
  "page": "/apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {},
  "html": "<grid-ui>\n            <card-ui>\n              <section>\n                <row-ui gap=\"2\" align=\"center\" wrap data-filter-bar>\n                  <text-ui color=\"subtle\" weight=\"semibold\">Filters:</text-ui>\n                  <tag-ui text=\"Country: United States\" removable></tag-ui>\n                  <tag-ui text=\"Device: Desktop\" removable></tag-ui>\n                  <button-ui data-filter-add text=\"+ Add filter\" variant=\"ghost\" size=\"sm\"></button-ui>\n                  <span data-spacer></span>\n                  <button-ui data-filter-clear text=\"Clear all\" variant=\"ghost\" size=\"sm\"></button-ui>\n                </row-ui>\n              </section>\n            </card-ui>\n          </grid-ui>",
  "source": "apps/saas/app/admin-dashboard/admin-dashboard.contents.html",
  "metadata": {
    "domain": "navigation",
    "description": "Toolbar/filter bar — search input + filter dropdowns + date-range picker + action buttons in one row.",
    "keywords": [
      "toolbar",
      "filter-bar",
      "search",
      "filters",
      "dropdowns",
      "date-range",
      "actions",
      "controls",
      "toolbar-icons"
    ]
  },
  "captured_at": "2026-06-07T19:28:13.657Z",
  "template": [
    {
      "id": "text",
      "component": "Text",
      "color": "subtle",
      "weight": "semibold",
      "textContent": "Filters:"
    },
    {
      "id": "tag",
      "component": "Tag",
      "removable": true,
      "text": "Country: United States"
    },
    {
      "id": "tag-2",
      "component": "Tag",
      "removable": true,
      "text": "Device: Desktop"
    },
    {
      "id": "button",
      "component": "Button",
      "size": "sm",
      "text": "+ Add filter",
      "variant": "ghost",
      "data-filter-add": ""
    },
    {
      "id": "text-2",
      "component": "Text",
      "variant": "body",
      "data-spacer": ""
    },
    {
      "id": "button-2",
      "component": "Button",
      "size": "sm",
      "text": "Clear all",
      "variant": "ghost",
      "data-filter-clear": ""
    },
    {
      "id": "row",
      "component": "Row",
      "align": "center",
      "gap": "2",
      "wrap": true,
      "data-filter-bar": "",
      "children": [
        "text",
        "tag",
        "tag-2",
        "button",
        "text-2",
        "button-2"
      ]
    },
    {
      "id": "section",
      "component": "Section",
      "children": [
        "column"
      ]
    },
    {
      "id": "column",
      "component": "Column",
      "children": [
        "row"
      ]
    },
    {
      "id": "card",
      "component": "Card",
      "children": [
        "section"
      ]
    },
    {
      "id": "root",
      "component": "Grid",
      "children": [
        "card"
      ]
    }
  ]
}