@momo-kits/native-kits 0.167.1-duo.14 → 0.167.1-duo.15-debug

package/ios/Layout/ScreenLayout.swift

@@ -110,6 +110,12 @@ extension ScreenLayout {
         let sideInset = max(insets.leading, insets.trailing)
         // narrower strips cannot host a control 12pt from the inner edge
         if sideInset >= DuoMetrics.controlSize + Spacing.M {
+            let edge: SideBarEdge = insets.trailing >= insets.leading ? .right : .left
+            let stripLeft = edge == .right ? width - sideInset : 0
+            // clear of the camera and of the status bar cluster, which grows for calls and Live
+            // Activities; region frames already include the system's margin
+            let occlusion = stripOcclusion(reservedRegions, stripLeft: stripLeft, stripRight: stripLeft + sideInset, windowHeight: height)
+
             var top = insets.top + HeaderMetrics.barHeight + Spacing.M
             if insets.top < HeaderMetrics.statusBarMinInset {
                 // status bar lives in the strip: start under its cluster, as the native bar does
@@ -118,8 +124,11 @@ extension ScreenLayout {
                 } else if height >= DuoMetrics.innerMinHeight {
                     top = DuoMetrics.firstItemTopLandscape
                 } else {
-                    // outer display in landscape: no status bar in the strip
+                    // outer display in landscape: no status bar in the strip, the title row centers
+                    // on the camera when it sits at the top end, otherwise on the back button
                     top = DuoMetrics.edgeInset
+                    let titleCenterY = occlusion.top > top ? occlusion.topCenter : top + DuoMetrics.controlSize / 2
+                    (headerHeight, headerStatusBarHeight) = centeredHeaderGeometry(centerY: titleCenterY)
                 }
 
                 if height > width && width < DuoMetrics.innerMinHeight {
@@ -129,11 +138,6 @@ extension ScreenLayout {
                 }
             }
 
-            let edge: SideBarEdge = insets.trailing >= insets.leading ? .right : .left
-            let stripLeft = edge == .right ? width - sideInset : 0
-            // clear of the camera and of the status bar cluster, which grows for calls and Live
-            // Activities; region frames already include the system's margin
-            let occlusion = stripOcclusion(reservedRegions, stripLeft: stripLeft, stripRight: stripLeft + sideInset, windowHeight: height)
             sideBar = SideBarLayout(
                 edge: edge,
                 width: sideInset,
@@ -159,18 +163,29 @@ extension ScreenLayout {
         )
     }
 
+    /// Bar row centered on a window y, at least iPhoneMinHeight tall and reaching 8pt below
+    /// a side bar control centered there.
+    private static func centeredHeaderGeometry(centerY: CGFloat) -> (CGFloat, CGFloat) {
+        let height = max(HeaderMetrics.iPhoneMinHeight, centerY + DuoMetrics.controlSize / 2 + Spacing.S)
+        return (height, max(0, centerY * 2 - height))
+    }
+
     /// How far system regions reach into a side strip from its top and from its bottom end
-    /// (e.g. the camera, which sits at either end depending on the rotation).
+    /// (e.g. the camera, which sits at either end depending on the rotation), and the center y
+    /// of the region reaching furthest from the top.
     private static func stripOcclusion(
         _ regions: [CGRect],
         stripLeft: CGFloat,
         stripRight: CGFloat,
         windowHeight: CGFloat
-    ) -> (top: CGFloat, bottom: CGFloat) {
-        regions.reduce(into: (top: CGFloat(0), bottom: CGFloat(0))) { occlusion, region in
+    ) -> (top: CGFloat, topCenter: CGFloat, bottom: CGFloat) {
+        regions.reduce(into: (top: CGFloat(0), topCenter: CGFloat(0), bottom: CGFloat(0))) { occlusion, region in
             guard region.minX < stripRight && region.maxX > stripLeft else { return }
             if region.midY < windowHeight / 2 {
-                occlusion.top = max(occlusion.top, region.maxY)
+                if region.maxY > occlusion.top {
+                    occlusion.top = region.maxY
+                    occlusion.topCenter = region.midY
+                }
             } else {
                 occlusion.bottom = max(occlusion.bottom, windowHeight - region.minY)
             }
@@ -204,16 +219,20 @@ public func isIPhoneDuoDevice(windowSize: CGSize? = nil) -> Bool {
 /// System occlusion regions (iOS 27.1+) in window coordinates: the iPhone Duo camera, and the
 /// status bar cluster as it grows for a call or a Live Activity. Empty before iOS 27.1.
 enum ReservedRegions {
-    // last report of the probe, so `ScreenLayout.current` includes it
-    static var current: [CGRect] = []
+    // last report of a probe, so `ScreenLayout.current` includes it
+    private(set) static var current: [CGRect] = []
+    static let didChange = Notification.Name("MoMoUIKitsReservedRegionsDidChange")
+
+    fileprivate static func publish(_ regions: [CGRect]) {
+        guard regions != current else { return }
+        current = regions
+        NotificationCenter.default.post(name: didChange, object: nil)
+    }
 }
 
 /// Invisible probe: reading the regions in layoutSubviews makes UIKit run it again when they
 /// change, so nothing polls. Port of RN `@momo-kits/reserved-regions`.
 private final class ReservedRegionsProbe: UIView {
-    var onChange: (() -> Void)?
-    private var last: [CGRect]?
-
     override init(frame: CGRect) {
         super.init(frame: frame)
         isUserInteractionEnabled = false
@@ -223,12 +242,19 @@ private final class ReservedRegionsProbe: UIView {
 
     override func layoutSubviews() {
         super.layoutSubviews()
+        // read even when not publishing, so UIKit keeps re-running this when they change
         let regions = occlusionRegions()
-        guard regions != last else { return }
-        last = regions
-        ReservedRegions.current = regions
+        // every screen has a probe but the regions are window-wide: one sliding in on a push or
+        // a present, or off the window, would overwrite them with a partial read
+        guard spansWindow else { return }
         // layout pass: publish on the next turn instead of mutating SwiftUI state mid-update
-        DispatchQueue.main.async { [weak self] in self?.onChange?() }
+        DispatchQueue.main.async { ReservedRegions.publish(regions) }
+    }
+
+    private var spansWindow: Bool {
+        guard let window else { return false }
+        let frame = convert(bounds, to: nil)
+        return abs(frame.minX) < 1 && abs(frame.maxX - window.bounds.width) < 1 && abs(frame.minY) < 1
     }
 
     override func didMoveToWindow() {
@@ -250,17 +276,9 @@ private final class ReservedRegionsProbe: UIView {
 }
 
 private struct ReservedRegionsProbeView: UIViewRepresentable {
-    let onChange: () -> Void
+    func makeUIView(context: Context) -> ReservedRegionsProbe { ReservedRegionsProbe() }
 
-    func makeUIView(context: Context) -> ReservedRegionsProbe {
-        let probe = ReservedRegionsProbe()
-        probe.onChange = onChange
-        return probe
-    }
-
-    func updateUIView(_ probe: ReservedRegionsProbe, context: Context) {
-        probe.onChange = onChange
-    }
+    func updateUIView(_ probe: ReservedRegionsProbe, context: Context) {}
 }
 
 // MARK: - Environment
@@ -292,7 +310,11 @@ private struct ScreenLayoutReader: ViewModifier {
                         .onChange(of: proxy.safeAreaInsets) { _ in refresh() }
                 }
             )
-            .background(ReservedRegionsProbeView { refresh() }.ignoresSafeArea())
+            .background(ReservedRegionsProbeView().ignoresSafeArea())
+            // any screen's probe may report, so every reader follows the shared value
+            .onReceive(NotificationCenter.default.publisher(for: ReservedRegions.didChange)) { _ in
+                refresh()
+            }
             .onReceive(NotificationCenter.default.publisher(for: UIDevice.orientationDidChangeNotification)) { _ in
                 refresh()
             }

package/ios/Navigation/StackScreen.swift

@@ -431,13 +431,23 @@ public struct StackScreen<Content: View>: View {
                 // top-aligned: an extended band runs past the bar, under the content
                 .background(alignment: .top) {
                     ZStack(alignment: .top) {
-                        NavigationHeaderBackground(
-                            headerType: headerType,
-                            scrollState: scrollOffset,
-                            headerTransparent: headerTransparent,
-                            fullScreenContent: fullScreenContent,
-                            backgroundColor: backgroundColor
-                        )
+                        if layout.sideBar != nil && inputSearchType != .none && !headerTransparent {
+                            // RN HeaderExtendHeader with search on the side bar layout: the
+                            // gradient fades out within the header box, as without the search
+                            DuoScrollGradient(
+                                scrollOffset: scrollOffset,
+                                headerHeight: layout.headerHeight,
+                                extended: headerType == .extended
+                            )
+                        } else {
+                            NavigationHeaderBackground(
+                                headerType: headerType,
+                                scrollState: scrollOffset,
+                                headerTransparent: headerTransparent,
+                                fullScreenContent: fullScreenContent,
+                                backgroundColor: backgroundColor
+                            )
+                        }
                         HeaderBarBackground(opacity: opacity, transparent: headerTransparent || headerType == .none)
                     }
                     .edgesIgnoringSafeArea([.top, .horizontal])
@@ -688,6 +698,7 @@ public struct NavigationFooter: View {
     }
 
     @Environment(\.appTheme) private var theme
+    @Environment(\.screenLayout) private var layout
 
     /// Read from the window, not from an enclosing `GeometryProxy`: the proxy's bottom
     /// inset grows to the keyboard height while the keyboard is up.
@@ -733,9 +744,10 @@ public struct NavigationFooter: View {
             .padding(.bottom, Self.bottomPadding - (Spacing.S - margin))
             // Compose paints the surface all the way to the bottom of the screen; the
             // footer's own frame stops at the safe area, so only the fill bleeds down.
+            // With side insets (iPhone Duo) it stays inside them, off the side bar.
             .background(
                 (transparent ? Color.clear : theme.colors.background.surface)
-                    .ignoresSafeArea(.container, edges: [.bottom, .horizontal])
+                    .ignoresSafeArea(.container, edges: hasSideInsets ? .bottom : [.bottom, .horizontal])
             )
             .overlay(alignment: .top) {
                 if !transparent { shadow }
@@ -744,6 +756,8 @@ public struct NavigationFooter: View {
         }
     }
 
+    private var hasSideInsets: Bool { layout.insetLeft > 0 || layout.insetRight > 0 }
+
     /// Compose offsets the shadow box by -6dp, so it lands on the content above the
     /// footer rather than on the footer surface itself.
     private var shadow: some View {

package/ios/native-kits.podspec

@@ -1,6 +1,6 @@
 Pod::Spec.new do |s|
   s.name             = 'MoMoUIKits'
-  s.version          = '0.167.1-beta.4'
+  s.version          = '0.167.1-duo.15'
   s.summary          = 'MoMoUIKits for iOS'
   s.homepage         = 'https://momo.vn'
   s.license          = { :type => 'MIT' }

package/ios-demo/MoMoUIKitsDemo.podspec

@@ -1,6 +1,6 @@
 Pod::Spec.new do |s|
   s.name             = 'MoMoUIKitsDemo'
-  s.version          = '0.167.1-beta.4'
+  s.version          = '0.167.1-duo.15'
   s.summary          = 'Demo browser for MoMoUIKits SwiftUI components'
   s.homepage         = 'https://momo.vn'
   s.license          = { :type => 'MIT' }

package/ios-demo/README.md

@@ -0,0 +1,120 @@
+# MoMoUIKitsDemo
+
+SwiftUI demo browser for `MoMoUIKits`.
+
+The package can optionally host a Compose UIKits screen by receiving a
+`UIViewController` factory from the host app. It does not import the KMP
+`shared` module directly.
+
+SwiftUI mode reuses the full demo screen set from
+`sample/iosApp/iosApp/Demo`, including the sample `HomeView` registry and demo
+screens for all currently available components.
+
+## CocoaPods
+
+In the host app `Podfile`, include both local pods:
+
+```ruby
+pod 'MoMoUIKits', :path => '../momo-native-kits/ios/native-kits.podspec'
+pod 'MoMoUIKitsDemo', :path => '../momo-native-kits/ios-demo'
+```
+
+Adjust the relative paths to match the host app checkout.
+
+## Host App Usage
+
+```swift
+import MoMoUIKitsDemo
+import shared
+
+class UIKitsViewController: BaseComposeAppViewController {
+  override func getViewController() -> UIViewController? {
+    let params = self.application.data as? [String: Any]
+
+    return MoMoUIKitsDemoViewControllerFactory.make(
+      context: MoMoUIKitsDemoContext(
+        appId: params?["appId"] as? String ?? "",
+        appCode: params?["code"] as? String ?? "",
+        appName: params?["name"] as? String,
+        appIcon: params?["icon"] as? String ?? ""
+      ),
+      composeViewController: {
+        UIKitsScreenComposeViewControllerKt.UIKitsScreenComposeViewController(
+          params: params
+        )
+      }
+    )
+  }
+
+  override func viewDidDisappear(_ animated: Bool) {
+    super.viewDidDisappear(animated)
+    composeViewController = nil
+  }
+}
+```
+
+If the host does not pass `composeViewController`, the demo opens directly in
+SwiftUI mode.
+
+## Included SwiftUI Demos
+
+The pod includes the sample demo screens for:
+
+- Animated Header
+- Avatar
+- Badge
+- Baseline View
+- Bottom Tab
+- Button
+- Carousel
+- Checkbox
+- Chip
+- Collapse
+- DateTimePicker
+- Divider
+- Header User
+- Icon Button
+- Image
+- Information
+- Input
+- Input DropDown
+- Input Money
+- Input OTP
+- Input Phone Number
+- Input Search
+- Input TextArea
+- Loader
+- Navigation
+- Pagination
+- Popup Display
+- Popup Notify
+- Popup Promotion
+- Progress Info
+- Radio
+- Rating
+- Skeleton
+- Slider
+- SnackBar
+- Stepper
+- Steps
+- Suggest Action
+- Swipe
+- Switch
+- TabView
+- Tag
+- Theme
+- Title
+- Tooltip
+- Typography
+- Uploader
+
+## Validation Notes
+
+Validated locally with:
+
+```sh
+pod ipc spec ios/MoMoUIKits.podspec
+pod ipc spec ios-demo/MoMoUIKitsDemo.podspec
+pod lib lint ios/MoMoUIKits.podspec --allow-warnings --skip-import-validation
+pod lib lint ios-demo/MoMoUIKitsDemo.podspec --allow-warnings --skip-import-validation --include-podspecs=ios/MoMoUIKits.podspec
+```

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@momo-kits/native-kits",
-  "version": "0.167.1-duo.14",
+  "version": "0.167.1-duo.15-debug",
   "private": false,
   "dependeNavigationncies": {},
   "devDependencies": {},

package/settings.gradle.kts

@@ -0,0 +1,64 @@
+import org.gradle.kotlin.dsl.maven
+
+rootProject.name = "momo-native-kits"
+enableFeaturePreview("TYPESAFE_PROJECT_ACCESSORS")
+
+pluginManagement {
+    repositories {
+        google {
+            mavenContent {
+                includeGroupAndSubgroups("androidx")
+                includeGroupAndSubgroups("com.android")
+                includeGroupAndSubgroups("com.google")
+            }
+        }
+        mavenCentral()
+        gradlePluginPortal()
+        maven {
+            url = uri("https://gitlab.mservice.com.vn/api/v4/projects/5400/packages/maven")
+            credentials {username = "download_packages"; password = "gldt-bjDqLpU_sPcHDuXau2ws" }
+        }
+        maven {
+            url = uri("https://artifacts.mservice.com.vn/repository/maven-momo-app/")
+            credentials {
+                username = "viewer"
+                password = "viewer"
+            }
+            isAllowInsecureProtocol = true
+        }
+    }
+}
+
+dependencyResolutionManagement {
+    repositories {
+        google {
+            mavenContent {
+                includeGroupAndSubgroups("androidx")
+                includeGroupAndSubgroups("com.android")
+                includeGroupAndSubgroups("com.google")
+            }
+        }
+        mavenCentral()
+        maven { url = uri("https://maven.pkg.jetbrains.space/public/p/compose/dev") }
+        maven {
+            url = uri("https://gitlab.mservice.com.vn/api/v4/projects/5400/packages/maven")
+            credentials {
+                username = "download_packages";
+                password = "gldt-bjDqLpU_sPcHDuXau2ws"
+            }
+        }
+        maven {
+            url = uri("https://artifacts.mservice.com.vn/repository/maven-momo-app/")
+            credentials {
+                username = "viewer"
+                password = "viewer"
+            }
+            isAllowInsecureProtocol = true
+        }
+    }
+}
+
+include(":compose")
+
+include(":sample:androidApp")
+include(":sample:shared")