root = Card([headerRow, kpiRow, positionsSection, exposureMoversRow, watchOrdersRow, headlinesSection, economicSection, strategySection, drawdownSection, riskSection, actionsSection, orderFormSection], "card", "column", "l")
headerRow = Card([header, timeframeButtons], "clear", "row", "l", "center", "between")
header = CardHeader("Trading Desk", "Morning Workspace · August 14, 2025")
timeframeButtons = Buttons([tf1d, tf1w, tf1m])
tf1d = Button("1D", null, "primary", null, "small")
tf1w = Button("1W", null, "secondary", null, "small")
tf1m = Button("1M", null, "secondary", null, "small")
kpiRow = Card([portfolioCard, pnlCard, varCard, marginCard], "clear", "row", "l")
portfolioCard = Card([portfolioLabel, portfolioValue], "sunk")
portfolioLabel = TextContent("Portfolio value", "small")
portfolioValue = TextContent("$24,682,500", "large-heavy")
pnlCard = Card([pnlLabel, pnlValue, pnlBadge], "sunk")
pnlLabel = TextContent("Profit & Loss today", "small")
pnlValue = TextContent("+$312,900", "large-heavy")
pnlBadge = Tag("+1.28%", null, null, "success")
varCard = Card([varLabel, varValue, varStatus], "sunk")
varLabel = TextContent("Value at Risk (95% 1D)", "small")
varValue = TextContent("$1.42M", "large-heavy")
varStatus = Tag("Within limit", null, null, "info")
marginCard = Card([marginLabel, marginProgress, marginText], "sunk")
marginLabel = TextContent("Margin in use", "small")
marginProgress = Progress(68, "68%")
marginText = TextContent("$4.2M of $6.2M", "small")
positionsSection = Card([positionsTitle, positionsTable], "sunk")
positionsTitle = Heading("Positions", "h2")
positionsTable = Table([posTicker, posSize, posEntry, posCurrent])
posTicker = Col("Ticker", ["AAPL", "MSFT", "NVDA", "TSLA", "AMZN"])
posSize = Col("Size", [12500, 8000, 4200, 6000, 9500])
posEntry = Col("Entry", ["$182.40", "$378.10", "$108.20", "$245.00", "$186.40"])
posCurrent = Col("Current", ["$191.20", "$395.80", "$118.40", "$228.60", "$192.75"])
exposureMoversRow = Card([exposureBlock, moversBlock], "clear", "row", "l")
exposureBlock = Card([exposureTitle, exposureChart], "sunk")
exposureTitle = Heading("Exposure by sector", "h3")
exposureChart = PieChart(["Technology", "Consumer", "Energy", "Healthcare", "Financials"], [38, 22, 14, 16, 10], "donut")
moversBlock = Card([moversTitle, moversRow], "sunk")
moversTitle = Heading("Biggest movers", "h3")
moversRow = Card([gainersList, losersList], "clear", "row", "l")
gainersList = ListBlock([gainer1, gainer2, gainer3], "number")
gainer1 = ListItem("NVDA", "+4.8%")
gainer2 = ListItem("META", "+3.2%")
gainer3 = ListItem("AMD", "+2.9%")
losersList = ListBlock([loser1, loser2, loser3], "number")
loser1 = ListItem("TSLA", "-2.1%")
loser2 = ListItem("V", "-1.4%")
loser3 = ListItem("JPM", "-0.9%")
watchOrdersRow = Card([watchBlock, ordersBlock], "clear", "row", "l")
watchBlock = Card([watchTitle, watchTable], "sunk")
watchTitle = Heading("Watchlist", "h3")
watchTable = Table([watchTicker, watchPrice])
watchTicker = Col("Ticker", ["SPY", "QQQ", "GLD", "BTC-USD", "EUR/USD"])
watchPrice = Col("Price", ["$555.20", "$475.80", "$232.10", "$67,250", "1.0832"])
ordersBlock = Card([ordersTitle, ordersTable], "sunk")
ordersTitle = Heading("Working orders", "h3")
ordersTable = Table([orderType, orderTicker, orderSide, orderQty, orderStatus])
orderType = Col("Type", ["Limit", "Stop", "Market"])
orderTicker = Col("Ticker", ["AAPL", "MSFT", "NVDA"])
orderSide = Col("Side", ["Buy", "Sell", "Buy"])
orderQty = Col("Qty", [500, 200, 1200])
orderStatus = Col("Status", ["Working", "Working", "Pending"])
headlinesSection = Card([headlineTitle, headline1, headline2, headline3, headline4, headline5], "sunk")
headlineTitle = Heading("Market headlines", "h3")
headline1 = TextCallout("success", "Fed holds rates steady, signals possible cut in September", "Reuters · 08:12")
headline2 = TextCallout("danger", "Tech stocks slide as chip export curbs weigh on sector", "Bloomberg · 07:45")
headline3 = TextCallout("neutral", "Oil prices edge higher amid Middle East supply concerns", "CNBC · 07:20")
headline4 = TextCallout("success", "Retail sales beat expectations, consumer confidence improves", "WSJ · 06:55")
headline5 = TextCallout("danger", "Bank earnings miss as loan-loss provisions rise", "FT · 06:30")
economicSection = Card([econTitle, econTable], "sunk")
econTitle = Heading("Economic releases this week", "h3")
econTable = Table([econDay, econRelease, econForecast, econPrevious])
econDay = Col("Day", ["Mon", "Tue", "Wed", "Thu", "Fri"])
econRelease = Col("Release", ["CPI (MoM)", "PPI (YoY)", "FOMC Minutes", "Jobless Claims", "Michigan Sentiment"])
econForecast = Col("Forecast", ["0.2%", "2.1%", "—", "230K", "66.5"])
econPrevious = Col("Previous", ["0.3%", "2.3%", "—", "227K", "66.4"])
strategySection = Card([strategyTitle, strategyChart], "sunk")
strategyTitle = Heading("Strategy returns YTD", "h3")
strategyLabels = ["Momentum", "Mean Reversion", "Arbitrage", "Trend Following", "Volatility"]
strategySeries = Series("Return (%)", [18.2, 12.4, 9.8, 7.1, -2.3])
strategyChart = HorizontalBarChart(strategyLabels, [strategySeries], "grouped", "Return (%)", "Strategy")
drawdownSection = Card([drawdownTitle, drawdownChart], "sunk")
drawdownTitle = Heading("Drawdown — last 12 months", "h3")
drawdownLabels = ["Sep", "Oct", "Nov", "Dec", "Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug"]
drawdownSeries = Series("Drawdown %", [0, -2.1, -3.8, -1.2, -4.5, -6.2, -5.8, -3.4, -1.9, -2.8, -1.1, -0.6])
drawdownChart = AreaChart(drawdownLabels, [drawdownSeries], "natural", "Month", "Drawdown %")
riskSection = Card([riskTitle, riskLimit1, riskLimit2, riskLimit3], "sunk")
riskTitle = Heading("Risk limits — near breach", "h3")
riskLimit1 = Callout("warning", "Sector exposure limit", "Technology allocation at 38%, limit is 40%.")
riskLimit2 = Callout("error", "VaR limit", "VaR at $1.42M is within 10% of the $1.60M limit.")
riskLimit3 = Callout("warning", "Margin utilization", "Margin at 68%; nearing the 75% threshold.")
actionsSection = Card([actionsTitle, rebalanceBtn], "sunk")
actionsTitle = Heading("Portfolio actions", "h3")
rebalanceBtn = Button("Rebalance portfolio", null, "primary")
orderFormSection = Card([orderFormTitle, orderForm], "sunk")
orderFormTitle = Heading("Place an order", "h3")
orderForm = Form("place-order", orderButtons, [tickerField, sideField, qtyField])
tickerField = FormControl("Ticker", tickerInput)
tickerInput = Input("ticker", "e.g. AAPL")
sideField = FormControl("Side", sideRadio)
sideRadio = RadioGroup("side", [buyOption, sellOption], "buy")
buyOption = RadioItem("Buy", "Long position", "buy")
sellOption = RadioItem("Sell", "Short position", "sell")
qtyField = FormControl("Quantity", qtyInput, "Shares or contracts")
qtyInput = Input("quantity", "e.g. 100", "number")
orderButtons = Buttons([placeOrderBtn, cancelOrderBtn])
placeOrderBtn = Button("Place order", null, "primary")
cancelOrderBtn = Button("Cancel", null, "tertiary")