root = Card([header, dateRange, kpis, trafficSection, sourcesSection, campaignsSection, subscribersSection, exportActions])
header = CardHeader("Marketing Dashboard", "Weekly overview · Last 30 days")
dateRange = Form("date-range", rangeButtons, [startField, endField])
startField = FormControl("Start date", startDate)
startDate = DatePicker("start", "single", null, ["2025-06-01"])
endField = FormControl("End date", endDate)
endDate = DatePicker("end", "single", null, ["2025-06-30"])
rangeButtons = Buttons([applyBtn, resetBtn])
applyBtn = Button("Apply")
resetBtn = Button("Reset", null, "tertiary")
kpis = Card([kpiHeading, kpiStats], "sunk")
kpiHeading = Heading("Key metrics", "h3")
kpiStats = Table([kpiName, kpiValue])
kpiName = Col("Metric", ["Site visitors", "Conversion rate", "Subscribers added"])
kpiValue = Col("Value", ["48,320", "3.4%", "1,206"])
trafficSection = Card([trafficHeading, trafficChart])
trafficHeading = Heading("Site visitors (last 30 days)", "h3")
trafficChart = AreaChart(["Jun 1", "Jun 5", "Jun 10", "Jun 15", "Jun 20", "Jun 25", "Jun 30"], [visitorsSeries], "natural", "Date", "Visitors")
visitorsSeries = Series("Visitors", [1200, 1450, 1680, 1520, 1900, 2100, 2050])
sourcesSection = Card([sourcesHeading, sourcesChart, sourcesList])
sourcesHeading = Heading("Top traffic sources", "h3")
sourcesChart = HorizontalBarChart(["Organic search", "Direct", "Social", "Email", "Referral"], [sourceSeries], "grouped", "Share (%)", "Source")
sourceSeries = Series("Share", [42, 24, 18, 10, 6])
sourcesList = ListBlock([sourceOrganic, sourceDirect, sourceSocial, sourceEmail, sourceReferral])
sourceOrganic = ListItem("Organic search", "42% of traffic", null, "Details")
sourceDirect = ListItem("Direct", "24% of traffic", null, "Details")
sourceSocial = ListItem("Social", "18% of traffic", null, "Details")
sourceEmail = ListItem("Email", "10% of traffic", null, "Details")
sourceReferral = ListItem("Referral", "6% of traffic", null, "Details")
campaignsSection = Card([campaignsHeading, bestCallout, campaignsTable])
campaignsHeading = Heading("Running campaigns", "h3")
bestCallout = Callout("success", "Best performer", "Summer Launch — $4,800 spend, 5.2% conversion rate. Top ROI this month.")
campaignsTable = Table([campaignName, campaignSpend, campaignConv, campaignStatus])
campaignName = Col("Campaign", ["Summer Launch", "Retargeting Pro", "Newsletter Boost", "Social Sprint", "Brand Awareness"])
campaignSpend = Col("Spend", ["$4,800", "$3,200", "$2,100", "$1,700", "$1,200"])
campaignConv = Col("Conv. rate", ["5.2%", "3.8%", "2.9%", "2.1%", "1.4%"])
campaignStatus = Col("Status", ["Active", "Active", "Active", "Paused", "Active"])
subscribersSection = Card([subscribersHeading, subscribersChart, subscribersSummary])
subscribersHeading = Heading("Email subscriber growth (this month)", "h3")
subscribersChart = LineChart(["Week 1", "Week 2", "Week 3", "Week 4"], [subscriberSeries], "natural", "Week", "Subscribers")
subscriberSeries = Series("Subscribers", [180, 320, 480, 226])
subscribersSummary = TextContent("**+1,206 subscribers** this month · 4.8% growth rate")
exportActions = Buttons([exportBtn, scheduleBtn])
exportBtn = Button("Export report")
scheduleBtn = Button("Schedule weekly email", null, "secondary")