diff --git a/VDSSample/Classes/ColorPickerView.swift b/VDSSample/Classes/ColorPickerView.swift index 237380d..7f09ab1 100644 --- a/VDSSample/Classes/ColorPickerView.swift +++ b/VDSSample/Classes/ColorPickerView.swift @@ -9,14 +9,18 @@ import Foundation import UIKit import VDS -public class ColorPickerView: UIStackView { - public var pickerType: EnumType +public class ColorPickerView: UIStackView, UIColorPickerViewControllerDelegate { public var selectedColor: UIColor? { didSet { selectedColorView.backgroundColor = selectedColor } } - + + private var colorPicker: UIColorPickerViewController = { + let picker = UIColorPickerViewController() + return picker + }() + var selectedColorView: UIView = { let view = UIView() view.translatesAutoresizingMaskIntoConstraints = false @@ -31,25 +35,30 @@ public class ColorPickerView: UIStackView { $0.text = "Select" } - public init(with pickerType: EnumType, color: UIColor? = nil, onClick: @escaping (ColorPickerView)->Void) { - self.pickerType = pickerType + /// Callback once the user picks a color from the picker. + public var onColorSelected: ((UIColor) -> Void)? + + public init(color: UIColor? = nil) { super.init(frame: .zero) if let color { selectedColor = color } + colorPicker.delegate = self setup() - button.onClick = { _ in onClick(self) } + button.onClick = { _ in + UIApplication.topViewController()?.present(self.colorPicker, animated: true) + } } - + required init(coder: NSCoder) { - fatalError() + fatalError("init(coder:) has not been implemented") } - + private func setup() { distribution = .fillEqually alignment = .fill spacing = 10 - + let indicatorWrapper = View() indicatorWrapper.addSubview(selectedColorView) indicatorWrapper.height(32) @@ -57,8 +66,9 @@ public class ColorPickerView: UIStackView { indicatorWrapper.pinLeading() indicatorWrapper.pinBottom() indicatorWrapper.pinTrailingGreaterThanOrEqualTo(anchor: indicatorWrapper.trailingAnchor) - + addArrangedSubview(indicatorWrapper) + let buttonWrapper = View() buttonWrapper.addSubview(button) buttonWrapper.height(32) @@ -68,4 +78,15 @@ public class ColorPickerView: UIStackView { button.pinLeadingGreaterThanOrEqualTo(anchor: buttonWrapper.leadingAnchor) addArrangedSubview(buttonWrapper) } + + // MARK: - UIColorPickerViewControllerDelegate + + public func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) { + selectedColor = viewController.selectedColor + onColorSelected?(viewController.selectedColor) + } + + public func colorPickerViewControllerDidFinish(_ viewController: UIColorPickerViewController) { + UIApplication.topViewController()?.dismiss(animated: true) + } } diff --git a/VDSSample/Classes/TokenColorPickerFormSection.swift b/VDSSample/Classes/TokenColorPickerFormSection.swift index 6260f17..4421ac1 100644 --- a/VDSSample/Classes/TokenColorPickerFormSection.swift +++ b/VDSSample/Classes/TokenColorPickerFormSection.swift @@ -9,33 +9,14 @@ import Foundation import UIKit import VDS - -/// This is a Helper FormSection class that deals with Enums that deal with "Token" and "Custom" color pickers. -/// Then Enum passed into the generic MUST has a case that includes "token" and "custom" values public class TokenColorPickerSection: FormSection where EnumType.RawValue == String { - //TODO: Remove once this is refactored out. - - public enum ColorPicker { case none } //-------------------------------------------------- // MARK: - Private Properties //-------------------------------------------------- private var picker: UIPickerView - private lazy var colorPicker: UIColorPickerViewController = { - let picker = UIColorPickerViewController() - picker.delegate = pickerHandler - return picker - }() - - private lazy var pickerHandler = { - PickerHandler().with { - $0.onSelectedColor = { [weak self] color in - guard let self else { return } - customColorView.selectedColor = color - onColorSelected?(color) - } - } - }() + private var rowTitle: String = "Color" + private var rowToolTip: Tooltip.TooltipModel? ///Handles VDS Color Selections private var tokenColorRow: UIView? @@ -45,15 +26,14 @@ public class TokenColorPickerSection: items: UIColor.VDSColor.allCases) .with { $0.text = UIColor.VDSColor.paletteBlack.rawValue } }() - + ///Handles Custom Color picker selections private var customColorRow: UIView? - private lazy var customColorView: ColorPickerView = { - return .init(with: ColorPicker.none, color: .black) { [weak self] picker in - guard let self else { return } - if let selectedColor = picker.selectedColor{ - colorPicker.selectedColor = selectedColor - UIApplication.topViewController()?.present(colorPicker, animated: true) + private lazy var customColorView: ColorPickerView = { + .init(color: .black).with { + $0.onColorSelected = { [weak self] color in + guard let self else { return } + onColorSelected?(color) } } }() @@ -61,16 +41,16 @@ public class TokenColorPickerSection: //-------------------------------------------------- // MARK: - Public Properties //-------------------------------------------------- - + /// This is the 1st row that the user will pick from, again this enum has to contain "token" and "custom" otherwise it won't work well. public lazy var pickerSelectorView = { PickerSelectorView(title: "", picker: picker, items: EnumType.allCases as! [EnumType]) }() - + public var selectedItem: EnumType { pickerSelectorView.selectedItem } - + /// Callback for a non-token/non-color selection public var onSelected: ((EnumType) -> Void)? /// Callback after "token" is selected from the VDSColor array @@ -78,62 +58,50 @@ public class TokenColorPickerSection: /// Callback once the user picks a color from the picker. public var onColorSelected: ((UIColor) -> Void)? - public var rowTitle: String = "Color" ///Pass in a title and the reference for the picker - public init(title: String? = nil, rowTitle: String = "Color", picker: UIPickerView) { + public init(title: String? = nil, rowTitle: String = "Color", rowTooltip: Tooltip.TooltipModel? = nil, picker: UIPickerView) { self.picker = picker super.init(frame: .zero) self.title = title self.rowTitle = rowTitle + self.rowToolTip = rowTooltip setup() } - + required init(coder: NSCoder) { fatalError("init(coder:) has not been implemented") } - - public func setup() { - addFormRow(label: rowTitle, view: pickerSelectorView) + public func setup() { + addFormRow(label: rowTitle, tooltip: rowToolTip, view: pickerSelectorView) tokenColorRow = addFormRow(label: "Token", view: tokenColorView) customColorRow = addFormRow(label: "Custom", view: customColorView) - + tokenColorRow?.isHidden = true customColorRow?.isHidden = true - + pickerSelectorView.onPickerDidSelect = { [weak self] item in guard let self else { return } let isToken = item.rawValue == "token" let isCustom = item.rawValue == "custom" - if isToken { - onTokenSelected?(tokenColorView.selectedItem) - } else if let selectedItem = customColorView.selectedColor, isCustom { - onColorSelected?(selectedItem) + if isToken { + self.onTokenSelected?(self.tokenColorView.selectedItem) + } else if let selectedItem = self.customColorView.selectedColor, isCustom { + self.onColorSelected?(selectedItem) } else { - onSelected?(item) + self.onSelected?(item) } - tokenColorRow?.isHidden = !isToken - customColorRow?.isHidden = !isCustom + self.tokenColorRow?.isHidden = !isToken + self.customColorRow?.isHidden = !isCustom } - - tokenColorView.onPickerDidSelect = { [weak self] item in + + tokenColorView.onPickerDidSelect = { [weak self] item in guard let self else { return } - onTokenSelected?(item) + self.onTokenSelected?(item) } } - + public func setDefault(value: EnumType) { pickerSelectorView.set(item: value) } - - private class PickerHandler: NSObject, UIColorPickerViewControllerDelegate { - var onSelectedColor: ((UIColor) -> Void)! - func colorPickerViewControllerDidFinish(_ viewController: UIColorPickerViewController) { - UIApplication.topViewController()?.dismiss(animated: true) - } - - func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) { - onSelectedColor(viewController.selectedColor) - } - } } diff --git a/VDSSample/ViewControllers/ButtonIconViewController.swift b/VDSSample/ViewControllers/ButtonIconViewController.swift index 1a022a9..24c2738 100644 --- a/VDSSample/ViewControllers/ButtonIconViewController.swift +++ b/VDSSample/ViewControllers/ButtonIconViewController.swift @@ -76,34 +76,36 @@ class ButtonIconViewController: BaseViewController { setupModel() } - var badgeIndicatorFormStackView = FormSection().with { $0.isHidden = true } + var badgeIndicatorFormStackView = FormSection().with { $0.isHidden = true; $0.title = "Badge Indicator" } ///ColorPicker - var colorPickerType: ColorPickerType = .light - enum ColorPickerType { - case light, dark - } - - lazy var colorPicker: UIColorPickerViewController = { - let picker = UIColorPickerViewController() - picker.delegate = self - return picker - }() - - lazy var lightColorPicker: ColorPickerView = { - return .init(with: ColorPickerType.light) {[weak self] picker in - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) + lazy var lightColorPicker: ColorPickerView = { + return .init().with { + $0.onColorSelected = { [weak self] _ in + guard let self else { return } + updateColors() + } } }() - + lazy var darkColorPicker: ColorPickerView = { - return .init(with: ColorPickerType.dark) {[weak self] picker in - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) + return .init().with { + $0.onColorSelected = { [weak self] _ in + guard let self else { return } + updateColors() + } } }() + func updateColors() { + if let selectedLightColor = lightColorPicker.selectedColor { + component.selectedIconColorConfiguration = .init(selectedLightColor, selectedLightColor) + } else if let selectedDarkColor = darkColorPicker.selectedColor, + let selectedLightColor = lightColorPicker.selectedColor { + component.selectedIconColorConfiguration = .init(selectedLightColor, selectedDarkColor) + } + } + override func setupForm(){ super.setupForm() addFormRow(label: "Disabled", view: disabledSwitch, pinTrailing: false) @@ -111,21 +113,25 @@ class ButtonIconViewController: BaseViewController { addFormRow(label: "Surface Type", view: surfaceTypePickerSelectorView) addFormRow(label: "Size", view: sizePickerSelectorView) addFormRow(label: "Kind", view: kindPickerSelectorView) - addFormRow(label: "Selected Light", view: lightColorPicker) - addFormRow(label: "Selected Dark", view: darkColorPicker) addFormRow(label: "Floating", view: floating, pinTrailing: false) addFormRow(label: "Hide Border", view: hideBorder, pinTrailing: false) addFormRow(label: "Fit To Icon", view: fitToIcon, pinTrailing: false) addFormRow(label: "Name", view: namePickerSelectorView) - addFormRow(label: "Selected Icon Name", view: selectedIconNamePickerSelectorView) - addFormRow(label: "Selectable", view: selectableSwitch, pinTrailing: false) addFormRow(label: "X Offset", view: centerX) addFormRow(label: "Y Offset", view: centerY) + + append(section: .init().with { + $0.title = "Select State" + $0.addFormRow(label: "Selectable", view: selectableSwitch, pinTrailing: false) + $0.addFormRow(label: "Selected Icon Name", view: selectedIconNamePickerSelectorView) + $0.addFormRow(label: "Selected Light", view: lightColorPicker) + $0.addFormRow(label: "Selected Dark", view: darkColorPicker) + }) - //badgeIndicator section addFormRow(label: "Show Badge Indicator", view: badgeIndicatorSwitch, pinTrailing: false) + //badgeIndicator section badgeIndicatorFormStackView.addFormRow(label: "Expand Direction", view: badgeIndicatorExpandDirectionPickerSelectorView) - badgeIndicatorFormStackView.addFormRow(label: "Badge Variants", view: variantOneSwitch) + badgeIndicatorFormStackView.addFormRow(label: "Badge Variants", view: variantOneSwitch, pinTrailing: false) badgeIndicatorFormStackView.addFormRow(label: "Custom X offset", view: customBadgeIndicatorXField) badgeIndicatorFormStackView.addFormRow(label: "Custom Y offset", view: customBadgeIndicatorYField) @@ -218,7 +224,8 @@ class ButtonIconViewController: BaseViewController { func setupModel() { let name = Icon.Name.addToFavorite - + let selectedName = Icon.Name.addedToFavorite + component.selectedIconName = selectedName component.iconName = name component.onChange = { c in print("changed: \(c.isSelected)") } //setup UI @@ -227,6 +234,7 @@ class ButtonIconViewController: BaseViewController { kindPickerSelectorView.text = component.kind.rawValue sizePickerSelectorView.text = component.size.rawValue namePickerSelectorView.text = name.rawValue + selectedIconNamePickerSelectorView.text = selectedName.rawValue disabledSwitch.isOn = !component.isEnabled badgeIndicatorExpandDirectionPickerSelectorView.text = ButtonIcon.BadgeIndicatorModel.ExpandDirection.right.rawValue } @@ -308,27 +316,3 @@ extension ButtonIconViewController: ComponentSampleable { return ComponentSample(component: component, trailingPinningType: .lessThanOrEqual) } } - -extension ButtonIconViewController: UIColorPickerViewControllerDelegate { - - func selectedColorTapped(_ picker: ColorPickerView) { - let selectedColor = picker.selectedColor - if let selectedColor { - colorPicker.selectedColor = selectedColor - } - present(colorPicker, animated: true) - } - - func colorPickerViewControllerDidFinish(_ viewController: UIColorPickerViewController) { - dismiss(animated: true) - } - - func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) { - let color = viewController.selectedColor - let selectedColorPickerView = colorPickerType == .dark ? darkColorPicker : lightColorPicker - selectedColorPickerView.selectedColor = color - if let selectedDarkColor = darkColorPicker.selectedColor, let selectedLightColor = lightColorPicker.selectedColor { - component.selectedIconColorConfiguration = .init(selectedLightColor, selectedDarkColor) - } - } -} diff --git a/VDSSample/ViewControllers/TileContainerViewController.swift b/VDSSample/ViewControllers/TileContainerViewController.swift index ac2ea71..b76b26f 100644 --- a/VDSSample/ViewControllers/TileContainerViewController.swift +++ b/VDSSample/ViewControllers/TileContainerViewController.swift @@ -13,12 +13,6 @@ import Combine class TileContainerViewController: BaseViewController { - lazy var colorPicker: UIColorPickerViewController = { - let picker = UIColorPickerViewController() - picker.delegate = self - return picker - }() - lazy var imageFallbackColorPickerSelectorView = { SurfacePickerSelectorView(picker: self.picker) }() @@ -53,12 +47,6 @@ class TileContainerViewController: BaseViewController { var customPaddingRowView: UIView? var anyCancellable: AnyCancellable? - var contentAreaBackgroundColorButton = Button().with { instance in - instance.size = .small - instance.use = .secondary - instance.text = "Select" - } - var paddingTextField = NumericField().with { $0.placeholder = "Custom Padding" } @@ -70,46 +58,50 @@ class TileContainerViewController: BaseViewController { $0.placeholder = "Minimum 100px else it will occupy full container" } - var colorPickerType: ColorPickerType = .gradientColor1 - enum ColorPickerType { - case custom, gradientColor1, gradientColor2, contentViewBackgroundColor - } - - lazy var gradientColorView1: ColorPickerView = { - return .init(with: ColorPickerType.gradientColor1) { [weak self] picker in - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) + lazy var backgroundColorPickerSelectorView: TokenColorPickerSection = { + TokenColorPickerSection(rowTitle: "Background Color", + picker: self.picker).with { + $0.onSelected = { [weak self] item in + guard let self else { return } + switch item { + case .primary: + component.color = .primary + case .secondary: + component.color = .secondary + case .white: + component.color = .white + case .black: + component.color = .black + default: break; + } + } + $0.onTokenSelected = { [weak self] color in + guard let self else { return } + component.color = .custom(color.uiColor) + } + $0.onColorSelected = { [weak self] color in + guard let self else { return } + component.color = .custom(color) + + } } }() - lazy var gradientColorView2: ColorPickerView = { - return .init(with: ColorPickerType.gradientColor2) { [weak self] picker in - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) + lazy var gradientColorView1: ColorPickerView = { + return .init().with { + $0.onColorSelected = { [weak self] _ in + guard let self else { return } + updateGradientColors() + } } }() - var backgroundColorTokenFormStackView = FormSection().with { $0.isHidden = true } - var backgroundColorFormStackView = FormSection().with { $0.isHidden = true } - - lazy var backgroundColorPickerSelectorView = { - PickerSelectorView(title: "", - picker: self.picker, - items: BackgroundColor.allCases) - .with { $0.text = BackgroundColor.white.rawValue } - }() - - lazy var backgroundColorTokenColorView = { - PickerSelectorView(title: "", - picker: self.picker, - items: UIColor.VDSColor.allCases) - .with { $0.text = UIColor.VDSColor.paletteWhite.rawValue } - }() - - lazy var backgroundColorCustomColorView: ColorPickerView = { - return .init(with: ColorPickerType.custom, color: .white) { [weak self] picker in - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) + lazy var gradientColorView2: ColorPickerView = { + return .init().with { + $0.onColorSelected = { [weak self] _ in + guard let self else { return } + updateGradientColors() + } } }() @@ -208,21 +200,10 @@ class TileContainerViewController: BaseViewController { addFormRow(label: "Height", view: heightTextField) addFormRow(label: "Show Border", view: showBorderSwitch, pinTrailing: false) addFormRow(label: "Show Drop Shadow", view: showDropShadowSwitch, pinTrailing: false) - addFormRow(label: "Background Color", view: backgroundColorPickerSelectorView) - - backgroundColorTokenFormStackView.addFormRow(label: "Token", view: backgroundColorTokenColorView) - backgroundColorFormStackView.addFormRow(label: "Custom", view: backgroundColorCustomColorView) - append(section: backgroundColorTokenFormStackView) - append(section: backgroundColorFormStackView) - - + append(section: backgroundColorPickerSelectorView) addFormRow(label: "Padding", view: paddingPickerSelectorView) customPaddingRowView = addFormRow(label: "Custom Padding", view: paddingTextField) customPaddingRowView?.isHidden = true - let rowView = addFormRow(label: "Content area BG color(only for padding validation)", view: contentAreaBackgroundColorButton) - if let rowView = rowView as? UIStackView { - rowView.alignment = .top - } addFormRow(label: "Aspect Ratio", view: scalingTypePickerSelectorView) addFormRow(label: "Background Image", view: showBackgroundImageSwitch, pinTrailing: false) addFormRow(label: "Image Fallback Color", view: imageFallbackColorPickerSelectorView) @@ -309,7 +290,7 @@ class TileContainerViewController: BaseViewController { func setupModel() { //setup UI surfacePickerSelectorView.text = component.surface.rawValue - backgroundColorPickerSelectorView.text = backgroundColor.rawValue + backgroundColorPickerSelectorView.setDefault(value: backgroundColor) paddingPickerSelectorView.text = padding.rawValue scalingTypePickerSelectorView.text = component.aspectRatio.rawValue widthTextField.text = component.width != nil ? "\(component.width!)" : "" @@ -322,21 +303,7 @@ class TileContainerViewController: BaseViewController { self?.component.surface = item self?.contentTopView.backgroundColor = item.color } - - backgroundColorPickerSelectorView.onPickerDidSelect = { [weak self] item in - guard let self else { return } - if let color = item.color { - self.component.color = color - } else { - backgroundColorTokenFormStackView.isHidden = item != .token - backgroundColorFormStackView.isHidden = item != .custom - } - } - - backgroundColorTokenColorView.onPickerDidSelect = { [weak self] item in - self?.component.color = .token(item) - } - + backgroundEffectSelectorView.onPickerDidSelect = { [weak self] in guard let self else { return } if let effect = $0.effect { @@ -345,7 +312,6 @@ class TileContainerViewController: BaseViewController { self.gradientColorView1.selectedColor = nil self.gradientColorView2.selectedColor = nil } else { - self.colorPickerType = .gradientColor1 self.gradientColorsFormStackView.isHidden = false } } @@ -369,12 +335,12 @@ class TileContainerViewController: BaseViewController { imageFallbackColorPickerSelectorView.onPickerDidSelect = { [weak self] item in self?.component.imageFallbackColor = item } - - contentAreaBackgroundColorButton.onClick = { [weak self] _ in - guard let self else { return } - self.colorPickerType = .contentViewBackgroundColor - self.colorPicker.selectedColor = self.component.contentView.backgroundColor ?? .white - self.present(self.colorPicker, animated: true) + } + + func updateGradientColors(){ + if let selectedGradient1Color = gradientColorView1.selectedColor, + let selectedGradient2Color = gradientColorView2.selectedColor{ + component.backgroundEffect = .gradient(selectedGradient1Color, selectedGradient2Color) } } @@ -389,45 +355,6 @@ extension TileContainerViewController: ComponentSampleable { } } -extension TileContainerViewController: UIColorPickerViewControllerDelegate { - - func selectedColorTapped(_ picker: ColorPickerView) { - let selectedColor = picker.selectedColor - if let selectedColor { - colorPicker.selectedColor = selectedColor - } - present(colorPicker, animated: true) - } - - func colorPickerViewControllerDidFinish(_ viewController: UIColorPickerViewController) { - dismiss(animated: true) - } - - func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) { - let color = viewController.selectedColor - switch colorPickerType { - case .contentViewBackgroundColor: - component.contentView.backgroundColor = color - case .gradientColor1: - gradientColorView1.selectedColor = viewController.selectedColor - updateGradientColors() - case .gradientColor2: - gradientColorView2.selectedColor = viewController.selectedColor - updateGradientColors() - case .custom: - backgroundColorCustomColorView.selectedColor = color - component.color = .custom(color) - } - } - - func updateGradientColors(){ - if let selectedGradient1Color = gradientColorView1.selectedColor, - let selectedGradient2Color = gradientColorView2.selectedColor{ - component.backgroundEffect = .gradient(selectedGradient1Color, selectedGradient2Color) - } - } -} - extension TileContainerViewController { //Created new BackgroundEffect enum for sample app only. Since we defined enum with associated value color defined in TileContainer cannot be RawRepresentable & CaseIterable diff --git a/VDSSample/ViewControllers/TileletViewController.swift b/VDSSample/ViewControllers/TileletViewController.swift index 02e6261..2ad31f0 100644 --- a/VDSSample/ViewControllers/TileletViewController.swift +++ b/VDSSample/ViewControllers/TileletViewController.swift @@ -61,57 +61,55 @@ class TileletViewController: BaseViewController { items: TileContainerViewController.BackgroundEffect.allCases) }() - lazy var colorPicker: UIColorPickerViewController = { - let picker = UIColorPickerViewController() - picker.delegate = self - return picker + lazy var backgroundColorPickerSelectorView: TokenColorPickerSection = { + TokenColorPickerSection( + rowTitle: "Background Color", + rowTooltip: .init(title:"Background Color", content: "This color takes precedence over surface and will set all children's surface property to this value."), + picker: self.picker).with { + $0.onSelected = { [weak self] item in + guard let self else { return } + switch item { + case .primary: + component.color = .primary + case .secondary: + component.color = .secondary + case .white: + component.color = .white + case .black: + component.color = .black + default: break; + } + } + $0.onTokenSelected = { [weak self] color in + guard let self else { return } + component.color = .custom(color.uiColor) + } + $0.onColorSelected = { [weak self] color in + guard let self else { return } + component.color = .custom(color) + + } + } }() - var colorPickerType: ColorPickerType = .custom - enum ColorPickerType { - case gradientColor1, gradientColor2 - case contentViewBackgroundColor, token, custom - } - - lazy var gradientColorView1: ColorPickerView = { - return .init(with: ColorPickerType.gradientColor1) { [weak self] picker in - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) + lazy var gradientColorView1: ColorPickerView = { + return .init().with { + $0.onColorSelected = { [weak self] _ in + guard let self else { return } + updateGradientColors() + } } }() - lazy var gradientColorView2: ColorPickerView = { - return .init(with: ColorPickerType.gradientColor2) { [weak self] picker in - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) + lazy var gradientColorView2: ColorPickerView = { + return .init().with { + $0.onColorSelected = { [weak self] _ in + guard let self else { return } + updateGradientColors() + } } }() - var backgroundColorTokenFormStackView = FormSection().with { $0.isHidden = true } - var backgroundColorFormStackView = FormSection().with { $0.isHidden = true } - lazy var backgroundColorPickerSelectorView = { - PickerSelectorView(title: "", - picker: self.picker, - items: BackgroundColor.allCases) - .with { $0.text = BackgroundColor.white.rawValue } - }() - - lazy var backgroundColorCustomColorView: ColorPickerView = { - return .init(with: ColorPickerType.custom, color: .white) { [weak self] picker in - self?.currentSurfaceColorType = .background - self?.colorPickerType = picker.pickerType - self?.selectedColorTapped(picker) - } - }() - - lazy var backgroundColorTokenColorView = { - PickerSelectorView(title: "", - picker: self.picker, - items: UIColor.VDSColor.allCases) - .with { $0.text = UIColor.VDSColor.paletteWhite.rawValue } - }() - - lazy var textAlignmentPickerSelectorView = { PickerSelectorView(title: "left", picker: self.picker, @@ -393,14 +391,7 @@ class TileletViewController: BaseViewController { addFormRow(label: "Text Width", view: textWidthTextField) addFormRow(label: "Text Percentage", view: textPercentageTextField) addFormRow(label: "Text Position", tooltip: .init(title:"Text Position", content: "Minimum height is configurable"), view: textPositionPickerSelectorView) - addFormRow(label: "Background Color", tooltip: .init(title:"Background Color", content: "This color takes precedence over surface and will set all children's surface property to this value."), view: backgroundColorPickerSelectorView) - - backgroundColorTokenFormStackView.addFormRow(label: "Token", view: backgroundColorTokenColorView) - backgroundColorFormStackView.addFormRow(label: "Custom", view: backgroundColorCustomColorView) - append(section: backgroundColorTokenFormStackView) - append(section: backgroundColorFormStackView) - - + append(section: backgroundColorPickerSelectorView) addFormRow(label: "Background Image", view: showBackgroundImageSwitch, pinTrailing: false) addFormRow(label: "Show Drop Shadow", view: showDropShadowSwitch, pinTrailing: false) addFormRow(label: "Image Fallback Color", view: imageFallbackColorPickerSelectorView) @@ -619,7 +610,7 @@ class TileletViewController: BaseViewController { component.subTitleModel = subTitleModel component.padding = .small //setup UI - backgroundColorPickerSelectorView.text = backgroundColor.rawValue + backgroundColorPickerSelectorView.setDefault(value: backgroundColor) textAlignmentPickerSelectorView.text = TextAlignment.left.rawValue surfacePickerSelectorView.text = component.surface.rawValue otherStandardStylePickerSelectorView.text = subTitleModel.otherStandardStyle.rawValue @@ -738,6 +729,13 @@ class TileletViewController: BaseViewController { component.directionalIconModel = .init(iconType: iconType, iconColor: directionIconColor, size: iconSize) } + func updateGradientColors(){ + if let selectedGradient1Color = gradientColorView1.selectedColor, + let selectedGradient2Color = gradientColorView2.selectedColor{ + component.backgroundEffect = .gradient(selectedGradient1Color, selectedGradient2Color) + } + } + func updateOtherTextStyles() { let items = component.titleLockup.standardStyleConfiguration.configuration(for: titleStandardStylePickerSelectorView.selectedItem.value)!.allOtherStandardStyles let otheritems = items.compactMap { Tilelet.SubTitleModel.OtherStandardStyle(rawValue: $0.rawValue)! } @@ -786,7 +784,6 @@ class TileletViewController: BaseViewController { self.gradientColorView1.selectedColor = nil self.gradientColorView2.selectedColor = nil } else { - self.colorPickerType = .gradientColor1 self.gradientColorsFormStackView.isHidden = false } } @@ -794,21 +791,7 @@ class TileletViewController: BaseViewController { textAlignmentPickerSelectorView.onPickerDidSelect = { [weak self] item in self?.component.titleLockup.textAlignment = item } - - backgroundColorPickerSelectorView.onPickerDidSelect = { [weak self] item in - guard let self else { return } - if let color = getTilelet(backgroundColor: item) { - component.color = color - } else { - backgroundColorTokenFormStackView.isHidden = item != .token - backgroundColorFormStackView.isHidden = item != .custom - } - } - - backgroundColorTokenColorView.onPickerDidSelect = { [weak self] item in - self?.component.color = .token(item) - } - + descriptionNamePickerSelectorView.onPickerDidSelect = { [weak self] item in self?.setDescriptiveIconModel() } @@ -870,68 +853,6 @@ extension TileletViewController: ComponentSampleable { } } -extension TileletViewController: UIColorPickerViewControllerDelegate { - - func selectedColorTapped(_ picker: ColorPickerView) { - let selectedColor = picker.selectedColor - if let selectedColor { - colorPicker.selectedColor = selectedColor - } - present(colorPicker, animated: true) - } - - func colorPickerViewControllerDidFinish(_ viewController: UIColorPickerViewController) { - dismiss(animated: true) - } - - func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) { - let color = viewController.selectedColor - switch colorPickerType { - case .contentViewBackgroundColor: - component.contentView.backgroundColor = color - case .gradientColor1: - gradientColorView1.selectedColor = viewController.selectedColor - updateGradientColors() - case .gradientColor2: - gradientColorView2.selectedColor = viewController.selectedColor - updateGradientColors() - case .custom: - var colorView: ColorPickerView? - - switch currentSurfaceColorType { - case .background: - colorView = backgroundColorCustomColorView - default: break - } - colorView?.selectedColor = viewController.selectedColor - - switch currentSurfaceColorType { - case .background: - component.color = .custom(color) - case .eyebrow: - setEyebrowModel() - case .title: - setTitleModel() - case .subtitle: - setSubTitleModel() - case .directionalIcon: - setDirectionalIconModel() - case .descriptionIcon: - setDescriptiveIconModel() - } - default: - break - } - } - - func updateGradientColors(){ - if let selectedGradient1Color = gradientColorView1.selectedColor, - let selectedGradient2Color = gradientColorView2.selectedColor{ - component.backgroundEffect = .gradient(selectedGradient1Color, selectedGradient2Color) - } - } -} - extension TileletViewController { enum BackgroundColor: String, CaseIterable {