Add support for fully transparent colour options

README.md

@@ -52,6 +52,10 @@ struct ContentView: View {
 
 <img src="resources/default-light-theme.png" height="400">
 
+#### Default Clear (same as light except the background is transperent)
+
+<img src="resources/default-light-theme.png" height="400">
+
 ### 🧑‍🎨 Custom themes
 
 SwiftDown supports theming by using config `.json` files as [this one](./Sources/SwiftDown/Resources/Themes/default-dark.json)

Sources/SwiftDown/Resources/Themes/default-clear.json

@@ -0,0 +1,71 @@
+{
+    "name": "Default Light",
+    "author": {
+        "name": "Quentin Eude",
+        "email": "quentineude@gmail.com"
+    },
+    "version": "1.0",
+    "variables": {
+        "boldFont": "not implemented yet"
+    },
+    "editor": {
+        "comment": "When a color is set to clear, the background is disabled making it transparent",
+        "backgroundColor": "clear",
+        "tintColor": "#1D1F21",
+        "cursorColor": "#1D1F21"
+    },
+    "styles": {
+        "h1": {
+            "color": "#C96667",
+            "size": 23
+        },
+        "h2": {
+            "color": "#C96667",
+            "size": 20
+        },
+        "h3": {
+            "color": "#C96667",
+            "size": 18
+        },
+        "h4": {
+            "color": "#C96667"
+        },
+        "h5": {
+            "color": "#C96667"
+        },
+        "h6": {
+            "color": "#C96667"
+        },
+        "body": {
+            "font": "Menlo-Regular",
+            "size": 15,
+            "color": "#252628"
+        },
+        "bold": {
+            "font": "Menlo-Bold",
+            "color": "#DC9364"
+        },
+        "italic": {
+            "font": "Menlo-Italic",
+            "color": "#B195BA"
+        },
+        "link": {
+            "color": "#a66bff"
+        },
+        "image": {
+            "color": "#a66bff"
+        },
+        "inlineCode": {
+            "color": "#A3A5A8"
+        },
+        "codeBlock": {
+            "color": "#A3A5A8"
+        },
+        "blockQuote": {
+            "color": "#1CBD47"
+        },
+        "list": {
+            "color": "#A3A5A8"
+        }
+    }
+}

Sources/SwiftDown/SwiftDown.swift

@@ -18,6 +18,7 @@
       self.init(frame: frame, textContainer: nil)
       self.storage.theme = theme
       self.backgroundColor = theme.backgroundColor
+      self.isOpaque = theme.backgroundColor.cgColor.alpha == 1.0
       self.tintColor = theme.tintColor
       self.autoresizingMask = [.flexibleWidth, .flexibleHeight]
       if hasKeyboardToolbar {
@@ -62,6 +63,8 @@
     convenience init(frame: CGRect, theme: Theme) {
       self.init(frame: frame, textContainer: nil)
       self.storage.theme = theme
+      let isClear = theme.backgroundColor.alphaComponent == 0
+      self.drawsBackground = !isClear
       self.backgroundColor = theme.backgroundColor
     }
 
@@ -120,7 +123,7 @@
     // MARK: - ScrollView setup
     private lazy var scrollView: NSScrollView = {
       let scrollView = NSScrollView()
-      scrollView.drawsBackground = true
+      scrollView.drawsBackground = false
       scrollView.borderType = .noBorder
       scrollView.hasVerticalScroller = true
       scrollView.hasHorizontalRuler = false
@@ -143,7 +146,7 @@
       textView.storage.applyBody = { Theme.applyBody(with: self.theme) }
       textView.storage.theme = theme
       textView.autoresizingMask = .width
-      textView.drawsBackground = true
+      textView.drawsBackground = theme.backgroundColor.alphaComponent > 0
       textView.isEditable = self.isEditable
       textView.isHorizontallyResizable = false
       textView.isVerticallyResizable = true

Sources/SwiftDown/SwiftDownEditor.swift

@@ -57,6 +57,7 @@ public struct SwiftDownEditor: UIViewRepresentable {
       swiftDown.textContainerInset = UIEdgeInsets(
         top: insetsSize, left: insetsSize, bottom: insetsSize, right: insetsSize)
       swiftDown.backgroundColor = theme.backgroundColor
+      swiftDown.isOpaque = theme.backgroundColor.cgColor.alpha == 1.0
       swiftDown.tintColor = theme.tintColor
       swiftDown.textColor = theme.tintColor
       swiftDown.text = text

Sources/SwiftDown/Theme.swift

@@ -16,6 +16,7 @@ public struct Theme {
   public enum BuiltIn: String {
     case defaultDark = "default-dark"
     case defaultLight = "default-light"
+    case defaultClear = "default-clear"
 
     public func theme() -> Theme {
       return Theme(self.rawValue)
@@ -118,7 +119,12 @@ public struct Theme {
     attributes.forEach { key, value in
       switch EditorConfigProperty.from(rawValue: key) {
       case .backgroundColor:
-        backgroundColor = UniversalColor(hexString: value)
+        // allow "clear" keyword for transparent background
+        if value.lowercased() == "clear" {
+          backgroundColor = UniversalColor.clear
+        } else {
+          backgroundColor = UniversalColor(hexString: value)
+        }
       case .tintColor:
         tintColor = UniversalColor(hexString: value)
       case .cursorColor: