feat: moved widgets settings to the new design

Kit/Widgets/BarChart.swift

@@ -22,8 +22,8 @@ public class BarChart: WidgetWrapper {
     private var _pressureLevel: DispatchSource.MemoryPressureEvent = .normal
     private var _colorZones: colorZones = (0.6, 0.8)
     
-    private var boxSettingsView: NSView? = nil
-    private var frameSettingsView: NSView? = nil
+    private var boxSettingsView: NSSwitch? = nil
+    private var frameSettingsView: NSSwitch? = nil
     
     public init(title: String, config: NSDictionary?, preview: Bool = false) {
         var widgetTitle: String = title
@@ -240,32 +240,30 @@ public class BarChart: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Label"),
-            action: #selector(self.toggleLabel),
-            state: self.labelState
-        ))
-        
-        self.boxSettingsView = toggleSettingRow(
-            title: localizedString("Box"),
+        let box = switchView(
             action: #selector(self.toggleBox),
             state: self.boxState
         )
-        view.addArrangedSubview(self.boxSettingsView!)
-        
-        self.frameSettingsView = toggleSettingRow(
-            title: localizedString("Frame"),
+        self.boxSettingsView = box
+        let frame = switchView(
             action: #selector(self.toggleFrame),
             state: self.frameState
         )
-        view.addArrangedSubview(self.frameSettingsView!)
+        self.frameSettingsView = frame
         
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color"),
-            action: #selector(self.toggleColor),
-            items: self.colors,
-            selected: self.colorState.key
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Label"), component: switchView(
+                action: #selector(self.toggleLabel),
+                state: self.labelState
+            )),
+            PreferencesRow(localizedString("Color"), component: selectView(
+                action: #selector(self.toggleColor),
+                items: self.colors,
+                selected: self.colorState.key
+            )),
+            PreferencesRow(localizedString("Box"), component: box),
+            PreferencesRow(localizedString("Frame"), component: frame)
+        ]))
         
         return view
     }
@@ -281,7 +279,7 @@ public class BarChart: WidgetWrapper {
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_box", value: self.boxState)
         
         if self.frameState {
-            findAndToggleNSControlState(self.frameSettingsView, state: .off)
+            self.frameSettingsView?.state = .off
             self.frameState = false
             Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_frame", value: self.frameState)
         }
@@ -294,7 +292,7 @@ public class BarChart: WidgetWrapper {
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_frame", value: self.frameState)
         
         if self.boxState {
-            findAndToggleNSControlState(self.boxSettingsView, state: .off)
+            self.boxSettingsView?.state = .off
             self.boxState = false
             Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_box", value: self.boxState)
         }

Kit/Widgets/Battery.swift

@@ -586,12 +586,13 @@ public class BatteryDetailsWidget: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Mode"),
-            action: #selector(self.toggleMode),
-            items: BatteryInfo,
-            selected: self.mode
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Mode"), component: selectView(
+                action: #selector(self.toggleMode),
+                items: BatteryInfo,
+                selected: self.mode
+            ))
+        ]))
         
         return view
     }

Kit/Widgets/LineChart.swift

@@ -54,8 +54,8 @@ public class LineChart: WidgetWrapper {
         }
     }
     
