Implemented phase 1 for the POC prototype in the Website service.

Services/Website/Sources/Library/Internal/Components/Chip.swift

@@ -0,0 +1,62 @@
+import Elementary
+
+/// A chip stating a grade, condition, or status.
+struct Chip: HTML {
+
+    // MARK: Properties
+
+    /// Whether the chip leads with a check mark, for a grade a grading company certified.
+    let isCertified: Bool
+
+    /// The chip's text.
+    let label: String
+
+    /// The chip's colouring.
+    let tone: Tone
+
+    // MARK: Initializers
+
+    /// Creates a chip.
+    /// - Parameters:
+    ///   - label: the chip's text.
+    ///   - tone: the chip's colouring; neutral by default.
+    ///   - isCertified: whether the chip leads with a check mark; `false` by default.
+    init(
+        _ label: String,
+        tone: Tone = .neutral,
+        isCertified: Bool = false
+    ) {
+        self.isCertified = isCertified
+        self.label = label
+        self.tone = tone
+    }
+
+    // MARK: Computed
+
+    var body: some HTML {
+        span(.class(tone.className)) {
+            if isCertified {
+                Icon(.check, size: 10)
+            }
+            label
+        }
+    }
+
+}
+
+// MARK: - Enumerations
+
+extension Chip {
+    /// A chip's colouring.
+    enum Tone: String, Sendable {
+        case bad
+        case good
+        case neutral
+        case warn
+
+        /// The chip's classes for the tone.
+        var className: String {
+            self == .neutral ? "chip" : "chip chip--\(rawValue)"
+        }
+    }
+}