macos-toolbar-sidebar

Implement macOS toolbar, sidebar, inspector, and split view interfaces with SwiftUI.

1|Updated Jun 5, 2026
One-click install
npx skills add https://github.com/LaughingJackalope/macos-skills --skill macos-toolbar-sidebar
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: macos-toolbar-sidebar
Source: https://github.com/LaughingJackalope/macos-skills/tree/main/macos-toolbar-sidebar
Command: npx skills add https://github.com/LaughingJackalope/macos-skills --skill macos-toolbar-sidebar

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill eliminates the guesswork of implementing platform-conformant macOS toolbar, sidebar, inspector, and split view interfaces that match Apple's Human Interface Guidelines, avoiding non-native custom implementations that feel out of place for Mac users.

Core Features & Use Cases

  • Native SwiftUI UI Patterns: Implements standard macOS toolbar placements, three-column NavigationSplitView layouts, slide-in inspector panels, sidebar-styled Lists, and hierarchical OutlineGroup sidebars.
  • AppKit Interop for Advanced Layouts: Provides guidance for wrapping NSSplitViewController for complex multi-pane layouts that exceed SwiftUI's built-in capabilities.
  • Use Case: Build a document-based Mac app with a collapsible navigation sidebar, centered document title menu in the toolbar, and a slide-in formatting inspector that persists across app launches.

Quick Start

Use the macos-toolbar-sidebar skill to add a three-column navigation layout with a collapsible sidebar, centered document title menu, and slide-in formatting inspector to your macOS document editor app.

Frequently Asked Questions about macos-toolbar-sidebar

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a macOS sidebar and inspector layout that matches Apple's Human Interface Guidelines?▼

Build native macOS sidebar and inspector layouts using SwiftUI NavigationSplitView to ensure Human Interface Guidelines compliance for standard navigation patterns and slide-in panels. This approach implements platform-conformant three-column interfaces with collapsible sidebars and centered document titles without custom chrome.

What's the best way to implement a slide-in inspector panel in SwiftUI for macOS?▼

Implement a slide-in inspector panel in SwiftUI for macOS using standard NavigationSplitView placements to achieve native system behavior. This ensures the inspector panel persists across app launches with system-managed state restoration for column visibility and widths.

Can I use NSSplitViewController with SwiftUI for complex multi-pane window layouts?▼

Yes, you can wrap NSSplitViewController to handle complex multi-pane window layouts that exceed SwiftUI's built-in capabilities. This AppKit interop approach allows advanced pane configurations while maintaining native macOS window chrome and system state restoration.

How do I persist sidebar column visibility and widths across app launches in macOS?▼

Persist sidebar column visibility and widths across app launches by relying on system-managed state restoration provided through native NavigationSplitView implementations. This ensures standard macOS split view behaviors automatically save and restore user interface configurations without manual coding.

When should I use AppKit interop instead of SwiftUI for macOS split view configurations?▼

Use AppKit interop for macOS split view configurations when your multi-pane layouts exceed SwiftUI's built-in capabilities and require complex pane configurations. Wrapping NSSplitViewController provides the necessary advanced layout control while preserving native window chrome and state restoration.