@momo-kits/native-kits 0.167.1-duo.21 → 0.167.1-duo.22-debug

package/ios/Navigation/BottomSheet.swift

@@ -36,6 +36,7 @@ public struct BottomSheetHeader {
 // MARK: - Bottom sheet view
 
 struct BottomSheetView<Content: View>: View {
+    let overplayId: UUID
     let header: BottomSheetHeader
     let isSurface: Bool
     let barrierDismissible: Bool
@@ -56,6 +57,7 @@ struct BottomSheetView<Content: View>: View {
     @State private var backgroundAlpha: CGFloat = 0
     @State private var sheetHeight: CGFloat = 0
     @State private var didAppear = false
+    @State private var isClosing = false
     @State private var keyboardHeight: CGFloat = 0
     /// Live drag offset, isolated from `sheetOffset` so a touch-move only invalidates
     /// this gesture-scoped value instead of forcing the whole body (including
@@ -95,7 +97,6 @@ struct BottomSheetView<Content: View>: View {
         isDuo && !isDuoCentered && layout.width > layout.height ? layout.insets.trailing : 0
     }
 
-    /// The keyboard filler is part of the sheet, so capping the sheet shrinks the content by it.
     private var maxHeight: CGFloat {
         isDuo ? layout.height - max(layout.duoTopInset, Spacing.XL) : screenHeight - 90
     }
@@ -160,43 +161,47 @@ struct BottomSheetView<Content: View>: View {
 
     private var sheet: some View {
         VStack(spacing: 0) {
-            // Drag handle + header (the draggable region).
             VStack(spacing: 0) {
-                Spacer().frame(height: 8)
-                Capsule()
-                    .fill(Colors.black06)
-                    .frame(width: 40, height: 4)
-                Spacer().frame(height: 4)
-                headerView
-                    .frame(height: 56)
-                    .padding(.horizontal, Spacing.M)
+                // Drag handle + header (the draggable region).
+                VStack(spacing: 0) {
+                    Spacer().frame(height: 8)
+                    Capsule()
+                        .fill(Colors.black06)
+                        .frame(width: 40, height: 4)
+                    Spacer().frame(height: 4)
+                    headerView
+                        .frame(height: 56)
+                        .padding(.horizontal, Spacing.M)
+                        .padding(.leading, sideInsetLeading)
+                        .padding(.trailing, sideInsetTrailing)
+                }
+                .frame(maxWidth: .infinity)
+                .frame(height: 72)
+                .contentShape(Rectangle())
+                .gesture(dragGesture, including: draggable ? .all : .subviews)
+
+                Rectangle()
+                    .fill(theme.colors.border.default)
+                    .frame(height: 1)
+
+                content()
                     .padding(.leading, sideInsetLeading)
                     .padding(.trailing, sideInsetTrailing)
+                    // a tall sheet keeps its header (and footer) and gives the content what is left
+                    .layoutPriority(-1)
+
+                if let footer {
+                    BottomSheetFooter(content: footer)
+                }
             }
-            .frame(maxWidth: .infinity)
-            .frame(height: 72)
-            .contentShape(Rectangle())
-            .gesture(dragGesture, including: draggable ? .all : .subviews)
-
-            Rectangle()
-                .fill(theme.colors.border.default)
-                .frame(height: 1)
-
-            content()
-                .padding(.leading, sideInsetLeading)
-                .padding(.trailing, sideInsetTrailing)
-                // a tall sheet keeps its header (and footer) and gives the content what is left
-                .layoutPriority(-1)
-
-            if let footer {
-                BottomSheetFooter(content: footer)
-            }
+            // The filler stays outside the cap, which shrinks by it instead: the sheet still ends at
+            // `maxHeight`, and the iOS 15 fallback never measures the keyboard as content.
+            .modifier(CapHeight(maxHeight: maxHeight - effectiveBottomInset))
 
             (footer != nil ? theme.colors.background.surface : backgroundColor)
                 .frame(height: effectiveBottomInset)
         }
         .frame(maxWidth: isDuoCentered ? duoCenteredWidth : .infinity)
-        .modifier(CapHeight(maxHeight: maxHeight))
         .clipped()
         .background(
             GeometryReader { geo in
@@ -241,14 +246,16 @@ struct BottomSheetView<Content: View>: View {
                 // same bottom-anchored top edge — is still in flight doesn't fight a
                 // moving target. Without this, the live drag value chases an animated
                 // one, producing a couple of corrective jumps before it settles.
-                if sheetOffset != 0 {
+                // A closing sheet keeps going down.
+                if sheetOffset != 0 && !isClosing {
                     sheetOffset = 0
                 }
             }
             .updating($dragTranslation) { value, state, _ in
-                state = max(value.translation.height, 0)
+                state = isClosing ? 0 : max(value.translation.height, 0)
             }
             .onEnded { value in
+                guard !isClosing else { return }
                 let finalOffset = max(value.translation.height, 0)
                 // Capture into persisted state BEFORE @GestureState resets to 0,
                 // avoiding a one-frame snap back to rest before close()'s own
@@ -276,6 +283,8 @@ struct BottomSheetView<Content: View>: View {
     /// Mirrors Compose's `closeEvent`: slide out over 200ms, then fade the scrim
     /// out over 100ms only after the slide finishes, then dismiss.
     private func close() {
+        guard !isClosing else { return }
+        isClosing = true
         withAnimation(.timingCurve(0.3, 0, 0.8, 0.15, duration: 0.2)) {
             sheetOffset = max(sheetHeight, screenHeight)
         }
@@ -285,7 +294,7 @@ struct BottomSheetView<Content: View>: View {
             }
         }
         DispatchQueue.main.asyncAfter(deadline: .now() + 0.3) {
-            navigator.finishOverplayDismiss()
+            navigator.finishOverplayDismiss(id: overplayId)
         }
     }
 }
@@ -306,10 +315,12 @@ private struct CapHeight: ViewModifier {
 }
 
 /// iOS 15 has no `Layout`: the sheet hugs its ideal height until that outgrows the cap, then is
-/// held at the cap (the ideal height can't be read again without a second copy of the content).
+/// held at the cap. A capped sheet can't read its ideal height (that needs a second copy of the
+/// content), so it is re-measured only when the cap grows, e.g. once the keyboard goes down.
 private struct CapHeightFallback: ViewModifier {
     let maxHeight: CGFloat
     @State private var capped = false
+    @State private var idealHeight: CGFloat = 0
 
     func body(content: Content) -> some View {
         content
@@ -318,15 +329,25 @@ private struct CapHeightFallback: ViewModifier {
             .background(
                 GeometryReader { proxy in
                     Color.clear
-                        .onAppear { cap(proxy.size.height) }
-                        .onChange(of: proxy.size.height) { cap($0) }
+                        .onAppear { measure(proxy.size.height) }
+                        .onChange(of: proxy.size.height) { measure($0) }
                 }
             )
             .frame(height: capped ? maxHeight : nil, alignment: .top)
+            .onChange(of: maxHeight) { cap in
+                if capped {
+                    // the ideal height was over the old cap, so only a taller cap can release it
+                    if cap > idealHeight { capped = false }
+                } else if idealHeight > cap {
+                    capped = true
+                }
+            }
     }
 
-    private func cap(_ height: CGFloat) {
-        if !capped, height > maxHeight { capped = true }
+    private func measure(_ height: CGFloat) {
+        guard !capped else { return }
+        idealHeight = height
+        if height > maxHeight { capped = true }
     }
 }
 

package/ios/Navigation/BottomTab/BottomTab.swift

@@ -8,11 +8,14 @@
 //
 
 import SwiftUI
+import UIKit
 
 public struct BottomTab: View {
     private let items: [BottomTabItem]
     private let floatingButton: BottomTabFloatingButton?
     private let compressionBehavior: DuoBarCompressionBehavior
+    private let onTabPress: ((_ index: Int, _ switchTab: @escaping () -> Void) -> Void)?
+    private let backToInitialTab: Bool
 
     @EnvironmentObject private var navigator: Navigator
     /// The screen hosting the tabs (Compose's `LocalNavigation` in BottomTab).
@@ -20,21 +23,33 @@ public struct BottomTab: View {
     @Environment(\.screenLayout) private var layout
     @Environment(\.appTheme) private var theme
     @StateObject private var tabNavigations = TabNavigations()
-    @State private var selectedIndex: Int = 0
+    /// Compose's `startRoute`: picked once from `initialRouteName`.
+    @State private var startIndex: Int
+    @State private var selectedIndex: Int
     @State private var toolbarHeight = DuoBarCompression.defaultToolbarHeight
     @State private var expandedBar: DuoBar?
     @State private var openedBar: DuoBar?
 
     /// `compressionBehavior`: on iPhone Duo, when the side bar can't hold both bars, which one
     /// starts compressed; tapping the compressed one swaps them.
+    /// `onTabPress` gets every tab press with the switch to perform, e.g. after a login gate.
+    /// `backToInitialTab`: back off another tab returns to the initial one before leaving the screen.
     public init(
         items: [BottomTabItem],
         floatingButton: BottomTabFloatingButton? = nil,
-        compressionBehavior: DuoBarCompressionBehavior = .toolbar
+        compressionBehavior: DuoBarCompressionBehavior = .toolbar,
+        initialRouteName: String? = nil,
+        onTabPress: ((_ index: Int, _ switchTab: @escaping () -> Void) -> Void)? = nil,
+        backToInitialTab: Bool = true
     ) {
         self.items = items
         self.floatingButton = floatingButton
         self.compressionBehavior = compressionBehavior
+        self.onTabPress = onTabPress
+        self.backToInitialTab = backToInitialTab
+        let start = items.firstIndex { $0.name == initialRouteName } ?? 0
+        _startIndex = State(initialValue: start)
+        _selectedIndex = State(initialValue: start)
     }
 
     private var bottomInset: CGFloat { safeAreaBottomInset() }
@@ -73,18 +88,12 @@ public struct BottomTab: View {
         let compression = compression
         ZStack(alignment: .bottom) {
             // Tab content area, inset above the bar.
-            ZStack {
-                ForEach(items.indices, id: \.self) { index in
-                    if index == selectedIndex {
-                        tabScreen(for: index)
-                            .transition(.scale(scale: 0.97).combined(with: .opacity))
-                    }
-                }
-            }
-            .padding(.bottom, reservedBottom)
-            .environment(\.duoTabBarInsets, duoInsets(compression))
-            .environment(\.duoBarCompression, compression)
-            .animation(.easeInOut(duration: 0.2), value: selectedIndex)
+            TabHost(selectedIndex: selectedIndex, count: items.count) { index in AnyView(tabScreen(for: index)) }
+                // each tab hosts itself, so it needs the window's safe area to draw its header under the status bar
+                .ignoresSafeArea(.container, edges: [.top, .horizontal])
+                .padding(.bottom, reservedBottom)
+                .environment(\.duoTabBarInsets, duoInsets(compression))
+                .environment(\.duoBarCompression, compression)
 
             if layout.isIPhoneDuo {
                 DuoTabBar(
@@ -128,14 +137,15 @@ public struct BottomTab: View {
     }
 
     private func selectTab(_ index: Int) {
-        if index != selectedIndex { selectedIndex = index }
+        let switchTab = { if index != selectedIndex { selectedIndex = index } }
+        if let onTabPress { onTabPress(index, switchTab) } else { switchTab() }
     }
 
-    /// Back off the first tab returns to it; the host shows its floating arrow there (RN parity).
+    /// Back off the initial tab returns to it; the host shows its floating arrow there (RN parity).
     private func updateTabBack() {
-        let isFirstTab = selectedIndex == 0
+        let isFirstTab = selectedIndex == startIndex || !backToInitialTab
         HostBackGestureBridge.shared.shouldUseFloatingArrowBack = !isFirstTab
-        navigator.tabBackHandler = isFirstTab ? nil : (hostNavigation?.id ?? -1, { selectedIndex = 0 })
+        navigator.tabBackHandler = isFirstTab ? nil : (hostNavigation?.id ?? -1, { selectedIndex = startIndex })
     }
 
     private func tabScreen(for index: Int) -> some View {
@@ -176,6 +186,143 @@ private struct TabScreenHost: View {
     }
 }
 
+// MARK: - Tab host
+
+/// Compose's tab NavHost with `saveState` / `restoreState`. A tab gets its own UIHostingController
+/// on first selection and keeps it, so its state and scroll survive a switch; while hidden it is
+/// out of the window, so it gets onDisappear / onAppear (and re-runs screen tracking) like a NavHost
+/// destination or a UITabBarController tab. Same scheme as `StackController`.
+private struct TabHost: UIViewControllerRepresentable {
+    let selectedIndex: Int
+    let count: Int
+    let content: (Int) -> AnyView
+
+    func makeUIViewController(context: Context) -> TabController {
+        TabController()
+    }
+
+    func updateUIViewController(_ controller: TabController, context: Context) {
+        controller.update(selectedIndex: selectedIndex, count: count, environment: context.environment, content: content)
+    }
+}
+
+private final class TabController: UIViewController {
+    private final class Tab {
+        let motion = TabMotion()
+        var host: UIHostingController<AnyView>!
+    }
+
+    private static let switchDuration: TimeInterval = 0.2
+
+    private var tabs: [Int: Tab] = [:]
+    private var selectedIndex: Int?
+    private var environment = EnvironmentValues()
+    private var content: (Int) -> AnyView = { _ in AnyView(EmptyView()) }
+
+    override func viewDidLoad() {
+        super.viewDidLoad()
+        view.backgroundColor = .clear
+    }
+
+    override func viewDidLayoutSubviews() {
+        super.viewDidLayoutSubviews()
+        for subview in view.subviews { subview.frame = view.bounds }
+    }
+
+    func update(
+        selectedIndex index: Int,
+        count: Int,
+        environment: EnvironmentValues,
+        content: @escaping (Int) -> AnyView
+    ) {
+        self.environment = environment
+        self.content = content
+        for (stale, removed) in tabs where stale >= count {
+            tabs[stale] = nil
+            tearDown(removed)
+        }
+        if let selectedIndex, tabs[selectedIndex] == nil { self.selectedIndex = nil }
+        // hidden tabs too, so a tab coming back already shows the latest items and environment
+        for (tabIndex, existing) in tabs { existing.host.rootView = rootView(tabIndex, existing) }
+        guard (0..<count).contains(index), index != selectedIndex else { return }
+
+        let previous = selectedIndex.flatMap { tabs[$0] }
+        selectedIndex = index
+        let selected = tabs[index] ?? makeTab(index)
+        attach(selected)
+
+        guard let previous, view.window != nil else {
+            selected.motion.visible = true
+            previous.map(leave)
+            return
+        }
+        previous.host.view.isUserInteractionEnabled = false
+        // a frame at the start values first, so a tab created just now fades in too
+        DispatchQueue.main.async {
+            selected.motion.visible = true
+            previous.motion.visible = false
+        }
+        DispatchQueue.main.asyncAfter(deadline: .now() + Self.switchDuration) { [weak self] in
+            self?.leave(previous)
+        }
+    }
+
+    private func makeTab(_ index: Int) -> Tab {
+        let tab = Tab()
+        let host = UIHostingController(rootView: rootView(index, tab))
+        host.view.backgroundColor = .clear
+        addChild(host)
+        host.didMove(toParent: self)
+        tab.host = host
+        tabs[index] = tab
+        return tab
+    }
+
+    private func rootView(_ index: Int, _ tab: Tab) -> AnyView {
+        AnyView(TabCard(motion: tab.motion, content: content(index)).environment(\.self, environment))
+    }
+
+    private func attach(_ tab: Tab) {
+        let hostView: UIView = tab.host.view
+        hostView.isUserInteractionEnabled = true
+        hostView.frame = view.bounds
+        if hostView.superview === view {
+            view.bringSubviewToFront(hostView)
+        } else {
+            view.addSubview(hostView)
+        }
+    }
+
+    /// Off the window once hidden; a tab selected again in the meantime stays.
+    private func leave(_ tab: Tab) {
+        guard selectedIndex.flatMap({ tabs[$0] }) !== tab else { return }
+        tab.host.view.removeFromSuperview()
+    }
+
+    private func tearDown(_ tab: Tab) {
+        tab.host.willMove(toParent: nil)
+        tab.host.view.removeFromSuperview()
+        tab.host.removeFromParent()
+    }
+}
+
+private final class TabMotion: ObservableObject {
+    @Published var visible = false
+}
+
+/// The tab switch: 0.97 scale + fade over 200ms, both ways (Compose's tab enter / exit transitions).
+private struct TabCard: View {
+    @ObservedObject var motion: TabMotion
+    let content: AnyView
+
+    var body: some View {
+        content
+            .opacity(motion.visible ? 1 : 0)
+            .scaleEffect(motion.visible ? 1 : 0.97)
+            .animation(.easeInOut(duration: 0.2), value: motion.visible)
+    }
+}
+
 /// Bottom safe-area inset (home indicator).
 private func safeAreaBottomInset() -> CGFloat {
     let bottomInset = UIApplication.shared.connectedScenes

package/ios/Navigation/BottomTab/BottomTabBar.swift

@@ -20,6 +20,7 @@ public struct BottomTabItem: Identifiable {
     public let showDot: Bool
     public let badgeLabel: String?
     public let options: NavigationOptions?
+    public let initialParams: Any?
     public let screen: () -> AnyView
 
     public init(
@@ -29,6 +30,7 @@ public struct BottomTabItem: Identifiable {
         showDot: Bool = false,
         badgeLabel: String? = nil,
         options: NavigationOptions? = nil,
+        initialParams: Any? = nil,
         @ViewBuilder screen: @escaping () -> some View
     ) {
         self.name = name
@@ -37,6 +39,7 @@ public struct BottomTabItem: Identifiable {
         self.showDot = showDot
         self.badgeLabel = badgeLabel
         self.options = options
+        self.initialParams = initialParams
         self.screen = { AnyView(screen()) }
     }
 }

package/ios/Navigation/Component/FloatingButton.swift

@@ -7,7 +7,6 @@
 //
 
 import SwiftUI
-import Combine
 
 public enum FABSize {
     case small
@@ -66,14 +65,10 @@ public struct FabProps {
 }
 
 public struct FloatingButton: View {
+    @State private var isExpanded: Bool = true
     @State private var lastScrollOffset: CGFloat = 0
-    @State private var isExpanded: Bool = false
-    @State private var internalScrollOffset: CGFloat = 0
-    @State private var showText: Bool = true
-    @State private var fullWidth: CGFloat? = nil
-    @State private var currentWidth: CGFloat = 0
-    @State private var lastDirection: String? = nil
-    
+    @State private var settleScroll: Task<Void, Never>?
+
     private let props: FabProps
     private var keyboardOffset: CGFloat
     private var scrollOffset: CGFloat
@@ -129,57 +124,40 @@ public struct FloatingButton: View {
         .onTapGesture {
             onClick?()
         }
+        .accessibilityElement(children: .combine)
+        .accessibilityAddTraits(.isButton)
         .padding(.bottom, bottomPadding)
         .frame(alignment: position == .center ? .center : .trailing)
-        .onAppear {
-            internalScrollOffset = scrollOffset
-            isExpanded = label != nil
-        }
-        .onReceive(Just(scrollOffset)) { newValue in
-            let direction = newValue > internalScrollOffset ? "down" : "up"
+        .onAppear { lastScrollOffset = scrollOffset }
+        .onChange(of: scrollOffset, perform: updateExpanded)
+        .onDisappear { settleScroll?.cancel() }
+    }
 
-            if direction != lastDirection {
-                lastDirection = direction
-                if direction == "down" {
-                    withAnimation(.easeOut(duration: 0.1)) {
-                        isExpanded = false
-                    }
-                    DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {
-                        showText = false
-                    }
-                } else {
-                    showText = true
-                    withAnimation(.easeIn(duration: 0.1)) {
-                        isExpanded = true
-                    }
-                    
-                }
-            }
+    /// Compose's `collectLatest { isExpanded = new <= last; delay(100); last = new }`: the label
+    /// shows while the content scrolls back up, and the reference only moves once the scroll pauses.
+    private func updateExpanded(_ offset: CGFloat) {
+        let expanded = offset <= lastScrollOffset
+        if expanded != isExpanded {
+            withAnimation(.linear(duration: 0.1)) { isExpanded = expanded }
+        }
+        settleScroll?.cancel()
+        settleScroll = Task { @MainActor in
+            try? await Task.sleep(nanoseconds: 100_000_000)
+            guard !Task.isCancelled else { return }
+            lastScrollOffset = offset
         }
     }
-    
+
     private var content: some View {
         HStack(spacing: 0) {
-            ImageView(icon ?? "")
-                .scaledToFit()
-                .frame(width: iconSize, height: iconSize)
-                .foregroundColor(iconColor)
-            
-            if let label = label {
-                if showText {
-                    Spacer().frame(width: 8)
-                    MomoText(label, typography: .actionDefaultBold, color: .white, maxLines: 1)
-                        .background(
-                            GeometryReader { geo in
-                                Color.clear.onAppear {
-                                    fullWidth = geo.size.width
-                                }
-                            }
-                        )
-                        .opacity(isExpanded ? 1 : 0)
-                }
-            }
+            // Compose `Icon`: an icon key or an https URL, tinted
+            Icon(source: icon ?? "", size: iconSize ?? defaultIconSize, color: iconColor)
 
+            if let label, isExpanded {
+                MomoText(label, typography: .actionDefaultBold, color: .white, maxLines: 1)
+                    .padding(.leading, 12)
+                    .transition(.opacity.combined(with: .move(edge: .leading)))
+            }
         }
     }
 }

package/ios/Navigation/Component/Header.swift

@@ -273,11 +273,18 @@ public struct HeaderRightWidthKey: PreferenceKey {
 }
 
 /// Compose `SearchAnimated`: a header search fills from surface to the screen background over
-/// the scroll that lifts it into the bar.
-func headerSearchProps(_ props: InputSearchProps, scroll: CGFloat, layout: ScreenLayout, theme: Theme) -> InputSearchProps {
-    guard props.backgroundColor == nil else { return props }
-    let collapsedTop = max(layout.headerStatusBarHeight + (layout.headerBarHeight - HEADER_HEIGHT) / 2, 1)
+/// the scroll that lifts it into the bar, and its button text pops the screen.
+func headerSearchProps(
+    _ props: InputSearchProps,
+    scroll: CGFloat,
+    layout: ScreenLayout,
+    theme: Theme,
+    pop: (() -> Void)?
+) -> InputSearchProps {
     var themed = props
+    if !props.hasButtonTextAction, let pop { themed.onPressButtonText = pop }
+    guard props.backgroundColor == nil else { return themed }
+    let collapsedTop = max(layout.headerStatusBarHeight + (layout.headerBarHeight - HEADER_HEIGHT) / 2, 1)
     themed.backgroundColor = theme.colors.background.surface
         .lerp(to: theme.colors.background.default, max(scroll, 0) / collapsedTop)
     return themed
@@ -338,6 +345,7 @@ public struct NavigationHeader: View {
 
     @Environment(\.screenLayout) private var layout
     @Environment(\.appTheme) private var theme
+    @OptionalEnvironmentObject private var navigator: Navigator?
     @State private var headerRightWidth: CGFloat = 0
 
     /// iPhone Duo side bar holds back and the toolkit; a custom header right stays in the bar.
@@ -437,7 +445,13 @@ public struct NavigationHeader: View {
     @ViewBuilder
     private func titleArea(centered: Bool) -> some View {
         if let inputSearchProps {
-            InputSearch(props: headerSearchProps(inputSearchProps, scroll: scrollState, layout: layout, theme: theme))
+            InputSearch(props: headerSearchProps(
+                inputSearchProps,
+                scroll: scrollState,
+                layout: layout,
+                theme: theme,
+                pop: navigator.map { navigator in { navigator.pop() } }
+            ))
         } else {
             switch headerTitle {
             case let .user(data)?: