root = Card([header, kpiRow, filterRow, ticketsSection, newTicketAction])
header = CardHeader("Support Dashboard", "Morning overview — 7:42 AM")
kpiRow = Card([openTicketsKpi, avgResponseKpi], "clear", "row", "l")
openTicketsKpi = Card([openTicketsLabel, openTicketsValue], "sunk", "column", "xs", "center")
openTicketsLabel = TextContent("Open Tickets", "small-heavy")
openTicketsValue = TextContent("24", "large-heavy")
avgResponseKpi = Card([avgResponseLabel, avgResponseValue], "sunk", "column", "xs", "center")
avgResponseLabel = TextContent("Avg First Response", "small-heavy")
avgResponseValue = TextContent("1h 23m", "large-heavy")
filterRow = Card([filterLabel, filterControl], "clear", "row", "m", "center")
filterLabel = TextContent("Filter:", "small-heavy")
filterControl = Buttons([highPriorityBtn, allTicketsBtn], "row")
highPriorityBtn = Button("High Priority Only", ["filter-high"], "secondary", "default", "small")
allTicketsBtn = Button("All Tickets", ["filter-all"], "primary", "default", "small")
ticketsSection = Card([ticketsHeading, ticketsTable], "clear", "column", "m")
ticketsHeading = Heading("Recent Tickets", "h3")
ticketsTable = Table([ticketIdCol, ticketSubjectCol, ticketPriorityCol, ticketStatusCol, ticketTimeCol])
ticketIdCol = Col("ID", ["#1847", "#1846", "#1845", "#1844", "#1843"])
ticketSubjectCol = Col("Subject", ["Login failure on mobile", "Billing discrepancy Q3", "API rate limit exceeded", "Password reset not working", "Feature request: dark mode"])
ticketPriorityCol = Col("Priority", ["High", "High", "Medium", "High", "Low"])
ticketStatusCol = Col("Status", ["Open", "In Progress", "Open", "Open", "Open"])
ticketTimeCol = Col("Created", ["2h ago", "4h ago", "6h ago", "8h ago", "12h ago"])
newTicketAction = Card([newTicketBtn], "clear", "row", "m", "end")
newTicketBtn = DialogBlock("New Ticket", "Create a new support ticket", "Fill in the details below to open a ticket.", newTicketForm, "primary")
newTicketForm = Form("new-ticket", formButtons, [subjectField, priorityField, descriptionField, assigneeField])
subjectField = FormControl("Subject", subjectInput, "Brief summary of the issue")
subjectInput = Input("subject", "e.g., Login failure on iOS app")
priorityField = FormControl("Priority", prioritySelect, "Set urgency level")
prioritySelect = Select("priority", [priorityHigh, priorityMedium, priorityLow], "Select priority")
priorityHigh = SelectItem("high", "High — Critical impact")
priorityMedium = SelectItem("medium", "Medium — Significant impact")
priorityLow = SelectItem("low", "Low — Minor impact")
descriptionField = FormControl("Description", descriptionInput, "Detailed steps, logs, screenshots")
descriptionInput = TextArea("description", "Describe the issue...", 4)
assigneeField = FormControl("Assign To", assigneeSelect, "Optional: assign to a team member")
assigneeSelect = Select("assignee", [assigneeUnassigned, assigneeAlice, assigneeBob, assigneeCarol], "Unassigned")
assigneeUnassigned = SelectItem("unassigned", "Unassigned")
assigneeAlice = SelectItem("alice", "Alice Chen — Tier 2")
assigneeBob = SelectItem("bob", "Bob Martinez — Tier 1")
assigneeCarol = SelectItem("carol", "Carol Kim — Billing Specialist")
formButtons = Buttons([submitBtn, cancelBtn], "row")
submitBtn = Button("Create Ticket", null, "primary")
cancelBtn = Button("Cancel", null, "tertiary")