[CM-902] Add border color to colorView

Author: PanchamiShenoy

README.md

@@ -34,7 +34,7 @@ Documentation is automatically generated from source code comments and rendered
 
 Usage
 ----------
-A category is a collection of components that share common traits. A category may contain subcategories. By default, components are laid out in nested table views, with each component being represented by a single row. A `CatalogDisplayView` is used to display a component in a single row. It displays small components together with a title and optional detail description. This is used for icons, fonts, and colors, but also works well for smaller components such as buttons. By using generics, `CaralogDisplayView` can display any view (populated with an associated model). The framework includes pre-defined categories for displaying common components: colors, fonts, and icons.
+A category is a collection of components that share common traits. A category may contain subcategories. By default, components are laid out in nested table views, with each component being represented by a single row. A `CatalogDisplayView` is used to display a component in a single row. It displays small components together with a title and optional detail description. This is used for icons, fonts, and colors, but also works well for smaller components such as buttons. By using generics, `CatalogDisplayView` can display any view (populated with an associated model). The framework includes pre-defined categories for displaying common components: colors, fonts, and icons.
 
 The catalog display view model has four parameters:
 

Sources/YComponentBrowser/Models/Categories/ColorCategory.swift

@@ -6,7 +6,7 @@
 
 import Foundation
 
-/// Category for colours
+/// Category for colors
 public struct ColorCategory: Classification {
     /// The type of View category supports
     public typealias View = CatalogDisplayView<ColorView>

Sources/YComponentBrowser/UI Components/Generic Views/ColorView.swift

@@ -25,16 +25,31 @@ final public class ColorView: UIView {
 
     /// :nodoc:
     public required init?(coder: NSCoder) { nil }
-    
+
+    /// :nodoc:
+    public override func traitCollectionDidChange(_ previousTraitCollection: UITraitCollection?) {
+        super.traitCollectionDidChange(previousTraitCollection)
+        if traitCollection.hasDifferentColorAppearance(comparedTo: previousTraitCollection) {
+            setBorderColor()
+        }
+    }
+}
+
+private extension ColorView {
     private func setUpColorView() {
         clipsToBounds = true
         layer.cornerRadius = Style.cornerRadius
-
+        layer.borderWidth = Style.borderWidth
+        setBorderColor()
         NSLayoutConstraint.activate([
             widthAnchor.constraint(equalToConstant: Style.size.width),
             heightAnchor.constraint(equalToConstant: Style.size.height)
         ])
     }
+
+    private func setBorderColor() {
+        layer.borderColor = UIColor.quaternaryLabel.cgColor
+    }
 }
 
 // MARK: - Populatable