Merge branch 'develop' of https://gitlab.verizon.com/BPHV_MIPS/vds_ios_sample into vasavk/carousel

# Conflicts:
#	VDSSample.xcodeproj/project.pbxproj
This commit is contained in:
vasavk 2024-06-11 15:35:23 +05:30
commit 4fe4fa0eef
13 changed files with 663 additions and 244 deletions

View File

@ -1,6 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<Workspace
version = "1.0">
<FileRef
location = "group:workspaceSettings.xcconfig">
</FileRef>
<FileRef
location = "container:VDSSample.xcodeproj">
</FileRef>

View File

@ -37,6 +37,7 @@
186D13CD2BBA990800986B53 /* DropdownSelectViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 186D13CC2BBA990800986B53 /* DropdownSelectViewController.swift */; };
18A3F1302BD9332500498E4A /* CalendarViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18A3F12F2BD9332500498E4A /* CalendarViewController.swift */; };
18AE87522C06FDD60075F181 /* CarouselViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 18AE87512C06FDD60075F181 /* CarouselViewController.swift */; };
440B84CC2BD8E98B004A732A /* TableViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 440B84CB2BD8E98B004A732A /* TableViewController.swift */; };
445BA07A29C088470036A7C5 /* NotificationViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 445BA07929C088470036A7C5 /* NotificationViewController.swift */; };
44604AD929CE1CF900E62B51 /* LineViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 44604AD829CE1CF900E62B51 /* LineViewController.swift */; };
5FC35BE928D5235A004EBEAC /* ButtonViewController.swift in Sources */ = {isa = PBXBuildFile; fileRef = 5FC35BE828D5235A004EBEAC /* ButtonViewController.swift */; };
@ -134,6 +135,7 @@
186D13CC2BBA990800986B53 /* DropdownSelectViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = DropdownSelectViewController.swift; sourceTree = "<group>"; };
18A3F12F2BD9332500498E4A /* CalendarViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CalendarViewController.swift; sourceTree = "<group>"; };
18AE87512C06FDD60075F181 /* CarouselViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = CarouselViewController.swift; sourceTree = "<group>"; };
440B84CB2BD8E98B004A732A /* TableViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TableViewController.swift; sourceTree = "<group>"; };
445BA07929C088470036A7C5 /* NotificationViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = NotificationViewController.swift; sourceTree = "<group>"; };
44604AD829CE1CF900E62B51 /* LineViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = LineViewController.swift; sourceTree = "<group>"; };
5FC35BE828D5235A004EBEAC /* ButtonViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ButtonViewController.swift; sourceTree = "<group>"; };
@ -163,6 +165,8 @@
EA5E305B295111050082B959 /* TileletViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TileletViewController.swift; sourceTree = "<group>"; };
EA5F86CD2A1E863F00BC83E4 /* TabsContainerViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = TabsContainerViewController.swift; sourceTree = "<group>"; };
EA6642962BD1B2E700D81DC4 /* ColorPickerView.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ColorPickerView.swift; sourceTree = "<group>"; };
EA78C7A42C0E64A800430AD1 /* vds-sample-dev.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; path = "vds-sample-dev.xcconfig"; sourceTree = "<group>"; };
EA78C7A52C0E64CC00430AD1 /* vds-sample.xcconfig */ = {isa = PBXFileReference; lastKnownFileType = text.xcconfig; path = "vds-sample.xcconfig"; sourceTree = "<group>"; };
EA81410D2A0ED8DC004F60D2 /* ButtonIconViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = ButtonIconViewController.swift; sourceTree = "<group>"; };
EA89201828B56DF5006B9984 /* RadioBoxGroupViewController.swift */ = {isa = PBXFileReference; lastKnownFileType = sourcecode.swift; path = RadioBoxGroupViewController.swift; sourceTree = "<group>"; };
EA89203F28B66CE2006B9984 /* ScrollViewController.swift */ = {isa = PBXFileReference; fileEncoding = 4; lastKnownFileType = sourcecode.swift; path = ScrollViewController.swift; sourceTree = "<group>"; };
@ -342,6 +346,7 @@
EAF7F11928A14A0E00B287F5 /* RadioButtonGroupViewController.swift */,
EA0D1C322A673FD400E5C127 /* RadioButtonItemViewController.swift */,
EA0D1C302A673F3500E5C127 /* RadioButtonViewController.swift */,
440B84CB2BD8E98B004A732A /* TableViewController.swift */,
EA5F86CD2A1E863F00BC83E4 /* TabsContainerViewController.swift */,
EA596AB92A16B2ED00300C4B /* TabsViewController.swift */,
EA985C24296E06EA00F2FF2E /* TextAreaViewController.swift */,
@ -362,6 +367,8 @@
children = (
EAF7F0C4289DA24F00B287F5 /* Artifactory */,
EAF7F0792899698800B287F5 /* Resources */,
EA78C7A42C0E64A800430AD1 /* vds-sample-dev.xcconfig */,
EA78C7A52C0E64CC00430AD1 /* vds-sample.xcconfig */,
);
path = "Supporting Files";
sourceTree = "<group>";
@ -544,6 +551,7 @@
EA596ABA2A16B2ED00300C4B /* TabsViewController.swift in Sources */,
EA89204E28B67332006B9984 /* CheckBoxGroupViewController.swift in Sources */,
EAA5EEAD28EB6924003B3210 /* InputFieldViewController.swift in Sources */,
440B84CC2BD8E98B004A732A /* TableViewController.swift in Sources */,
EA985C25296E06EA00F2FF2E /* TextAreaViewController.swift in Sources */,
1832AC5B2BA1347B008AE476 /* BreadcrumbsViewController.swift in Sources */,
EA81410E2A0ED8DC004F60D2 /* ButtonIconViewController.swift in Sources */,
@ -583,6 +591,7 @@
/* Begin XCBuildConfiguration section */
EA3C3BAB289966F1000CA526 /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A42C0E64A800430AD1 /* vds-sample-dev.xcconfig */;
buildSettings = {
ALWAYS_SEARCH_USER_PATHS = NO;
CLANG_ANALYZER_NONNULL = YES;
@ -643,6 +652,7 @@
};
EA3C3BAC289966F1000CA526 /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A52C0E64CC00430AD1 /* vds-sample.xcconfig */;
buildSettings = {
ALWAYS_SEARCH_USER_PATHS = NO;
CLANG_ANALYZER_NONNULL = YES;
@ -697,6 +707,7 @@
};
EA3C3BAE289966F1000CA526 /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A42C0E64A800430AD1 /* vds-sample-dev.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
ASSETCATALOG_COMPILER_GLOBAL_ACCENT_COLOR_NAME = AccentColor;
@ -704,7 +715,7 @@
CODE_SIGN_IDENTITY = "Apple Development";
"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
CODE_SIGN_STYLE = Manual;
CURRENT_PROJECT_VERSION = 64;
CURRENT_PROJECT_VERSION = 66;
DEVELOPMENT_TEAM = "";
"DEVELOPMENT_TEAM[sdk=iphoneos*]" = FCMA4QKS77;
GENERATE_INFOPLIST_FILE = YES;
@ -732,6 +743,7 @@
};
EA3C3BAF289966F1000CA526 /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A52C0E64CC00430AD1 /* vds-sample.xcconfig */;
buildSettings = {
ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
ASSETCATALOG_COMPILER_GLOBAL_ACCENT_COLOR_NAME = AccentColor;
@ -739,7 +751,7 @@
CODE_SIGN_IDENTITY = "Apple Development";
"CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Developer";
CODE_SIGN_STYLE = Manual;
CURRENT_PROJECT_VERSION = 64;
CURRENT_PROJECT_VERSION = 66;
DEVELOPMENT_TEAM = "";
"DEVELOPMENT_TEAM[sdk=iphoneos*]" = FCMA4QKS77;
GENERATE_INFOPLIST_FILE = YES;
@ -767,6 +779,7 @@
};
EAF7F0C0289DA16000B287F5 /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A42C0E64A800430AD1 /* vds-sample-dev.xcconfig */;
buildSettings = {
CODE_SIGN_STYLE = Automatic;
DEVELOPMENT_TEAM = FCMA4QKS77;
@ -776,6 +789,7 @@
};
EAF7F0C1289DA16000B287F5 /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A52C0E64CC00430AD1 /* vds-sample.xcconfig */;
buildSettings = {
CODE_SIGN_STYLE = Automatic;
DEVELOPMENT_TEAM = FCMA4QKS77;
@ -785,6 +799,7 @@
};
EAF7F0D0289DA44300B287F5 /* Debug */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A42C0E64A800430AD1 /* vds-sample-dev.xcconfig */;
buildSettings = {
CODE_SIGN_STYLE = Automatic;
DEVELOPMENT_TEAM = FCMA4QKS77;
@ -794,6 +809,7 @@
};
EAF7F0D1289DA44300B287F5 /* Release */ = {
isa = XCBuildConfiguration;
baseConfigurationReference = EA78C7A52C0E64CC00430AD1 /* vds-sample.xcconfig */;
buildSettings = {
CODE_SIGN_STYLE = Automatic;
DEVELOPMENT_TEAM = FCMA4QKS77;

View File

@ -31,9 +31,12 @@ public class ColorPickerView<EnumType>: UIStackView {
$0.text = "Select"
}
public init(with pickerType: EnumType, onClick: @escaping (ColorPickerView)->Void) {
public init(with pickerType: EnumType, color: UIColor? = nil, onClick: @escaping (ColorPickerView)->Void) {
self.pickerType = pickerType
super.init(frame: .zero)
if let color {
selectedColor = color
}
setup()
button.onClick = { _ in onClick(self) }
}

View File

@ -0,0 +1,11 @@
//
// vds-sample-dev.xcconfig
// VDSSample
//
// Created by Matt Bruce on 6/3/24.
//
// Configuration settings file format documentation can be found at:
// https://help.apple.com/xcode/#/dev745c5c974
#include? "../../workspaceSettings.xcconfig"

View File

@ -0,0 +1,11 @@
//
// vds-sample.xcconfig
// VDSSample
//
// Created by Matt Bruce on 6/3/24.
//
// Configuration settings file format documentation can be found at:
// https://help.apple.com/xcode/#/dev745c5c974
#include? "../../workspaceSettings.xcconfig"

View File

@ -18,18 +18,20 @@ class BreadcrumbsViewController: BaseViewController<Breadcrumbs> {
var selectedCrumbLabel = Label().with { $0.textStyle = .boldBodyMedium }
var allBreadcrumbs: [Breadcrumbs.BreadcrumbItemModel] = [
.init(text: "Home"),
.init(text: "Support", enabeled: false),
.init(text: "Support"),
.init(text: "Service & Apps"),
.init(text: "My Verizon"),
.init(text: "Bill"),
.init(text: "Mobile Billing & Payments"),
.init(text: "Billing statement FAQs", selected: true)
]
var some: [Breadcrumbs.BreadcrumbItemModel] = [
.init(text: "Plans"),
.init(text: "Upgrade Plan"),
.init(text: "Billing Statement Frequently Asked Questions About Stuff You don't want to see", selected: true)
.init(text: "Home"),
.init(text: "Support"),
.init(text: "Service & Apps"),
.init(text: "My Verizon"),
.init(text: "Bill"),
.init(text: "Billing Statement Frequently Asked Questions to cause word wrap", selected: true)
]
override func viewDidLoad() {
@ -47,7 +49,7 @@ class BreadcrumbsViewController: BaseViewController<Breadcrumbs> {
super.setupForm()
addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Last Crumb Selected", view: selectedSwitch)
addFormRow(label: "Large Sample", view: sampleSwitch)
addFormRow(label: "No Long Breadcrumbs", view: sampleSwitch)
selectedSwitch.onChange = { [weak self] sender in
guard let self else { return }
@ -96,7 +98,7 @@ extension BreadcrumbsViewController: ComponentSampleable {
let component = Self.makeComponent()
component.breadcrumbModels = [
.init(text: "Home"),
.init(text: "Support", enabeled: false),
.init(text: "Support"),
.init(text: "Service & Apps"),
.init(text: "My Verizon"),
.init(text: "Bill"),

View File

@ -301,7 +301,7 @@ class InputFieldViewController: BaseViewController<InputField> {
//reset other fields
component.actionTextLinkModel = nil
component.tooltipModel = nil
component.cardType = .generic
component.cardType = .placeholder
tooltipTitleTextField.text = nil
tooltipContentTextField.text = nil
dateFormatPickerSelectorView.text = component.dateFormat.rawValue

View File

@ -93,6 +93,7 @@ class MenuViewController: UITableViewController, TooltipLaunchable {
MenuComponent(title: "RadioButtonItem", completed: true, viewController: RadioButtonItemViewController.self),
MenuComponent(title: "RadioButtonGroup", completed: true, viewController: RadioButtonGroupViewController.self),
// //MenuComponent(title: "TabsContainer", completed: false, viewController: TabsContainerViewController.self),
MenuComponent(title: "Table", completed: true, viewController: TableViewController.self),
MenuComponent(title: "Tabs", completed: true, viewController: TabsViewController.self),
MenuComponent(title: "TextArea", completed: true, viewController: TextAreaViewController.self),
MenuComponent(title: "TextLink", completed: true, viewController: TextLinkViewController.self),
@ -111,10 +112,15 @@ class MenuViewController: UITableViewController, TooltipLaunchable {
override func viewDidLoad() {
title = "VDS Sample: Build \(Bundle.main.build ?? "none")"
let content = VDSHelper.releaseNotes()
if !content.isEmpty {
let tooltip = VDS.Tooltip()
tooltip.title = "Release Notes: \(VDSHelper.version)"
tooltip.content = VDSHelper.releaseNotes()
tooltip.content = content
navigationItem.rightBarButtonItem = UIBarButtonItem(customView: tooltip)
}
super.viewDidLoad()
overrideUserInterfaceStyle = .light
tableView.register(MenuCell.self, forCellReuseIdentifier: "cell")

View File

@ -0,0 +1,192 @@
//
// TableViewController.swift
// VDSSample
//
// Created by Nadigadda, Sumanth on 24/04/24.
//
import Foundation
import VDS
import UIKit
import VDSTokens
class TableViewController: BaseViewController<Table> {
var striped = Toggle()
var fillContainer = Toggle()
var customColumnWidthSize = NumericField().with {
$0.placeholder = "Minimum 50px"
}
lazy var headerLineStylePicker = {
PickerSelectorView(title: "primary", picker: self.picker, items: Line.Style.allCases)
}()
lazy var rowLineStylePicker = {
PickerSelectorView(title: "secondary", picker: self.picker, items: Line.Style.allCases)
}()
lazy var paddingPicker = {
PickerSelectorView(title: "standard", picker: self.picker, items: Table.Padding.allCases)
}()
override func viewDidLoad() {
super.viewDidLoad()
self.setupPicker()
self.setupModel()
}
override func setupForm() {
super.setupForm()
addFormRow(label: "Surface", view: surfacePickerSelectorView)
addFormRow(label: "Padding", view: paddingPicker)
addFormRow(label: "Striped", view: striped)
addFormRow(label: "Header line style", view: headerLineStylePicker)
addFormRow(label: "Row line style", view: rowLineStylePicker)
addFormRow(label: "Fill container", view: fillContainer)
addFormRow(label: "Custom column size", view: customColumnWidthSize)
fillContainer.isOn = component.fillContainer
updateTextFieldStatus(enable: !fillContainer.isOn)
addContentTopView(view: component)
striped.onChange = { [weak self] sender in
self?.component.striped = sender.isOn
}
fillContainer.onChange = { [weak self] sender in
self?.component.fillContainer = sender.isOn
self?.updateTextFieldStatus(enable:!sender.isOn)
if let count = self?.component.tableHeader.first?.columnsCount,
let text = self?.customColumnWidthSize.text,
let width = NumberFormatter().number(from: text) {
self?.component.columnWidths = Array(repeating: CGFloat(truncating: width), count: count)
}
}
customColumnWidthSize.numberPublisher.sink { [weak self] text in
if let count = self?.component.tableHeader.first?.columnsCount, let text, text.intValue > 50 {
self?.component.columnWidths = Array(repeating: CGFloat(truncating: text), count: count)
}
}.store(in: &subscribers)
}
func setupPicker() {
surfacePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.component.surface = item
self?.contentTopView.backgroundColor = item.color
}
headerLineStylePicker.onPickerDidSelect = { [weak self] item in
var headers = self?.component.tableHeader ?? [TableRowModel]()
for currentHeaderIndex in 0..<headers.count {
var currentHeader = headers[currentHeaderIndex]
for currentHeaderItem in 0..<currentHeader.columnsCount {
currentHeader.columns[currentHeaderItem].bottomLine = item
}
headers[currentHeaderIndex] = currentHeader
}
self?.component.tableHeader = headers
}
rowLineStylePicker.onPickerDidSelect = { [weak self] item in
var rows = self?.component.tableRows ?? [TableRowModel]()
for currentRowIndex in 0..<rows.count {
var currentRow = rows[currentRowIndex]
for currentRowItem in 0..<currentRow.columnsCount {
currentRow.columns[currentRowItem].bottomLine = item
}
rows[currentRowIndex] = currentRow
}
self?.component.tableRows = rows
}
paddingPicker.onPickerDidSelect = { [weak self] item in
self?.component.padding = item
}
}
func updateTextFieldStatus(enable: Bool) {
customColumnWidthSize.isEnabled = enable
customColumnWidthSize.backgroundColor = enable ? UIColor.white : VDSColor.paletteGray85
}
func setupModel() {
///Header row
self.component.tableHeader = [TableRowModel(columns: [TableItemModel(bottomLine: .primary, component: nil),
TableItemModel(bottomLine: .primary, component: Label().with { $0.text = "Verizon smart family"; $0.textStyle = .boldTitleSmall; $0.lineBreakMode = .byWordWrapping}),
TableItemModel(bottomLine: .primary, component: Label().with { $0.text = "Call filter"; $0.textStyle = .boldTitleSmall; $0.lineBreakMode = .byWordWrapping })])]
///First row
var rows = [TableRowModel(columns: [TableItemModel(bottomLine: .secondary, component: Label().with { $0.text = "Cost"; $0.textStyle = UIDevice.isIPad ? .bodyLarge : .bodySmall; $0.lineBreakMode = .byWordWrapping}),
TableItemModel(bottomLine: .secondary, component: Label().with { $0.text = "$5/month for up to 10 lines"; $0.textStyle = UIDevice.isIPad ? .bodyLarge : .bodySmall; $0.lineBreakMode = .byWordWrapping}),
TableItemModel(bottomLine: .secondary, component: Label().with { $0.text = "$2.99/month per device"; $0.textStyle = UIDevice.isIPad ? .bodyLarge : .bodySmall; $0.lineBreakMode = .byWordWrapping})])]
///second row
rows.append(TableRowModel(columns: [TableItemModel(bottomLine: .secondary, component: Label().with { $0.text = "Block web domains"; $0.textStyle = UIDevice.isIPad ? .bodyLarge : .bodySmall; $0.lineBreakMode = .byWordWrapping}),
TableItemModel(bottomLine: .secondary, component: Icon().with { $0.name = Icon.Name.checkmark }),
TableItemModel(bottomLine: .secondary, component: Icon().with { $0.name = Icon.Name.checkmark })]))
///Third row
rows.append(TableRowModel(columns: [TableItemModel(bottomLine: .secondary, component: Label().with { $0.text = "Block calls and messages from specific numbers"; $0.textStyle = UIDevice.isIPad ? .bodyLarge : .bodySmall; $0.lineBreakMode = .byWordWrapping}),
TableItemModel(bottomLine: .secondary, component: Label().with { $0.text = "Permanently"; $0.textStyle = UIDevice.isIPad ? .bodyLarge : .bodySmall; $0.lineBreakMode = .byWordWrapping}),
TableItemModel(bottomLine: .secondary, component: Label().with { $0.text = "Permanently"; $0.textStyle = UIDevice.isIPad ? .bodyLarge : .bodySmall; $0.lineBreakMode = .byWordWrapping})]))
if UIDevice.isIPad {
///Fourth row
let titleLockUp = TitleLockup()
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.")
titleLockUp.eyebrowModel = eyebrowModel
titleLockUp.titleModel = titleModel
titleLockUp.subTitleModel = subTitleModel
let button = Button()
button.text = "Testing"
rows.append(TableRowModel(columns: [TableItemModel(bottomLine: .secondary, component:Toggle()),
TableItemModel(bottomLine: .secondary, component:titleLockUp),
TableItemModel(bottomLine: .secondary, component: button)]))
///Fifth row
let tilelet = Tilelet()
let ftitleModel = Tilelet.TitleModel(text: "Save $XX on your monthly bill.")
let fsubTitleModel = Tilelet.SubTitleModel(text: "Enroll in Auto Pay & paper-free billing to save on your monthly bill.")
tilelet.titleModel = ftitleModel
tilelet.subTitleModel = fsubTitleModel
let textArea = TextArea()
textArea.labelText = "Street Address"
textArea.helperText = "For example: 123 Verizon St"
textArea.errorText = "Enter a valid address."
textArea.tooltipModel = .init(title: "Check the formatting of your address", content:"House/Building number then street name")
let trailingToolTip = TrailingTooltipLabel()
trailingToolTip.labelText = "5G Ultra Wideband is available in your area"
trailingToolTip.tooltipModel = .init(title: "Check the formatting of your address",
content:"House/Building number then street name")
let image = UIImage(named: "clean-surface")
let imageView = UIImageView(image: image)
rows.append(TableRowModel(columns: [TableItemModel(bottomLine: .secondary, component:textArea),
TableItemModel(bottomLine: .secondary, component:imageView),
TableItemModel(bottomLine: .secondary, component:trailingToolTip)]))
}
component.fillContainer = true
component.columnWidths = [400.0, 400.0, 400.0]
self.component.tableRows = rows
}
}

View File

@ -98,10 +98,53 @@ class TileContainerViewController: BaseViewController<TileContainer> {
override func viewDidLoad() {
super.viewDidLoad()
addContentTopView(view: .makeWrapper(for: component))
component.width = 150
component.width = 300
component.color = .secondary
component.accessibilityLabel = "Tile Container"
component.addContentView(Label().with { $0.text = "Testing Label"; $0.isAccessibilityElement = true; })
let level2View = View()
level2View.backgroundColor = .purple
let level3View = View()
level3View.backgroundColor = .yellow
level2View.addSubview(level3View)
level3View.pinToSuperView(.uniform(15))
let level2label = Label()
level2label.text = "Do you want to Register?"
level3View.addSubview(level2label)
level2label.pinTop().pinLeading()
let level3Button = Button()
level3Button.setTitle("Register", for: .normal)
level3View.addSubview(level3Button)
level3Button.pinTop(anchor: level2label.bottomAnchor, constant: 5)
level3Button.pinLeading()
let level4View = View()
level4View.backgroundColor = .green
level3View.addSubview(level4View)
level4View.pinTop(anchor: level3Button.bottomAnchor, constant: 10)
level4View.pinLeading()
level4View.pinBottom()
level4View.pinTrailing()
let level4Label = Label()
level4Label.text = "Forgot your info?"
level4View.addSubview(level4Label)
level4Label.pinTop().pinLeading()
let level4Button = Button()
level4Button.setTitle("Forgot Password", for: .normal)
level4View.addSubview(level4Button)
level4Button.pinTop(anchor: level4Label.bottomAnchor, constant: 5)
level4Button.pinLeading().pinBottom()
component.addContentView(level2View)
setupPicker()
setupModel()
}

View File

@ -71,7 +71,7 @@ class TileletViewController: BaseViewController<Tilelet> {
enum ColorPickerType {
case backgroundColor
case gradientColor1, gradientColor2
case contentViewBackgroundColor, light, dark
case contentViewBackgroundColor, token, custom
}
lazy var gradientColorView1: ColorPickerView<ColorPickerType> = {
@ -107,77 +107,91 @@ class TileletViewController: BaseViewController<Tilelet> {
}
enum TitleTextColor: String, CaseIterable {
case primary, custom
case primary, token, custom
}
enum TextColor: String, CaseIterable {
case primary, secondary, custom
case primary, secondary, token, custom
}
enum IconColor: String, CaseIterable {
case `default`, token, custom
}
/// eyebrow
var eyebrowColorsFormStackView = FormSection().with { $0.isHidden = true }
var eyebrowTokenFormStackView = FormSection().with { $0.isHidden = true }
var eyebrowColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var eyebrowColorPickerSelectorView = {
PickerSelectorView(title: "primary",
picker: self.picker,
items: TextColor.allCases)
}()
lazy var eyebrowLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
lazy var eyebrowTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteWhite.rawValue }
}()
lazy var eyebrowDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var eyebrowCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom, color: .white) { [weak self] picker in
self?.currentSurfaceColorType = .eyebrow
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
}()
/// title
var titleColorsFormStackView = FormSection().with { $0.isHidden = true }
var titleTokenFormStackView = FormSection().with { $0.isHidden = true }
var titleColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var titleColorPickerSelectorView = {
PickerSelectorView(title: "primary",
picker: self.picker,
items: TitleTextColor.allCases)
}()
lazy var titleLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
lazy var titleTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteWhite.rawValue }
}()
lazy var titleDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var titleCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom, color: .white) { [weak self] picker in
self?.currentSurfaceColorType = .title
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
}()
/// subtitle
var subtitleColorsFormStackView = FormSection().with { $0.isHidden = true }
var subtitleTokenFormStackView = FormSection().with { $0.isHidden = true }
var subtitleColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var subtitleColorPickerSelectorView = {
PickerSelectorView(title: "primary",
picker: self.picker,
items: TextColor.allCases)
}()
lazy var subtitleLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
}()
lazy var subtitleDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var subtitleTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteWhite.rawValue }
}()
lazy var subtitleCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom, color: .white) { [weak self] picker in
self?.currentSurfaceColorType = .subtitle
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
}()
var descriptionIconFormStackView = FormSection().with { $0.isHidden = true }
var descriptionIconTokenFormStackView = FormSection().with { $0.isHidden = true }
var descriptionIconColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var descriptionNamePickerSelectorView = {
PickerSelectorView(title: "",
picker: self.picker,
@ -190,17 +204,22 @@ class TileletViewController: BaseViewController<Tilelet> {
items: Icon.Size.allCases)
}()
lazy var descriptionIconLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.currentSurfaceColorType = .descriptionIcon
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
lazy var descriptionIconColorPickerSelectorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: IconColor.allCases)
.with { $0.text = IconColor.default.rawValue }
}()
var descriptionIconFormStackView = FormSection().with { $0.isHidden = true }
lazy var descriptionIconDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var descriptionIconTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteWhite.rawValue }
}()
lazy var descriptionIconCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom) { [weak self] picker in
self?.currentSurfaceColorType = .descriptionIcon
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
@ -208,16 +227,32 @@ class TileletViewController: BaseViewController<Tilelet> {
}()
var directionalIconFormStackView = FormSection().with { $0.isHidden = true }
lazy var directionalIconLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.currentSurfaceColorType = .directionalIcon
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
var directionalIconTokenFormStackView = FormSection().with { $0.isHidden = true }
var directionalIconColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var directionalIconSizePickerSelectorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: Icon.Size.allCases)
}()
lazy var directionalIconDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var directionalIconColorPickerSelectorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: IconColor.allCases)
.with { $0.text = IconColor.default.rawValue }
}()
lazy var directionalIconTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteWhite.rawValue }
}()
lazy var directionalIconCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom) { [weak self] picker in
self?.currentSurfaceColorType = .directionalIcon
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
@ -309,9 +344,10 @@ class TileletViewController: BaseViewController<Tilelet> {
$0.addFormRow(label: "Color", view: eyebrowColorPickerSelectorView)
}))
eyebrowColorsFormStackView.addFormRow(label: "Light", view: eyebrowLightColorView)
eyebrowColorsFormStackView.addFormRow(label: "Dark", view: eyebrowDarkColorView)
append(section: eyebrowColorsFormStackView)
eyebrowTokenFormStackView.addFormRow(label: "Token", view: eyebrowTokenColorView)
eyebrowColorFormStackView.addFormRow(label: "Custom", view: eyebrowCustomColorView)
append(section: eyebrowTokenFormStackView)
append(section: eyebrowColorFormStackView)
append(section: .init().with({
$0.title = "Title"
@ -320,18 +356,20 @@ class TileletViewController: BaseViewController<Tilelet> {
$0.addFormRow(label: "Text", view: titleTextField)
$0.addFormRow(label: "Color", view: titleColorPickerSelectorView)
}))
titleColorsFormStackView.addFormRow(label: "Light", view: titleLightColorView)
titleColorsFormStackView.addFormRow(label: "Dark", view: titleDarkColorView)
append(section: titleColorsFormStackView)
titleTokenFormStackView.addFormRow(label: "Token", view: titleTokenColorView)
titleColorFormStackView.addFormRow(label: "Custom", view: titleCustomColorView)
append(section: titleTokenFormStackView)
append(section: titleColorFormStackView)
append(section: .init().with({
$0.title = "Subtitle"
$0.addFormRow(label: "Text", view: subTitleTextField)
$0.addFormRow(label: "Color", view: subtitleColorPickerSelectorView)
}))
subtitleColorsFormStackView.addFormRow(label: "Light", view: subtitleLightColorView)
subtitleColorsFormStackView.addFormRow(label: "Dark", view: subtitleDarkColorView)
append(section: subtitleColorsFormStackView)
subtitleTokenFormStackView.addFormRow(label: "Token", view: subtitleTokenColorView)
subtitleColorFormStackView.addFormRow(label: "Custom", view: subtitleCustomColorView)
append(section: subtitleTokenFormStackView)
append(section: subtitleColorFormStackView)
append(section: .init().with({
$0.title = "Description Icon "
@ -340,8 +378,12 @@ class TileletViewController: BaseViewController<Tilelet> {
append(section: descriptionIconFormStackView)
descriptionIconFormStackView.addFormRow(label: "Icon", view: descriptionNamePickerSelectorView)
descriptionIconFormStackView.addFormRow(label: "Size", view: descriptionIconSizePickerSelectorView)
descriptionIconFormStackView.addFormRow(label: "Light", view: descriptionIconLightColorView)
descriptionIconFormStackView.addFormRow(label: "Dark", view: descriptionIconDarkColorView)
descriptionIconFormStackView.addFormRow(label: "Color", view: descriptionIconColorPickerSelectorView)
descriptionIconTokenFormStackView.addFormRow(label: "Token", view: descriptionIconTokenColorView)
descriptionIconColorFormStackView.addFormRow(label: "Custom", view: descriptionIconCustomColorView)
append(section: descriptionIconTokenFormStackView)
append(section: descriptionIconColorFormStackView)
append(section: .init().with({
$0.title = "Directional Icon"
@ -350,8 +392,11 @@ class TileletViewController: BaseViewController<Tilelet> {
append(section: directionalIconFormStackView)
directionalIconFormStackView.addFormRow(label: "Icon", view: directionIconPickerSelectorView)
directionalIconFormStackView.addFormRow(label: "Size", view: directionIconSizePickerSelectorView)
directionalIconFormStackView.addFormRow(label: "Light", view: directionalIconLightColorView)
directionalIconFormStackView.addFormRow(label: "Dark", view: directionalIconDarkColorView)
directionalIconFormStackView.addFormRow(label: "Color", view: directionalIconColorPickerSelectorView)
directionalIconTokenFormStackView.addFormRow(label: "Token", view: directionalIconTokenColorView)
directionalIconColorFormStackView.addFormRow(label: "Dark", view: directionalIconCustomColorView)
append(section: directionalIconTokenFormStackView)
append(section: directionalIconColorFormStackView)
clickableSwitch.onChange = { [weak self] sender in
guard let self else { return }
@ -428,25 +473,13 @@ class TileletViewController: BaseViewController<Tilelet> {
}.store(in: &subscribers)
showDescriptionIconSwitch.onChange = { [weak self] sender in
self?.descriptionIconFormStackView.isHidden = !sender.isOn
self?.directionalIconFormStackView.isHidden = sender.isOn
if sender.isOn {
self?.showDirectionalIconSwitch.isOn = false
self?.setDescriptiveIconModel()
} else {
self?.component.descriptiveIconModel = nil
}
guard let self else { return }
self.setDescriptionIconForm()
}
showDirectionalIconSwitch.onChange = { [weak self] sender in
self?.descriptionIconFormStackView.isHidden = sender.isOn
self?.directionalIconFormStackView.isHidden = !sender.isOn
if sender.isOn {
self?.showDescriptionIconSwitch.isOn = false
self?.setDirectionalIconModel()
} else {
self?.component.directionalIconModel = nil
}
guard let self else { return }
self.setDirectionalIconForm()
}
eyebrowIsBold.publisher(for: .valueChanged).sink { [weak self] toggle in
@ -490,6 +523,59 @@ class TileletViewController: BaseViewController<Tilelet> {
}.store(in: &subscribers)
}
func setIconColorForms() {
setDirectionalIconColorForm()
setDescriptionIconColorForm()
}
func setDescriptionIconForm() {
let showForm = showDescriptionIconSwitch.isOn
descriptionIconFormStackView.isHidden = !showForm
directionalIconFormStackView.isHidden = true
if showForm {
showDirectionalIconSwitch.isOn = false
setDescriptiveIconModel()
} else {
component.descriptiveIconModel = nil
}
setIconColorForms()
}
func setDirectionalIconForm() {
let showForm = showDirectionalIconSwitch.isOn
directionalIconFormStackView.isHidden = !showForm
descriptionIconFormStackView.isHidden = true
if showForm {
showDescriptionIconSwitch.isOn = false
setDirectionalIconModel()
} else {
component.directionalIconModel = nil
}
setIconColorForms()
}
func setDirectionalIconColorForm() {
let selectedItem = directionalIconColorPickerSelectorView.selectedItem
if showDirectionalIconSwitch.isOn && selectedItem != .default {
directionalIconTokenFormStackView.isHidden = selectedItem != .token
directionalIconColorFormStackView.isHidden = selectedItem != .custom
} else {
directionalIconTokenFormStackView.isHidden = true
directionalIconColorFormStackView.isHidden = true
}
}
func setDescriptionIconColorForm() {
let selectedItem = descriptionIconColorPickerSelectorView.selectedItem
if showDescriptionIconSwitch.isOn && selectedItem != .default {
descriptionIconTokenFormStackView.isHidden = selectedItem != .token
descriptionIconColorFormStackView.isHidden = selectedItem != .custom
} else {
descriptionIconTokenFormStackView.isHidden = true
descriptionIconColorFormStackView.isHidden = true
}
}
func setupModel() {
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.")
@ -511,13 +597,11 @@ class TileletViewController: BaseViewController<Tilelet> {
scalingTypePickerSelectorView.text = component.aspectRatio.rawValue
updateOtherTextStyles()
descriptionIconLightColorView.selectedColor = VDSColor.elementsPrimaryOnlight
descriptionIconDarkColorView.selectedColor = VDSColor.elementsPrimaryOndark
descriptionIconCustomColorView.selectedColor = VDSColor.elementsPrimaryOnlight
descriptionNamePickerSelectorView.text = Icon.Name.multipleDocuments.rawValue
descriptionIconSizePickerSelectorView.text = Icon.Size.medium.rawValue
directionalIconLightColorView.selectedColor = VDSColor.elementsPrimaryOnlight
directionalIconDarkColorView.selectedColor = VDSColor.elementsPrimaryOndark
directionalIconCustomColorView.selectedColor = VDSColor.elementsPrimaryOnlight
directionIconPickerSelectorView.text = Tilelet.DirectionalIcon.IconType.rightArrow.rawValue
directionIconSizePickerSelectorView.text = Tilelet.DirectionalIcon.IconSize.medium.rawValue
}
@ -537,12 +621,13 @@ class TileletViewController: BaseViewController<Tilelet> {
switch titleColorPickerSelectorView.selectedItem {
case .primary:
textColor = .primary
case .token:
textColor = .token(titleTokenColorView.selectedItem)
case .custom:
if let light = titleLightColorView.selectedColor {
let dark = titleDarkColorView.selectedColor ?? light
textColor = .custom(light, dark)
if let color = titleCustomColorView.selectedColor {
textColor = .custom(color)
} else {
textColor = .custom(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
textColor = .custom(VDSColor.elementsPrimaryOnlight)
}
}
@ -560,12 +645,13 @@ class TileletViewController: BaseViewController<Tilelet> {
textColor = .primary
case .secondary:
textColor = .secondary
case .token:
textColor = .token(subtitleTokenColorView.selectedItem)
case .custom:
if let light = subtitleLightColorView.selectedColor {
let dark = subtitleDarkColorView.selectedColor ?? light
textColor = .custom(light, dark)
if let color = subtitleCustomColorView.selectedColor {
textColor = .custom(color)
} else {
textColor = .custom(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
textColor = .custom(VDSColor.elementsPrimaryOnlight)
}
}
@ -583,15 +669,15 @@ class TileletViewController: BaseViewController<Tilelet> {
textColor = .primary
case .secondary:
textColor = .secondary
case .token:
textColor = .token(eyebrowTokenColorView.selectedItem)
case .custom:
if let light = eyebrowLightColorView.selectedColor {
let dark = eyebrowDarkColorView.selectedColor ?? light
textColor = .custom(light, dark)
if let color = eyebrowCustomColorView.selectedColor {
textColor = .custom(color)
} else {
textColor = .custom(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
textColor = .custom(VDSColor.elementsPrimaryOnlight)
}
}
component.eyebrowModel = Tilelet.EyebrowModel(text: text, textColor: textColor, isBold: eyebrowIsBold.isOn, standardStyle: otherStandardStylePickerSelectorView.selectedItem)
} else {
component.eyebrowModel = nil
@ -599,31 +685,33 @@ class TileletViewController: BaseViewController<Tilelet> {
}
func setDescriptiveIconModel() {
let light = descriptionIconLightColorView.selectedColor ?? descriptionIconDarkColorView.selectedColor
let dark = descriptionIconDarkColorView.selectedColor ?? descriptionIconLightColorView.selectedColor
let iconSize = descriptionIconSizePickerSelectorView.selectedItem
let iconName = descriptionNamePickerSelectorView.selectedItem
if let light, let dark {
component.descriptiveIconModel = .init(name: iconName,
colorConfiguration: SurfaceColorConfiguration(light, dark), size: iconSize)
} else {
component.descriptiveIconModel = .init(name: iconName,
size: iconSize)
var iconColor: Tilelet.IconColor? = nil
switch descriptionIconColorPickerSelectorView.selectedItem {
case .token:
iconColor = .token(descriptionIconTokenColorView.selectedItem)
case .custom:
iconColor = .custom(descriptionIconCustomColorView.selectedColor ?? .white)
default:
break
}
component.descriptiveIconModel = .init(name: iconName, iconColor: iconColor, size: iconSize)
}
func setDirectionalIconModel() {
let light = directionalIconLightColorView.selectedColor ?? directionalIconDarkColorView.selectedColor
let dark = directionalIconDarkColorView.selectedColor ?? directionalIconLightColorView.selectedColor
let iconType = directionIconPickerSelectorView.selectedItem
let iconSize = directionIconSizePickerSelectorView.selectedItem
if let light, let dark {
component.directionalIconModel = .init(iconType: iconType, colorConfiguration: SurfaceColorConfiguration(light, dark), size: iconSize)
} else {
component.directionalIconModel = .init(iconType: iconType, size: iconSize)
var iconColor: Tilelet.IconColor? = nil
switch directionalIconColorPickerSelectorView.selectedItem {
case .token:
iconColor = .token(directionalIconTokenColorView.selectedItem)
case .custom:
iconColor = .custom(directionalIconCustomColorView.selectedColor ?? .white)
default:
break
}
component.directionalIconModel = .init(iconType: iconType, iconColor: iconColor, size: iconSize)
}
func updateOtherTextStyles() {
@ -699,26 +787,40 @@ class TileletViewController: BaseViewController<Tilelet> {
eyebrowColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.currentSurfaceColorType = .eyebrow
self?.eyebrowColorsFormStackView.isHidden = item != .custom
if item != .custom {
self?.eyebrowTokenFormStackView.isHidden = item != .token
self?.eyebrowColorFormStackView.isHidden = item != .custom
self?.setEyebrowModel()
}
eyebrowTokenColorView.onPickerDidSelect = { [weak self] item in
self?.setEyebrowModel()
}
titleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.currentSurfaceColorType = .title
self?.titleColorsFormStackView.isHidden = item != .custom
if item != .custom {
self?.titleTokenFormStackView.isHidden = item != .token
self?.titleColorFormStackView.isHidden = item != .custom
self?.setTitleModel()
}
titleTokenColorView.onPickerDidSelect = { [weak self] item in
self?.setTitleModel()
}
subtitleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.currentSurfaceColorType = .subtitle
self?.subtitleColorsFormStackView.isHidden = item != .custom
if item != .custom {
self?.subtitleTokenFormStackView.isHidden = item != .token
self?.subtitleColorFormStackView.isHidden = item != .custom
self?.setSubTitleModel()
}
subtitleTokenColorView.onPickerDidSelect = { [weak self] item in
self?.setSubTitleModel()
}
descriptionIconColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.setIconColorForms()
self?.setDescriptiveIconModel()
}
descriptionNamePickerSelectorView.onPickerDidSelect = { [weak self] item in
@ -729,6 +831,16 @@ class TileletViewController: BaseViewController<Tilelet> {
self?.setDescriptiveIconModel()
}
descriptionIconTokenColorView.onPickerDidSelect = { [weak self] item in
self?.colorPickerType = .token
self?.setDescriptiveIconModel()
}
directionalIconColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.setIconColorForms()
self?.setDirectionalIconModel()
}
directionIconPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.setDirectionalIconModel()
}
@ -736,6 +848,11 @@ class TileletViewController: BaseViewController<Tilelet> {
directionIconSizePickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.setDirectionalIconModel()
}
directionalIconTokenColorView.onPickerDidSelect = { [weak self] item in
self?.colorPickerType = .token
self?.setDirectionalIconModel()
}
}
func getTilelet(effect: TileContainer.BackgroundEffect) -> Tilelet.BackgroundEffect {
@ -808,33 +925,22 @@ extension TileletViewController: UIColorPickerViewControllerDelegate {
case .gradientColor2:
gradientColorView2.selectedColor = viewController.selectedColor
updateGradientColors()
case .light, .dark:
var lightColorView: ColorPickerView<ColorPickerType>
var darkColorView: ColorPickerView<ColorPickerType>
case .custom:
var colorView: ColorPickerView<ColorPickerType>
switch currentSurfaceColorType {
case .eyebrow:
lightColorView = eyebrowLightColorView
darkColorView = eyebrowDarkColorView
colorView = eyebrowCustomColorView
case .title:
lightColorView = titleLightColorView
darkColorView = titleDarkColorView
colorView = titleCustomColorView
case .subtitle:
lightColorView = subtitleLightColorView
darkColorView = subtitleDarkColorView
colorView = subtitleCustomColorView
case .directionalIcon:
lightColorView = directionalIconLightColorView
darkColorView = directionalIconDarkColorView
colorView = directionalIconCustomColorView
case .descriptionIcon:
lightColorView = descriptionIconLightColorView
darkColorView = descriptionIconDarkColorView
}
if colorPickerType == .light {
lightColorView.selectedColor = viewController.selectedColor
} else {
darkColorView.selectedColor = viewController.selectedColor
colorView = descriptionIconCustomColorView
}
colorView.selectedColor = viewController.selectedColor
switch currentSurfaceColorType {
case .eyebrow:
@ -848,6 +954,8 @@ extension TileletViewController: UIColorPickerViewControllerDelegate {
case .descriptionIcon:
setDescriptiveIconModel()
}
default:
break
}
}

View File

@ -45,83 +45,88 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
}()
var currentLabelType: LabelType = .title
var colorPickerType: ColorPickerType = .light
var colorPickerType: ColorPickerType = .custom
enum LabelType {
case eyebrow, title, subtitle
}
enum TitleTextColor: String, CaseIterable {
case primary, custom
case primary, token, custom
}
enum TextColor: String, CaseIterable {
case primary, secondary, custom
case primary, secondary, token, custom
}
enum ColorPickerType {
case light, dark
case custom
}
/// eyebrow
var eyebrowColorsFormStackView = FormSection().with { $0.isHidden = true }
var eyebrowTokenFormStackView = FormSection().with { $0.isHidden = true }
var eyebrowColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var eyebrowColorPickerSelectorView = {
PickerSelectorView(title: "primary",
picker: self.picker,
items: TextColor.allCases)
}()
lazy var eyebrowLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
lazy var eyebrowTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteBlack.rawValue }
}()
lazy var eyebrowDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var eyebrowCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom, color: .black) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
}()
/// title
var titleColorsFormStackView = FormSection().with { $0.isHidden = true }
var titleTokenFormStackView = FormSection().with { $0.isHidden = true }
var titleColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var titleColorPickerSelectorView = {
PickerSelectorView(title: "primary",
picker: self.picker,
items: TitleTextColor.allCases)
}()
lazy var titleLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
lazy var titleTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteBlack.rawValue }
}()
lazy var titleDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var titleCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom, color: .black) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
}()
/// subtitle
var subtitleColorsFormStackView = FormSection().with { $0.isHidden = true }
var subtitleTokenFormStackView = FormSection().with { $0.isHidden = true }
var subtitleColorFormStackView = FormSection().with { $0.isHidden = true }
lazy var subtitleColorPickerSelectorView = {
PickerSelectorView(title: "primary",
picker: self.picker,
items: TextColor.allCases)
}()
lazy var subtitleLightColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.light) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
lazy var subtitleTokenColorView = {
PickerSelectorView(title: "",
picker: self.picker,
items: UIColor.VDSColor.allCases)
.with { $0.text = UIColor.VDSColor.paletteBlack.rawValue }
}()
lazy var subtitleDarkColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.dark) { [weak self] picker in
lazy var subtitleCustomColorView: ColorPickerView<ColorPickerType> = {
return .init(with: ColorPickerType.custom, color: .black) { [weak self] picker in
self?.colorPickerType = picker.pickerType
self?.selectedColorTapped(picker)
}
@ -145,23 +150,26 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
addFormRow(label: "Eyebrow is Bold", view: eyebrowIsBold)
addFormRow(label: "Eyebrow Text", view: eyebrowTextField)
addFormRow(label: "Eyebrow Color", view: eyebrowColorPickerSelectorView)
eyebrowColorsFormStackView.addFormRow(label: "Light", view: eyebrowLightColorView)
eyebrowColorsFormStackView.addFormRow(label: "Dark", view: eyebrowDarkColorView)
append(section: eyebrowColorsFormStackView)
eyebrowTokenFormStackView.addFormRow(label: "Token", view: eyebrowTokenColorView)
eyebrowColorFormStackView.addFormRow(label: "Custom", view: eyebrowCustomColorView)
append(section: eyebrowTokenFormStackView)
append(section: eyebrowColorFormStackView)
addFormRow(label: "Title is Bold", view: titleIsBold)
addFormRow(label: "Title Style", view: titleStandardStylePickerSelectorView)
addFormRow(label: "Title Text", view: titleTextField)
addFormRow(label: "Title Color", view: titleColorPickerSelectorView)
titleColorsFormStackView.addFormRow(label: "Light", view: titleLightColorView)
titleColorsFormStackView.addFormRow(label: "Dark", view: titleDarkColorView)
append(section: titleColorsFormStackView)
titleTokenFormStackView.addFormRow(label: "Token", view: titleTokenColorView)
titleColorFormStackView.addFormRow(label: "Custom", view: titleCustomColorView)
append(section: titleTokenFormStackView)
append(section: titleColorFormStackView)
addFormRow(label: "Subtitle Text", view: subTitleTextField)
addFormRow(label: "Subtitle Color", view: subtitleColorPickerSelectorView)
subtitleColorsFormStackView.addFormRow(label: "Light", view: subtitleLightColorView)
subtitleColorsFormStackView.addFormRow(label: "Dark", view: subtitleDarkColorView)
append(section: subtitleColorsFormStackView)
subtitleTokenFormStackView.addFormRow(label: "Token", view: subtitleTokenColorView)
subtitleColorFormStackView.addFormRow(label: "Custom", view: subtitleCustomColorView)
append(section: subtitleTokenFormStackView)
append(section: subtitleColorFormStackView)
eyebrowIsBold.publisher(for: .valueChanged).sink { [weak self] toggle in
@ -221,12 +229,13 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
switch titleColorPickerSelectorView.selectedItem {
case .primary:
textColor = .primary
case .token:
textColor = .token(titleTokenColorView.selectedItem)
case .custom:
if let light = titleLightColorView.selectedColor {
let dark = titleDarkColorView.selectedColor ?? light
textColor = .custom(light, dark)
if let color = titleCustomColorView.selectedColor {
textColor = .custom(color)
} else {
textColor = .custom(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
textColor = .custom(VDSColor.elementsPrimaryOnlight)
}
}
@ -255,12 +264,13 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
textColor = .primary
case .secondary:
textColor = .secondary
case .token:
textColor = .token(subtitleTokenColorView.selectedItem)
case .custom:
if let light = subtitleLightColorView.selectedColor {
let dark = subtitleDarkColorView.selectedColor ?? light
textColor = .custom(light, dark)
if let color = subtitleCustomColorView.selectedColor {
textColor = .custom(color)
} else {
textColor = .custom(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
textColor = .custom(VDSColor.elementsPrimaryOnlight)
}
}
component.subTitleModel = TitleLockup.SubTitleModel(text: text, otherStandardStyle: style, textColor: textColor)
@ -276,13 +286,15 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
textColor = .primary
case .secondary:
textColor = .secondary
case .token:
textColor = .token(eyebrowTokenColorView.selectedItem)
case .custom:
if let light = eyebrowLightColorView.selectedColor {
let dark = eyebrowDarkColorView.selectedColor ?? light
textColor = .custom(light, dark)
if let color = eyebrowCustomColorView.selectedColor {
textColor = .custom(color)
} else {
textColor = .custom(VDSColor.elementsPrimaryOnlight, VDSColor.elementsPrimaryOndark)
} }
textColor = .custom(VDSColor.elementsPrimaryOnlight)
}
}
component.eyebrowModel = TitleLockup.EyebrowModel(text: text, textColor: textColor, isBold: eyebrowIsBold.isOn, standardStyle: style)
debug(type: "EyeBrow", textStyle: eyebrowIsBold.isOn ? style.value.bold : style.value.regular)
@ -319,26 +331,35 @@ class TitleLockupViewController: BaseViewController<TitleLockup> {
eyebrowColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.currentLabelType = .eyebrow
self?.eyebrowColorsFormStackView.isHidden = item != .custom
if item != .custom {
self?.eyebrowTokenFormStackView.isHidden = item != .token
self?.eyebrowColorFormStackView.isHidden = item != .custom
self?.setOtherModels()
}
eyebrowTokenColorView.onPickerDidSelect = { [weak self] item in
self?.setOtherModels()
}
titleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.currentLabelType = .title
self?.titleColorsFormStackView.isHidden = item != .custom
if item != .custom {
self?.titleTokenFormStackView.isHidden = item != .token
self?.titleColorFormStackView.isHidden = item != .custom
self?.setTitleModel()
}
titleTokenColorView.onPickerDidSelect = { [weak self] item in
self?.setTitleModel()
}
subtitleColorPickerSelectorView.onPickerDidSelect = { [weak self] item in
self?.currentLabelType = .subtitle
self?.subtitleColorsFormStackView.isHidden = item != .custom
if item != .custom {
self?.subtitleTokenFormStackView.isHidden = item != .token
self?.subtitleColorFormStackView.isHidden = item != .custom
self?.setOtherModels()
}
subtitleTokenColorView.onPickerDidSelect = { [weak self] item in
self?.setOtherModels()
}
}
}
@ -373,27 +394,19 @@ extension TitleLockupViewController: UIColorPickerViewControllerDelegate {
func colorPickerViewControllerDidSelectColor(_ viewController: UIColorPickerViewController) {
guard let hexString = viewController.selectedColor.hexString else { return }
var lightColorView: ColorPickerView<ColorPickerType>
var darkColorView: ColorPickerView<ColorPickerType>
var colorView: ColorPickerView<ColorPickerType>
switch currentLabelType {
case .eyebrow:
lightColorView = eyebrowLightColorView
darkColorView = eyebrowDarkColorView
colorView = eyebrowCustomColorView
case .title:
lightColorView = titleLightColorView
darkColorView = titleDarkColorView
colorView = titleCustomColorView
case .subtitle:
lightColorView = subtitleLightColorView
darkColorView = subtitleDarkColorView
}
switch colorPickerType {
case .light:
lightColorView.selectedColor = viewController.selectedColor
case .dark:
darkColorView.selectedColor = viewController.selectedColor
colorView = subtitleCustomColorView
}
colorView.selectedColor = viewController.selectedColor
if currentLabelType == .title {
setTitleModel()
} else {

View File

@ -0,0 +1,11 @@
//
// workspaceSettings.xcconfig
//
//
// Created by Matt Bruce on 6/3/24.
//
// Configuration settings file format documentation can be found at:
// https://help.apple.com/xcode/#/dev745c5c974
VDS_ADD_CHANGELOG_FILES = 1