From 62aedc7c5afa79c64259952c01611ff09d3d547a Mon Sep 17 00:00:00 2001 From: Vasavi Kanamarlapudi Date: Fri, 18 Oct 2024 19:52:55 +0530 Subject: [PATCH] Digital ACT-191 ONEAPP-11355 story: changes done as per anatomy --- .../ListUnordered/ListUnordered.swift | 117 ++++++++++++------ .../ListUnorderedItemModel.swift | 8 +- 2 files changed, 85 insertions(+), 40 deletions(-) diff --git a/VDS/Components/ListUnordered/ListUnordered.swift b/VDS/Components/ListUnordered/ListUnordered.swift index 7fd869b6..5808abe7 100644 --- a/VDS/Components/ListUnordered/ListUnordered.swift +++ b/VDS/Components/ListUnordered/ListUnordered.swift @@ -14,7 +14,7 @@ import VDSCoreTokens @objcMembers @objc(VDSListUnordered) open class ListUnordered: View { - + //-------------------------------------------------- // MARK: - Initializers //-------------------------------------------------- @@ -39,7 +39,7 @@ open class ListUnordered: View { case medium case small case micro - + public static var defaultValue: Self { .large } /// TextStyle relative to Size. @@ -67,16 +67,16 @@ open class ListUnordered: View { //-------------------------------------------------- /// Size of the component. The default size is Large. open var size: Size = .defaultValue { didSet { setNeedsUpdate() } } - + /// Spacing type of the component. open var spacing: Spacing = .standard { didSet { setNeedsUpdate() } } /// Lead-in text that shows as the top text for the component. This is optional. - open var leadInText: String? - + open var leadInText: String? = nil { didSet { setNeedsUpdate() } } + /// Array of unordered list items to show for the component. open var unorderedList: [ListUnorderedItemModel] = [] { didSet { setNeedsUpdate() }} - + //-------------------------------------------------- // MARK: - Configuration Properties //-------------------------------------------------- @@ -86,7 +86,7 @@ open class ListUnordered: View { // It can be used for Glyph Level 2. private var endash = "–" - // Spacing between unordered list items. + // Spacing between the list items. private var spaceBetweenItems: CGFloat { switch (size, spacing) { case (.large, .standard): @@ -119,30 +119,10 @@ open class ListUnordered: View { $0.translatesAutoresizingMaskIntoConstraints = false $0.axis = .vertical $0.distribution = .fill - $0.spacing = VDSLayout.space3X + $0.spacing = spaceBetweenItems $0.backgroundColor = .clear } - private lazy var itemStackView = UIStackView().with { - $0.translatesAutoresizingMaskIntoConstraints = false - $0.axis = .horizontal - $0.alignment = .leading - $0.distribution = .fill - $0.spacing = padding - $0.backgroundColor = .clear - } - - internal var symbolLabel = Label().with { - $0.isAccessibilityElement = true - $0.numberOfLines = 1 - $0.sizeToFit() - } - - internal var textLabel = Label().with { - $0.isAccessibilityElement = true - $0.lineBreakMode = .byWordWrapping - } - //-------------------------------------------------- // MARK: - Overrides //-------------------------------------------------- @@ -152,6 +132,7 @@ open class ListUnordered: View { // add stackview addSubview(listStackView) + listStackView.heightGreaterThanEqualTo(constant:0) listStackView.pinToSuperView() } @@ -163,25 +144,89 @@ open class ListUnordered: View { /// Resets to default settings. open override func reset() { - symbolLabel.reset() - textLabel.reset() super.reset() } /// Used to make changes to the View based off a change events or from local properties. open override func updateView() { super.updateView() + listStackView.removeArrangedSubviews() + listStackView.spacing = spaceBetweenItems + if leadInText != nil { - textLabel.text = leadInText - textLabel.textStyle = size.textStyle.regular - textLabel.textColor = textColorConfiguration.getColor(surface) - textLabel.surface = surface - listStackView.addArrangedSubview(textLabel) + let listItem = getListItem(with:self.leadInText, surface: surface) + listStackView.addArrangedSubview(listItem) } + + unorderedList.forEach { item in + let listItem = getListItem(levelOneText: item.levelOneText, surface: surface) + listStackView.addArrangedSubview(listItem) + + item.levelTwoText?.forEach { text in + let listItem = getListItem(levelTwoText: text, surface: surface) + listStackView.addArrangedSubview(listItem) + } + } + setNeedsLayout() + layoutIfNeeded() } //-------------------------------------------------- // MARK: - Private Methods //-------------------------------------------------- - + // Get Label with the required text and text formats. + func getLabel(with text: String?, surface: Surface) -> Label { + let textLabel = Label().with { + $0.isAccessibilityElement = true + $0.lineBreakMode = .byWordWrapping + $0.text = text + $0.textStyle = size.textStyle.regular + $0.textColor = textColorConfiguration.getColor(surface) + $0.surface = surface + } + return textLabel + } + + // Get the list item with the required text (LeadInText, Level 1 Text, Level 2 Text). + func getListItem(with leadInText:String? = nil, levelOneText: String? = nil, levelTwoText: String? = nil, surface:Surface) -> UIView { + let itemStackView = UIStackView().with { + $0.translatesAutoresizingMaskIntoConstraints = false + $0.axis = .horizontal + $0.alignment = .leading + $0.distribution = .fill + $0.spacing = padding + $0.backgroundColor = .clear + } + itemStackView.removeArrangedSubviews() + + // StackView with LeadIntext if provided. + if leadInText != nil { + let leadTextLabel = getLabel(with: leadInText, surface: surface) + itemStackView.addArrangedSubview(leadTextLabel) + } + + // StackView with Level 1 Text if provided. + if levelOneText != nil { + let discLabel = getLabel(with: disc, surface: surface) + discLabel.widthAnchor.constraint(equalToConstant: discLabel.intrinsicContentSize.width).activate() + itemStackView.addArrangedSubview(discLabel) + let levelOneLabel = getLabel(with: levelOneText, surface: surface) + itemStackView.addArrangedSubview(levelOneLabel) + } + + // StackView with Level 2 Text if provided. + if levelTwoText != nil { + let discLabel = getLabel(with: disc, surface: surface) + let discSpaceView = View() + discSpaceView.widthAnchor.constraint(equalToConstant: discLabel.intrinsicContentSize.width).activate() + discSpaceView.backgroundColor = .red + itemStackView.addArrangedSubview(discSpaceView) + let endashLabel = getLabel(with: endash, surface: surface) + endashLabel.widthAnchor.constraint(equalToConstant: endashLabel.intrinsicContentSize.width).activate() + itemStackView.addArrangedSubview(endashLabel) + let levelTwoLabel = getLabel(with: levelTwoText, surface: surface) + itemStackView.addArrangedSubview(levelTwoLabel) + } + return itemStackView + } } diff --git a/VDS/Components/ListUnordered/ListUnorderedItemModel.swift b/VDS/Components/ListUnordered/ListUnorderedItemModel.swift index e2a3298b..94c88e02 100644 --- a/VDS/Components/ListUnordered/ListUnorderedItemModel.swift +++ b/VDS/Components/ListUnordered/ListUnorderedItemModel.swift @@ -10,14 +10,14 @@ extension ListUnordered { public struct ListUnorderedItemModel: Equatable { /// Item Level 1 that shows text with glyph - disc, bold. - public var itemLevelOneText: String + public var levelOneText: String /// Item Level 2 that shows text (one or many) with glyph - en dash. This is optional. - public var itemLevelTwoText: [String] + public var levelTwoText: [String]? public init(itemLevelOneText: String, itemLevelTwoTexts: [String]? = nil) { - self.itemLevelOneText = itemLevelOneText - self.itemLevelTwoText = itemLevelTwoTexts ?? [] + self.levelOneText = itemLevelOneText + self.levelTwoText = itemLevelTwoTexts ?? [] } } }