-    private var boxSettingsView: NSView? = nil
-    private var frameSettingsView: NSView? = nil
+    private var boxSettingsView: NSSwitch? = nil
+    private var frameSettingsView: NSSwitch? = nil
     
     public init(title: String, config: NSDictionary?, preview: Bool = false) {
         var widgetTitle: String = title
@@ -263,58 +263,48 @@ public class LineChart: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Label"),
-            action: #selector(self.toggleLabel),
-            state: self.labelState
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Value"),
-            action: #selector(self.toggleValue),
-            state: self.valueState
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Colorize value"),
-            action: #selector(self.toggleValueColor),
-            state: self.valueColorState
-        ))
-        
-        self.boxSettingsView = toggleSettingRow(
-            title: localizedString("Box"),
+        let box = switchView(
             action: #selector(self.toggleBox),
             state: self.boxState
         )
-        view.addArrangedSubview(self.boxSettingsView!)
-        
-        self.frameSettingsView = toggleSettingRow(
-            title: localizedString("Frame"),
+        self.boxSettingsView = box
+        let frame = switchView(
             action: #selector(self.toggleFrame),
             state: self.frameState
         )
-        view.addArrangedSubview(self.frameSettingsView!)
+        self.frameSettingsView = frame
         
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color"),
-            action: #selector(self.toggleColor),
-            items: self.colors,
-            selected: self.colorState.key
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Number of reads in the chart"),
-            action: #selector(self.toggleHistoryCount),
-            items: self.historyNumbers,
-            selected: "\(self.historyCount)"
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Scaling"),
-            action: #selector(self.toggleScale),
-            items: Scale.allCases.filter({ $0 != .fixed }),
-            selected: self.scaleState.key
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Label"), component: switchView(
+                action: #selector(self.toggleLabel),
+                state: self.labelState
+            )),
+            PreferencesRow(localizedString("Value"), component: switchView(
+                action: #selector(self.toggleValue),
+                state: self.valueState
+            )),
+            PreferencesRow(localizedString("Box"), component: box),
+            PreferencesRow(localizedString("Frame"), component: frame),
+            PreferencesRow(localizedString("Color"), component: selectView(
+                action: #selector(self.toggleColor),
+                items: self.colors,
+                selected: self.colorState.key
+            )),
+            PreferencesRow(localizedString("Colorize value"), component: switchView(
+                action: #selector(self.toggleValueColor),
+                state: self.valueColorState
+            )),
+            PreferencesRow(localizedString("Number of reads in the chart"), component: selectView(
+                action: #selector(self.toggleHistoryCount),
+                items: self.historyNumbers,
+                selected: "\(self.historyCount)"
+            )),
+            PreferencesRow(localizedString("Scaling"), component: selectView(
+                action: #selector(self.toggleScale),
+                items: Scale.allCases.filter({ $0 != .fixed }),
+                selected: self.scaleState.key
+            ))
+        ]))
         
         return view
     }
@@ -330,7 +320,7 @@ public class LineChart: WidgetWrapper {
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_box", value: self.boxState)
         
         if self.frameState {
-            findAndToggleNSControlState(self.frameSettingsView, state: .off)
+            self.frameSettingsView?.state = .off
             self.frameState = false
             Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_frame", value: self.frameState)
         }
@@ -343,7 +333,7 @@ public class LineChart: WidgetWrapper {
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_frame", value: self.frameState)
         
         if self.boxState {
-            findAndToggleNSControlState(self.boxSettingsView, state: .off)
+            self.boxSettingsView?.state = .off
             self.boxState = false
             Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_box", value: self.boxState)
         }

Kit/Widgets/Memory.swift

@@ -148,24 +148,21 @@ public class MemoryWidget: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Reverse values order"),
-            action: #selector(self.toggleOrder),
-            state: self.orderReversedState
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Show symbols"),
-            action: #selector(self.toggleSymbols),
-            state: self.symbolsState
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color"),
-            action: #selector(self.toggleColor),
-            items: Color.allCases.filter({ $0 != .cluster }),
-            selected: self.colorState.key
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Color"), component: selectView(
+                action: #selector(self.toggleColor),
+                items: Color.allCases.filter({ $0 != .cluster }),
+                selected: self.colorState.key
+            )),
+            PreferencesRow(localizedString("Show symbols"), component: switchView(
+                action: #selector(self.toggleSymbols),
+                state: self.symbolsState
+            )),
+            PreferencesRow(localizedString("Reverse order"), component: switchView(
+                action: #selector(self.toggleOrder),
+                state: self.orderReversedState
+            ))
+        ]))
         
         return view
     }

Kit/Widgets/Mini.swift

@@ -189,25 +189,22 @@ public class Mini: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Label"),
-            action: #selector(self.toggleLabel),
-            state: self.labelState
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color"),
-            action: #selector(self.toggleColor),
-            items: self.colors,
-            selected: self.colorState.key
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Alignment"),
-            action: #selector(self.toggleAlignment),
-            items: Alignments,
-            selected: self.alignmentState
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Label"), component: switchView(
+                action: #selector(self.toggleLabel),
+                state: self.labelState
+            )),
+            PreferencesRow(localizedString("Color"), component: selectView(
+                action: #selector(self.toggleColor),
+                items: self.colors,
+                selected: self.colorState.key
+            )),
+            PreferencesRow(localizedString("Alignment"), component: selectView(
+                action: #selector(self.toggleAlignment),
+                items: Alignments,
+                selected: self.alignmentState
+            ))
+        ]))
         
         return view
     }

Kit/Widgets/NetworkChart.swift

@@ -48,8 +48,8 @@ public class NetworkChart: WidgetWrapper {
     ]
     private var colors: [Color] = Color.allCases
     
