{
  "protocol_version": "a2ui-canvas/v1",
  "schema_version": "a2ui/v0.8",
  "surface_id": "surface-open-url-bottom-bar",
  "surface_version": 1,
  "payload": {
    "objects": [
      {
        "beginRendering": {
          "root": "root_card",
          "surfaceId": "surface-open-url-bottom-bar"
        }
      },
      {
        "surfaceUpdate": {
          "surfaceId": "surface-open-url-bottom-bar",
          "components": [
            {
              "id": "root_card",
              "component": {
                "Card": {
                  "child": "main_column"
                }
              }
            },
            {
              "id": "main_column",
              "component": {
                "Column": {
                  "alignment": "stretch",
                  "children": {
                    "explicitList": [
                      "title_label",
                      "summary_label",
                      "url_label",
                      "bottom_bar"
                    ]
                  }
                }
              }
            },
            {
              "id": "title_label",
              "component": {
                "Label": {
                  "text": {
                    "literalString": "Visit the site"
                  },
                  "variant": "title"
                }
              }
            },
            {
              "id": "summary_label",
              "component": {
                "Label": {
                  "text": {
                    "literalString": "This example exercises the local open_url handler in the web runtime."
                  },
                  "variant": "bodySans"
                }
              }
            },
            {
              "id": "url_label",
              "component": {
                "Label": {
                  "text": {
                    "literalString": "https://example.com"
                  },
                  "variant": "bodySans"
                }
              }
            },
            {
              "id": "bottom_bar",
              "component": {
                "BottomBar": {
                  "child": "cta_button"
                }
              }
            },
            {
              "id": "cta_label",
              "component": {
                "Label": {
                  "text": {
                    "literalString": "Open link"
                  },
                  "variant": "bodySansSemibold"
                }
              }
            },
            {
              "id": "cta_button",
              "component": {
                "Button": {
                  "child": "cta_label",
                  "style": "primary",
                  "action": {
                    "name": "open_url",
                    "context": [
                      {
                        "key": "url",
                        "value": {
                          "literalString": "https://example.com"
                        }
                      }
                    ]
                  }
                }
              }
            }
          ]
        }
      }
    ]
  }
}