Navigation/DSNavigationBar

DSNavigationBar

navigation
since v1.0

App navigation bar with a title, optional back button, and leading/trailing icon button slots.

iOS 17+macOS 14+

Purpose

Top-level screen header in all non-tab navigation contexts.

Interactive Reference

Live showroom

Need the full visual surface?

Screenshots do not scale well across every component, state, and variant. For the real interactive reference, import the package and launch DSShowcaseRoot().

Best for exploring:

variants, states, categories, and real app examples in one place.

Props

PropTypeDefaultDescription
titlereqString—Screen title.
showBackBoolfalseShows a back chevron.
onBack(() -> Void)?nilBack button action.
leadingItems[DSNavBarItem][]Leading icon buttons.
trailingItems[DSNavBarItem][]Trailing icon buttons.

Examples

Screen header with actions

Detail screen header.

swift
DSNavigationBar(
    title: "Project Details",
    showBack: true,
    onBack: { dismiss() },
    trailingItems: [
        DSNavBarItem(icon: "square.and.arrow.up", action: { share() }),
        DSNavBarItem(icon: "ellipsis", action: { showMenu = true }),
    ]
)

Related Components

TabsSidebar