Order Status Card

Shopify Polaris-style order summary card showing order number, date, fulfilment status badge, customer name, line item list, and total. Status is colour-coded — fulfilled (green), unfulfilled (amber), partial (blue), cancelled (red), refunded (grey). Adapted from Polaris Card + Badge patterns.

Surfaces
webmeet-stageemailpdfapps-script-web
Degraded on
SurfaceNote
googlechatrenders as plain order summary text; no colour or badge styling
Fields
FieldType
order_numberstring. Order identifier, e.g. "#1042".required
datestring. Order date displayed next to the order number.optional
statusstring. One of fulfilled | unfulfilled | partial | cancelled | refunded.required
customerstring. Customer display name.optional
itemsarray. List of {title, qty, price} line items.optional
totalstring. Formatted grand total, e.g. "$124.00".optional
Example payload
{
  "type": "order_status_card",
  "order_number": "Order number",
  "status": "Active"
}
ARD catalog entry
{
  "identifier": "urn:air:a2uicatalog.ai:atom:order_status_card",
  "displayName": "Order Status Card",
  "type": "application/vnd.a2ui.atom+json",
  "url": "https://a2uicatalog.ai/atoms/order_status_card",
  "capabilities": [
    "web",
    "meet-stage",
    "email",
    "pdf",
    "apps-script-web"
  ],
  "description": "Shopify Polaris-style order summary card showing order number, date, fulfilment status badge, customer name, line item list, and total. Status is colour-coded \u2014 fulfilled (green), unfulfilled (amber), partial (blue), cancelled (red), refunded (grey). Adapted from Polaris Card + Badge patterns.",
  "representativeQueries": [
    "show a e-commerce order card with status badge and line item list",
    "shopify polaris-style order summary card showing order number, date, fulfilment status badge, custom",
    "render a order status card"
  ]
}
← Full ARD catalog Try it live →
Deploy your own renderer

The renderer is open source. Deploy your own instance in 4 commands — you own the URL, no dependency on the demo endpoint.

git clone https://github.com/a2uicatalog/a2ui
cd apps-script-surface/gas-schema-renderer
clasp push && clasp deploy
Full deploy guide →