-    private var boxSettingsView: NSView? = nil
-    private var frameSettingsView: NSView? = nil
+    private var boxSettingsView: NSSwitch? = nil
+    private var frameSettingsView: NSSwitch? = nil
     
     public var NSLabelCharts: [NSAttributedString] = []
     
@@ -253,59 +253,49 @@ public class NetworkChart: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Label"),
-            action: #selector(toggleLabel),
-            state: self.labelState
-        ))
-        
-        self.boxSettingsView = toggleSettingRow(
-            title: localizedString("Box"),
-            action: #selector(toggleBox),
+        let box = switchView(
+            action: #selector(self.toggleBox),
             state: self.boxState
         )
-        view.addArrangedSubview(self.boxSettingsView!)
-        
-        self.frameSettingsView = toggleSettingRow(
-            title: localizedString("Frame"),
-            action: #selector(toggleFrame),
+        self.boxSettingsView = box
+        let frame = switchView(
+            action: #selector(self.toggleFrame),
             state: self.frameState
         )
-        view.addArrangedSubview(self.frameSettingsView!)
+        self.frameSettingsView = frame
         
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color of download"),
-            action: #selector(toggleDownloadColor),
-            items: self.colors,
-            selected: self.downloadColor.key
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color of upload"),
-            action: #selector(toggleUploadColor),
-            items: self.colors,
-            selected: self.uploadColor.key
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Number of reads in the chart"),
-            action: #selector(toggleHistoryCount),
-            items: self.historyNumbers,
-            selected: "\(self.historyCount)"
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Scaling"),
-            action: #selector(toggleScale),
-            items: Scale.allCases.filter({ $0 != .fixed }),
-            selected: self.scaleState.key
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Reverse order"),
-            action: #selector(toggleReverseOrder),
-            state: self.reverseOrderState
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Label"), component: switchView(
+                action: #selector(self.toggleLabel),
+                state: self.labelState
+            )),
+            PreferencesRow(localizedString("Box"), component: box),
+            PreferencesRow(localizedString("Frame"), component: frame),
+            PreferencesRow(localizedString("Reverse order"), component: switchView(
+                action: #selector(self.toggleReverseOrder),
+                state: self.reverseOrderState
+            )),
+            PreferencesRow(localizedString("Color of download"), component: selectView(
+                action: #selector(self.toggleDownloadColor),
+                items: self.colors,
+                selected: self.downloadColor.key
+            )),
+            PreferencesRow(localizedString("Color of upload"), component: selectView(
+                action: #selector(self.toggleUploadColor),
+                items: self.colors,
+                selected: self.uploadColor.key
+            )),
+            PreferencesRow(localizedString("Number of reads in the chart"), component: selectView(
+                action: #selector(self.toggleHistoryCount),
+                items: self.historyNumbers,
+                selected: "\(self.historyCount)"
+            )),
+            PreferencesRow(localizedString("Scaling"), component: selectView(
+                action: #selector(self.toggleScale),
+                items: Scale.allCases.filter({ $0 != .fixed }),
+                selected: self.scaleState.key
+            ))
+        ]))
         
         return view
     }
@@ -321,7 +311,7 @@ public class NetworkChart: WidgetWrapper {
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_box", value: self.boxState)
         
         if self.frameState {
-            findAndToggleNSControlState(self.frameSettingsView, state: .off)
+            self.frameSettingsView?.state = .off
             self.frameState = false
             Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_frame", value: self.frameState)
         }
@@ -334,7 +324,7 @@ public class NetworkChart: WidgetWrapper {
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_frame", value: self.frameState)
         
         if self.boxState {
-            findAndToggleNSControlState(self.boxSettingsView, state: .off)
+            self.boxSettingsView?.state = .off
             self.boxState = false
             Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_box", value: self.boxState)
         }

Kit/Widgets/PieChart.swift

@@ -108,17 +108,16 @@ public class PieChart: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Label"),
-            action: #selector(self.toggleLabel),
-            state: self.labelState
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Monochrome accent"),
-            action: #selector(self.toggleMonochrome),
-            state: self.monochromeState
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Label"), component: switchView(
+                action: #selector(self.toggleLabel),
+                state: self.labelState
+            )),
+            PreferencesRow(localizedString("Monochrome accent"), component: switchView(
+                action: #selector(self.toggleMonochrome),
+                state: self.monochromeState
+            ))
+        ]))
         
         return view
     }

Kit/Widgets/Speed.swift

