45 / 59 · Generative
Current weather
A glanceable weather card with a large temperature reading and conditions.
Austin, TX
94°FSunny, feels like 98°FInstallation
npm install @assistant-ui/react-generative-ui
Usage
import { renderGenerativeUI } from "@assistant-ui/react-generative-ui";
<div data-aui-theme="elements">
{renderGenerativeUI(spec, library, { status: "done" })}
</div>Spec
Data{
"$type": "Card",
"children": [
{
"$type": "Row",
"$key": "header",
"justify": "between",
"align": "center",
"children": [
{
"$type": "Text",
"$key": "city",
"value": "Austin, TX",
"color": "secondary"
},
{
"$type": "Icon",
"$key": "icon",
"name": "sun",
"size": "lg"
}
]
},
{
"$type": "Text",
"$key": "temp",
"value": "94°F",
"size": "3xl",
"weight": "bold"
},
{
"$type": "Text",
"$key": "description",
"value": "Sunny, feels like 98°F",
"color": "secondary"
}
]
}