mbrucedogs/vds_ios_sample
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'update/icon-tooltip' into 'develop'

Browse Source 
added "custom size" since icon have had a customSize

See merge request BPHV_MIPS/vds_ios_sample!36
This commit is contained in:
Bruce, Matt R 2023-05-03 13:56:58 +00:00
commit 1f3a036f50
24 changed files with 462 additions and 457 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
VDSSample.xcodeproj/project.pbxproj
View File

@ -294,7 +294,6 @@
EAF7F09B2899B92400B287F5 /* CheckboxViewController.swift */, EAF7F09B2899B92400B287F5 /* CheckboxViewController.swift */,
EA985C00296CC21C00F2FF2E /* IconViewController.swift */, EA985C00296CC21C00F2FF2E /* IconViewController.swift */,
EAA5EEAC28EB6924003B3210 /* InputFieldViewController.swift */, EAA5EEAC28EB6924003B3210 /* InputFieldViewController.swift */,
EAC9257F29119FC400091998 /* TextLinkViewController.swift */,
EAB1D2D328AC409F00DAE764 /* LabelViewController.swift */, EAB1D2D328AC409F00DAE764 /* LabelViewController.swift */,
44604AD829CE1CF900E62B51 /* LineViewController.swift */, 44604AD829CE1CF900E62B51 /* LineViewController.swift */,
445BA07929C088470036A7C5 /* NotificationViewController.swift */, 445BA07929C088470036A7C5 /* NotificationViewController.swift */,
@ -302,6 +301,7 @@
EAF7F11928A14A0E00B287F5 /* RadioButtonViewController.swift */, EAF7F11928A14A0E00B287F5 /* RadioButtonViewController.swift */,
EA84F76128BE4AE500D67ABC /* RadioSwatchGroupViewController.swift */, EA84F76128BE4AE500D67ABC /* RadioSwatchGroupViewController.swift */,
EA985C24296E06EA00F2FF2E /* TextAreaViewController.swift */, EA985C24296E06EA00F2FF2E /* TextAreaViewController.swift */,
EAC9257F29119FC400091998 /* TextLinkViewController.swift */,
EA0FC2C02912DC5500DF80B4 /* TextLinkCaretViewController.swift */, EA0FC2C02912DC5500DF80B4 /* TextLinkCaretViewController.swift */,
EA5E304F294D11540082B959 /* TileContainerViewController.swift */, EA5E304F294D11540082B959 /* TileContainerViewController.swift */,
EA5E305B295111050082B959 /* TileletViewController.swift */, EA5E305B295111050082B959 /* TileletViewController.swift */,

30
VDSSample/ViewControllers/BadgeViewController.swift
View File

@ -11,7 +11,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class BadgeViewController: BaseViewController { class BadgeViewController: BaseViewController<Badge> {
enum NumberOfLines: String, CaseIterable { enum NumberOfLines: String, CaseIterable {
case unlimited case unlimited
@ -51,20 +51,18 @@ class BadgeViewController: BaseViewController {
var textField = TextField() var textField = TextField()
var maxWidthTextField = NumericField() var maxWidthTextField = NumericField()
var badge = Badge()
override func allTextFields() -> [TextField]? { [textField, maxWidthTextField] } override func allTextFields() -> [TextField]? { [textField, maxWidthTextField] }
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: component))
addContentTopView(view: .makeWrapper(for: badge))
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Fill Color", view: fillColorPickerSelectorView) addFormRow(label: "Fill Color", view: fillColorPickerSelectorView)
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Text", view: textField) addFormRow(label: "Text", view: textField)
@ -74,7 +72,7 @@ class BadgeViewController: BaseViewController {
textField textField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.badge.text = text self?.component.text = text
}.store(in: &subscribers) }.store(in: &subscribers)
maxWidthTextField maxWidthTextField
@ -84,33 +82,33 @@ class BadgeViewController: BaseViewController {
if let n = NumberFormatter().number(from: text) { if let n = NumberFormatter().number(from: text) {
float = CGFloat(truncating: n) float = CGFloat(truncating: n)
} }
self?.badge.maxWidth = float self?.component.maxWidth = float
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
badge.fillColor = .red component.fillColor = .red
badge.text = "Terms and conditions" component.text = "Terms and conditions"
badge.numberOfLines = 1 component.numberOfLines = 1
//setup UI //setup UI
surfacePickerSelectorView.text = badge.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
textField.text = badge.text textField.text = component.text
} }
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.badge.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
fillColorPickerSelectorView.onPickerDidSelect = { [weak self] item in fillColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.badge.fillColor = item self?.component.fillColor = item
} }
numberOfLinesPickerSelectorView.onPickerDidSelect = { [weak self] item in numberOfLinesPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.badge.numberOfLines = item.intValue self?.component.numberOfLines = item.intValue
} }
} }
} }

