fixed issue with tilet percentage

Signed-off-by: Matt Bruce <matt.bruce@verizon.com>

VDS/Components/TileContainer/TileContainer.swift

@@ -287,9 +287,11 @@ open class TileContainer: Control {
         }
     }
     
-    public func addContentView(_ view: UIView) {
+    public func addContentView(_ view: UIView, shouldPin: Bool = true) {
         containerView.addSubview(view)
-        view.pinToSuperView()
+        if shouldPin {
+            view.pinToSuperView()
+        }
     }
     
     class BackgroundColorConfiguration: ObjectColorable {

VDS/Components/Tilet/Tilet.swift

@@ -36,7 +36,7 @@ public enum TiletOtherTypographicalStyle: String, Codable, EnumSubset {
 
 
 @objc(VDSTilet)
-open class Tilet: TileContainer {
+open class Tilet: View {
     
     //--------------------------------------------------
     // MARK: - Initializers
@@ -56,21 +56,15 @@ open class Tilet: TileContainer {
         initialSetup()
     }
     //--------------------------------------------------
-    // MARK: - Public Properties
+    // MARK: - Private Properties
     //--------------------------------------------------
-    private var titleLockup = TitleLockup()
+    private var tileContainer = TileContainer().with {
-    open override var surface: Surface {
+        $0.aspectRatio = .none
-        didSet {
+        $0.surface = .light
-            //flip the color
-            let flippedColor:ContainerBackgroundColor = surface == .dark ? .white : .black
-            containerBackgroundColor = flippedColor
-                    
-            //flip the surface for the titleLockup
-            let flippedSurface: Surface = surface == .dark ? .light : .dark
-            titleLockup.surface = flippedSurface
-        }
     }
     
+    private var titleLockup = TitleLockup()
+    
     //--------------------------------------------------
     // MARK: - Public Properties
     //--------------------------------------------------
@@ -78,6 +72,43 @@ open class Tilet: TileContainer {
     open var titleTypograpicalStyle: TiletTitleTypographicalStyle = .BoldTitleSmall { didSet { didChange() }}
     open var otherTypograpicalStyle: TiletOtherTypographicalStyle = .BodySmall { didSet { didChange() }}
 
+    open var width: CGFloat = 100 { didSet { didChange() }}
+    
+    private var _textWidth: CGFloat?
+    open var textWidth: CGFloat? {
+        get { _textWidth }
+        set {
+            if let newValue, newValue > 44.0 && newValue <= width {
+                _textWidth = newValue
+                if _textPercentage != nil {
+                    _textPercentage = nil
+                }
+            } else {
+                _textWidth = nil
+            }
+            print("_textWidth: \(_textWidth)")
+            didChange()
+        }
+        
+    }
+    
+    private var _textPercentage: CGFloat?
+    open var textPercentage: CGFloat? {
+        get { _textPercentage }
+        set {
+            if let newValue, newValue >= 5 && newValue <= 100.0 {
+                _textPercentage = newValue
+                if textWidth != nil {
+                    _textWidth = nil
+                }
+            } else {
+                _textPercentage = nil
+            }
+            print("_textPercentage: \(_textPercentage)")
+            didChange()
+        }
+    }
+    
     //text
     open var titleText: String = "" { didSet { didChange() }}
     open var titleTextAttributes: [any LabelAttributeModel]? { didSet { didChange() }}
@@ -90,7 +121,8 @@ open class Tilet: TileContainer {
     //--------------------------------------------------
     // MARK: - Constraints
     //--------------------------------------------------
-    internal var contentViewWithConstraint: NSLayoutConstraint?
+    internal var titleLockupWidthConstraint: NSLayoutConstraint?
+    internal var titleLockupTrailingConstraint: NSLayoutConstraint?
     //functions
     //--------------------------------------------------
     // MARK: - Lifecycle
@@ -98,14 +130,24 @@ open class Tilet: TileContainer {
     
     open override func setup() {
         super.setup()
-        aspectRatio = .none
+        addSubview(tileContainer)
-        surface = .light
+        tileContainer.pinToSuperView()
-        addContentView(titleLockup)
+        tileContainer.addContentView(titleLockup, shouldPin: false)
-        titleLockup.pinToSuperView()
+        titleLockup.pinTop()
+        titleLockup.pinLeading()
+        titleLockup.pinBottom()
+        
+        //either you are 100% width of the tileContainer.contentView
+        titleLockupTrailingConstraint = titleLockup.trailingAnchor.constraint(equalTo: tileContainer.containerView.trailingAnchor)
+        titleLockupTrailingConstraint?.isActive = true
     }
     
     public override func reset() {
         super.reset()
+        tileContainer.reset()
+        tileContainer.aspectRatio = .none
+        tileContainer.surface = .light
+
         titleLockup.reset()
         
         titleText = ""
@@ -122,6 +164,40 @@ open class Tilet: TileContainer {
     open override func updateView() {
         super.updateView()
         
+        //flip the color
+        let flippedColor:TileContainer.ContainerBackgroundColor = surface == .dark ? .white : .black
+        tileContainer.containerBackgroundColor = flippedColor
+        tileContainer.width = width
+        
+        //flip the surface for the titleLockup
+        let flippedSurface: Surface = surface == .dark ? .light : .dark
+        titleLockup.surface = flippedSurface
+        
+        //either use textWidth
+        if let textWidth {
+            titleLockupTrailingConstraint?.isActive = false
+            titleLockupWidthConstraint?.isActive = false
+            titleLockupWidthConstraint = titleLockup.widthAnchor.constraint(equalToConstant: textWidth)
+            titleLockupWidthConstraint?.isActive = true
+            
+        } else if let textPercentage {
+            titleLockupTrailingConstraint?.isActive = false
+            titleLockupWidthConstraint?.isActive = false
+            titleLockupWidthConstraint = NSLayoutConstraint(item: titleLockup,
+                                                               attribute: .width,
+                                                               relatedBy: .equal,
+                                                               toItem: tileContainer.containerView,
+                                                               attribute: .width,
+                                                               multiplier: textPercentage / 100,
+                                                               constant: 0.0)
+            titleLockupWidthConstraint?.isActive = true
+
+        } else {
+            titleLockupWidthConstraint?.isActive = false
+            titleLockupTrailingConstraint?.isActive = true
+            
+        }
+        
         titleLockup.titleText = titleText
         titleLockup.titleTypograpicalStyle = titleTypograpicalStyle.value
         titleLockup.titleTextAttributes = titleTextAttributes