{
  "name": "notification-toast-row",
  "kind": "block",
  "primary": "col-ui",
  "page": "/catalog/ui-patterns/v050-mode-c-blocks/v050-mode-c-blocks.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {
    "gap": "2"
  },
  "html": "<col-ui gap=\"2\">\n    <alert-ui variant=\"success\" text=\"Changes saved successfully.\" closable></alert-ui>\n    <alert-ui variant=\"warning\" text=\"Your session will expire in 5 minutes.\" closable></alert-ui>\n    <alert-ui variant=\"danger\" text=\"Could not connect to server. Retry?\">\n      <button-ui slot=\"actions\" text=\"Retry\" variant=\"ghost\" size=\"sm\"></button-ui>\n    </alert-ui>\n  </col-ui>",
  "source": "catalog/ui-patterns/v050-mode-c-blocks/v050-mode-c-blocks.contents.html",
  "metadata": {
    "domain": "agent",
    "description": "Toast notification stack with success, warning, and error variants and dismiss buttons.",
    "keywords": [
      "toast",
      "notification",
      "stack",
      "success",
      "warning",
      "error",
      "variants",
      "dismiss",
      "buttons",
      "snackbar",
      "alert",
      "flash",
      "banner",
      "ephemeral",
      "feedback",
      "toast-stack"
    ]
  },
  "captured_at": "2026-06-07T19:28:13.657Z",
  "template": [
    {
      "id": "alert",
      "component": "Alert",
      "closable": true,
      "text": "Changes saved successfully.",
      "variant": "success"
    },
    {
      "id": "alert-2",
      "component": "Alert",
      "closable": true,
      "text": "Your session will expire in 5 minutes.",
      "variant": "warning"
    },
    {
      "id": "button",
      "component": "Button",
      "slot": "actions",
      "size": "sm",
      "text": "Retry",
      "variant": "ghost"
    },
    {
      "id": "alert-3",
      "component": "Alert",
      "text": "Could not connect to server. Retry?",
      "variant": "danger",
      "children": [
        "button"
      ]
    },
    {
      "id": "root",
      "component": "Column",
      "gap": "2",
      "children": [
        "alert",
        "alert-2",
        "alert-3"
      ]
    }
  ]
}
