Navigation/DSSidebar

DSSidebar

navigation
since v1.0

Collapsible navigation sidebar for macOS and iPad with section grouping and active-state indicator.

macOS 14+iOS 17+ (iPad)

Purpose

Primary navigation for content-rich macOS apps and iPad split-view layouts.

Props

PropTypeDefaultDescription
sectionsreq[DSSidebarSection]—Nav sections with title and items.
selectedreqBinding<String?>—ID of the active item.
isCollapsedreqBinding<Bool>—Collapsed / expanded state.

Examples

macOS app nav

Two-section sidebar with active state.

swift
DSSidebar(
    sections: [
        DSSidebarSection(title: "Workspace", items: [
            DSSidebarItem(id: "dashboard", label: "Dashboard", icon: "house"),
            DSSidebarItem(id: "projects",  label: "Projects",  icon: "folder"),
        ]),
        DSSidebarSection(title: "Account", items: [
            DSSidebarItem(id: "settings", label: "Settings", icon: "gearshape"),
        ]),
    ],
    selected: $selectedItem,
    isCollapsed: $isSidebarCollapsed
)

Related Components

NavigationBarTabs