diff --git a/VDS/Components/TextFields/EntryField/EntryField.swift b/VDS/Components/TextFields/EntryField/EntryField.swift index d5fb351b..e8643ecb 100644 --- a/VDS/Components/TextFields/EntryField/EntryField.swift +++ b/VDS/Components/TextFields/EntryField/EntryField.swift @@ -8,10 +8,11 @@ import Foundation import UIKit import VDSColorTokens +import VDSFormControlsTokens import Combine open class EntryField: Control { - + //-------------------------------------------------- // MARK: - Private Properties //-------------------------------------------------- @@ -42,7 +43,7 @@ open class EntryField: Control { $0.translatesAutoresizingMaskIntoConstraints = false } }() - + //-------------------------------------------------- // MARK: - Configuration Properties //-------------------------------------------------- @@ -62,25 +63,57 @@ open class EntryField: Control { $0.enabled.lightColor = VDSColor.elementsSecondaryOnlight $0.enabled.darkColor = VDSColor.elementsSecondaryOndark } + + internal var backgroundColorConfiguration: EntryFieldColorConfiguration = { + return EntryFieldColorConfiguration().with { + $0.enabled.lightColor = VDSFormControlsColor.backgroundOnlight + $0.enabled.darkColor = VDSFormControlsColor.backgroundOndark + $0.disabled.lightColor = VDSFormControlsColor.backgroundOnlight + $0.disabled.darkColor = VDSFormControlsColor.backgroundOndark + + //error/success doesn't care enabled/disable + $0.error.lightColor = VDSColor.feedbackErrorBackgroundOnlight + $0.error.darkColor = VDSColor.feedbackErrorBackgroundOndark + $0.success.lightColor = VDSColor.feedbackSuccessBackgroundOnlight + $0.success.darkColor = VDSColor.feedbackSuccessBackgroundOndark + + } + }() + + internal var borderColorConfiguration: EntryFieldColorConfiguration = { + return EntryFieldColorConfiguration().with { + $0.enabled.lightColor = VDSFormControlsColor.borderOnlight + $0.enabled.darkColor = VDSFormControlsColor.borderOnlight + $0.disabled.lightColor = VDSColor.interactiveDisabledOnlight + $0.disabled.darkColor = VDSColor.interactiveDisabledOndark + + //error/success doesn't care enabled/disable + $0.error.lightColor = VDSColor.feedbackErrorOnlight + $0.error.darkColor = VDSColor.feedbackErrorOndark + $0.success.lightColor = VDSColor.feedbackSuccessOnlight + $0.success.darkColor = VDSColor.feedbackSuccessOndark + } + }() + //-------------------------------------------------- // MARK: - Public Properties - //-------------------------------------------------- + //-------------------------------------------------- @Proxy(\.model.labelText) open var labelText: String? - + @Proxy(\.model.helperText) open var helperText: String? - + @Proxy(\.model.showError) open var showError: Bool - + @Proxy(\.model.errorText) open var errorText: String? - + @Proxy(\.model.showSuccess) open var showSuccess: Bool - + @Proxy(\.model.successText) open var successText: String? @@ -92,39 +125,39 @@ open class EntryField: Control { @Proxy(\.model.tooltipContent) open var tooltipContent: String? - + @Proxy(\.model.transparentBackground) open var transparentBackground: Bool - + @Proxy(\.model.width) open var width: CGFloat? - + @Proxy(\.model.maxLength) open var maxLength: Int? - + @Proxy(\.model.inputId) open var inputId: String? - + @Proxy(\.model.value) open var value: AnyHashable? - + @Proxy(\.model.defaultVaue) open var defaultValue: AnyHashable? - + @Proxy(\.model.required) open var required: Bool - + @Proxy(\.model.readOnly) open var readOnly: Bool - - + + //-------------------------------------------------- // MARK: - Constraints //-------------------------------------------------- internal var heightConstraint: NSLayoutConstraint? internal var widthConstraint: NSLayoutConstraint? internal var minWidthConstraint: NSLayoutConstraint? - + //-------------------------------------------------- // MARK: - Lifecycle //-------------------------------------------------- @@ -139,7 +172,7 @@ open class EntryField: Control { isAccessibilityElement = true accessibilityTraits = .button addSubview(stackView) - + //create the wrapping view heightConstraint = containerView.heightAnchor.constraint(greaterThanOrEqualToConstant: containerSize.height) heightConstraint?.isActive = true @@ -148,7 +181,7 @@ open class EntryField: Control { minWidthConstraint = containerView.widthAnchor.constraint(greaterThanOrEqualToConstant: 0) minWidthConstraint?.isActive = true - + containerStackView.addArrangedSubview(containerView) stackView.addArrangedSubview(titleLabel) stackView.addArrangedSubview(containerStackView) @@ -164,7 +197,7 @@ open class EntryField: Control { stackView.leadingAnchor.constraint(equalTo: leadingAnchor).isActive = true stackView.trailingAnchor.constraint(equalTo: trailingAnchor).isActive = true stackView.bottomAnchor.constraint(equalTo: bottomAnchor).isActive = true - + titleLabel.textColorConfiguration = primaryColorConfig successLabel.textColorConfiguration = primaryColorConfig errorLabel.textColorConfiguration = primaryColorConfig @@ -180,11 +213,11 @@ open class EntryField: Control { // MARK: - State //-------------------------------------------------- open override func updateView(viewModel: ModelType) { - + //update the title model if the required flag is false var titleLabelModel = viewModel.labelModel - .addOptional(required: viewModel.required, colorConfiguration: secondaryColorConfig) - + .addOptional(required: viewModel.required, colorConfiguration: secondaryColorConfig) + //tooltip action if let toolTipTitle = viewModel.tooltipTitle, let toolTipContent = viewModel.tooltipContent { let toolTipAction = PassthroughSubject() @@ -195,7 +228,7 @@ open class EntryField: Control { } titleLabel.set(with: titleLabelModel) - + //show error or success if viewModel.showError, let errorLabelModel = viewModel.errorLabelModel { errorLabel.set(with: errorLabelModel) @@ -225,12 +258,36 @@ open class EntryField: Control { } else { helperLabel.isHidden = true } - + setAccessibilityHint(!viewModel.disabled) backgroundColor = viewModel.surface.color setNeedsLayout() layoutIfNeeded() } + + //-------------------------------------------------- + // MARK: - Color Class Configurations + //-------------------------------------------------- + internal class EntryFieldColorConfiguration: DisabledSurfaceColorConfiguration { + public let error = SurfaceColorConfiguration() + public let success = SurfaceColorConfiguration() + + override func getColor(_ viewModel: ModelType) -> UIColor { + //only show error is enabled and showError == true + let showErrorColor = !viewModel.disabled && viewModel.showError + let showSuccessColor = !viewModel.disabled && viewModel.showSuccess + + if showErrorColor { + return error.getColor(viewModel) + + } else if showSuccessColor { + return success.getColor(viewModel) + + } else { + return super.getColor(viewModel) + } + } + } } extension DefaultLabelModel { diff --git a/VDS/Components/TextFields/TextEntryField/TextEntryField.swift b/VDS/Components/TextFields/TextEntryField/TextEntryField.swift index fb2255cc..f2065977 100644 --- a/VDS/Components/TextFields/TextEntryField/TextEntryField.swift +++ b/VDS/Components/TextFields/TextEntryField/TextEntryField.swift @@ -27,8 +27,10 @@ open class TextEntryFieldBase: EntryField viewModel.type.width { widthConstraint?.constant = width