Improve appearance of the gutter view

Make the gutter view background translucent using NSVisualEffectView when no
custom background color is set. This allows the gutter to blend better with
the editor window.

Extract the marker container view into a dedicated
STGutterMarkerContainerView class to distinguish it from the main gutter
container view.

Author: krzyzanowskim

Sources/STTextViewAppKit/Gutter/STGutterContainerView.swift

@@ -17,7 +17,7 @@ final class STGutterContainerView: NSView {
     }
 
     override var isOpaque: Bool {
-        true
+        false
     }
 
     @available(*, unavailable)

Sources/STTextViewAppKit/Gutter/STGutterMarkerContainerView.swift

@@ -0,0 +1,27 @@
+//  Created by Marcin Krzyzanowski
+//  https://github.com/krzyzanowskim/STTextView/blob/main/LICENSE.md
+
+import AppKit
+
+// Gutter line number cells container
+final class STGutterMarkerContainerView: NSView {
+
+    override init(frame: CGRect) {
+        super.init(frame: frame)
+        wantsLayer = true
+        clipsToBounds = true
+    }
+
+    override var isFlipped: Bool {
+        true
+    }
+
+    override var isOpaque: Bool {
+        false
+    }
+
+    @available(*, unavailable)
+    required init?(coder: NSCoder) {
+        fatalError("init(coder:) has not been implemented")
+    }
+}

Sources/STTextViewAppKit/Gutter/STGutterView.swift

@@ -28,7 +28,7 @@ public extension STGutterViewDelegate {
 /// A gutter to the side of a scroll view’s document view.
 open class STGutterView: NSView, NSDraggingSource {
     internal let containerView: STGutterContainerView
-    internal let markerContainerView: STGutterContainerView
+    internal let markerContainerView: STGutterMarkerContainerView
 
     /// Delegate
     weak var delegate: (any STGutterViewDelegate)?
@@ -64,8 +64,20 @@ open class STGutterView: NSView, NSDraggingSource {
     internal var backgroundColor: NSColor? = nil {
         didSet {
             layer?.backgroundColor = backgroundColor?.cgColor
+            if backgroundColor == nil, _backgroundEffectView == nil {
+                let backgroundEffect = NSVisualEffectView(frame: bounds)
+                backgroundEffect.autoresizingMask = [.width, .height]
+                backgroundEffect.blendingMode = .withinWindow
+                backgroundEffect.material = .contentBackground
+                backgroundEffect.state = .followsWindowActiveState
+                addSubview(backgroundEffect, positioned: .below, relativeTo: self)
+                self._backgroundEffectView = backgroundEffect
+            } else if backgroundColor != nil, _backgroundEffectView != nil {
+                _backgroundEffectView?.removeFromSuperview()
+            }
         }
     }
+    private var _backgroundEffectView: NSVisualEffectView?
 
     /// The background color of the highlighted line.
     @Invalidating(.display)
@@ -96,16 +108,21 @@ open class STGutterView: NSView, NSDraggingSource {
         true
     }
 
+    open override var allowsVibrancy: Bool {
+        true
+    }
+
     override init(frame: CGRect) {
         containerView = STGutterContainerView(frame: frame)
         containerView.autoresizingMask = [.width, .height]
 
-        markerContainerView = STGutterContainerView(frame: frame)
+        markerContainerView = STGutterMarkerContainerView(frame: frame)
         markerContainerView.autoresizingMask = [.width, .height]
 
         super.init(frame: frame)
         wantsLayer = true
         clipsToBounds = true
+
         addSubview(containerView)
         addSubview(markerContainerView)