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

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

SideMenu (am-side-menu)

am-side-menu 是可嵌入 dashboard、editor 或設定頁的 secondary navigation shell。群組中的子項目使用原生 <details> / <summary>,目前路由由 consumer 以 current 標記。

<SideMenu
brandLabel="Astromer"
brandHref="/app"
groups={[
{
label: "Workspace",
items: [
{ label: "Overview", href: "/app", current: true },
{
label: "Projects",
children: [
{ label: "All projects", href: "/app/projects", current: true },
{ label: "Archived", href: "/app/projects/archived" },
],
},
],
},
]}
profile={{ name: "Ariel Chen", detail: "Product lead" }}
/>

groups、current route、disabled state 與 profile data 由 consumer 提供;元件只負責導覽結構、disclosure 行為與 responsive surface。