@@ -36,9 +36,9 @@ public class SpeedWidget: WidgetWrapper {
     
     private var width: CGFloat = 58
     
-    private var valueColorView: NSView? = nil
-    private var transparentIconView: NSView? = nil
-    private var valueAlignmentView: NSView? = nil
+    private var valueColorView: NSSwitch? = nil
+    private var transparentIconView: NSSwitch? = nil
+    private var valueAlignmentView: NSPopUpButton? = nil
     
     private var downloadColor: NSColor {
         self.monochromeState ? MonochromeColor.blue : (self.downloadColorState.additional as? NSColor ?? NSColor.systemBlue)
@@ -427,82 +427,69 @@ public class SpeedWidget: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Display mode"),
-            action: #selector(changeDisplayMode),
-            items: SensorsWidgetMode.filter({ $0.key == "oneRow" || $0.key == "twoRows"}),
-            selected: self.modeState
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Reverse order"),
-            action: #selector(toggleReverseOrder),
-            state: self.reverseOrderState
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Pictogram"),
-            action: #selector(toggleIcon),
-            items: SpeedPictogram,
-            selected: self.icon
-        ))
-        
-        self.transparentIconView = toggleSettingRow(
-            title: localizedString("Transparent pictogram when no activity"),
-            action: #selector(toggleTransparentIcons),
+        let pictogramTransparency = switchView(
+            action: #selector(self.toggleTransparentIcons),
             state: self.transparentIconsState
         )
-        view.addArrangedSubview(self.transparentIconView!)
-        findAndToggleEnableNSControlState(self.transparentIconView!, state: self.icon != "none")
+        pictogramTransparency.isEnabled = self.icon != "none"
+        self.transparentIconView = pictogramTransparency
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Value"),
-            action: #selector(toggleValue),
-            state: self.valueState
-        ))
-        
-        self.valueColorView = toggleSettingRow(
-            title: localizedString("Colorize value"),
-            action: #selector(toggleValueColor),
+        let colorizeValue = switchView(
+            action: #selector(self.toggleValueColor),
             state: self.valueColorState
         )
-        view.addArrangedSubview(self.valueColorView!)
-        findAndToggleEnableNSControlState(self.valueColorView, state: self.valueState)
+        colorizeValue.isEnabled = self.valueState
+        self.valueColorView = colorizeValue
         
-        self.valueAlignmentView = selectSettingsRow(
-            title: localizedString("Alignment"),
+        let alignment = selectView(
             action: #selector(toggleValueAlignment),
             items: Alignments,
             selected: self.valueAlignmentState
         )
-        view.addArrangedSubview(self.valueAlignmentView!)
-        findAndToggleEnableNSControlState(self.valueAlignmentView, state: self.valueState)
+        alignment.isEnabled = self.valueState
+        self.valueAlignmentView = alignment
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Units"),
-            action: #selector(toggleUnits),
-            state: self.unitsState
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Monochrome accent"),
-            action: #selector(toggleMonochrome),
-            state: self.monochromeState
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color of upload"),
-            action: #selector(toggleUploadColor),
-            items: Color.allColors,
-            selected: self.uploadColorState.key
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Color of download"),
-            action: #selector(toggleDownloadColor),
-            items: Color.allColors,
-            selected: self.downloadColorState.key
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Display mode"), component: selectView(
+                action: #selector(self.changeDisplayMode),
+                items: SensorsWidgetMode.filter({ $0.key == "oneRow" || $0.key == "twoRows"}),
+                selected: self.modeState
+            )),
+            PreferencesRow(localizedString("Reverse order"), component: switchView(
+                action: #selector(self.toggleReverseOrder),
+                state: self.reverseOrderState
+            )),
+            PreferencesRow(localizedString("Pictogrammode"), component: selectView(
+                action: #selector(self.toggleIcon),
+                items: SpeedPictogram,
+                selected: self.icon
+            )),
+            PreferencesRow(localizedString("Transparent pictogram when no activity"), component: pictogramTransparency),
+            PreferencesRow(localizedString("Value"), component: switchView(
+                action: #selector(self.toggleValue),
+                state: self.valueState
+            )),
+            PreferencesRow(localizedString("Colorize value"), component: colorizeValue),
+            PreferencesRow(localizedString("Alignment"), component: alignment),
+            PreferencesRow(localizedString("Units"), component: switchView(
+                action: #selector(self.toggleUnits),
+                state: self.unitsState
+            )),
+            PreferencesRow(localizedString("Monochrome accent"), component: switchView(
+                action: #selector(self.toggleMonochrome),
+                state: self.monochromeState
+            )),
+            PreferencesRow(localizedString("Color of download"), component: selectView(
+                action: #selector(self.toggleDownloadColor),
+                items: Color.allColors,
+                selected: self.downloadColorState.key
+            )),
+            PreferencesRow(localizedString("Color of upload"), component: selectView(
+                action: #selector(self.toggleUploadColor),
+                items: Color.allColors,
+                selected: self.uploadColorState.key
+            ))
+        ]))
         
         return view
     }
