root = Card([header, kpiRow, filtersRow, ordersSection, volumeSection])
header = CardHeader("E-Commerce Operations Desk", "Real-time order management & metrics")
kpiRow = Card([ordersTodayCard, revenueTodayCard, aovCard, refundRateCard], "clear", "row", "m", "stretch", "start", true)
ordersTodayCard = Card([ordersTodayLabel, ordersTodayValue], "sunk", "column", "s", "center")
ordersTodayLabel = TextContent("Orders Today", "small")
ordersTodayValue = TextContent("1,247", "large-heavy")
revenueTodayCard = Card([revenueTodayLabel, revenueTodayValue], "sunk", "column", "s", "center")
revenueTodayLabel = TextContent("Revenue Today", "small")
revenueTodayValue = TextContent("$89,342.15", "large-heavy")
aovCard = Card([aovLabel, aovValue], "sunk", "column", "s", "center")
aovLabel = TextContent("Avg Order Value", "small")
aovValue = TextContent("$71.65", "large-heavy")
refundRateCard = Card([refundRateLabel, refundRateValue], "sunk", "column", "s", "center")
refundRateLabel = TextContent("Refund Rate (Month)", "small")
refundRateValue = TextContent("2.3%", "large-heavy")
filtersRow = Card([statusFilter, customerSearch], "clear", "row", "m", "center", "start", true)
statusFilter = Select("status_filter", statusOptions, "All statuses", null, "medium")
statusOptions = [statusAll, statusPending, statusProcessing, statusShipped, statusDelivered, statusCancelled, statusRefunded]
statusAll = SelectItem("all", "All statuses")
statusPending = SelectItem("pending", "Pending")
statusProcessing = SelectItem("processing", "Processing")
statusShipped = SelectItem("shipped", "Shipped")
statusDelivered = SelectItem("delivered", "Delivered")
statusCancelled = SelectItem("cancelled", "Cancelled")
statusRefunded = SelectItem("refunded", "Refunded")
customerSearch = Input("customer_search", "Search customer name...", "text", null, "")
ordersSection = Card([ordersHeading, ordersTable], "card", "column", "m")
ordersHeading = Heading("Recent Orders", "h3")
ordersTable = Table([orderIdCol, customerCol, totalCol, statusCol, actionCol])
orderIdCol = Col("Order ID", orderIds)
customerCol = Col("Customer", customers)
totalCol = Col("Total", totals, "number")
statusCol = Col("Status", statuses)
actionCol = Col("Action", actions, "action")
orderIds = ["ORD-20241128-001", "ORD-20241128-002", "ORD-20241128-003", "ORD-20241128-004", "ORD-20241128-005", "ORD-20241128-006", "ORD-20241128-007", "ORD-20241128-008", "ORD-20241128-009", "ORD-20241128-010"]
customers = ["Sarah Chen", "Marcus Johnson", "Emily Rodriguez", "David Kim", "Lisa Thompson", "James Wilson", "Maria Garcia", "Robert Brown", "Jennifer Lee", "Christopher Davis"]
totals = [127.50, 89.99, 245.00, 67.25, 189.99, 45.00, 312.75, 78.50, 156.25, 92.00]
statuses = ["processing", "shipped", "delivered", "pending", "processing", "cancelled", "delivered", "shipped", "processing", "refunded"]
actions = ["Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled", "Mark Fulfilled"]
volumeSection = Card([volumeHeading, volumeChart], "card", "column", "m")
volumeHeading = Heading("Order Volume — Last 4 Weeks", "h3")
volumeChart = BarChart(weekLabels, [volumeSeries], "grouped", "Week", "Orders")
weekLabels = ["Nov 4–10", "Nov 11–17", "Nov 18–24", "Nov 25–Dec 1"]
volumeSeries = Series("Orders", [842, 915, 1023, 1156])