feat: add react-native-tab-view module

[huhuanming]

Summary

• Add react-native-tab-view native view module using Nitro HybridView pattern
• iOS: pure UIKit implementation (UITabBarController) with full iOS 26 liquid glass support (minimizeBehavior, bottomAccessoryView, tab roles)
• Android: wraps existing ReactBottomNavigationView with Nitro bridge
• Custom post-nitrogen script for React child view management
• JS/TS API consistent with react-native-bottom-tabs for seamless migration
• Add test page in example app with toggleable controls for all major props

Features

• SF Symbols & image icons
• Badges with custom background/text colors
• Sidebar adaptable mode (iPad)
• Translucent tab bar, scroll edge appearance
• Tab bar hidden, haptic feedback
• Bottom accessory view (iOS 26+)
• Tab roles (search)
• Long press events
• Tab bar height context

Test plan

• Run example app, navigate to "Tab View" test page
• Verify 4 tabs render with SF Symbol icons (iOS)
• Toggle badge on/off, verify badge colors
• Toggle labeled, translucent, tabBarHidden
• Test tab switching and long press events
• Verify useBottomTabBarHeight() displays correct value
• Test on iPad with sidebar adaptable enabled
• Test on iOS 26 simulator for liquid glass effect

Generated with Claude Code
via Happy

---

[devin-ai-integration]

Devin Review found 3 potential issues.

View 6 additional findings in Devin Review.

[devin-ai-integration]

🔴 Memory leak: TabViewDelegateProxy never unregisters container views from static singleton

TabViewDelegateProxy.shared is a static singleton that stores strong references to RCTTabViewContainerView instances in its mapping dictionary (RCTTabViewContainerView.swift:711). Views are registered at line 232 via TabViewDelegateProxy.shared.register(self, for: tbc), but the unregister(for:) method (line 717) is never called anywhere in the codebase. When a RCTTabViewContainerView is removed from the view hierarchy (e.g., navigating away from a screen with tabs), the strong reference in the static mapping prevents deallocation, leaking both the container view and the UITabBarController it retains.

---

Was this helpful? React with 👍 or 👎 to provide feedback.

[devin-ai-integration]

🔴 Android haptic feedback never triggers because ReactProp sets wrong field

The RCTTabViewManager.setHapticFeedbackEnabled at native-views/react-native-tab-view/android/src/main/java/com/rcttabview/RCTTabViewManager.kt:110 sets view.isHapticFeedbackEnabled, which is the Android View's built-in property. However, ReactBottomNavigationView.emitHapticFeedback() at native-views/react-native-tab-view/android/src/main/java/com/rcttabview/RCTTabView.kt:467 checks the private hapticFeedbackEnabled field (line 71), which is never set by the manager. As a result, haptic feedback is always disabled on Android regardless of the prop value.

---

Was this helpful? React with 👍 or 👎 to provide feedback.

[socket-security]

All alerts resolved. Learn more about Socket for GitHub.

This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored.

View full report

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@​react-navigation/​native@​7.1.33
	@​react-navigation/​native-stack@​7.14.4
	use-latest-callback@​0.2.6
	sf-symbols-typescript@​2.2.0
	react-freeze@​1.0.4
	react-native-screens@​4.24.0

View full report

[devin-ai-integration]

Devin Review found 3 new potential issues.

View 19 additional findings in Devin Review.

[devin-ai-integration]

🟡 Kotlin reference identity (!==) used instead of structural equality (!=) for String comparison

At RCTTabView.kt:271, item.title !== menuItem.title uses Kotlin's reference identity operator (!==) to compare a String with a CharSequence? (from MenuItem.getTitle()). This checks object identity rather than content equality. Since menuItem.title returns a CharSequence? from the Android framework (which won't be the same object reference as the Kotlin String), this comparison will almost always be true, causing unnecessary title updates on every call to updateItems. The correct operator is != for structural/content comparison.

---

Was this helpful? React with 👍 or 👎 to provide feedback.

[devin-ai-integration]

Devin Review found 1 new potential issue.

View 28 additional findings in Devin Review.

[devin-ai-integration]

🟡 jumpTo passes -1 index to onIndexChange when route key is not found

In TabView.tsx:332-334, jumpTo uses trimmedRoutes.findIndex() which returns -1 if the key is not found, then unconditionally passes that to onIndexChange(index). This would cause the consumer to receive an invalid index of -1, which would crash when used to access navigationState.routes[-1] (producing undefined) at TabView.tsx:230. The same issue exists in handleTabLongPress at line 340-341 where -1 could be passed to onTabLongPress.

Suggested change

	const jumpTo = useLatestCallback((key: string) => {
	const index = trimmedRoutes.findIndex((route) => route.key === key);
	onIndexChange(index);
	});
	const jumpTo = useLatestCallback((key: string) => {
	const index = trimmedRoutes.findIndex((route) => route.key === key);
	if (index !== -1) {
	onIndexChange(index);
	}
	});

---

Was this helpful? React with 👍 or 👎 to provide feedback.

[devin-ai-integration]

Devin Review found 1 new potential issue.

View 34 additional findings in Devin Review.

[devin-ai-integration]

🔴 autoCorrect/autoCapitalize guards check inputType but setRawInputType does not update inputType

The keyboardType setter now uses inputView.setRawInputType(...) instead of inputView.inputType = .... However, the guards in autoCorrect (line 252) and autoCapitalize (line 272) check inputView.inputType and InputType.TYPE_MASK_CLASS to detect number/phone classes. Since setRawInputType() only changes the content type for the IME without modifying inputType, the getter inputView.inputType still returns the original TYPE_CLASS_TEXT (EditText default). The guard if (inputClass != InputType.TYPE_CLASS_TEXT) return will never skip, so autoCorrect/autoCapitalize will still modify inputView.inputType to text-class values on number/phone inputs — exactly the problem the PR intended to fix.

How to fix

The guard should check the backing field `keyboardType` (the stored prop value) instead of `inputView.inputType`. For example: `if (keyboardType in listOf("numberPad", "decimalPad", "phonePad")) return`.

Prompt for agents

In native-views/react-native-auto-size-input/android/src/main/java/com/margelo/nitro/autosizeinput/AutoSizeInput.kt, the guards in the autoCorrect setter (around line 252) and autoCapitalize setter (around line 272) check inputView.inputType to detect number/phone input classes. But since keyboardType now uses setRawInputType() which does NOT update the inputType property, these guards will never trigger.

Fix both guards to check the stored keyboardType field instead:

In autoCorrect setter (line 252-253), replace:
  val inputClass = inputView.inputType and InputType.TYPE_MASK_CLASS
  if (inputClass != InputType.TYPE_CLASS_TEXT) return
With:
  if (keyboardType in listOf("numberPad", "decimalPad", "phonePad")) return

In autoCapitalize setter (line 272-273), replace:
  val inputClass = inputView.inputType and InputType.TYPE_MASK_CLASS
  if (inputClass != InputType.TYPE_CLASS_TEXT) return
With:
  if (keyboardType in listOf("numberPad", "decimalPad", "phonePad")) return

---

Was this helpful? React with 👍 or 👎 to provide feedback.