Rewrite TwoLineTitleView to use autolayout

ios/FluentUI.Demo/FluentUI.Demo/Demos/TwoLineTitleViewDemoController.swift

@@ -8,15 +8,17 @@ import UIKit
 
 class TwoLineTitleViewDemoController: DemoController {
     private typealias UINavigationItemModifier = (UINavigationItem) -> Void
-    private typealias TwoLineTitleViewFactory = () -> TwoLineTitleView
+    private typealias TwoLineTitleViewFactory = (_ forBottomSheet: Bool) -> TwoLineTitleView
 
-    private static func createDemoTitleView() -> TwoLineTitleView {
+    private static func createDemoTitleView(forBottomSheet: Bool) -> TwoLineTitleView {
         let twoLineTitleView = TwoLineTitleView()
 
-        // Give it a visible margin so we can confirm it centers properly
-        twoLineTitleView.widthAnchor.constraint(equalToConstant: 200).isActive = true
-        twoLineTitleView.layer.borderWidth = GlobalTokens.stroke(.width10)
-        twoLineTitleView.layer.borderColor = GlobalTokens.neutralColor(.grey50).cgColor
+        if !forBottomSheet {
+            // Give it a visible margin so we can confirm it centers properly
+            twoLineTitleView.widthAnchor.constraint(equalToConstant: 200).isActive = true
+            twoLineTitleView.layer.borderWidth = GlobalTokens.stroke(.width10)
+            twoLineTitleView.layer.borderColor = GlobalTokens.neutralColor(.grey50).cgColor
+        }
 
         return twoLineTitleView
     }
@@ -30,7 +32,7 @@ class TwoLineTitleViewDemoController: DemoController {
                                               animatesWhenPressed: Bool = true,
                                               accessoryType: TwoLineTitleView.AccessoryType = .none) -> TwoLineTitleViewFactory {
         return {
-            let twoLineTitleView = createDemoTitleView()
+            let twoLineTitleView = createDemoTitleView(forBottomSheet: $0)
             twoLineTitleView.setup(title: title,
                                    titleImage: titleImage,
                                    subtitle: subtitle,
@@ -48,17 +50,6 @@ class TwoLineTitleViewDemoController: DemoController {
         return navigationItem
     }
 
-    private static func makeNavigationTitleView(_ navigationItemModifier: UINavigationItemModifier) -> TwoLineTitleView {
-        let twoLineTitleView = createDemoTitleView()
-
-        let aNavigationItem = UINavigationItem()
-        navigationItemModifier(aNavigationItem)
-
-        twoLineTitleView.setup(navigationItem: aNavigationItem)
-
-        return twoLineTitleView
-    }
-
     private let exampleSetupFactories: [TwoLineTitleViewFactory] = [
         makeStandardTitleView(title: "Title here", subtitle: "Optional subtitle", animatesWhenPressed: false),
         makeStandardTitleView(title: "Custom image", titleImage: UIImage(named: "ic_fluent_star_16_regular"), animatesWhenPressed: false),
@@ -102,7 +93,7 @@ class TwoLineTitleViewDemoController: DemoController {
         addTitle(text: "Made by calling TwoLineTitleView.setup(...)")
         exampleSetupFactories.enumerated().forEach {
             (offset, element) in
-            let twoLineTitleView = element()
+            let twoLineTitleView = element(false)
             allExamples.append(twoLineTitleView)
 
             let button = Button()
@@ -116,7 +107,7 @@ class TwoLineTitleViewDemoController: DemoController {
         addTitle(text: "Made from UINavigationItem")
         exampleNavigationItems.enumerated().forEach {
             (offset, navigationItem) in
-            let twoLineTitleView = Self.createDemoTitleView()
+            let twoLineTitleView = Self.createDemoTitleView(forBottomSheet: false)
             twoLineTitleView.setup(navigationItem: navigationItem)
             allExamples.append(twoLineTitleView)
 
@@ -136,7 +127,7 @@ class TwoLineTitleViewDemoController: DemoController {
     }
 
     @objc private func setupButtonWasTapped(sender: UIButton) {
-        let titleView = exampleSetupFactories[sender.tag]()
+        let titleView = exampleSetupFactories[sender.tag](true)
         showBottomSheet(with: titleView)
     }
 
@@ -147,6 +138,7 @@ class TwoLineTitleViewDemoController: DemoController {
         // There can be multiple of these on screen at the same time. All the currently presented transient sheets
         // are tracked in presentedTransientSheets.
         let secondarySheetController = BottomSheetController(headerContentView: titleView, expandedContentView: sheetContentView)
+        secondarySheetController.headerContentHeight = 44
         secondarySheetController.collapsedContentHeight = 100
         secondarySheetController.isHidden = true
         secondarySheetController.shouldAlwaysFillWidth = false

ios/FluentUI/EasyTapButton/EasyTapButton.swift

@@ -9,7 +9,9 @@ import UIKit
 
 @objc(MSFEasyTapButton)
 open class EasyTapButton: UIButton {
-    var minTapTargetSize = CGSize(width: 44.0, height: 44.0)
+    static let minimumTouchSize = CGSize(width: 44, height: 44)
+
+    var minTapTargetSize: CGSize = minimumTouchSize
 
     open override func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
         let growX = max(0, (minTapTargetSize.width - bounds.size.width) / 2)

ios/FluentUI/Label/Label.swift

@@ -12,10 +12,10 @@ import UIKit
 open class Label: UILabel, TokenizedControlInternal {
     @objc open var colorStyle: TextColorStyle = .regular {
         didSet {
-            labelTextColor = nil
             updateTextColor()
         }
     }
+
     @objc open var style: AliasTokens.TypographyTokens {
         get {
             return AliasTokens.TypographyTokens(rawValue: textStyle.rawValue)!
@@ -24,9 +24,9 @@ open class Label: UILabel, TokenizedControlInternal {
             self.textStyle = FluentTheme.TypographyToken(rawValue: newValue.rawValue)!
         }
     }
+
     @objc open var textStyle: FluentTheme.TypographyToken = .body1 {
         didSet {
-            labelFont = nil
             updateFont()
         }
     }
@@ -43,16 +43,20 @@ open class Label: UILabel, TokenizedControlInternal {
     }
 
     open override var textColor: UIColor! {
-        didSet {
-            labelTextColor = textColor
-            updateTextColor()
+        get {
+            return tokenSet[.textColor].uiColor
+        }
+        set {
+            tokenSet[.textColor] = .uiColor { newValue }
         }
     }
 
     open override var font: UIFont! {
-        didSet {
-            labelFont = font
-            updateFont()
+        get {
+            return tokenSet[.font].uiFont
+        }
+        set {
+            tokenSet[.font] = .uiFont { newValue }
         }
     }
 
@@ -103,9 +107,9 @@ open class Label: UILabel, TokenizedControlInternal {
     }
 
     private func initialize() {
-        // textColor and font are assigned in super.init to a default value and so we need to reset our cache afterwards
-        labelTextColor = nil
-        labelFont = nil
+        // textColor and font in the tokenSet are assigned in super.init to a default value and so we need to remove the override
+        tokenSet.removeOverride(.textColor)
+        tokenSet.removeOverride(.font)
 
         updateFont()
         updateTextColor()
@@ -129,7 +133,7 @@ open class Label: UILabel, TokenizedControlInternal {
             return
         }
 
-        let labelFont = labelFont ?? tokenSet[.font].uiFont
+        let labelFont = tokenSet[.font].uiFont
         if maxFontSize > 0 && labelFont.pointSize > maxFontSize {
             super.font = labelFont.withSize(maxFontSize)
         } else {
@@ -142,17 +146,14 @@ open class Label: UILabel, TokenizedControlInternal {
         guard !isUsingCustomAttributedText else {
             return
         }
-        super.textColor = labelTextColor ?? tokenSet[.textColor].uiColor
+        super.textColor = tokenSet[.textColor].uiColor
     }
 
     @objc private func handleContentSizeCategoryDidChange() {
         if adjustsFontForContentSizeCategory {
-            labelFont = nil
             updateFont()
         }
     }
 
-    private var labelTextColor: UIColor?
-    private var labelFont: UIFont?
     private var isUsingCustomAttributedText: Bool = false
 }

ios/FluentUI/Navigation/NavigationBar.swift

@@ -855,9 +855,7 @@ open class NavigationBar: UINavigationBar, TokenizedControlInternal, TwoLineTitl
             customTitleView.delegate = self
         }
 
-        // For the time being, we need to embed the TwoLineTitleView inside a UIStackView
-        // in order to make its labels resize properly according to content size changes.
-        navigationItem.titleView = UIStackView(arrangedSubviews: [customTitleView])
+        navigationItem.titleView = customTitleView
     }
 
     // MARK: Content expansion/contraction

ios/FluentUI/Resources/FluentUI-ios.xcassets/chevron-down-12x12.imageset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "images" : [
+    {
+      "filename" : "ic_fluent_chevron_down_12_filled.pdf",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

ios/FluentUI/Resources/FluentUI-ios.xcassets/chevron-down-16x16.imageset/Contents.json

@@ -0,0 +1,15 @@
+{
+  "images" : [
+    {
+      "filename" : "ic_fluent_chevron_down_16_filled.pdf",
+      "idiom" : "universal"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  },
+  "properties" : {
+    "template-rendering-intent" : "template"
+  }
+}

ios/FluentUI/Resources/FluentUI-ios.xcassets/chevron-right-20x20.imageset/Contents.json → ios/FluentUI/Resources/FluentUI-ios.xcassets/chevron-right-12x12.imageset/Contents.json

@@ -1,16 +1,16 @@
 {
   "images" : [
     {
+      "filename" : "ic_fluent_chevron_right_12_filled.pdf",
       "idiom" : "universal",
-      "filename" : "ic_chevron_right_20_outlined.pdf",
       "language-direction" : "left-to-right"
     }
   ],
   "info" : {
-    "version" : 1,
-    "author" : "xcode"
+    "author" : "xcode",
+    "version" : 1
   },
   "properties" : {
     "template-rendering-intent" : "template"
   }
-}
+}

ios/FluentUI/Resources/FluentUI-ios.xcassets/chevron-down-20x20.imageset/Contents.json → ios/FluentUI/Resources/FluentUI-ios.xcassets/chevron-right-16x16.imageset/Contents.json

@@ -1,15 +1,16 @@
 {
   "images" : [
     {
+      "filename" : "ic_fluent_chevron_right_16_filled.pdf",
       "idiom" : "universal",
-      "filename" : "ic_chevron_down_20_outlined.pdf"
+      "language-direction" : "left-to-right"
     }
   ],
   "info" : {
-    "version" : 1,
-    "author" : "xcode"
+    "author" : "xcode",
+    "version" : 1
   },
   "properties" : {
     "template-rendering-intent" : "template"
   }
-}
+}

ios/FluentUI/TwoLineTitleView/TwoLineTitleView.resources.xcfilelist

@@ -1,2 +1,4 @@
-chevron-down-20x20.imageset
-chevron-right-20x20.imageset
+chevron-down-12x12.imageset
+chevron-down-16x16.imageset
+chevron-right-12x12.imageset
+chevron-right-16x16.imageset