@onekeyfe/react-native-bottom-tabs 6.7.0-19 → 6.7.0-20

package/docs/SPEC.md

@@ -1,5 +1,125 @@
 # Native Tab View behavioral contract
 
+## Native left drawer
+
+Status: implemented in module source. Package TypeScript, iOS/Android Fabric
+code generation, iOS Objective-C++ Fabric bridge compilation against RN 0.86.2,
+13 React wrapper checks, twelve Android API 36 native tests and four real-Fabric
+iOS review cases passed (shared-header/body arbitration and bar-height switches).
+The static Home example also passed a focused TypeScript check.
+Detailed iOS runtime evidence is recorded separately; physical-device and exact
+reference-video acceptance remain pending.
+
+`renderDrawerContent?: () => React.ReactNode` supplies an optional menu slot.
+`drawerOpen?: boolean` defaults to false and requests its stable open state.
+`onDrawerOpenChange?: (open: boolean) => void` reports a completed user transition;
+controlled consumers MUST mirror it into `drawerOpen`. Prop-driven transitions,
+initial layout and cancellation emit no event. A user transition returning to
+the previous stable state emits only when it overrides an in-flight external
+target, so the consumer can reconcile that target. `drawerSwipeEnabled?: boolean`
+defaults to false; callers MUST enable it only where drawer navigation is appropriate (normally a root
+screen). Existing `hapticFeedbackEnabled` enables one light native haptic after
+a completed user transition changes the stable state. Programmatic updates and
+cancelled gestures do not vibrate.
+
+The drawer is physically left on both iOS and Android, including RTL. Its width
+is 78 percent of the host. The foreground is the full tab container, including
+the native tab bar and an optional custom JS bar. It keeps its full width and
+height while moving right, without scaling, scene reparenting or remounting.
+The native host and two slots remain mounted when the drawer is disabled or its
+content changes. Missing content disables the drawer, resets it closed without
+an event, and passes foreground input through. Web omits the drawer host/menu
+and passes the existing tab content through; it implements no drawer gestures.
+The existing tab view's other Web support is unchanged.
+
+For normalized progress `p` in [0, 1], foreground translation is `.78 * width * p`,
+its left circular corner radius is `64 * p` points/dp and its neutral gray
+dim surface (RGB 28/28/28) has opacity `.7 * p`.
+The menu translates from `-.12 * drawerWidth` to zero; a black menu shade fades
+from .12 to zero. These are initial reference-video tuning values, not a claim
+of pixel-perfect parity. Closed menus are hidden from touch/accessibility;
+while visible, the foreground is blocked by a native dim surface. Tapping that
+surface closes the drawer. iOS accessibility escape and Android Back close an
+open drawer; the dim surface exposes an accessible close action.
+On Android the dim surface MUST retain full foreground bounds even while hidden
+and after React/Fabric ancestors suppress `requestLayout`. Internal containers
+and both slots MUST be measured and laid out on host layout and slot changes,
+without relying on a later ancestor layout pass. Visible dim input MUST prevent
+native foreground controls from receiving the same touch.
+While closed, that retained dim surface MUST also be excluded from React Native
+touch-target lookup, so JS Pressable taps reach the foreground. Visibility alone
+is insufficient for React Native's native target traversal.
+
+The reported native tab-bar height MUST become zero when hidden and restore the
+current height when shown. The context and drawer exclusion use one effective
+height: a rendered custom bar's own measured height takes precedence; otherwise
+`tabBarHidden` forces zero. Native hide measurements MUST NOT overwrite a custom
+bar's height, including across native/custom presentation switches.
+
+With opening swipes enabled, a one-finger rightward gesture may start anywhere
+in the foreground content. At the first confirmed direction, the actual native
+touch target and its ancestor chain determine ownership. A horizontal scroll
+view, list or pager which can consume that physical direction takes priority;
+only when every such ancestor is at its boundary may the drawer open. Vertical
+scroll views do not block horizontal drawer intent. Once selected, the owner is
+locked until up/cancel: reaching a boundary mid-gesture does not hand off.
+Disabled pager input does not claim a gesture based on its retained scroll
+range; an independently enabled horizontal child inside that page still can.
+An ancestor pager which explicitly excludes the touched shared header MUST NOT
+claim that header gesture solely because its horizontal offset is nonzero.
+The header's own nested horizontal content retains its normal boundary priority.
+On iOS this uses the repository's existing `excludedHeaderView` Objective-C
+getter on the native smooth pager and the real touch target's ancestry. It does
+not invoke another scroll view's UIKit recognition lifecycle hook, add a Pager
+API, or infer a header exclusion from a pager's selected page.
+The iOS UIPageViewController boundary uses its public data-source query once per
+decision, skipping its internally centered scroll offset. Android observes
+pending direction even when a nested pager initially disallows interception,
+but stops overriding that request after the child wins. Sliders and editing controls,
+web/graphics surfaces, system back gestures and starts in the bottom tab-bar
+footprint take priority. When open, closing gestures
+remain enabled even if opening swipes are disabled. Only the exposed
+foreground accepts a closing pan; menu scrolling remains the consumer's own.
+Vertical gestures fail before taking ownership. Active touches interrupted by
+a second finger, system cancellation, disabling, detach or a newer prop update
+cannot later emit an event. Cancellation returns to the previous stable state,
+or resumes an external target whose programmatic animation the gesture interrupted.
+No gesture progress crosses the JS bridge.
+
+Both platforms settle on their UI thread with the same critically damped curve:
+`p(t) = target + (a + b*t) * exp(-22*t)`, where `a = p0-target`,
+`b = v0 + 22*a`, and normalized velocity `v0` is clamped to [-8, 8] per second.
+Presentation is clamped to [0, 1], and the transition ends at or before 500 ms.
+Release targets open when `p + v0*.12 >= .5`. A newer animation or touch starts
+from the current displayed progress and cancels the previous completion.
+Resize snaps a pending settlement to its target, emitting its user event once
+if appropriate; an active drag follows the same cancellation rule. Detach cancels
+animations and callbacks; reattachment reapplies the latest external target.
+The host retains at most one display-link/animator, one touch
+sequence, two React child slots, and native dim surfaces. It owns no snapshots,
+workers, persistence, JS animation objects, RNGH or Reanimated dependency.
+
+Implementation boundaries: `src/BottomTabs.tsx` owns slots and settled callbacks;
+`src/BottomTabsDrawerNativeComponent.ts` defines the Fabric boundary;
+`ios/RCTBottomTabsDrawerContainerView.swift` and
+`android/src/main/java/com/onekey/bottomtabs/BottomTabsDrawerView.kt` own native
+input, layout, animation and cleanup. The iOS Fabric component and Android manager only forward children,
+props and the settled event. Required acceptance includes both bar styles,
+custom bars, content/vertical gestures, dim close, rapid reversal, cancellation,
+disable/remove-content, resize, detach, accessibility, RTL and bottom-bar
+gesture ownership, including a real pager, nested horizontal list and vertical
+scrolling in the complete Fabric example. Source checks and emulator checks do not establish physical
+device smoothness or exact reference-video fidelity.
+The Android native suite also exercises generated drawer prop forwarding in RTL,
+physical-left placement, and closing pans while opening swipes are disabled.
+
+The standalone `example/react-native/pages/BottomTabsHomeDrawerExample.tsx`
+reproduces Home’s wallet toolbar, balance/actions/banner shared header and
+Spot/Perps/Earn/NFT/History hierarchy using static data, native CollapsiblePager
+and standard React Native scroll views. It is an equivalent interaction fixture;
+the application’s existing JS collapsible-header implementation and business
+NativeList pages are not migrated or exercised by this fixture.
+
 ## Tab presses and double press
 
 Status: implemented in module source. Runtime verification status is recorded
