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

package/ios/NativeListDataRowRenderer.swift

@@ -6,7 +6,7 @@ final class NativeListDataRowCell: NativeListRendererCell {
     fonts: NativeListFontFamilies
   ) -> CGFloat? {
     let secondary = item.data.dictionaries("columns").contains {
-      !$0.string("secondaryText").isEmpty
+      !nativeListDataColumnText($0, "secondaryText").isEmpty
     }
     return secondary ? 60 : layout == "table" ? 48 : 56
   }
@@ -14,9 +14,13 @@ final class NativeListDataRowCell: NativeListRendererCell {
   private let visual = NativeListLeadingVisual()
   private let favorite = UIImageView()
   private let accessories = NativeListAccessoryStack()
+  private let trailingAccessories = NativeListAccessoryStack()
   private let columns = UIStackView()
   private let cells = (0..<4).map { _ in NativeListTableColumnView() }
   private var rowConstraints: [NSLayoutConstraint] = []
+  private var trailingWidthConstraint: NSLayoutConstraint?
+  private var columnWidthConstraints: [NSLayoutConstraint] = []
+  private var columnWeights: [Int]?
   override func unselectedBackground(
     _ item: NativeListItem, theme: [String: Any]?, layout: String, itemIndex: Int?
   ) -> UIColor {
@@ -34,10 +38,13 @@ final class NativeListDataRowCell: NativeListRendererCell {
     columns.alignment = .center
     columns.spacing = 8
     cells.forEach(columns.addArrangedSubview)
-    [favorite, visual, accessories, columns].forEach(root.addArrangedSubview)
+    [favorite, visual, accessories, columns, trailingAccessories].forEach(root.addArrangedSubview)
     accessories.onAction = { [weak self] key, view, slot, target in
       self?.emitAction(key, from: view, source: "trailingAccessory", slot: slot, target: target)
     }
+    trailingAccessories.onAction = { [weak self] key, view, slot, target in
+      self?.emitAction(key, from: view, source: "trailingAccessory", slot: slot, target: target)
+    }
   }
   required init?(coder: NSCoder) { fatalError("init(coder:) has not been implemented") }
   override func bindContent(
@@ -86,16 +93,55 @@ final class NativeListDataRowCell: NativeListRendererCell {
       item, descriptors: descriptors, theme: theme, style: accessoryStyle,
       checkboxState: checkboxState, fonts: fonts)
     accessories.isHidden = descriptors.isEmpty
-    NSLayoutConstraint.deactivate(rowConstraints)
-    rowConstraints = [
-      favorite.widthAnchor.constraint(equalToConstant: 20),
-      favorite.heightAnchor.constraint(equalToConstant: 20),
-      visual.widthAnchor.constraint(equalToConstant: CGFloat(image.double("width", default: 40))),
-      visual.heightAnchor.constraint(equalToConstant: CGFloat(image.double("height", default: 40))),
-    ]
+    let trailing = data.dictionaries("trailing")
+    trailingAccessories.bind(
+      item, descriptors: trailing, theme: theme, style: style,
+      checkboxState: checkboxState, fonts: fonts)
+    trailingAccessories.isHidden = trailing.isEmpty
+    if rowConstraints.isEmpty {
+      rowConstraints = [
+        favorite.widthAnchor.constraint(equalToConstant: 20),
+        favorite.heightAnchor.constraint(equalToConstant: 20),
+        visual.widthAnchor.constraint(equalToConstant: 40),
+        visual.heightAnchor.constraint(equalToConstant: 40),
+      ]
+      NSLayoutConstraint.activate(rowConstraints)
+    }
+    let visualWidth = CGFloat(image.double("width", default: 40))
+    let visualHeight = CGFloat(image.double("height", default: 40))
+    if rowConstraints[2].constant != visualWidth { rowConstraints[2].constant = visualWidth }
+    if rowConstraints[3].constant != visualHeight { rowConstraints[3].constant = visualHeight }
+    if !trailing.isEmpty {
+      // UIStackView has no intrinsic width of its own. Reserve the controls' fitted
+      // width so extra space goes to the weighted columns instead of this stack.
+      if trailingWidthConstraint == nil {
+        trailingWidthConstraint = trailingAccessories.widthAnchor.constraint(equalToConstant: 0)
+      }
+      if trailingWidthConstraint?.isActive == true { trailingWidthConstraint?.isActive = false }
+      let trailingWidth =
+        trailingAccessories.systemLayoutSizeFitting(UIView.layoutFittingCompressedSize).width
+      if trailingWidthConstraint?.constant != trailingWidth {
+        trailingWidthConstraint?.constant = trailingWidth
+      }
+      trailingWidthConstraint?.isActive = true
+    } else {
+      if trailingWidthConstraint?.isActive == true { trailingWidthConstraint?.isActive = false }
+    }
     let values = Array(data.dictionaries("columns").prefix(4))
+    let weights = values.map { max(1, $0.int("weight", default: 1)) }
+    var divisor = weights.first ?? 1
+    for weight in weights.dropFirst() {
+      var a = divisor
+      var b = weight
+      while b != 0 { (a, b) = (b, a % b) }
+      divisor = a
+    }
+    let normalizedWeights = weights.map { $0 / divisor }
+    let columnsChanged = columnWeights != normalizedWeights
+    if columnsChanged { NSLayoutConstraint.deactivate(columnWidthConstraints) }
     for (index, cell) in cells.enumerated() {
-      cell.isHidden = index >= values.count
+      let hidden = index >= values.count
+      if cell.isHidden != hidden { cell.isHidden = hidden }
       guard index < values.count else {
         cell.reset()
         continue
@@ -109,23 +155,29 @@ final class NativeListDataRowCell: NativeListRendererCell {
       cell.applyStyle(style) { label, style in
         NativeListTextStyles.applyStyledText(label, style, fonts: fonts)
       }
-      if index > 0 {
-        rowConstraints.append(
-          cell.widthAnchor.constraint(
-            equalTo: cells[0].widthAnchor,
-            multiplier: CGFloat(max(1, values[index].int("weight", default: 1)))
-              / CGFloat(max(1, values[0].int("weight", default: 1)))))
-      }
+      cell.applySegments(values[index])
+      cell.bindTitleIcons(values[index], theme: theme)
+    }
+    if columnsChanged {
+      columnWidthConstraints = values.count > 1 ? (1..<values.count).map { index in
+        cells[index].widthAnchor.constraint(equalTo: cells[0].widthAnchor,
+          multiplier: CGFloat(weights[index]) / CGFloat(weights[0]))
+      } : []
+      NSLayoutConstraint.activate(columnWidthConstraints)
+      columnWeights = normalizedWeights
     }
-    NSLayoutConstraint.activate(rowConstraints)
   }
   override func bindSelectionContent(
     _ item: NativeListItem,
     checkboxState: (NativeListItem, NativeSelectionTarget?, String) -> String
-  ) { accessories.updateSelection(item, checkboxState: checkboxState) }
+  ) {
+    accessories.updateSelection(item, checkboxState: checkboxState)
+    trailingAccessories.updateSelection(item, checkboxState: checkboxState)
+  }
   override func recycleContent() {
     visual.recycle()
     accessories.reset()
+    trailingAccessories.reset()
     cells.forEach { $0.reset() }
   }
 }
@@ -133,6 +185,8 @@ final class NativeListDataRowCell: NativeListRendererCell {
 private final class NativeListTableColumnView: UIStackView {
   private let primaryLine = UIStackView()
   private let primaryLabel = NativeListTextLabel()
+  private let titleIconView = UIImageView()
+  private let secondaryTitleIconView = UIImageView()
   private let badgesStack = UIStackView()
   private let secondaryLine = UIStackView()
   private let secondaryLeadingLabel = NativeListTextLabel()
@@ -152,11 +206,21 @@ private final class NativeListTableColumnView: UIStackView {
     primaryLabel.numberOfLines = 1
     primaryLabel.lineBreakMode = .byTruncatingTail
     primaryLabel.setContentCompressionResistancePriority(.defaultLow, for: .horizontal)
+    for icon in [titleIconView, secondaryTitleIconView] {
+      icon.contentMode = .scaleAspectFit
+      icon.translatesAutoresizingMaskIntoConstraints = false
+      icon.widthAnchor.constraint(equalToConstant: 20).isActive = true
+      icon.heightAnchor.constraint(equalToConstant: 20).isActive = true
+      icon.setContentHuggingPriority(.required, for: .horizontal)
+      icon.isHidden = true
+    }
     badgesStack.axis = .horizontal
     badgesStack.alignment = .center
     badgesStack.spacing = 4
     badgesStack.setContentCompressionResistancePriority(.required, for: .horizontal)
     primaryLine.addArrangedSubview(primaryLabel)
+    primaryLine.addArrangedSubview(titleIconView)
+    primaryLine.addArrangedSubview(secondaryTitleIconView)
     primaryLine.addArrangedSubview(badgesStack)
 
     secondaryLine.axis = .horizontal
@@ -178,8 +242,17 @@ private final class NativeListTableColumnView: UIStackView {
     fatalError("init(coder:) has not been implemented")
   }
 
-  func reset() {
+  func reset(clearPrimaryText: Bool = true) {
     linear = false
+    primaryLine.alignment = .center
+    for icon in [titleIconView, secondaryTitleIconView] {
+      icon.image = nil
+      icon.isHidden = true
+      icon.accessibilityLabel = nil
+      icon.isAccessibilityElement = false
+    }
+    primaryLine.setCustomSpacing(UIStackView.spacingUseDefault, after: primaryLabel)
+    primaryLine.setCustomSpacing(UIStackView.spacingUseDefault, after: titleIconView)
     for label in [primaryLabel, secondaryLeadingLabel, secondaryLabel] {
       label.rowVerticalAlignment = nil
       label.rowOffsetY = 0
@@ -190,7 +263,7 @@ private final class NativeListTableColumnView: UIStackView {
     primaryLabel.numberOfLines = 1
     secondaryLeadingLabel.numberOfLines = 1
     secondaryLabel.numberOfLines = 1
-    primaryLabel.attributedText = nil
+    if clearPrimaryText { primaryLabel.attributedText = nil }
     secondaryLeadingLabel.attributedText = nil
     secondaryLabel.attributedText = nil
     secondaryLeadingLabel.isHidden = true
@@ -202,6 +275,28 @@ private final class NativeListTableColumnView: UIStackView {
     }
   }
 
+  func bindTitleIcons(_ column: [String: Any], theme: [String: Any]?) {
+    let descriptors = [column.dictionary("titleIcon"), column.dictionary("secondaryTitleIcon")]
+    for (index, descriptor) in descriptors.enumerated() {
+      guard let descriptor else { continue }
+      let icon = index == 0 ? titleIconView : secondaryTitleIconView
+      icon.image = nativeListIcon(named: descriptor.string("name"))
+      icon.tintColor = UIColor(
+        nativeListHex: descriptor.string("tintColor",
+          default: theme?["iconSubdued"] as? String ?? "#8D8D8D"),
+        fallback: .gray)
+      icon.isHidden = false
+      let label = descriptor.string("accessibilityLabel")
+      icon.accessibilityLabel = label.isEmpty ? nil : label
+      icon.isAccessibilityElement = !label.isEmpty
+    }
+    if descriptors.contains(where: { $0 != nil }) {
+      primaryLine.setCustomSpacing(4, after: primaryLabel)
+      primaryLine.setCustomSpacing(4, after: titleIconView)
+      if linear { primaryLine.alignment = .top }
+    }
+  }
+
   func bind(
     column: [String: Any],
     badges: [[String: Any]],
@@ -228,7 +323,7 @@ private final class NativeListTableColumnView: UIStackView {
     secondaryLeadingLabel.font = nativeListFont(ofSize: 12, fonts: fonts)
     secondaryLabel.font = nativeListFont(ofSize: 12, fonts: fonts)
     primaryLabel.attributedText = line(
-      column.string("text"),
+      nativeListDataColumnText(column, "text"),
       font: nativeListFont(ofSize: 14, weight: .medium, fonts: fonts),
       color: textColor(column.string("tone"), theme: theme),
       height: 20
@@ -261,7 +356,7 @@ private final class NativeListTableColumnView: UIStackView {
       secondaryLeadingLabel.isHidden = false
       secondaryLine.isHidden = false
     }
-    let secondary = column.string("secondaryText")
+    let secondary = nativeListDataColumnText(column, "secondaryText")
     if !secondary.isEmpty {
       secondaryLabel.attributedText = line(
         secondary,
@@ -286,7 +381,7 @@ private final class NativeListTableColumnView: UIStackView {
     column: [String: Any], badges: [[String: Any]], theme: [String: Any]?,
     style: [String: Any] = [:], fonts: NativeListFontFamilies
   ) {
-    reset()
+    reset(clearPrimaryText: !linear)
     linear = true
     alignment = .fill
     badgesStack.isHidden = true
@@ -331,14 +426,15 @@ private final class NativeListTableColumnView: UIStackView {
     primaryLabel.textAlignment =
       column.string("alignment") == "end"
       ? .right : column.string("alignment") == "center" ? .center : .left
-    let secondary = column.string("secondaryText")
+    let secondary = nativeListDataColumnText(column, "secondaryText")
     let primaryFont = font(primaryStyle, size: 14, weight: .medium)
     let attributed = NSMutableAttributedString(
-      string: column.string("text"),
+      string: nativeListDataColumnText(column, "text"),
       attributes: [
         .font: primaryFont,
         .foregroundColor: color(primaryStyle, textColor(column.string("tone"), theme: theme)),
       ])
+    attributed.setAttributedString(nativeListDataSegments(attributed, column.dictionaries("textSegments")))
     let primaryLength = attributed.length
     // Every badge run is the legacy "  text " pill: both lead spaces sit inside the badge
     // background and are its left padding. `titleBadgeGap` adds an exact, unfilled gap between
@@ -378,7 +474,10 @@ private final class NativeListTableColumnView: UIStackView {
           textColor(column.string("secondaryTone", default: "secondary"), theme: theme)),
       ]
       attributes.merge(paragraph(secondaryStyle, font: secondaryFont, spacing: nil)) { $1 }
-      attributed.append(NSAttributedString(string: "\n\(secondary)", attributes: attributes))
+      attributed.append(NSAttributedString(string: "\n", attributes: attributes))
+      attributed.append(nativeListDataSegments(
+        NSAttributedString(string: secondary, attributes: attributes),
+        column.dictionaries("secondaryTextSegments")))
       lines = min(3, lines + max(1, secondaryStyle.int("lines", default: 1)))
     }
     primaryLabel.font = nativeListFont(ofSize: 12, fonts: fonts)
@@ -400,6 +499,16 @@ private final class NativeListTableColumnView: UIStackView {
       primaryStyle.double("offsetY", default: secondaryStyle.double("offsetY")))
   }
 
+  func applySegments(_ column: [String: Any]) {
+    guard !linear else { return }
+    if let text = primaryLabel.attributedText {
+      primaryLabel.attributedText = nativeListDataSegments(text, column.dictionaries("textSegments"))
+    }
+    if let text = secondaryLabel.attributedText {
+      secondaryLabel.attributedText = nativeListDataSegments(text, column.dictionaries("secondaryTextSegments"))
+    }
+  }
+
   func applyStyle(_ style: [String: Any], text: (UILabel, [String: Any]) -> Void) {
     // The linear single label already mapped its styles onto attributed ranges.
     guard !linear else { return }
@@ -446,3 +555,22 @@ private final class NativeListTableColumnView: UIStackView {
     }
   }
 }
+
+private func nativeListDataColumnText(_ column: [String: Any], _ field: String) -> String {
+  let segments = column.dictionaries("\(field)Segments")
+  return segments.isEmpty ? column.string(field) : segments.map { $0.string("text") }.joined()
+}
+
+private func nativeListDataSegments(_ fallback: NSAttributedString, _ segments: [[String: Any]]) -> NSAttributedString {
+  guard !segments.isEmpty, fallback.length > 0 else { return fallback }
+  let attributes = fallback.attributes(at: 0, effectiveRange: nil)
+  let result = NSMutableAttributedString(string: "")
+  for segment in segments {
+    var runAttributes = attributes
+    if segment.string("style") == "subscript", let font = attributes[.font] as? UIFont {
+      runAttributes[.font] = font.withSize(ceil(font.pointSize * 0.6))
+    }
+    result.append(NSAttributedString(string: segment.string("text"), attributes: runAttributes))
+  }
+  return result
+}

package/ios/NativeListDesignAssets.swift

@@ -110,6 +110,9 @@ func nativeListIcon(named name: String) -> UIImage? {
   case "LockSolid": assetName = "onekey_selector_lock_solid"
   // OneKey patch: official selector icon geometry.
   case "GlobusOutline": assetName = "onekey_selector_globus_outline"
+  case "GasSolid": assetName = "onekey_gas_solid"
+  case "RefreshCcwOutline": assetName = "onekey_refresh_ccw_outline"
+  case "CryptoCoinOutline": assetName = "onekey_crypto_coin_outline"
   case "ArrowBottomOutline": assetName = "onekey_arrow_bottom"
   case "ArrowTopOutline": assetName = "onekey_arrow_top"
   case "ChartTrendingUpOutline": assetName = "onekey_chart_trending_up"

package/ios/NativeListIdentityRenderer.swift

@@ -4,6 +4,51 @@ final class NativeListIdentityCell: NativeListRendererCell {
   override class func appliesSizePreset(_ item: NativeListItem) -> Bool {
     !["walletSidebar", "networkSelector"].contains(item.data.string("presentation"))
   }
+  private class func configureTrailingStack(
+    _ stack: NativeListAccessoryStack, descriptors: [[String: Any]]
+  ) {
+    stack.axis = .vertical
+    stack.alignment = .trailing
+    stack.spacing = 2
+    if descriptors.contains(where: { $0.string("kind") == "checkbox" })
+      && descriptors.contains(where: { $0.string("kind") == "value" })
+    {
+      stack.axis = .horizontal
+      stack.alignment = .center
+      stack.spacing = 12
+    } else if descriptors.count == 2,
+      descriptors[0].string("kind") == "valuePair",
+      (descriptors[1].string("kind") == "menu"
+        || (descriptors[1].string("kind") == "icon"
+          && descriptors[1].string("name") == "DotVerSolid"
+          && descriptors[1].string("actionKey") == "menu"))
+    {
+      stack.axis = .horizontal
+      stack.alignment = .center
+      stack.spacing = 8
+    } else if descriptors.count == 2,
+      (descriptors[0].string("kind") == "valuePair"
+        && descriptors[1].string("kind") == "chevron")
+        || (descriptors[0].string("kind") == "icon"
+          && descriptors[0].string("name") == "RefreshCcwOutline"
+          && descriptors[0].string("actionKey").isEmpty
+          && descriptors[1].string("kind") == "chevron")
+    {
+      stack.axis = .horizontal
+      stack.alignment = .center
+      stack.spacing = 12
+    } else if descriptors.count == 2,
+      descriptors[0].string("kind") == "icon",
+      descriptors[0].string("name") == "PencilOutline",
+      descriptors[1].string("kind") == "icon",
+      descriptors[1].string("name") == "DragOutline"
+    {
+      stack.axis = .horizontal
+      stack.alignment = .center
+      // Source 36-point icon frames with -7 margins need a 10-point gap.
+      stack.spacing = 10
+    }
+  }
   override class func measure(
     _ item: NativeListItem, width: CGFloat, theme: [String: Any]?, layout: String,
     fonts: NativeListFontFamilies
@@ -12,6 +57,47 @@ final class NativeListIdentityCell: NativeListRendererCell {
       return item.data.dictionaries("badges").isEmpty ? 68 : 92
     }
     if item.data.string("presentation") == "networkSelector" { return 47 }
+    if item.data.string("contentHeight") == "auto" {
+      let style = item.data.dictionary("style") ?? [:]
+      let horizontalPadding = CGFloat(style.double("horizontalPadding", default: layout == "table" ? 16 : 12))
+      let verticalPadding = CGFloat(style.double("verticalPadding", default: 8))
+      let imageWidth = CGFloat(style.dictionary("image")?.double("width", default: 40) ?? 40)
+      let imageHeight = CGFloat(style.dictionary("image")?.double("height", default: 40) ?? 40)
+      let leadingGap = CGFloat(style.double("leadingGap", default: 12))
+      let accessories = item.data.dictionaries("trailing")
+      let trailing = NativeListAccessoryStack(frame: .zero)
+      configureTrailingStack(trailing, descriptors: accessories)
+      trailing.bind(
+        item, descriptors: accessories, theme: theme, style: style,
+        defaultSpacing: trailing.spacing, checkboxState: { _, _, fallback in fallback }, fonts: fonts)
+      trailing.isHidden = false
+      let trailingSize = trailing.systemLayoutSizeFitting(UIView.layoutFittingCompressedSize)
+      let rightInset = style["horizontalPadding"] != nil
+        ? horizontalPadding : trailing.endInset ?? horizontalPadding
+      let contentGap = trailing.contentGap ?? 12
+      let textWidth = max(1,
+        width - horizontalPadding - rightInset - imageWidth - leadingGap
+          - trailingSize.width - contentGap)
+      let title = NativeListResolvedText(
+        item.data.string("title"), style: style.dictionary("title"), size: 16,
+        weight: .medium, color: .black, lineHeight: 24,
+        lines: item.data.int("titleLines", default: 1), fonts: fonts)
+      let subtitle = NativeListResolvedText(
+        item.data.string("subtitle"), style: style.dictionary("subtitle"), size: 14,
+        color: .black, lineHeight: 20,
+        lines: item.data.int("subtitleLines", default: 1),
+        breakMode: item.data.int("subtitleLines", default: 1) == 0 ? .byWordWrapping : .byTruncatingTail,
+        fonts: fonts)
+      let tertiary = NativeListResolvedText(
+        item.data.string("tertiary"), style: style.dictionary("tertiary"), size: 14,
+        color: .black, lineHeight: 20, lines: 1, fonts: fonts)
+      let textHeight = title.measure(width: textWidth)
+        + subtitle.measure(width: textWidth)
+        + tertiary.measure(width: textWidth)
+        + (item.data.string("subtitle").isEmpty ? 0 : CGFloat(style.double("lineGap", default: 0)))
+      return max(item.data.string("subtitle").isEmpty ? 56 : 60,
+        verticalPadding * 2 + max(imageHeight, textHeight, trailingSize.height))
+    }
     return !item.data.string("tertiary").isEmpty
       ? 72 : !item.data.string("subtitle").isEmpty ? 60 : 56
   }
@@ -20,6 +106,7 @@ final class NativeListIdentityCell: NativeListRendererCell {
   private let mainStack = UIStackView()
   private let titleRowStack = UIStackView()
   private let titleLabel = NativeListTextLabel()
+  private let titleIconView = UIImageView()
   private let subtitleLabel = NativeListTextLabel()
   private let tertiaryLabel = NativeListTextLabel()
   private let badgeLabel = NativeListInsetLabel()
@@ -75,7 +162,17 @@ final class NativeListIdentityCell: NativeListRendererCell {
     titleRowStack.axis = .horizontal
     titleRowStack.alignment = .center
     titleRowStack.addArrangedSubview(titleLabel)
+    titleRowStack.addArrangedSubview(titleIconView)
     titleRowStack.addArrangedSubview(badgeLabel)
+    titleIconView.translatesAutoresizingMaskIntoConstraints = false
+    let titleIconWidth = titleIconView.widthAnchor.constraint(equalToConstant: 20)
+    titleIconWidth.priority = UILayoutPriority(999)
+    NSLayoutConstraint.activate([
+      titleIconWidth,
+      titleIconView.heightAnchor.constraint(equalToConstant: 20),
+    ])
+    titleIconView.contentMode = .scaleAspectFit
+    titleIconView.setContentHuggingPriority(.required, for: .horizontal)
     [titleRowStack, subtitleLabel, tertiaryLabel].forEach(mainStack.addArrangedSubview)
     visual.translatesAutoresizingMaskIntoConstraints = false
     leadingWidth = visual.widthAnchor.constraint(equalToConstant: 40)
@@ -133,6 +230,10 @@ final class NativeListIdentityCell: NativeListRendererCell {
       titleRowStack.setCustomSpacing(UIStackView.spacingUseDefault, after: $0)
     }
     titleRowStack.spacing = 8
+    titleIconView.image = nil
+    titleIconView.isHidden = true
+    titleIconView.accessibilityLabel = nil
+    titleIconView.isAccessibilityElement = false
     titleRowStack.setContentHuggingPriority(.defaultLow, for: .horizontal)
     titleRowStack.setContentCompressionResistancePriority(.defaultHigh, for: .horizontal)
     for label in [titleLabel, subtitleLabel, tertiaryLabel, badgeLabel] {
@@ -165,6 +266,10 @@ final class NativeListIdentityCell: NativeListRendererCell {
     leadingWidth.constant = 40
     leadingHeight.constant = 40
     visual.glyphSize = 18
+    visual.bitmapBorderWidth =
+      item.data.dictionary("leading")?.string("borderColor").isEmpty == false
+      && item.data.dictionary("leading")?.string("borderStyle") != "dashed"
+      ? 1 : 0
     fallbackLabel.attributedText = nil
     fallbackLabel.font = nativeListFont(ofSize: 13, weight: .bold, fonts: fonts)
     trailingStack.reset()
@@ -175,6 +280,31 @@ final class NativeListIdentityCell: NativeListRendererCell {
     leadingActionButton.setImage(nil, for: .normal)
     bindIdentity(item, theme: theme, selected: item.data.bool("selected"), checkboxState)
     let style = item.data.dictionary("style") ?? [:]
+    if let titleIcon = item.data.dictionary("titleIcon") {
+      titleIconView.image = nativeListIcon(named: titleIcon.string("name"))
+      titleIconView.tintColor = UIColor(
+        nativeListHex: titleIcon.string("tintColor",
+          default: theme?["iconSubdued"] as? String ?? "#8D8D8D"),
+        fallback: .gray)
+      titleIconView.isHidden = false
+      let label = titleIcon.string("accessibilityLabel")
+      titleIconView.accessibilityLabel = label.isEmpty ? nil : label
+      titleIconView.isAccessibilityElement = !label.isEmpty
+      titleRowStack.setCustomSpacing(4, after: titleLabel)
+    }
+    if let ratio = style["leadingContentMaxWidthRatio"] as? NSNumber,
+      root.arrangedSubviews.contains(visual)
+    {
+      titleLabel.setContentCompressionResistancePriority(.defaultHigh, for: .horizontal)
+      let visualWidth = CGFloat(style.dictionary("image")?.double("width", default: 40) ?? 40)
+      let leadingGap = CGFloat(style.double("leadingGap", default: 12))
+      let constraint = mainStack.widthAnchor.constraint(
+        lessThanOrEqualTo: root.widthAnchor,
+        multiplier: CGFloat(ratio.doubleValue),
+        constant: -(visualWidth + leadingGap))
+      constraint.isActive = true
+      selectorConstraints.append(constraint)
+    }
     if style["horizontalPadding"] != nil {
       leftInset = CGFloat(style.double("horizontalPadding"))
       rightInset = -leftInset
@@ -196,7 +326,9 @@ final class NativeListIdentityCell: NativeListRendererCell {
       if walletBadgeLine != nil {
         mainStack.setCustomSpacing(CGFloat(style.double("titleBadgeGap")), after: titleRowStack)
       } else {
-        titleRowStack.setCustomSpacing(CGFloat(style.double("titleBadgeGap")), after: titleLabel)
+        titleRowStack.setCustomSpacing(
+          CGFloat(style.double("titleBadgeGap")),
+          after: titleIconView.isHidden ? titleLabel : titleIconView)
       }
     }
     if style["trailingGap"] != nil { trailingStack.spacing = CGFloat(style.double("trailingGap")) }
@@ -440,9 +572,37 @@ final class NativeListIdentityCell: NativeListRendererCell {
     }
     root.addArrangedSubview(mainStack)
     show(titleLabel, item.data.string("title"), lines: item.data.int("titleLines", default: 1))
+    let titleSuffixes = item.data.dictionaries("titleSuffixes")
+    if !titleSuffixes.isEmpty {
+      titleLabel.setContentCompressionResistancePriority(.defaultLow, for: .horizontal)
+      let minimumTitleWidth = titleLabel.widthAnchor.constraint(greaterThanOrEqualToConstant: 80)
+      minimumTitleWidth.priority = UILayoutPriority(751)
+      minimumTitleWidth.isActive = true
+      selectorConstraints.append(minimumTitleWidth)
+      for suffix in titleSuffixes {
+        let label = NativeListTextLabel()
+        label.font = nativeListFont(ofSize: 12, fonts: fonts)
+        label.textColor = dataTextColor(suffix.string("tone", default: "secondary"), theme: theme)
+        label.numberOfLines = 1
+        label.lineBreakMode = .byTruncatingTail
+        label.setContentHuggingPriority(.defaultHigh, for: .horizontal)
+        label.setContentCompressionResistancePriority(UILayoutPriority(749), for: .horizontal)
+        setLineHeight(label, text: suffix.string("text"), lineHeight: 16)
+        if let maxWidth = suffix["maxWidth"] as? NSNumber {
+          let limit = label.widthAnchor.constraint(lessThanOrEqualToConstant: CGFloat(truncating: maxWidth))
+          limit.isActive = true
+          selectorConstraints.append(limit)
+        }
+        titleRowStack.insertArrangedSubview(label, at: titleRowStack.arrangedSubviews.count - 1)
+        selectorViews.append(label)
+      }
+    }
     show(
       subtitleLabel, item.data.string("subtitle"), lines: item.data.int("subtitleLines", default: 1)
     )
+    if item.data.int("subtitleLines", default: 1) == 0 {
+      subtitleLabel.lineBreakMode = .byWordWrapping
+    }
     show(tertiaryLabel, item.data.string("tertiary"), lines: 1)
     if !item.data.string("subtitle").isEmpty, item.data.string("tertiary").isEmpty {
       mainStack.spacing = 0
@@ -556,32 +716,7 @@ final class NativeListIdentityCell: NativeListRendererCell {
     }
     root.addArrangedSubview(trailingStack)
     let accessories = item.data.dictionaries("trailing")
-    if accessories.contains(where: { $0.string("kind") == "checkbox" })
-      && accessories.contains(where: { $0.string("kind") == "value" })
-    {
-      trailingStack.axis = .horizontal
-      trailingStack.alignment = .center
-      trailingStack.spacing = 12
-    } else if accessories.count == 2,
-      accessories[0].string("kind") == "valuePair",
-      accessories[1].string("kind") == "menu"
-    {
-      trailingStack.axis = .horizontal
-      trailingStack.alignment = .center
-      trailingStack.spacing = 8
-    } else if accessories.count == 2,
-      accessories[0].string("kind") == "icon",
-      accessories[0].string("name") == "PencilOutline",
-      accessories[1].string("kind") == "icon",
-      accessories[1].string("name") == "DragOutline"
-    {
-      trailingStack.axis = .horizontal
-      trailingStack.alignment = .center
-      // Each source IconButton has a 36-point frame and m=-7. XStack gap=$6
-      // therefore places the physical frames 10 points apart (46-point
-      // center distance), not 24 points apart.
-      trailingStack.spacing = 10
-    }
+    Self.configureTrailingStack(trailingStack, descriptors: accessories)
     trailingStack.bind(
       item, descriptors: accessories, theme: theme, style: item.data.dictionary("style") ?? [:],
       defaultSpacing: trailingStack.spacing, checkboxState: checkboxState, fonts: fonts)
@@ -590,12 +725,13 @@ final class NativeListIdentityCell: NativeListRendererCell {
     trailingStack.isHidden = false
     if let gap = trailingStack.contentGap { root.setCustomSpacing(gap, after: mainStack) }
     if let inset = trailingStack.endInset { rightInset = -inset }
-    if item.data.string("presentation") == "accountSelector",
-      accessories.count == 1,
+    if accessories.count == 1,
+      (item.data.string("presentation") == "accountSelector"
+        || accessories[0].string("kind") == "valuePair"),
       let accessory = trailingStack.firstVisibleControl
     {
       // The vertical trailing stack has no stable intrinsic width, so keep its
-      // flexible space in the account title and subtitle column.
+      // flexible space in the title and subtitle column.
       let width = trailingStack.widthAnchor.constraint(equalTo: accessory.widthAnchor)
       width.isActive = true
       selectorConstraints.append(width)