root = Card([header, kpiBlock, sections, noteForm, callForm])
header = CardHeader("Acme Corporation", "Enterprise Account · Owner: Sarah Mitchell, Senior AE")
kpiBlock = SnippetCardBlock([kpiDealValue, kpiStage, kpiRenewal], "grid", true)
kpiDealValue = SnippetCardItem("deal-value", kpiDealLhs, kpiDealRhs)
kpiDealLhs = IconText(kpiDealIcon, "neutral", "m", "Total Deal Value", "Current pipeline", false, "horizontal")
kpiDealIcon = Icon("circle-dollar-sign", "finance")
kpiDealRhs = BoldText("number", "$487,500", "+12.3% vs last quarter", "metric")
kpiStage = SnippetCardItem("deal-stage", kpiStageLhs, kpiStageRhs)
kpiStageLhs = IconText(kpiStageIcon, "neutral", "m", "Current Stage", "Active opportunity", false, "horizontal")
kpiStageIcon = Icon("flag", "navigation")
kpiStageRhs = BoldText("text", "Negotiation", "Expected close: Q2 2026")
kpiRenewal = SnippetCardItem("renewal-date", kpiRenewalLhs, kpiRenewalRhs)
kpiRenewalLhs = IconText(kpiRenewalIcon, "warning", "m", "Renewal Date", "Contract expires", false, "horizontal")
kpiRenewalIcon = Icon("calendar", "time")
kpiRenewalRhs = BoldText("text", "2026-07-15", "⚠️ 42 days remaining", "metric")
sections = SectionBlock([secActivity, secContacts, secFollowups], false)
secActivity = SectionItem("activity", "Recent Activity", [activityList])
activityList = ListBlock([act1, act2, act3, act4, act5], "number", "default")
act1 = ListItem("Contract terms sent for legal review", "Sarah Mitchell · 2026-05-28 14:32", null, null, { type: "continue_conversation", context: "Show details for contract terms sent on 2026-05-28" })
act2 = ListItem("Pricing proposal v3 delivered to procurement", "Sarah Mitchell · 2026-05-25 09:15", null, null, { type: "continue_conversation", context: "Show details for pricing proposal v3 delivered on 2026-05-25" })
act3 = ListItem("Technical validation call with engineering lead", "James Chen (SE) · 2026-05-22 11:00", null, null, { type: "continue_conversation", context: "Show details for technical validation call on 2026-05-22" })
act4 = ListItem("Executive sponsor meeting scheduled", "Sarah Mitchell · 2026-05-20 16:45", null, null, { type: "continue_conversation", context: "Show details for executive sponsor meeting on 2026-05-20" })
act5 = ListItem("Security questionnaire submitted", "Compliance Team · 2026-05-18 10:20", null, null, { type: "continue_conversation", context: "Show details for security questionnaire submitted on 2026-05-18" })
secContacts = SectionItem("contacts", "Key Contacts", [contactsTable])
contactsTable = Table([colName, colRole, colEmail, colPhone, colStatus])
colName = Col("Name", ["Robert Chen", "Lisa Park", "Marcus Johnson", "Amanda Torres", "David Kim"], "string")
colRole = Col("Role", ["CTO (Decision Maker)", "VP Procurement (Economic Buyer)", "Director of Engineering (Champion)", "Security Lead (Influencer)", "Legal Counsel (Blocker)"], "string")
colEmail = Col("Email", ["r.chen@acme.com", "l.park@acme.com", "m.johnson@acme.com", "a.torres@acme.com", "d.kim@acme.com"], "string")
colPhone = Col("Phone", ["+1-415-555-0142", "+1-415-555-0187", "+1-415-555-0123", "+1-415-555-0156", "+1-415-555-0198"], "string")
colStatus = Col("Engagement", ["High — Weekly sync", "Medium — Monthly", "High — Daily standup", "Low — As needed", "Low — Contract review only"], "string")
secFollowups = SectionItem("followups", "Open Follow-ups", [followupList])
followupList = ListBlock([fu1, fu2, fu3, fu4], "number", "default")
fu1 = ListItem("Send revised MSA with liability cap changes", "Due: 2026-06-05 · Owner: Sarah Mitchell", null, null, { type: "continue_conversation", context: "Mark 'Send revised MSA' as complete" })
fu2 = ListItem("Schedule procurement negotiation session", "Due: 2026-06-10 · Owner: Sarah Mitchell", null, null, { type: "continue_conversation", context: "Mark 'Schedule procurement session' as complete" })
fu3 = ListItem("Provide SOC 2 Type II report to security team", "Due: 2026-06-12 · Owner: Compliance", null, null, { type: "continue_conversation", context: "Mark 'Provide SOC 2 report' as complete" })
fu4 = ListItem("Confirm executive sponsor availability for QBR", "Due: 2026-06-18 · Owner: Sarah Mitchell", null, null, { type: "continue_conversation", context: Mark 'Confirm QBR availability' as complete" })
noteForm = Form("account-note", noteButtons, [noteField])
noteButtons = Buttons([btnSaveNote], "row")
btnSaveNote = Button("Save Note", { type: "continue_conversation", context: "Save this note to Acme Corporation account" }, "primary")
noteField = FormControl("Add a Note", noteInput, "Internal note — visible to your team only")
noteInput = TextArea("note-content", "Jot down thoughts, reminders, or context...", 4, { required: false })
callForm = Form("log-call", callButtons, [callTypeField, callOutcomeField, callNotesField, callNextStepsField])
callButtons = Buttons([btnLogCall, btnCancelCall], "row")
btnLogCall = Button("Log Call", { type: "continue_conversation", context: "Log this call to Acme Corporation account" }, "primary")
btnCancelCall = Button("Cancel", { type: "continue_conversation", context: "Cancel call logging" }, "tertiary")
callTypeField = FormControl("Call Type", callTypeSelect, "Select the type of call")
callTypeSelect = Select("call-type", [ct1, ct2, ct3, ct4, ct5], "Select call type", { required: true })
ct1 = SelectItem("discovery", "Discovery")
ct2 = SelectItem("demo", "Demo / Presentation")
ct3 = SelectItem("negotiation", "Negotiation")
ct4 = SelectItem("check-in", "Check-in / Relationship")
ct5 = SelectItem("other", "Other")
callOutcomeField = FormControl("Outcome", callOutcomeSelect, "How did the call go?")
callOutcomeSelect = Select("call-outcome", [co1, co2, co3, co4], "Select outcome", { required: true })
co1 = SelectItem("positive", "Positive — Moving forward")
co2 = SelectItem("neutral", "Neutral — More info needed")
co3 = SelectItem("stalled", "Stalled — Blockers identified")
co4 = SelectItem("lost", "Lost — Not a fit")
callNotesField = FormControl("Call Notes", callNotesInput, "Key discussion points, decisions, blockers")
callNotesInput = TextArea("call-notes", "Summarize the conversation...", 5, { required: false })
callNextStepsField = FormControl("Next Steps", callNextStepsInput, "Action items and follow-up dates")
callNextStepsInput = TextArea("next-steps", "Define clear next steps with owners and dates...", 3, { required: false })