refactored entryfield base

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

VDS/Components/DropdownSelect/DropdownSelect.swift

@@ -72,6 +72,18 @@ open class DropdownSelect: EntryFieldBase {
     internal var minWidthDefault = 66.0
     internal var minWidthInlineLabel = 102.0
     internal var minWidth: CGFloat { showInlineLabel ? minWidthInlineLabel : minWidthDefault }
+    
+    /// The is used for the for adding the helperLabel to the right of the containerView.
+    internal var horizontalStackView: UIStackView = {
+        return UIStackView().with {
+            $0.translatesAutoresizingMaskIntoConstraints = false
+            $0.axis = .horizontal
+            $0.distribution = .fillEqually
+            $0.spacing = VDSLayout.space3X
+            $0.alignment = .top
+        }
+    }()
+
     //--------------------------------------------------
     // MARK: - Public Properties
     //--------------------------------------------------
@@ -190,14 +202,6 @@ open class DropdownSelect: EntryFieldBase {
         dropdownField.isUserInteractionEnabled = isReadOnly ? false : true
         selectedOptionLabel.surface = surface
         selectedOptionLabel.isEnabled = isEnabled
-        
-        //set the width constraints
-        let maxwidth = frame.size.width
-        if let width, width > minWidth && width < maxwidth {
-            widthConstraint?.constant = width
-        } else {
-            widthConstraint?.constant = maxwidth >= minWidth ? maxwidth : minWidth
-        }
     }
         
     /// Resets to default settings.
@@ -280,6 +284,7 @@ open class DropdownSelect: EntryFieldBase {
     
     open override func updateHelperLabel(){
         //remove first
+        secondaryStackView.removeFromSuperview()
         helperLabel.removeFromSuperview()
         
         super.updateHelperLabel()
@@ -287,14 +292,24 @@ open class DropdownSelect: EntryFieldBase {
         //set the helper label position
         if helperText != nil {
             if helperTextPlacement == .right {
-                middleStackView.spacing = VDSLayout.space3X
+                horizontalStackView.addArrangedSubview(secondaryStackView)
-                middleStackView.distribution = .fillEqually
+                horizontalStackView.addArrangedSubview(helperLabel)
-                middleStackView.addArrangedSubview(helperLabel)
+                primaryStackView.addArrangedSubview(horizontalStackView)
             } else {
-                middleStackView.spacing = 0
-                middleStackView.distribution = .fill
                 bottomContainerStackView.addArrangedSubview(helperLabel)
+                primaryStackView.addArrangedSubview(secondaryStackView)
             }
+        } else {
+            primaryStackView.addArrangedSubview(secondaryStackView)
+        }
+        
+        //set the width constraints
+        let frameWidth = frame.size.width
+        let maxwidth = helperTextPlacement == .right ? (frameWidth - horizontalStackView.spacing) / 2 : frameWidth
+        if let width, width > minWidth && width < maxwidth {
+            widthConstraint?.constant = width
+        } else {
+            widthConstraint?.constant = maxwidth >= minWidth ? maxwidth : minWidth
         }
     }
     

VDS/Components/TextFields/EntryFieldBase.swift

@@ -40,7 +40,7 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
     //--------------------------------------------------
     // MARK: - Private Properties
     //--------------------------------------------------
-    internal var stackView: UIStackView = {
+    internal var primaryStackView: UIStackView = {
         return UIStackView().with {
             $0.translatesAutoresizingMaskIntoConstraints = false
             $0.axis = .vertical
@@ -48,22 +48,23 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
             $0.alignment = .leading
         }
     }()
-
-    internal var middleStackView: UIStackView = {
-        return UIStackView().with {
-            $0.translatesAutoresizingMaskIntoConstraints = false
-            $0.axis = .horizontal
-            $0.distribution = .fill
-            $0.alignment = .top
-        }
-    }()
     
+    internal let secondaryStackView = UIStackView().with {
+        $0.translatesAutoresizingMaskIntoConstraints = false
+        $0.axis = .vertical
+        $0.distribution = .fill
+    }
+    
+    /// This is the view that will be wrapped with the border for userInteraction.
     internal var containerView: UIView = {
         return UIView().with {
             $0.translatesAutoresizingMaskIntoConstraints = false
         }
     }()
     
+    /// This is a horizontal Stack View that is placed inside the containterView (bordered view)
+    /// The first arrangedView will be the view from getFieldContainer()
+    /// The second view is the statusIcon.
     internal var fieldStackView: UIStackView = {
         return UIStackView().with {
             $0.translatesAutoresizingMaskIntoConstraints = false
@@ -73,6 +74,7 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
         }
     }()
     
+    /// This is a vertical stack used for the errorLabel and helperLabel.
     internal var bottomContainerStackView: UIStackView = {
         return UIStackView().with {
             $0.translatesAutoresizingMaskIntoConstraints = false
@@ -207,22 +209,14 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
         super.setup()
                 
         isAccessibilityElement = false
-        addSubview(stackView)
+        addSubview(primaryStackView)
         
         //create the wrapping view
         heightConstraint = containerView.heightGreaterThanEqualTo(constant: containerSize.height)
         widthConstraint = containerView.width(constant: 0)
         
-        let leftStackView = UIStackView().with {
+        secondaryStackView.addArrangedSubview(containerView)
-            $0.translatesAutoresizingMaskIntoConstraints = false
+        secondaryStackView.setCustomSpacing(8, after: containerView)
-            $0.axis = .vertical
-            $0.distribution = .fill
-        }
-        leftStackView.addArrangedSubview(containerView)
-        leftStackView.setCustomSpacing(8, after: containerView)
-
-        //add the containerView to the middleStack
-        middleStackView.addArrangedSubview(leftStackView)
 
         //add ContainerStackView
         //this is the horizontal stack that contains
@@ -246,13 +240,13 @@ open class EntryFieldBase: Control, Changeable, FormFieldInternalValidatable {
         bottomContainerStackView.addArrangedSubview(errorLabel)
         bottomContainerStackView.addArrangedSubview(helperLabel)
         
-        stackView.addArrangedSubview(titleLabel)
+        primaryStackView.addArrangedSubview(titleLabel)
-        stackView.addArrangedSubview(middleStackView)
+        primaryStackView.addArrangedSubview(secondaryStackView)
-        leftStackView.addArrangedSubview(bottomContainer)
+        secondaryStackView.addArrangedSubview(bottomContainer)
 
-        stackView.setCustomSpacing(4, after: titleLabel)
+        primaryStackView.setCustomSpacing(4, after: titleLabel)
 
-        stackView
+        primaryStackView
             .pinTop()
             .pinLeading()
             .pinTrailing(0, .defaultHigh)

VDS/Components/TextFields/InputField/FieldTypes/FieldType.swift

@@ -80,14 +80,6 @@ extension InputField {
                 inputField.fieldStackView.setCustomSpacing(0, after: inputField.statusIcon)
             }
 
-            //set the width constraints
-            let maxwidth = inputField.frame.size.width
-            if let width = inputField.width, width > minWidth && width < maxwidth {
-                inputField.widthConstraint?.constant = width
-            } else {
-                inputField.widthConstraint?.constant = maxwidth >= minWidth ? maxwidth : minWidth
-            }
-            
             //placeholder
             inputField.textField.placeholder = placeholderText
         

VDS/Components/TextFields/InputField/InputField.swift

@@ -36,6 +36,17 @@ open class InputField: EntryFieldBase {
     //--------------------------------------------------
     internal var titleLabelWidthConstraint: NSLayoutConstraint?
 
+    /// The is used for the for adding the helperLabel to the right of the containerView.
+    internal var horizontalStackView: UIStackView = {
+        return UIStackView().with {
+            $0.translatesAutoresizingMaskIntoConstraints = false
+            $0.axis = .horizontal
+            $0.distribution = .fillEqually
+            $0.spacing = VDSLayout.space3X
+            $0.alignment = .top
+        }
+    }()
+
     //--------------------------------------------------
     // MARK: - Public FieldType Properties
     //--------------------------------------------------
@@ -173,8 +184,8 @@ open class InputField: EntryFieldBase {
                 
         textField.heightAnchor.constraint(equalToConstant: 20).isActive = true
         textField.delegate = self
-        stackView.addArrangedSubview(successLabel)
+        primaryStackView.addArrangedSubview(successLabel)
-        stackView.setCustomSpacing(8, after: successLabel)
+        primaryStackView.setCustomSpacing(8, after: successLabel)
         
         fieldStackView.addArrangedSubview(actionTextLink)
         
@@ -248,6 +259,7 @@ open class InputField: EntryFieldBase {
     }
     open override func updateHelperLabel(){
         //remove first
+        secondaryStackView.removeFromSuperview()
         helperLabel.removeFromSuperview()
         
         super.updateHelperLabel()
@@ -255,14 +267,25 @@ open class InputField: EntryFieldBase {
         //set the helper label position
         if helperText != nil {
             if helperTextPlacement == .right {
-                middleStackView.spacing = VDSLayout.space3X
+                horizontalStackView.addArrangedSubview(secondaryStackView)
-                middleStackView.distribution = .fillEqually
+                horizontalStackView.addArrangedSubview(helperLabel)
-                middleStackView.addArrangedSubview(helperLabel)
+                primaryStackView.addArrangedSubview(horizontalStackView)
             } else {
-                middleStackView.spacing = 0
-                middleStackView.distribution = .fill
                 bottomContainerStackView.addArrangedSubview(helperLabel)
+                primaryStackView.addArrangedSubview(secondaryStackView)
             }
+        } else {
+            primaryStackView.addArrangedSubview(secondaryStackView)
+        }
+        
+        //set the width constraints
+        let minWidth = fieldType.handler().minWidth
+        let frameWidth = frame.size.width
+        let maxwidth = helperTextPlacement == .right ? (frameWidth - horizontalStackView.spacing) / 2 : frameWidth
+        if let width, width > minWidth && width < maxwidth {
+            widthConstraint?.constant = width
+        } else {
+            widthConstraint?.constant = maxwidth >= minWidth ? maxwidth : minWidth
         }
     }