@onekeyfe/react-native-native-list 6.7.0-alpha.378 → 6.7.0-alpha.382

package/ios/NativeListAccessoryStack.swift

@@ -3,12 +3,72 @@ import UIKit
 // OneKey patch: explicit summary actions use the source text's physical-pixel line box.
 final class NativeListAccessoryButton: UIButton {
   var pressedBackgroundColor: UIColor?
+  var normalBackgroundColor: UIColor = .clear
+  var fixedTextLineHeight: CGFloat?
   var rowTextOffsetY: CGFloat = 0
+  var helpBindingGeneration = 0
+  private var helpTrackingGeneration = 0
+  override func beginTracking(_ touch: UITouch, with event: UIEvent?) -> Bool {
+    helpTrackingGeneration = helpBindingGeneration
+    return super.beginTracking(touch, with: event)
+  }
+  override func endTracking(_ touch: UITouch?, with event: UIEvent?) {
+    guard helpTrackingGeneration == helpBindingGeneration else {
+      cancelTracking(with: event)
+      return
+    }
+    super.endTracking(touch, with: event)
+  }
+  var helpPrimaryLineOnly = false
+  var showsHelpUnderline = false
+  let helpAnchor = UIView()
+  private let helpUnderline = CAShapeLayer()
+
+  override func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
+    if helpPrimaryLineOnly { return helpAnchor.frame.contains(point) }
+    return super.point(inside: point, with: event)
+  }
+
+  private func layoutHelp() {
+    guard helpPrimaryLineOnly || showsHelpUnderline else {
+      helpUnderline.isHidden = true
+      return
+    }
+    guard let titleLabel else { return }
+    if helpAnchor.superview == nil {
+      helpAnchor.isUserInteractionEnabled = false
+      helpAnchor.isAccessibilityElement = false
+      addSubview(helpAnchor)
+      helpUnderline.fillColor = UIColor.clear.cgColor
+      helpUnderline.lineWidth = 1
+      helpUnderline.lineDashPattern = [3, 2]
+      helpAnchor.layer.addSublayer(helpUnderline)
+    }
+    var frame = titleLabel.frame
+    if helpPrimaryLineOnly, let text = attributedTitle(for: .normal) {
+      let range = (text.string as NSString).range(of: "\n")
+      let primary = text.attributedSubstring(from: NSRange(location: 0, length: range.location == NSNotFound ? text.length : range.location))
+      let width = min(frame.width, ceil(primary.size().width))
+      frame.origin.x += frame.width - width
+      frame.size.width = width
+      let paragraph = primary.length > 0 ? primary.attribute(.paragraphStyle, at: 0, effectiveRange: nil) as? NSParagraphStyle : nil
+      frame.size.height = paragraph?.minimumLineHeight ?? 20
+    }
+    helpAnchor.frame = frame
+    let text = attributedTitle(for: .normal)
+    let color = text.flatMap { $0.length > 0 ? $0.attribute(.foregroundColor, at: 0, effectiveRange: nil) as? UIColor : nil }
+    helpUnderline.strokeColor = (color ?? titleColor(for: .normal))?.cgColor
+    helpUnderline.isHidden = !showsHelpUnderline
+    let path = UIBezierPath()
+    path.move(to: CGPoint(x: 0, y: frame.height - 1))
+    path.addLine(to: CGPoint(x: frame.width, y: frame.height - 1))
+    helpUnderline.path = path.cgPath
+  }
 
   override var isHighlighted: Bool {
     didSet {
       guard let pressedBackgroundColor else { return }
-      backgroundColor = isHighlighted ? pressedBackgroundColor : .clear
+      backgroundColor = isHighlighted ? pressedBackgroundColor : normalBackgroundColor
     }
   }
 
@@ -32,6 +92,13 @@ final class NativeListAccessoryButton: UIButton {
     }
   }
 