@@ -142,12 +262,46 @@ boundary; `BottomTabsView.kt` owns scene geometry, appearance, and disposal;
 and runner instructions are in `native-tests/android`. The example's settings
 page exposes the switch and its scrolling scene reserves the reported bar height.
 
+## iOS vertical tab bar placement and side accessory
+
+Status: Implemented. Runtime results are in Conformance.
+
+On iOS 27.1+, devices such as iPhone Duo can place the `UITabBarController`
+bar vertically in a side strip next to the status bar. The view reports that
+placement and can draw one round accessory button above the vertical bar.
+
+- **Placement:** `onTabBarPlacementChange({ placement })` fires with `bottom`,
+  `leading`, or `trailing`, read from `traitCollection.verticalBarEdge` of the
+  tab bar controller. It fires once after the bar is created and again on every
+  change (rotation, folding, window resizing). Builds without the iOS 27.1 SDK
+  and earlier systems always report `bottom`. Android never fires it.
+- **Side accessory:** `sideAccessoryIcon` (an image source, loaded with the
+  React image loader and drawn as a template tinted with `inactiveTintColor`),
+  `sideAccessoryLabel` (accessibility label), and `onSideAccessoryPress`. The
+  button is 48 pt, a Liquid Glass capsule on iOS 26+, centered horizontally on
+  the vertical bar's item platter and 12 pt above it.
+- Android MUST accept `sideAccessoryIcon` and `sideAccessoryLabel`, including
+  null resets, as no-ops through its generated ViewManager interface. It MUST
+  NOT create a side accessory or emit placement/accessory events. Shared Fabric
+  props still require Android setters even when the feature is iOS-only.
+- The button shows only when all hold: the placement is `leading` or
+  `trailing`, the tab bar is not hidden, the icon has loaded, and the platter
+  is found. Otherwise it is hidden; a bottom bar never shows it.
+- UIKit does not expose the platter frame. The view finds the platter by its
+  view class name below the tab bar controller (skipping tab content views),
+  reads its frame, and calls no private API. If a later system renames or
+  restructures it, the accessory hides; no other behavior depends on it.
+- Layout re-runs, coalesced on the next main-queue turn, after container
+  layout, tab rebuilds, tab bar hiding, icon loads, and changes to the traits
+  affecting `verticalBarEdge`.
+
 ## Threading and ownership
 
 All gesture handling, animations, and timers run on the platform UI thread in
 the main-runtime native view. The view owns no background-runtime or shared JS
