跳到內容
調色盤星雲光譜
選擇版面配色

即時套用,保留目前的亮暗模式。

AnalyticsDashboardLayout (am-analytics-dashboard-layout)

AnalyticsDashboardLayout 是一個 CSS-first dashboard shell,提供 sidebar、topbar、KPI cards、chart slot 與 activity table 的資訊層級。它只負責版型,不負責 chart runtime、資料查詢或權限。

---
import AnalyticsDashboardLayout from "@astromer/core/components/AnalyticsDashboardLayout.astro";
---
<AnalyticsDashboardLayout
brandLabel="Orbitly"
title="Overview"
navItems={[{ label: "Overview", href: "/", current: true }]}
stats={[{ label: "Monthly revenue", value: "NT$48,204", trendLabel: "+12.4%", trend: "up" }]}
tableRows={[{ label: "Northstar refresh", status: "In review", value: "NT$412" }]}
>
<div slot="chart" aria-label="Revenue trend chart">Chart owned by the consumer</div>
</AnalyticsDashboardLayout>

chart slot 應提供可操作且有文字摘要的 chart 或 data visualization;若需要額外內容可使用 default slot。