Document tabs on iOS

_source/ios/02_tabs.md

@@ -0,0 +1,66 @@
+---
+permalink: /ios/tabs.html
+order: 02
+title: "Tabs"
+description: "How to add tabs to a Hotwire Native app on iOS."
+---
+
+# Tabs
+
+A native tab bar elevates a Hotwire Native app to make it feel more like a native app. Under the hood, Hotwire Native uses a standard `UITabBarController` subclass. This means all the expected features work out of the box, including:
+
+* Customization for tab titles and images
+* Separate navigation stacks for each tab
+* Tapping an active tab pops the stack to the root screen
+
+## Add a tab bar controller
+
+We'll build on top of the app from the [Getting Started guide](/ios/getting-started). From there, replace the contents of `SceneDelegate` with the following:
+
+```swift
+import HotwireNative
+import UIKit
+
+let rootURL = URL(string: "https://hotwire-native-demo.dev")!
+
+class SceneDelegate: UIResponder, UIWindowSceneDelegate {
+    var window: UIWindow?
+
+    private let tabBarController = HotwireTabBarController()
+
+    func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {
+        window?.rootViewController = tabBarController
+        tabBarController.load(tabs)
+    }
+}
+```
+
+Then, populate the tabs with a `tabs` variable at the bottom of the file:
+
+```swift
+let tabs = [
+    HotwireTab(
+        title: "Navigation",
+        image: .init(systemName: "arrow.left.arrow.right")!,
+        url: rootURL
+    ),
+
+    HotwireTab(
+        title: "Bridge Components",
+        image: .init(systemName: "square.grid.2x2")!,
+        url: rootURL.appendingPathComponent("components")
+    )
+]
+```
+
+This creates two tabs, Navigation and Bridge Components.
+
+<figure>
+    <img src="/assets/ios-tabs.png" width="400" alt="Hotwire Native tabs on iOS" />
+</figure>
+
+Each `HotwireTab` requires the following parameters:
+
+* `title`: The string to display on the tab
+* `image`: The image to display on the tab - the example above uses [SF Symbols](https://developer.apple.com/sf-symbols/)
+* `url`: The URL to visit when the tab loads

_source/ios/02_path_configuration.md → _source/ios/03_path_configuration.md

@@ -1,6 +1,6 @@
 ---
 permalink: /ios/path-configuration.html
-order: 02
+order: 03
 title: "Path Configuration"
 description: "Customize iOS app behavior via the path configuration."
 ---

_source/ios/03_bridge_components.md → _source/ios/04_bridge_components.md

@@ -1,6 +1,6 @@
 ---
 permalink: /ios/bridge-components.html
-order: 03
+order: 04
 title: "Bridge Components"
 description: "Bridge the gap with native bridge components driven by the web on iOS."
 ---

_source/ios/04_native_screens.md → _source/ios/05_native_screens.md

@@ -1,6 +1,6 @@
 ---
 permalink: /ios/native-screens.html
-order: 04
+order: 05
 title: "Native Screens"
 description: "Integrate fully native Swift screens in your Hotiwre Native app."
 ---

_source/ios/05_configuration.md → _source/ios/06_configuration.md

@@ -1,6 +1,6 @@
 ---
 permalink: /ios/configuration.html
-order: 05
+order: 06
 title: "Configuration"
 description: "How to customize a Hotwire Native iOS app."
 ---

_source/ios/06_reference.md → _source/ios/07_reference.md

@@ -1,6 +1,6 @@
 ---
 permalink: /ios/reference.html
-order: 06
+order: 07
 title: "Reference"
 description: "An reference guide to the Hotwire Native iOS library."
 ---