-objects. Retained state is bounded to the current touch sequence, the last
-pressed tab and timestamp, and at most two running animators.
+objects. The tab bar retains the current touch sequence, the last pressed tab
+and timestamp, and at most two running animators. The optional drawer's additional
+single animation and touch ownership are bounded in the Native left drawer section.
 
 ## Conformance and acceptance
 
@@ -166,3 +320,10 @@ non-selected tab lifts the lens there; drag crossing tab centers does not change
 pages; release selects the nearest tab once; cancel restores; hidden bar, dark
 mode, and 3-button navigation insets lay out correctly. Source compilation is
 recorded separately from runtime acceptance.
+
+Vertical tab bar: `RCTBottomTabsContainerView.swift` (`currentTabBarPlacement`,
+`updateTabBarPlacementAndSideAccessory`, `verticalTabBarPlatterFrame`).
+Required iOS runtime cases on iPhone Duo: the outer display and landscape inner
+display report `trailing` and show the accessory above the platter; the
+portrait inner display reports `bottom` and hides it; hiding the tab bar hides
+it; a press emits `onSideAccessoryPress` once.

package/ios/RCTBottomTabsComponentView.mm

@@ -171,6 +171,28 @@ static NSArray<NSDictionary *>* convertItemsToArray(const std::vector<RNBottomTa
       }
     };
     [_containerView setValue:onNativeLayout forKey:@"onNativeLayout"];
+
+    EventBlock onTabBarPlacementChange = ^(NSDictionary *body) {
+      auto strongSelf = weakSelf;
+      if (!strongSelf) return;
+      auto emitter = std::static_pointer_cast<const RNBottomTabsViewEventEmitter>(strongSelf->_eventEmitter);
+      if (emitter) {
+        emitter->onTabBarPlacementChange({
+          .placement = std::string([[body objectForKey:@"placement"] UTF8String] ?: "bottom")
+        });
+      }
+    };
+    [_containerView setValue:onTabBarPlacementChange forKey:@"onTabBarPlacementChange"];
+
+    EventBlock onSideAccessoryPress = ^(NSDictionary *body) {
+      auto strongSelf = weakSelf;
+      if (!strongSelf) return;
+      auto emitter = std::static_pointer_cast<const RNBottomTabsViewEventEmitter>(strongSelf->_eventEmitter);
+      if (emitter) {
+        emitter->onSideAccessoryPress({});
+      }
+    };
+    [_containerView setValue:onSideAccessoryPress forKey:@"onSideAccessoryPress"];
   }
 
   return self;
