{
  "name": "billing-cancel-subscription-danger",
  "kind": "block",
  "primary": "div",
  "page": "/apps/saas/app/billing/billing.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {
    "data-col": ""
  },
  "html": "<div data-col>\n      <alert-ui\n        variant=\"danger\"\n        icon=\"warning\"\n        text=\"Cancelling removes access to Pro features (advanced charts, API exports, priority support) after May 14, 2026.\"\n      ></alert-ui>\n      <button-ui text=\"Cancel subscription\" color=\"danger\" onclick=\"document.getElementById('drawer-cancel-sub').open = true\"></button-ui>\n    </div>",
  "source": "apps/saas/app/billing/billing.contents.html",
  "metadata": {
    "domain": "settings",
    "description": "Cancel subscription section — a danger alert-ui warning of feature loss above a destructive Cancel subscription button. The end-of-period cancellation block for a billing or account page.",
    "keywords": [
      "billing",
      "cancel",
      "subscription",
      "downgrade",
      "end",
      "danger",
      "alert-ui",
      "warning",
      "destructive",
      "button",
      "color-danger",
      "feature-loss",
      "settings",
      "churn",
      "unsubscribe",
      "terminate",
      "plan"
    ]
  },
  "captured_at": "2026-06-10T13:16:11.236Z",
  "template": [
    {
      "id": "alert",
      "component": "Alert",
      "icon": "warning",
      "text": "Cancelling removes access to Pro features (advanced charts, API exports, priority support) after May 14, 2026.",
      "variant": "danger"
    },
    {
      "id": "button",
      "component": "Button",
      "color": "danger",
      "text": "Cancel subscription"
    },
    {
      "id": "root",
      "component": "Column",
      "data-col": "",
      "children": [
        "alert",
        "button"
      ]
    }
  ]
}