{
  "name": "schedule-meeting-form-card",
  "kind": "block",
  "primary": "card-ui",
  "page": "/apps/genui/app/gen-ui-feed/gen-ui-feed.contents.html",
  "slots": [],
  "nested": [],
  "attrs": {},
  "html": "<card-ui>\n        <header>\n          <h3>Schedule review meeting</h3>\n          <text-ui slot=\"description\" color=\"subtle\" size=\"sm\">I'll send the invite once you confirm</text-ui>\n        </header>\n        <section>\n          <col-ui gap=\"3\">\n            <field-ui label=\"Title\">\n              <input-ui value=\"Q4 revenue review · board prep\"></input-ui>\n            </field-ui>\n            <row-ui gap=\"3\">\n              <field-ui label=\"Date\">\n                <calendar-picker-ui value=\"2026-04-24\" grow></calendar-picker-ui>\n              </field-ui>\n              <field-ui label=\"Time\">\n                <select-ui grow>\n                  <option value=\"09:00\">9:00 AM</option>\n                  <option value=\"10:00\">10:00 AM</option>\n                  <option value=\"14:00\" selected>2:00 PM</option>\n                  <option value=\"16:00\">4:00 PM</option>\n                </select-ui>\n              </field-ui>\n            </row-ui>\n            <field-ui label=\"Attendees\">\n              <input-ui value=\"sarah@acme.io, alex@acme.io, board@acme.io\"></input-ui>\n            </field-ui>\n            <field-ui label=\"Attach Q4 revenue deck\" inline>\n              <check-ui checked></check-ui>\n            </field-ui>\n          </col-ui>\n        </section>\n        <footer divider>\n          <small slot=\"description\">Invite sends immediately after confirm.</small>\n          <span slot=\"action\">\n            <button-ui text=\"Cancel\" variant=\"ghost\"></button-ui>\n            <button-ui text=\"Send invite\" variant=\"primary\" icon=\"paper-plane-tilt\"></button-ui>\n          </span>\n        </footer>\n      </card-ui>",
  "source": "apps/genui/app/gen-ui-feed/gen-ui-feed.contents.html",
  "metadata": {
    "domain": "forms",
    "description": "Schedule-meeting form card — a card-framed event form with title, a date picker and time select side by side, an attendees field, an attach-deck checkbox, and a footer with Cancel / Send invite actions. The canonical 'create calendar event / send invite' form.",
    "keywords": [
      "schedule",
      "meeting",
      "form",
      "event",
      "calendar",
      "invite",
      "appointment",
      "booking",
      "date",
      "picker",
      "time",
      "select",
      "attendees",
      "title",
      "attach",
      "send",
      "invite",
      "review",
      "create",
      "event",
      "scheduler",
      "form",
      "card",
      "footer",
      "actions",
      "confirm",
      "calendar-picker",
      "meeting",
      "request"
    ]
  },
  "captured_at": "2026-06-10T16:56:21.616Z",
  "template": [
    {
      "id": "text",
      "component": "Text",
      "variant": "heading",
      "textContent": "Schedule review meeting"
    },
    {
      "id": "text-2",
      "component": "Text",
      "slot": "description",
      "color": "subtle",
      "size": "sm",
      "textContent": "I'll send the invite once you confirm"
    },
    {
      "id": "header",
      "component": "Header",
      "children": [
        "text",
        "text-2"
      ]
    },
    {
      "id": "input",
      "component": "Input",
      "value": "Q4 revenue review · board prep"
    },
    {
      "id": "field",
      "component": "Field",
      "label": "Title",
      "children": [
        "input"
      ]
    },
    {
      "id": "calendar-picker",
      "component": "CalendarPicker",
      "value": "2026-04-24"
    },
    {
      "id": "field-2",
      "component": "Field",
      "label": "Date",
      "children": [
        "calendar-picker"
      ]
    },
    {
      "id": "choice-picker",
      "component": "ChoicePicker",
      "options": [
        {
          "value": "09:00",
          "label": "9:00 AM"
        },
        {
          "value": "10:00",
          "label": "10:00 AM"
        },
        {
          "value": "14:00",
          "label": "2:00 PM"
        },
        {
          "value": "16:00",
          "label": "4:00 PM"
        }
      ],
      "value": "14:00"
    },
    {
      "id": "field-3",
      "component": "Field",
      "label": "Time",
      "children": [
        "choice-picker"
      ]
    },
    {
      "id": "row",
      "component": "Row",
      "gap": "3",
      "children": [
        "field-2",
        "field-3"
      ]
    },
    {
      "id": "input-2",
      "component": "Input",
      "value": "sarah@acme.io, alex@acme.io, board@acme.io"
    },
    {
      "id": "field-4",
      "component": "Field",
      "label": "Attendees",
      "children": [
        "input-2"
      ]
    },
    {
      "id": "check-box",
      "component": "CheckBox",
      "checked": true
    },
    {
      "id": "field-5",
      "component": "Field",
      "inline": true,
      "label": "Attach Q4 revenue deck",
      "children": [
        "check-box"
      ]
    },
    {
      "id": "column",
      "component": "Column",
      "gap": "3",
      "children": [
        "field",
        "row",
        "field-4",
        "field-5"
      ]
    },
    {
      "id": "section",
      "component": "Section",
      "children": [
        "column"
      ]
    },
    {
      "id": "text-3",
      "component": "Text",
      "variant": "caption",
      "slot": "description",
      "textContent": "Invite sends immediately after confirm."
    },
    {
      "id": "button",
      "component": "Button",
      "text": "Cancel",
      "variant": "ghost"
    },
    {
      "id": "button-2",
      "component": "Button",
      "icon": "paper-plane-tilt",
      "text": "Send invite",
      "variant": "primary"
    },
    {
      "id": "text-4",
      "component": "Text",
      "variant": "body",
      "slot": "action",
      "children": [
        "button",
        "button-2"
      ]
    },
    {
      "id": "footer",
      "component": "Footer",
      "children": [
        "text-3",
        "text-4"
      ]
    },
    {
      "id": "root",
      "component": "Card",
      "children": [
        "header",
        "section",
        "footer"
      ]
    }
  ]
}
