react-native-platform-components 0.8.9 → 0.8.10

package/ios/PCConstants.swift

@@ -19,11 +19,47 @@ enum PCConstants {
     /// Minimum row height in selection menu popover (used as baseline)
     static let popoverRowHeightMin: CGFloat = 44
 
-    /// Dynamic row height that respects user's preferred content size
+    /// Horizontal inset applied to each side of a menu row's label
+    static let popoverRowHorizontalInset: CGFloat = 16
+
+    /// Vertical padding added to each menu row's text (top + bottom combined)
+    static let popoverRowVerticalPadding: CGFloat = 16
+
+    /// Estimated single-line row height that respects the user's preferred
+    /// content size. Used only as a table-view estimate; actual rows self-size.
     static var popoverRowHeight: CGFloat {
         let bodyFont = UIFont.preferredFont(forTextStyle: .body)
-        // Row height = font line height + vertical padding (16pt total)
-        return max(popoverRowHeightMin, ceil(bodyFont.lineHeight) + 16)
+        return max(popoverRowHeightMin, ceil(bodyFont.lineHeight) + popoverRowVerticalPadding)
+    }
+
+    /// Measured height of a single menu row for the given label and content
+    /// width, accounting for multi-line wrapping at the current Dynamic Type
+    /// size. Mirrors the Auto Layout sizing of `PCGlassMenuCell` so the popover
+    /// container can be sized to fit its content.
+    static func popoverRowHeight(forLabel label: String, width: CGFloat) -> CGFloat {
+        let bodyFont = UIFont.preferredFont(forTextStyle: .body)
+        let textWidth = max(1, width - popoverRowHorizontalInset * 2)
+        let bounding = (label as NSString).boundingRect(
+            with: CGSize(width: textWidth, height: .greatestFiniteMagnitude),
+            options: [.usesLineFragmentOrigin, .usesFontLeading],
+            attributes: [.font: bodyFont],
+            context: nil
+        )
+        return max(popoverRowHeightMin, ceil(bounding.height) + popoverRowVerticalPadding)
+    }
+
+    /// Adaptive popover width. Widens for accessibility content size categories
+    /// so long labels wrap less aggressively (mirrors system menu behavior).
+    /// The caller is responsible for clamping to the available screen width.
+    static func popoverWidth(forCategory category: UIContentSizeCategory) -> CGFloat {
+        guard category.isAccessibilityCategory else { return popoverWidth }
+        switch category {
+        case .accessibilityMedium: return 300
+        case .accessibilityLarge: return 320
+        case .accessibilityExtraLarge: return 340
+        case .accessibilityExtraExtraLarge: return 360
+        default: return 380 // accessibilityExtraExtraExtraLarge and beyond
+        }
     }
 
     /// Vertical padding in selection menu popover (top + bottom)

package/ios/PCSelectionMenu.swift

@@ -277,33 +277,53 @@ public final class PCSelectionMenuView: UIControl {
             // Calculate menu position relative to source view
             let sourceFrame = self.convert(self.bounds, to: vc.view)
             let screenBounds = vc.view.bounds
-            let popoverHeight = min(
-                CGFloat(opts.count) * PCConstants.popoverRowHeight + PCConstants.popoverVerticalPadding,
-                PCConstants.popoverMaxHeight
-            )
             let spacing: CGFloat = 8
 
+            // Adaptive width (wider at accessibility sizes), clamped to the screen.
+            let category = self.traitCollection.preferredContentSizeCategory
+            let menuWidth = min(
+                PCConstants.popoverWidth(forCategory: category),
+                screenBounds.width - 32
+            )
+
+            // Measure the real (possibly multi-line) content height so the
+            // container fits its rows instead of clipping or leaving gaps.
+            let contentHeight = opts.reduce(PCConstants.popoverVerticalPadding) { partial, opt in
+                partial + PCConstants.popoverRowHeight(forLabel: opt.label, width: menuWidth)
+            }
+            // Allow taller menus at accessibility sizes; otherwise keep them compact.
+            let maxHeight = category.isAccessibilityCategory
+                ? max(PCConstants.popoverMaxHeight, screenBounds.height - 120)
+                : PCConstants.popoverMaxHeight
+            let popoverHeight = min(contentHeight, maxHeight)
+
             // Check if menu fits below the source view
-            let rowHeight = PCConstants.popoverRowHeight
+            let firstRowHeight = PCConstants.popoverRowHeight(forLabel: opts[0].label, width: menuWidth)
             let wouldExtendBeyondBottom = sourceFrame.maxY + spacing + popoverHeight > screenBounds.maxY - 20
 
-            let menuY: CGFloat
+            var menuY: CGFloat
             if wouldExtendBeyondBottom {
                 // Position above the source view (no overlap offset)
                 menuY = sourceFrame.minY - spacing - popoverHeight
             } else {
                 // Position below, but shift up by one row to overlap trigger (like system menu)
-                menuY = sourceFrame.maxY + spacing - rowHeight
+                menuY = sourceFrame.maxY + spacing - firstRowHeight
             }
 
+            // Keep the menu fully on screen vertically (tall menus at large
+            // Dynamic Type sizes can otherwise run off the top or bottom).
+            let topMargin = vc.view.safeAreaInsets.top + spacing
+            let bottomLimit = screenBounds.maxY - vc.view.safeAreaInsets.bottom - spacing - popoverHeight
+            menuY = min(max(menuY, topMargin), max(topMargin, bottomLimit))
+
             // Center horizontally, but keep within screen bounds
-            var menuX = sourceFrame.midX - PCConstants.popoverWidth / 2
-            menuX = max(16, min(menuX, screenBounds.maxX - PCConstants.popoverWidth - 16))
+            var menuX = sourceFrame.midX - menuWidth / 2
+            menuX = max(16, min(menuX, screenBounds.maxX - menuWidth - 16))
 
             let menuFrame = CGRect(
                 x: menuX,
                 y: menuY,
-                width: PCConstants.popoverWidth,
+                width: menuWidth,
                 height: popoverHeight
             )
 
@@ -365,6 +385,11 @@ public final class PCSelectionMenuView: UIControl {
 private class PCGlassMenuCell: UITableViewCell {
     static let reuseIdentifier = "PCGlassMenuCell"
 
+    /// Custom multi-line label. We avoid the legacy `textLabel` because it
+    /// defaults to a single line and does not drive self-sizing reliably, which
+    /// caused rows to overlap at large Dynamic Type sizes.
+    let menuLabel = UILabel()
+
     override init(style: UITableViewCell.CellStyle, reuseIdentifier: String?) {
         super.init(style: style, reuseIdentifier: reuseIdentifier)
         setupCell()
@@ -379,8 +404,26 @@ private class PCGlassMenuCell: UITableViewCell {
         backgroundColor = .clear
         contentView.backgroundColor = .clear
         selectionStyle = .none
-        textLabel?.font = .preferredFont(forTextStyle: .body)
-        textLabel?.adjustsFontForContentSizeCategory = true
+
+        menuLabel.font = .preferredFont(forTextStyle: .body)
+        menuLabel.adjustsFontForContentSizeCategory = true
+        menuLabel.numberOfLines = 0
+        menuLabel.translatesAutoresizingMaskIntoConstraints = false
+        contentView.addSubview(menuLabel)
+
+        let v = PCConstants.popoverRowVerticalPadding / 2
+        let h = PCConstants.popoverRowHorizontalInset
+        // Center the label and let it grow the row vertically. The min-height
+        // constraint guarantees the 44pt touch target for short labels, while
+        // the >= top / <= bottom pair lets tall (wrapped) labels expand the row.
+        NSLayoutConstraint.activate([
+            menuLabel.topAnchor.constraint(greaterThanOrEqualTo: contentView.topAnchor, constant: v),
+            menuLabel.bottomAnchor.constraint(lessThanOrEqualTo: contentView.bottomAnchor, constant: -v),
+            menuLabel.centerYAnchor.constraint(equalTo: contentView.centerYAnchor),
+            menuLabel.leadingAnchor.constraint(equalTo: contentView.leadingAnchor, constant: h),
+            menuLabel.trailingAnchor.constraint(equalTo: contentView.trailingAnchor, constant: -h),
+            contentView.heightAnchor.constraint(greaterThanOrEqualToConstant: PCConstants.popoverRowHeightMin),
+        ])
     }
 }
 
@@ -451,7 +494,10 @@ private class PCMenuViewController: UIViewController, UITableViewDelegate, UITab
         tableView.backgroundColor = .clear
         tableView.separatorStyle = .none
         tableView.isScrollEnabled = true
-        tableView.rowHeight = PCConstants.popoverRowHeight
+        // Self-sizing rows so labels that wrap at large Dynamic Type sizes get
+        // the height they need instead of overlapping a fixed-height row.
+        tableView.rowHeight = UITableView.automaticDimension
+        tableView.estimatedRowHeight = PCConstants.popoverRowHeight
         tableView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
         let verticalPad = PCConstants.popoverVerticalPadding / 2
         tableView.contentInset = UIEdgeInsets(top: verticalPad, left: 0, bottom: verticalPad, right: 0)
@@ -479,7 +525,7 @@ private class PCMenuViewController: UIViewController, UITableViewDelegate, UITab
 
     func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
         let cell = tableView.dequeueReusableCell(withIdentifier: PCGlassMenuCell.reuseIdentifier, for: indexPath)
-        cell.textLabel?.text = options[indexPath.row].label
+        (cell as? PCGlassMenuCell)?.menuLabel.text = options[indexPath.row].label
         return cell
     }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-platform-components",
-  "version": "0.8.9",
+  "version": "0.8.10",
   "description": "Native UI components for React Native: DatePicker, ContextMenu, SelectionMenu, SegmentedControl, LiquidGlass.",
   "main": "./lib/commonjs/index.js",
   "module": "./lib/module/index.js",
@@ -110,15 +110,16 @@
     "@eslint/compat": "^2.0.1",
     "@eslint/eslintrc": "^3.3.3",
     "@eslint/js": "^9.39.2",
-    "@expo/config-plugins": "^54.0.4",
-    "@react-native-community/cli": "20.1.0",
-    "@react-native/babel-preset": "0.83.1",
-    "@react-native/eslint-config": "^0.83.1",
+    "@expo/config-plugins": "^56.0.8",
+    "@react-native-community/cli": "20.1.3",
+    "@react-native/babel-preset": "0.85.3",
+    "@react-native/eslint-config": "^0.85.3",
+    "@react-native/jest-preset": "0.85.3",
     "@release-it/conventional-changelog": "^10.0.4",
     "@types/jest": "^30.0.0",
     "@types/react": "^19.2.9",
     "@types/react-test-renderer": "^19.1.0",
-    "babel-preset-expo": "^54.0.10",
+    "babel-preset-expo": "^56.0.14",
     "commitlint": "^20.3.1",
     "del-cli": "^7.0.0",
     "eslint": "^9.39.2",
@@ -128,7 +129,7 @@
     "lefthook": "^2.0.15",
     "prettier": "^3.8.1",
     "react": "19.2.3",
-    "react-native": "0.83.1",
+    "react-native": "0.85.3",
     "react-native-builder-bob": "^0.40.17",
     "react-test-renderer": "19.2.3",
     "release-it": "^19.2.4",
@@ -218,7 +219,7 @@
     }
   },
   "jest": {
-    "preset": "react-native",
+    "preset": "@react-native/jest-preset",
     "modulePathIgnorePatterns": [
       "<rootDir>/example/node_modules",
       "<rootDir>/lib/"