Defining Panels

Properties3

Is BaseNo

Iconi-lucide-puzzle

Order30

Panel tabs are defined as enums conforming to KelyphosPanel. This gives you type-safe, switchable panels with SF Symbols icons and built-in keyboard shortcut support.

Navigator Tabs

enum MyNavigatorTab: String, KelyphosPanel, CaseIterable {
    case files, search, bookmarks

    nonisolated var id: String { rawValue }

    nonisolated var title: String {
        switch self {
        case .files: "Files"
        case .search: "Search"
        case .bookmarks: "Bookmarks"
        }
    }

    nonisolated var systemImage: String {
        switch self {
        case .files: "folder"
        case .search: "magnifyingglass"
        case .bookmarks: "bookmark"
        }
    }

    var body: some View {
        switch self {
        case .files: FilesNavigatorView()
        case .search: SearchNavigatorView()
        case .bookmarks: BookmarksNavigatorView()
        }
    }
}

Inspector and Utility Tabs

Inspector and utility tabs follow the same KelyphosPanel pattern:

enum MyInspectorTab: String, KelyphosPanel, CaseIterable {
    case details, properties

    nonisolated var id: String { rawValue }
    nonisolated var title: String { rawValue.capitalized }

    nonisolated var systemImage: String {
        switch self {
        case .details: "info.circle"
        case .properties: "slider.horizontal.3"
        }
    }

    var body: some View {
        switch self {
        case .details: DetailsInspectorView()
        case .properties: PropertiesInspectorView()
        }
    }
}

Assembling the Shell

Pass all panel arrays to KelyphosShellConfiguration:

KelyphosShellView(
    state: shellState,
    configuration: KelyphosShellConfiguration(
        navigatorTabs: Array(MyNavigatorTab.allCases),
        inspectorTabs: Array(MyInspectorTab.allCases),
        utilityTabs: Array(MyUtilityTab.allCases),
        detail: { MyDetailView() }
    )
)