16
VDSSample/ViewControllers/BaseViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import Combine import Combine
import VDS import VDS
public class BaseViewController: UIViewController, Initable { public class BaseViewController<Component: UIView>: UIViewController, Initable {
deinit { deinit {
print("\(Self.self) deinit") print("\(Self.self) deinit")
} }
@ -71,6 +71,14 @@ public class BaseViewController: UIViewController, Initable {
} }
}() }()
public var component = Component()
lazy var debugViewSwitch = Toggle().with{
$0.onChange = { [weak self] sender in
self?.component.debugBorder(show: sender.isOn, color: .blue)
}
}
public var contentView: UIView = { public var contentView: UIView = {
return UIView().with { return UIView().with {
$0.translatesAutoresizingMaskIntoConstraints = false $0.translatesAutoresizingMaskIntoConstraints = false
@ -136,10 +144,16 @@ public class BaseViewController: UIViewController, Initable {
picker.pinLeading() picker.pinLeading()
picker.pinTrailing() picker.pinTrailing()
picker.isHidden = true picker.isHidden = true
setupForm()
} }
private let scrollViewController = ScrollViewController() private let scrollViewController = ScrollViewController()
public func setupForm() {
addFormRow(label: "Show Bounds", view: .makeWrapper(for: debugViewSwitch))
}
public func scrollToBottom() { public func scrollToBottom() {
let bottomOffset = CGPoint(x: 0, y: scrollViewController.scrollView.contentSize.height - scrollViewController.scrollView.bounds.height + scrollViewController.scrollView.contentInset.bottom) let bottomOffset = CGPoint(x: 0, y: scrollViewController.scrollView.contentSize.height - scrollViewController.scrollView.bounds.height + scrollViewController.scrollView.contentInset.bottom)
scrollViewController.scrollView.setContentOffset(bottomOffset, animated: true) scrollViewController.scrollView.setContentOffset(bottomOffset, animated: true)

49
VDSSample/ViewControllers/ButtonGroupViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class ButtonGroupViewController: BaseViewController { class ButtonGroupViewController: BaseViewController<ButtonGroup> {
var collectionView: UICollectionView! var collectionView: UICollectionView!
public enum RowQuantity: String, CaseIterable { public enum RowQuantity: String, CaseIterable {
@ -64,7 +64,6 @@ class ButtonGroupViewController: BaseViewController {
var widthTextField = NumericField() var widthTextField = NumericField()
var percentageTextField = NumericField() var percentageTextField = NumericField()
let largeButtonGroup = ButtonGroup()
let smallButtonGroup = ButtonGroup() let smallButtonGroup = ButtonGroup()
let largeLabel = Label().with{ $0.text = "Large Button Group"; $0.textStyle = .boldTitleSmall } let largeLabel = Label().with{ $0.text = "Large Button Group"; $0.textStyle = .boldTitleSmall }
let smallLabel = Label().with{ $0.text = "Small Button Group"; $0.textStyle = .boldTitleSmall } let smallLabel = Label().with{ $0.text = "Small Button Group"; $0.textStyle = .boldTitleSmall }
@ -74,12 +73,12 @@ class ButtonGroupViewController: BaseViewController {
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
let stackView = UIStackView(arrangedSubviews: [largeLabel, largeButtonGroup, smallLabel, smallButtonGroup]) let stackView = UIStackView(arrangedSubviews: [largeLabel, component, smallLabel, smallButtonGroup])
stackView.setCustomSpacing(50, after: largeButtonGroup) stackView.setCustomSpacing(50, after: component)
stackView.axis = .vertical stackView.axis = .vertical
stackView.spacing = 30 stackView.spacing = 30
largeButtonGroup.buttons = [ component.buttons = [
makeButton("Secondary", label: label).with{ $0.use = .secondary }, makeButton("Secondary", label: label).with{ $0.use = .secondary },
makeButton("Primary", label: label), makeButton("Primary", label: label),
makeTextLink("Large Text Link", label: label), makeTextLink("Large Text Link", label: label),
@ -99,12 +98,18 @@ class ButtonGroupViewController: BaseViewController {
percentageTextField.isEnabled = false percentageTextField.isEnabled = false
percentageTextField.placeholder = "Active RowQty != none" percentageTextField.placeholder = "Active RowQty != none"
widthTextField.placeholder = "Active RowQty == none" widthTextField.placeholder = "Active RowQty == none"
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
debugViewSwitch.onChange = { [weak self] sender in
self?.component.debugBorder(show: sender.isOn, color: .blue)
self?.smallButtonGroup.debugBorder(show: sender.isOn, color: .blue)
}
} }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Button Action", view: label) addFormRow(label: "Button Action", view: label)
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
@ -116,7 +121,7 @@ class ButtonGroupViewController: BaseViewController {
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.largeLabel.disabled = sender.isOn self?.largeLabel.disabled = sender.isOn
self?.smallLabel.disabled = sender.isOn self?.smallLabel.disabled = sender.isOn
self?.largeButtonGroup.disabled = sender.isOn self?.component.disabled = sender.isOn
self?.smallButtonGroup.disabled = sender.isOn self?.smallButtonGroup.disabled = sender.isOn
} }
@ -124,24 +129,24 @@ class ButtonGroupViewController: BaseViewController {
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
if let n = NumberFormatter().number(from: text) { if let n = NumberFormatter().number(from: text) {
self?.largeButtonGroup.buttonWidth = CGFloat(truncating: n) self?.component.buttonWidth = CGFloat(truncating: n)
self?.smallButtonGroup.buttonWidth = CGFloat(truncating: n) self?.smallButtonGroup.buttonWidth = CGFloat(truncating: n)
self?.percentageTextField.text = "" self?.percentageTextField.text = ""
} else { } else {
self?.largeButtonGroup.buttonWidth = nil self?.component.buttonWidth = nil
} }
}.store(in: &subscribers) }.store(in: &subscribers)
percentageTextField percentageTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
let rowQty = self?.largeButtonGroup.rowQuantity ?? 0 let rowQty = self?.component.rowQuantity ?? 0
if let n = NumberFormatter().number(from: text), n.intValue <= 100, rowQty > 0 { if let n = NumberFormatter().number(from: text), n.intValue <= 100, rowQty > 0 {
self?.largeButtonGroup.buttonPercentage = CGFloat(truncating: n) self?.component.buttonPercentage = CGFloat(truncating: n)
self?.smallButtonGroup.buttonPercentage = CGFloat(truncating: n) self?.smallButtonGroup.buttonPercentage = CGFloat(truncating: n)
self?.widthTextField.text = "" self?.widthTextField.text = ""
} else { } else {
self?.largeButtonGroup.buttonPercentage = nil self?.component.buttonPercentage = nil
self?.smallButtonGroup.buttonPercentage = nil self?.smallButtonGroup.buttonPercentage = nil
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -150,10 +155,10 @@ class ButtonGroupViewController: BaseViewController {
func setupModel() { func setupModel() {
//setup UI //setup UI
surfacePickerSelectorView.text = largeButtonGroup.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
buttonPositionSelectorView.text = largeButtonGroup.buttonPosition.rawValue buttonPositionSelectorView.text = component.buttonPosition.rawValue
disabledSwitch.isOn = largeButtonGroup.disabled disabledSwitch.isOn = component.disabled
rowQuantitySelectorView.text = RowQuantity(quantity: largeButtonGroup.rowQuantity).rawValue rowQuantitySelectorView.text = RowQuantity(quantity: component.rowQuantity).rawValue
widthTextField.text = "" widthTextField.text = ""
} }
@ -162,13 +167,13 @@ class ButtonGroupViewController: BaseViewController {
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.largeLabel.surface = item self?.largeLabel.surface = item
self?.smallLabel.surface = item self?.smallLabel.surface = item
self?.largeButtonGroup.surface = item self?.component.surface = item
self?.smallButtonGroup.surface = item self?.smallButtonGroup.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
buttonPositionSelectorView.onPickerDidSelect = { [weak self] item in buttonPositionSelectorView.onPickerDidSelect = { [weak self] item in
self?.largeButtonGroup.buttonPosition = item self?.component.buttonPosition = item
self?.smallButtonGroup.buttonPosition = item self?.smallButtonGroup.buttonPosition = item
} }
@ -180,15 +185,15 @@ class ButtonGroupViewController: BaseViewController {
self?.percentageTextField.text = "" self?.percentageTextField.text = ""
} else { } else {
self?.widthTextField.text = "" self?.widthTextField.text = ""
self?.largeButtonGroup.buttonWidth = nil self?.component.buttonWidth = nil
self?.smallButtonGroup.buttonWidth = nil self?.smallButtonGroup.buttonWidth = nil
} }
if UIDevice.isIPad { if UIDevice.isIPad {
self?.largeButtonGroup.rowQuantityTablet = item.intValue self?.component.rowQuantityTablet = item.intValue
self?.smallButtonGroup.rowQuantityTablet = item.intValue self?.smallButtonGroup.rowQuantityTablet = item.intValue
} else { } else {
self?.largeButtonGroup.rowQuantityPhone = item.intValue self?.component.rowQuantityPhone = item.intValue
self?.smallButtonGroup.rowQuantityPhone = item.intValue self?.smallButtonGroup.rowQuantityPhone = item.intValue
} }
} }

37
VDSSample/ViewControllers/ButtonViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class ButtonViewController: BaseViewController { class ButtonViewController: BaseViewController<Button> {
lazy var usePickerSelectorView = { lazy var usePickerSelectorView = {
PickerSelectorView<Use>(title: "", PickerSelectorView<Use>(title: "",
@ -29,21 +29,18 @@ class ButtonViewController: BaseViewController {
var textField = TextField() var textField = TextField()
var widthTextField = NumericField() var widthTextField = NumericField()
var button: Button!
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
button = makeButton("Button", label: label) addContentTopView(view: .makeWrapper(for: component, edgeSpacing: 16.0), edgeSpacing: 0.0)
addContentTopView(view: .makeWrapper(for: button))
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [textField, widthTextField] } override func allTextFields() -> [TextField]? { [textField, widthTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Button Action", view: label) addFormRow(label: "Button Action", view: label)
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Use", view: usePickerSelectorView) addFormRow(label: "Use", view: usePickerSelectorView)
@ -54,20 +51,20 @@ class ButtonViewController: BaseViewController {
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.button.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
textField textField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.button.text = text self?.component.text = text
}.store(in: &subscribers) }.store(in: &subscribers)
widthTextField widthTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
if let n = NumberFormatter().number(from: text) { if let n = NumberFormatter().number(from: text) {
self?.button.width = CGFloat(truncating: n) self?.component.width = CGFloat(truncating: n)
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -75,10 +72,13 @@ class ButtonViewController: BaseViewController {
func setupModel() { func setupModel() {
//setup UI //setup UI
surfacePickerSelectorView.text = button.surface.rawValue component.text = "Button"
disabledSwitch.isOn = button.disabled component.labelPublisher(label)
textField.text = button.text
usePickerSelectorView.text = button.use.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = component.disabled
textField.text = component.text
usePickerSelectorView.text = component.use.rawValue
widthTextField.text = "" widthTextField.text = ""
buttonSizePickerSelectorView.text = ButtonSize.large.rawValue buttonSizePickerSelectorView.text = ButtonSize.large.rawValue
} }
@ -86,17 +86,18 @@ class ButtonViewController: BaseViewController {
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.button.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
usePickerSelectorView.onPickerDidSelect = { [weak self] item in usePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.button.use = item self?.component.use = item
self?.button.backgroundColor = item.color self?.component.backgroundColor = item.color
} }
buttonSizePickerSelectorView.onPickerDidSelect = { [weak self] item in buttonSizePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.button.size = item self?.component.size = item
self?.debugViewSwitch.toggle()
} }
} }
} }

26
VDSSample/ViewControllers/CheckBoxGroupViewController.swift
View File

@ -11,7 +11,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class CheckboxGroupViewController: BaseViewController { class CheckboxGroupViewController: BaseViewController<CheckboxGroup> {
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var labelTextField = TextField() var labelTextField = TextField()
@ -22,16 +22,16 @@ class CheckboxGroupViewController: BaseViewController {
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: checkboxGroup) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [labelTextField, childTextField] } override func allTextFields() -> [TextField]? { [labelTextField, childTextField] }
func setupForm() { override func setupForm() {
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Label Text", view: labelTextField) addFormRow(label: "Label Text", view: labelTextField)
@ -39,11 +39,11 @@ class CheckboxGroupViewController: BaseViewController {
addFormRow(label: "Error", view: .makeWrapper(for: showErrorSwitch)) addFormRow(label: "Error", view: .makeWrapper(for: showErrorSwitch))
showErrorSwitch.onChange = { [weak self] sender in showErrorSwitch.onChange = { [weak self] sender in
self?.checkboxGroup.showError = sender.isOn self?.component.showError = sender.isOn
} }
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.checkboxGroup.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
labelTextField labelTextField
@ -72,9 +72,9 @@ class CheckboxGroupViewController: BaseViewController {
checkbox2.labelText = "iPhone 11 Bundle 2" checkbox2.labelText = "iPhone 11 Bundle 2"
checkbox2.childText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector" checkbox2.childText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
checkboxGroup.selectorModels = [checkbox1, checkbox2] component.selectorModels = [checkbox1, checkbox2]
checkboxGroup.onChange = { [weak self] group in component.onChange = { [weak self] group in
let selected = group.selectedHandlers? let selected = group.selectedHandlers?
.compactMap{"\($0.labelText!)"} .compactMap{"\($0.labelText!)"}
.joined(separator: "\r") ?? "none selected" .joined(separator: "\r") ?? "none selected"
@ -87,22 +87,22 @@ class CheckboxGroupViewController: BaseViewController {
} }
//setup UI //setup UI
surfacePickerSelectorView.text = checkboxGroup.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = checkboxGroup.disabled disabledSwitch.isOn = component.disabled
labelTextField.text = checkbox1.labelText labelTextField.text = checkbox1.labelText
childTextField.text = checkbox1.childText childTextField.text = checkbox1.childText
showErrorSwitch.isOn = checkboxGroup.showError showErrorSwitch.isOn = component.showError
} }
var checkbox: Checkbox? { var checkbox: Checkbox? {
checkboxGroup.selectorViews.first component.selectorViews.first
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.checkboxGroup.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
} }

46
VDSSample/ViewControllers/CheckboxViewController.swift
View File

@ -11,28 +11,26 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class CheckboxViewController: BaseViewController { class CheckboxViewController: BaseViewController<Checkbox> {
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var labelTextField = TextField() var labelTextField = TextField()
var childTextField = TextField() var childTextField = TextField()
var errorTextField = TextField() var errorTextField = TextField()
var showErrorSwitch = Toggle() var showErrorSwitch = Toggle()
var checkbox = Checkbox()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: checkbox) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [labelTextField, childTextField, errorTextField] } override func allTextFields() -> [TextField]? { [labelTextField, childTextField, errorTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Label Text", view: labelTextField) addFormRow(label: "Label Text", view: labelTextField)
@ -42,41 +40,41 @@ class CheckboxViewController: BaseViewController {
showErrorSwitch.onChange = { [weak self] sender in showErrorSwitch.onChange = { [weak self] sender in
guard let self else { return } guard let self else { return }
self.checkbox.showError = sender.isOn self.component.showError = sender.isOn
if self.checkbox.showError != sender.isOn { if self.component.showError != sender.isOn {
self.showErrorSwitch.isOn = self.checkbox.showError self.showErrorSwitch.isOn = self.component.showError
} }
} }
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.checkbox.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
labelTextField labelTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.checkbox.labelText = text self?.component.labelText = text
}.store(in: &subscribers) }.store(in: &subscribers)
childTextField childTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.checkbox.childText = text self?.component.childText = text
}.store(in: &subscribers) }.store(in: &subscribers)
errorTextField errorTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.checkbox.errorText = text self?.component.errorText = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
checkbox.labelText = "Terms and conditions" component.labelText = "Terms and conditions"
checkbox.childText = "I agree to Verizon's terms and conditions click here" component.childText = "I agree to Verizon's terms and conditions click here"
checkbox.errorText = "Error Text" component.errorText = "Error Text"
checkbox.onChange = { [weak self] checkbox in component.onChange = { [weak self] checkbox in
let alertController:UIAlertController = UIAlertController(title: "Alert", let alertController:UIAlertController = UIAlertController(title: "Alert",
message: "\(checkbox.labelText!): \(checkbox.isSelected)", message: "\(checkbox.labelText!): \(checkbox.isSelected)",
preferredStyle: UIAlertController.Style.alert) preferredStyle: UIAlertController.Style.alert)
@ -87,19 +85,19 @@ class CheckboxViewController: BaseViewController {
} }
//setup UI //setup UI
surfacePickerSelectorView.text = checkbox.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = checkbox.disabled disabledSwitch.isOn = component.disabled
labelTextField.text = checkbox.labelText labelTextField.text = component.labelText
childTextField.text = checkbox.childText childTextField.text = component.childText
showErrorSwitch.isOn = checkbox.showError showErrorSwitch.isOn = component.showError
errorTextField.text = checkbox.errorText errorTextField.text = component.errorText
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.checkbox.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
} }

39
VDSSample/ViewControllers/IconViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import Combine import Combine
class IconViewController: BaseViewController { class IconViewController: BaseViewController<Icon> {
lazy var colorPickerSelectorView = { lazy var colorPickerSelectorView = {
PickerSelectorView(title: "", PickerSelectorView(title: "",
@ -30,51 +30,62 @@ class IconViewController: BaseViewController {
items: Icon.Size.allCases) items: Icon.Size.allCases)
}() }()
var icon = Icon() var customSizeField = TextField()
override func allTextFields() -> [TextField]? { [customSizeField] }
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: icon)) addContentTopView(view: .makeWrapper(for: component))
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Size", view: sizePickerSelectorView) addFormRow(label: "Size", view: sizePickerSelectorView)
addFormRow(label: "Custom Size", view: customSizeField)
addFormRow(label: "Color", view: colorPickerSelectorView) addFormRow(label: "Color", view: colorPickerSelectorView)
addFormRow(label: "Name", view: namePickerSelectorView) addFormRow(label: "Name", view: namePickerSelectorView)
customSizeField.textPublisher.sink { [weak self] value in
if let intValue = Int(value) {
self?.component.customSize = intValue
} else if value.isEmpty {
self?.component.customSize = nil
}
}.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
let name = Icon.Name.accessibility let name = Icon.Name.accessibility
icon.color = .black component.color = .black
icon.name = name component.name = name
//setup UI //setup UI
surfacePickerSelectorView.text = icon.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
sizePickerSelectorView.text = icon.size.rawValue sizePickerSelectorView.text = component.size.rawValue
colorPickerSelectorView.text = icon.color.rawValue colorPickerSelectorView.text = component.color.rawValue
namePickerSelectorView.text = name.rawValue namePickerSelectorView.text = name.rawValue
} }
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.icon.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
sizePickerSelectorView.onPickerDidSelect = { [weak self] item in sizePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.icon.size = item self?.component.size = item
} }
colorPickerSelectorView.onPickerDidSelect = { [weak self] item in colorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.icon.color = item self?.component.color = item
} }
namePickerSelectorView.onPickerDidSelect = { [weak self] item in namePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.icon.name = item self?.component.name = item
} }
} }
} }

90
VDSSample/ViewControllers/InputFieldViewController.swift
View File

@ -11,7 +11,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class InputFieldViewController: BaseViewController { class InputFieldViewController: BaseViewController<InputField> {
lazy var helperTextPlacementPickerSelectorView = { lazy var helperTextPlacementPickerSelectorView = {
PickerSelectorView(title: "", PickerSelectorView(title: "",
@ -30,20 +30,18 @@ class InputFieldViewController: BaseViewController {
var showSuccessSwitch = Toggle() var showSuccessSwitch = Toggle()
var tooltipTitleTextField = TextField() var tooltipTitleTextField = TextField()
var tooltipContentTextField = TextField() var tooltipContentTextField = TextField()
var textEntryField = InputField()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: textEntryField) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [labelTextField, errorTextField, successTextField, helperTextField, widthTextField, tooltipTitleTextField, tooltipContentTextField] } override func allTextFields() -> [TextField]? { [labelTextField, errorTextField, successTextField, helperTextField, widthTextField, tooltipTitleTextField, tooltipContentTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Required", view: .makeWrapper(for: requiredSwitch)) addFormRow(label: "Required", view: .makeWrapper(for: requiredSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
@ -59,82 +57,82 @@ class InputFieldViewController: BaseViewController {
addFormRow(label: "ToolTip Content", view: tooltipContentTextField) addFormRow(label: "ToolTip Content", view: tooltipContentTextField)
requiredSwitch.onChange = { [weak self] sender in requiredSwitch.onChange = { [weak self] sender in
self?.textEntryField.required = sender.isOn self?.component.required = sender.isOn
} }
showErrorSwitch.onChange = { [weak self] sender in showErrorSwitch.onChange = { [weak self] sender in
guard let self else { return } guard let self else { return }
self.textEntryField.showError = sender.isOn self.component.showError = sender.isOn
if self.textEntryField.showError != sender.isOn { if self.component.showError != sender.isOn {
self.showErrorSwitch.isOn = self.textEntryField.showError self.showErrorSwitch.isOn = self.component.showError
} }
} }
showSuccessSwitch.onChange = { [weak self] sender in showSuccessSwitch.onChange = { [weak self] sender in
guard let self else { return } guard let self else { return }
self.textEntryField.showSuccess = sender.isOn self.component.showSuccess = sender.isOn
if self.textEntryField.showSuccess != sender.isOn { if self.component.showSuccess != sender.isOn {
self.showSuccessSwitch.isOn = self.textEntryField.showSuccess self.showSuccessSwitch.isOn = self.component.showSuccess
} }
} }
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.textEntryField.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
labelTextField labelTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textEntryField.labelText = text self?.component.labelText = text
}.store(in: &subscribers) }.store(in: &subscribers)
helperTextField helperTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textEntryField.helperText = text self?.component.helperText = text
}.store(in: &subscribers) }.store(in: &subscribers)
errorTextField errorTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textEntryField.errorText = text self?.component.errorText = text
}.store(in: &subscribers) }.store(in: &subscribers)
widthTextField widthTextField
.textPublisher .textPublisher
.sink { [weak self] width in .sink { [weak self] width in
guard let width = Float(width) else { return } guard let width = Float(width) else { return }
self?.textEntryField.width = CGFloat(width) self?.component.width = CGFloat(width)
}.store(in: &subscribers) }.store(in: &subscribers)
tooltipTitleTextField tooltipTitleTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textEntryField.tooltipTitle = text self?.component.tooltipTitle = text
}.store(in: &subscribers) }.store(in: &subscribers)
tooltipContentTextField tooltipContentTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textEntryField.tooltipContent = text self?.component.tooltipContent = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
textEntryField.type = .text component.type = .text
textEntryField.width = 328 component.width = 328
textEntryField.labelText = "Street Address" component.labelText = "Street Address"
textEntryField.helperText = "For example: 123 Verizon St" component.helperText = "For example: 123 Verizon St"
textEntryField.errorText = "Enter a valid address." component.errorText = "Enter a valid address."
textEntryField.successText = "Good job entering a valid address!" component.successText = "Good job entering a valid address!"
textEntryField.tooltipTitle = "Check the formatting of your address" component.tooltipTitle = "Check the formatting of your address"
textEntryField.tooltipContent = "House/Building number then street name" component.tooltipContent = "House/Building number then street name"
textEntryField component
.publisher(for: .valueChanged) .publisher(for: .valueChanged)
.sink { textEntryField in .sink { component in
if let text = textEntryField.value { if let text = component.value {
print("text entry: \(text)") print("text entry: \(text)")
} else { } else {
print("text entry: null") print("text entry: null")
@ -142,19 +140,19 @@ class InputFieldViewController: BaseViewController {
}.store(in: &subscribers) }.store(in: &subscribers)
//setup UI //setup UI
surfacePickerSelectorView.text = textEntryField.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
helperTextPlacementPickerSelectorView.text = textEntryField.helperTextPlacement.rawValue helperTextPlacementPickerSelectorView.text = component.helperTextPlacement.rawValue
disabledSwitch.isOn = textEntryField.disabled disabledSwitch.isOn = component.disabled
requiredSwitch.isOn = textEntryField.required requiredSwitch.isOn = component.required
labelTextField.text = textEntryField.labelText labelTextField.text = component.labelText
helperTextField.text = textEntryField.helperText helperTextField.text = component.helperText
showErrorSwitch.isOn = textEntryField.showError showErrorSwitch.isOn = component.showError
errorTextField.text = textEntryField.errorText errorTextField.text = component.errorText
showSuccessSwitch.isOn = textEntryField.showSuccess showSuccessSwitch.isOn = component.showSuccess
successTextField.text = textEntryField.successText successTextField.text = component.successText
tooltipTitleTextField.text = textEntryField.tooltipTitle tooltipTitleTextField.text = component.tooltipTitle
tooltipContentTextField.text = textEntryField.tooltipContent tooltipContentTextField.text = component.tooltipContent
if let width = textEntryField.width { if let width = component.width {
widthTextField.text = String(describing: width) widthTextField.text = String(describing: width)
} }
} }
@ -162,12 +160,12 @@ class InputFieldViewController: BaseViewController {
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.textEntryField.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
helperTextPlacementPickerSelectorView.onPickerDidSelect = { [weak self] item in helperTextPlacementPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.textEntryField.helperTextPlacement = item self?.component.helperTextPlacement = item
} }
} }
} }

30
VDSSample/ViewControllers/LabelViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class LabelViewController: BaseViewController { class LabelViewController: BaseViewController<Label> {
lazy var textSizePickerSelectorView = { lazy var textSizePickerSelectorView = {
TextSizePickerSelectorView(title: "", TextSizePickerSelectorView(title: "",
@ -33,20 +33,18 @@ class LabelViewController: BaseViewController {
var textField = TextField() var textField = TextField()
private var isBold: Bool = false private var isBold: Bool = false
var label = Label()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: label) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [textField] } override func allTextFields() -> [TextField]? { [textField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Bold", view: .makeWrapper(for: boldSwitch)) addFormRow(label: "Bold", view: .makeWrapper(for: boldSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
@ -56,7 +54,7 @@ class LabelViewController: BaseViewController {
addFormRow(label: "Text", view: textField) addFormRow(label: "Text", view: textField)
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.label.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
boldSwitch boldSwitch
@ -69,19 +67,19 @@ class LabelViewController: BaseViewController {
textField textField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.label.text = text self?.component.text = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
label.text = "Label Component" component.text = "Label Component"
label.textStyle = .featureSmall component.textStyle = .featureSmall
//setup UI //setup UI
surfacePickerSelectorView.text = label.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = label.disabled disabledSwitch.isOn = component.disabled
boldSwitch.isOn = isBold boldSwitch.isOn = isBold
textField.text = label.text textField.text = component.text
//set the font //set the font
fontCategory = .feature fontCategory = .feature
@ -114,18 +112,18 @@ class LabelViewController: BaseViewController {
func updateLabelStyle(){ func updateLabelStyle(){
if let style = fontCategory.style(for: textSize, isBold: isBold) { if let style = fontCategory.style(for: textSize, isBold: isBold) {
label.textStyle = style component.textStyle = style
} }
} }
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.label.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.label.textPosition = item self?.component.textPosition = item
} }
textSizePickerSelectorView.onPickerDidSelect = { [weak self] item in textSizePickerSelectorView.onPickerDidSelect = { [weak self] item in

12
VDSSample/ViewControllers/LineViewController.swift
View File

@ -8,7 +8,7 @@
import Foundation import Foundation
import VDS import VDS
class LineViewController: BaseViewController { class LineViewController: BaseViewController<Line> {
let lineView = Line() let lineView = Line()
@ -21,24 +21,24 @@ class LineViewController: BaseViewController {
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: lineView) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
} }
func setupForm() { override func setupForm() {
super.setupForm()
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Style", view: lineStylePickerView) addFormRow(label: "Style", view: lineStylePickerView)
} }
func setupPicker() { func setupPicker() {
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.lineView.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
lineStylePickerView.onPickerDidSelect = { [weak self] item in lineStylePickerView.onPickerDidSelect = { [weak self] item in
self?.lineView.style = item self?.component.style = item
} }
} }
} }

45
VDSSample/ViewControllers/NotificationViewController.swift
View File

@ -8,9 +8,8 @@
import Foundation import Foundation
import VDS import VDS
class NotificationViewController: BaseViewController { class NotificationViewController: BaseViewController<VDS.Notification> {
var notificationView = Notification()
let label = Label() let label = Label()
let titleTextField = TextField() let titleTextField = TextField()
let subTitleTextField = TextField() let subTitleTextField = TextField()
@ -37,10 +36,10 @@ class NotificationViewController: BaseViewController {
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: notificationView) addContentTopView(view: component)
notificationView.title = titleDefaultText component.title = titleDefaultText
notificationView.subTitle = subtitleDefaultText component.subTitle = subtitleDefaultText
titleTextField.text = titleDefaultText titleTextField.text = titleDefaultText
subTitleTextField.text = subtitleDefaultText subTitleTextField.text = subtitleDefaultText
@ -48,11 +47,11 @@ class NotificationViewController: BaseViewController {
firstButtonTextField.text = firstButtonDefaultText firstButtonTextField.text = firstButtonDefaultText
secondButtonTextField.text = secondButtonDefaultText secondButtonTextField.text = secondButtonDefaultText
setupForm()
setupPicker() setupPicker()
} }
func setupForm() { override func setupForm() {
super.setupForm()
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Type", view: notificationTypePickerSelectorView) addFormRow(label: "Type", view: notificationTypePickerSelectorView)
addFormRow(label: "Layout", view: layoutTypePickerSelectorView) addFormRow(label: "Layout", view: layoutTypePickerSelectorView)
@ -65,22 +64,22 @@ class NotificationViewController: BaseViewController {
addFormRow(label: "First Button Text", view: firstButtonTextField) addFormRow(label: "First Button Text", view: firstButtonTextField)
addFormRow(label: "Second Button Text", view: secondButtonTextField) addFormRow(label: "Second Button Text", view: secondButtonTextField)
notificationView.onCloseClick = { notification in component.onCloseClick = { notification in
print("onCloseClick: \(notification.title)") print("onCloseClick: \(notification.title)")
} }
titleTextField.textPublisher.sink { newString in titleTextField.textPublisher.sink { newString in
self.notificationView.title = newString self.component.title = newString
}.store(in: &subscribers) }.store(in: &subscribers)
subTitleTextField.textPublisher.sink { newString in subTitleTextField.textPublisher.sink { newString in
self.notificationView.subTitle = newString self.component.subTitle = newString
}.store(in: &subscribers) }.store(in: &subscribers)
buttonGroupToggle.onChange = { [weak self] toggle in buttonGroupToggle.onChange = { [weak self] toggle in
if toggle.isOn { if toggle.isOn {
self?.notificationView.primaryButtonModel = nil self?.component.primaryButtonModel = nil
self?.notificationView.secondaryButtonModel = nil self?.component.secondaryButtonModel = nil
self?.label.text = "" self?.label.text = ""
} else { } else {
self?.setupButtons(with: self?.firstButtonDefaultText, secondButtonText: self?.secondButtonDefaultText) self?.setupButtons(with: self?.firstButtonDefaultText, secondButtonText: self?.secondButtonDefaultText)
@ -90,8 +89,8 @@ class NotificationViewController: BaseViewController {
firstButtonTextField.textPublisher.sink { newString in firstButtonTextField.textPublisher.sink { newString in
if newString.isEmpty { if newString.isEmpty {
self.notificationView.primaryButtonModel = nil self.component.primaryButtonModel = nil
self.notificationView.secondaryButtonModel = nil self.component.secondaryButtonModel = nil
} else { } else {
self.setupButtons(with: newString, secondButtonText: self.secondButtonTextField.text) self.setupButtons(with: newString, secondButtonText: self.secondButtonTextField.text)
} }
@ -105,42 +104,42 @@ class NotificationViewController: BaseViewController {
}.store(in: &subscribers) }.store(in: &subscribers)
hideCloseButtonToggle.onChange = { [weak self] toggle in hideCloseButtonToggle.onChange = { [weak self] toggle in
self?.notificationView.hideCloseButton = toggle.isOn self?.component.hideCloseButton = toggle.isOn
} }
fullBleedToggle.onChange = { [weak self] toggle in fullBleedToggle.onChange = { [weak self] toggle in
self?.notificationView.fullBleed = toggle.isOn self?.component.fullBleed = toggle.isOn
} }
} }
func setupPicker() { func setupPicker() {
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.notificationView.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
notificationTypePickerSelectorView.onPickerDidSelect = { [weak self] item in notificationTypePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.notificationView.type = item self?.component.type = item
} }
layoutTypePickerSelectorView.onPickerDidSelect = { [weak self] item in layoutTypePickerSelectorView.onPickerDidSelect = { [weak self] item in
guard let self else { return } guard let self else { return }
self.notificationView.layout = item self.component.layout = item
if self.notificationView.layout != item { if self.component.layout != item {
self.layoutTypePickerSelectorView.set(item: self.notificationView.layout) self.layoutTypePickerSelectorView.set(item: self.component.layout)
} }
} }
} }
func setupButtons(with firstButtonText: String? = nil, secondButtonText: String? = nil) { func setupButtons(with firstButtonText: String? = nil, secondButtonText: String? = nil) {
if let firstButtonText { if let firstButtonText {
notificationView.primaryButtonModel = .init(text: firstButtonText, onClick: { [weak self] button in component.primaryButtonModel = .init(text: firstButtonText, onClick: { [weak self] button in
self?.label.text = "\(button.text!) button click" self?.label.text = "\(button.text!) button click"
}) })
} }
if let secondButtonText { if let secondButtonText {
notificationView.secondaryButtonModel = .init(text: secondButtonText, onClick: { [weak self] button in component.secondaryButtonModel = .init(text: secondButtonText, onClick: { [weak self] button in
self?.label.text = "\(button.text!) button click" self?.label.text = "\(button.text!) button click"
}) })
} }

26
VDSSample/ViewControllers/RadioBoxGroupViewController.swift
View File

@ -11,7 +11,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class RadioBoxGroupViewController: BaseViewController { class RadioBoxGroupViewController: BaseViewController<RadioBoxGroup>{
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var strikeThroughSwitch = Toggle() var strikeThroughSwitch = Toggle()
@ -19,21 +19,19 @@ class RadioBoxGroupViewController: BaseViewController {
var subTextField = TextField() var subTextField = TextField()
var subTextRightField = TextField() var subTextRightField = TextField()
var showErrorSwitch = Toggle() var showErrorSwitch = Toggle()
var radioBoxGroup = RadioBoxGroup()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: radioBoxGroup) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [textField, subTextField, subTextRightField] } override func allTextFields() -> [TextField]? { [textField, subTextField, subTextRightField] }
func setupForm() { override func setupForm() {
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Strikethrough", view: .makeWrapper(for: strikeThroughSwitch)) addFormRow(label: "Strikethrough", view: .makeWrapper(for: strikeThroughSwitch))
@ -42,7 +40,7 @@ class RadioBoxGroupViewController: BaseViewController {
addFormRow(label: "Sub Text Right", view: subTextRightField) addFormRow(label: "Sub Text Right", view: subTextRightField)
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.radioBoxGroup.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
strikeThroughSwitch.onChange = { [weak self] sender in strikeThroughSwitch.onChange = { [weak self] sender in
@ -84,9 +82,9 @@ class RadioBoxGroupViewController: BaseViewController {
radioBox2.text = "iPhone 11 Bundle 2" radioBox2.text = "iPhone 11 Bundle 2"
radioBox2.subText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector" radioBox2.subText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
radioBoxGroup.selectorModels = [radioBox1, radioBox2] component.selectorModels = [radioBox1, radioBox2]
radioBoxGroup component
.publisher(for: .valueChanged) .publisher(for: .valueChanged)
.sink { [weak self] group in .sink { [weak self] group in
let alertController:UIAlertController = UIAlertController(title: "Alert", let alertController:UIAlertController = UIAlertController(title: "Alert",
@ -99,22 +97,22 @@ class RadioBoxGroupViewController: BaseViewController {
}.store(in: &subscribers) }.store(in: &subscribers)
//set UI values //set UI values
surfacePickerSelectorView.text = radioBoxGroup.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = radioBoxGroup.disabled disabledSwitch.isOn = component.disabled
textField.text = radioBox1.text textField.text = radioBox1.text
subTextField.text = radioBox1.subText subTextField.text = radioBox1.subText
subTextRightField.text = radioBox1.subTextRight subTextRightField.text = radioBox1.subTextRight
} }
var radioBox: RadioBox? { var radioBox: RadioBox? {
radioBoxGroup.selectorViews.first component.selectorViews.first
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.radioBoxGroup.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }

28
VDSSample/ViewControllers/RadioButtonViewController.swift
View File

@ -11,27 +11,25 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class RadioButtonViewController: BaseViewController { class RadioButtonViewController: BaseViewController<RadioButtonGroup> {
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var labelTextField = TextField() var labelTextField = TextField()
var childTextField = TextField() var childTextField = TextField()
var showErrorSwitch = Toggle() var showErrorSwitch = Toggle()
var radioButtonGroup = RadioButtonGroup()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: radioButtonGroup) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [labelTextField, childTextField] } override func allTextFields() -> [TextField]? { [labelTextField, childTextField] }
func setupForm() { override func setupForm() {
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Label Text", view: labelTextField) addFormRow(label: "Label Text", view: labelTextField)
@ -39,11 +37,11 @@ class RadioButtonViewController: BaseViewController {
addFormRow(label: "Error", view: .makeWrapper(for: showErrorSwitch)) addFormRow(label: "Error", view: .makeWrapper(for: showErrorSwitch))
showErrorSwitch.onChange = { [weak self] sender in showErrorSwitch.onChange = { [weak self] sender in
self?.radioButtonGroup.showError = sender.isOn self?.component.showError = sender.isOn
} }
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.radioButtonGroup.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
labelTextField labelTextField
@ -79,9 +77,9 @@ class RadioButtonViewController: BaseViewController {
radioButton3.labelText = "iPhone 11 Bundle 3" radioButton3.labelText = "iPhone 11 Bundle 3"
radioButton3.childText = "Apple iPhone 11 - 256 GB\nOtterbox Case Black\nScreen Protector" radioButton3.childText = "Apple iPhone 11 - 256 GB\nOtterbox Case Black\nScreen Protector"
radioButtonGroup.selectorModels = [radioButton1, radioButton2, radioButton3] component.selectorModels = [radioButton1, radioButton2, radioButton3]
radioButtonGroup.onChange = { [weak self] group in component.onChange = { [weak self] group in
let alertController:UIAlertController = UIAlertController(title: "Alert", let alertController:UIAlertController = UIAlertController(title: "Alert",
message: "Selected:\r\(group.selectedHandler?.labelText ?? "none")", message: "Selected:\r\(group.selectedHandler?.labelText ?? "none")",
preferredStyle: UIAlertController.Style.alert) preferredStyle: UIAlertController.Style.alert)
@ -92,15 +90,15 @@ class RadioButtonViewController: BaseViewController {
} }
//set UI values //set UI values
surfacePickerSelectorView.text = radioButtonGroup.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = radioButtonGroup.disabled disabledSwitch.isOn = component.disabled
showErrorSwitch.isOn = radioButtonGroup.showError showErrorSwitch.isOn = component.showError
labelTextField.text = radioButton1.labelText labelTextField.text = radioButton1.labelText
childTextField.text = radioButton1.childText childTextField.text = radioButton1.childText
} }
var radioButton: RadioButton? { var radioButton: RadioButton? {
radioButtonGroup.selectorViews.first component.selectorViews.first
} }
//Picker //Picker
@ -108,7 +106,7 @@ class RadioButtonViewController: BaseViewController {
picker.isHidden = true picker.isHidden = true
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.radioButtonGroup.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }

26
VDSSample/ViewControllers/RadioSwatchGroupViewController.swift
View File

@ -11,32 +11,32 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class RadioSwatchGroupViewController: BaseViewController { class RadioSwatchGroupViewController: BaseViewController<RadioSwatchGroup> {
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var strikeThroughSwitch = Toggle() var strikeThroughSwitch = Toggle()
var radioSwatchGroup = RadioSwatchGroup()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: radioSwatchGroup) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
func setupForm() { override func setupForm() {
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Strikethrough", view: .makeWrapper(for: strikeThroughSwitch)) addFormRow(label: "Strikethrough", view: .makeWrapper(for: strikeThroughSwitch))
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.radioSwatchGroup.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
strikeThroughSwitch.onChange = { [weak self] sender in strikeThroughSwitch.onChange = { [weak self] sender in
self?.radioSwatchGroup.selectorViews.first?.strikethrough = sender.isOn self?.component.selectorViews.first?.strikethrough = sender.isOn
self?.radioSwatchGroup.reload() self?.component.reload()
} }
} }
@ -83,22 +83,22 @@ class RadioSwatchGroupViewController: BaseViewController {
radioSwatch8.text = "Pink" radioSwatch8.text = "Pink"
radioSwatch8.inputId = "radioSwatch8" radioSwatch8.inputId = "radioSwatch8"
radioSwatchGroup.selectorModels = [radioSwatch1, radioSwatch2, radioSwatch3, radioSwatch4, radioSwatch5, radioSwatch6, radioSwatch7, radioSwatch8] component.selectorModels = [radioSwatch1, radioSwatch2, radioSwatch3, radioSwatch4, radioSwatch5, radioSwatch6, radioSwatch7, radioSwatch8]
radioSwatchGroup.onChange = { group in component.onChange = { group in
print("Selected: \(group.selectedHandler?.text ?? "none")") print("Selected: \(group.selectedHandler?.text ?? "none")")
} }
//set UI values //set UI values
surfacePickerSelectorView.text = radioSwatchGroup.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = radioSwatchGroup.disabled disabledSwitch.isOn = component.disabled
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.radioSwatchGroup.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }

71
VDSSample/ViewControllers/TextAreaViewController.swift
View File

@ -12,7 +12,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class TextAreaViewController: BaseViewController { class TextAreaViewController: BaseViewController<TextArea> {
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var requiredSwitch = Toggle() var requiredSwitch = Toggle()
@ -23,20 +23,19 @@ class TextAreaViewController: BaseViewController {
var showErrorSwitch = Toggle() var showErrorSwitch = Toggle()
var tooltipTitleTextField = TextField() var tooltipTitleTextField = TextField()
var tooltipContentTextField = TextField() var tooltipContentTextField = TextField()
var textArea = TextArea()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: textArea) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [labelTextField, errorTextField, helperTextField, widthTextField, tooltipTitleTextField, tooltipContentTextField] } override func allTextFields() -> [TextField]? { [labelTextField, errorTextField, helperTextField, widthTextField, tooltipTitleTextField, tooltipContentTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Required", view: .makeWrapper(for: requiredSwitch)) addFormRow(label: "Required", view: .makeWrapper(for: requiredSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
@ -49,72 +48,72 @@ class TextAreaViewController: BaseViewController {
addFormRow(label: "ToolTip Content", view: tooltipContentTextField) addFormRow(label: "ToolTip Content", view: tooltipContentTextField)
requiredSwitch.onChange = { [weak self] sender in requiredSwitch.onChange = { [weak self] sender in
self?.textArea.required = sender.isOn self?.component.required = sender.isOn
} }
showErrorSwitch.onChange = { [weak self] sender in showErrorSwitch.onChange = { [weak self] sender in
guard let self else { return } guard let self else { return }
self.textArea.showError = sender.isOn self.component.showError = sender.isOn
if self.textArea.showError != sender.isOn { if self.component.showError != sender.isOn {
self.showErrorSwitch.isOn = self.textArea.showError self.showErrorSwitch.isOn = self.component.showError
} }
} }
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.textArea.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
labelTextField labelTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textArea.labelText = text self?.component.labelText = text
}.store(in: &subscribers) }.store(in: &subscribers)
helperTextField helperTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textArea.helperText = text self?.component.helperText = text
}.store(in: &subscribers) }.store(in: &subscribers)
errorTextField errorTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textArea.errorText = text self?.component.errorText = text
}.store(in: &subscribers) }.store(in: &subscribers)
widthTextField widthTextField
.textPublisher .textPublisher
.sink { [weak self] width in .sink { [weak self] width in
guard let width = Float(width) else { return } guard let width = Float(width) else { return }
self?.textArea.width = CGFloat(width) self?.component.width = CGFloat(width)
}.store(in: &subscribers) }.store(in: &subscribers)
tooltipTitleTextField tooltipTitleTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textArea.tooltipTitle = text self?.component.tooltipTitle = text
}.store(in: &subscribers) }.store(in: &subscribers)
tooltipContentTextField tooltipContentTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textArea.tooltipContent = text self?.component.tooltipContent = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
textArea.width = 328 component.width = 328
textArea.labelText = "Street Address" component.labelText = "Street Address"
textArea.helperText = "For example: 123 Verizon St" component.helperText = "For example: 123 Verizon St"
textArea.errorText = "Enter a valid address." component.errorText = "Enter a valid address."
textArea.tooltipTitle = "Check the formatting of your address" component.tooltipTitle = "Check the formatting of your address"
textArea.tooltipContent = "House/Building number then street name" component.tooltipContent = "House/Building number then street name"
textArea component
.publisher(for: .valueChanged) .publisher(for: .valueChanged)
.sink { textArea in .sink { component in
if let text = textArea.value { if let text = component.value {
print("text entry: \(text)") print("text entry: \(text)")
} else { } else {
print("text entry: null") print("text entry: null")
@ -122,21 +121,21 @@ class TextAreaViewController: BaseViewController {
}.store(in: &subscribers) }.store(in: &subscribers)
//setup UI //setup UI
surfacePickerSelectorView.text = textArea.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = textArea.disabled disabledSwitch.isOn = component.disabled
requiredSwitch.isOn = textArea.required requiredSwitch.isOn = component.required
labelTextField.text = textArea.labelText labelTextField.text = component.labelText
helperTextField.text = textArea.helperText helperTextField.text = component.helperText
showErrorSwitch.isOn = textArea.showError showErrorSwitch.isOn = component.showError
errorTextField.text = textArea.errorText errorTextField.text = component.errorText
tooltipTitleTextField.text = textArea.tooltipTitle tooltipTitleTextField.text = component.tooltipTitle
tooltipContentTextField.text = textArea.tooltipContent tooltipContentTextField.text = component.tooltipContent
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.textArea.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
} }

29
VDSSample/ViewControllers/TextLinkCaretViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class TextLinkCaretViewController: BaseViewController { class TextLinkCaretViewController: BaseViewController<TextLinkCaret> {
lazy var caretPositionPickerSelectorView = { lazy var caretPositionPickerSelectorView = {
PickerSelectorView(title: "", PickerSelectorView(title: "",
@ -21,22 +21,19 @@ class TextLinkCaretViewController: BaseViewController {
var label = Label() var label = Label()
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var textField = TextField() var textField = TextField()
lazy var textLinkCaret: TextLinkCaret = {
makeTextLinkCaret("Text Link Caret", label: label)
}()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: textLinkCaret)) addContentTopView(view: .makeWrapper(for: component, edgeSpacing: 16.0), edgeSpacing: 0.0)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [textField] } override func allTextFields() -> [TextField]? { [textField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Button Action", view: label) addFormRow(label: "Button Action", view: label)
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
@ -44,34 +41,36 @@ class TextLinkCaretViewController: BaseViewController {
addFormRow(label: "Caret Position", view: caretPositionPickerSelectorView) addFormRow(label: "Caret Position", view: caretPositionPickerSelectorView)
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.textLinkCaret.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
textField textField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textLinkCaret.text = text self?.component.text = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
component.text = "Text Link Caret"
component.labelPublisher(label)
//setup UI //setup UI
surfacePickerSelectorView.text = textLinkCaret.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = textLinkCaret.disabled disabledSwitch.isOn = component.disabled
textField.text = textLinkCaret.text textField.text = component.text
caretPositionPickerSelectorView.text = textLinkCaret.iconPosition.rawValue caretPositionPickerSelectorView.text = component.iconPosition.rawValue
} }
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.textLinkCaret.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
caretPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in caretPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.textLinkCaret.iconPosition = item self?.component.iconPosition = item
} }
} }
} }

32
VDSSample/ViewControllers/TextLinkViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class TextLinkViewController: BaseViewController { class TextLinkViewController: BaseViewController<TextLink> {
lazy var buttonSizePickerSelectorView = { lazy var buttonSizePickerSelectorView = {
PickerSelectorView(title: "", PickerSelectorView(title: "",
@ -21,23 +21,19 @@ class TextLinkViewController: BaseViewController {
var label = Label() var label = Label()
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var textField = TextField() var textField = TextField()
lazy var textLink: TextLink = {
makeTextLink("Text Link", label: label)
}()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: component, edgeSpacing: 16.0), edgeSpacing: 0.0)
addContentTopView(view: .makeWrapper(for: textLink))
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [textField] } override func allTextFields() -> [TextField]? { [textField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Button Action", view: label) addFormRow(label: "Button Action", view: label)
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
@ -45,34 +41,36 @@ class TextLinkViewController: BaseViewController {
addFormRow(label: "Size", view: buttonSizePickerSelectorView) addFormRow(label: "Size", view: buttonSizePickerSelectorView)
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.textLink.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
textField textField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.textLink.text = text self?.component.text = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
component.text = "Text Link"
component.labelPublisher(label)
//setup UI //setup UI
surfacePickerSelectorView.text = textLink.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = textLink.disabled disabledSwitch.isOn = component.disabled
textField.text = textLink.text textField.text = component.text
buttonSizePickerSelectorView.text = ButtonSize.large.rawValue buttonSizePickerSelectorView.text = ButtonSize.large.rawValue
} }
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.textLink.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
buttonSizePickerSelectorView.onPickerDidSelect = { [weak self] item in buttonSizePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.textLink.size = item self?.component.size = item
} }
} }
} }

54
VDSSample/ViewControllers/TileContainerViewController.swift
View File

@ -11,7 +11,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class TileContainerViewController: BaseViewController { class TileContainerViewController: BaseViewController<TileContainer> {
lazy var backgroundColorPickerSelectorView = { lazy var backgroundColorPickerSelectorView = {
PickerSelectorView(title: "white", PickerSelectorView(title: "white",
@ -43,21 +43,21 @@ class TileContainerViewController: BaseViewController {
var heightTextField = NumericField() var heightTextField = NumericField()
var widthTextField = NumericField() var widthTextField = NumericField()
var tileContainer = TileContainer()
var backgroundImage = UIImage(named: "backgroundTest")! var backgroundImage = UIImage(named: "backgroundTest")!
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: tileContainer)) addContentTopView(view: .makeWrapper(for: component))
tileContainer.width = 150 component.width = 150
tileContainer.color = .black component.color = .black
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [widthTextField, heightTextField] } override func allTextFields() -> [TextField]? { [widthTextField, heightTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
formStackView.addArrangedSubview(Label().with{ formStackView.addArrangedSubview(Label().with{
$0.textStyle = .boldBodyLarge $0.textStyle = .boldBodyLarge
$0.text = "This object does NOT reflect normal \"surface\" changes, all properties are maually set" $0.text = "This object does NOT reflect normal \"surface\" changes, all properties are maually set"
@ -77,37 +77,37 @@ class TileContainerViewController: BaseViewController {
clickableSwitch.onChange = { [weak self] sender in clickableSwitch.onChange = { [weak self] sender in
guard let self else { return } guard let self else { return }
if sender.isOn { if sender.isOn {
self.tileContainer.onClick = { _ in self.component.onClick = { _ in
print("you click on me!") print("you click on me!")
} }
} else { } else {
self.tileContainer.onClick = nil self.component.onClick = nil
} }
} }
showBackgroundImageSwitch.onChange = { [weak self] sender in showBackgroundImageSwitch.onChange = { [weak self] sender in
if let image = self?.backgroundImage, sender.isOn { if let image = self?.backgroundImage, sender.isOn {
self?.tileContainer.backgroundImage = image self?.component.backgroundImage = image
} else { } else {
self?.tileContainer.backgroundImage = nil self?.component.backgroundImage = nil
} }
} }
showBorderSwitch.onChange = { [weak self] sender in showBorderSwitch.onChange = { [weak self] sender in
self?.tileContainer.showBorder = sender.isOn self?.component.showBorder = sender.isOn
} }
showDropShadowSwitch.onChange = { [weak self] sender in showDropShadowSwitch.onChange = { [weak self] sender in
self?.tileContainer.showDropShadows = sender.isOn self?.component.showDropShadows = sender.isOn
} }
heightTextField heightTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
if let n = NumberFormatter().number(from: text) { if let n = NumberFormatter().number(from: text) {
self?.tileContainer.height = CGFloat(truncating: n) self?.component.height = CGFloat(truncating: n)
} else { } else {
self?.tileContainer.height = nil self?.component.height = nil
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -115,7 +115,7 @@ class TileContainerViewController: BaseViewController {
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
if let n = NumberFormatter().number(from: text) { if let n = NumberFormatter().number(from: text) {
self?.tileContainer.width = CGFloat(truncating: n) self?.component.width = CGFloat(truncating: n)
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -123,35 +123,35 @@ class TileContainerViewController: BaseViewController {
func setupModel() { func setupModel() {
//setup UI //setup UI
surfacePickerSelectorView.text = tileContainer.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
backgroundColorPickerSelectorView.text = tileContainer.color.rawValue backgroundColorPickerSelectorView.text = component.color.rawValue
paddingPickerSelectorView.text = tileContainer.padding.rawValue paddingPickerSelectorView.text = component.padding.rawValue
scalingTypePickerSelectorView.text = tileContainer.aspectRatio.rawValue scalingTypePickerSelectorView.text = component.aspectRatio.rawValue
widthTextField.text = tileContainer.width != nil ? "\(tileContainer.width!)" : "" widthTextField.text = component.width != nil ? "\(component.width!)" : ""
heightTextField.text = tileContainer.height != nil ? "\(tileContainer.height!)" : "" heightTextField.text = component.height != nil ? "\(component.height!)" : ""
} }
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tileContainer.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
backgroundColorPickerSelectorView.onPickerDidSelect = { [weak self] item in backgroundColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tileContainer.color = item self?.component.color = item
} }
scalingTypePickerSelectorView.onPickerDidSelect = { [weak self] item in scalingTypePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tileContainer.aspectRatio = item self?.component.aspectRatio = item
} }
paddingPickerSelectorView.onPickerDidSelect = { [weak self] item in paddingPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tileContainer.padding = item self?.component.padding = item
} }
imageFallbackColorPickerSelectorView.onPickerDidSelect = { [weak self] item in imageFallbackColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tileContainer.imageFallbackColor = item self?.component.imageFallbackColor = item
} }
} }
} }

61
VDSSample/ViewControllers/TileletViewController.swift
View File

@ -11,7 +11,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class TileletViewController: BaseViewController { class TileletViewController: BaseViewController<Tilelet> {
lazy var titleTextStylePickerSelectorView = { lazy var titleTextStylePickerSelectorView = {
PickerSelectorView(title: "", PickerSelectorView(title: "",
@ -43,20 +43,19 @@ class TileletViewController: BaseViewController {
var showDescriptionIconSwitch = Toggle() var showDescriptionIconSwitch = Toggle()
var showDirectionalIconSwitch = Toggle() var showDirectionalIconSwitch = Toggle()
var badgeTextField = TextField() var badgeTextField = TextField()
var tilelet = Tilelet()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: tilelet)) addContentTopView(view: .makeWrapper(for: component))
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [titleTextField, subTitleTextField, widthTextField, heightTextField, textWidthTextField, textPercentageTextField, badgeTextField] } override func allTextFields() -> [TextField]? { [titleTextField, subTitleTextField, widthTextField, heightTextField, textWidthTextField, textPercentageTextField, badgeTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Clickable", view: .makeWrapper(for: clickableSwitch)) addFormRow(label: "Clickable", view: .makeWrapper(for: clickableSwitch))
@ -75,13 +74,13 @@ class TileletViewController: BaseViewController {
addFormRow(label: "Directional Icon", view: .makeWrapper(for: showDirectionalIconSwitch)) addFormRow(label: "Directional Icon", view: .makeWrapper(for: showDirectionalIconSwitch))
clickableSwitch.onChange = { [weak self] sender in clickableSwitch.onChange = { [weak self] sender in
guard let tilelet = self?.tilelet else { return } guard let self else { return }
if sender.isOn { if sender.isOn {
tilelet.onClick = { t in self.component.onClick = { t in
print("you click on me!") print("you click on me!")
} }
} else { } else {
tilelet.onClick = nil self.component.onClick = nil
} }
} }
@ -89,7 +88,7 @@ class TileletViewController: BaseViewController {
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
if let n = NumberFormatter().number(from: text) { if let n = NumberFormatter().number(from: text) {
self?.tilelet.width = CGFloat(truncating: n) self?.component.width = CGFloat(truncating: n)
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -97,9 +96,9 @@ class TileletViewController: BaseViewController {
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
if let n = NumberFormatter().number(from: text) { if let n = NumberFormatter().number(from: text) {
self?.tilelet.height = CGFloat(truncating: n) self?.component.height = CGFloat(truncating: n)
} else { } else {
self?.tilelet.height = nil self?.component.height = nil
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -108,10 +107,10 @@ class TileletViewController: BaseViewController {
.sink { [weak self] text in .sink { [weak self] text in
guard let self else { return } guard let self else { return }
if let n = NumberFormatter().number(from: text), n.floatValue > 50.0 { if let n = NumberFormatter().number(from: text), n.floatValue > 50.0 {
self.tilelet.textWidth = CGFloat(truncating: n) self.component.textWidth = CGFloat(truncating: n)
self.textPercentageTextField.text = "" self.textPercentageTextField.text = ""
} else { } else {
self.tilelet.textWidth = nil self.component.textWidth = nil
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -119,10 +118,10 @@ class TileletViewController: BaseViewController {
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
if let n = NumberFormatter().number(from: text), n.intValue > 15 && n.intValue <= 100 { if let n = NumberFormatter().number(from: text), n.intValue > 15 && n.intValue <= 100 {
self?.tilelet.textPercentage = CGFloat(truncating: n) self?.component.textPercentage = CGFloat(truncating: n)
self?.textWidthTextField.text = "" self?.textWidthTextField.text = ""
} else { } else {
self?.tilelet.textPercentage = nil self?.component.textPercentage = nil
} }
}.store(in: &subscribers) }.store(in: &subscribers)
@ -147,18 +146,18 @@ class TileletViewController: BaseViewController {
showDescriptionIconSwitch.onChange = { [weak self] sender in showDescriptionIconSwitch.onChange = { [weak self] sender in
if sender.isOn { if sender.isOn {
self?.showDirectionalIconSwitch.isOn = false self?.showDirectionalIconSwitch.isOn = false
self?.tilelet.descriptiveIconModel = .init(size: .medium, surface: .dark) self?.component.descriptiveIconModel = .init(size: .medium, surface: .dark)
} else { } else {
self?.tilelet.descriptiveIconModel = nil self?.component.descriptiveIconModel = nil
} }
} }
showDirectionalIconSwitch.onChange = { [weak self] sender in showDirectionalIconSwitch.onChange = { [weak self] sender in
if sender.isOn { if sender.isOn {
self?.showDescriptionIconSwitch.isOn = false self?.showDescriptionIconSwitch.isOn = false
self?.tilelet.directionalIconModel = .init(size: .medium, surface: .dark) self?.component.directionalIconModel = .init(size: .medium, surface: .dark)
} else { } else {
self?.tilelet.directionalIconModel = nil self?.component.directionalIconModel = nil
} }
} }
@ -168,49 +167,49 @@ class TileletViewController: BaseViewController {
let titleModel = Tilelet.TitleModel(text: "Save $XX on your monthly bill.") let titleModel = Tilelet.TitleModel(text: "Save $XX on your monthly bill.")
let subTitleModel = Tilelet.SubTitleModel(text: "Enroll in Auto Pay & paper-free billing to save on your monthly bill.") let subTitleModel = Tilelet.SubTitleModel(text: "Enroll in Auto Pay & paper-free billing to save on your monthly bill.")
tilelet.surface = .light component.surface = .light
tilelet.titleModel = titleModel component.titleModel = titleModel
tilelet.subTitleModel = subTitleModel component.subTitleModel = subTitleModel
//setup UI //setup UI
surfacePickerSelectorView.text = tilelet.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
otherTextStylePickerSelectorView.text = subTitleModel.textStyle.rawValue otherTextStylePickerSelectorView.text = subTitleModel.textStyle.rawValue
titleTextStylePickerSelectorView.text = titleModel.textStyle.rawValue titleTextStylePickerSelectorView.text = titleModel.textStyle.rawValue
subtitleColorPickerSelectorView.text = subTitleModel.textColor.rawValue subtitleColorPickerSelectorView.text = subTitleModel.textColor.rawValue
titleTextField.text = titleModel.text titleTextField.text = titleModel.text
subTitleTextField.text = subTitleModel.text subTitleTextField.text = subTitleModel.text
widthTextField.text = tilelet.width != nil ? "\(tilelet.width!)" : "" widthTextField.text = component.width != nil ? "\(component.width!)" : ""
} }
//sub models //sub models
func setBadgeModel() { func setBadgeModel() {
if let text = badgeTextField.text, !text.isEmpty { if let text = badgeTextField.text, !text.isEmpty {
tilelet.badgeModel = Tilelet.BadgeModel(text: text) component.badgeModel = Tilelet.BadgeModel(text: text)
} else { } else {
tilelet.badgeModel = nil component.badgeModel = nil
} }
} }
func setTitleModel() { func setTitleModel() {
if let text = titleTextField.text, !text.isEmpty { if let text = titleTextField.text, !text.isEmpty {
tilelet.titleModel = Tilelet.TitleModel(text: text, textStyle: titleTextStylePickerSelectorView.selectedItem) component.titleModel = Tilelet.TitleModel(text: text, textStyle: titleTextStylePickerSelectorView.selectedItem)
} else { } else {
tilelet.titleModel = nil component.titleModel = nil
} }
} }
func setSubTitleModel() { func setSubTitleModel() {
if let text = subTitleTextField.text, !text.isEmpty { if let text = subTitleTextField.text, !text.isEmpty {
tilelet.subTitleModel = Tilelet.SubTitleModel(text: text, textStyle: otherTextStylePickerSelectorView.selectedItem) component.subTitleModel = Tilelet.SubTitleModel(text: text, textStyle: otherTextStylePickerSelectorView.selectedItem)
} else { } else {
tilelet.subTitleModel = nil component.subTitleModel = nil
} }
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tilelet.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }

40
VDSSample/ViewControllers/TitleLockupViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class TitleLockupViewController: BaseViewController { class TitleLockupViewController: BaseViewController<TitleLockup> {
lazy var textPositionPickerSelectorView = { lazy var textPositionPickerSelectorView = {
PickerSelectorView(title: "left", PickerSelectorView(title: "left",
@ -40,20 +40,18 @@ class TitleLockupViewController: BaseViewController {
var titleTextField = TextField() var titleTextField = TextField()
var subTitleTextField = TextField() var subTitleTextField = TextField()
var titleLockup = TitleLockup()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: titleLockup) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [eyebrowTextField, titleTextField, subTitleTextField] } override func allTextFields() -> [TextField]? { [eyebrowTextField, titleTextField, subTitleTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Text Position", view: textPositionPickerSelectorView) addFormRow(label: "Text Position", view: textPositionPickerSelectorView)
@ -90,14 +88,14 @@ class TitleLockupViewController: BaseViewController {
let titleModel = TitleLockup.TitleModel(text: "Get more of our best") let titleModel = TitleLockup.TitleModel(text: "Get more of our best")
let subTitleModel = TitleLockup.SubTitleModel(text: "Get both of our best and pay less. Pair 5G Home Internet with Verizon mobile to save every month.") let subTitleModel = TitleLockup.SubTitleModel(text: "Get both of our best and pay less. Pair 5G Home Internet with Verizon mobile to save every month.")
titleLockup.eyebrowModel = eyebrowModel component.eyebrowModel = eyebrowModel
titleLockup.titleModel = titleModel component.titleModel = titleModel
titleLockup.subTitleModel = subTitleModel component.subTitleModel = subTitleModel
//setup UI //setup UI
surfacePickerSelectorView.text = titleLockup.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
textPositionPickerSelectorView.text = titleLockup.textPosition.rawValue textPositionPickerSelectorView.text = component.textPosition.rawValue
otherTextStylePickerSelectorView.text = titleLockup.otherTextStyle.rawValue otherTextStylePickerSelectorView.text = component.otherTextStyle.rawValue
titleTextStylePickerSelectorView.text = titleModel.textStyle.rawValue titleTextStylePickerSelectorView.text = titleModel.textStyle.rawValue
subtitleColorPickerSelectorView.text = subTitleModel.textColor.rawValue subtitleColorPickerSelectorView.text = subTitleModel.textColor.rawValue
eyebrowTextField.text = eyebrowModel.text eyebrowTextField.text = eyebrowModel.text
@ -107,37 +105,37 @@ class TitleLockupViewController: BaseViewController {
func setEyebrowModel() { func setEyebrowModel() {
if let text = eyebrowTextField.text, !text.isEmpty { if let text = eyebrowTextField.text, !text.isEmpty {
titleLockup.eyebrowModel = TitleLockup.EyebrowModel(text: text) component.eyebrowModel = TitleLockup.EyebrowModel(text: text)
} else { } else {
titleLockup.eyebrowModel = nil component.eyebrowModel = nil
} }
} }
func setTitleModel() { func setTitleModel() {
if let text = titleTextField.text, !text.isEmpty { if let text = titleTextField.text, !text.isEmpty {
titleLockup.titleModel = TitleLockup.TitleModel(text: text, textStyle: titleTextStylePickerSelectorView.selectedItem) component.titleModel = TitleLockup.TitleModel(text: text, textStyle: titleTextStylePickerSelectorView.selectedItem)
} else { } else {
titleLockup.titleModel = nil component.titleModel = nil
} }
} }
func setSubTitleModel() { func setSubTitleModel() {
if let text = subTitleTextField.text, !text.isEmpty { if let text = subTitleTextField.text, !text.isEmpty {
titleLockup.subTitleModel = TitleLockup.SubTitleModel(text: text, textColor: subtitleColorPickerSelectorView.selectedItem) component.subTitleModel = TitleLockup.SubTitleModel(text: text, textColor: subtitleColorPickerSelectorView.selectedItem)
} else { } else {
titleLockup.subTitleModel = nil component.subTitleModel = nil
} }
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.titleLockup.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.titleLockup.textPosition = item self?.component.textPosition = item
} }
titleTextStylePickerSelectorView.onPickerDidSelect = { [weak self] item in titleTextStylePickerSelectorView.onPickerDidSelect = { [weak self] item in
@ -145,7 +143,7 @@ class TitleLockupViewController: BaseViewController {
} }
otherTextStylePickerSelectorView.onPickerDidSelect = { [weak self] item in otherTextStylePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.titleLockup.otherTextStyle = item self?.component.otherTextStyle = item
} }
subtitleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in subtitleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in

38
VDSSample/ViewControllers/ToggleViewController.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class ToggleViewController: BaseViewController { class ToggleViewController: BaseViewController<Toggle> {
lazy var textSizePickerSelectorView = { lazy var textSizePickerSelectorView = {
PickerSelectorView(title: "", PickerSelectorView(title: "",
@ -42,19 +42,17 @@ class ToggleViewController: BaseViewController {
var onTextField = TextField() var onTextField = TextField()
var offTextField = TextField() var offTextField = TextField()
var toggle = Toggle()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: toggle)) addContentTopView(view: .makeWrapper(for: component))
setupForm()
setupPicker() setupPicker()
} }
override func allTextFields() -> [TextField]? { [onTextField, offTextField] } override func allTextFields() -> [TextField]? { [onTextField, offTextField] }
func setupForm() { override func setupForm() {
super.setupForm()
addFormRow(label: "Show Text", view: .makeWrapper(for: showTextSwitch)) addFormRow(label: "Show Text", view: .makeWrapper(for: showTextSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
@ -69,7 +67,7 @@ class ToggleViewController: BaseViewController {
//add textFormStackView to main form //add textFormStackView to main form
formStackView.addArrangedSubview(textFormStackView) formStackView.addArrangedSubview(textFormStackView)
toggle.onChange = { [weak self] toggle in component.onChange = { [weak self] toggle in
let alertController:UIAlertController = UIAlertController(title: "Alert", let alertController:UIAlertController = UIAlertController(title: "Alert",
message: "Toggle Value: \(toggle.isOn)", message: "Toggle Value: \(toggle.isOn)",
preferredStyle: UIAlertController.Style.alert) preferredStyle: UIAlertController.Style.alert)
@ -79,54 +77,54 @@ class ToggleViewController: BaseViewController {
} }
showTextSwitch.onChange = { [weak self] sender in showTextSwitch.onChange = { [weak self] sender in
self?.toggle.showText = sender.isOn self?.component.showText = sender.isOn
self?.textFormStackView.isHidden = !sender.isOn self?.textFormStackView.isHidden = !sender.isOn
} }
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.toggle.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
boldSwitch.onChange = { [weak self] sender in boldSwitch.onChange = { [weak self] sender in
self?.toggle.textWeight = sender.isOn ? .bold : .regular self?.component.textWeight = sender.isOn ? .bold : .regular
} }
onTextField onTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.toggle.onText = text self?.component.onText = text
}.store(in: &subscribers) }.store(in: &subscribers)
offTextField offTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.toggle.offText = text self?.component.offText = text
}.store(in: &subscribers) }.store(in: &subscribers)
textFormStackView.isHidden = true textFormStackView.isHidden = true
//setup UI //setup UI
surfacePickerSelectorView.text = toggle.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
textSizePickerSelectorView.text = toggle.textSize.rawValue textSizePickerSelectorView.text = component.textSize.rawValue
textPositionPickerSelectorView.text = toggle.textPosition.rawValue textPositionPickerSelectorView.text = component.textPosition.rawValue
onTextField.text = toggle.onText onTextField.text = component.onText
offTextField.text = toggle.offText offTextField.text = component.offText
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.toggle.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
textSizePickerSelectorView.onPickerDidSelect = { [weak self] item in textSizePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.toggle.textSize = item self?.component.textSize = item
} }
textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.toggle.textPosition = item self?.component.textPosition = item
} }
} }

40
VDSSample/ViewControllers/TooltipViewController.swift
View File

@ -11,7 +11,7 @@ import VDS
import VDSColorTokens import VDSColorTokens
import Combine import Combine
class TooltipViewController: BaseViewController { class TooltipViewController: BaseViewController<Tooltip> {
var disabledSwitch = Toggle() var disabledSwitch = Toggle()
var titleTextField = TextField() var titleTextField = TextField()
@ -30,20 +30,18 @@ class TooltipViewController: BaseViewController {
items: Tooltip.FillColor.allCases) items: Tooltip.FillColor.allCases)
}() }()
var tooltip = Tooltip()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: tooltip, edgeSpacing: 16.0), edgeSpacing: 0.0) addContentTopView(view: .makeWrapper(for: component, edgeSpacing: 16.0), edgeSpacing: 0.0)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [titleTextField, contentTextField, closeButtonTextField] } override func allTextFields() -> [TextField]? { [titleTextField, contentTextField, closeButtonTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Size", view: sizePickerSelectorView) addFormRow(label: "Size", view: sizePickerSelectorView)
@ -51,55 +49,55 @@ class TooltipViewController: BaseViewController {
addFormRow(label: "Title", view: titleTextField) addFormRow(label: "Title", view: titleTextField)
addFormRow(label: "Content", view: contentTextField) addFormRow(label: "Content", view: contentTextField)
addFormRow(label: "Close Button Text", view: closeButtonTextField) addFormRow(label: "Close Button Text", view: closeButtonTextField)
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.tooltip.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
titleTextField titleTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.tooltip.title = text self?.component.title = text
}.store(in: &subscribers) }.store(in: &subscribers)
contentTextField contentTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.tooltip.content = text self?.component.content = text
}.store(in: &subscribers) }.store(in: &subscribers)
closeButtonTextField closeButtonTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.tooltip.closeButtonText = text self?.component.closeButtonText = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
tooltip.title = "5G Ultra Wideband is available in your area." component.title = "5G Ultra Wideband is available in your area."
tooltip.content = "$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in/promo credit applied over 36 mos.; promo credit ends if eligibility req’s are no longer met; 0% APR. Trade-in conditions apply.$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in." component.content = "$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in/promo credit applied over 36 mos.; promo credit ends if eligibility req’s are no longer met; 0% APR. Trade-in conditions apply.$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in."
//setup UI //setup UI
surfacePickerSelectorView.text = tooltip.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = tooltip.disabled disabledSwitch.isOn = component.disabled
titleTextField.text = tooltip.title titleTextField.text = component.title
contentTextField.text = tooltip.content contentTextField.text = component.content
closeButtonTextField.text = tooltip.closeButtonText closeButtonTextField.text = component.closeButtonText
} }
//Picker //Picker
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tooltip.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
sizePickerSelectorView.onPickerDidSelect = { [weak self] item in sizePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tooltip.size = item self?.component.size = item
} }
fillColorPickerSelectorView.onPickerDidSelect = { [weak self] item in fillColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tooltip.fillColor = item self?.component.fillColor = item
} }
} }

52
VDSSample/ViewControllers/TrailingTooltipLabel.swift
View File

@ -10,7 +10,7 @@ import UIKit
import VDS import VDS
import VDSColorTokens import VDSColorTokens
class TrailingTooltipLabelViewController: BaseViewController { class TrailingTooltipLabelViewController: BaseViewController<TrailingTooltipLabel> {
lazy var textSizePickerSelectorView = { lazy var textSizePickerSelectorView = {
TextSizePickerSelectorView(title: "", TextSizePickerSelectorView(title: "",
@ -44,20 +44,18 @@ class TrailingTooltipLabelViewController: BaseViewController {
private var isBold: Bool = false private var isBold: Bool = false
var tooltipLabel = TrailingTooltipLabel()
override func viewDidLoad() { override func viewDidLoad() {
super.viewDidLoad() super.viewDidLoad()
addContentTopView(view: tooltipLabel) addContentTopView(view: component)
setupForm()
setupPicker() setupPicker()
setupModel() setupModel()
} }
override func allTextFields() -> [TextField]? { [textField, titleTextField, contentTextField, closeButtonTextField] } override func allTextFields() -> [TextField]? { [textField, titleTextField, contentTextField, closeButtonTextField] }
func setupForm(){ override func setupForm(){
super.setupForm()
addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch)) addFormRow(label: "Disabled", view: .makeWrapper(for: disabledSwitch))
addFormRow(label: "Bold", view: .makeWrapper(for: boldSwitch)) addFormRow(label: "Bold", view: .makeWrapper(for: boldSwitch))
addFormRow(label: "Surface", view: surfacePickerSelectorView) addFormRow(label: "Surface", view: surfacePickerSelectorView)
@ -72,7 +70,7 @@ class TrailingTooltipLabelViewController: BaseViewController {
addFormRow(label: "Tooltip Close Button Text", view: closeButtonTextField) addFormRow(label: "Tooltip Close Button Text", view: closeButtonTextField)
disabledSwitch.onChange = { [weak self] sender in disabledSwitch.onChange = { [weak self] sender in
self?.tooltipLabel.disabled = sender.isOn self?.component.disabled = sender.isOn
} }
boldSwitch boldSwitch
@ -85,40 +83,40 @@ class TrailingTooltipLabelViewController: BaseViewController {
textField textField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.tooltipLabel.labelText = text self?.component.labelText = text
}.store(in: &subscribers) }.store(in: &subscribers)
titleTextField titleTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.tooltipLabel.tooltipTitle = text self?.component.tooltipTitle = text
}.store(in: &subscribers) }.store(in: &subscribers)
contentTextField contentTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.tooltipLabel.tooltipContent = text self?.component.tooltipContent = text
}.store(in: &subscribers) }.store(in: &subscribers)
closeButtonTextField closeButtonTextField
.textPublisher .textPublisher
.sink { [weak self] text in .sink { [weak self] text in
self?.tooltipLabel.tooltipCloseButtonText = text self?.component.tooltipCloseButtonText = text
}.store(in: &subscribers) }.store(in: &subscribers)
} }
func setupModel() { func setupModel() {
tooltipLabel.labelText = "Label Component" component.labelText = "Label Component"
tooltipLabel.labelTextStyle = .featureSmall component.labelTextStyle = .featureSmall
tooltipLabel.tooltipTitle = "5G Ultra Wideband is available in your area." component.tooltipTitle = "5G Ultra Wideband is available in your area."
tooltipLabel.tooltipContent = "$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in/promo credit applied over 36 mos.; promo credit ends if eligibility req’s are no longer met; 0% APR. Trade-in conditions apply.$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in." component.tooltipContent = "$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in/promo credit applied over 36 mos.; promo credit ends if eligibility req’s are no longer met; 0% APR. Trade-in conditions apply.$799.99 (128 GB only) device payment purchase w/new or upgrade smartphone line on postpaid 5G Unlimited plans only req'd. Less up to $800 trade-in."
//setup UI //setup UI
surfacePickerSelectorView.text = tooltipLabel.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = tooltipLabel.disabled disabledSwitch.isOn = component.disabled
boldSwitch.isOn = isBold boldSwitch.isOn = isBold
textField.text = tooltipLabel.labelText textField.text = component.labelText
//set the font //set the font
fontCategory = .feature fontCategory = .feature
@ -127,11 +125,11 @@ class TrailingTooltipLabelViewController: BaseViewController {
textSizePickerSelectorView.text = "Small" textSizePickerSelectorView.text = "Small"
//setup UI //setup UI
surfacePickerSelectorView.text = tooltipLabel.surface.rawValue surfacePickerSelectorView.text = component.surface.rawValue
disabledSwitch.isOn = tooltipLabel.disabled disabledSwitch.isOn = component.disabled
titleTextField.text = tooltipLabel.tooltipTitle titleTextField.text = component.tooltipTitle
contentTextField.text = tooltipLabel.tooltipContent contentTextField.text = component.tooltipContent
closeButtonTextField.text = tooltipLabel.tooltipCloseButtonText closeButtonTextField.text = component.tooltipCloseButtonText
} }
@ -159,18 +157,18 @@ class TrailingTooltipLabelViewController: BaseViewController {
func updateLabelStyle(){ func updateLabelStyle(){
if let style = fontCategory.style(for: textSize, isBold: isBold) { if let style = fontCategory.style(for: textSize, isBold: isBold) {
tooltipLabel.labelTextStyle = style component.labelTextStyle = style
} }
} }
func setupPicker(){ func setupPicker(){
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tooltipLabel.surface = item self?.component.surface = item
self?.contentTopView.backgroundColor = item.color self?.contentTopView.backgroundColor = item.color
} }
textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in textPositionPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tooltipLabel.labelTextPosition = item self?.component.labelTextPosition = item
} }
textSizePickerSelectorView.onPickerDidSelect = { [weak self] item in textSizePickerSelectorView.onPickerDidSelect = { [weak self] item in
@ -182,7 +180,7 @@ class TrailingTooltipLabelViewController: BaseViewController {
} }
sizePickerSelectorView.onPickerDidSelect = { [weak self] item in sizePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.tooltipLabel.tooltipSize = item self?.component.tooltipSize = item
} }
} }