feat: implement iOS 26 minimize behavior (#367)

* feat: implement iOS 26 minimize behavior

* feat: add docs

Author: okwasniewski

.changeset/ready-paths-train.md

@@ -0,0 +1,5 @@
+---
+'react-native-bottom-tabs': patch
+---
+
+feat: implement iOS 26 minimizeBehavior feature

apps/example/ios/Podfile.lock

@@ -1180,7 +1180,7 @@ PODS:
     - React-jsiexecutor
     - React-RCTFBReactNativeSpec
     - ReactCommon/turbomodule/core
-  - react-native-bottom-tabs (0.9.1):
+  - react-native-bottom-tabs (0.9.2):
     - DoubleConversion
     - glog
     - RCT-Folly (= 2024.11.18.00)
@@ -1931,7 +1931,7 @@ SPEC CHECKSUMS:
   React-logger: 1935d6e6461e9c8be4c87af56c56a4876021171e
   React-Mapbuffer: 212171f037e3b22e6c2df839aa826806da480b85
   React-microtasksnativemodule: a0ffd165c39251512d8cf51e9e8f5719dabc38b6
-  react-native-bottom-tabs: 7c7ee94435e518759b414e89068956096a1adec7
+  react-native-bottom-tabs: 6ee03990297f7e37f5c1dd6f5259cee851733d4f
   react-native-safe-area-context: e54b360402f089600c2fb0d825d1d3d918b99e15
   React-nativeconfig: cb207ebba7cafce30657c7ad9f1587a8f32e4564
   React-NativeModulesApple: 76a5d35322908fbc88871e6dd20433bea2b8b2db

apps/example/src/Examples/SFSymbols.tsx

@@ -47,6 +47,7 @@ export default function SFSymbols() {
   return (
     <TabView
       sidebarAdaptable
+      minimizeBehavior="onScrollDown"
       navigationState={{ index, routes }}
       onIndexChange={setIndex}
       renderScene={renderScene}

docs/docs/docs/guides/standalone-usage.md

@@ -47,6 +47,7 @@ export default function TabViewExample() {
       renderScene={renderScene}
       onIndexChange={setIndex}
       labeled
+      minimizeBehavior="onScrollDown" // iOS 26+: Hide tab bar when scrolling down
     />
   );
 }
@@ -143,6 +144,22 @@ Supported properties:
 Appearance attributes for the tab bar when a scroll view is at the bottom.
 - Type: `'default' | 'opaque' | 'transparent'`
 
+#### `minimizeBehavior` <Badge text="iOS 26+" type="info" />
+
+Controls how the tab bar behaves when content is scrolled.
+- Type: `'automatic' | 'onScrollDown' | 'onScrollUp' | 'never'`
+- Default: `undefined` (uses system default)
+
+Options:
+- `automatic`: Platform determines the behavior
+- `onScrollDown`: Tab bar minimizes when scrolling down
+- `onScrollUp`: Tab bar minimizes when scrolling up  
+- `never`: Tab bar never minimizes
+
+:::note
+This feature requires iOS 26.0 or later and is only available on iOS. On older versions, this prop is ignored.
+:::
+
 #### `tabBarActiveTintColor`
 
 Color for the active tab.

docs/docs/docs/guides/usage-with-react-navigation.mdx

@@ -158,6 +158,23 @@ Tab views using the sidebar adaptable style have an appearance
 
 Whether to enable haptic feedback on tab press. Defaults to false.
 
+#### `minimizeBehavior` <Badge text="iOS 26+" type="info" />
+
+Controls how the tab bar behaves when content is scrolled.
+
+- Type: `'automatic' | 'onScrollDown' | 'onScrollUp' | 'never'`
+- Default: `undefined` (uses system default)
+
+Options:
+- `automatic`: Platform determines the behavior
+- `onScrollDown`: Tab bar minimizes when scrolling down
+- `onScrollUp`: Tab bar minimizes when scrolling up  
+- `never`: Tab bar never minimizes
+
+:::note
+This feature requires iOS 26.0 or later and is only available on iOS. On older versions, this prop is ignored.
+:::
+
 #### `tabLabelStyle`
 
 Object containing styles for the tab label.

packages/react-native-bottom-tabs/android/src/newarch/RCTTabViewManager.kt

@@ -163,4 +163,7 @@ class RCTTabViewManager(context: ReactApplicationContext) :
 
   override fun setScrollEdgeAppearance(view: ReactBottomNavigationView?, value: String?) {
   }
+
+  override fun setMinimizeBehavior(view: ReactBottomNavigationView?, value: String?) {
+  }
 }

packages/react-native-bottom-tabs/android/src/oldarch/RCTTabViewManager.kt

@@ -137,6 +137,10 @@ class RCTTabViewManager(context: ReactApplicationContext) : ViewGroupManager<Rea
   fun setSidebarAdaptable(view: ReactBottomNavigationView, flag: Boolean) {
   }
 
+  @ReactProp(name = "minimizeBehavior")
+  fun setMinimizeBehavior(view: ReactBottomNavigationView, flag: Boolean) {
+  }
+
   @ReactProp(name = "hapticFeedbackEnabled")
   fun setHapticFeedbackEnabled(view: ReactBottomNavigationView, value: Boolean) {
       tabViewImpl.setHapticFeedbackEnabled(view, value)

packages/react-native-bottom-tabs/ios/Fabric/RCTTabViewComponentView.mm

@@ -130,6 +130,10 @@ - (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &
   if (oldViewProps.sidebarAdaptable != newViewProps.sidebarAdaptable) {
     _tabViewProvider.sidebarAdaptable = newViewProps.sidebarAdaptable;
   }
+  
+  if (oldViewProps.minimizeBehavior != newViewProps.minimizeBehavior) {
+    _tabViewProvider.minimizeBehavior = RCTNSStringFromString(newViewProps.minimizeBehavior);
+  }
 
   if (oldViewProps.disablePageAnimations != newViewProps.disablePageAnimations) {
     _tabViewProvider.disablePageAnimations = newViewProps.disablePageAnimations;

packages/react-native-bottom-tabs/ios/RCTTabViewViewManager.mm

@@ -29,6 +29,7 @@ @implementation RCTTabView
 RCT_EXPORT_VIEW_PROPERTY(onNativeLayout, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(selectedPage, NSString)
 RCT_EXPORT_VIEW_PROPERTY(tabViewStyle, NSString)
+RCT_EXPORT_VIEW_PROPERTY(minimizeBehavior, NSString)
 RCT_EXPORT_VIEW_PROPERTY(icons, NSArray<RCTImageSource *>);
 RCT_EXPORT_VIEW_PROPERTY(sidebarAdaptable, BOOL)
 RCT_EXPORT_VIEW_PROPERTY(labeled, BOOL)

packages/react-native-bottom-tabs/ios/TabViewImpl.swift

@@ -28,6 +28,7 @@ struct TabViewImpl: View {
         onLayout(size)
       }
     }
+    .tabBarMinimizeBehavior(props.minimizeBehavior)
 #if !os(tvOS) && !os(macOS) && !os(visionOS)
     .onTabItemEvent { index, isLongPress in
       let item = props.filteredItems[safe: index]
@@ -333,6 +334,23 @@ extension View {
     }
   }
 
+  @ViewBuilder
+  func tabBarMinimizeBehavior(_ behavior: MinimizeBehavior?) -> some View {
+#if compiler(>=6.2)
+    if #available(iOS 26.0, *) {
+      if let behavior {
+        self.tabBarMinimizeBehavior(behavior.convert())
+      } else {
+        self
+      }
+    } else {
+      self
+    }
+#else
+    self
+#endif
+  }
+
   @ViewBuilder
   func hideTabBar(_ flag: Bool) -> some View {
 #if !os(macOS)