diff --git a/VDS/Components/TitleLockup/TitleLockup.swift b/VDS/Components/TitleLockup/TitleLockup.swift index 9fd0f6b6..1c197470 100644 --- a/VDS/Components/TitleLockup/TitleLockup.swift +++ b/VDS/Components/TitleLockup/TitleLockup.swift @@ -46,20 +46,57 @@ open class TitleLockup: View { $0.distribution = .fill } + ///This logic applies when the type style and size used for the title and subtitle/eyebrow is exactly the same (not including the type weight). This should be automatically detected. + private var isUniformSize: Bool { + otherStandardStyle.value == titleModel?.standardStyle.value + } + //-------------------------------------------------- // MARK: - Configuration Properties //-------------------------------------------------- // Sizes are from InVision design specs. open var standardStyleConfiguration: StandardStyleConfigurationProvider = StandardStyleConfigurationProvider(styleConfigurations: [ - .init(deviceType: .iPad, - titleStandardStyles: [.titleSmall, .titleMedium], + .init(deviceType: .iPad, + titleStandardStyles: [.bodySmall], spacingConfigurations: [ - .init(otherStandardStyles: [.bodySmall, .bodyMedium, .bodyLarge], - topSpacing: VDSLayout.Spacing.space2X.value, - bottomSpacing: VDSLayout.Spacing.space2X.value) + .init(otherStandardStyles: [.bodySmall], + topSpacing: VDSLayout.Spacing.space1X.value, + bottomSpacing: VDSLayout.Spacing.space1X.value) ]), + .init(deviceType: .iPad, + titleStandardStyles: [.bodyMedium], + spacingConfigurations: [ + .init(otherStandardStyles: [.bodyMedium], + topSpacing: VDSLayout.Spacing.space1X.value, + bottomSpacing: VDSLayout.Spacing.space1X.value) + ]), + + .init(deviceType: .iPad, + titleStandardStyles: [.bodyLarge], + spacingConfigurations: [ + .init(otherStandardStyles: [.bodyLarge], + topSpacing: VDSLayout.Spacing.space1X.value, + bottomSpacing: VDSLayout.Spacing.space1X.value) + ]), + + .init(deviceType: .iPad, + titleStandardStyles: [.titleSmall], + spacingConfigurations: [ + .init(otherStandardStyles: [.bodySmall, .bodyMedium, .bodyLarge, .titleSmall], + topSpacing: VDSLayout.Spacing.space2X.value, + bottomSpacing: VDSLayout.Spacing.space2X.value) + ]), + + .init(deviceType: .iPad, + titleStandardStyles: [.titleMedium], + spacingConfigurations: [ + .init(otherStandardStyles: [.bodySmall, .bodyMedium, .bodyLarge], + topSpacing: VDSLayout.Spacing.space2X.value, + bottomSpacing: VDSLayout.Spacing.space2X.value) + ]), + .init(deviceType: .iPad, titleStandardStyles: [.titleLarge], spacingConfigurations: [ @@ -100,6 +137,30 @@ open class TitleLockup: View { bottomSpacing: VDSLayout.Spacing.space6X.value), ]), + .init(deviceType: .iPhone, + titleStandardStyles: [.bodySmall], + spacingConfigurations: [ + .init(otherStandardStyles: [.bodySmall], + topSpacing: VDSLayout.Spacing.space1X.value, + bottomSpacing: VDSLayout.Spacing.space1X.value) + ]), + + .init(deviceType: .iPhone, + titleStandardStyles: [.bodyMedium], + spacingConfigurations: [ + .init(otherStandardStyles: [.bodyMedium], + topSpacing: VDSLayout.Spacing.space1X.value, + bottomSpacing: VDSLayout.Spacing.space1X.value) + ]), + + .init(deviceType: .iPhone, + titleStandardStyles: [.bodyLarge], + spacingConfigurations: [ + .init(otherStandardStyles: [.bodyLarge], + topSpacing: VDSLayout.Spacing.space1X.value, + bottomSpacing: VDSLayout.Spacing.space1X.value) + ]), + .init(deviceType: .iPhone, titleStandardStyles: [.titleSmall], spacingConfigurations: [ @@ -152,6 +213,10 @@ open class TitleLockup: View { bottomSpacing: VDSLayout.Spacing.space6X.value) ]), ]) + + private var textColorSecondaryConfiguration = SurfaceColorConfiguration(VDSColor.elementsSecondaryOnlight , VDSColor.elementsSecondaryOnlight).eraseToAnyColorable() + + private var textColorPrimaryConfiguration = SurfaceColorConfiguration(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark).eraseToAnyColorable() //-------------------------------------------------- // MARK: - Public Properties @@ -182,6 +247,8 @@ open class TitleLockup: View { open override func setup() { super.setup() + titleLabel.textColorConfiguration = textColorPrimaryConfiguration + accessibilityElements = [eyebrowLabel, titleLabel, subTitleLabel] addSubview(stackView) @@ -223,7 +290,7 @@ open class TitleLockup: View { //-------------------------------------------------- open override func updateView() { super.updateView() - + let allLabelsTextPosition = textPosition.value var eyebrowTextIsEmpty = true var titleTextIsEmpty = true @@ -231,7 +298,7 @@ open class TitleLockup: View { var topSpacing: CGFloat = 0.0 var bottomSpacing: CGFloat = 0.0 - + //get the spacing based on the title style and other style used for eyebrow and subtitle if let titleModel, let config = standardStyleConfiguration.spacing(for: titleModel.standardStyle, otherStandardStyle: otherStandardStyle) { @@ -247,10 +314,15 @@ open class TitleLockup: View { eyebrowLabel.attributes = eyebrowModel.textAttributes eyebrowLabel.numberOfLines = eyebrowModel.numberOfLines eyebrowLabel.surface = surface + if let titleModel, isUniformSize && titleModel.isBold { + eyebrowLabel.textColorConfiguration = textColorSecondaryConfiguration + } else { + eyebrowLabel.textColorConfiguration = textColorPrimaryConfiguration + } } else { eyebrowLabel.reset() } - + if let titleModel, !titleModel.text.isEmpty { titleTextIsEmpty = false titleLabel.textPosition = allLabelsTextPosition @@ -267,11 +339,11 @@ open class TitleLockup: View { subTitleTextIsEmpty = false subTitleLabel.textPosition = allLabelsTextPosition subTitleLabel.textStyle = otherStandardStyle.value.regular + subTitleLabel.textColorConfiguration = subTitleModel.textColor == .secondary ? textColorSecondaryConfiguration : textColorPrimaryConfiguration subTitleLabel.text = subTitleModel.text subTitleLabel.attributes = subTitleModel.textAttributes subTitleLabel.numberOfLines = subTitleModel.numberOfLines subTitleLabel.surface = surface - subTitleLabel.disabled = subTitleModel.textColor == .secondary } else { subTitleLabel.reset() } diff --git a/VDS/Components/TitleLockup/TitleLockupTextStyle.swift b/VDS/Components/TitleLockup/TitleLockupTextStyle.swift index fa2aefba..0b5c7875 100644 --- a/VDS/Components/TitleLockup/TitleLockupTextStyle.swift +++ b/VDS/Components/TitleLockup/TitleLockupTextStyle.swift @@ -23,6 +23,10 @@ extension TitleLockup { case titleMedium case titleSmall + case bodyLarge + case bodyMedium + case bodySmall + public var defaultValue: TextStyle.StandardStyle {.featureXSmall } public var value: TextStyle.StandardStyle {