added component sample
Signed-off-by: Matt Bruce <matt.bruce@verizon.com>
This commit is contained in:
Matt Bruce
parent
6f86f8755b
commit
20689203c8
@ -211,3 +211,14 @@ class BadgeIndicatorViewController: BaseViewController<BadgeIndicator> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension BadgeIndicatorViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.fillColor = .red
|
||||
component.number = 23
|
||||
component.kind = .simple
|
||||
component.size = .medium
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -198,3 +198,18 @@ class ButtonGroupViewController: BaseViewController<ButtonGroup> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension ButtonGroupViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.buttons = [
|
||||
Button().with{ $0.use = .secondary; $0.text = "Secondary" },
|
||||
Button().with{ $0.use = .primary; $0.text = "Primary" },
|
||||
TextLink().with { $0.size = .large; $0.text = "Large Text Link" },
|
||||
TextLink().with { $0.text = "Widge Label Button" },
|
||||
TextLinkCaret().with { $0.text = "Text Link Caret" }
|
||||
]
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -169,3 +169,12 @@ extension UITextField {
|
||||
return CGFloat(double)
|
||||
}
|
||||
}
|
||||
|
||||
extension ButtonIconViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.iconName = .addToFavorite
|
||||
component.size = .large
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -115,4 +115,29 @@ class CheckboxGroupViewController: BaseViewController<CheckboxGroup> {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
extension CheckboxGroupViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
|
||||
var checkbox1 = CheckboxGroup.CheckboxModel()
|
||||
checkbox1.inputId = "model1"
|
||||
checkbox1.value = "model 1 Value"
|
||||
checkbox1.labelText = "iPhone 11 Bundle 1"
|
||||
checkbox1.childText = "Apple iPhone 11 - 64 GB\nOtterbox Case Red\nScreen Protector"
|
||||
checkbox1.errorText = "Please Choose 1"
|
||||
|
||||
var checkbox2 = CheckboxGroup.CheckboxModel()
|
||||
checkbox2.inputId = "model2"
|
||||
checkbox2.value = "model 2 Value"
|
||||
checkbox2.labelText = "iPhone 11 Bundle 2"
|
||||
checkbox2.childText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
|
||||
checkbox2.errorText = "Please Choose 2"
|
||||
|
||||
component.selectorModels = [checkbox1, checkbox2]
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -94,3 +94,13 @@ class CheckboxItemViewController: BaseViewController<CheckboxItem> {
|
||||
}
|
||||
}
|
||||
|
||||
extension CheckboxItemViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.labelText = "Terms and conditions"
|
||||
component.childText = "I agree to Verizon's terms and conditions click here"
|
||||
component.errorText = "Error Text"
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -61,3 +61,10 @@ class CheckboxViewController: BaseViewController<Checkbox> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension CheckboxViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -87,3 +87,15 @@ class IconViewController: BaseViewController<Icon> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension IconViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
let name = Icon.Name.accessibility
|
||||
let color = UIColor.VDSColor.paletteBlack
|
||||
component.color = color.uiColor
|
||||
component.name = name
|
||||
component.size = .XLarge
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -167,3 +167,18 @@ class InputFieldViewController: BaseViewController<InputField> {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
extension InputFieldViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.type = .text
|
||||
component.width = 328
|
||||
component.labelText = "Street Address"
|
||||
component.helperText = "For example: 123 Verizon St"
|
||||
component.errorText = "Enter a valid address."
|
||||
component.successText = "Good job entering a valid address!"
|
||||
component.tooltipTitle = "Check the formatting of your address"
|
||||
component.tooltipContent = "House/Building number then street name"
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -340,3 +340,12 @@ extension Slider {
|
||||
CGFloat((value * 100).rounded() / 100)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
extension LabelViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.text = "Helg¹ worldg Hell¹ worldg"
|
||||
return TestViewWrapper(component: component, isTrailing: false)
|
||||
}
|
||||
}
|
||||
|
||||
@ -40,3 +40,10 @@ class LineViewController: BaseViewController<Line> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension LineViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -82,3 +82,10 @@ class LoaderViewController: BaseViewController<Loader>, LoaderLaunchable {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension LoaderViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -145,3 +145,21 @@ class NotificationViewController: BaseViewController<VDS.Notification> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension NotificationViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
|
||||
let titleDefaultText = "This is title"
|
||||
let subtitleDefaultText = "This is subtitle"
|
||||
let firstButtonDefaultText = "Button 1"
|
||||
let secondButtonDefaultText = "Button 2"
|
||||
|
||||
component.title = titleDefaultText
|
||||
component.subTitle = subtitleDefaultText
|
||||
component.primaryButtonModel = .init(text: firstButtonDefaultText, onClick: {b in print("\(b.text!) click")})
|
||||
component.secondaryButtonModel = .init(text: secondButtonDefaultText, onClick: {b in print("\(b.text!) click")})
|
||||
component.onCloseClick = {_ in print("notification on close click")}
|
||||
return TestViewWrapper(component: component, isTrailing: false)
|
||||
}
|
||||
}
|
||||
|
||||
@ -110,3 +110,27 @@ class RadioBoxGroupViewController: BaseViewController<RadioBoxGroup>{
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
extension RadioBoxGroupViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
|
||||
var radioBox1 = RadioBoxGroup.RadioBoxModel()
|
||||
radioBox1.inputId = "model1"
|
||||
radioBox1.selected = true
|
||||
radioBox1.value = "model 1 Value"
|
||||
radioBox1.text = "iPhone 11 Bundle 1"
|
||||
radioBox1.subText = "Apple iPhone 11 - 64 GB\nOtterbox Case Red\nScreen Protector"
|
||||
radioBox1.subTextRight = "Right Text"
|
||||
|
||||
var radioBox2 = RadioBoxGroup.RadioBoxModel()
|
||||
radioBox2.inputId = "model2"
|
||||
radioBox2.value = "model 2 Value"
|
||||
radioBox2.text = "iPhone 11 Bundle 2"
|
||||
radioBox2.subText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
|
||||
|
||||
component.selectorModels = [radioBox1, radioBox2]
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -107,3 +107,32 @@ class RadioButtonGroupViewController: BaseViewController<RadioButtonGroup> {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
extension RadioButtonGroupViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
|
||||
var radioButton1 = RadioButtonGroup.RadioButtonModel()
|
||||
radioButton1.inputId = "model1"
|
||||
radioButton1.value = "model 1 Value"
|
||||
radioButton1.labelText = "iPhone 11 Bundle 1"
|
||||
radioButton1.childText = "Apple iPhone 11 - 64 GB\nOtterbox Case Red\nScreen Protector"
|
||||
|
||||
var radioButton2 = RadioButtonGroup.RadioButtonModel()
|
||||
radioButton2.inputId = "model2"
|
||||
radioButton2.value = "model 2 Value"
|
||||
radioButton2.labelText = "iPhone 11 Bundle 2"
|
||||
radioButton2.childText = "Apple iPhone 11 - 128 GB\nOtterbox Case Black\nScreen Protector"
|
||||
|
||||
var radioButton3 = RadioButtonGroup.RadioButtonModel()
|
||||
radioButton3.inputId = "model3"
|
||||
radioButton3.value = "model 3 Value"
|
||||
radioButton3.labelText = "iPhone 11 Bundle 3"
|
||||
radioButton3.childText = "Apple iPhone 11 - 256 GB\nOtterbox Case Black\nScreen Protector"
|
||||
|
||||
component.selectorModels = [radioButton1, radioButton2, radioButton3]
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -98,3 +98,13 @@ class RadioButtonItemViewController: BaseViewController<RadioButtonItem> {
|
||||
}
|
||||
}
|
||||
|
||||
extension RadioButtonItemViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.labelText = "Terms and conditions"
|
||||
component.childText = "I agree to Verizon's terms and conditions click here"
|
||||
component.errorText = "Error Text"
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -65,3 +65,10 @@ class RadioButtonViewController: BaseViewController<RadioButton> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension RadioButtonViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -104,3 +104,55 @@ class RadioSwatchGroupViewController: BaseViewController<RadioSwatchGroup> {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
extension RadioSwatchGroupViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
|
||||
var radioSwatch1 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch1.fillImage = UIImage(named: "imageSwatch")
|
||||
radioSwatch1.text = "Image"
|
||||
radioSwatch1.inputId = "radioSwatch1"
|
||||
|
||||
var radioSwatch2 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch2.primaryColor = .red
|
||||
radioSwatch2.secondaryColor = .blue
|
||||
radioSwatch2.text = "Red/Blue"
|
||||
radioSwatch2.inputId = "radioSwatch2"
|
||||
|
||||
var radioSwatch3 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch3.primaryColor = .green
|
||||
radioSwatch3.text = "Green"
|
||||
radioSwatch3.inputId = "radioSwatch3"
|
||||
|
||||
var radioSwatch4 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch4.primaryColor = .orange
|
||||
radioSwatch4.text = "Orange"
|
||||
radioSwatch4.inputId = "radioSwatch4"
|
||||
|
||||
var radioSwatch5 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch5.primaryColor = .brown
|
||||
radioSwatch5.text = "Brown"
|
||||
radioSwatch5.inputId = "radioSwatch5"
|
||||
|
||||
var radioSwatch6 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch6.primaryColor = .yellow
|
||||
radioSwatch6.text = "Yellow"
|
||||
radioSwatch6.inputId = "radioSwatch6"
|
||||
|
||||
var radioSwatch7 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch7.primaryColor = .purple
|
||||
radioSwatch7.text = "Puple"
|
||||
radioSwatch7.inputId = "radioSwatch7"
|
||||
|
||||
var radioSwatch8 = RadioSwatchGroup.RadioSwatchModel()
|
||||
radioSwatch8.primaryColor = .systemPink
|
||||
radioSwatch8.text = "Pink"
|
||||
radioSwatch8.inputId = "radioSwatch8"
|
||||
|
||||
component.selectorModels = [radioSwatch1, radioSwatch2, radioSwatch3, radioSwatch4, radioSwatch5, radioSwatch6, radioSwatch7, radioSwatch8]
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: false)
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -44,7 +44,7 @@ public class TableViewTestController: UITableViewController, Initable, Surfaceab
|
||||
}
|
||||
tableView.register(VDSCell.self, forCellReuseIdentifier: "cell")
|
||||
tableView.allowsSelection = false
|
||||
tableView.estimatedRowHeight = 100
|
||||
tableView.estimatedRowHeight = 45
|
||||
tableView.separatorStyle = .none
|
||||
tableView.rowHeight = UITableView.automaticDimension
|
||||
tableView.reloadData()
|
||||
@ -67,20 +67,9 @@ public class TableViewTestController: UITableViewController, Initable, Surfaceab
|
||||
public override func numberOfSections(in tableView: UITableView) -> Int {
|
||||
components.count
|
||||
}
|
||||
|
||||
|
||||
public override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
|
||||
let header = UIView().with { $0.backgroundColor = VDSColor.paletteGray44 }
|
||||
let label = Label().with {
|
||||
$0.text = "\(type(of: components[section].component))"
|
||||
$0.surface = .dark
|
||||
$0.textStyle = .boldTitleSmall
|
||||
}
|
||||
header.addSubview(label)
|
||||
label.pinTrailing(16)
|
||||
label.pinLeading(16)
|
||||
label.centerYAnchor.constraint(equalTo: header.centerYAnchor).activate()
|
||||
return header
|
||||
public override func tableView(_ tableView: UITableView, titleForHeaderInSection section: Int) -> String? {
|
||||
"\(type(of: components[section].component))"
|
||||
}
|
||||
|
||||
public override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
|
||||
@ -96,8 +85,8 @@ public class TableViewTestController: UITableViewController, Initable, Surfaceab
|
||||
cell.prepareForReuse()
|
||||
cell.surface = surface
|
||||
let wrapper = components[indexPath.section]
|
||||
cell.component = wrapper.component
|
||||
cell.isTrailing = wrapper.isTrailing
|
||||
cell.component = wrapper.component
|
||||
return cell
|
||||
}
|
||||
|
||||
@ -106,13 +95,20 @@ public class TableViewTestController: UITableViewController, Initable, Surfaceab
|
||||
public class VDSCell: UITableViewCell, AppleGuidlinesTouchable, Surfaceable {
|
||||
public var isTrailing: Bool = true
|
||||
public var surface: Surface = .light
|
||||
public var shouldWrap: Bool = true
|
||||
public var component: TestView? {
|
||||
didSet {
|
||||
contentView.subviews.forEach { $0.removeFromSuperview() }
|
||||
let edges: UIEdgeInsets = .init(top: 16, left: 16, bottom: 16, right: 16)
|
||||
guard var component else { return }
|
||||
let wrapper = UIView.makeWrapper(for: component, isTrailing: isTrailing)
|
||||
contentView.addSubview(wrapper)
|
||||
wrapper.pinToSuperView(.init(top: 16, left: 16, bottom: 16, right: 16))
|
||||
if shouldWrap {
|
||||
let wrapper = UIView.makeWrapper(for: component, isTrailing: isTrailing)
|
||||
contentView.addSubview(wrapper)
|
||||
wrapper.pinToSuperView(edges)
|
||||
} else {
|
||||
contentView.addSubview(component)
|
||||
component.pinToSuperView(edges)
|
||||
}
|
||||
backgroundColor = surface.color
|
||||
component.surface = surface
|
||||
}
|
||||
|
||||
@ -142,3 +142,17 @@ class TabsViewController: BaseViewController<Tabs> {
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
extension TabsViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.tabModels = [
|
||||
.init(text: "Accessories"),
|
||||
.init(text: "Internet and TV"),
|
||||
.init(text: "Customer Service"),
|
||||
.init(text: "Contact Us")
|
||||
]
|
||||
|
||||
return TestViewWrapper(component: component, isTrailing: false)
|
||||
}
|
||||
}
|
||||
|
||||
@ -139,3 +139,15 @@ class TextAreaViewController: BaseViewController<TextArea> {
|
||||
}
|
||||
}
|
||||
|
||||
extension TextAreaViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.width = 328
|
||||
component.labelText = "Street Address"
|
||||
component.helperText = "For example: 123 Verizon St"
|
||||
component.errorText = "Enter a valid address."
|
||||
component.tooltipTitle = "Check the formatting of your address"
|
||||
component.tooltipContent = "House/Building number then street name"
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -147,3 +147,12 @@ class TileContainerViewController: BaseViewController<TileContainer> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension TileContainerViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.width = 150
|
||||
component.color = .black
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -172,3 +172,18 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension TitleLockupViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
let eyebrowModel = TitleLockup.EyebrowModel(text: "Today only.")
|
||||
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.")
|
||||
|
||||
component.eyebrowModel = eyebrowModel
|
||||
component.titleModel = titleModel
|
||||
component.subTitleModel = subTitleModel
|
||||
component.debugBorder(show: true)
|
||||
return TestViewWrapper(component: component, isTrailing: false)
|
||||
}
|
||||
}
|
||||
|
||||
@ -115,3 +115,10 @@ class ToggleViewController: BaseViewController<Toggle> {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
extension ToggleViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
@ -100,3 +100,13 @@ class TooltipViewController: BaseViewController<Tooltip> {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
extension TooltipViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.title = "5G Ultra Wideband is available in your area."
|
||||
component.content = "$799.99 (128 GB only) "
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -165,6 +165,17 @@ class TrailingTooltipLabelViewController: BaseViewController<TrailingTooltipLabe
|
||||
fontCategoryPickerSelectorView.onPickerDidSelect = { [weak self] item in
|
||||
self?.fontCategory = item
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
extension TrailingTooltipLabelViewController: Componentable {
|
||||
static func getComponent() -> TestViewWrapper {
|
||||
let component = Self.makeComponent()
|
||||
component.labelText = "5G Ultra Wideband is available in your area"
|
||||
component.tooltipTitle = "5G Ultra Wideband is available in your area."
|
||||
component.tooltipContent = "$799.99 (128 GB only)"
|
||||
return TestViewWrapper(component: component, isTrailing: true)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
Loading…
Reference in New Issue
Block a user