@@ -523,8 +510,8 @@ public class SpeedWidget: WidgetWrapper {
     @objc private func toggleValue(_ sender: NSControl) {
         self.valueState = controlState(sender)
         
-        findAndToggleEnableNSControlState(self.valueColorView, state: self.valueState)
-        findAndToggleEnableNSControlState(self.valueAlignmentView, state: self.valueState)
+        self.valueColorView?.isEnabled = self.valueState
+        self.valueAlignmentView?.isEnabled = self.valueState
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_value", value: self.valueState)
         self.display()
     }
@@ -538,7 +525,7 @@ public class SpeedWidget: WidgetWrapper {
     @objc private func toggleIcon(_ sender: NSMenuItem) {
         guard let key = sender.representedObject as? String else { return }
         self.icon = key
-        findAndToggleEnableNSControlState(self.transparentIconView, state: self.icon != "none")
+        self.transparentIconView?.isEnabled = self.icon != "none"
         Store.shared.set(key: "\(self.title)_\(self.type.rawValue)_icon", value: key)
         self.display()
     }

Kit/Widgets/Stack.swift

@@ -231,26 +231,24 @@ public class StackWidget: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Display mode"),
-            action: #selector(self.changeDisplayMode),
-            items: SensorsWidgetMode,
-            selected: self.modeState.rawValue
-        ))
-        
+        var rows = [
+            PreferencesRow(localizedString("Display mode"), component: selectView(
+                action: #selector(self.changeDisplayMode),
+                items: SensorsWidgetMode,
+                selected: self.modeState.rawValue
+            )),
+            PreferencesRow(localizedString("Monospaced font"), component: switchView(
+                action: #selector(self.toggleMonospacedFont),
+                state: self.monospacedFontState
+            ))
+        ]
         if self.title != "Clock" {
-            view.addArrangedSubview(toggleSettingRow(
-                title: localizedString("Static width"),
+            rows.append(PreferencesRow(localizedString("Static width"), component: switchView(
                 action: #selector(self.toggleSize),
                 state: self.fixedSizeState
-            ))
+            )))
         }
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Monospaced font"),
-            action: #selector(self.toggleMonospacedFont),
-            state: self.monospacedFontState
-        ))
+        view.addArrangedSubview(PreferencesSection(rows))
         
         view.addArrangedSubview(self.orderTableView)
         

Kit/Widgets/State.swift

@@ -74,19 +74,18 @@ public class StateWidget: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Active state color"),
-            action: #selector(self.toggleActiveColor),
-            items: self.colors,
-            selected: self.activeColorState.key
-        ))
-        
-        view.addArrangedSubview(selectSettingsRow(
-            title: localizedString("Nonactive state color"),
-            action: #selector(self.toggleNonactiveColor),
-            items: self.colors,
-            selected: self.nonactiveColorState.key
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Active state color"), component: selectView(
+                action: #selector(self.toggleActiveColor),
+                items: self.colors,
+                selected: self.activeColorState.key
+            )),
+            PreferencesRow(localizedString("Nonactive state color"), component: selectView(
+                action: #selector(self.toggleNonactiveColor),
+                items: self.colors,
+                selected: self.nonactiveColorState.key
+            ))
+        ]))
         
         return view
     }

Kit/Widgets/Tachometer.swift

@@ -90,17 +90,16 @@ public class Tachometer: WidgetWrapper {
     public override func settings() -> NSView {
         let view = SettingsContainerView()
         
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Label"),
-            action: #selector(self.toggleLabel),
-            state: self.labelState
-        ))
-        
-        view.addArrangedSubview(toggleSettingRow(
-            title: localizedString("Monochrome accent"),
-            action: #selector(self.toggleMonochrome),
-            state: self.monochromeState
-        ))
+        view.addArrangedSubview(PreferencesSection([
+            PreferencesRow(localizedString("Label"), component: switchView(
+                action: #selector(self.toggleLabel),
+                state: self.labelState
+            )),
+            PreferencesRow(localizedString("Monochrome accent"), component: switchView(
+                action: #selector(self.toggleMonochrome),
+                state: self.monochromeState
+            ))
+        ]))
         
         return view
     }