agent
createSurface
restaurants-m1 · 13 components
{
"version": "v1.0",
"createSurface": {
"surfaceId": "restaurants-m1",
"catalogId": "https://a2ui.org/specification/v1_0/catalogs/basic/catalog.json",
"components": [
{
"id": "root",
"component": "Column",
"children": [
"title",
"summary",
"list"
]
},
{
"id": "title",
"component": "Text",
"text": "## Italian restaurants near you"
},
{
"id": "summary",
"component": "Text",
"text": {
"@call": "pluralize",
"args": {
"one": "One place nearby.",
"other": {
"@call": "formatString",
"args": {
"value": "${/count} places nearby, nearest first."
}
},
"value": {
"@path": "/count"
}
}
},
"variant": "caption"
},
{
"id": "list",
"component": "List",
"children": {
"componentId": "card",
"path": "/restaurants"
},
"direction": "horizontal"
},
{
"id": "card__image_1",
"component": "Image",
"description": {
"@path": "dish"
},
"fit": "cover",
"url": {
"@path": "image"
},
"variant": "mediumFeature"
},
{
"id": "card__text_1",
"component": "Text",
"text": {
"@call": "formatString",
"args": {
"value": "#### ${name}"
}
},
"variant": "body"
},
{
"id": "card__text_2",
"component": "Text",
"text": {
"@call": "formatString",
"args": {
"value": "${cuisine} · ${price} · ${formatNumber(value: ${distance}, decimals: 1)} km"
}
},
"variant": "caption"
},
{
"id": "card__column_2",
"component": "Column",
"align": "stretch",
"children": [
"card__image_1",
"card__text_1",
"card__text_2",
"stars"
],
"justify": "start"
},
{
"id": "card__text_3",
"component": "Text",
"text": "Book a table",
"variant": "body"
},
{
"id": "card__button_1",
"component": "Button",
"action": {
"event": {
"context": {
"name": {
"@path": "name"
},
"restaurantId": {
"@path": "id"
}
},
"name": "book"
}
},
"child": "card__text_3",
"variant": "default"
},
{
"id": "card__column_1",
"component": "Column",
"align": "stretch",
"children": [
"card__column_2",
"card__button_1"
],
"justify": "spaceBetween"
},
{
"id": "card",
"component": "Card",
"child": "card__column_1"
},
{
"id": "stars",
"component": "Rating",
"catalogId": "https://example.com/a2ui/catalogs/restaurant/v1/catalog.json",
"label": {
"@call": "formatString",
"args": {
"value": "${rating} · ${reviews} reviews"
}
},
"value": {
"@path": "rating"
}
}
],
"dataModel": {
"count": 3,
"restaurants": [
{
"cuisine": "Italian",
"dish": "Spaghetti al pomodoro with basil and parmesan",
"distance": 0.8,
"id": "trattoria-roma",
"image": "http://127.0.0.1:4001/images/trattoria-roma.svg",
"name": "Trattoria Roma",
"price": "$$",
"rating": 4.6,
"reviews": 412,
"stars": "★★★★★"
},
{
"cuisine": "Italian",
"dish": "A margherita on a wooden board",
"distance": 1.1,
"id": "pizzeria-napoli",
"image": "http://127.0.0.1:4001/images/pizzeria-napoli.svg",
"name": "Pizzeria Napoli",
"price": "$",
"rating": 4.8,
"reviews": 1033,
"stars": "★★★★★"
},
{
"cuisine": "Italian",
"dish": "Grilled river trout with lemon and herbs",
"distance": 2.4,
"id": "osteria-del-ponte",
"image": "http://127.0.0.1:4001/images/osteria-del-ponte.svg",
"name": "Osteria del Ponte",
"price": "$$$",
"rating": 4.2,
"reviews": 198,
"stars": "★★★★☆"
}
]
}
}
}