root = Card([header, statusRow, categoryFilter, publishSection, readershipSection, topArticle, draftsSection, commentsSection, newDraftSection])
header = CardHeader("Editor's Content Studio", "Manage drafts, publishing, and readership")
statusRow = Card([statusTitle, statusBadges], "sunk", "row", "m")
statusTitle = Heading("Workspace status", "h3")
statusBadges = Card([draftsBadge, publishedBadge, topBadge], "clear", "row", "s")
draftsBadge = Tag("12 drafts", null, "md", "neutral")
publishedBadge = Tag("8 published this week", null, "md", "success")
topBadge = Tag("Most-read: 'State of the Web'", null, "md", "info")
categoryFilter = Card([filterHeading, filterSelect], "sunk", "column", "s")
filterHeading = Heading("Filter by category", "h3")
filterSelect = Select("category", [catAll, catTech, catDesign, catBusiness], "All categories")
catAll = SelectItem("all", "All categories")
catTech = SelectItem("tech", "Technology")
catDesign = SelectItem("design", "Design")
catBusiness = SelectItem("business", "Business")
publishSection = Card([publishHeading, scheduleForm], "sunk")
publishHeading = Heading("Schedule a piece", "h3")
scheduleForm = Form("schedule-piece", scheduleButtons, [titleField, dateField])
titleField = FormControl("Title", titleInput)
titleInput = Input("title", "Enter article title")
dateField = FormControl("Publish date", dateInput)
dateInput = DatePicker("publish_date", "single")
scheduleButtons = Buttons([scheduleBtn])
scheduleBtn = Button("Schedule", null, "primary")
readershipSection = Card([readershipHeading, readershipChart], "sunk")
readershipHeading = Heading("Readership over the past 30 days", "h3")
readershipChart = AreaChart(["Jun 1", "Jun 5", "Jun 10", "Jun 15", "Jun 20", "Jun 25", "Jun 30"], [readershipSeries], "natural", "Date", "Readers")
readershipSeries = Series("Readers", [1200, 1450, 1380, 2100, 2600, 2450, 3100])
topArticle = Card([topHeading, topTable], "sunk")
topHeading = Heading("Most-read article this month", "h3")
topTable = Table([articleCol, viewsCol])
articleCol = Col("Article", ["State of the Web", "Design Systems at Scale", "The Future of AI Tools"])
viewsCol = Col("Views", [48200, 32100, 27850])
draftsSection = Card([draftsHeading, draftsTable], "sunk")
draftsHeading = Heading("Drafts", "h3")
draftsTable = Table([draftTitleCol, draftStatusCol, draftDateCol])
draftTitleCol = Col("Title", ["Inside the Editor's Workflow", "A Guide to Component Libraries", "Typography Trends 2025", "Building for Accessibility"])
draftStatusCol = Col("Status", ["In progress", "Review", "Scheduled", "Draft"])
draftDateCol = Col("Updated", ["Jun 28", "Jun 27", "Jun 25", "Jun 22"])
commentsSection = Card([commentsHeading, commentsList], "sunk")
commentsHeading = Heading("Comments awaiting reply", "h3")
commentsList = ListBlock([commentOne, commentTwo, commentThree], "number")
commentOne = ListItem("Maya Chen", "Great breakdown — would love more detail on the chart section.", null, "Reply")
commentTwo = ListItem("Tom Okafor", "Can you clarify the licensing for the templates?", null, "Reply")
commentThree = ListItem("Priya Nair", "This helped our team a lot. Thanks for sharing!", null, "Reply")
newDraftSection = Card([newDraftHeading, newDraftButtons], "sunk")
newDraftHeading = Heading("Start a new draft", "h3")
newDraftButtons = Buttons([newDraftBtn], "row")
newDraftBtn = Button("New draft", null, "primary")