Final Placeholder Design Iteration

Author: thecoolwinter

Sources/CodeEditSourceEditor/LineFolding/Model/LineFoldingModel.swift

@@ -131,6 +131,22 @@ class LineFoldingModel: NSObject, NSTextStorageDelegate, ObservableObject {
 // MARK: - LineFoldPlaceholderDelegate
 
 extension LineFoldingModel: LineFoldPlaceholderDelegate {
+    func placeholderBackgroundColor() -> NSColor {
+        controller?.configuration.appearance.theme.invisibles.color ?? .lightGray
+    }
+
+    func placeholderTextColor() -> NSColor {
+        controller?.configuration.appearance.theme.text.color.withAlphaComponent(0.35) ?? .tertiaryLabelColor
+    }
+
+    func placeholderSelectedColor() -> NSColor {
+        .controlAccentColor
+    }
+
+    func placeholderSelectedTextColor() -> NSColor {
+        controller?.theme.background ?? .controlBackgroundColor
+    }
+
     func placeholderDiscarded(fold: FoldRange) {
         foldCache.toggleCollapse(forFold: fold)
         foldView?.needsDisplay = true

Sources/CodeEditSourceEditor/LineFolding/Placeholder/LineFoldPlaceholder.swift

@@ -9,6 +9,12 @@ import AppKit
 import CodeEditTextView
 
 protocol LineFoldPlaceholderDelegate: AnyObject {
+    func placeholderBackgroundColor() -> NSColor
+    func placeholderTextColor() -> NSColor
+    
+    func placeholderSelectedColor() -> NSColor
+    func placeholderSelectedTextColor() -> NSColor
+
     func placeholderDiscarded(fold: FoldRange)
 }
 
@@ -25,34 +31,46 @@ class LineFoldPlaceholder: TextAttachment {
     }
 
     var width: CGFloat {
-        charWidth * 3
+        charWidth * 5
     }
 
     func draw(in context: CGContext, rect: NSRect) {
         context.saveGState()
 
-        let size = charWidth / 3.0
+        guard let delegate else { return }
+
+        let size = charWidth / 2.5
         let centerY = rect.midY - (size / 2.0)
 
         if isSelected {
-            context.setFillColor(NSColor.controlAccentColor.cgColor)
+            context.setFillColor(delegate.placeholderSelectedColor().cgColor)
         } else {
-            context.setFillColor(NSColor.tertiaryLabelColor.cgColor)
+            context.setFillColor(delegate.placeholderBackgroundColor().cgColor)
         }
 
         context.addPath(
             NSBezierPath(
-                rect: rect.transform(x: 2.0, y: 2, width: -4.0, height: -4.0 ),
+                rect: rect.transform(x: charWidth, y: 2.0, width: -charWidth * 2, height: -4.0),
                 roundedCorners: .all,
-                cornerRadius: (rect.height - 4) / 2
+                cornerRadius: rect.height / 2
             ).cgPathFallback
         )
         context.fillPath()
 
-        context.setFillColor(NSColor.secondaryLabelColor.cgColor)
-        context.addEllipse(in: CGRect(x: rect.minX + charWidth - (size / 2), y: centerY, width: size, height: size))
-        context.addEllipse(in: CGRect(x: rect.midX - (size / 2), y: centerY, width: size, height: size))
-        context.addEllipse(in: CGRect(x: rect.maxX - charWidth - (size / 2), y: centerY, width: size, height: size))
+        if isSelected {
+            context.setFillColor(delegate.placeholderSelectedTextColor().cgColor)
+        } else {
+            context.setFillColor(delegate.placeholderTextColor().cgColor)
+        }
+        context.addEllipse(
+            in: CGRect(x: rect.minX + (charWidth * 2) - size, y: centerY, width: size, height: size)
+        )
+        context.addEllipse(
+            in: CGRect(x: rect.midX - (size / 2), y: centerY, width: size, height: size)
+        )
+        context.addEllipse(
+            in: CGRect(x: rect.maxX - (charWidth * 2), y: centerY, width: size, height: size)
+        )
         context.fillPath()
 
         context.restoreGState()