# Before After

Side-by-side code comparison — red/green panels showing old vs new

## Surfaces

web, google-meet-stage, google-apps-script-web, mcp-apps

## Fields

| Field | Type |
|---|---|
| language | string |
| before | string |
| after | string |
| before_label | string (optional) |
| after_label | string (optional) |
| caption | string (optional) |

## Example payload

```json
{
  "type": "before_after",
  "language": "json",
  "before": "// example code",
  "after": "// example code"
}
```

Live page: https://a2uicatalog.ai/atoms/before_after/
Full field contract: https://a2uicatalog.ai/spec.json