@@ -308,6 +330,21 @@ static NSArray<NSDictionary *>* convertItemsToArray(const std::vector<RNBottomTa
     [_containerView setValue:@(newViewProps.tabBarHidden) forKey:@"tabBarHidden"];
   }
 
+  if (oldViewProps.sideAccessoryIcon != newViewProps.sideAccessoryIcon) {
+    const auto &source = newViewProps.sideAccessoryIcon;
+    NSDictionary *iconDict = source.uri.empty() ? nil : @{
+      @"uri": [NSString stringWithUTF8String:source.uri.c_str()],
+      @"width": @(source.size.width),
+      @"height": @(source.size.height),
+      @"scale": @(source.scale),
+    };
+    [_containerView setValue:iconDict forKey:@"sideAccessoryIcon"];
+  }
+
+  if (oldViewProps.sideAccessoryLabel != newViewProps.sideAccessoryLabel) {
+    [_containerView setValue:NSStringFromStdStringNilIfEmpty(newViewProps.sideAccessoryLabel) forKey:@"sideAccessoryLabel"];
+  }
+
 #undef SET_PROP
 
   [super updateProps:props oldProps:oldProps];

package/ios/RCTBottomTabsContainerView.swift

@@ -70,6 +70,16 @@ class RCTBottomTabsContainerView: UIView {
   private var lastPressedTabTime: CFTimeInterval = 0
   /// Cached view controllers keyed by tab key to avoid unnecessary reparenting
   private var cachedViewControllers: [String: UIViewController] = [:]
+  // Vertical tab bar (iPhone Duo side strip): last reported placement and the
+  // round accessory button drawn above the bar.
+  private var reportedTabBarPlacement: String?
+  private var sideAccessoryButton: UIButton?
+  private var loadedSideAccessoryIcon: UIImage?
+  // Increments per icon load; a completion applies only to the latest one.
+  private var sideAccessoryIconRequest = 0
+  private var isSideAccessoryLayoutScheduled = false
+  private static let sideAccessorySize: CGFloat = 48
+  private static let sideAccessorySpacing: CGFloat = 12
 
   // MARK: - Props (set by Fabric ComponentView via KVC)
 
@@ -128,7 +138,11 @@ class RCTBottomTabsContainerView: UIView {
 
   @objc var inactiveTintColor: UIColor? {
     // Rebuild so the baked unselected-image tint follows theme changes.
-    didSet { updateTabBarAppearance(); rebuildViewControllers() }
+    didSet {
+      updateTabBarAppearance()
+      rebuildViewControllers()
+      sideAccessoryButton?.tintColor = inactiveTintColor
+    }
   }
 
   @objc var rippleColor: UIColor? // Android only
@@ -147,12 +161,22 @@ class RCTBottomTabsContainerView: UIView {
     didSet { updateTabBarAppearance() }
   }
 
+  @objc var sideAccessoryIcon: NSDictionary? {
+    didSet { loadSideAccessoryIcon() }
+  }
+
+  @objc var sideAccessoryLabel: String? {
+    didSet { sideAccessoryButton?.accessibilityLabel = sideAccessoryLabel }
+  }
+
   // MARK: - Events (RCTDirectEventBlock)
 
   @objc var onPageSelected: RCTDirectEventBlock?
   @objc var onTabDoublePress: RCTDirectEventBlock?
   @objc var onTabBarMeasured: RCTDirectEventBlock?
   @objc var onNativeLayout: RCTDirectEventBlock?
+  @objc var onTabBarPlacementChange: RCTDirectEventBlock?
+  @objc var onSideAccessoryPress: RCTDirectEventBlock?
 
   // MARK: - Init
 
@@ -188,6 +212,165 @@ class RCTBottomTabsContainerView: UIView {
     // TODO: Re-enable when UITabBar.bottomAccessoryView is available in the SDK
   }
 
+  // MARK: - Vertical tab bar (iOS 27.1+)
+
+  /// Where the system draws the tab bar: "bottom", or "leading"/"trailing" for
+  /// the vertical bar some devices (iPhone Duo) place in a side strip.
+  private func currentTabBarPlacement() -> String {
+    #if compiler(>=6.4)
+    if #available(iOS 27.1, *), let tbc = tabBarController {
+      switch tbc.traitCollection.verticalBarEdge {
+      case .leading: return "leading"
+      case .trailing: return "trailing"
+      default: break
+      }
+    }
+    #endif
+    return "bottom"
+  }
+
+  private func registerVerticalBarTraitChanges(_ tbc: UITabBarController) {
+    #if compiler(>=6.4)
+    if #available(iOS 27.1, *) {
+      tbc.registerForTraitChanges(
+        UITraitCollection.systemTraitsAffectingVerticalBarEdge
+      ) { [weak self] (_: UITabBarController, _: UITraitCollection) in
+        self?.scheduleSideAccessoryLayout()
+      }
+    }
+    #endif
+  }
+
+  /// Coalesces requests and runs after UIKit has laid out the bar, whose
+  /// floating platter is positioned in UIKit's own layout pass.
+  private func scheduleSideAccessoryLayout() {
+    guard !isSideAccessoryLayoutScheduled else { return }
+    isSideAccessoryLayoutScheduled = true
+    DispatchQueue.main.async { [weak self] in
+      guard let self else { return }
+      self.isSideAccessoryLayoutScheduled = false
+      self.updateTabBarPlacementAndSideAccessory()
+    }
+  }
+
+  private func updateTabBarPlacementAndSideAccessory() {
+    guard let tbc = tabBarController else { return }
+    let placement = currentTabBarPlacement()
+    if placement != reportedTabBarPlacement {
+      reportedTabBarPlacement = placement
+      onTabBarPlacementChange?(["placement": placement])
+    }
+
+    guard placement != "bottom",
+          !tabBarHidden,
+          let icon = loadedSideAccessoryIcon,
+          let platterFrame = verticalTabBarPlatterFrame(in: tbc) else {
+      sideAccessoryButton?.isHidden = true
+      return
+    }
+
+    let button = ensureSideAccessoryButton(in: tbc.view)
+    button.configuration?.image = icon
+    let size = RCTBottomTabsContainerView.sideAccessorySize
+    button.frame = CGRect(
+      x: platterFrame.midX - size / 2,
+      y: platterFrame.minY - RCTBottomTabsContainerView.sideAccessorySpacing - size,
+      width: size,
+      height: size
+    )
+    button.isHidden = false
+    tbc.view.bringSubviewToFront(button)
+  }
+
+  /// UIKit draws the vertical bar items in a floating platter it does not
+  /// expose. Read that view's frame (no private API is called) and return nil
+  /// when it cannot be found, so the accessory hides instead of misplacing.
+  private func verticalTabBarPlatterFrame(in tbc: UITabBarController) -> CGRect? {
+    let root = tbc.view!
+    // Tab content can hold large React trees; the bar lives outside them.
+    let contentViews = Set((tbc.viewControllers ?? []).compactMap { vc in
+      vc.isViewLoaded ? ObjectIdentifier(vc.view) : nil
+    })
+    var queue: [UIView] = root.subviews
+    var index = 0
+    while index < queue.count {
+      let view = queue[index]
+      index += 1
+      if view === sideAccessoryButton || contentViews.contains(ObjectIdentifier(view)) {
+        continue
+      }
+      if NSStringFromClass(type(of: view)).contains("TabBarItemPlatterView") {
+        guard !view.isHidden, view.window != nil else { return nil }
+        let frame = view.convert(view.bounds, to: root)
+        return frame.isEmpty ? nil : frame
+      }
+      queue.append(contentsOf: view.subviews)
+    }
+    return nil
+  }
+
+  private func ensureSideAccessoryButton(in parent: UIView) -> UIButton {
+    if let button = sideAccessoryButton {
+      if button.superview !== parent { parent.addSubview(button) }
+      return button
+    }
+    var configuration: UIButton.Configuration
+    #if compiler(>=6.2)
+    if #available(iOS 26.0, *) {
+      configuration = .glass()
+    } else {
+      configuration = .gray()
+    }
+    #else
+    configuration = .gray()
+    #endif
+    configuration.cornerStyle = .capsule
+    configuration.contentInsets = .zero
+    let button = UIButton(configuration: configuration)
+    button.tintColor = inactiveTintColor
+    button.accessibilityLabel = sideAccessoryLabel
+    button.addAction(UIAction { [weak self] _ in
+      self?.onSideAccessoryPress?([:])
+    }, for: .primaryActionTriggered)
+    parent.addSubview(button)
+    sideAccessoryButton = button
+    return button
+  }
+
+  private func loadSideAccessoryIcon() {
+    sideAccessoryIconRequest += 1
+    let request = sideAccessoryIconRequest
+    // Drop the previous icon so a slower or failed load never leaves it shown
+    // for the new source.
+    if loadedSideAccessoryIcon != nil {
+      loadedSideAccessoryIcon = nil
+      scheduleSideAccessoryLayout()
+    }
+    let source = sideAccessoryIcon.map { IconSource(dict: $0) }
+    guard let source, let url = URL(string: source.uri) else { return }
+    // The image loader arrives with the first state update; setImageLoader
+    // calls this again.
+    guard let imageLoader else { return }
+    imageLoader.loadImage(
+      with: URLRequest(url: url),
+      size: CGSize(width: source.width, height: source.height),
+      scale: CGFloat(source.scale),
+      clipped: true,
+      resizeMode: RCTResizeMode.contain,
+      progressBlock: { _, _ in },
+      partialLoad: { _ in },
+      completionBlock: { [weak self] error, image in
+        guard error == nil, let image else { return }
+        DispatchQueue.main.async {
+          guard let self, request == self.sideAccessoryIconRequest else { return }
+          self.loadedSideAccessoryIcon = image
+            .resizeImageTo(size: self.iconSize)?
+            .withRenderingMode(.alwaysTemplate)
+          self.scheduleSideAccessoryLayout()
+        }
+      })
+  }
+
   // MARK: - Lifecycle
 
   private func handleLayout() {
@@ -197,6 +380,7 @@ class RCTBottomTabsContainerView: UIView {
     setupTabBarControllerIfNeeded()
     tabBarController?.view.frame = bounds
     onNativeLayout?(["width": Double(bounds.width), "height": Double(bounds.height)])
+    scheduleSideAccessoryLayout()
   }
 
   private func setupTabBarControllerIfNeeded() {
@@ -215,6 +399,7 @@ class RCTBottomTabsContainerView: UIView {
     tbc.didMove(toParent: parentVC)
 
     self.tabBarController = tbc
+    registerVerticalBarTraitChanges(tbc)
 
     rebuildViewControllers()
     updateTabBarAppearance()
@@ -225,9 +410,7 @@ class RCTBottomTabsContainerView: UIView {
 
     DispatchQueue.main.async { [weak self] in
       guard let self, let tbc = self.tabBarController else { return }
-      if !tbc.tabBar.isHidden {
-        self.onTabBarMeasured?(["height": Double(tbc.tabBar.frame.size.height)])
-      }
+      self.onTabBarMeasured?(["height": self.tabBarHidden ? 0 : Double(tbc.tabBar.frame.size.height)])
     }
   }
 
@@ -358,6 +541,8 @@ class RCTBottomTabsContainerView: UIView {
     }
 
     updateSelectedTab()
+    // The platter height follows the number of visible tabs.
+    scheduleSideAccessoryLayout()
   }
 
   // MARK: - Selection
@@ -499,9 +684,8 @@ class RCTBottomTabsContainerView: UIView {
     #endif
     tbc.tabBar.isUserInteractionEnabled = !tabBarHidden
 
-    if !tabBarHidden {
-      onTabBarMeasured?(["height": Double(tbc.tabBar.frame.size.height)])
-    }
+    onTabBarMeasured?(["height": tabBarHidden ? 0 : Double(tbc.tabBar.frame.size.height)])
+    scheduleSideAccessoryLayout()
   }
 
   private func updateSidebarAdaptable() {
@@ -573,6 +757,7 @@ class RCTBottomTabsContainerView: UIView {
     self.imageLoader = loader
     loadIconsFromSources()
     loadSelectedIconsFromSources()
+    loadSideAccessoryIcon()
   }
 
   private func loadIconsFromSources() {

package/ios/RCTBottomTabsDrawerComponentView.h

@@ -0,0 +1,8 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+#import <React/RCTViewComponentView.h>
+
+NS_ASSUME_NONNULL_BEGIN
+@interface RCTBottomTabsDrawerComponentView : RCTViewComponentView
+@end
+NS_ASSUME_NONNULL_END
+#endif

package/ios/RCTBottomTabsDrawerComponentView.mm

@@ -0,0 +1,79 @@
+#import "RCTBottomTabsDrawerComponentView.h"
+#import <react/renderer/components/RNBottomTabs/ComponentDescriptors.h>
+#import <react/renderer/components/RNBottomTabs/EventEmitters.h>
+#import <react/renderer/components/RNBottomTabs/Props.h>
+#import <React/RCTFabricComponentsPlugins.h>
+
+// Swift keeps the host internal to this module, so its framework compatibility
+// header does not export the class. Its explicit @objc name and selectors form
+// this private boundary, matching the existing tab container's runtime lookup.
+@protocol RNBottomTabsDrawerContainer <NSObject>
+@property(nonatomic) BOOL enabled;
+@property(nonatomic) BOOL open;
+@property(nonatomic) BOOL swipeEnabled;
+@property(nonatomic) BOOL hapticFeedbackEnabled;
+@property(nonatomic) double bottomBarHeight;
+@property(nonatomic, copy) void (^onDrawerOpenChange)(BOOL open);
+- (void)insertChild:(UIView *)child atIndex:(NSInteger)index;
+- (void)removeChildAtIndex:(NSInteger)index;
+@end
+
+using namespace facebook::react;
+
+@implementation RCTBottomTabsDrawerComponentView {
+  UIView<RNBottomTabsDrawerContainer> *_drawer;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+  return concreteComponentDescriptorProvider<RNBottomTabsDrawerComponentDescriptor>();
+}
+
++ (BOOL)shouldBeRecycled { return NO; }
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+  if (self = [super initWithFrame:frame]) {
+    _props = std::make_shared<const RNBottomTabsDrawerProps>();
+    Class containerClass = NSClassFromString(@"RCTBottomTabsDrawerContainerView");
+    _drawer = (UIView<RNBottomTabsDrawerContainer> *)[[containerClass alloc] initWithFrame:frame];
+    self.contentView = _drawer;
+    __weak RCTBottomTabsDrawerComponentView *weakSelf = self;
+    _drawer.onDrawerOpenChange = ^(BOOL open) {
+      auto strongSelf = weakSelf;
+      if (!strongSelf) return;
+      auto emitter = std::static_pointer_cast<const RNBottomTabsDrawerEventEmitter>(strongSelf->_eventEmitter);
+      if (emitter) emitter->onDrawerOpenChange({.open = (bool)open});
+    };
+  }
+  return self;
+}
+
+- (void)mountChildComponentView:(UIView<RCTComponentViewProtocol> *)child index:(NSInteger)index
+{
+  [_drawer insertChild:child atIndex:index];
+}
+
+- (void)unmountChildComponentView:(UIView<RCTComponentViewProtocol> *)child index:(NSInteger)index
+{
+  [_drawer removeChildAtIndex:index];
+}
+
+- (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &)oldProps
+{
+  const auto &next = *std::static_pointer_cast<const RNBottomTabsDrawerProps>(props);
+  const auto &previous = *std::static_pointer_cast<const RNBottomTabsDrawerProps>(_props);
+  if (next.enabled != previous.enabled) _drawer.enabled = next.enabled;
+  if (next.open != previous.open) _drawer.open = next.open;
+  if (next.swipeEnabled != previous.swipeEnabled) _drawer.swipeEnabled = next.swipeEnabled;
+  if (next.hapticFeedbackEnabled != previous.hapticFeedbackEnabled)
+    _drawer.hapticFeedbackEnabled = next.hapticFeedbackEnabled;
+  if (next.bottomBarHeight != previous.bottomBarHeight) _drawer.bottomBarHeight = next.bottomBarHeight;
+  [super updateProps:props oldProps:oldProps];
+}
+@end
+
+Class<RCTComponentViewProtocol> RNBottomTabsDrawerCls(void)
+{
+  return RCTBottomTabsDrawerComponentView.class;
+}