Sidebar

Application frame: grouped side navigation with the content next to it. It collapses to icons only (labels stay available to screen readers and as a title tooltip) and remembers the choice; on a phone it becomes a Menu button that opens the same navigation in a modal Drawer.

App with two groups

Protocols

Collapse the bar with the button at its bottom: the choice is remembered in this browser. On narrow screens, the bar gives way to the Menu button.

@components.Sidebar(components.SidebarProps{
  ID: "app", Label: "Navigation", Collapsible: true,
  Groups: []components.SidebarGroup{{Label: "Work", Items: []components.SidebarItem{{Label: "Protocols", Href: "/protocols", Icon: "◆", Current: true}}}},
}) { page content }