+  func clearTitlesForReuse() {
+    UIView.performWithoutAnimation {
+      super.setAttributedTitle(nil, for: .normal)
+      super.setTitle(nil, for: .normal)
+    }
+  }
+
   var selectorSummaryLineHeight: CGFloat? {
     didSet {
       invalidateIntrinsicContentSize()
@@ -52,6 +119,11 @@ final class NativeListAccessoryButton: UIButton {
 
   override var intrinsicContentSize: CGSize {
     var size = super.intrinsicContentSize
+    if let fixedTextLineHeight {
+      size.width += 2
+      size.height = fixedTextLineHeight + contentEdgeInsets.top + contentEdgeInsets.bottom + 2
+      return size
+    }
     guard selectorSummaryLineHeight != nil || marketLineHeight != nil,
       let title = attributedTitle(for: .normal)
     else { return size }
@@ -71,6 +143,10 @@ final class NativeListAccessoryButton: UIButton {
     defer {
       if let titleLabel {
         var frame = titleLabel.frame
+        if let fixedTextLineHeight {
+          frame.size.height = fixedTextLineHeight
+          frame.origin.y = (bounds.height - fixedTextLineHeight) / 2
+        }
         if contentVerticalAlignment == .top {
           frame.origin.y = contentEdgeInsets.top
         } else if contentVerticalAlignment == .bottom {
@@ -79,6 +155,7 @@ final class NativeListAccessoryButton: UIButton {
         frame.origin.y += rowTextOffsetY
         titleLabel.frame = frame
       }
+      layoutHelp()
     }
     if let lineHeight = marketLineHeight, let titleLabel, let title = attributedTitle(for: .normal)
     {
@@ -127,6 +204,8 @@ final class NativeListAccessoryStack: UIStackView {
   private var boundCheckboxData: [String: Any]?
   private var boundCheckboxTarget: NativeSelectionTarget?
   private var semanticValueButtons: [UIButton] = []
+  private var valuePairSubscriptRanges: [ObjectIdentifier: [(NSRange, Bool)]] = [:]
+  private var tertiaryIconButtons: Set<ObjectIdentifier> = []
   private var accessorySizeConstraints: [NSLayoutConstraint] = []
   private var currentItem: NativeListItem?
   private var currentTheme: [String: Any]?
@@ -210,14 +289,19 @@ final class NativeListAccessoryStack: UIStackView {
     }
   }
   func anchorInset(for view: UIView) -> CGFloat {
-    currentItem?.data.string("presentation") == "accountSelector"
-      && accessoryButtons.contains { $0 === view } && view.bounds.width == 38 ? 7 : 0
+    guard accessoryButtons.contains(where: { $0 === view }), view.bounds.width == 38 else {
+      return 0
+    }
+    if tertiaryIconButtons.contains(ObjectIdentifier(view)) { return 7 }
+    return currentItem?.data.string("presentation") == "accountSelector" ? 7 : 0
   }
   func reset() {
     NSLayoutConstraint.deactivate(accessorySizeConstraints)
     accessorySizeConstraints.removeAll()
     accessoryActions.removeAll()
     semanticValueButtons.removeAll()
+    valuePairSubscriptRanges.removeAll()
+    tertiaryIconButtons.removeAll()
     checkboxAction = nil
     boundCheckboxData = nil
     boundCheckboxTarget = nil
@@ -225,8 +309,8 @@ final class NativeListAccessoryStack: UIStackView {
     contentGap = nil
     currentItem = nil
     for (index, button) in accessoryButtons.enumerated() {
-      button.setAttributedTitle(nil, for: .normal)
-      button.setTitle(nil, for: .normal)
+      button.tag = index
+      button.clearTitlesForReuse()
       button.setImage(nil, for: .normal)
       button.setImage(nil, for: .disabled)
       button.titleLabel?.font = nativeListFont(
@@ -236,11 +320,19 @@ final class NativeListAccessoryStack: UIStackView {
       button.contentHorizontalAlignment = .center
       button.contentVerticalAlignment = .center
       button.rowTextOffsetY = 0
+      button.helpBindingGeneration += 1
+      button.helpPrimaryLineOnly = false
+      button.showsHelpUnderline = false
       button.transform = .identity
       button.marketLineHeight = nil
       button.selectorSummaryLineHeight = nil
       button.backgroundColor = .clear
       button.pressedBackgroundColor = nil
+      button.normalBackgroundColor = .clear
+      button.fixedTextLineHeight = nil
+      button.contentEdgeInsets = .zero
+      button.layer.borderWidth = 0
+      button.layer.borderColor = nil
       button.layer.cornerRadius = 0
       button.isHidden = true
       button.isEnabled = true
@@ -254,9 +346,13 @@ final class NativeListAccessoryStack: UIStackView {
     spinner.alpha = 1
   }
   @objc private func pressed(_ button: UIButton) {
-    guard accessoryActions.indices.contains(button.tag) else { return }
-    let action = accessoryActions[button.tag]
-    if !action.0.isEmpty { onAction?(action.0, button, button.tag, action.1) }
+    guard let controlIndex = accessoryButtons.firstIndex(where: { $0 === button }),
+      accessoryActions.indices.contains(controlIndex) else { return }
+    let action = accessoryActions[controlIndex]
+    if !action.0.isEmpty {
+      let anchor = accessoryButtons[controlIndex]
+      onAction?(action.0, anchor.helpPrimaryLineOnly ? anchor.helpAnchor : button, button.tag, action.1)
+    }
   }
   @objc private func checkboxPressed() {
     if let action = checkboxAction { onAction?(action.0, checkboxButton, nil, action.1) }
@@ -268,8 +364,42 @@ final class NativeListAccessoryStack: UIStackView {
     _ checkboxState: (NativeListItem, NativeSelectionTarget?, String) -> String
   ) {
     var textIndex = 0
-    for accessory in accessories.prefix(2) {
+    for (slot, accessory) in accessories.prefix(2).enumerated() {
+      let controlIndex = textIndex
       switch accessory.string("kind") {
+      case "button":
+        showAccessory(
+          textIndex, accessory.string("label"),
+          action: accessory.bool("disabled") || item.data.bool("disabled")
+            ? nil : (accessory.string("actionKey"), nil))
+        let button = accessoryButtons[textIndex]
+        button.titleLabel?.font = nativeListFont(ofSize: 14, weight: .medium, fonts: fonts)
+        button.fixedTextLineHeight = 20
+        button.contentEdgeInsets = UIEdgeInsets(top: 4, left: 10, bottom: 4, right: 10)
+        button.layer.borderWidth = 1
+        button.layer.borderColor = UIColor.clear.cgColor
+        button.layer.cornerRadius = 15
+        button.backgroundColor = UIColor(
+          nativeListHex: accessory.string("backgroundColor",
+            default: theme?["strongBackground"] as? String ?? "#F0F0F0"),
+          fallback: .clear)
+        button.normalBackgroundColor = button.backgroundColor ?? .clear
+        button.pressedBackgroundColor = UIColor(
+          nativeListHex: accessory.string("pressedBackgroundColor",
+            default: theme?["rowPressedBackground"] as? String ?? "#E4E4E4"),
+          fallback: .clear)
+        button.setTitleColor(
+          UIColor(
+            nativeListHex: accessory.string("textColor",
+              default: theme?["primaryText"] as? String ?? "#202020"),
+            fallback: .darkGray),
+          for: .normal)
+        button.accessibilityIdentifier = accessory.string("testID")
+        button.accessibilityLabel =
+          accessory.string("accessibilityLabel", default: accessory.string("label"))
+        button.isEnabled = !item.data.bool("disabled") && !accessory.bool("disabled")
+        button.alpha = button.isEnabled ? 1 : 0.4
+        textIndex += 1
       case "value":
         showAccessory(textIndex, accessory.string("text"))
         semanticValueButtons.append(accessoryButtons[textIndex])
@@ -326,6 +456,7 @@ final class NativeListAccessoryStack: UIStackView {
         textIndex += 1
       default: break
       }
+      if textIndex > controlIndex { accessoryButtons[controlIndex].tag = slot }
     }
   }
 
@@ -411,8 +542,12 @@ final class NativeListAccessoryStack: UIStackView {
     theme: [String: Any]?
   ) {
     guard accessoryButtons.indices.contains(index) else { return }
-    let primary = accessory.string("primary")
-    let secondary = accessory.string("secondary")
+    let primarySegments = accessory.dictionaries("primaryTextSegments")
+    let secondarySegments = accessory.dictionaries("secondaryTextSegments")
+    let primary = primarySegments.isEmpty
+      ? accessory.string("primary") : primarySegments.map { $0.string("text") }.joined()
+    let secondary = secondarySegments.isEmpty
+      ? accessory.string("secondary") : secondarySegments.map { $0.string("text") }.joined()
     guard !primary.isEmpty || !secondary.isEmpty else { return }
     let button = accessoryButtons[index]
     // Value pairs never carry an action; the row owns their touches.
@@ -422,45 +557,66 @@ final class NativeListAccessoryStack: UIStackView {
     primaryParagraph.alignment = .right
     primaryParagraph.minimumLineHeight = 20
     primaryParagraph.maximumLineHeight = 20
-    text.append(
-      NSAttributedString(
-        string: primary,
-        attributes: [
-          .font: nativeListFont(ofSize: 16, weight: .medium, fonts: fonts),
-          .foregroundColor: accessoryTextColor(
-            accessory.string("primaryTone"),
-            defaultTone: "primary",
-            theme: theme
-          ),
-          .paragraphStyle: primaryParagraph,
-        ]
-      ))
+    var subscriptRanges: [(NSRange, Bool)] = []
+    appendValuePairLine(
+      to: text, fallback: primary, segments: primarySegments, fontSize: 16,
+      weight: .medium,
+      color: accessoryTextColor(accessory.string("primaryTone"), defaultTone: "primary", theme: theme),
+      paragraph: primaryParagraph, isPrimary: true, subscriptRanges: &subscriptRanges)
     if !primary.isEmpty, !secondary.isEmpty { text.append(NSAttributedString(string: "\n")) }
     let secondaryParagraph = NSMutableParagraphStyle()
     secondaryParagraph.alignment = .right
     secondaryParagraph.minimumLineHeight = 20
     secondaryParagraph.maximumLineHeight = 20
-    text.append(
-      NSAttributedString(
-        string: secondary,
-        attributes: [
-          .font: nativeListFont(ofSize: 14, fonts: fonts),
-          .foregroundColor: accessoryTextColor(
-            accessory.string("secondaryTone"),
-            defaultTone: "secondary",
-            theme: theme
-          ),
-          .paragraphStyle: secondaryParagraph,
-        ]
-      ))
+    appendValuePairLine(
+      to: text, fallback: secondary, segments: secondarySegments, fontSize: 14,
+      weight: .regular,
+      color: accessoryTextColor(accessory.string("secondaryTone"), defaultTone: "secondary", theme: theme),
+      paragraph: secondaryParagraph, isPrimary: false, subscriptRanges: &subscriptRanges)
     button.isHidden = false
     button.titleLabel?.numberOfLines = 2
     button.contentHorizontalAlignment = .trailing
     button.setAttributedTitle(text, for: .normal)
+    valuePairSubscriptRanges[ObjectIdentifier(button)] = subscriptRanges
     button.setContentHuggingPriority(.required, for: .horizontal)
     button.setContentCompressionResistancePriority(.required, for: .horizontal)
     while accessoryActions.count <= index { accessoryActions.append(("", nil)) }
     accessoryActions[index] = ("", nil)
+    if let help = accessory.dictionary("primaryHelp") {
+      button.helpPrimaryLineOnly = true
+      button.showsHelpUnderline = help.string("underline") == "dashed"
+      button.isUserInteractionEnabled = help.string("presentation") == "popover"
+      accessoryActions[index] = (help.string("presentation") == "popover" ? help.string("actionKey") : "", nil)
+      button.setNeedsLayout()
+    }
+  }
+
+  private func appendValuePairLine(
+    to text: NSMutableAttributedString,
+    fallback: String,
+    segments: [[String: Any]],
+    fontSize: CGFloat,
+    weight: NativeListFontWeight,
+    color: UIColor,
+    paragraph: NSParagraphStyle,
+    isPrimary: Bool,
+    subscriptRanges: inout [(NSRange, Bool)]
+  ) {
+    let runs = segments.isEmpty ? [["text": fallback]] : segments
+    for run in runs {
+      let content = run.string("text")
+      let isSubscript = run.string("style") == "subscript"
+      let start = text.length
+      text.append(NSAttributedString(string: content, attributes: [
+        .font: nativeListFont(
+          ofSize: isSubscript ? ceil(fontSize * 0.6) : fontSize, weight: weight, fonts: fonts),
+        .foregroundColor: color,
+        .paragraphStyle: paragraph,
+      ]))
+      if isSubscript && text.length > start {
+        subscriptRanges.append((NSRange(location: start, length: text.length - start), isPrimary))
+      }
+    }
   }
 
   private func showMenuAccessory(
@@ -508,7 +664,12 @@ final class NativeListAccessoryStack: UIStackView {
       ? nativeListColor(currentTheme, "iconSubdued", "#8D8D8D")
       : UIColor(nativeListHex: data.string("tintColor", default: "#646464"), fallback: .darkGray)
     button.tintColor = tintColor
-    if let image = nativeListIcon(named: data.string("name")) {
+    let isDecorativeRefresh =
+      data.string("name") == "RefreshCcwOutline" && data.string("actionKey").isEmpty
+    let image = isDecorativeRefresh
+      ? nativeListIcon(named: data.string("name"), size: CGSize(width: 16, height: 16))
+      : nativeListIcon(named: data.string("name"))
+    if let image {
       button.setImage(image, for: .normal)
       button.setImage(
         image.withTintColor(tintColor, renderingMode: .alwaysOriginal),
@@ -516,8 +677,22 @@ final class NativeListAccessoryStack: UIStackView {
       )
     }
     let isDrillIn = data.string("kind") == "chevron"
+    let isTertiary = data.string("buttonStyle") == "tertiary"
+    if data.string("kind") == "icon" && isTertiary {
+      tertiaryIconButtons.insert(ObjectIdentifier(button))
+    }
     let isAccountIcon = currentItem?.data.string("presentation") == "accountSelector" && !isDrillIn
-    let size: CGFloat = isDrillIn ? 24 : isAccountIcon && !isAccountCreate ? 38 : 36
+    button.isUserInteractionEnabled = !isDecorativeRefresh
+    let size: CGFloat =
+      isDecorativeRefresh ? 16 : isDrillIn ? 24 : isTertiary || isAccountIcon && !isAccountCreate ? 38 : 36
+    if isTertiary {
+      button.pressedBackgroundColor = nativeListColor(
+        currentTheme, "rowPressedBackground", "#E8E8E8")
+      button.layer.borderWidth = 1
+      button.layer.borderColor = UIColor.clear.cgColor
+      button.layer.cornerRadius = 19
+      button.contentEdgeInsets = UIEdgeInsets(top: 6, left: 6, bottom: 6, right: 6)
+    }
     if isAccountCreate { button.layer.cornerRadius = 8 }
     if isAccountIcon && !isAccountCreate && !data.string("actionKey").isEmpty {
       button.pressedBackgroundColor = nativeListColor(
@@ -655,6 +830,19 @@ final class NativeListAccessoryStack: UIStackView {
     }
     button.titleLabel?.font = font
     attributed.addAttributes(attributes, range: NSRange(location: 0, length: attributed.length))
+    if style["fontSize"] != nil,
+      let ranges = valuePairSubscriptRanges[ObjectIdentifier(button)]
+    {
+      for (range, isPrimary) in ranges {
+        let weight = style["fontWeight"] == nil
+          ? (isPrimary ? NativeListFontWeight.medium : NativeListFontWeight.regular)
+          : marketFontWeight(style.string("fontWeight"), fallback: .regular)
+        attributed.addAttribute(
+          .font,
+          value: nativeListFont(ofSize: ceil(size * 0.6), weight: weight, fonts: fonts),
+          range: range)
+      }
+    }
     button.setAttributedTitle(attributed, for: .normal)
   }
 

package/ios/NativeListActivityDetailsView.swift

@@ -70,8 +70,10 @@ final class NativeListActivityDetailsView: UIStackView {
     let verticalPadding = CGFloat(style.double("verticalPadding", default: 8))
     let lineGap = CGFloat(style.double("lineGap"))
     let gap = CGFloat(style.double("leadingGap", default: 12))
+    let hideLeading = data.bool("hideLeading")
     let imageWidth = CGFloat(image.double("width", default: 40))
     let imageHeight = CGFloat(image.double("height", default: 40))
+    let leadingWidth = hideLeading ? 0 : imageWidth + gap
     let mainWidth = max(0, width - horizontalPadding * 2)
 
     let amounts = data.dictionaries("amounts").map { amount -> (width: CGFloat, height: CGFloat) in
@@ -112,10 +114,10 @@ final class NativeListActivityDetailsView: UIStackView {
     let feeColumn = data.dictionary("fee") == nil ? 0 : gap + feeWidth
     let identityWidth: CGFloat
     if table {
-      let shared = (mainWidth - imageWidth - gap * 2 - feeColumn) / 2
+      let shared = (mainWidth - leadingWidth - gap - feeColumn) / 2
       identityWidth = min(mainWidth * 0.42, shared)
     } else {
-      identityWidth = mainWidth - imageWidth - gap * 2 - feeColumn - min(amountsWidth, mainWidth * 0.5)
+      identityWidth = mainWidth - leadingWidth - gap - feeColumn - min(amountsWidth, mainWidth * 0.5)
     }
 
     let title = NativeListResolvedText(data.string("title"), style: style.dictionary("title"), size: 16,
@@ -140,7 +142,7 @@ final class NativeListActivityDetailsView: UIStackView {
         return max(height, ceil(sizingButton.intrinsicContentSize.height))
       } + 8
     }
-    return max(imageHeight, identityHeight, amountsHeight, feeHeight) + actionsHeight + verticalPadding * 2
+    return max(hideLeading ? 0 : imageHeight, identityHeight, amountsHeight, feeHeight) + actionsHeight + verticalPadding * 2
   }
 
   func bind(_ item: NativeListItem, theme: [String: Any]?, fonts: NativeListFontFamilies) {
@@ -150,20 +152,28 @@ final class NativeListActivityDetailsView: UIStackView {
     let image = style.dictionary("image") ?? [:]
     let table = data.string("presentation") == "table"
     let gap = CGFloat(style.double("leadingGap", default: 12))
+    let hideLeading = data.bool("hideLeading")
     main.spacing = gap
     identity.spacing = CGFloat(style.double("lineGap"))
     amounts.spacing = CGFloat(style.double("trailingGap", default: 2))
     titleLine.spacing = CGFloat(style.double("titleBadgeGap", default: 4))
     NSLayoutConstraint.deactivate(dimensions)
+    let visualWidth = visual.widthAnchor.constraint(equalToConstant: CGFloat(image.double("width", default: 40)))
+    if hideLeading { visualWidth.priority = UILayoutPriority(999) }
     dimensions = [
-      visual.widthAnchor.constraint(equalToConstant: CGFloat(image.double("width", default: 40))),
+      visualWidth,
       visual.heightAnchor.constraint(equalToConstant: CGFloat(image.double("height", default: 40))),
       amounts.widthAnchor.constraint(lessThanOrEqualTo: main.widthAnchor, multiplier: table ? 0.42 : 0.5),
     ]
     if table { dimensions.append(amounts.widthAnchor.constraint(equalTo: identity.widthAnchor)) }
     NSLayoutConstraint.activate(dimensions)
-    visual.bind(data.dictionary("leading") ?? [:], style: image, key: item.key, theme: theme,
-      isUnread: false, secondaryVisual: data.dictionary("secondaryLeading"), fonts: fonts)
+    visual.isHidden = hideLeading
+    if hideLeading {
+      visual.recycle()
+    } else {
+      visual.bind(data.dictionary("leading") ?? [:], style: image, key: item.key, theme: theme,
+        isUnread: false, secondaryVisual: data.dictionary("secondaryLeading"), fonts: fonts)
+    }
     NativeListResolvedText(data.string("title"), style: style.dictionary("title"), size: 16,
       weight: .medium, color: nativeListColor(theme, "primaryText", "#202020"), lineHeight: 24,
       lines: 1, fonts: fonts
@@ -225,7 +235,7 @@ final class NativeListActivityDetailsView: UIStackView {
     let actionData = data.dictionaries("footerActions")
     actionKeys = actionData.map { $0.string("key") }
     actions.isHidden = actionData.isEmpty
-    actions.directionalLayoutMargins = NSDirectionalEdgeInsets(top: 0, leading: CGFloat(image.double("width", default: 40)) + gap, bottom: 0, trailing: 0)
+    actions.directionalLayoutMargins = NSDirectionalEdgeInsets(top: 0, leading: hideLeading ? 0 : CGFloat(image.double("width", default: 40)) + gap, bottom: 0, trailing: 0)
     for (index, descriptor) in actionData.enumerated() {
       let button = UIButton(type: .system); button.tag = index
       button.setTitle(descriptor.string("label"), for: .normal)
@@ -249,7 +259,7 @@ final class NativeListActivityDetailsView: UIStackView {
     onAction?(actionKeys[button.tag], button, "footerAction", button.tag)
   }
   func recycle() {
-    visual.recycle(); amountViews.forEach { $0.recycle() }; actionKeys = []; descriptionKey = ""
+    visual.recycle(); visual.isHidden = false; amountViews.forEach { $0.recycle() }; actionKeys = []; descriptionKey = ""
   }
 }
 

package/ios/NativeListActivityRenderer.swift

@@ -97,6 +97,7 @@ final class NativeListActivityCell: NativeListRendererCell {
     details.recycle()
     let style = data.dictionary("style") ?? [:]
     let image = style.dictionary("image") ?? [:]
+    let hideLeading = data.bool("hideLeading")
     root.spacing = 12
     root.setCustomSpacing(CGFloat(style.double("leadingGap", default: 12)), after: visual)
     switch style.dictionary("container")?.string("contentVerticalAlignment") {
@@ -113,12 +114,17 @@ final class NativeListActivityCell: NativeListRendererCell {
       bottom: CGFloat(style.double("verticalPadding", default: 8)),
       right: CGFloat(style.double("horizontalPadding", default: layout == "table" ? 16 : 12)))
     NSLayoutConstraint.deactivate(dimensions)
+    let visualWidth = visual.widthAnchor.constraint(equalToConstant: CGFloat(image.double("width", default: 40)))
+    if hideLeading { visualWidth.priority = UILayoutPriority(999) }
     dimensions = [
-      visual.widthAnchor.constraint(equalToConstant: CGFloat(image.double("width", default: 40))),
+      visualWidth,
       visual.heightAnchor.constraint(equalToConstant: CGFloat(image.double("height", default: 40))),
     ]
     NSLayoutConstraint.activate(dimensions)
-    if let leading = data.dictionary("leading") {
+    visual.isHidden = hideLeading
+    if hideLeading {
+      visual.recycle()
+    } else if let leading = data.dictionary("leading") {
       visual.bind(
         leading, style: image, key: item.key, theme: theme, isUnread: false,
         secondaryVisual: data.dictionary("secondaryLeading"), fonts: fonts)

package/ios/NativeListButtonGroupRenderer.swift

@@ -0,0 +1,89 @@
+import UIKit
+
+final class NativeListButtonGroupCell: NativeListRendererCell {
+  override class func measure(
+    _ item: NativeListItem, width: CGFloat, theme: [String: Any]?, layout: String,
+    fonts: NativeListFontFamilies
+  ) -> CGFloat? { 64 }
+
+  private var buttons: [UIButton] = []
+  private var actionKeys: [String] = []
+  private var rowOpacity: CGFloat = 1
+
+  override func applyAppearance() {
+    super.applyAppearance()
+    contentView.alpha = rowOpacity
+  }
+
+  override init(frame: CGRect) {
+    super.init(frame: frame)
+    root.axis = .horizontal
+    root.alignment = .fill
+    root.distribution = .fillEqually
+    root.spacing = 10
+  }
+  required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") }
+
+  override func bindContent(
+    _ item: NativeListItem, theme: [String: Any]?, layout: String,
+    checkboxState: (NativeListItem, NativeSelectionTarget?, String) -> String
+  ) {
+    recycleContent()
+    rowOpacity = CGFloat(item.data.dictionary("style")?.dictionary("container")?.double("opacity", default: item.data.double("opacity", default: 1)) ?? item.data.double("opacity", default: 1))
+    contentInsets = UIEdgeInsets(top: 8, left: 0, bottom: 8, right: 0)
+    let info = nativeListColor(theme, "info", "#0F69F6")
+    for (index, descriptor) in item.data.dictionaries("buttons").enumerated() {
+      let button = NativeListAccessoryButton(type: .custom)
+      button.tag = index
+      button.setTitle(descriptor.string("label"), for: .normal)
+      button.titleLabel?.font = nativeListFont(ofSize: 14, weight: .medium, fonts: fonts)
+      button.titleLabel?.lineBreakMode = .byTruncatingTail
+      button.setTitleColor(info, for: .normal)
+      button.contentEdgeInsets = UIEdgeInsets(top: 12, left: 8, bottom: 12, right: 8)
+      button.layer.cornerRadius = 12
+      button.layer.borderWidth = 1
+      button.layer.borderColor = info.withAlphaComponent(0.35).cgColor
+      button.normalBackgroundColor = .clear
+      button.pressedBackgroundColor = info.withAlphaComponent(0.17)
+      button.isEnabled = !item.data.bool("disabled") && !descriptor.bool("disabled") && !descriptor.bool("loading")
+      button.alpha = button.isEnabled ? 1 : 0.4
+      button.accessibilityIdentifier = descriptor["testID"] as? String
+      button.accessibilityLabel = descriptor.string("accessibilityLabel", default: descriptor.string("label"))
+      button.addTarget(self, action: #selector(pressed(_:)), for: .touchUpInside)
+      if descriptor.bool("loading"), let titleLabel = button.titleLabel {
+        let spinner = UIActivityIndicatorView(style: .medium)
+        spinner.color = info
+        spinner.isUserInteractionEnabled = false
+        spinner.translatesAutoresizingMaskIntoConstraints = false
+        button.addSubview(spinner)
+        button.contentEdgeInsets = UIEdgeInsets(top: 12, left: 36, bottom: 12, right: 8)
+        NSLayoutConstraint.activate([
+          spinner.trailingAnchor.constraint(equalTo: titleLabel.leadingAnchor, constant: -8),
+          spinner.centerYAnchor.constraint(equalTo: button.centerYAnchor),
+          spinner.widthAnchor.constraint(equalToConstant: 20),
+          spinner.heightAnchor.constraint(equalToConstant: 20),
+        ])
+        spinner.startAnimating()
+      }
+      buttons.append(button)
+      actionKeys.append(descriptor.string("actionKey"))
+      root.addArrangedSubview(button)
+    }
+  }
+
+  @objc private func pressed(_ button: UIButton) {
+    guard button.isEnabled, buttons.indices.contains(button.tag), buttons[button.tag] === button else { return }
+    emitAction(actionKeys[button.tag], from: button, source: "buttonGroup", slot: button.tag)
+  }
+
+  override func recycleContent() {
+    for button in buttons {
+      button.removeTarget(self, action: nil, for: .allEvents)
+      button.subviews.compactMap { $0 as? UIActivityIndicatorView }.forEach { $0.stopAnimating() }
+      root.removeArrangedSubview(button)
+      button.removeFromSuperview()
+    }
+    buttons.removeAll()
+    actionKeys.removeAll()
+  }
+}