feat(dbar): add workspace & widget color customization options

A DPMS off/on cycle removes an output from Quickshell.screens and re-adds
it, which DMSShell's onScreensChanged cannot distinguish from a hotplug. It
fired triggerSurfaceRecovery() on every such event; on hardware where
recreating layer-shell surfaces re-wakes the just-powered-down output, this
drives an endless recovery storm that visibly power-cycles the monitor.

Route the screen-reconnect path through a 450 ms debounce (collapsing the
output-remove + re-add pair into a single pass) followed by a 4 s cooldown,
so repeated flaps trigger at most one recovery per window. Recovery still
runs once per resume, so the partial-DPMS-resume recovery added for #2579 is
preserved. The session-resume path runs its own recovery directly and now
clears any queued screen-reconnect recovery to avoid a redundant follow-up.

Fixes #2642

core/cmd/dms/commands_colorpicker.go

@@ -19,7 +19,12 @@ var (
 var colorCmd = &cobra.Command{
 	Use:   "color",
 	Short: "Color utilities",
-	Long:  "Color utilities including picking colors from the screen",
+	Long: `Color utilities including picking colors from the screen.
+
+This is the screen eyedropper CLI. To open the in-shell color modal, use:
+  dms ipc call color-picker toggle
+
+See: https://danklinux.com/docs/dankmaterialshell/keybinds-ipc`,
 }
 
 var colorPickCmd = &cobra.Command{
@@ -29,6 +34,9 @@ var colorPickCmd = &cobra.Command{
 
 Click on any pixel to capture its color, or press Escape to cancel.
 
+This is the screen eyedropper CLI. To open the in-shell color modal, use:
+  dms ipc call color-picker toggle
+
 Output format flags (mutually exclusive, default: --hex):
   --hex  - Hexadecimal (#RRGGBB)
   --rgb  - RGB values (R G B)

core/cmd/dms/commands_common.go

@@ -77,10 +77,15 @@ var killCmd = &cobra.Command{
 }
 
 var ipcCmd = &cobra.Command{
-	Use:   "ipc [target] [function] [args...]",
+	Use:   "ipc",
 	Short: "Send IPC commands to running DMS shell",
+	Long: `Send IPC commands to the running DMS shell.
+
+  dms ipc call <target> <function> [args...]   invoke a command
+  dms ipc list                                 list all targets and functions
+
+Full reference: https://danklinux.com/docs/dankmaterialshell/keybinds-ipc`,
 	ValidArgsFunction: func(cmd *cobra.Command, args []string, toComplete string) ([]string, cobra.ShellCompDirective) {
-		_ = findConfig(cmd, args)
 		return getShellIPCCompletions(args, toComplete), cobra.ShellCompDirectiveNoFileComp
 	},
 	Run: func(cmd *cobra.Command, args []string) {
@@ -88,9 +93,17 @@ var ipcCmd = &cobra.Command{
 	},
 }
 
+var ipcListCmd = &cobra.Command{
+	Use:   "list",
+	Short: "List all IPC targets and functions",
+	Run: func(cmd *cobra.Command, args []string) {
+		printIPCHelp()
+	},
+}
+
 func init() {
+	ipcCmd.AddCommand(ipcListCmd)
 	ipcCmd.SetHelpFunc(func(cmd *cobra.Command, args []string) {
-		_ = findConfig(cmd, args)
 		printIPCHelp()
 	})
 }

core/cmd/dms/shell.go

@@ -601,12 +601,30 @@ func parseTargetsFromIPCShowOutput(output string) ipcTargets {
 	return targets
 }
 
-func getShellIPCCompletions(args []string, _ string) []string {
+func buildQsIPCBaseArgs() ([]string, error) {
 	cmdArgs := []string{"ipc"}
-	if qsHasAnyDisplay() {
+	switch pid, ok := getFirstDMSPID(); {
-		cmdArgs = append(cmdArgs, "--any-display")
+	case ok:
+		cmdArgs = append(cmdArgs, "--pid", strconv.Itoa(pid))
+	default:
+		if err := findConfig(nil, nil); err != nil {
+			return nil, err
+		}
+		if qsHasAnyDisplay() {
+			cmdArgs = append(cmdArgs, "--any-display")
+		}
+		cmdArgs = append(cmdArgs, "-p", configPath)
 	}
-	cmdArgs = append(cmdArgs, "-p", configPath, "show")
+	return cmdArgs, nil
+}
+
+func getShellIPCCompletions(args []string, _ string) []string {
+	baseArgs, err := buildQsIPCBaseArgs()
+	if err != nil {
+		log.Debugf("Error building IPC args for completions: %v", err)
+		return nil
+	}
+	cmdArgs := append(baseArgs, "show")
 	cmd := exec.Command("qs", cmdArgs...)
 	var targets ipcTargets
 
@@ -623,7 +641,7 @@ func getShellIPCCompletions(args []string, _ string) []string {
 
 	if len(args) == 0 {
 		targetNames := make([]string, 0)
-		targetNames = append(targetNames, "call")
+		targetNames = append(targetNames, "call", "list")
 		for k := range targets {
 			targetNames = append(targetNames, k)
 		}
@@ -696,23 +714,11 @@ func runShellIPCCommand(args []string) {
 		args = append([]string{"call"}, args...)
 	}
 
-	cmdArgs := []string{"ipc"}
+	baseArgs, err := buildQsIPCBaseArgs()
-
+	if err != nil {
-	switch pid, ok := getFirstDMSPID(); {
+		log.Fatalf("Error finding config: %v", err)
-	case ok:
-		cmdArgs = append(cmdArgs, "--pid", strconv.Itoa(pid))
-	default:
-		if err := findConfig(nil, nil); err != nil {
-			log.Fatalf("Error finding config: %v", err)
-		}
-		// ! TODO - remove check when QS 0.3 is released
-		if qsHasAnyDisplay() {
-			cmdArgs = append(cmdArgs, "--any-display")
-		}
-		cmdArgs = append(cmdArgs, "-p", configPath)
 	}
-
+	cmdArgs := append(baseArgs, args...)
-	cmdArgs = append(cmdArgs, args...)
 	cmd := exec.Command("qs", cmdArgs...)
 	cmd.Stdin = os.Stdin
 	cmd.Stdout = os.Stdout
@@ -724,19 +730,20 @@ func runShellIPCCommand(args []string) {
 }
 
 func printIPCHelp() {
-	fmt.Println("Usage: dms ipc <target> <function> [args...]")
+	fmt.Println("Usage: dms ipc call <target> <function> [args...]")
 	fmt.Println()
 
-	cmdArgs := []string{"ipc"}
+	baseArgs, err := buildQsIPCBaseArgs()
-	if qsHasAnyDisplay() {
+	if err != nil {
-		cmdArgs = append(cmdArgs, "--any-display")
+		printIPCHelpFailure(err)
+		return
 	}
-	cmdArgs = append(cmdArgs, "-p", configPath, "show")
+	cmdArgs := append(baseArgs, "show")
 	cmd := exec.Command("qs", cmdArgs...)
 
 	output, err := cmd.Output()
 	if err != nil {
-		fmt.Println("Could not retrieve available IPC targets (is DMS running?)")
+		printIPCHelpFailure(err)
 		return
 	}
 
@@ -765,6 +772,16 @@ func printIPCHelp() {
 	}
 }
 
+func printIPCHelpFailure(err error) {
+	fmt.Println("Could not retrieve IPC targets.")
+	if err != nil {
+		fmt.Printf("  %v\n", err)
+	}
+	fmt.Println()
+	fmt.Println("  Full docs:  https://danklinux.com/docs/dankmaterialshell/keybinds-ipc")
+	fmt.Println("  Try:        dms ipc call <target> <function>")
+}
+
 // ensureFontCache rebuilds the fontconfig cache if user-configured fonts are missing while skipping defaults
 func ensureFontCache() {
 	if _, err := exec.LookPath("fc-list"); err != nil {

core/internal/keybinds/providers/niri_parser.go

@@ -51,7 +51,7 @@ type NiriParser struct {
 }
 
 func parseKDL(data []byte) (*document.Document, error) {
-	return kdl.Parse(strings.NewReader(normalizeKDLBraces(string(data))))
+	return kdl.Parse(strings.NewReader(normalizeKDLBraces(quoteLeadingUnderscoreIdents(string(data)))))
 }
 
 func normalizeKDLBraces(input string) string {
@@ -94,6 +94,93 @@ func normalizeKDLBraces(input string) string {
 	return sb.String()
 }
 
+// quoteLeadingUnderscoreIdents wraps bare KDL identifiers that begin with '_'
+// in double quotes. kdl-go rejects '_' as the first character of a bare
+// identifier (e.g. the common `_JAVA_AWT_WM_NONREPARENTING "1"` environment
+// node), even though niri's own parser and the KDL spec accept it — so without
+// this the whole config fails to parse and no keybinds load. Quoting lets
+// kdl-go parse it; this is safe because the niri parser only dispatches on
+// fixed node/section names (binds, recent-windows, include, ...) that never
+// start with '_', so re-quoting such a name cannot change what DMS reads.
+// Underscores elsewhere in an identifier (XDG_CURRENT_DESKTOP) are left
+// untouched, and underscores inside strings or comments are skipped. Only a
+// leading '_' is handled; other start characters kdl-go over-rejects (e.g. '.'
+// or '?') do not occur in niri configs.
+func quoteLeadingUnderscoreIdents(input string) string {
+	var sb strings.Builder
+	sb.Grow(len(input))
+
+	var prev byte
+	n := len(input)
+	for i := 0; i < n; {
+		c := input[i]
+
+		switch {
+		case c == '"':
+			end := findStringEnd(input, i)
+			sb.WriteString(input[i:end])
+			prev = '"'
+			i = end
+		case c == '/' && i+1 < n && input[i+1] == '/':
+			end := findLineCommentEnd(input, i)
+			sb.WriteString(input[i:end])
+			prev = '\n'
+			i = end
+		case c == '/' && i+1 < n && input[i+1] == '*':
+			end := findBlockCommentEnd(input, i)
+			sb.WriteString(input[i:end])
+			prev = ' '
+			i = end
+		case c == '/' && i+1 < n && input[i+1] == '-':
+			// KDL slashdash: /- comments out the next node/value. Keep the
+			// marker but treat what follows as a fresh token start, so a
+			// slashdashed leading-underscore node (e.g. `/-_FOO "1"`) still
+			// gets quoted instead of crashing kdl-go.
+			sb.WriteByte('/')
+			sb.WriteByte('-')
+			prev = ' '
+			i += 2
+		case c == '_' && isIdentBoundary(prev):
+			end := scanBareIdent(input, i)
+			sb.WriteByte('"')
+			sb.WriteString(input[i:end])
+			sb.WriteByte('"')
+			prev = '"'
+			i = end
+		default:
+			sb.WriteByte(c)
+			prev = c
+			i++
+		}
+	}
+
+	return sb.String()
+}
+
+// isIdentBoundary reports whether the previously emitted byte ends a token, so
+// that a following '_' starts a fresh bare identifier rather than sitting in
+// the middle of one.
+func isIdentBoundary(prev byte) bool {
+	switch prev {
+	case 0, ' ', '\t', '\n', '\r', '{', '}', ';', '=', '(', ')', ',':
+		return true
+	}
+	return false
+}
+
+// scanBareIdent returns the index just past the bare identifier starting at
+// start, stopping at whitespace or any KDL delimiter.
+func scanBareIdent(s string, start int) int {
+	n := len(s)
+	for i := start; i < n; i++ {
+		switch s[i] {
+		case ' ', '\t', '\n', '\r', '"', '{', '}', '(', ')', ';', '=', ',', '/', '\\', '<', '>', '[', ']':
+			return i
+		}
+	}
+	return n
+}
+
 func findStringEnd(s string, start int) int {
 	n := len(s)
 	for i := start + 1; i < n; {

core/internal/keybinds/providers/niri_parser_test.go

@@ -71,6 +71,101 @@ func TestNormalizeKDLBraces(t *testing.T) {
 	}
 }
 
+func TestQuoteLeadingUnderscoreIdents(t *testing.T) {
+	tests := []struct {
+		name string
+		in   string
+		out  string
+	}{
+		{"leading underscore node", `_JAVA_AWT_WM_NONREPARENTING "1"`, `"_JAVA_AWT_WM_NONREPARENTING" "1"`},
+		{"mid underscore untouched", `XDG_CURRENT_DESKTOP "niri"`, `XDG_CURRENT_DESKTOP "niri"`},
+		{"indented node", "environment {\n  _FOO \"1\"\n}", "environment {\n  \"_FOO\" \"1\"\n}"},
+		{"underscore in string", `spawn "_not_a_node"`, `spawn "_not_a_node"`},
+		{"underscore in line comment", "// _comment\n_FOO \"1\"", "// _comment\n\"_FOO\" \"1\""},
+		{"underscore in block comment", "/* _x */ _FOO \"1\"", "/* _x */ \"_FOO\" \"1\""},
+		{"block comment abuts node", `/* x */_FOO "1"`, `/* x */"_FOO" "1"`},
+		{"slashdash before node", `/-_FOO "1"`, `/-"_FOO" "1"`},
+		{"node after closing paren", "node (u8)_v", `node (u8)"_v"`},
+		{"node before brace without space", "_FOO{ }", `"_FOO"{ }`},
+		{"lone underscore", `_ "x"`, `"_" "x"`},
+		{"property value", "node key=_val", `node key="_val"`},
+		{"no underscores", "node child", "node child"},
+	}
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			got := quoteLeadingUnderscoreIdents(tc.in)
+			if got != tc.out {
+				t.Errorf("quoteLeadingUnderscoreIdents(%q) = %q, want %q", tc.in, got, tc.out)
+			}
+		})
+	}
+}
+
+func TestNiriParseLeadingUnderscoreEnvironment(t *testing.T) {
+	tmpDir := t.TempDir()
+	configFile := filepath.Join(tmpDir, "config.kdl")
+
+	// A leading-underscore environment node (a common Java/tiling-WM fix) must
+	// not abort parsing of the rest of the config — keybinds still have to load.
+	content := `environment {
+    XDG_CURRENT_DESKTOP "niri"
+    _JAVA_AWT_WM_NONREPARENTING "1"
+}
+binds {
+    Mod+Q { close-window; }
+    Mod+KP_Home { focus-workspace 1; }
+}
+`
+	if err := os.WriteFile(configFile, []byte(content), 0o644); err != nil {
+		t.Fatalf("Failed to write test config: %v", err)
+	}
+
+	result, err := ParseNiriKeys(tmpDir)
+	if err != nil {
+		t.Fatalf("ParseNiriKeys failed on config with leading-underscore env node: %v", err)
+	}
+
+	if len(result.Section.Keybinds) != 2 {
+		t.Errorf("Expected 2 keybinds, got %d", len(result.Section.Keybinds))
+	}
+
+	foundClose := false
+	for _, kb := range result.Section.Keybinds {
+		if kb.Action == "close-window" {
+			foundClose = true
+		}
+	}
+	if !foundClose {
+		t.Error("close-window keybind not found — leading-underscore env node broke parsing")
+	}
+}
+
+func TestNiriParseSlashdashLeadingUnderscore(t *testing.T) {
+	tmpDir := t.TempDir()
+	configFile := filepath.Join(tmpDir, "config.kdl")
+
+	// A slashdashed leading-underscore node must not abort parsing either.
+	content := `environment {
+    /-_JAVA_AWT_WM_NONREPARENTING "1"
+}
+binds {
+    Mod+Q { close-window; }
+}
+`
+	if err := os.WriteFile(configFile, []byte(content), 0o644); err != nil {
+		t.Fatalf("Failed to write test config: %v", err)
+	}
+
+	result, err := ParseNiriKeys(tmpDir)
+	if err != nil {
+		t.Fatalf("ParseNiriKeys failed on config with slashdashed leading-underscore node: %v", err)
+	}
+
+	if len(result.Section.Keybinds) != 1 {
+		t.Errorf("Expected 1 keybind, got %d", len(result.Section.Keybinds))
+	}
+}
+
 func TestNiriParseKeyCombo(t *testing.T) {
 	tests := []struct {
 		combo        string

core/internal/server/network/API.md

@@ -125,6 +125,8 @@ State updates are sent whenever network configuration changes:
 - `wifiConnected`: Whether associated with an access point
 - `wifiSSID`: Currently connected network name
 - `wifiIP`: Assigned IP address (empty until DHCP completes)
+- `savedWifiNetworks` (API v26+): Saved WiFi profiles exposed at SSID granularity. If a backend has multiple profiles for the same SSID, DMS merges them into one SSID-level entry. Clients talking to older servers should derive saved visible networks from `wifiNetworks` entries where `saved` is true.
+- `savedWifiNetworks[].outOfRange` (API v26+): Whether the saved profile is not currently visible in scan results. Fallback entries derived from `wifiNetworks` should be treated as visible (`outOfRange: false`).
 - `lastError`: Error message from last failed connection attempt
 
 ### network.credentials Service Events

core/internal/server/network/backend.go

@@ -67,6 +67,7 @@ type BackendState struct {
 	WiFiBSSID              string
 	WiFiSignal             uint8
 	WiFiNetworks           []WiFiNetwork
+	SavedWiFiNetworks      []WiFiNetwork
 	WiFiDevices            []WiFiDevice
 	WiredConnections       []WiredConnection
 	VPNProfiles            []VPNProfile

core/internal/server/network/backend_hybrid_test.go

@@ -27,6 +27,19 @@ func TestHybridIwdNetworkdBackend_GetCurrentState_MergesState(t *testing.T) {
 	wifi.state.WiFiBSSID = "00:11:22:33:44:55"
 	wifi.state.WiFiSignal = 75
 	wifi.state.WiFiDevice = "wlan0"
+	wifi.state.SavedWiFiNetworks = []WiFiNetwork{
+		{
+			SSID:        "TestNetwork",
+			Saved:       true,
+			Autoconnect: true,
+			Connected:   true,
+		},
+		{
+			SSID:       "AwayNetwork",
+			Saved:      true,
+			OutOfRange: true,
+		},
+	}
 
 	l3.state.WiFiIP = "192.168.1.100"
 	l3.state.EthernetConnected = false
@@ -42,6 +55,9 @@ func TestHybridIwdNetworkdBackend_GetCurrentState_MergesState(t *testing.T) {
 	assert.True(t, state.WiFiConnected)
 	assert.False(t, state.EthernetConnected)
 	assert.Equal(t, StatusWiFi, state.NetworkStatus)
+	assert.Len(t, state.SavedWiFiNetworks, 2)
+	assert.Equal(t, "TestNetwork", state.SavedWiFiNetworks[0].SSID)
+	assert.True(t, state.SavedWiFiNetworks[1].OutOfRange)
 }
 
 func TestHybridIwdNetworkdBackend_GetCurrentState_EthernetPriority(t *testing.T) {

core/internal/server/network/backend_iwd.go

@@ -80,6 +80,10 @@ func (b *IWDBackend) Initialize() error {
 		return fmt.Errorf("failed to discover iwd devices: %w", err)
 	}
 
+	if err := b.updateSavedWiFiNetworks(); err != nil {
+		log.Warnf("Failed to get initial saved WiFi networks: %v", err)
+	}
+
 	if err := b.updateState(); err != nil {
 		conn.Close()
 		return fmt.Errorf("failed to get initial state: %w", err)
@@ -145,6 +149,7 @@ func (b *IWDBackend) GetCurrentState() (*BackendState, error) {
 
 	state := *b.state
 	state.WiFiNetworks = append([]WiFiNetwork(nil), b.state.WiFiNetworks...)
+	state.SavedWiFiNetworks = append([]WiFiNetwork(nil), b.state.SavedWiFiNetworks...)
 	state.WiredConnections = append([]WiredConnection(nil), b.state.WiredConnections...)
 	state.WiFiDevices = b.getWiFiDevicesLocked()
 

core/internal/server/network/backend_iwd_signals.go

@@ -45,12 +45,42 @@ func (b *IWDBackend) StartMonitoring(onStateChange func()) error {
 		}
 	}
 
+	if err := b.conn.AddMatchSignal(
+		dbus.WithMatchInterface(dbusPropertiesInterface),
+		dbus.WithMatchMember("PropertiesChanged"),
+		dbus.WithMatchArg(0, iwdKnownNetworkInterface),
+	); err != nil {
+		return fmt.Errorf("failed to add known network signal match: %w", err)
+	}
+
+	if err := b.conn.AddMatchSignal(
+		dbus.WithMatchInterface(dbusObjectManager),
+		dbus.WithMatchMember("InterfacesAdded"),
+	); err != nil {
+		return fmt.Errorf("failed to add iwd interfaces-added signal match: %w", err)
+	}
+
+	if err := b.conn.AddMatchSignal(
+		dbus.WithMatchInterface(dbusObjectManager),
+		dbus.WithMatchMember("InterfacesRemoved"),
+	); err != nil {
+		return fmt.Errorf("failed to add iwd interfaces-removed signal match: %w", err)
+	}
+
 	b.sigWG.Add(1)
 	go b.signalHandler(sigChan)
 
 	return nil
 }
 
+func (b *IWDBackend) refreshWiFiNetworkState() bool {
+	_, err := b.updateWiFiNetworks()
+	if err == nil {
+		return true
+	}
+	return b.updateSavedWiFiNetworks() == nil
+}
+
 func (b *IWDBackend) signalHandler(sigChan chan *dbus.Signal) {
 	defer b.sigWG.Done()
 
@@ -66,11 +96,36 @@ func (b *IWDBackend) signalHandler(sigChan chan *dbus.Signal) {
 				return
 			}
 
-			if sig.Name != dbusPropertiesInterface+".PropertiesChanged" {
+			if sig.Name == dbusObjectManager+".InterfacesAdded" {
+				if len(sig.Body) >= 2 {
+					if interfaces, ok := sig.Body[1].(map[string]map[string]dbus.Variant); ok {
+						if _, ok := interfaces[iwdKnownNetworkInterface]; ok {
+							if b.refreshWiFiNetworkState() && b.onStateChange != nil {
+								b.onStateChange()
+							}
+						}
+					}
+				}
 				continue
 			}
 
-			if len(sig.Body) < 2 {
+			if sig.Name == dbusObjectManager+".InterfacesRemoved" {
+				if len(sig.Body) >= 2 {
+					if interfaces, ok := sig.Body[1].([]string); ok {
+						for _, iface := range interfaces {
+							if iface == iwdKnownNetworkInterface {
+								if b.refreshWiFiNetworkState() && b.onStateChange != nil {
+									b.onStateChange()
+								}
+								break
+							}
+						}
+					}
+				}
+				continue
+			}
+
+			if sig.Name != dbusPropertiesInterface+".PropertiesChanged" || len(sig.Body) < 2 {
 				continue
 			}
 
@@ -87,6 +142,9 @@ func (b *IWDBackend) signalHandler(sigChan chan *dbus.Signal) {
 			stateChanged := false
 
 			switch iface {
+			case iwdKnownNetworkInterface:
+				stateChanged = b.refreshWiFiNetworkState()
+
 			case iwdDeviceInterface:
 				if sig.Path == b.devicePath {
 					if poweredVar, ok := changed["Powered"]; ok {
@@ -105,13 +163,7 @@ func (b *IWDBackend) signalHandler(sigChan chan *dbus.Signal) {
 				if sig.Path == b.stationPath {
 					if scanningVar, ok := changed["Scanning"]; ok {
 						if scanning, ok := scanningVar.Value().(bool); ok && !scanning {
-							networks, err := b.updateWiFiNetworks()
+							stateChanged = b.refreshWiFiNetworkState() || stateChanged
-							if err == nil {
-								b.stateMutex.Lock()
-								b.state.WiFiNetworks = networks
-								b.stateMutex.Unlock()
-								stateChanged = true
-							}
 
 							b.stateMutex.RLock()
 							wifiConnected := b.state.WiFiConnected
@@ -236,6 +288,7 @@ func (b *IWDBackend) signalHandler(sigChan chan *dbus.Signal) {
 									}
 								}
 
+								b.refreshWiFiNetworkState()
 								stateChanged = true
 
 								if att != nil && isTarget {
@@ -282,6 +335,7 @@ func (b *IWDBackend) signalHandler(sigChan chan *dbus.Signal) {
 									b.state.NetworkStatus = StatusDisconnected
 								}
 								b.stateMutex.Unlock()
+								b.refreshWiFiNetworkState()
 								stateChanged = true
 							}
 						}
@@ -342,6 +396,7 @@ func (b *IWDBackend) signalHandler(sigChan chan *dbus.Signal) {
 								stateChanged = true
 							}
 							b.stateMutex.Unlock()
+							b.refreshWiFiNetworkState()
 						}
 					}
 				}

core/internal/server/network/backend_iwd_test.go

@@ -4,6 +4,7 @@ import (
 	"testing"
 	"time"
 
+	"github.com/godbus/dbus/v5"
 	"github.com/stretchr/testify/assert"
 )
 
@@ -168,6 +169,92 @@ func TestIWDBackend_MapIwdDBusError(t *testing.T) {
 	}
 }
 
+func TestIWDSavedWiFiProfilesFromManagedObjects(t *testing.T) {
+	objects := map[dbus.ObjectPath]map[string]map[string]dbus.Variant{
+		"/net/connman/iwd/known_network/1": {
+			iwdKnownNetworkInterface: {
+				"Name":        dbus.MakeVariant("Home"),
+				"AutoConnect": dbus.MakeVariant(false),
+				"Hidden":      dbus.MakeVariant(true),
+				"Type":        dbus.MakeVariant("psk"),
+			},
+		},
+		"/net/connman/iwd/known_network/2": {
+			iwdKnownNetworkInterface: {
+				"Name": dbus.MakeVariant("Office"),
+				"Type": dbus.MakeVariant("8021x"),
+			},
+		},
+		"/net/connman/iwd/known_network/3": {
+			iwdKnownNetworkInterface: {
+				"Name": dbus.MakeVariant("Cafe"),
+				"Type": dbus.MakeVariant("open"),
+			},
+		},
+		"/net/connman/iwd/network/1": {
+			iwdNetworkInterface: {
+				"Name": dbus.MakeVariant("VisibleOnly"),
+			},
+		},
+	}
+
+	profiles := iwdSavedWiFiProfilesFromManagedObjects(objects)
+
+	assert.Len(t, profiles, 3)
+	assert.False(t, profiles["Home"].Autoconnect)
+	assert.True(t, profiles["Home"].Hidden)
+	assert.True(t, profiles["Home"].Secured)
+	assert.False(t, profiles["Home"].Enterprise)
+
+	assert.True(t, profiles["Office"].Autoconnect)
+	assert.True(t, profiles["Office"].Secured)
+	assert.True(t, profiles["Office"].Enterprise)
+
+	assert.True(t, profiles["Cafe"].Autoconnect)
+	assert.False(t, profiles["Cafe"].Secured)
+	assert.False(t, profiles["Cafe"].Enterprise)
+}
+
+func TestIWDWiFiNetworksFromVisibleIncludesConnectedHiddenFallback(t *testing.T) {
+	profiles := map[string]savedWiFiProfile{
+		"Home": {
+			Autoconnect: true,
+			Secured:     true,
+			Hidden:      true,
+			Mode:        "infrastructure",
+		},
+	}
+	visible := []WiFiNetwork{
+		{
+			SSID:    "Cafe",
+			Signal:  42,
+			Secured: false,
+		},
+	}
+
+	networks := iwdWiFiNetworksFromVisible(visible, profiles, "Home", true, 68)
+	savedNetworks := savedWiFiNetworksFromProfiles(profiles, map[string]WiFiNetwork{
+		networks[0].SSID: networks[0],
+		networks[1].SSID: networks[1],
+	}, "Home", true)
+
+	assert.Len(t, networks, 2)
+	assert.Equal(t, "Cafe", networks[0].SSID)
+	assert.False(t, networks[0].Connected)
+
+	assert.Equal(t, "Home", networks[1].SSID)
+	assert.True(t, networks[1].Connected)
+	assert.True(t, networks[1].Hidden)
+	assert.True(t, networks[1].Saved)
+	assert.True(t, networks[1].Autoconnect)
+	assert.Equal(t, uint8(68), networks[1].Signal)
+
+	assert.Len(t, savedNetworks, 1)
+	assert.Equal(t, "Home", savedNetworks[0].SSID)
+	assert.True(t, savedNetworks[0].Connected)
+	assert.False(t, savedNetworks[0].OutOfRange)
+}
+
 func TestConnectAttempt_Finalization(t *testing.T) {
 	backend, _ := NewIWDBackend()
 	backend.state = &BackendState{}

core/internal/server/network/backend_iwd_wifi.go

@@ -164,22 +164,18 @@ func (b *IWDBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 		return nil, fmt.Errorf("failed to get networks: %w", err)
 	}
 
-	knownNetworks, err := b.getKnownNetworks()
+	savedProfiles, err := b.getIWDSavedWiFiProfiles()
 	if err != nil {
-		knownNetworks = make(map[string]bool)
+		savedProfiles = make(map[string]savedWiFiProfile)
-	}
-
-	autoconnectMap, err := b.getAutoconnectSettings()
-	if err != nil {
-		autoconnectMap = make(map[string]bool)
 	}
 
 	b.stateMutex.RLock()
 	currentSSID := b.state.WiFiSSID
 	wifiConnected := b.state.WiFiConnected
+	wifiSignal := b.state.WiFiSignal
 	b.stateMutex.RUnlock()
 
-	networks := make([]WiFiNetwork, 0, len(orderedNetworks))
+	visibleNetworks := make([]WiFiNetwork, 0, len(orderedNetworks))
 	for _, netData := range orderedNetworks {
 		if len(netData) < 2 {
 			continue
@@ -225,23 +221,26 @@ func (b *IWDBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 
 		secured := netType != "open"
 
-		network := WiFiNetwork{
+		visibleNetworks = append(visibleNetworks, WiFiNetwork{
-			SSID:        name,
+			SSID:       name,
-			Signal:      signal,
+			Signal:     signal,
-			Secured:     secured,
+			Secured:    secured,
-			Connected:   wifiConnected && name == currentSSID,
+			Enterprise: netType == "8021x",
-			Saved:       knownNetworks[name],
+		})
-			Autoconnect: autoconnectMap[name],
-			Enterprise:  netType == "8021x",
-		}
-
-		networks = append(networks, network)
 	}
 
+	networks := iwdWiFiNetworksFromVisible(visibleNetworks, savedProfiles, currentSSID, wifiConnected, wifiSignal)
+	visibleNetworkMap := make(map[string]WiFiNetwork, len(networks))
+	for _, network := range networks {
+		visibleNetworkMap[network.SSID] = network
+	}
+	savedNetworks := savedWiFiNetworksFromProfiles(savedProfiles, visibleNetworkMap, currentSSID, wifiConnected)
+
 	sortWiFiNetworks(networks)
 
 	b.stateMutex.Lock()
 	b.state.WiFiNetworks = networks
+	b.state.SavedWiFiNetworks = savedNetworks
 	b.stateMutex.Unlock()
 
 	now := time.Now()
@@ -254,30 +253,129 @@ func (b *IWDBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 	return networks, nil
 }
 
-func (b *IWDBackend) getKnownNetworks() (map[string]bool, error) {
+func (b *IWDBackend) updateSavedWiFiNetworks() error {
-	obj := b.conn.Object(iwdBusName, iwdObjectPath)
+	savedProfiles, err := b.getIWDSavedWiFiProfiles()
-
-	var objects map[dbus.ObjectPath]map[string]map[string]dbus.Variant
-	err := obj.Call(dbusObjectManager+".GetManagedObjects", 0).Store(&objects)
 	if err != nil {
-		return nil, err
+		return err
 	}
 
-	known := make(map[string]bool)
+	b.stateMutex.RLock()
-	for _, interfaces := range objects {
+	currentSSID := b.state.WiFiSSID
-		if knownProps, ok := interfaces[iwdKnownNetworkInterface]; ok {
+	wifiConnected := b.state.WiFiConnected
-			if nameVar, ok := knownProps["Name"]; ok {
+	wifiNetworks := append([]WiFiNetwork(nil), b.state.WiFiNetworks...)
-				if name, ok := nameVar.Value().(string); ok {
+	b.stateMutex.RUnlock()
-					known[name] = true
-				}
-			}
-		}
-	}
 
-	return known, nil
+	wifiNetworks, savedNetworks := refreshSavedWiFiState(wifiNetworks, savedProfiles, currentSSID, wifiConnected)
+
+	b.stateMutex.Lock()
+	b.state.WiFiNetworks = wifiNetworks
+	b.state.SavedWiFiNetworks = savedNetworks
+	b.stateMutex.Unlock()
+
+	return nil
 }
 
-func (b *IWDBackend) getAutoconnectSettings() (map[string]bool, error) {
+func iwdWiFiNetworksFromVisible(visibleNetworks []WiFiNetwork, savedProfiles map[string]savedWiFiProfile, currentSSID string, wifiConnected bool, wifiSignal uint8) []WiFiNetwork {
+	networks := make([]WiFiNetwork, 0, len(visibleNetworks)+1)
+	seenSSIDs := make(map[string]struct{}, len(visibleNetworks)+1)
+
+	for _, network := range visibleNetworks {
+		profile, saved := savedProfiles[network.SSID]
+		network.Connected = wifiConnected && network.SSID == currentSSID
+		network.Saved = saved
+		network.Autoconnect = profile.Autoconnect
+		network.Hidden = network.Hidden || profile.Hidden
+		network.Secured = network.Secured || profile.Secured
+		network.Enterprise = network.Enterprise || profile.Enterprise
+		if network.Mode == "" {
+			network.Mode = profile.Mode
+		}
+		networks = append(networks, network)
+		seenSSIDs[network.SSID] = struct{}{}
+	}
+
+	if wifiConnected && currentSSID != "" {
+		if _, exists := seenSSIDs[currentSSID]; !exists {
+			profile, saved := savedProfiles[currentSSID]
+			secured := profile.Secured
+			if !saved {
+				secured = true
+			}
+			mode := profile.Mode
+			if mode == "" {
+				mode = "infrastructure"
+			}
+
+			networks = append(networks, WiFiNetwork{
+				SSID:        currentSSID,
+				Signal:      wifiSignal,
+				Secured:     secured,
+				Enterprise:  profile.Enterprise,
+				Connected:   true,
+				Saved:       saved,
+				Autoconnect: profile.Autoconnect,
+				Hidden:      true,
+				Mode:        mode,
+			})
+		}
+	}
+
+	return networks
+}
+
+func iwdSavedWiFiProfilesFromManagedObjects(objects map[dbus.ObjectPath]map[string]map[string]dbus.Variant) map[string]savedWiFiProfile {
+	profiles := make(map[string]savedWiFiProfile)
+
+	for _, interfaces := range objects {
+		knownProps, ok := interfaces[iwdKnownNetworkInterface]
+		if !ok {
+			continue
+		}
+
+		nameVar, ok := knownProps["Name"]
+		if !ok {
+			continue
+		}
+		name, ok := nameVar.Value().(string)
+		if !ok || name == "" {
+			continue
+		}
+
+		profile := savedWiFiProfile{
+			Autoconnect: true,
+			Mode:        "infrastructure",
+		}
+		if acVar, ok := knownProps["AutoConnect"]; ok {
+			if autoconnect, ok := acVar.Value().(bool); ok {
+				profile.Autoconnect = autoconnect
+			}
+		}
+		if hiddenVar, ok := knownProps["Hidden"]; ok {
+			if hidden, ok := hiddenVar.Value().(bool); ok {
+				profile.Hidden = hidden
+			}
+		}
+		if typeVar, ok := knownProps["Type"]; ok {
+			if networkType, ok := typeVar.Value().(string); ok {
+				profile.Secured = networkType != "" && networkType != "open"
+				profile.Enterprise = networkType == "8021x"
+			}
+		}
+
+		if existing, ok := profiles[name]; ok {
+			profile.Autoconnect = profile.Autoconnect || existing.Autoconnect
+			profile.Hidden = profile.Hidden || existing.Hidden
+			profile.Secured = profile.Secured || existing.Secured
+			profile.Enterprise = profile.Enterprise || existing.Enterprise
+		}
+
+		profiles[name] = profile
+	}
+
+	return profiles
+}
+
+func (b *IWDBackend) getIWDSavedWiFiProfiles() (map[string]savedWiFiProfile, error) {
 	obj := b.conn.Object(iwdBusName, iwdObjectPath)
 
 	var objects map[dbus.ObjectPath]map[string]map[string]dbus.Variant
@@ -286,24 +384,7 @@ func (b *IWDBackend) getAutoconnectSettings() (map[string]bool, error) {
 		return nil, err
 	}
 
-	autoconnectMap := make(map[string]bool)
+	return iwdSavedWiFiProfilesFromManagedObjects(objects), nil
-	for _, interfaces := range objects {
-		if knownProps, ok := interfaces[iwdKnownNetworkInterface]; ok {
-			if nameVar, ok := knownProps["Name"]; ok {
-				if name, ok := nameVar.Value().(string); ok {
-					autoconnect := true
-					if acVar, ok := knownProps["AutoConnect"]; ok {
-						if ac, ok := acVar.Value().(bool); ok {
-							autoconnect = ac
-						}
-					}
-					autoconnectMap[name] = autoconnect
-				}
-			}
-		}
-	}
-
-	return autoconnectMap, nil
 }
 
 func (b *IWDBackend) GetWiFiNetworkDetails(ssid string) (*NetworkInfoResponse, error) {
@@ -614,6 +695,8 @@ func (b *IWDBackend) ForgetWiFiNetwork(ssid string) error {
 						b.stateMutex.Unlock()
 					}
 
+					_, _ = b.updateWiFiNetworks()
+
 					if b.onStateChange != nil {
 						b.onStateChange()
 					}

core/internal/server/network/backend_networkmanager.go

@@ -222,6 +222,10 @@ func (b *NetworkManagerBackend) Initialize() error {
 		log.Warnf("Failed to update WiFi state: %v", err)
 	}
 
+	if err := b.updateSavedWiFiNetworks(); err != nil {
+		log.Warnf("Failed to get initial saved WiFi networks: %v", err)
+	}
+
 	if wifiEnabled {
 		if _, err := b.updateWiFiNetworks(); err != nil {
 			log.Warnf("Failed to get initial networks: %v", err)
@@ -261,6 +265,7 @@ func (b *NetworkManagerBackend) GetCurrentState() (*BackendState, error) {
 
 	state := *b.state
 	state.WiFiNetworks = append([]WiFiNetwork(nil), b.state.WiFiNetworks...)
+	state.SavedWiFiNetworks = append([]WiFiNetwork(nil), b.state.SavedWiFiNetworks...)
 	state.WiFiDevices = append([]WiFiDevice(nil), b.state.WiFiDevices...)
 	state.WiredConnections = append([]WiredConnection(nil), b.state.WiredConnections...)
 	state.EthernetDevices = append([]EthernetDevice(nil), b.state.EthernetDevices...)

core/internal/server/network/backend_networkmanager_signals.go

@@ -5,6 +5,12 @@ import (
 	"github.com/godbus/dbus/v5"
 )
 
+const (
+	dbusNMSettingsPath                = "/org/freedesktop/NetworkManager/Settings"
+	dbusNMSettingsInterface           = "org.freedesktop.NetworkManager.Settings"
+	dbusNMSettingsConnectionInterface = "org.freedesktop.NetworkManager.Settings.Connection"
+)
+
 func (b *NetworkManagerBackend) startSignalPump() error {
 	conn, err := dbus.ConnectSystemBus()
 	if err != nil {
@@ -27,8 +33,8 @@ func (b *NetworkManagerBackend) startSignalPump() error {
 	}
 
 	if err := conn.AddMatchSignal(
-		dbus.WithMatchObjectPath(dbus.ObjectPath("/org/freedesktop/NetworkManager/Settings")),
+		dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMSettingsPath)),
-		dbus.WithMatchInterface("org.freedesktop.NetworkManager.Settings"),
+		dbus.WithMatchInterface(dbusNMSettingsInterface),
 		dbus.WithMatchMember("NewConnection"),
 	); err != nil {
 		conn.RemoveMatchSignal(
@@ -42,8 +48,8 @@ func (b *NetworkManagerBackend) startSignalPump() error {
 	}
 
 	if err := conn.AddMatchSignal(
-		dbus.WithMatchObjectPath(dbus.ObjectPath("/org/freedesktop/NetworkManager/Settings")),
+		dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMSettingsPath)),
-		dbus.WithMatchInterface("org.freedesktop.NetworkManager.Settings"),
+		dbus.WithMatchInterface(dbusNMSettingsInterface),
 		dbus.WithMatchMember("ConnectionRemoved"),
 	); err != nil {
 		conn.RemoveMatchSignal(
@@ -52,8 +58,8 @@ func (b *NetworkManagerBackend) startSignalPump() error {
 			dbus.WithMatchMember("PropertiesChanged"),
 		)
 		conn.RemoveMatchSignal(
-			dbus.WithMatchObjectPath(dbus.ObjectPath("/org/freedesktop/NetworkManager/Settings")),
+			dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMSettingsPath)),
-			dbus.WithMatchInterface("org.freedesktop.NetworkManager.Settings"),
+			dbus.WithMatchInterface(dbusNMSettingsInterface),
 			dbus.WithMatchMember("NewConnection"),
 		)
 		conn.RemoveSignal(signals)
@@ -61,6 +67,31 @@ func (b *NetworkManagerBackend) startSignalPump() error {
 		return err
 	}
 
+	if err := conn.AddMatchSignal(
+		dbus.WithMatchPathNamespace(dbus.ObjectPath(dbusNMSettingsPath)),
+		dbus.WithMatchInterface(dbusNMSettingsConnectionInterface),
+		dbus.WithMatchMember("Updated"),
+	); err != nil {
+		conn.RemoveMatchSignal(
+			dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMPath)),
+			dbus.WithMatchInterface(dbusPropsInterface),
+			dbus.WithMatchMember("PropertiesChanged"),
+		)
+		conn.RemoveMatchSignal(
+			dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMSettingsPath)),
+			dbus.WithMatchInterface(dbusNMSettingsInterface),
+			dbus.WithMatchMember("NewConnection"),
+		)
+		conn.RemoveMatchSignal(
+			dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMSettingsPath)),
+			dbus.WithMatchInterface(dbusNMSettingsInterface),
+			dbus.WithMatchMember("ConnectionRemoved"),
+		)
+		conn.RemoveSignal(signals)
+		conn.Close()
+		return err
+	}
+
 	if err := conn.AddMatchSignal(
 		dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMPath)),
 		dbus.WithMatchInterface(dbusNMInterface),
@@ -137,6 +168,32 @@ func (b *NetworkManagerBackend) stopSignalPump() {
 		dbus.WithMatchMember("PropertiesChanged"),
 	)
 
+	b.dbusConn.RemoveMatchSignal(
+		dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMSettingsPath)),
+		dbus.WithMatchInterface(dbusNMSettingsInterface),
+		dbus.WithMatchMember("NewConnection"),
+	)
+	b.dbusConn.RemoveMatchSignal(
+		dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMSettingsPath)),
+		dbus.WithMatchInterface(dbusNMSettingsInterface),
+		dbus.WithMatchMember("ConnectionRemoved"),
+	)
+	b.dbusConn.RemoveMatchSignal(
+		dbus.WithMatchPathNamespace(dbus.ObjectPath(dbusNMSettingsPath)),
+		dbus.WithMatchInterface(dbusNMSettingsConnectionInterface),
+		dbus.WithMatchMember("Updated"),
+	)
+	b.dbusConn.RemoveMatchSignal(
+		dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMPath)),
+		dbus.WithMatchInterface(dbusNMInterface),
+		dbus.WithMatchMember("DeviceAdded"),
+	)
+	b.dbusConn.RemoveMatchSignal(
+		dbus.WithMatchObjectPath(dbus.ObjectPath(dbusNMPath)),
+		dbus.WithMatchInterface(dbusNMInterface),
+		dbus.WithMatchMember("DeviceRemoved"),
+	)
+
 	for _, info := range b.wifiDevices {
 		b.dbusConn.RemoveMatchSignal(
 			dbus.WithMatchObjectPath(dbus.ObjectPath(info.device.GetPath())),
@@ -164,9 +221,13 @@ func (b *NetworkManagerBackend) stopSignalPump() {
 }
 
 func (b *NetworkManagerBackend) handleDBusSignal(sig *dbus.Signal) {
-	if sig.Name == "org.freedesktop.NetworkManager.Settings.NewConnection" ||
+	if sig.Name == dbusNMSettingsInterface+".NewConnection" ||
-		sig.Name == "org.freedesktop.NetworkManager.Settings.ConnectionRemoved" {
+		sig.Name == dbusNMSettingsInterface+".ConnectionRemoved" ||
+		sig.Name == dbusNMSettingsConnectionInterface+".Updated" {
 		b.ListVPNProfiles()
+		if err := b.updateSavedWiFiNetworks(); err != nil {
+			b.updateWiFiNetworks()
+		}
 		if b.onStateChange != nil {
 			b.onStateChange()
 		}

core/internal/server/network/backend_networkmanager_wifi.go

@@ -225,24 +225,14 @@ func (b *NetworkManagerBackend) GetWiFiQRCodeContent(ssid string) (string, error
 		return "", fmt.Errorf("failed to identify security type of network `%s`", ssid)
 	}
 
-	var securityType string
 	switch keyMgmt {
 	case "none":
-		authAlg, _ := secSettings["auth-alg"].(string)
+		return "", fmt.Errorf("QR code generation only supports WPA-PSK connections, `%s` is open or WEP", ssid)
-		switch authAlg {
-		case "open":
-			securityType = "nopass"
-		default:
-			securityType = "WEP"
-		}
 	case "ieee8021x":
-		securityType = "WEP"
+		return "", fmt.Errorf("QR code generation only supports WPA-PSK connections, `%s` is enterprise", ssid)
+	case "wpa-psk", "sae", "wpa-psk-sae":
 	default:
-		securityType = "WPA"
+		return "", fmt.Errorf("QR code generation only supports WPA-PSK connections, `%s` uses %s", ssid, keyMgmt)
-	}
-
-	if securityType != "WPA" {
-		return "", fmt.Errorf("QR code generation only supports WPA connections, `%s` uses %s", ssid, securityType)
 	}
 
 	var psk string
@@ -276,7 +266,7 @@ func (b *NetworkManagerBackend) GetWiFiQRCodeContent(ssid string) (string, error
 		return "", fmt.Errorf("failed to retrieve password for `%s`", ssid)
 	}
 
-	return FormatWiFiQRString(securityType, ssid, psk), nil
+	return FormatWiFiQRString("WPA", ssid, psk), nil
 }
 
 func (b *NetworkManagerBackend) ConnectWiFi(req ConnectionRequest) error {
@@ -405,6 +395,74 @@ func (b *NetworkManagerBackend) ForgetWiFiNetwork(ssid string) error {
 	return nil
 }
 
+func getSavedWiFiProfiles(connections []gonetworkmanager.Connection) map[string]savedWiFiProfile {
+	profiles := make(map[string]savedWiFiProfile)
+
+	for _, conn := range connections {
+		connSettings, err := conn.GetSettings()
+		if err != nil {
+			continue
+		}
+
+		connMeta, ok := connSettings["connection"]
+		if !ok {
+			continue
+		}
+
+		connType, ok := connMeta["type"].(string)
+		if !ok || connType != "802-11-wireless" {
+			continue
+		}
+
+		wifiSettings, ok := connSettings["802-11-wireless"]
+		if !ok {
+			continue
+		}
+
+		ssidBytes, ok := wifiSettings["ssid"].([]byte)
+		if !ok || len(ssidBytes) == 0 {
+			continue
+		}
+
+		ssid := string(ssidBytes)
+		profile := savedWiFiProfile{
+			Autoconnect: true,
+			Mode:        "infrastructure",
+		}
+
+		if ac, ok := connMeta["autoconnect"].(bool); ok {
+			profile.Autoconnect = ac
+		}
+		if hidden, ok := wifiSettings["hidden"].(bool); ok {
+			profile.Hidden = hidden
+		}
+		if mode, ok := wifiSettings["mode"].(string); ok && mode != "" {
+			profile.Mode = mode
+		}
+		if _, ok := connSettings["802-11-wireless-security"]; ok {
+			profile.Secured = true
+		}
+		if _, ok := connSettings["802-1x"]; ok {
+			profile.Enterprise = true
+			profile.Secured = true
+		}
+
+		if existing, ok := profiles[ssid]; ok {
+			profile.Autoconnect = profile.Autoconnect || existing.Autoconnect
+			profile.Hidden = profile.Hidden || existing.Hidden
+			profile.Secured = profile.Secured || existing.Secured
+			profile.Enterprise = profile.Enterprise || existing.Enterprise
+			if profile.Mode == "" {
+				profile.Mode = existing.Mode
+			}
+		}
+
+		profiles[ssid] = profile
+	}
+
+	return profiles
+}
+
 func (b *NetworkManagerBackend) IsConnectingTo(ssid string) bool {
 	b.stateMutex.RLock()
 	defer b.stateMutex.RUnlock()
@@ -442,47 +500,7 @@ func (b *NetworkManagerBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 		return nil, fmt.Errorf("failed to get connections: %w", err)
 	}
 
-	savedSSIDs := make(map[string]bool)
+	savedProfiles := getSavedWiFiProfiles(connections)
-	autoconnectMap := make(map[string]bool)
-	hiddenSSIDs := make(map[string]bool)
-	for _, conn := range connections {
-		connSettings, err := conn.GetSettings()
-		if err != nil {
-			continue
-		}
-
-		connMeta, ok := connSettings["connection"]
-		if !ok {
-			continue
-		}
-
-		connType, ok := connMeta["type"].(string)
-		if !ok || connType != "802-11-wireless" {
-			continue
-		}
-
-		wifiSettings, ok := connSettings["802-11-wireless"]
-		if !ok {
-			continue
-		}
-
-		ssidBytes, ok := wifiSettings["ssid"].([]byte)
-		if !ok {
-			continue
-		}
-
-		ssid := string(ssidBytes)
-		savedSSIDs[ssid] = true
-		autoconnect := true
-		if ac, ok := connMeta["autoconnect"].(bool); ok {
-			autoconnect = ac
-		}
-		autoconnectMap[ssid] = autoconnect
-
-		if hidden, ok := wifiSettings["hidden"].(bool); ok && hidden {
-			hiddenSSIDs[ssid] = true
-		}
-	}
 
 	b.stateMutex.RLock()
 	currentSSID := b.state.WiFiSSID
@@ -491,8 +509,8 @@ func (b *NetworkManagerBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 	wifiBSSID := b.state.WiFiBSSID
 	b.stateMutex.RUnlock()
 
-	seenSSIDs := make(map[string]*WiFiNetwork)
+	seenSSIDs := make(map[string]int)
-	networks := []WiFiNetwork{}
+	networks := make([]WiFiNetwork, 0, len(apPaths)+1)
 
 	for _, ap := range apPaths {
 		ssid, err := ap.GetPropertySSID()
@@ -500,7 +518,8 @@ func (b *NetworkManagerBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 			continue
 		}
 
-		if existing, exists := seenSSIDs[ssid]; exists {
+		if existingIndex, exists := seenSSIDs[ssid]; exists {
+			existing := &networks[existingIndex]
 			strength, _ := ap.GetPropertyStrength()
 			if strength > existing.Signal {
 				existing.Signal = strength
@@ -550,6 +569,7 @@ func (b *NetworkManagerBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 			}
 		}
 
+		profile, saved := savedProfiles[ssid]
 		network := WiFiNetwork{
 			SSID:        ssid,
 			BSSID:       bssid,
@@ -557,45 +577,86 @@ func (b *NetworkManagerBackend) updateWiFiNetworks() ([]WiFiNetwork, error) {
 			Secured:     secured,
 			Enterprise:  enterprise,
 			Connected:   isConnected,
-			Saved:       savedSSIDs[ssid],
+			Saved:       saved,
-			Autoconnect: autoconnectMap[ssid],
+			Autoconnect: profile.Autoconnect,
-			Hidden:      hiddenSSIDs[ssid],
+			Hidden:      profile.Hidden,
 			Frequency:   freq,
 			Mode:        modeStr,
 			Rate:        rate,
 			Channel:     channel,
 		}
 
-		seenSSIDs[ssid] = &network
 		networks = append(networks, network)
+		seenSSIDs[ssid] = len(networks) - 1
 	}
 
 	if wifiConnected && currentSSID != "" {
 		if _, exists := seenSSIDs[currentSSID]; !exists {
+			profile, saved := savedProfiles[currentSSID]
 			hiddenNetwork := WiFiNetwork{
 				SSID:        currentSSID,
 				BSSID:       wifiBSSID,
 				Signal:      wifiSignal,
 				Secured:     true,
 				Connected:   true,
-				Saved:       savedSSIDs[currentSSID],
+				Saved:       saved,
-				Autoconnect: autoconnectMap[currentSSID],
+				Autoconnect: profile.Autoconnect,
 				Hidden:      true,
 				Mode:        "infrastructure",
 			}
 			networks = append(networks, hiddenNetwork)
+			seenSSIDs[currentSSID] = len(networks) - 1
 		}
 	}
 
+	visibleNetworks := wiFiNetworksBySSID(networks, true)
+	savedNetworks := savedWiFiNetworksFromProfiles(savedProfiles, visibleNetworks, currentSSID, wifiConnected)
+
 	sortWiFiNetworks(networks)
 
 	b.stateMutex.Lock()
 	b.state.WiFiNetworks = networks
+	b.state.SavedWiFiNetworks = savedNetworks
 	b.stateMutex.Unlock()
 
 	return networks, nil
 }
 
+func (b *NetworkManagerBackend) updateSavedWiFiNetworks() error {
+	s := b.settings
+	if s == nil {
+		var err error
+		s, err = gonetworkmanager.NewSettings()
+		if err != nil {
+			return fmt.Errorf("failed to get settings: %w", err)
+		}
+		b.settings = s
+	}
+
+	settingsMgr := s.(gonetworkmanager.Settings)
+	connections, err := settingsMgr.ListConnections()
+	if err != nil {
+		return fmt.Errorf("failed to get connections: %w", err)
+	}
+
+	savedProfiles := getSavedWiFiProfiles(connections)
+
+	b.stateMutex.RLock()
+	currentSSID := b.state.WiFiSSID
+	wifiConnected := b.state.WiFiConnected
+	wifiNetworks := append([]WiFiNetwork(nil), b.state.WiFiNetworks...)
+	b.stateMutex.RUnlock()
+
+	wifiNetworks, savedNetworks := refreshSavedWiFiState(wifiNetworks, savedProfiles, currentSSID, wifiConnected)
+
+	b.stateMutex.Lock()
+	b.state.WiFiNetworks = wifiNetworks
+	b.state.SavedWiFiNetworks = savedNetworks
+	b.stateMutex.Unlock()
+
+	return nil
+}
+
 func (b *NetworkManagerBackend) findConnection(ssid string) (gonetworkmanager.Connection, error) {
 	s := b.settings
 	if s == nil {
@@ -975,49 +1036,14 @@ func (b *NetworkManagerBackend) updateAllWiFiDevices() {
 		return
 	}
 
-	savedSSIDs := make(map[string]bool)
+	savedProfiles := getSavedWiFiProfiles(connections)
-	autoconnectMap := make(map[string]bool)
-	hiddenSSIDs := make(map[string]bool)
-	for _, conn := range connections {
-		connSettings, err := conn.GetSettings()
-		if err != nil {
-			continue
-		}
-
-		connMeta, ok := connSettings["connection"]
-		if !ok {
-			continue
-		}
-
-		connType, ok := connMeta["type"].(string)
-		if !ok || connType != "802-11-wireless" {
-			continue
-		}
-
-		wifiSettings, ok := connSettings["802-11-wireless"]
-		if !ok {
-			continue
-		}
-
-		ssidBytes, ok := wifiSettings["ssid"].([]byte)
-		if !ok {
-			continue
-		}
-
-		ssid := string(ssidBytes)
-		savedSSIDs[ssid] = true
-		autoconnect := true
-		if ac, ok := connMeta["autoconnect"].(bool); ok {
-			autoconnect = ac
-		}
-		autoconnectMap[ssid] = autoconnect
-
-		if hidden, ok := wifiSettings["hidden"].(bool); ok && hidden {
-			hiddenSSIDs[ssid] = true
-		}
-	}
 
 	var devices []WiFiDevice
+	visibleNetworks := make(map[string]WiFiNetwork)
+	b.stateMutex.RLock()
+	currentSSID := b.state.WiFiSSID
+	wifiConnected := b.state.WiFiConnected
+	b.stateMutex.RUnlock()
 
 	for name, devInfo := range b.wifiDevices {
 		state, _ := devInfo.device.GetPropertyState()
@@ -1050,14 +1076,16 @@ func (b *NetworkManagerBackend) updateAllWiFiDevices() {
 		apPaths, err := devInfo.wireless.GetAccessPoints()
 		var networks []WiFiNetwork
 		if err == nil {
-			seenSSIDs := make(map[string]*WiFiNetwork)
+			seenSSIDs := make(map[string]int)
+			networks = make([]WiFiNetwork, 0, len(apPaths)+1)
 			for _, ap := range apPaths {
 				apSSID, err := ap.GetPropertySSID()
 				if err != nil || apSSID == "" {
 					continue
 				}
 
-				if existing, exists := seenSSIDs[apSSID]; exists {
+				if existingIndex, exists := seenSSIDs[apSSID]; exists {
+					existing := &networks[existingIndex]
 					strength, _ := ap.GetPropertyStrength()
 					if strength > existing.Signal {
 						existing.Signal = strength
@@ -1107,6 +1135,7 @@ func (b *NetworkManagerBackend) updateAllWiFiDevices() {
 					}
 				}
 
+				profile, saved := savedProfiles[apSSID]
 				network := WiFiNetwork{
 					SSID:        apSSID,
 					BSSID:       apBSSID,
@@ -1114,9 +1143,9 @@ func (b *NetworkManagerBackend) updateAllWiFiDevices() {
 					Secured:     secured,
 					Enterprise:  enterprise,
 					Connected:   isConnected,
-					Saved:       savedSSIDs[apSSID],
+					Saved:       saved,
-					Autoconnect: autoconnectMap[apSSID],
+					Autoconnect: profile.Autoconnect,
-					Hidden:      hiddenSSIDs[apSSID],
+					Hidden:      profile.Hidden,
 					Frequency:   freq,
 					Mode:        modeStr,
 					Rate:        rate,
@@ -1124,25 +1153,31 @@ func (b *NetworkManagerBackend) updateAllWiFiDevices() {
 					Device:      name,
 				}
 
-				seenSSIDs[apSSID] = &network
 				networks = append(networks, network)
+				seenSSIDs[apSSID] = len(networks) - 1
+				if existing, ok := visibleNetworks[apSSID]; !ok || network.Signal > existing.Signal {
+					visibleNetworks[apSSID] = network
+				}
 			}
 
 			if connected && ssid != "" {
 				if _, exists := seenSSIDs[ssid]; !exists {
+					profile, saved := savedProfiles[ssid]
 					hiddenNetwork := WiFiNetwork{
 						SSID:        ssid,
 						BSSID:       bssid,
 						Signal:      signal,
 						Secured:     true,
 						Connected:   true,
-						Saved:       savedSSIDs[ssid],
+						Saved:       saved,
-						Autoconnect: autoconnectMap[ssid],
+						Autoconnect: profile.Autoconnect,
 						Hidden:      true,
 						Mode:        "infrastructure",
 						Device:      name,
 					}
 					networks = append(networks, hiddenNetwork)
+					seenSSIDs[ssid] = len(networks) - 1
+					visibleNetworks[ssid] = hiddenNetwork
 				}
 			}
 
@@ -1168,6 +1203,7 @@ func (b *NetworkManagerBackend) updateAllWiFiDevices() {
 
 	b.stateMutex.Lock()
 	b.state.WiFiDevices = devices
+	b.state.SavedWiFiNetworks = savedWiFiNetworksFromProfiles(savedProfiles, visibleNetworks, currentSSID, wifiConnected)
 	b.stateMutex.Unlock()
 }
 

core/internal/server/network/backend_networkmanager_wifi_test.go

@@ -4,6 +4,7 @@ import (
 	"testing"
 
 	mock_gonetworkmanager "github.com/AvengeMedia/DankMaterialShell/core/internal/mocks/github.com/Wifx/gonetworkmanager/v2"
+	"github.com/Wifx/gonetworkmanager/v2"
 	"github.com/stretchr/testify/assert"
 )
 
@@ -176,6 +177,54 @@ func TestNetworkManagerBackend_UpdateWiFiNetworks_NoDevice(t *testing.T) {
 	assert.Contains(t, err.Error(), "no WiFi device available")
 }
 
+func TestNetworkManagerBackend_UpdateSavedWiFiNetworksPreservesVisibleSavedNetworks(t *testing.T) {
+	mockNM := mock_gonetworkmanager.NewMockNetworkManager(t)
+	mockSettings := mock_gonetworkmanager.NewMockSettings(t)
+	mockConn := mock_gonetworkmanager.NewMockConnection(t)
+
+	backend, err := NewNetworkManagerBackend(mockNM)
+	assert.NoError(t, err)
+	backend.settings = mockSettings
+
+	backend.stateMutex.Lock()
+	backend.state.WiFiNetworks = []WiFiNetwork{
+		{
+			SSID:   "Home",
+			Signal: 76,
+		},
+	}
+	backend.stateMutex.Unlock()
+
+	settings := gonetworkmanager.ConnectionSettings{
+		"connection": {
+			"type":        "802-11-wireless",
+			"autoconnect": true,
+		},
+		"802-11-wireless": {
+			"ssid": []byte("Home"),
+		},
+		"802-11-wireless-security": {},
+	}
+	mockSettings.EXPECT().ListConnections().Return([]gonetworkmanager.Connection{mockConn}, nil)
+	mockConn.EXPECT().GetSettings().Return(settings, nil)
+
+	err = backend.updateSavedWiFiNetworks()
+	assert.NoError(t, err)
+
+	backend.stateMutex.RLock()
+	savedNetworks := append([]WiFiNetwork(nil), backend.state.SavedWiFiNetworks...)
+	wifiNetworks := append([]WiFiNetwork(nil), backend.state.WiFiNetworks...)
+	backend.stateMutex.RUnlock()
+
+	assert.Len(t, wifiNetworks, 1)
+	assert.True(t, wifiNetworks[0].Saved)
+	assert.Len(t, savedNetworks, 1)
+	assert.Equal(t, "Home", savedNetworks[0].SSID)
+	assert.True(t, savedNetworks[0].Saved)
+	assert.False(t, savedNetworks[0].OutOfRange)
+	assert.Equal(t, uint8(76), savedNetworks[0].Signal)
+}
+
 func TestNetworkManagerBackend_FindConnection_NoSettings(t *testing.T) {
 	mockNM := mock_gonetworkmanager.NewMockNetworkManager(t)
 

core/internal/server/network/manager.go

@@ -64,9 +64,10 @@ func NewManager() (*Manager, error) {
 	m := &Manager{
 		backend: backend,
 		state: &NetworkState{
-			NetworkStatus: StatusDisconnected,
+			NetworkStatus:     StatusDisconnected,
-			Preference:    PreferenceAuto,
+			Preference:        PreferenceAuto,
-			WiFiNetworks:  []WiFiNetwork{},
+			WiFiNetworks:      []WiFiNetwork{},
+			SavedWiFiNetworks: []WiFiNetwork{},
 		},
 		stateMutex: sync.RWMutex{},
 
@@ -120,6 +121,7 @@ func (m *Manager) syncStateFromBackend() error {
 	m.state.WiFiBSSID = backendState.WiFiBSSID
 	m.state.WiFiSignal = backendState.WiFiSignal
 	m.state.WiFiNetworks = backendState.WiFiNetworks
+	m.state.SavedWiFiNetworks = backendState.SavedWiFiNetworks
 	m.state.WiFiDevices = backendState.WiFiDevices
 	m.state.WiredConnections = backendState.WiredConnections
 	m.state.VPNProfiles = backendState.VPNProfiles
@@ -156,6 +158,7 @@ func (m *Manager) snapshotState() NetworkState {
 	defer m.stateMutex.RUnlock()
 	s := *m.state
 	s.WiFiNetworks = append([]WiFiNetwork(nil), m.state.WiFiNetworks...)
+	s.SavedWiFiNetworks = append([]WiFiNetwork(nil), m.state.SavedWiFiNetworks...)
 	s.WiFiDevices = append([]WiFiDevice(nil), m.state.WiFiDevices...)
 	s.WiredConnections = append([]WiredConnection(nil), m.state.WiredConnections...)
 	s.EthernetDevices = append([]EthernetDevice(nil), m.state.EthernetDevices...)
@@ -211,6 +214,9 @@ func stateChangedMeaningfully(old, new *NetworkState) bool {
 	if len(old.WiFiNetworks) != len(new.WiFiNetworks) {
 		return true
 	}
+	if len(old.SavedWiFiNetworks) != len(new.SavedWiFiNetworks) {
+		return true
+	}
 	if len(old.WiFiDevices) != len(new.WiFiDevices) {
 		return true
 	}
@@ -238,6 +244,23 @@ func stateChangedMeaningfully(old, new *NetworkState) bool {
 		}
 	}
 
+	for i := range old.SavedWiFiNetworks {
+		oldNet := &old.SavedWiFiNetworks[i]
+		newNet := &new.SavedWiFiNetworks[i]
+		if oldNet.SSID != newNet.SSID {
+			return true
+		}
+		if oldNet.Connected != newNet.Connected {
+			return true
+		}
+		if oldNet.Autoconnect != newNet.Autoconnect {
+			return true
+		}
+		if oldNet.OutOfRange != newNet.OutOfRange {
+			return true
+		}
+	}
+
 	for i := range old.WiredConnections {
 		oldNet := &old.WiredConnections[i]
 		newNet := &new.WiredConnections[i]

core/internal/server/network/types.go

@@ -34,6 +34,7 @@ type WiFiNetwork struct {
 	Saved       bool   `json:"saved"`
 	Autoconnect bool   `json:"autoconnect"`
 	Hidden      bool   `json:"hidden"`
+	OutOfRange  bool   `json:"outOfRange"`
 	Frequency   uint32 `json:"frequency"`
 	Mode        string `json:"mode"`
 	Rate        uint32 `json:"rate"`
@@ -111,6 +112,7 @@ type NetworkState struct {
 	WiFiBSSID              string               `json:"wifiBSSID"`
 	WiFiSignal             uint8                `json:"wifiSignal"`
 	WiFiNetworks           []WiFiNetwork        `json:"wifiNetworks"`
+	SavedWiFiNetworks      []WiFiNetwork        `json:"savedWifiNetworks"`
 	WiFiDevices            []WiFiDevice         `json:"wifiDevices"`
 	WiredConnections       []WiredConnection    `json:"wiredConnections"`
 	VPNProfiles            []VPNProfile         `json:"vpnProfiles"`

core/internal/server/network/wifi_saved.go

@@ -0,0 +1,103 @@
+package network
+
+import "sort"
+
+type savedWiFiProfile struct {
+	Autoconnect bool
+	Hidden      bool
+	Secured     bool
+	Enterprise  bool
+	Mode        string
+}
+
+// Saved WiFi state is keyed by SSID because the UI/API accepts SSID actions.
+// Multiple backend profiles for the same SSID are intentionally collapsed here.
+func mergeSavedProfilesIntoWiFiNetworks(networks []WiFiNetwork, profiles map[string]savedWiFiProfile, currentSSID string, wifiConnected bool) []WiFiNetwork {
+	merged := make([]WiFiNetwork, len(networks))
+	for i, network := range networks {
+		profile, saved := profiles[network.SSID]
+		network.Connected = wifiConnected && network.SSID == currentSSID
+		network.Saved = saved
+		if saved {
+			network.Autoconnect = profile.Autoconnect
+			network.Hidden = network.Hidden || profile.Hidden
+			network.Secured = network.Secured || profile.Secured
+			network.Enterprise = network.Enterprise || profile.Enterprise
+			if network.Mode == "" {
+				network.Mode = profile.Mode
+			}
+		} else {
+			network.Autoconnect = false
+		}
+		merged[i] = network
+	}
+	return merged
+}
+
+func wiFiNetworksBySSID(networks []WiFiNetwork, visibleOnly bool) map[string]WiFiNetwork {
+	visible := make(map[string]WiFiNetwork, len(networks))
+	for _, network := range networks {
+		if visibleOnly && network.OutOfRange {
+			continue
+		}
+		visible[network.SSID] = network
+	}
+	return visible
+}
+
+func refreshSavedWiFiState(networks []WiFiNetwork, profiles map[string]savedWiFiProfile, currentSSID string, wifiConnected bool) ([]WiFiNetwork, []WiFiNetwork) {
+	mergedNetworks := mergeSavedProfilesIntoWiFiNetworks(networks, profiles, currentSSID, wifiConnected)
+	visibleNetworks := wiFiNetworksBySSID(mergedNetworks, true)
+	savedNetworks := savedWiFiNetworksFromProfiles(profiles, visibleNetworks, currentSSID, wifiConnected)
+	return mergedNetworks, savedNetworks
+}
+
+func savedWiFiNetworksFromProfiles(profiles map[string]savedWiFiProfile, visible map[string]WiFiNetwork, currentSSID string, wifiConnected bool) []WiFiNetwork {
+	networks := make([]WiFiNetwork, 0, len(profiles))
+	for ssid, profile := range profiles {
+		if network, ok := visible[ssid]; ok {
+			network.Saved = true
+			network.Autoconnect = profile.Autoconnect
+			network.Hidden = network.Hidden || profile.Hidden
+			network.Secured = network.Secured || profile.Secured
+			network.Enterprise = network.Enterprise || profile.Enterprise
+			network.OutOfRange = false
+			if network.Mode == "" {
+				network.Mode = profile.Mode
+			}
+			networks = append(networks, network)
+			continue
+		}
+
+		isConnected := wifiConnected && ssid == currentSSID
+		networks = append(networks, WiFiNetwork{
+			SSID:        ssid,
+			Secured:     profile.Secured,
+			Enterprise:  profile.Enterprise,
+			Connected:   isConnected,
+			Saved:       true,
+			Autoconnect: profile.Autoconnect,
+			Hidden:      profile.Hidden,
+			OutOfRange:  !isConnected,
+			Mode:        profile.Mode,
+		})
+	}
+
+	sort.Slice(networks, func(i, j int) bool {
+		if networks[i].Connected && !networks[j].Connected {
+			return true
+		}
+		if !networks[i].Connected && networks[j].Connected {
+			return false
+		}
+		if networks[i].OutOfRange != networks[j].OutOfRange {
+			return !networks[i].OutOfRange
+		}
+		if networks[i].Signal != networks[j].Signal {
+			return networks[i].Signal > networks[j].Signal
+		}
+		return networks[i].SSID < networks[j].SSID
+	})
+
+	return networks
+}

core/internal/server/network/wifi_saved_test.go

@@ -0,0 +1,170 @@
+package network
+
+import (
+	"testing"
+
+	"github.com/stretchr/testify/assert"
+)
+
+func TestMergeSavedProfilesIntoWiFiNetworks(t *testing.T) {
+	networks := []WiFiNetwork{
+		{
+			SSID:        "Home",
+			Signal:      80,
+			Secured:     false,
+			Autoconnect: false,
+		},
+		{
+			SSID:        "Cafe",
+			Signal:      50,
+			Secured:     false,
+			Autoconnect: true,
+		},
+	}
+	profiles := map[string]savedWiFiProfile{
+		"Home": {
+			Autoconnect: true,
+			Hidden:      true,
+			Secured:     true,
+			Mode:        "infrastructure",
+		},
+	}
+
+	merged := mergeSavedProfilesIntoWiFiNetworks(networks, profiles, "Home", true)
+
+	assert.Len(t, merged, 2)
+	assert.Equal(t, "Home", merged[0].SSID)
+	assert.True(t, merged[0].Connected)
+	assert.True(t, merged[0].Saved)
+	assert.True(t, merged[0].Autoconnect)
+	assert.True(t, merged[0].Hidden)
+	assert.True(t, merged[0].Secured)
+	assert.Equal(t, "infrastructure", merged[0].Mode)
+
+	assert.Equal(t, "Cafe", merged[1].SSID)
+	assert.False(t, merged[1].Saved)
+	assert.False(t, merged[1].Autoconnect)
+}
+
+func TestSavedWiFiNetworksFromProfilesOutOfRangeWithoutVisibleNetworks(t *testing.T) {
+	profiles := map[string]savedWiFiProfile{
+		"Home": {
+			Autoconnect: true,
+			Secured:     true,
+			Mode:        "infrastructure",
+		},
+	}
+
+	networks := savedWiFiNetworksFromProfiles(profiles, nil, "", false)
+
+	assert.Len(t, networks, 1)
+	assert.Equal(t, "Home", networks[0].SSID)
+	assert.True(t, networks[0].Saved)
+	assert.True(t, networks[0].OutOfRange)
+	assert.Equal(t, uint8(0), networks[0].Signal)
+}
+
+func TestSavedWiFiNetworksFromProfilesKeepsConnectedCurrentNetworkInRange(t *testing.T) {
+	profiles := map[string]savedWiFiProfile{
+		"Home": {
+			Autoconnect: true,
+			Secured:     true,
+		},
+	}
+
+	networks := savedWiFiNetworksFromProfiles(profiles, nil, "Home", true)
+
+	assert.Len(t, networks, 1)
+	assert.Equal(t, "Home", networks[0].SSID)
+	assert.True(t, networks[0].Connected)
+	assert.False(t, networks[0].OutOfRange)
+}
+
+func TestSavedWiFiNetworksFromProfilesIncludesOutOfRange(t *testing.T) {
+	profiles := map[string]savedWiFiProfile{
+		"Home": {
+			Autoconnect: true,
+			Hidden:      true,
+			Secured:     true,
+			Mode:        "infrastructure",
+		},
+		"Office": {
+			Autoconnect: false,
+			Secured:     true,
+			Enterprise:  true,
+			Mode:        "infrastructure",
+		},
+	}
+	visible := map[string]WiFiNetwork{
+		"Home": {
+			SSID:      "Home",
+			Signal:    72,
+			Secured:   true,
+			Connected: true,
+		},
+	}
+
+	networks := savedWiFiNetworksFromProfiles(profiles, visible, "Home", true)
+
+	assert.Len(t, networks, 2)
+	assert.Equal(t, "Home", networks[0].SSID)
+	assert.True(t, networks[0].Saved)
+	assert.True(t, networks[0].Connected)
+	assert.False(t, networks[0].OutOfRange)
+	assert.True(t, networks[0].Hidden)
+	assert.Equal(t, uint8(72), networks[0].Signal)
+
+	assert.Equal(t, "Office", networks[1].SSID)
+	assert.True(t, networks[1].Saved)
+	assert.False(t, networks[1].Autoconnect)
+	assert.True(t, networks[1].Enterprise)
+	assert.True(t, networks[1].OutOfRange)
+}
+
+func TestWiFiNetworksBySSIDVisibleOnlySkipsOutOfRange(t *testing.T) {
+	visible := wiFiNetworksBySSID([]WiFiNetwork{
+		{SSID: "Home", Signal: 70},
+		{SSID: "Office", Signal: 0, OutOfRange: true},
+	}, true)
+
+	assert.Contains(t, visible, "Home")
+	assert.NotContains(t, visible, "Office")
+}
+
+func TestRefreshSavedWiFiStatePreservesVisibleSavedNetworks(t *testing.T) {
+	networks := []WiFiNetwork{
+		{
+			SSID:   "Home",
+			Signal: 82,
+		},
+	}
+	profiles := map[string]savedWiFiProfile{
+		"Home": {
+			Autoconnect: true,
+			Secured:     true,
+			Mode:        "infrastructure",
+		},
+		"Office": {
+			Autoconnect: false,
+			Secured:     true,
+			Mode:        "infrastructure",
+		},
+	}
+
+	mergedNetworks, savedNetworks := refreshSavedWiFiState(networks, profiles, "", false)
+
+	assert.Len(t, mergedNetworks, 1)
+	assert.Equal(t, "Home", mergedNetworks[0].SSID)
+	assert.True(t, mergedNetworks[0].Saved)
+	assert.True(t, mergedNetworks[0].Autoconnect)
+
+	assert.Len(t, savedNetworks, 2)
+	assert.Equal(t, "Home", savedNetworks[0].SSID)
+	assert.True(t, savedNetworks[0].Saved)
+	assert.False(t, savedNetworks[0].OutOfRange)
+	assert.Equal(t, uint8(82), savedNetworks[0].Signal)
+
+	assert.Equal(t, "Office", savedNetworks[1].SSID)
+	assert.True(t, savedNetworks[1].Saved)
+	assert.True(t, savedNetworks[1].OutOfRange)
+}

core/internal/server/server.go

@@ -38,7 +38,7 @@ import (
 	"github.com/AvengeMedia/DankMaterialShell/core/pkg/syncmap"
 )
 
-const APIVersion = 25
+const APIVersion = 26
 
 var CLIVersion = "dev"
 

core/internal/server/tailscale/client.go

@@ -66,16 +66,17 @@ func convertPeerStatus(ps *ipnstate.PeerStatus, users map[tailcfg.UserID]tailcfg
 	}
 
 	peer := Peer{
-		ID:       string(ps.ID),
+		ID:             string(ps.ID),
-		Hostname: hostname,
+		Hostname:       hostname,
-		DNSName:  dnsName,
+		DNSName:        dnsName,
-		OS:       ps.OS,
+		OS:             ps.OS,
-		Online:   ps.Online,
+		Online:         ps.Online,
-		Active:   ps.Active,
+		Active:         ps.Active,
-		ExitNode: ps.ExitNode,
+		ExitNode:       ps.ExitNode,
-		Relay:    ps.Relay,
+		ExitNodeOption: ps.ExitNodeOption,
-		RxBytes:  ps.RxBytes,
+		Relay:          ps.Relay,
-		TxBytes:  ps.TxBytes,
+		RxBytes:        ps.RxBytes,
+		TxBytes:        ps.TxBytes,
 	}
 
 	for _, ip := range ps.TailscaleIPs {

core/internal/server/tailscale/handlers.go

@@ -14,6 +14,14 @@ func HandleRequest(conn net.Conn, req models.Request, manager *Manager) {
 		handleGetStatus(conn, req, manager)
 	case "tailscale.refresh":
 		handleRefresh(conn, req, manager)
+	case "tailscale.connect":
+		handleConnect(conn, req, manager)
+	case "tailscale.disconnect":
+		handleDisconnect(conn, req, manager)
+	case "tailscale.setExitNode":
+		handleSetExitNode(conn, req, manager)
+	case "tailscale.setAllowLanAccess":
+		handleSetAllowLanAccess(conn, req, manager)
 	default:
 		models.RespondError(conn, req.ID, fmt.Sprintf("unknown method: %s", req.Method))
 	}
@@ -28,3 +36,37 @@ func handleRefresh(conn net.Conn, req models.Request, manager *Manager) {
 	manager.RefreshState()
 	models.Respond(conn, req.ID, models.SuccessResult{Success: true, Message: "refreshed"})
 }
+
+func handleConnect(conn net.Conn, req models.Request, manager *Manager) {
+	if err := manager.Connect(); err != nil {
+		models.RespondError(conn, req.ID, err.Error())
+		return
+	}
+	models.Respond(conn, req.ID, models.SuccessResult{Success: true, Message: "connected"})
+}
+
+func handleDisconnect(conn net.Conn, req models.Request, manager *Manager) {
+	if err := manager.Disconnect(); err != nil {
+		models.RespondError(conn, req.ID, err.Error())
+		return
+	}
+	models.Respond(conn, req.ID, models.SuccessResult{Success: true, Message: "disconnected"})
+}
+
+func handleSetExitNode(conn net.Conn, req models.Request, manager *Manager) {
+	id := models.GetOr(req, "id", "")
+	if err := manager.SetExitNode(id); err != nil {
+		models.RespondError(conn, req.ID, err.Error())
+		return
+	}
+	models.Respond(conn, req.ID, models.SuccessResult{Success: true, Message: "exit node updated"})
+}
+
+func handleSetAllowLanAccess(conn net.Conn, req models.Request, manager *Manager) {
+	enabled := models.GetOr(req, "enabled", false)
+	if err := manager.SetAllowLANAccess(enabled); err != nil {
+		models.RespondError(conn, req.ID, err.Error())
+		return
+	}
+	models.Respond(conn, req.ID, models.SuccessResult{Success: true, Message: "lan access updated"})
+}

core/internal/server/tailscale/handlers_test.go

@@ -4,6 +4,7 @@ import (
 	"bytes"
 	"context"
 	"encoding/json"
+	"fmt"
 	"net"
 	"testing"
 	"time"
@@ -78,6 +79,63 @@ func TestHandleRefresh(t *testing.T) {
 	assert.True(t, resp.Result.Success)
 }
 
+func TestHandleActions(t *testing.T) {
+	cases := []struct {
+		name   string
+		method string
+		params map[string]any
+	}{
+		{"connect", "tailscale.connect", nil},
+		{"disconnect", "tailscale.disconnect", nil},
+		{"setExitNode", "tailscale.setExitNode", map[string]any{"id": "nABC123"}},
+		{"clearExitNode", "tailscale.setExitNode", map[string]any{"id": ""}},
+		{"setAllowLanAccess", "tailscale.setAllowLanAccess", map[string]any{"enabled": true}},
+	}
+
+	for _, tc := range cases {
+		t.Run(tc.name, func(t *testing.T) {
+			m := handlerTestManager()
+			defer m.Close()
+
+			buf := &bytes.Buffer{}
+			conn := &mockConn{Buffer: buf}
+
+			req := models.Request{ID: 1, Method: tc.method, Params: tc.params}
+			HandleRequest(conn, req, m)
+
+			var resp models.Response[models.SuccessResult]
+			require.NoError(t, json.NewDecoder(buf).Decode(&resp))
+			assert.Equal(t, 1, resp.ID)
+			assert.Empty(t, resp.Error)
+			require.NotNil(t, resp.Result)
+			assert.True(t, resp.Result.Success)
+		})
+	}
+}
+
+func TestHandleAction_BackendError(t *testing.T) {
+	client := &mockClient{
+		watchFn:  blockingWatch,
+		statusFn: func(ctx context.Context) (*ipnstate.Status, error) { return runningStatus(), nil },
+		editPrefsFn: func(ctx context.Context, mp *ipn.MaskedPrefs) (*ipn.Prefs, error) {
+			return nil, fmt.Errorf("backend rejected edit")
+		},
+	}
+	m := newManager(client)
+	defer m.Close()
+
+	buf := &bytes.Buffer{}
+	conn := &mockConn{Buffer: buf}
+
+	req := models.Request{ID: 1, Method: "tailscale.connect"}
+	HandleRequest(conn, req, m)
+
+	var resp models.Response[models.SuccessResult]
+	require.NoError(t, json.NewDecoder(buf).Decode(&resp))
+	assert.Nil(t, resp.Result)
+	assert.Contains(t, resp.Error, "backend rejected edit")
+}
+
 func TestHandleRequest_UnknownMethod(t *testing.T) {
 	m := handlerTestManager()
 	defer m.Close()

core/internal/server/tailscale/manager.go

@@ -11,6 +11,7 @@ import (
 	"tailscale.com/client/local"
 	"tailscale.com/ipn"
 	"tailscale.com/ipn/ipnstate"
+	"tailscale.com/tailcfg"
 )
 
 const (
@@ -22,6 +23,8 @@ const (
 type tailscaleClient interface {
 	WatchIPNBus(ctx context.Context, mask ipn.NotifyWatchOpt) (ipnBusWatcher, error)
 	Status(ctx context.Context) (*ipnstate.Status, error)
+	GetPrefs(ctx context.Context) (*ipn.Prefs, error)
+	EditPrefs(ctx context.Context, mp *ipn.MaskedPrefs) (*ipn.Prefs, error)
 }
 
 // ipnBusWatcher abstracts the IPN bus watcher for testing.
@@ -43,6 +46,14 @@ func (w *localClientWrapper) Status(ctx context.Context) (*ipnstate.Status, erro
 	return w.client.Status(ctx)
 }
 
+func (w *localClientWrapper) GetPrefs(ctx context.Context) (*ipn.Prefs, error) {
+	return w.client.GetPrefs(ctx)
+}
+
+func (w *localClientWrapper) EditPrefs(ctx context.Context, mp *ipn.MaskedPrefs) (*ipn.Prefs, error) {
+	return w.client.EditPrefs(ctx, mp)
+}
+
 // Manager manages Tailscale state via IPN bus events and subscriber notifications.
 type Manager struct {
 	state                *TailscaleState
@@ -169,16 +180,36 @@ func (m *Manager) fetchAndBroadcast(ctx context.Context) {
 	statusCtx, cancel := context.WithTimeout(ctx, statusTimeout)
 	defer cancel()
 
-	status, err := m.client.Status(statusCtx)
+	state, err := m.fetchState(statusCtx)
 	if err != nil {
 		log.Warnf("[Tailscale] Failed to fetch status: %v", err)
 		return
 	}
 
-	state := convertStatus(status)
 	m.updateState(state)
 }
 
+// fetchState fetches the current status and merges in pref-derived fields
+// (e.g. exit-node LAN access) that are not present in the IPN status itself.
+func (m *Manager) fetchState(ctx context.Context) (*TailscaleState, error) {
+	status, err := m.client.Status(ctx)
+	if err != nil {
+		return nil, err
+	}
+
+	state := convertStatus(status)
+
+	// Prefs carry the exit-node LAN-access toggle, which the status does not
+	// expose. Treat a prefs failure as non-fatal so status still updates.
+	if prefs, err := m.client.GetPrefs(ctx); err != nil {
+		log.Warnf("[Tailscale] Failed to fetch prefs: %v", err)
+	} else if prefs != nil {
+		state.ExitNodeAllowLANAccess = prefs.ExitNodeAllowLANAccess
+	}
+
+	return state, nil
+}
+
 func (m *Manager) updateState(state *TailscaleState) {
 	m.stateMutex.Lock()
 	m.state = state
@@ -266,12 +297,62 @@ func (m *Manager) RefreshState() {
 	ctx, cancel := context.WithTimeout(m.ctx, statusTimeout)
 	defer cancel()
 
-	status, err := m.client.Status(ctx)
+	state, err := m.fetchState(ctx)
 	if err != nil {
 		log.Warnf("[Tailscale] Failed to refresh state: %v", err)
 		return
 	}
 
-	state := convertStatus(status)
 	m.updateState(state)
 }
+
+// Connect brings the Tailscale backend up (WantRunning = true).
+func (m *Manager) Connect() error {
+	return m.editPrefs(&ipn.MaskedPrefs{
+		Prefs:          ipn.Prefs{WantRunning: true},
+		WantRunningSet: true,
+	})
+}
+
+// Disconnect brings the Tailscale backend down (WantRunning = false).
+func (m *Manager) Disconnect() error {
+	return m.editPrefs(&ipn.MaskedPrefs{
+		Prefs:          ipn.Prefs{WantRunning: false},
+		WantRunningSet: true,
+	})
+}
+
+// SetExitNode selects the exit node identified by its stable node ID. An empty
+// id clears the current exit node. Mirrors `tailscale set --exit-node=<id>`,
+// which also clears any legacy IP-based exit node so a stale ExitNodeIP cannot
+// silently take precedence over the now-empty ID.
+func (m *Manager) SetExitNode(id string) error {
+	return m.editPrefs(&ipn.MaskedPrefs{
+		Prefs:         ipn.Prefs{ExitNodeID: tailcfg.StableNodeID(id)},
+		ExitNodeIDSet: true,
+		ExitNodeIPSet: true,
+	})
+}
+
+// SetAllowLANAccess toggles whether locally accessible subnets remain
+// reachable while an exit node is in use.
+func (m *Manager) SetAllowLANAccess(enabled bool) error {
+	return m.editPrefs(&ipn.MaskedPrefs{
+		Prefs:                     ipn.Prefs{ExitNodeAllowLANAccess: enabled},
+		ExitNodeAllowLANAccessSet: true,
+	})
+}
+
+// editPrefs applies a masked prefs edit and refreshes state so subscribers see
+// the result immediately, in addition to the IPN bus notification it triggers.
+func (m *Manager) editPrefs(mp *ipn.MaskedPrefs) error {
+	ctx, cancel := context.WithTimeout(m.ctx, statusTimeout)
+	defer cancel()
+
+	if _, err := m.client.EditPrefs(ctx, mp); err != nil {
+		return err
+	}
+
+	m.RefreshState()
+	return nil
+}

core/internal/server/tailscale/manager_test.go

@@ -12,8 +12,16 @@ import (
 	"github.com/stretchr/testify/require"
 	"tailscale.com/ipn"
 	"tailscale.com/ipn/ipnstate"
+	"tailscale.com/tailcfg"
 )
 
+// blockingWatch is a watchFn that blocks until the context is cancelled, used
+// by tests that exercise direct manager calls rather than the watch loop.
+func blockingWatch(ctx context.Context, mask ipn.NotifyWatchOpt) (ipnBusWatcher, error) {
+	<-ctx.Done()
+	return nil, ctx.Err()
+}
+
 // mockWatcher yields canned Notify events, then returns err or blocks until Close/context cancel.
 type mockWatcher struct {
 	events []ipn.Notify
@@ -68,8 +76,10 @@ func (w *mockWatcher) Close() error {
 
 // mockClient implements tailscaleClient for testing.
 type mockClient struct {
-	watchFn  func(ctx context.Context, mask ipn.NotifyWatchOpt) (ipnBusWatcher, error)
+	watchFn     func(ctx context.Context, mask ipn.NotifyWatchOpt) (ipnBusWatcher, error)
-	statusFn func(ctx context.Context) (*ipnstate.Status, error)
+	statusFn    func(ctx context.Context) (*ipnstate.Status, error)
+	getPrefsFn  func(ctx context.Context) (*ipn.Prefs, error)
+	editPrefsFn func(ctx context.Context, mp *ipn.MaskedPrefs) (*ipn.Prefs, error)
 }
 
 func (c *mockClient) WatchIPNBus(ctx context.Context, mask ipn.NotifyWatchOpt) (ipnBusWatcher, error) {
@@ -80,6 +90,20 @@ func (c *mockClient) Status(ctx context.Context) (*ipnstate.Status, error) {
 	return c.statusFn(ctx)
 }
 
+func (c *mockClient) GetPrefs(ctx context.Context) (*ipn.Prefs, error) {
+	if c.getPrefsFn != nil {
+		return c.getPrefsFn(ctx)
+	}
+	return &ipn.Prefs{}, nil
+}
+
+func (c *mockClient) EditPrefs(ctx context.Context, mp *ipn.MaskedPrefs) (*ipn.Prefs, error) {
+	if c.editPrefsFn != nil {
+		return c.editPrefsFn(ctx, mp)
+	}
+	return &ipn.Prefs{}, nil
+}
+
 func runningStatus() *ipnstate.Status {
 	return &ipnstate.Status{
 		Version:        "1.94.2",
@@ -296,3 +320,78 @@ func TestManager_RefreshState(t *testing.T) {
 	assert.True(t, state.Connected)
 	assert.Equal(t, "cachyos", state.Self.Hostname)
 }
+
+func TestManager_RefreshState_MergesPrefs(t *testing.T) {
+	client := &mockClient{
+		watchFn:  blockingWatch,
+		statusFn: func(ctx context.Context) (*ipnstate.Status, error) { return runningStatus(), nil },
+		getPrefsFn: func(ctx context.Context) (*ipn.Prefs, error) {
+			return &ipn.Prefs{ExitNodeAllowLANAccess: true}, nil
+		},
+	}
+
+	m := newManager(client)
+	defer m.Close()
+
+	m.RefreshState()
+
+	assert.True(t, m.GetState().ExitNodeAllowLANAccess)
+}
+
+func TestManager_Actions_EditPrefs(t *testing.T) {
+	var captured *ipn.MaskedPrefs
+	client := &mockClient{
+		watchFn:  blockingWatch,
+		statusFn: func(ctx context.Context) (*ipnstate.Status, error) { return runningStatus(), nil },
+		editPrefsFn: func(ctx context.Context, mp *ipn.MaskedPrefs) (*ipn.Prefs, error) {
+			captured = mp
+			return &ipn.Prefs{}, nil
+		},
+	}
+
+	m := newManager(client)
+	defer m.Close()
+
+	require.NoError(t, m.Connect())
+	require.NotNil(t, captured)
+	assert.True(t, captured.WantRunningSet)
+	assert.True(t, captured.WantRunning)
+
+	require.NoError(t, m.Disconnect())
+	assert.True(t, captured.WantRunningSet)
+	assert.False(t, captured.WantRunning)
+
+	require.NoError(t, m.SetExitNode("nABC123"))
+	assert.True(t, captured.ExitNodeIDSet)
+	assert.Equal(t, tailcfg.StableNodeID("nABC123"), captured.ExitNodeID)
+	// ExitNodeIPSet must also be set so a stale legacy ExitNodeIP cannot
+	// override the ID-based selection (mirrors `tailscale set --exit-node`).
+	assert.True(t, captured.ExitNodeIPSet)
+
+	require.NoError(t, m.SetExitNode(""))
+	assert.True(t, captured.ExitNodeIDSet)
+	assert.Equal(t, tailcfg.StableNodeID(""), captured.ExitNodeID)
+	// Clearing must zero both the ID and any legacy IP-based exit node.
+	assert.True(t, captured.ExitNodeIPSet)
+
+	require.NoError(t, m.SetAllowLANAccess(true))
+	assert.True(t, captured.ExitNodeAllowLANAccessSet)
+	assert.True(t, captured.ExitNodeAllowLANAccess)
+}
+
+func TestManager_Actions_PropagateError(t *testing.T) {
+	client := &mockClient{
+		watchFn:  blockingWatch,
+		statusFn: func(ctx context.Context) (*ipnstate.Status, error) { return runningStatus(), nil },
+		editPrefsFn: func(ctx context.Context, mp *ipn.MaskedPrefs) (*ipn.Prefs, error) {
+			return nil, fmt.Errorf("backend rejected edit")
+		},
+	}
+
+	m := newManager(client)
+	defer m.Close()
+
+	assert.Error(t, m.Connect())
+	assert.Error(t, m.SetExitNode("nABC123"))
+	assert.Error(t, m.SetAllowLANAccess(true))
+}

core/internal/server/tailscale/types.go

@@ -2,30 +2,32 @@ package tailscale
 
 // TailscaleState represents the current state of the Tailscale daemon.
 type TailscaleState struct {
-	Connected      bool   `json:"connected"`
+	Connected              bool   `json:"connected"`
-	Version        string `json:"version"`
+	Version                string `json:"version"`
-	BackendState   string `json:"backendState"`
+	BackendState           string `json:"backendState"`
-	MagicDNSSuffix string `json:"magicDnsSuffix"`
+	MagicDNSSuffix         string `json:"magicDnsSuffix"`
-	TailnetName    string `json:"tailnetName"`
+	TailnetName            string `json:"tailnetName"`
-	Self           Peer   `json:"self"`
+	ExitNodeAllowLANAccess bool   `json:"exitNodeAllowLanAccess"`
-	Peers          []Peer `json:"peers"`
+	Self                   Peer   `json:"self"`
+	Peers                  []Peer `json:"peers"`
 }
 
 // Peer represents a single node in the Tailscale network.
 type Peer struct {
-	ID            string   `json:"id"`
+	ID             string   `json:"id"`
-	Hostname      string   `json:"hostname"`
+	Hostname       string   `json:"hostname"`
-	DNSName       string   `json:"dnsName"`
+	DNSName        string   `json:"dnsName"`
-	TailscaleIP   string   `json:"tailscaleIp"`
+	TailscaleIP    string   `json:"tailscaleIp"`
-	TailscaleIPv6 string   `json:"tailscaleIpv6,omitempty"`
+	TailscaleIPv6  string   `json:"tailscaleIpv6,omitempty"`
-	OS            string   `json:"os"`
+	OS             string   `json:"os"`
-	Online        bool     `json:"online"`
+	Online         bool     `json:"online"`
-	LastSeen      string   `json:"lastSeen,omitempty"`
+	LastSeen       string   `json:"lastSeen,omitempty"`
-	ExitNode      bool     `json:"exitNode"`
+	ExitNode       bool     `json:"exitNode"`
-	Tags          []string `json:"tags,omitempty"`
+	ExitNodeOption bool     `json:"exitNodeOption"`
-	Owner         string   `json:"owner"`
+	Tags           []string `json:"tags,omitempty"`
-	Relay         string   `json:"relay,omitempty"`
+	Owner          string   `json:"owner"`
-	Active        bool     `json:"active"`
+	Relay          string   `json:"relay,omitempty"`
-	RxBytes       int64    `json:"rxBytes"`
+	Active         bool     `json:"active"`
-	TxBytes       int64    `json:"txBytes"`
+	RxBytes        int64    `json:"rxBytes"`
+	TxBytes        int64    `json:"txBytes"`
 }

distro/scripts/ppa-build.sh

@@ -3,10 +3,10 @@
 # Usage: ./create-source.sh <package-dir> [ubuntu-series]
 #
 # Example:
-#   ./create-source.sh ../dms questing    # Ubuntu 25.10 (default series in ppa-upload)
+#   ./create-source.sh ../dms resolute     # Ubuntu 26.04 LTS (default series in ppa-upload)
-#   ./create-source.sh ../dms resolute     # Ubuntu 26.04 LTS
+#   ./create-source.sh ../dms stonking     # Ubuntu 26.10
-#   ./create-source.sh ../dms-git questing
 #   ./create-source.sh ../dms-git resolute
+#   ./create-source.sh ../dms-git stonking
 
 set -e
 
@@ -27,13 +27,13 @@ if [ $# -lt 1 ]; then
     echo "Arguments:"
     echo "  package-dir     : Path to package directory (e.g., ../dms)"
     echo "  ubuntu-series   : Ubuntu series (optional, default: noble)"
-    echo "                    Options: noble, jammy, oracular, mantic, questing, resolute"
+    echo "                    Options: noble, jammy, oracular, mantic, resolute, stonking"
     echo
     echo "Examples:"
-    echo "  $0 ../dms questing"
     echo "  $0 ../dms resolute"
-    echo "  $0 ../dms-git questing"
+    echo "  $0 ../dms stonking"
     echo "  $0 ../dms-git resolute"
+    echo "  $0 ../dms-git stonking"
     exit 1
 fi
 
@@ -135,7 +135,7 @@ check_ppa_version_exists() {
     local CHECK_MODE="${4:-commit}"
     local DISTRO_SERIES="${5:-}"
 
-    # Query Launchpad API (optionally scoped to one Ubuntu series so the same version can ship to questing and resolute)
+    # Query Launchpad API (optionally scoped to one Ubuntu series so the same version can ship to resolute and stonking)
     local API_URL="https://api.launchpad.net/1.0/~avengemedia/+archive/ubuntu/$PPA_NAME?ws.op=getPublishedSources&source_name=$SOURCE_NAME&status=Published"
     if [[ -n "$DISTRO_SERIES" ]]; then
         API_URL+="&distro_series=https://api.launchpad.net/1.0/ubuntu/${DISTRO_SERIES}"

distro/scripts/ppa-status.sh

@@ -10,8 +10,8 @@
 
 PPA_OWNER="avengemedia"
 LAUNCHPAD_API="https://api.launchpad.net/1.0"
-# Supported Ubuntu series for PPA builds (25.10 questing + 26.04 LTS resolute)
+# Supported Ubuntu series for PPA builds (26.04 LTS resolute + 26.10 stonking)
-DISTRO_SERIES_LIST=(questing resolute)
+DISTRO_SERIES_LIST=(resolute stonking)
 
 # Define packages (sync with ppa-upload.sh)
 ALL_PACKAGES=(dms dms-git dms-greeter)

distro/scripts/ppa-sync-plan.sh

@@ -5,7 +5,7 @@ set -euo pipefail
 
 PPA_OWNER="avengemedia"
 LAUNCHPAD_API="https://api.launchpad.net/1.0"
-SERIES_LIST=(questing resolute)
+SERIES_LIST=(resolute stonking)
 PACKAGE_FILTER="dms-git"
 REBUILD_RELEASE=""
 JSON=false
@@ -72,12 +72,12 @@ embedded_commit() {
 target_ppa() {
     local series="$1"
     if [[ -n "$REBUILD_RELEASE" ]]; then
-        if [[ "$series" == "resolute" ]]; then
+        if [[ "$series" == "stonking" ]]; then
             echo $((REBUILD_RELEASE + 1))
         else
             echo "$REBUILD_RELEASE"
         fi
-    elif [[ "$series" == "resolute" ]]; then
+    elif [[ "$series" == "stonking" ]]; then
         echo "2"
     else
         echo "1"

distro/scripts/ppa-upload.sh

@@ -3,13 +3,13 @@
 # Usage: ./ppa-upload.sh [package-name] [ppa-name] [ubuntu-series] [rebuild-number] [--keep-builds] [--rebuild=N]
 #
 # Examples:
-#   ./ppa-upload.sh dms                    # Upload to questing + resolute (default)
+#   ./ppa-upload.sh dms                    # Upload to resolute + stonking (default)
-#   ./ppa-upload.sh dms 2                 # Native: questing ppa2, resolute ppa3 (auto +1 on second series)
+#   ./ppa-upload.sh dms 2                 # Native: resolute ppa2, stonking ppa3 (auto +1 on second series)
 #   ./ppa-upload.sh dms --rebuild=2       # Rebuild with ppa2 (flag syntax)
 #   ./ppa-upload.sh dms-git               # Single package (both series)
 #   ./ppa-upload.sh all                   # All packages (each to both series)
 #   ./ppa-upload.sh dms resolute          # 26.04 LTS only (same as "dms dms resolute")
-#   ./ppa-upload.sh dms questing          # 25.10 only
+#   ./ppa-upload.sh dms stonking          # 26.10 only
 #   ./ppa-upload.sh dms dms resolute      # Explicit PPA name + one series (optional form)
 #   ./ppa-upload.sh dms dms resolute 2    # One series + rebuild number
 #   ./ppa-upload.sh distro/ubuntu/dms dms # Path-style (backward compatible)
@@ -70,8 +70,8 @@ if [[ ${#POSITIONAL_ARGS[@]} -gt 0 ]]; then
     fi
 fi
 
-# Shorthand: "dms resolute" / "dms questing" (package + series; PPA inferred — no need for "dms dms resolute")
+# Shorthand: "dms resolute" / "dms stonking" (package + series; PPA inferred — no need for "dms dms resolute")
-if [[ ${#POSITIONAL_ARGS[@]} -eq 2 ]] && [[ "${POSITIONAL_ARGS[1]}" == "questing" || "${POSITIONAL_ARGS[1]}" == "resolute" ]]; then
+if [[ ${#POSITIONAL_ARGS[@]} -eq 2 ]] && [[ "${POSITIONAL_ARGS[1]}" == "resolute" || "${POSITIONAL_ARGS[1]}" == "stonking" ]]; then
     PACKAGE_INPUT="${POSITIONAL_ARGS[0]}"
     PPA_NAME_INPUT=""
     UBUNTU_SERIES_RAW="${POSITIONAL_ARGS[1]}"
@@ -79,11 +79,11 @@ fi
 
 SERIES_LIST=()
 if [[ -z "$UBUNTU_SERIES_RAW" ]]; then
-    SERIES_LIST=(questing resolute)
+    SERIES_LIST=(resolute stonking)
-elif [[ "$UBUNTU_SERIES_RAW" == "questing" || "$UBUNTU_SERIES_RAW" == "resolute" ]]; then
+elif [[ "$UBUNTU_SERIES_RAW" == "resolute" || "$UBUNTU_SERIES_RAW" == "stonking" ]]; then
     SERIES_LIST=("$UBUNTU_SERIES_RAW")
 else
-    error "Invalid Ubuntu series: $UBUNTU_SERIES_RAW (use questing, resolute, or omit for both)"
+    error "Invalid Ubuntu series: $UBUNTU_SERIES_RAW (use resolute, stonking, or omit for both)"
     exit 1
 fi
 

distro/ubuntu/dms-greeter/debian/rules

@@ -40,10 +40,17 @@ override_dh_auto_install:
 	install -Dm644 DankMaterialShell-$(BASE_VERSION)/LICENSE \
 		debian/dms-greeter/usr/share/doc/dms-greeter/LICENSE
 
-	install -Dpm0644 DankMaterialShell-$(BASE_VERSION)/quickshell/systemd/tmpfiles-dms-greeter.conf \
+	# Install systemd tmpfiles/sysusers fragments only when present in the fetched source.
-		debian/dms-greeter/usr/lib/tmpfiles.d/dms-greeter.conf
+	# sysusers-dms-greeter.conf landed upstream after v1.4.6; guarding both lets older
-	install -Dm644 DankMaterialShell-$(BASE_VERSION)/quickshell/systemd/sysusers-dms-greeter.conf \
+	# release tarballs build, while future tags that ship the files install them automatically.
-		debian/dms-greeter/usr/lib/sysusers.d/dms-greeter.conf
+	if [ -f DankMaterialShell-$(BASE_VERSION)/quickshell/systemd/tmpfiles-dms-greeter.conf ]; then \
+		install -Dpm0644 DankMaterialShell-$(BASE_VERSION)/quickshell/systemd/tmpfiles-dms-greeter.conf \
+			debian/dms-greeter/usr/lib/tmpfiles.d/dms-greeter.conf; \
+	fi
+	if [ -f DankMaterialShell-$(BASE_VERSION)/quickshell/systemd/sysusers-dms-greeter.conf ]; then \
+		install -Dm644 DankMaterialShell-$(BASE_VERSION)/quickshell/systemd/sysusers-dms-greeter.conf \
+			debian/dms-greeter/usr/lib/sysusers.d/dms-greeter.conf; \
+	fi
 
 	# Create cache directory structure (will be created by postinst)
 	mkdir -p debian/dms-greeter/var/cache/dms-greeter

docs/IPC.md

@@ -6,6 +6,18 @@ DankMaterialShell provides comprehensive IPC (Inter-Process Communication) funct
 dms ipc call <target> <function> [parameters...]
 ```
 
+## Discovering IPC commands
+
+List all available targets and functions while DMS is running:
+
+```bash
+dms ipc list
+dms ipc          # same
+dms ipc --help   # same, plus usage text
+```
+
+Live listing requires DMS to be running. If listing fails, use this document or the [Keybinds & IPC docs](https://danklinux.com/docs/dankmaterialshell/keybinds-ipc) as an offline reference.
+
 ## Target: `audio`
 
 Audio system control and information.
@@ -707,7 +719,7 @@ File browser controls for selecting wallpapers and profile images.
   - Both browsers support common image formats (jpg, jpeg, png, bmp, gif, webp)
 
 ### Target: `color-picker`
-Color picker modal control.
+In-shell color picker modal for theme and settings color selection.
 
 **Functions:**
 - `open` - Show color picker modal
@@ -718,6 +730,14 @@ Color picker modal control.
 - `toggle` - Toggle color picker modal visibility
 - `toggleInstant` - Toggle color picker modal visibility without animation on hide
 
+**Note:** This controls the in-shell modal. To pick a pixel from the screen via CLI, use `dms color pick` instead (see [Color Picker CLI](https://danklinux.com/docs/dankmaterialshell/cli-color-picker)).
+
+**Examples:**
+```bash
+dms ipc call color-picker toggle
+dms ipc call color-picker openColor "#3f51b5"
+```
+
 ### Target: `hypr`
 Hyprland-specific controls including keybinds cheatsheet and workspace overview (Hyprland only).
 

quickshell/Common/DankSocket.qml

@@ -7,29 +7,31 @@ Item {
     property alias path: socket.path
     property alias parser: socket.parser
     property bool connected: false
+    property bool linkUp: false
 
     property int reconnectBaseMs: 400
     property int reconnectMaxMs: 15000
 
     property int _reconnectAttempt: 0
 
-    signal connectionStateChanged()
+    signal connectionStateChanged
 
     onConnectedChanged: {
-        socket.connected = connected
+        socket.connected = connected;
     }
 
     Socket {
         id: socket
 
         onConnectionStateChanged: {
-            root.connectionStateChanged()
+            root.linkUp = connected;
+            root.connectionStateChanged();
             if (connected) {
-                root._reconnectAttempt = 0
+                root._reconnectAttempt = 0;
-                return
+                return;
             }
             if (root.connected) {
-                root._scheduleReconnect()
+                root._scheduleReconnect();
             }
         }
     }
@@ -39,24 +41,24 @@ Item {
         interval: 0
         repeat: false
         onTriggered: {
-            socket.connected = false
+            socket.connected = false;
-            Qt.callLater(() => socket.connected = true)
+            Qt.callLater(() => socket.connected = true);
         }
     }
 
     function send(data) {
-        const json = typeof data === "string" ? data : JSON.stringify(data)
+        const json = typeof data === "string" ? data : JSON.stringify(data);
-        const message = json.endsWith("\n") ? json : json + "\n"
+        const message = json.endsWith("\n") ? json : json + "\n";
-        socket.write(message)
+        socket.write(message);
-        socket.flush()
+        socket.flush();
     }
 
     function _scheduleReconnect() {
-        const pow = Math.min(_reconnectAttempt, 10)
+        const pow = Math.min(_reconnectAttempt, 10);
-        const base = Math.min(reconnectBaseMs * Math.pow(2, pow), reconnectMaxMs)
+        const base = Math.min(reconnectBaseMs * Math.pow(2, pow), reconnectMaxMs);
-        const jitter = Math.floor(Math.random() * Math.floor(base / 4))
+        const jitter = Math.floor(Math.random() * Math.floor(base / 4));
-        reconnectTimer.interval = base + jitter
+        reconnectTimer.interval = base + jitter;
-        reconnectTimer.restart()
+        reconnectTimer.restart();
-        _reconnectAttempt++
+        _reconnectAttempt++;
     }
 }

quickshell/Common/KeyUtils.js

@@ -126,7 +126,40 @@ const KEY_MAP = {
     161: "exclamdown"
 };
 
-function xkbKeyFromQtKey(qk) {
+// Numpad (keypad) keys. Qt reuses the same Qt::Key_* values for the numpad and
+// the main rows/nav cluster; only Qt.KeypadModifier distinguishes them. niri and
+// the other compositors bind against the xkb KP_* keysym names, so we must emit
+// those instead of the collapsed twin. With NumLock off the numpad sends the
+// navigation keysyms (KP_Home, KP_End, ...); with NumLock on it sends KP_0..KP_9
+// (handled by the digit range in xkbKeyFromQtKey). Operators/Enter are the same
+// in both states.
+const KP_MAP = {
+    16777232: "KP_Home",
+    16777235: "KP_Up",
+    16777238: "KP_Prior",
+    16777234: "KP_Left",
+    16777227: "KP_Begin",
+    16777236: "KP_Right",
+    16777233: "KP_End",
+    16777237: "KP_Down",
+    16777239: "KP_Next",
+    16777222: "KP_Insert",
+    16777223: "KP_Delete",
+    16777221: "KP_Enter",
+    43: "KP_Add",
+    45: "KP_Subtract",
+    42: "KP_Multiply",
+    47: "KP_Divide",
+    46: "KP_Decimal"
+};
+
+function xkbKeyFromQtKey(qk, isKeypad) {
+    if (isKeypad) {
+        if (qk >= 48 && qk <= 57)
+            return "KP_" + (qk - 48);
+        if (KP_MAP[qk])
+            return KP_MAP[qk];
+    }
     if (qk >= 65 && qk <= 90)
         return String.fromCharCode(qk);
     if (qk >= 97 && qk <= 122)

quickshell/Common/KeybindActions.js

@@ -56,6 +56,9 @@ const DMS_ACTIONS = [
     { id: "spawn dms ipc call dankdash wallpaper", label: "Wallpaper Browser" },
     { id: "spawn dms ipc call file browse wallpaper", label: "File: Browse Wallpaper" },
     { id: "spawn dms ipc call file browse profile", label: "File: Browse Profile" },
+    { id: "spawn dms ipc call color-picker toggle", label: "Color Picker: Toggle" },
+    { id: "spawn dms ipc call color-picker open", label: "Color Picker: Open" },
+    { id: "spawn dms ipc call color-picker close", label: "Color Picker: Close" },
     { id: "spawn dms ipc call keybinds toggle niri", label: "Keybinds Cheatsheet: Toggle", compositor: "niri" },
     { id: "spawn dms ipc call keybinds open niri", label: "Keybinds Cheatsheet: Open", compositor: "niri" },
     { id: "spawn dms ipc call keybinds close", label: "Keybinds Cheatsheet: Close" },

quickshell/Common/SettingsData.qml

@@ -164,6 +164,8 @@ Singleton {
     property real popupTransparency: 1.0
     property real dockTransparency: 1
     property string widgetBackgroundColor: "sch"
+    property string widgetBackgroundCustomColor: "#6750A4"
+    property real widgetBackgroundCustomStrength: 0.50
     property string widgetColorMode: "default"
     property string controlCenterTileColorMode: "primary"
     property string buttonColorMode: "primary"
@@ -182,6 +184,7 @@ Singleton {
 
     property int firstDayOfWeek: -1
     property bool showWeekNumber: false
+    property string calendarBackend: "auto"
     property bool use24HourClock: true
     property bool showSeconds: false
     property bool padHours12Hour: false
@@ -384,11 +387,16 @@ Singleton {
     property bool dwlShowAllTags: false
     property bool workspaceActiveAppHighlightEnabled: false
     property string workspaceColorMode: "default"
+    property string workspaceFocusedCustomColor: "#6750A4"
     property string workspaceOccupiedColorMode: "none"
+    property string workspaceOccupiedCustomColor: "#625B71"
     property string workspaceUnfocusedColorMode: "default"
+    property string workspaceUnfocusedCustomColor: "#49454E"
     property string workspaceUrgentColorMode: "default"
+    property string workspaceUrgentCustomColor: "#B3261E"
     property bool workspaceFocusedBorderEnabled: false
     property string workspaceFocusedBorderColor: "primary"
+    property string workspaceFocusedBorderCustomColor: "#6750A4"
     property int workspaceFocusedBorderThickness: 2
     property var workspaceNameIcons: ({})
     property bool waveProgressEnabled: true
@@ -405,6 +413,9 @@ Singleton {
     property int barMaxVisibleApps: 0
     property int barMaxVisibleRunningApps: 0
     property bool barShowOverflowBadge: true
+    property bool trayAutoOverflow: true
+    property bool trayPopupSingleLine: true
+    property int trayMaxVisibleItems: 0
     property bool appsDockHideIndicators: false
     property bool appsDockColorizeActive: false
     property string appsDockActiveColorMode: "primary"
@@ -461,6 +472,8 @@ Singleton {
     property bool launcherUseOverlayLayer: false
     property string launcherStyle: "full"
     property bool spotlightBarShowModeChips: false
+    property bool keybindsFloatingWindow: false
+    onKeybindsFloatingWindowChanged: saveSettings()
 
     property string _legacyWeatherLocation: "New York, NY"
     property string _legacyWeatherCoordinates: "40.7128,-74.0060"
@@ -568,6 +581,7 @@ Singleton {
     property bool soundVolumeChanged: true
     property bool soundPluggedIn: true
     property bool soundLogin: false
+    property bool muteSoundsWhenMediaPlaying: true
 
     property int acMonitorTimeout: 0
     property int acLockTimeout: 0

quickshell/Common/Theme.qml

@@ -450,7 +450,9 @@ Singleton {
                 "primaryText": getMatugenColor("on_primary", "#ffffff"),
                 "primaryContainer": getMatugenColor("primary_container", "#1976d2"),
                 "secondary": getMatugenColor("secondary", "#8ab4f8"),
+                "secondaryContainer": getMatugenColor("secondary_container", getMatugenColor("surface_container_high", "#292b2f")),
                 "tertiary": getMatugenColor("tertiary", "#efb8c8"),
+                "tertiaryContainer": getMatugenColor("tertiary_container", getMatugenColor("surface_container_high", "#292b2f")),
                 "surface": getMatugenColor("surface", "#1a1c1e"),
                 "surfaceText": getMatugenColor("on_background", "#e3e8ef"),
                 "surfaceVariant": getMatugenColor("surface_variant", "#44464f"),
@@ -521,7 +523,6 @@ Singleton {
 
     property color primary: currentThemeData.primary
     property color primaryText: currentThemeData.primaryText
-    property color primaryContainer: currentThemeData.primaryContainer
     property color secondary: currentThemeData.secondary
     property color tertiary: currentThemeData.tertiary || currentThemeData.secondary
     property color surface: currentThemeData.surface
@@ -536,6 +537,9 @@ Singleton {
     property color surfaceContainer: currentThemeData.surfaceContainer
     property color surfaceContainerHigh: currentThemeData.surfaceContainerHigh
     property color surfaceContainerHighest: currentThemeData.surfaceContainerHighest || surfaceContainerHigh
+    property color primaryContainer: currentThemeData.primaryContainer || blend(surfaceContainerHigh, primary, 0.45)
+    property color secondaryContainer: currentThemeData.secondaryContainer || blend(surfaceContainerHigh, secondary, 0.35)
+    property color tertiaryContainer: currentThemeData.tertiaryContainer || blend(surfaceContainerHigh, tertiary, 0.35)
 
     property color onSurface: surfaceText
     property color onSurfaceVariant: surfaceVariantText
@@ -1430,9 +1434,22 @@ Singleton {
 
     property bool widgetBackgroundHasAlpha: {
         const colorMode = typeof SettingsData !== "undefined" ? SettingsData.widgetBackgroundColor : "sch";
-        return colorMode === "sth";
+        return colorMode === "sth" || colorMode === "custom";
     }
 
+    function safeColor(value, fallback) {
+        try {
+            if (value === undefined || value === null || value === "")
+                return fallback;
+            return Qt.color(value);
+        } catch (e) {
+            return fallback;
+        }
+    }
+
+    readonly property color widgetBackgroundCustomBaseColor: safeColor(typeof SettingsData !== "undefined" ? SettingsData.widgetBackgroundCustomColor : "#6750A4", primaryContainer)
+    readonly property real widgetBackgroundCustomStrength: Math.max(0, Math.min(1, typeof SettingsData !== "undefined" ? (SettingsData.widgetBackgroundCustomStrength ?? 0.4) : 0.4))
+
     property var widgetBaseBackgroundColor: {
         const colorMode = typeof SettingsData !== "undefined" ? SettingsData.widgetBackgroundColor : "sch";
         switch (colorMode) {
@@ -1442,6 +1459,14 @@ Singleton {
             return surfaceContainer;
         case "sch":
             return surfaceContainerHigh;
+        case "primaryContainer":
+            return primaryContainer;
+        case "secondaryContainer":
+            return secondaryContainer;
+        case "tertiaryContainer":
+            return tertiaryContainer;
+        case "custom":
+            return blend(surfaceContainerHigh, widgetBackgroundCustomBaseColor, widgetBackgroundCustomStrength);
         case "sth":
         default:
             return surfaceTextHover;

quickshell/Common/settings/SettingsSpec.js

@@ -19,6 +19,8 @@ var SPEC = {
     dockTransparency: { def: 1.0, coerce: percentToUnit },
 
     widgetBackgroundColor: { def: "sch" },
+    widgetBackgroundCustomColor: { def: "#6750A4" },
+    widgetBackgroundCustomStrength: { def: 0.50, coerce: percentToUnit },
     widgetColorMode: { def: "default" },
     controlCenterTileColorMode: { def: "primary" },
     buttonColorMode: { def: "primary" },
@@ -37,6 +39,7 @@ var SPEC = {
 
     firstDayOfWeek: { def: -1 },
     showWeekNumber: { def: false },
+    calendarBackend: { def: "auto" },
     use24HourClock: { def: true },
     showSeconds: { def: false },
     padHours12Hour: { def: false },
@@ -143,11 +146,16 @@ var SPEC = {
     dwlShowAllTags: { def: false },
     workspaceActiveAppHighlightEnabled: { def: false },
     workspaceColorMode: { def: "default" },
+    workspaceFocusedCustomColor: { def: "#6750A4" },
     workspaceOccupiedColorMode: { def: "none" },
+    workspaceOccupiedCustomColor: { def: "#625B71" },
     workspaceUnfocusedColorMode: { def: "default" },
+    workspaceUnfocusedCustomColor: { def: "#49454E" },
     workspaceUrgentColorMode: { def: "default" },
+    workspaceUrgentCustomColor: { def: "#B3261E" },
     workspaceFocusedBorderEnabled: { def: false },
     workspaceFocusedBorderColor: { def: "primary" },
+    workspaceFocusedBorderCustomColor: { def: "#6750A4" },
     workspaceFocusedBorderThickness: { def: 2 },
     workspaceNameIcons: { def: {} },
     waveProgressEnabled: { def: true },
@@ -164,6 +172,9 @@ var SPEC = {
     barMaxVisibleApps: { def: 0 },
     barMaxVisibleRunningApps: { def: 0 },
     barShowOverflowBadge: { def: true },
+    trayAutoOverflow: { def: true },
+    trayPopupSingleLine: { def: true },
+    trayMaxVisibleItems: { def: 0 },
     appsDockHideIndicators: { def: false },
     appsDockColorizeActive: { def: false },
     appsDockActiveColorMode: { def: "primary" },
@@ -226,6 +237,7 @@ var SPEC = {
     launcherUseOverlayLayer: { def: false },
     launcherStyle: { def: "full" },
     spotlightBarShowModeChips: { def: false },
+    keybindsFloatingWindow: { def: false },
 
     useAutoLocation: { def: false },
     weatherEnabled: { def: true },
@@ -278,6 +290,7 @@ var SPEC = {
     soundNewNotification: { def: true },
     soundVolumeChanged: { def: true },
     soundPluggedIn: { def: true },
+    muteSoundsWhenMediaPlaying: { def: true },
 
     acMonitorTimeout: { def: 0 },
     acLockTimeout: { def: 0 },

quickshell/DMSShell.qml

@@ -116,6 +116,12 @@ Item {
                         fadeWindowLoader.item.cancelFade();
                     }
                 }
+
+                function onDismissFadeToLock() {
+                    if (fadeWindowLoader.item) {
+                        fadeWindowLoader.item.dismiss();
+                    }
+                }
             }
         }
     }
@@ -317,6 +323,9 @@ Item {
 
     property bool hadRealScreen: true
     property var previousRealScreenNames: []
+    // Guards for the screen-reconnect recovery path (see scheduleScreenReconnectRecovery).
+    property bool _screenRecoveryCooldown: false
+    property bool _screenRecoveryPending: false
 
     function _getRealScreenNames() {
         const names = [];
@@ -359,15 +368,60 @@ Item {
             const partialReconnect = root.previousRealScreenNames.length > 0
                 && currentNames.some(name => !root.previousRealScreenNames.includes(name));
             if (fullReconnect || partialReconnect) {
-                log.info("Screen reconnect detected, triggering surface recovery",
+                log.info("Screen reconnect detected, scheduling surface recovery",
                          "full:", fullReconnect, "partial:", partialReconnect);
-                root.triggerSurfaceRecovery("screen-reconnect");
+                root.scheduleScreenReconnectRecovery();
             }
             root.hadRealScreen = hasReal;
             root.previousRealScreenNames = currentNames;
         }
     }
 
+    // A DPMS off/on cycle removes an output from the screen list and re-adds it,
+    // which is indistinguishable here from a hotplug. Recovering immediately on
+    // every such event lets a flapping monitor (or a recovery that itself perturbs
+    // the output) drive an endless recovery storm that power-cycles the display
+    // (#2642). Debounce a burst of changes into a single pass, then hold a cooldown
+    // so repeated flaps trigger at most one recovery per window. Recovery still runs
+    // once per resume, so a partial DPMS resume keeps redrawing its surfaces (#2579).
+    function scheduleScreenReconnectRecovery() {
+        if (root._screenRecoveryCooldown) {
+            root._screenRecoveryPending = true;
+            return;
+        }
+        screenReconnectDebounce.restart();
+    }
+
+    Timer {
+        id: screenReconnectDebounce
+        // Wide enough to collapse the output-remove + output-re-add pair that one
+        // DPMS off/on cycle emits as two near-simultaneous events into one recovery.
+        interval: 450
+        repeat: false
+        onTriggered: {
+            root._screenRecoveryCooldown = true;
+            root._screenRecoveryPending = false;
+            screenReconnectCooldown.restart();
+            root.triggerSurfaceRecovery("screen-reconnect");
+        }
+    }
+
+    Timer {
+        id: screenReconnectCooldown
+        // Must exceed the full two-pass surfaceResumeRecoveryTimer sequence
+        // (800 + 2000 ms) so the cooldown still covers an in-flight recovery;
+        // raise this if those passes are lengthened.
+        interval: 4000
+        repeat: false
+        onTriggered: {
+            root._screenRecoveryCooldown = false;
+            if (root._screenRecoveryPending) {
+                root._screenRecoveryPending = false;
+                screenReconnectDebounce.restart();
+            }
+        }
+    }
+
     Timer {
         id: surfaceResumeRecoveryTimer
         interval: 800
@@ -653,7 +707,7 @@ Item {
             if (!wifiPasswordModalLoader.item)
                 return;
 
-            if (wifiPasswordModalLoader.item.visible && timeSinceLastPrompt < 1000) {
+            if (wifiPasswordModalLoader.item.shouldBeVisible && timeSinceLastPrompt < 1000) {
                 NetworkService.cancelCredentials(lastCredentialsToken);
                 lastCredentialsToken = token;
                 lastCredentialsTime = now;
@@ -997,6 +1051,14 @@ Item {
             osdResumeRecreateTimer.interval = 400;
             osdResumeRecreateTimer.restart();
 
+            // This path runs its own recovery directly, so drop any queued or
+            // in-flight screen-reconnect recovery to avoid a redundant pass once
+            // its cooldown expires.
+            screenReconnectDebounce.stop();
+            screenReconnectCooldown.stop();
+            root._screenRecoveryCooldown = false;
+            root._screenRecoveryPending = false;
+
             root.triggerSurfaceRecovery("sessionResumed");
         }
     }

quickshell/DMSShellIPC.qml

@@ -956,7 +956,7 @@ Item {
 
         function tabs(): string {
             if (!PopoutService.settingsModal)
-                return "wallpaper\ntheme\ntypography\ntime_weather\nsounds\ndankbar\ndankbar_settings\ndankbar_appearance\ndankbar_widgets\nframe\nworkspaces\ncompositor\nmedia_player\nnotifications\nosd\nrunning_apps\nupdater\ndock\nlauncher\nkeybinds\ndisplays\nnetwork\nprinters\nlock_screen\npower_sleep\nplugins\nabout";
+                return "wallpaper\ntheme\ntypography\ntime_weather\nsounds\ndankbar\ndankbar_settings\ndankbar_appearance\ndankbar_widgets\nframe\nworkspaces\ncompositor\nmedia_player\nnotifications\nosd\nrunning_apps\nupdater\ndock\nlauncher\nkeybinds\ndisplays\nnetwork\nnetwork_status\nnetwork_ethernet\nnetwork_wifi\nnetwork_vpn\nprinters\nlock_screen\npower_sleep\nplugins\nabout";
             var modal = PopoutService.settingsModal;
             var ids = [];
             var structure = modal.sidebar?.categoryStructure ?? [];

quickshell/Modals/FileBrowser/FileBrowserContent.qml

@@ -201,6 +201,21 @@ FocusScope {
         keyboardSelectionRequested = true;
     }
 
+    function activateFile(path, name, isDir) {
+        if (isDir) {
+            navigateTo(path);
+            return;
+        }
+        if (saveMode) {
+            saveRow.fileName = name;
+            pendingFilePath = path;
+            showOverwriteConfirmation = true;
+        } else {
+            fileSelected(path);
+            closeRequested();
+        }
+    }
+
     function handleSaveFile(filePath) {
         var normalizedPath = filePath;
         if (!normalizedPath.startsWith("file://")) {
@@ -652,6 +667,7 @@ FocusScope {
 
             Row {
                 anchors.fill: parent
+                anchors.bottomMargin: root.saveMode ? 40 + Theme.spacingL * 2 : 0
                 spacing: 0
 
                 Row {
@@ -756,12 +772,7 @@ FocusScope {
                                 onItemClicked: (index, path, name, isDir) => {
                                     selectedIndex = index;
                                     setSelectedFileData(path, name, isDir);
-                                    if (isDir) {
+                                    root.activateFile(path, name, isDir);
-                                        navigateTo(path);
-                                    } else {
-                                        fileSelected(path);
-                                        root.closeRequested();
-                                    }
                                 }
                                 onItemSelected: (index, path, name, isDir) => {
                                     setSelectedFileData(path, name, isDir);
@@ -776,12 +787,7 @@ FocusScope {
                                             root.keyboardSelectionRequested = false;
                                             selectedIndex = index;
                                             setSelectedFileData(filePath, fileName, fileIsDir);
-                                            if (fileIsDir) {
+                                            root.activateFile(filePath, fileName, fileIsDir);
-                                                navigateTo(filePath);
-                                            } else {
-                                                fileSelected(filePath);
-                                                root.closeRequested();
-                                            }
                                         }
                                     }
 
@@ -817,12 +823,7 @@ FocusScope {
                                 onItemClicked: (index, path, name, isDir) => {
                                     selectedIndex = index;
                                     setSelectedFileData(path, name, isDir);
-                                    if (isDir) {
+                                    root.activateFile(path, name, isDir);
-                                        navigateTo(path);
-                                    } else {
-                                        fileSelected(path);
-                                        root.closeRequested();
-                                    }
                                 }
                                 onItemSelected: (index, path, name, isDir) => {
                                     setSelectedFileData(path, name, isDir);
@@ -837,12 +838,7 @@ FocusScope {
                                             root.keyboardSelectionRequested = false;
                                             selectedIndex = index;
                                             setSelectedFileData(filePath, fileName, fileIsDir);
-                                            if (fileIsDir) {
+                                            root.activateFile(filePath, fileName, fileIsDir);
-                                                navigateTo(filePath);
-                                            } else {
-                                                fileSelected(filePath);
-                                                root.closeRequested();
-                                            }
                                         }
                                     }
 
@@ -855,6 +851,7 @@ FocusScope {
             }
 
             FileBrowserSaveRow {
+                id: saveRow
                 anchors.bottom: parent.bottom
                 anchors.left: parent.left
                 anchors.right: parent.right
@@ -913,21 +910,21 @@ FocusScope {
                 }
             }
         }
+    }
 
-        FileBrowserOverwriteDialog {
+    FileBrowserOverwriteDialog {
-            anchors.fill: parent
+        anchors.fill: parent
-            showDialog: showOverwriteConfirmation
+        showDialog: showOverwriteConfirmation
-            pendingFilePath: root.pendingFilePath
+        pendingFilePath: root.pendingFilePath
-            onConfirmed: filePath => {
+        onConfirmed: filePath => {
-                showOverwriteConfirmation = false;
+            showOverwriteConfirmation = false;
-                fileSelected(filePath);
+            fileSelected(filePath);
-                pendingFilePath = "";
+            pendingFilePath = "";
-                Qt.callLater(() => root.closeRequested());
+            Qt.callLater(() => root.closeRequested());
-            }
+        }
-            onCancelled: {
+        onCancelled: {
-                showOverwriteConfirmation = false;
+            showOverwriteConfirmation = false;
-                pendingFilePath = "";
+            pendingFilePath = "";
-            }
         }
     }
 

quickshell/Modals/FileBrowser/FileBrowserOverwriteDialog.qml

@@ -74,7 +74,7 @@ Item {
                     width: 80
                     height: 36
                     radius: Theme.cornerRadius
-                    color: cancelArea.containsMouse ? Theme.surfaceVariantHover : Theme.surfaceVariant
+                    color: cancelArea.containsMouse ? Qt.lighter(Theme.surfaceVariant, 1.2) : Theme.surfaceVariant
                     border.color: Theme.outline
                     border.width: 1
 

quickshell/Modals/FileBrowser/FileBrowserSaveRow.qml

@@ -8,6 +8,7 @@ Row {
     property bool saveMode: false
     property string defaultFileName: ""
     property string currentPath: ""
+    property alias fileName: fileNameInput.text
 
     signal saveRequested(string filePath)
 

quickshell/Modals/KeybindsContent.qml

@@ -0,0 +1,336 @@
+import QtQml
+import QtQuick
+import QtQuick.Layouts
+import qs.Common
+import qs.Services
+import qs.Widgets
+
+FocusScope {
+    id: content
+
+    property real scrollStep: 60
+    property var activeFlickable: mainFlickable
+    property bool showFloatingToggle: true
+    property bool floating: false
+    property alias searchField: searchField
+
+    signal closeRequested
+    signal floatingToggleRequested
+
+    function scrollDown() {
+        if (!activeFlickable)
+            return;
+        let newY = activeFlickable.contentY + scrollStep;
+        newY = Math.min(newY, activeFlickable.contentHeight - activeFlickable.height);
+        activeFlickable.contentY = newY;
+    }
+
+    function scrollUp() {
+        if (!activeFlickable)
+            return;
+        let newY = activeFlickable.contentY - scrollStep;
+        newY = Math.max(0, newY);
+        activeFlickable.contentY = newY;
+    }
+
+    Keys.onPressed: event => {
+        switch (event.key) {
+        case Qt.Key_J:
+            if (event.modifiers & Qt.ControlModifier) {
+                scrollDown();
+                event.accepted = true;
+            }
+            return;
+        case Qt.Key_K:
+            if (event.modifiers & Qt.ControlModifier) {
+                scrollUp();
+                event.accepted = true;
+            }
+            return;
+        case Qt.Key_Down:
+            scrollDown();
+            event.accepted = true;
+            return;
+        case Qt.Key_Up:
+            scrollUp();
+            event.accepted = true;
+            return;
+        }
+    }
+
+    Column {
+        anchors.fill: parent
+        anchors.margins: Theme.spacingL
+        spacing: Theme.spacingL
+
+        RowLayout {
+            width: parent.width
+            spacing: Theme.spacingM
+
+            StyledText {
+                Layout.alignment: Qt.AlignLeft
+                text: KeybindsService.cheatsheet.title || I18n.tr("Keybinds")
+                font.pixelSize: Theme.fontSizeLarge
+                font.weight: Font.Bold
+                color: Theme.primary
+            }
+
+            Item {
+                Layout.fillWidth: true
+            }
+
+            DankActionButton {
+                visible: content.showFloatingToggle
+                iconName: content.floating ? "close_fullscreen" : "open_in_new"
+                tooltipText: content.floating ? I18n.tr("Dock window") : I18n.tr("Open as window")
+                onClicked: content.floatingToggleRequested()
+            }
+
+            DankTextField {
+                id: searchField
+                Layout.alignment: Qt.AlignRight
+                leftIconName: "search"
+                keyForwardTargets: [content]
+                onTextEdited: searchDebounce.restart()
+                Keys.onEscapePressed: event => {
+                    content.closeRequested();
+                    event.accepted = true;
+                }
+            }
+        }
+
+        Timer {
+            id: searchDebounce
+            interval: 50
+            repeat: false
+            onTriggered: {
+                mainFlickable.categories = mainFlickable.generateCategories(searchField.text);
+            }
+        }
+
+        DankFlickable {
+            id: mainFlickable
+            width: parent.width
+            height: parent.height - parent.spacing - 40
+            contentWidth: rowLayout.implicitWidth
+            contentHeight: rowLayout.implicitHeight
+            clip: true
+
+            property var rawBinds: KeybindsService.cheatsheet.binds || {}
+
+            function generateCategories(query) {
+                const lowerQuery = query ? query.toLowerCase().trim() : "";
+                const lowerQueryWords = query.split(/\s+/);
+                const processed = {};
+
+                for (const cat in rawBinds) {
+                    const binds = rawBinds[cat];
+                    const catLower = cat.toLowerCase();
+                    const subcats = {};
+                    let hasSubcats = false;
+                    for (let i = 0; i < binds.length; i++) {
+                        const bind = binds[i];
+                        const keyLower = (bind.key || "").toLowerCase();
+                        const descLower = (bind.desc || "").toLowerCase();
+                        const actionLower = (bind.action || "").toLowerCase();
+
+                        if (bind.hideOnOverlay)
+                            continue;
+                        let shouldContinue = false;
+                        for (let j = 0; j < lowerQueryWords.length; j++) {
+                            const word = lowerQueryWords[j];
+                            if (!(word.length === 0 || keyLower.includes(word) || descLower.includes(word) || catLower.includes(word) || actionLower.includes(word))) {
+                                shouldContinue = true;
+                                break;
+                            }
+                        }
+                        if (shouldContinue)
+                            continue;
+
+                        if (bind.subcat) {
+                            hasSubcats = true;
+                            if (!subcats[bind.subcat])
+                                subcats[bind.subcat] = [];
+                            subcats[bind.subcat].push(bind);
+                        } else {
+                            if (!subcats["_root"])
+                                subcats["_root"] = [];
+                            subcats["_root"].push(bind);
+                        }
+                    }
+
+                    if (Object.keys(subcats).length === 0)
+                        continue;
+
+                    processed[cat] = {
+                        hasSubcats: hasSubcats,
+                        subcats: subcats,
+                        subcatKeys: Object.keys(subcats)
+                    };
+                }
+
+                return processed;
+            }
+
+            property var categories: generateCategories("")
+
+            function estimateCategoryHeight(catName) {
+                const catData = categories[catName];
+                if (!catData)
+                    return 0;
+                let bindCount = 0;
+                for (const key of catData.subcatKeys) {
+                    bindCount += catData.subcats[key]?.length || 0;
+                    if (key !== "_root")
+                        bindCount += 1;
+                }
+                return 40 + bindCount * 28;
+            }
+
+            property var categoryKeys: Object.keys(categories)
+
+            function distributeCategories(cols) {
+                const columns = [];
+                const heights = [];
+                for (let i = 0; i < cols; i++) {
+                    columns.push([]);
+                    heights.push(0);
+                }
+                const sorted = [...categoryKeys].sort((a, b) => estimateCategoryHeight(b) - estimateCategoryHeight(a));
+                for (const cat of sorted) {
+                    let minIdx = 0;
+                    for (let i = 1; i < cols; i++) {
+                        if (heights[i] < heights[minIdx])
+                            minIdx = i;
+                    }
+                    columns[minIdx].push(cat);
+                    heights[minIdx] += estimateCategoryHeight(cat);
+                }
+                return columns;
+            }
+
+            Row {
+                id: rowLayout
+                width: mainFlickable.width
+                spacing: Theme.spacingM
+
+                property int numColumns: Math.max(1, Math.min(3, Math.floor(width / 350)))
+                property var columnCategories: mainFlickable.distributeCategories(numColumns)
+
+                Repeater {
+                    model: rowLayout.numColumns
+
+                    Column {
+                        id: masonryColumn
+                        width: (rowLayout.width - rowLayout.spacing * (rowLayout.numColumns - 1)) / rowLayout.numColumns
+                        spacing: Theme.spacingXL
+
+                        Repeater {
+                            model: rowLayout.columnCategories[index] || []
+
+                            Column {
+                                id: categoryColumn
+                                width: parent.width
+                                spacing: Theme.spacingXS
+
+                                property string catName: modelData
+                                property var catData: mainFlickable.categories[catName]
+
+                                StyledText {
+                                    text: categoryColumn.catName
+                                    font.pixelSize: Theme.fontSizeMedium
+                                    font.weight: Font.Bold
+                                    color: Theme.primary
+                                }
+
+                                Rectangle {
+                                    width: parent.width
+                                    height: 1
+                                    color: Theme.primary
+                                    opacity: 0.3
+                                }
+
+                                Item {
+                                    width: 1
+                                    height: Theme.spacingXS
+                                }
+
+                                Column {
+                                    width: parent.width
+                                    spacing: Theme.spacingM
+
+                                    Repeater {
+                                        model: categoryColumn.catData?.subcatKeys || []
+
+                                        Column {
+                                            width: parent.width
+                                            spacing: Theme.spacingXS
+
+                                            property string subcatName: modelData
+                                            property var subcatBinds: categoryColumn.catData?.subcats?.[subcatName] || []
+
+                                            StyledText {
+                                                visible: parent.subcatName !== "_root"
+                                                text: parent.subcatName
+                                                font.pixelSize: Theme.fontSizeSmall
+                                                font.weight: Font.DemiBold
+                                                color: Theme.primary
+                                                opacity: 0.7
+                                            }
+
+                                            Column {
+                                                width: parent.width
+                                                spacing: Theme.spacingXS
+
+                                                Repeater {
+                                                    model: parent.parent.subcatBinds
+
+                                                    Item {
+                                                        width: parent.width
+                                                        height: 24
+
+                                                        StyledRect {
+                                                            id: keyBadge
+                                                            width: Math.min(keyText.implicitWidth + 12, 160)
+                                                            height: 22
+                                                            radius: 4
+                                                            anchors.verticalCenter: parent.verticalCenter
+
+                                                            StyledText {
+                                                                id: keyText
+                                                                anchors.centerIn: parent
+                                                                color: Theme.secondary
+                                                                text: (modelData.key || "").replace(/\+/g, " + ")
+                                                                font.pixelSize: Theme.fontSizeSmall
+                                                                font.weight: Font.Medium
+                                                                isMonospace: true
+                                                                elide: Text.ElideRight
+                                                                width: Math.min(implicitWidth, 148)
+                                                            }
+                                                        }
+
+                                                        StyledText {
+                                                            anchors.left: parent.left
+                                                            anchors.leftMargin: 170
+                                                            anchors.right: parent.right
+                                                            anchors.verticalCenter: parent.verticalCenter
+                                                            text: modelData.desc || modelData.action || ""
+                                                            font.pixelSize: Theme.fontSizeSmall
+                                                            opacity: 0.9
+                                                            elide: Text.ElideRight
+                                                            wrapMode: Text.NoWrap
+                                                        }
+                                                    }
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

quickshell/Modals/KeybindsModal.qml

@@ -1,334 +1,78 @@
-import QtQml
 import QtQuick
-import QtQuick.Layouts
 import qs.Common
-import qs.Modals.Common
+import qs.Modals
 import qs.Services
-import qs.Widgets
 
-DankModal {
+Item {
     id: root
 
-    layerNamespace: "dms:keybinds"
+    readonly property bool floating: SettingsData.keybindsFloatingWindow
-    useOverlayLayer: true
+    readonly property bool shouldBeVisible: floating ? (windowLoader.item ? windowLoader.item.visible : false) : (overlayLoader.item ? overlayLoader.item.shouldBeVisible : false)
-    property real scrollStep: 60
-    property var activeFlickable: null
-    property real _maxW: Math.min(root.screenWidth * 0.92, 1200)
-    property real _maxH: Math.min(root.screenHeight * 0.92, 900)
-    modalWidth: _maxW
-    modalHeight: _maxH
-    onBackgroundClicked: close()
-    onOpened: {
-        Qt.callLater(() => {
-            modalFocusScope.forceActiveFocus();
-            if (contentLoader.item?.searchField)
-                contentLoader.item.searchField.forceActiveFocus();
-        });
-        if (!Object.keys(KeybindsService.cheatsheet).length && KeybindsService.cheatsheetAvailable)
-            KeybindsService.loadCheatsheet();
-    }
 
-    function scrollDown() {
+    function open() {
-        if (!root.activeFlickable)
+        if (floating) {
+            windowLoader.active = true;
+            windowLoader.item.show();
             return;
-        let newY = root.activeFlickable.contentY + scrollStep;
+        }
-        newY = Math.min(newY, root.activeFlickable.contentHeight - root.activeFlickable.height);
+        overlayLoader.active = true;
-        root.activeFlickable.contentY = newY;
+        overlayLoader.item.open();
     }
 
-    function scrollUp() {
+    function close() {
-        if (!root.activeFlickable)
+        if (windowLoader.item)
+            windowLoader.item.hide();
+        if (overlayLoader.item)
+            overlayLoader.item.close();
+    }
+
+    function toggle() {
+        if (shouldBeVisible)
+            close();
+        else
+            open();
+    }
+
+    function _switchFloating(toFloating) {
+        if (toFloating) {
+            if (overlayLoader.item)
+                overlayLoader.item.close();
+            SettingsData.keybindsFloatingWindow = true;
+            windowLoader.active = true;
+            windowLoader.item.show();
             return;
-        let newY = root.activeFlickable.contentY - root.scrollStep;
+        }
-        newY = Math.max(0, newY);
+        if (windowLoader.item)
-        root.activeFlickable.contentY = newY;
+            windowLoader.item.hide();
+        SettingsData.keybindsFloatingWindow = false;
+        overlayLoader.active = true;
+        overlayLoader.item.open();
     }
 
-    modalFocusScope.Keys.onPressed: event => {
+    Loader {
-        if (event.key === Qt.Key_J && event.modifiers & Qt.ControlModifier) {
+        id: overlayLoader
-            scrollDown();
+        active: false
-            event.accepted = true;
+        asynchronous: false
-        } else if (event.key === Qt.Key_K && event.modifiers & Qt.ControlModifier) {
+
-            scrollUp();
+        sourceComponent: KeybindsModalOverlay {
-            event.accepted = true;
+            onFloatingToggleRequested: root._switchFloating(true)
-        } else if (event.key === Qt.Key_Down) {
+            onDialogClosed: Qt.callLater(() => {
-            scrollDown();
+                if (!shouldBeVisible)
-            event.accepted = true;
+                    overlayLoader.active = false;
-        } else if (event.key === Qt.Key_Up) {
+            })
-            scrollUp();
-            event.accepted = true;
         }
     }
 
-    content: Component {
+    Loader {
-        Item {
+        id: windowLoader
-            anchors.fill: parent
+        active: false
-            property alias searchField: searchField
+        asynchronous: false
 
-            Column {
+        sourceComponent: KeybindsModalWindow {
-                anchors.fill: parent
+            onFloatingToggleRequested: root._switchFloating(false)
-                anchors.margins: Theme.spacingL
+            onVisibleChanged: {
-                spacing: Theme.spacingL
+                if (!visible)
-
+                    Qt.callLater(() => windowLoader.active = false);
-                RowLayout {
-                    width: parent.width
-
-                    StyledText {
-                        Layout.alignment: Qt.AlignLeft
-                        text: KeybindsService.cheatsheet.title || I18n.tr("Keybinds")
-                        font.pixelSize: Theme.fontSizeLarge
-                        font.weight: Font.Bold
-                        color: Theme.primary
-                    }
-
-                    DankTextField {
-                        id: searchField
-                        Layout.alignment: Qt.AlignRight
-                        leftIconName: "search"
-                        keyForwardTargets: [root.modalFocusScope]
-                        onTextEdited: searchDebounce.restart()
-                        Keys.onEscapePressed: event => {
-                            root.close();
-                            event.accepted = true;
-                        }
-                    }
-                }
-
-                Timer {
-                    id: searchDebounce
-                    interval: 50
-                    repeat: false
-                    onTriggered: {
-                        mainFlickable.categories = mainFlickable.generateCategories(searchField.text);
-                    }
-                }
-
-                DankFlickable {
-                    id: mainFlickable
-                    width: parent.width
-                    height: parent.height - parent.spacing - 40
-                    contentWidth: rowLayout.implicitWidth
-                    contentHeight: rowLayout.implicitHeight
-                    clip: true
-
-                    Component.onCompleted: root.activeFlickable = mainFlickable
-
-                    property var rawBinds: KeybindsService.cheatsheet.binds || {}
-
-                    function generateCategories(query) {
-                        const lowerQuery = query ? query.toLowerCase().trim() : "";
-                        const lowerQueryWords = query.split(/\s+/);
-                        const processed = {};
-
-                        for (const cat in rawBinds) {
-                            const binds = rawBinds[cat];
-                            const catLower = cat.toLowerCase();
-                            const subcats = {};
-                            let hasSubcats = false;
-                            for (let i = 0; i < binds.length; i++) {
-                                const bind = binds[i];
-                                const keyLower = (bind.key || "").toLowerCase();
-                                const descLower = (bind.desc || "").toLowerCase();
-                                const actionLower = (bind.action || "").toLowerCase();
-
-                                if (bind.hideOnOverlay)
-                                    continue;
-                                let shouldContinue = false;
-                                for (let j = 0; j < lowerQueryWords.length; j++) {
-                                    const word = lowerQueryWords[j];
-                                    if (!(word.length === 0 || keyLower.includes(word) || descLower.includes(word) || catLower.includes(word) || actionLower.includes(word))) {
-                                        shouldContinue = true;
-                                        break;
-                                    }
-                                }
-                                if (shouldContinue)
-                                    continue;
-
-                                if (bind.subcat) {
-                                    hasSubcats = true;
-                                    if (!subcats[bind.subcat])
-                                        subcats[bind.subcat] = [];
-                                    subcats[bind.subcat].push(bind);
-                                } else {
-                                    if (!subcats["_root"])
-                                        subcats["_root"] = [];
-                                    subcats["_root"].push(bind);
-                                }
-                            }
-
-                            if (Object.keys(subcats).length === 0)
-                                continue;
-
-                            processed[cat] = {
-                                hasSubcats: hasSubcats,
-                                subcats: subcats,
-                                subcatKeys: Object.keys(subcats)
-                            };
-                        }
-
-                        return processed;
-                    }
-
-                    property var categories: generateCategories("")
-
-                    function estimateCategoryHeight(catName) {
-                        const catData = categories[catName];
-                        if (!catData)
-                            return 0;
-                        let bindCount = 0;
-                        for (const key of catData.subcatKeys) {
-                            bindCount += catData.subcats[key]?.length || 0;
-                            if (key !== "_root")
-                                bindCount += 1;
-                        }
-                        return 40 + bindCount * 28;
-                    }
-
-                    property var categoryKeys: Object.keys(categories)
-
-                    function distributeCategories(cols) {
-                        const columns = [];
-                        const heights = [];
-                        for (let i = 0; i < cols; i++) {
-                            columns.push([]);
-                            heights.push(0);
-                        }
-                        const sorted = [...categoryKeys].sort((a, b) => estimateCategoryHeight(b) - estimateCategoryHeight(a));
-                        for (const cat of sorted) {
-                            let minIdx = 0;
-                            for (let i = 1; i < cols; i++) {
-                                if (heights[i] < heights[minIdx])
-                                    minIdx = i;
-                            }
-                            columns[minIdx].push(cat);
-                            heights[minIdx] += estimateCategoryHeight(cat);
-                        }
-                        return columns;
-                    }
-
-                    Row {
-                        id: rowLayout
-                        width: mainFlickable.width
-                        spacing: Theme.spacingM
-
-                        property int numColumns: Math.max(1, Math.min(3, Math.floor(width / 350)))
-                        property var columnCategories: mainFlickable.distributeCategories(numColumns)
-
-                        Repeater {
-                            model: rowLayout.numColumns
-
-                            Column {
-                                id: masonryColumn
-                                width: (rowLayout.width - rowLayout.spacing * (rowLayout.numColumns - 1)) / rowLayout.numColumns
-                                spacing: Theme.spacingXL
-
-                                Repeater {
-                                    model: rowLayout.columnCategories[index] || []
-
-                                    Column {
-                                        id: categoryColumn
-                                        width: parent.width
-                                        spacing: Theme.spacingXS
-
-                                        property string catName: modelData
-                                        property var catData: mainFlickable.categories[catName]
-
-                                        StyledText {
-                                            text: categoryColumn.catName
-                                            font.pixelSize: Theme.fontSizeMedium
-                                            font.weight: Font.Bold
-                                            color: Theme.primary
-                                        }
-
-                                        Rectangle {
-                                            width: parent.width
-                                            height: 1
-                                            color: Theme.primary
-                                            opacity: 0.3
-                                        }
-
-                                        Item {
-                                            width: 1
-                                            height: Theme.spacingXS
-                                        }
-
-                                        Column {
-                                            width: parent.width
-                                            spacing: Theme.spacingM
-
-                                            Repeater {
-                                                model: categoryColumn.catData?.subcatKeys || []
-
-                                                Column {
-                                                    width: parent.width
-                                                    spacing: Theme.spacingXS
-
-                                                    property string subcatName: modelData
-                                                    property var subcatBinds: categoryColumn.catData?.subcats?.[subcatName] || []
-
-                                                    StyledText {
-                                                        visible: parent.subcatName !== "_root"
-                                                        text: parent.subcatName
-                                                        font.pixelSize: Theme.fontSizeSmall
-                                                        font.weight: Font.DemiBold
-                                                        color: Theme.primary
-                                                        opacity: 0.7
-                                                    }
-
-                                                    Column {
-                                                        width: parent.width
-                                                        spacing: Theme.spacingXS
-
-                                                        Repeater {
-                                                            model: parent.parent.subcatBinds
-
-                                                            Item {
-                                                                width: parent.width
-                                                                height: 24
-
-                                                                StyledRect {
-                                                                    id: keyBadge
-                                                                    width: Math.min(keyText.implicitWidth + 12, 160)
-                                                                    height: 22
-                                                                    radius: 4
-                                                                    anchors.verticalCenter: parent.verticalCenter
-
-                                                                    StyledText {
-                                                                        id: keyText
-                                                                        anchors.centerIn: parent
-                                                                        color: Theme.secondary
-                                                                        text: (modelData.key || "").replace(/\+/g, " + ")
-                                                                        font.pixelSize: Theme.fontSizeSmall
-                                                                        font.weight: Font.Medium
-                                                                        isMonospace: true
-                                                                        elide: Text.ElideRight
-                                                                        width: Math.min(implicitWidth, 148)
-                                                                    }
-                                                                }
-
-                                                                StyledText {
-                                                                    anchors.left: parent.left
-                                                                    anchors.leftMargin: 170
-                                                                    anchors.right: parent.right
-                                                                    anchors.verticalCenter: parent.verticalCenter
-                                                                    text: modelData.desc || modelData.action || ""
-                                                                    font.pixelSize: Theme.fontSizeSmall
-                                                                    opacity: 0.9
-                                                                    elide: Text.ElideRight
-                                                                    wrapMode: Text.NoWrap
-                                                                }
-                                                            }
-                                                        }
-                                                    }
-                                                }
-                                            }
-                                        }
-                                    }
-                                }
-                            }
-                        }
-                    }
-                }
             }
         }
     }

quickshell/Modals/KeybindsModalOverlay.qml

@@ -0,0 +1,38 @@
+import QtQml
+import QtQuick
+import qs.Common
+import qs.Modals
+import qs.Modals.Common
+import qs.Services
+
+DankModal {
+    id: overlay
+
+    signal floatingToggleRequested
+
+    layerNamespace: "dms:keybinds"
+    useOverlayLayer: true
+    property real _maxW: Math.min(overlay.screenWidth * 0.92, 1200)
+    property real _maxH: Math.min(overlay.screenHeight * 0.92, 900)
+    modalWidth: _maxW
+    modalHeight: _maxH
+    onBackgroundClicked: close()
+    onOpened: {
+        Qt.callLater(() => {
+            modalFocusScope.forceActiveFocus();
+            if (contentLoader.item?.searchField)
+                contentLoader.item.searchField.forceActiveFocus();
+        });
+        if (!Object.keys(KeybindsService.cheatsheet).length && KeybindsService.cheatsheetAvailable)
+            KeybindsService.loadCheatsheet();
+    }
+
+    content: Component {
+        KeybindsContent {
+            showFloatingToggle: true
+            floating: false
+            onCloseRequested: overlay.close()
+            onFloatingToggleRequested: overlay.floatingToggleRequested()
+        }
+    }
+}

quickshell/Modals/KeybindsModalWindow.qml

@@ -0,0 +1,140 @@
+import QtQuick
+import Quickshell
+import qs.Common
+import qs.Modals
+import qs.Services
+import qs.Widgets
+
+FloatingWindow {
+    id: win
+
+    property bool disablePopupTransparency: true
+    property alias shouldBeVisible: win.visible
+
+    signal floatingToggleRequested
+
+    function show() {
+        visible = true;
+    }
+
+    function hide() {
+        visible = false;
+    }
+
+    function toggle() {
+        visible = !visible;
+    }
+
+    objectName: "keybindsModalWindow"
+    title: I18n.tr("Keybinds")
+    minimumSize: Qt.size(Math.min(560, Screen.width), Math.min(400, Screen.height))
+    implicitWidth: 1000
+    implicitHeight: screen ? Math.min(820, screen.height - 100) : 820
+    color: Theme.surfaceContainer
+    visible: false
+
+    onVisibleChanged: {
+        if (!visible)
+            return;
+        if (!Object.keys(KeybindsService.cheatsheet).length && KeybindsService.cheatsheetAvailable)
+            KeybindsService.loadCheatsheet();
+        Qt.callLater(() => {
+            keybindsContent.forceActiveFocus();
+            keybindsContent.searchField.forceActiveFocus();
+        });
+    }
+
+    onClosed: win.visible = false
+
+    Column {
+        anchors.fill: parent
+        spacing: 0
+
+        Item {
+            width: parent.width
+            height: 48
+            z: 10
+
+            MouseArea {
+                anchors.fill: parent
+                onPressed: windowControls.tryStartMove()
+                onDoubleClicked: windowControls.tryToggleMaximize()
+            }
+
+            Rectangle {
+                anchors.fill: parent
+                color: Theme.surfaceContainer
+                opacity: 0.5
+            }
+
+            Row {
+                anchors.left: parent.left
+                anchors.leftMargin: Theme.spacingL
+                anchors.verticalCenter: parent.verticalCenter
+                spacing: Theme.spacingM
+
+                DankIcon {
+                    name: "keyboard"
+                    size: Theme.iconSize
+                    color: Theme.primary
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                StyledText {
+                    text: KeybindsService.cheatsheet.title || I18n.tr("Keybinds")
+                    font.pixelSize: Theme.fontSizeXLarge
+                    color: Theme.surfaceText
+                    font.weight: Font.Medium
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+            }
+
+            Row {
+                anchors.right: parent.right
+                anchors.rightMargin: Theme.spacingM
+                anchors.verticalCenter: parent.verticalCenter
+                spacing: Theme.spacingXS
+
+                DankActionButton {
+                    circular: false
+                    iconName: "close_fullscreen"
+                    iconSize: Theme.iconSize - 4
+                    iconColor: Theme.surfaceText
+                    tooltipText: I18n.tr("Dock window")
+                    onClicked: win.floatingToggleRequested()
+                }
+
+                DankActionButton {
+                    visible: windowControls.canMaximize
+                    circular: false
+                    iconName: win.maximized ? "fullscreen_exit" : "fullscreen"
+                    iconSize: Theme.iconSize - 4
+                    iconColor: Theme.surfaceText
+                    onClicked: windowControls.tryToggleMaximize()
+                }
+
+                DankActionButton {
+                    circular: false
+                    iconName: "close"
+                    iconSize: Theme.iconSize - 4
+                    iconColor: Theme.surfaceText
+                    onClicked: win.hide()
+                }
+            }
+        }
+
+        KeybindsContent {
+            id: keybindsContent
+            width: parent.width
+            height: parent.height - 48
+            showFloatingToggle: false
+            floating: true
+            onCloseRequested: win.hide()
+        }
+    }
+
+    FloatingWindowControls {
+        id: windowControls
+        targetWindow: win
+    }
+}

quickshell/Modals/PowerMenuModal.qml

@@ -11,6 +11,7 @@ DankModal {
 
     layerNamespace: "dms:power-menu"
     keepPopoutsOpen: true
+    useOverlayLayer: true
 
     property int selectedIndex: 0
     property int selectedRow: 0

quickshell/Modals/Settings/SettingsContent.qml

@@ -1,6 +1,7 @@
 import QtQuick
 import qs.Common
 import qs.Modules.Settings
+import qs.Services
 import qs.Widgets
 
 FocusScope {
@@ -232,7 +233,52 @@ FocusScope {
             visible: active
             focus: active
 
-            sourceComponent: NetworkTab {}
+            sourceComponent: NetworkStatusTab {}
+
+            onActiveChanged: {
+                if (active && item)
+                    Qt.callLater(() => item.forceActiveFocus());
+            }
+        }
+
+        Loader {
+            id: networkEthernetLoader
+            anchors.fill: parent
+            active: root.currentIndex === 39
+            visible: active
+            focus: active
+
+            sourceComponent: NetworkEthernetTab {}
+
+            onActiveChanged: {
+                if (active && item)
+                    Qt.callLater(() => item.forceActiveFocus());
+            }
+        }
+
+        Loader {
+            id: networkWifiLoader
+            anchors.fill: parent
+            active: root.currentIndex === 40
+            visible: active
+            focus: active
+
+            sourceComponent: NetworkWifiTab {}
+
+            onActiveChanged: {
+                if (active && item)
+                    Qt.callLater(() => item.forceActiveFocus());
+            }
+        }
+
+        Loader {
+            id: networkVpnLoader
+            anchors.fill: parent
+            active: root.currentIndex === 41
+            visible: active
+            focus: active
+
+            sourceComponent: NetworkVpnTab {}
 
             onActiveChanged: {
                 if (active && item)

quickshell/Modals/Settings/SettingsModal.qml

@@ -53,20 +53,21 @@ FloatingWindow {
         visible = !visible;
     }
 
+    function setTabIndex(tabIndex: int) {
+        if (tabIndex < 0)
+            return;
+        currentTabIndex = tabIndex;
+        sidebar.autoExpandForTab(tabIndex);
+    }
+
     function showWithTab(tabIndex: int) {
-        if (tabIndex >= 0) {
+        setTabIndex(tabIndex);
-            currentTabIndex = tabIndex;
-            sidebar.autoExpandForTab(tabIndex);
-        }
         visible = true;
     }
 
     function showWithTabName(tabName: string) {
         var idx = sidebar.resolveTabIndex(tabName);
-        if (idx >= 0) {
+        setTabIndex(idx);
-            currentTabIndex = idx;
-            sidebar.autoExpandForTab(idx);
-        }
         visible = true;
     }
 

quickshell/Modals/Settings/SettingsSidebar.qml

@@ -238,8 +238,33 @@ Rectangle {
             "id": "network",
             "text": I18n.tr("Network"),
             "icon": "wifi",
-            "tabIndex": 7,
+            "dmsOnly": true,
-            "dmsOnly": true
+            "children": [
+                {
+                    "id": "network_status",
+                    "text": I18n.tr("Status"),
+                    "icon": "lan",
+                    "tabIndex": 7
+                },
+                {
+                    "id": "network_ethernet",
+                    "text": I18n.tr("Ethernet"),
+                    "icon": "settings_ethernet",
+                    "tabIndex": 39
+                },
+                {
+                    "id": "network_wifi",
+                    "text": I18n.tr("WiFi"),
+                    "icon": "wifi",
+                    "tabIndex": 40
+                },
+                {
+                    "id": "network_vpn",
+                    "text": I18n.tr("VPN"),
+                    "icon": "vpn_key",
+                    "tabIndex": 41
+                }
+            ]
         },
         {
             "id": "applications",

quickshell/Modals/WifiPasswordModal.qml

@@ -1,12 +1,22 @@
 import QtQuick
-import Quickshell
 import qs.Common
+import qs.Modals.Common
 import qs.Services
 import qs.Widgets
 
-FloatingWindow {
+DankModal {
     id: root
 
+    layerNamespace: "dms:wifi-password"
+    keepPopoutsOpen: true
+    allowStacking: true
+    shouldBeVisible: false
+    modalWidth: 420
+    modalHeight: calculatedHeight
+    enableShadow: true
+    onBackgroundClicked: clearAndClose()
+    directContent: contentFocusScope
+
     property bool disablePopupTransparency: true
     property string wifiPasswordSSID: ""
     property string wifiPasswordInput: ""
@@ -102,7 +112,7 @@ FloatingWindow {
         const network = NetworkService.wifiNetworks.find(n => n.ssid === ssid);
         requiresEnterprise = network?.enterprise || false;
 
-        visible = true;
+        open();
         Qt.callLater(focusFirstField);
     }
 
@@ -126,7 +136,7 @@ FloatingWindow {
         secretValues = {};
         requiresEnterprise = false;
 
-        visible = true;
+        open();
         Qt.callLater(focusFirstField);
     }
 
@@ -144,6 +154,7 @@ FloatingWindow {
 
         isVpnPrompt = (connectionType === "vpn" || connectionType === "wireguard");
         wifiPasswordSSID = isVpnPrompt ? connectionName : ssid;
+        savePasswordCheckbox.checked = !isVpnPrompt;
 
         requiresEnterprise = setting === "802-1x";
 
@@ -152,7 +163,7 @@ FloatingWindow {
         wifiAnonymousIdentityInput = "";
         wifiDomainInput = "";
 
-        visible = true;
+        open();
         Qt.callLater(() => {
             if (reason === "wrong-password" && fieldsInfo.length === 0) {
                 passwordInput.text = "";
@@ -162,7 +173,7 @@ FloatingWindow {
     }
 
     function hide() {
-        visible = false;
+        close();
     }
 
     function getFieldLabel(fieldName) {
@@ -242,23 +253,8 @@ FloatingWindow {
         secretValues = {};
     }
 
-    objectName: "wifiPasswordModal"
+    onShouldBeVisibleChanged: {
-    title: {
+        if (shouldBeVisible) {
-        if (promptReason === "pkcs11")
-            return I18n.tr("Smartcard PIN");
-        if (isVpnPrompt)
-            return I18n.tr("VPN Password");
-        if (isHiddenNetwork)
-            return I18n.tr("Hidden Network");
-        return I18n.tr("Wi-Fi Password");
-    }
-    minimumSize: Qt.size(420, calculatedHeight)
-    maximumSize: Qt.size(420, calculatedHeight)
-    color: Theme.surfaceContainer
-    visible: false
-
-    onVisibleChanged: {
-        if (visible) {
             Qt.callLater(focusFirstField);
             return;
         }
@@ -287,7 +283,7 @@ FloatingWindow {
                 return;
             wifiPasswordSSID = NetworkService.connectingSSID;
             wifiPasswordInput = "";
-            visible = true;
+            open();
             NetworkService.passwordDialogShouldReopen = false;
         }
     }
@@ -296,7 +292,7 @@ FloatingWindow {
         id: contentFocusScope
 
         anchors.fill: parent
-        focus: true
+        focus: root.shouldBeVisible
 
         Keys.onEscapePressed: event => {
             clearAndClose();
@@ -318,8 +314,6 @@ FloatingWindow {
                     anchors.right: buttonRow.left
                     anchors.rightMargin: Theme.spacingM
                     height: headerCol.height
-                    onPressed: windowControls.tryStartMove()
-                    onDoubleClicked: windowControls.tryToggleMaximize()
 
                     Column {
                         id: headerCol
@@ -380,14 +374,6 @@ FloatingWindow {
                     anchors.right: parent.right
                     spacing: Theme.spacingXS
 
-                    DankActionButton {
-                        visible: windowControls.canMaximize
-                        iconName: root.maximized ? "fullscreen_exit" : "fullscreen"
-                        iconSize: Theme.iconSize - 4
-                        iconColor: Theme.surfaceText
-                        onClicked: windowControls.tryToggleMaximize()
-                    }
-
                     DankActionButton {
                         iconName: "close"
                         iconSize: Theme.iconSize - 4
@@ -419,7 +405,7 @@ FloatingWindow {
                     textColor: Theme.surfaceText
                     placeholderText: I18n.tr("Network Name (SSID)")
                     backgroundColor: "transparent"
-                    enabled: root.visible
+                    enabled: root.shouldBeVisible
                     keyNavigationTab: passwordInput
                     onAccepted: passwordInput.forceActiveFocus()
                 }
@@ -449,7 +435,7 @@ FloatingWindow {
                         echoMode: modelData.isSecret && !passwordVisible ? TextInput.Password : TextInput.Normal
                         placeholderText: getFieldLabel(modelData.name)
                         backgroundColor: "transparent"
-                        enabled: root.visible
+                        enabled: root.shouldBeVisible
 
                         Keys.onTabPressed: event => {
                             if (index < fieldsInfo.length - 1) {
@@ -519,7 +505,7 @@ FloatingWindow {
                     text: wifiUsernameInput
                     placeholderText: I18n.tr("Username")
                     backgroundColor: "transparent"
-                    enabled: root.visible
+                    enabled: root.shouldBeVisible
                     keyNavigationTab: passwordInput
                     keyNavigationBacktab: domainMatchInput
                     onTextEdited: wifiUsernameInput = text
@@ -552,7 +538,7 @@ FloatingWindow {
                     echoMode: passwordVisible ? TextInput.Normal : TextInput.Password
                     placeholderText: (requiresEnterprise && !isVpnPrompt) ? I18n.tr("Password") : ""
                     backgroundColor: "transparent"
-                    enabled: root.visible
+                    enabled: root.shouldBeVisible
                     keyNavigationTab: (requiresEnterprise && !isVpnPrompt) ? anonInput : null
                     keyNavigationBacktab: (requiresEnterprise && !isVpnPrompt) ? usernameInput : null
                     onTextEdited: wifiPasswordInput = text
@@ -589,7 +575,7 @@ FloatingWindow {
                     text: wifiAnonymousIdentityInput
                     placeholderText: I18n.tr("Anonymous Identity (optional)")
                     backgroundColor: "transparent"
-                    enabled: root.visible
+                    enabled: root.shouldBeVisible
                     keyNavigationTab: domainMatchInput
                     keyNavigationBacktab: passwordInput
                     onTextEdited: wifiAnonymousIdentityInput = text
@@ -620,7 +606,7 @@ FloatingWindow {
                     text: wifiDomainInput
                     placeholderText: I18n.tr("Domain (optional)")
                     backgroundColor: "transparent"
-                    enabled: root.visible
+                    enabled: root.shouldBeVisible
                     keyNavigationTab: usernameInput
                     keyNavigationBacktab: anonInput
                     onTextEdited: wifiDomainInput = text
@@ -757,8 +743,5 @@ FloatingWindow {
         }
     }
 
-    FloatingWindowControls {
+    onOpened: Qt.callLater(() => contentFocusScope.forceActiveFocus())
-        id: windowControls
-        targetWindow: root
-    }
 }

quickshell/Modules/ControlCenter/BuiltinPlugins/TailscaleWidget.qml

@@ -25,7 +25,14 @@ PluginComponent {
     }
     ccWidgetIsActive: TailscaleService.connected
 
-    onCcWidgetToggled: {}
+    onCcWidgetToggled: {
+        if (!TailscaleService.available)
+            return;
+        if (TailscaleService.connected)
+            TailscaleService.disconnectTailscale(null);
+        else
+            TailscaleService.connectTailscale(null);
+    }
 
     ccDetailContent: Component {
         Rectangle {
@@ -88,6 +95,122 @@ PluginComponent {
                         width: parent.width
                         spacing: Theme.spacingS
 
+                        // Connection status + connect/disconnect. Always shown
+                        // (when available) so the connection can be toggled from
+                        // the detail, including while disconnected.
+                        RowLayout {
+                            width: parent.width
+                            spacing: Theme.spacingS
+
+                            Column {
+                                Layout.fillWidth: true
+                                Layout.alignment: Qt.AlignVCenter
+                                spacing: 1
+
+                                StyledText {
+                                    text: TailscaleService.connected ? I18n.tr("Connected", "Tailscale connection status: connected") : I18n.tr("Disconnected", "Tailscale connection status: disconnected")
+                                    font.pixelSize: Theme.fontSizeMedium
+                                    font.weight: Font.Medium
+                                    color: Theme.surfaceText
+                                }
+
+                                StyledText {
+                                    visible: TailscaleService.connected && TailscaleService.tailnetName.length > 0
+                                    text: TailscaleService.tailnetName
+                                    font.pixelSize: Theme.fontSizeSmall
+                                    color: Theme.surfaceVariantText
+                                    width: parent.width
+                                    elide: Text.ElideRight
+                                }
+                            }
+
+                            Rectangle {
+                                id: connButton
+                                Layout.alignment: Qt.AlignVCenter
+                                height: 28
+                                radius: 14
+                                width: connButtonRow.implicitWidth + Theme.spacingM * 2
+
+                                readonly property bool isConnected: TailscaleService.connected
+                                color: isConnected ? (connButtonArea.containsMouse ? Theme.errorHover : Theme.surfaceLight) : (connButtonArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceLight)
+
+                                Row {
+                                    id: connButtonRow
+                                    anchors.centerIn: parent
+                                    spacing: Theme.spacingXS
+
+                                    DankIcon {
+                                        name: connButton.isConnected ? "link_off" : "link"
+                                        size: Theme.fontSizeSmall
+                                        color: connButton.isConnected ? Theme.surfaceText : Theme.primary
+                                        anchors.verticalCenter: parent.verticalCenter
+                                    }
+
+                                    StyledText {
+                                        text: connButton.isConnected ? I18n.tr("Disconnect", "Tailscale disconnect button") : I18n.tr("Connect", "Tailscale connect button")
+                                        font.pixelSize: Theme.fontSizeSmall
+                                        font.weight: Font.Medium
+                                        color: connButton.isConnected ? Theme.surfaceText : Theme.primary
+                                        anchors.verticalCenter: parent.verticalCenter
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: connButtonArea
+                                    anchors.fill: parent
+                                    hoverEnabled: true
+                                    cursorShape: Qt.PointingHandCursor
+                                    onClicked: {
+                                        if (TailscaleService.connected)
+                                            TailscaleService.disconnectTailscale(null);
+                                        else
+                                            TailscaleService.connectTailscale(null);
+                                    }
+                                }
+                            }
+                        }
+
+                        // Connection controls: exit node picker + LAN access.
+                        // Only meaningful while the backend is connected.
+                        Column {
+                            id: controlsColumn
+                            width: parent.width
+                            spacing: Theme.spacingS
+                            visible: TailscaleService.connected
+
+                            readonly property string noneLabel: I18n.tr("None", "Tailscale exit node: none selected")
+
+                            DankDropdown {
+                                width: parent.width
+                                text: I18n.tr("Exit node", "Tailscale exit node selector label")
+                                currentValue: TailscaleService.currentExitNode ? TailscaleService.currentExitNode.hostname : controlsColumn.noneLabel
+                                options: {
+                                    const opts = [controlsColumn.noneLabel];
+                                    for (const p of TailscaleService.exitNodeOptions)
+                                        opts.push(p.hostname);
+                                    return opts;
+                                }
+                                onValueChanged: value => {
+                                    if (value === controlsColumn.noneLabel) {
+                                        TailscaleService.clearExitNode(null);
+                                        return;
+                                    }
+                                    const peer = TailscaleService.exitNodeOptions.find(p => p.hostname === value);
+                                    if (peer)
+                                        TailscaleService.setExitNode(peer.id, null);
+                                }
+                            }
+
+                            DankToggle {
+                                width: parent.width
+                                text: I18n.tr("Allow LAN access", "Tailscale allow LAN access toggle")
+                                description: I18n.tr("Reach local network devices while using an exit node", "Tailscale allow LAN access description")
+                                visible: TailscaleService.currentExitNode !== null
+                                checked: TailscaleService.exitNodeAllowLanAccess
+                                onToggled: value => TailscaleService.setAllowLanAccess(value, null)
+                            }
+                        }
+
                         // Search bar + refresh button
                         RowLayout {
                             width: parent.width

quickshell/Modules/ControlCenter/ControlCenterPopout.qml

@@ -93,7 +93,7 @@ DankPopout {
     shouldBeVisible: false
 
     property bool credentialsPromptOpen: NetworkService.credentialsRequested
-    property bool wifiPasswordModalOpen: PopoutService.wifiPasswordModal?.visible ?? false
+    property bool wifiPasswordModalOpen: PopoutService.wifiPasswordModal?.shouldBeVisible ?? false
     property bool polkitModalOpen: PopoutService.polkitAuthModal?.visible ?? false
     property bool anyModalOpen: credentialsPromptOpen || wifiPasswordModalOpen || polkitModalOpen || powerMenuOpen
 

quickshell/Modules/ControlCenter/Details/NetworkDetail.qml

@@ -2,6 +2,7 @@ import QtQuick
 import QtQuick.Controls
 import Quickshell
 import qs.Common
+import qs.Modules.Network
 import qs.Services
 import qs.Widgets
 import qs.Modals
@@ -151,7 +152,7 @@ Rectangle {
                 iconColor: Theme.surfaceVariantText
                 onClicked: {
                     PopoutService.closeControlCenter();
-                    PopoutService.openSettingsWithTab("network");
+                    PopoutService.openSettingsWithTab(currentPreferenceIndex === 0 ? "network_ethernet" : "network_wifi");
                 }
             }
         }
@@ -721,7 +722,7 @@ Rectangle {
 
             DankActionButton {
                 id: qrCodeButton
-                visible: modelData.secured && modelData.saved
+                visible: modelData.secured && modelData.saved && !(modelData.enterprise || false)
                 anchors.right: parent.right
                 anchors.rightMargin: optionsButton.width + pinWifiRow.width + 3 * Theme.spacingM + Theme.spacingS
                 anchors.verticalCenter: parent.verticalCenter
@@ -749,11 +750,9 @@ Rectangle {
                         event.accepted = true;
                         return;
                     }
-                    if (modelData.secured && !modelData.saved && (DMSService.apiVersion < 7 || modelData.enterprise)) {
+                    WifiConnectionActions.connectToNetwork(modelData, {
-                        PopoutService.showWifiPasswordModal(modelData.ssid);
+                        connected: wifiDelegate.isConnected
-                    } else {
+                    });
-                        NetworkService.connectToWifi(modelData.ssid);
-                    }
                     event.accepted = true;
                 }
             }
@@ -804,15 +803,9 @@ Rectangle {
             }
 
             onTriggered: {
-                if (networkContextMenu.currentConnected) {
+                WifiConnectionActions.connectToNetworkFromDetails(networkContextMenu.currentSSID, networkContextMenu.currentSecured, networkContextMenu.currentSaved, networkContextMenu.currentEnterprise, networkContextMenu.currentConnected, {
-                    NetworkService.disconnectWifi();
+                    disconnectWhenConnected: true
-                    return;
+                });
-                }
-                if (networkContextMenu.currentSecured && !networkContextMenu.currentSaved && (DMSService.apiVersion < 7 || networkContextMenu.currentEnterprise)) {
-                    PopoutService.showWifiPasswordModal(networkContextMenu.currentSSID);
-                    return;
-                }
-                NetworkService.connectToWifi(networkContextMenu.currentSSID);
             }
         }
 

quickshell/Modules/DankBar/CenterSection.qml

@@ -15,6 +15,7 @@ Item {
     property real barSpacing: 4
     property var barConfig: null
     property var blurBarWindow: null
+    property real sectionAvailablePrimarySize: 0
     property bool overrideAxisLayout: false
     property bool forceVerticalLayout: false
 
@@ -359,6 +360,7 @@ Item {
                 barSpacing: root.barSpacing
                 barConfig: root.barConfig
                 blurBarWindow: root.blurBarWindow
+                sectionAvailablePrimarySize: root.sectionAvailablePrimarySize
                 isFirst: index === 0
                 isLast: index === centerRepeater.count - 1
                 sectionSpacing: parent.itemSpacing

quickshell/Modules/DankBar/DankBarContent.qml

@@ -497,6 +497,7 @@ Item {
                 widgetThickness: barWindow.widgetThickness
                 barThickness: barWindow.effectiveBarThickness
                 barSpacing: barConfig?.spacing ?? 4
+                sectionAvailablePrimarySize: Math.max(1, hCenterSection.x > 0 ? hCenterSection.x : parent.width / 3)
             }
 
             Binding {
@@ -529,6 +530,7 @@ Item {
                 widgetThickness: barWindow.widgetThickness
                 barThickness: barWindow.effectiveBarThickness
                 barSpacing: barConfig?.spacing ?? 4
+                sectionAvailablePrimarySize: Math.max(1, hCenterSection.x > 0 ? parent.width - (hCenterSection.x + hCenterSection.width) : parent.width / 3)
             }
 
             Binding {
@@ -561,6 +563,7 @@ Item {
                 widgetThickness: barWindow.widgetThickness
                 barThickness: barWindow.effectiveBarThickness
                 barSpacing: barConfig?.spacing ?? 4
+                sectionAvailablePrimarySize: Math.max(1, hRightSection.x > 0 ? hRightSection.x - (hLeftSection.x + hLeftSection.width) : parent.width / 3)
             }
 
             Binding {
@@ -600,6 +603,7 @@ Item {
                 widgetThickness: barWindow.widgetThickness
                 barThickness: barWindow.effectiveBarThickness
                 barSpacing: barConfig?.spacing ?? 4
+                sectionAvailablePrimarySize: Math.max(1, vCenterSection.y > 0 ? vCenterSection.y : parent.height / 3)
             }
 
             Binding {
@@ -633,6 +637,7 @@ Item {
                 widgetThickness: barWindow.widgetThickness
                 barThickness: barWindow.effectiveBarThickness
                 barSpacing: barConfig?.spacing ?? 4
+                sectionAvailablePrimarySize: Math.max(1, vRightSection.y > 0 ? vRightSection.y - (vLeftSection.y + vLeftSection.height) : parent.height / 3)
             }
 
             Binding {
@@ -667,6 +672,7 @@ Item {
                 widgetThickness: barWindow.widgetThickness
                 barThickness: barWindow.effectiveBarThickness
                 barSpacing: barConfig?.spacing ?? 4
+                sectionAvailablePrimarySize: Math.max(1, vCenterSection.y > 0 ? parent.height - (vCenterSection.y + vCenterSection.height) : parent.height / 3)
             }
 
             Binding {

quickshell/Modules/DankBar/LeftSection.qml

@@ -14,6 +14,7 @@ Item {
     property real barSpacing: 4
     property var barConfig: null
     property var blurBarWindow: null
+    property real sectionAvailablePrimarySize: 0
     property bool overrideAxisLayout: false
     property bool forceVerticalLayout: false
 
@@ -61,6 +62,7 @@ Item {
                         barSpacing: root.barSpacing
                         barConfig: root.barConfig
                         blurBarWindow: root.blurBarWindow
+                        sectionAvailablePrimarySize: root.sectionAvailablePrimarySize
                         isFirst: index === 0
                         isLast: index === rowRepeater.count - 1
                         sectionSpacing: parent.rowSpacing
@@ -106,6 +108,7 @@ Item {
                         barSpacing: root.barSpacing
                         barConfig: root.barConfig
                         blurBarWindow: root.blurBarWindow
+                        sectionAvailablePrimarySize: root.sectionAvailablePrimarySize
                         isFirst: index === 0
                         isLast: index === columnRepeater.count - 1
                         sectionSpacing: parent.columnSpacing

quickshell/Modules/DankBar/RightSection.qml

@@ -14,6 +14,7 @@ Item {
     property real barSpacing: 4
     property var barConfig: null
     property var blurBarWindow: null
+    property real sectionAvailablePrimarySize: 0
     property bool overrideAxisLayout: false
     property bool forceVerticalLayout: false
 
@@ -63,6 +64,7 @@ Item {
                         barSpacing: root.barSpacing
                         barConfig: root.barConfig
                         blurBarWindow: root.blurBarWindow
+                        sectionAvailablePrimarySize: root.sectionAvailablePrimarySize
                         isFirst: index === 0
                         isLast: index === rowRepeater.count - 1
                         sectionSpacing: parent.rowSpacing
@@ -108,6 +110,7 @@ Item {
                         barSpacing: root.barSpacing
                         barConfig: root.barConfig
                         blurBarWindow: root.blurBarWindow
+                        sectionAvailablePrimarySize: root.sectionAvailablePrimarySize
                         isFirst: index === 0
                         isLast: index === columnRepeater.count - 1
                         sectionSpacing: parent.columnSpacing

quickshell/Modules/DankBar/WidgetHost.qml

@@ -17,6 +17,7 @@ Loader {
     property real barSpacing: 4
     property var barConfig: null
     property var blurBarWindow: null
+    property real sectionAvailablePrimarySize: 0
     property bool isFirst: false
     property bool isLast: false
     property real sectionSpacing: 0
@@ -141,6 +142,14 @@ Loader {
         restoreMode: Binding.RestoreNone
     }
 
+    Binding {
+        target: root.item
+        when: root.item && "sectionAvailablePrimarySize" in root.item
+        property: "sectionAvailablePrimarySize"
+        value: root.sectionAvailablePrimarySize
+        restoreMode: Binding.RestoreNone
+    }
+
     Binding {
         target: root.item
         when: root.item && "isLeftBarEdge" in root.item

quickshell/Modules/DankBar/Widgets/RunningApps.qml

@@ -18,6 +18,14 @@ BasePill {
 
     property var widgetData: null
     property var hoveredItem: null
+
+    onHoveredItemChanged: {
+        if (hoveredItem)
+            return;
+        if (tooltipLoader.item)
+            tooltipLoader.item.hide();
+        tooltipLoader.active = false;
+    }
     property var topBar: null
     property bool isAutoHideBar: false
     property Item windowRoot: (Window.window ? Window.window.contentItem : null)
@@ -236,6 +244,11 @@ BasePill {
                 delegate: Item {
                     id: delegateItem
 
+                    Component.onDestruction: {
+                        if (root.hoveredItem === delegateItem)
+                            root.hoveredItem = null;
+                    }
+
                     property bool isGrouped: root._groupByApp
                     property var groupData: isGrouped ? modelData : null
                     property var toplevelData: isGrouped ? (modelData.windows.length > 0 ? modelData.windows[0].toplevel : null) : modelData
@@ -461,14 +474,8 @@ BasePill {
                             }
                         }
                         onExited: {
-                            if (root.hoveredItem === delegateItem) {
+                            if (root.hoveredItem === delegateItem)
                                 root.hoveredItem = null;
-                                if (tooltipLoader.item) {
-                                    tooltipLoader.item.hide();
-                                }
-
-                                tooltipLoader.active = false;
-                            }
                         }
                     }
                 }
@@ -491,6 +498,11 @@ BasePill {
                 delegate: Item {
                     id: delegateItem
 
+                    Component.onDestruction: {
+                        if (root.hoveredItem === delegateItem)
+                            root.hoveredItem = null;
+                    }
+
                     property bool isGrouped: root._groupByApp
                     property var groupData: isGrouped ? modelData : null
                     property var toplevelData: isGrouped ? (modelData.windows.length > 0 ? modelData.windows[0].toplevel : null) : modelData
@@ -715,14 +727,8 @@ BasePill {
                             }
                         }
                         onExited: {
-                            if (root.hoveredItem === delegateItem) {
+                            if (root.hoveredItem === delegateItem)
                                 root.hoveredItem = null;
-                                if (tooltipLoader.item) {
-                                    tooltipLoader.item.hide();
-                                }
-
-                                tooltipLoader.active = false;
-                            }
                         }
                     }
                 }

quickshell/Modules/DankBar/Widgets/SystemTrayBar.qml

@@ -22,6 +22,10 @@ BasePill {
     property bool isAtBottom: false
     property bool isAutoHideBar: false
     property bool useOverflowPopup: !widgetData?.trayUseInlineExpansion
+    property bool useSingleLineOverflowPopup: widgetData?.trayPopupSingleLine ?? SettingsData.trayPopupSingleLine
+    property bool useAutomaticOverflow: widgetData?.trayAutoOverflow ?? SettingsData.trayAutoOverflow
+    property int configuredMaxVisibleItems: widgetData?.trayMaxVisibleItems ?? SettingsData.trayMaxVisibleItems
+    property real sectionAvailablePrimarySize: 0
     readonly property var hiddenTrayIds: {
         const envValue = Quickshell.env("DMS_HIDE_TRAYIDS") || "";
         return envValue ? envValue.split(",").map(id => id.trim().toLowerCase()) : [];
@@ -146,12 +150,32 @@ BasePill {
 
     readonly property var allSortedTrayItems: sortByPreferredOrder(allTrayItems, _trayOrderTrigger)
     readonly property var allSortedTrayItemKeys: allSortedTrayItems.map(item => getTrayItemKey(item))
-    readonly property var mainBarItemsRaw: allSortedTrayItems.filter(item => !SessionData.isHiddenTrayId(root.getTrayItemKey(item)))
+    readonly property var visibleSortedTrayItems: allSortedTrayItems.filter(item => !SessionData.isHiddenTrayId(root.getTrayItemKey(item)))
+    readonly property int automaticVisibleItemLimit: {
+        if (!root.useAutomaticOverflow)
+            return root.visibleSortedTrayItems.length;
+
+        const explicitLimit = Number(root.configuredMaxVisibleItems || 0);
+        if (explicitLimit > 0)
+            return Math.max(1, Math.min(root.visibleSortedTrayItems.length, explicitLimit));
+
+        const scale = (typeof CompositorService !== "undefined" && CompositorService.getScreenScale) ? Math.max(1, CompositorService.getScreenScale(root.parentScreen)) : 1;
+        const sectionPrimary = root.sectionAvailablePrimarySize > 0 ? root.sectionAvailablePrimarySize : (root.isVerticalOrientation ? (root.parentScreen?.height || 0) : (root.parentScreen?.width || 0));
+        const logicalPrimary = sectionPrimary > 0 ? (sectionPrimary / scale) : 640;
+        const maxTrayShare = root.isVerticalOrientation ? 0.55 : 0.50;
+        const itemSize = Math.max(1, root.trayItemSize);
+        const slots = Math.floor((logicalPrimary * maxTrayShare) / itemSize);
+        return Math.max(2, Math.min(10, Math.min(root.visibleSortedTrayItems.length, slots)));
+    }
+    readonly property var mainBarItemsRaw: visibleSortedTrayItems.slice(0, automaticVisibleItemLimit)
     readonly property var mainBarItems: mainBarItemsRaw.map((item, idx) => ({
                 key: getTrayItemKey(item),
                 item: item
             }))
-    readonly property var hiddenBarItems: allSortedTrayItems.filter(item => SessionData.isHiddenTrayId(root.getTrayItemKey(item)))
+    readonly property var autoOverflowBarItems: visibleSortedTrayItems.slice(automaticVisibleItemLimit)
+    readonly property var manualHiddenBarItems: allSortedTrayItems.filter(item => SessionData.isHiddenTrayId(root.getTrayItemKey(item)))
+    readonly property var hiddenBarItemKeys: manualHiddenBarItems.concat(autoOverflowBarItems).map(item => root.getTrayItemKey(item))
+    readonly property var hiddenBarItems: allSortedTrayItems.filter(item => hiddenBarItemKeys.indexOf(root.getTrayItemKey(item)) !== -1)
     readonly property string trayIconTintMode: {
         const configuredMode = SettingsData.systemTrayIconTintMode || "none";
         switch (configuredMode) {
@@ -219,6 +243,10 @@ BasePill {
 
         const fromKey = mainBarItems[visibleFromIndex]?.key ?? null;
         const toKey = mainBarItems[visibleToIndex]?.key ?? null;
+        moveTrayItemKeyInFullOrder(fromKey, toKey);
+    }
+
+    function moveTrayItemKeyInFullOrder(fromKey, toKey) {
         if (!fromKey || !toKey)
             return;
 
@@ -233,10 +261,103 @@ BasePill {
         SessionData.setTrayItemOrder(fullOrder);
     }
 
+    function promoteTrayItemToBar(item) {
+        const itemKey = getTrayItemKey(item);
+        if (!itemKey)
+            return;
+        if (SessionData.isHiddenTrayId(itemKey)) {
+            SessionData.showTrayId(itemKey);
+            return;
+        }
+
+        const fullOrder = [...allSortedTrayItemKeys];
+        const fromIndex = fullOrder.indexOf(itemKey);
+        if (fromIndex < 0)
+            return;
+        const movedKey = fullOrder.splice(fromIndex, 1)[0];
+        const targetIndex = Math.max(0, Math.min(root.automaticVisibleItemLimit - 1, fullOrder.length));
+        fullOrder.splice(targetIndex, 0, movedKey);
+        SessionData.setTrayItemOrder(fullOrder);
+    }
+
+    function isManualHiddenTrayItem(item) {
+        return SessionData.isHiddenTrayId(getTrayItemKey(item));
+    }
+
+    function isAutoOverflowTrayItem(item) {
+        const key = getTrayItemKey(item);
+        return key && !isManualHiddenTrayItem(item) && root.autoOverflowBarItems.some(overflowItem => getTrayItemKey(overflowItem) === key);
+    }
+
+    function dragShiftOffset(index, draggedIndex, dropTargetIndex, shiftAmount) {
+        if (draggedIndex < 0 || index === draggedIndex || dropTargetIndex < 0)
+            return 0;
+        if (draggedIndex < dropTargetIndex && index > draggedIndex && index <= dropTargetIndex)
+            return -shiftAmount;
+        if (draggedIndex > dropTargetIndex && index >= dropTargetIndex && index < draggedIndex)
+            return shiftAmount;
+        return 0;
+    }
+
+    function beginMainDrag(visualIndex, reversed) {
+        root.draggedIndex = reversed ? (root.mainBarItems.length - 1 - visualIndex) : visualIndex;
+        root.dropTargetIndex = root.draggedIndex;
+    }
+
+    function updateMainDrag(axisOffset, visualIndex, reversed) {
+        const itemSize = root.trayItemSize;
+        const slotOffset = Math.round(axisOffset / itemSize);
+        const visualTargetIndex = Math.max(0, Math.min(root.mainBarItems.length - 1, visualIndex + slotOffset));
+        const newTargetIndex = reversed ? (root.mainBarItems.length - 1 - visualTargetIndex) : visualTargetIndex;
+        if (newTargetIndex !== root.dropTargetIndex)
+            root.dropTargetIndex = newTargetIndex;
+    }
+
+    function finishMainDrag() {
+        const didReorder = root.dropTargetIndex >= 0 && root.dropTargetIndex !== root.draggedIndex;
+        if (didReorder) {
+            root.suppressShiftAnimation = true;
+            root.moveTrayItemInFullOrder(root.draggedIndex, root.dropTargetIndex);
+            Qt.callLater(() => root.suppressShiftAnimation = false);
+        }
+        root.draggedIndex = -1;
+        root.dropTargetIndex = -1;
+        return didReorder;
+    }
+
+    function beginPopupDrag(index) {
+        root.popupDraggedIndex = index;
+        root.popupDropTargetIndex = index;
+    }
+
+    function updatePopupDrag(axisOffset, index) {
+        const itemSize = root.trayItemSize + 6;
+        const slotOffset = Math.round(axisOffset / itemSize);
+        const newTargetIndex = Math.max(0, Math.min(root.hiddenBarItems.length - 1, index + slotOffset));
+        if (newTargetIndex !== root.popupDropTargetIndex)
+            root.popupDropTargetIndex = newTargetIndex;
+    }
+
+    function finishPopupDrag() {
+        const didReorder = root.popupDropTargetIndex >= 0 && root.popupDropTargetIndex !== root.popupDraggedIndex;
+        if (didReorder) {
+            const fromItem = root.hiddenBarItems[root.popupDraggedIndex];
+            const toItem = root.hiddenBarItems[root.popupDropTargetIndex];
+            root.suppressShiftAnimation = true;
+            root.moveTrayItemKeyInFullOrder(root.getTrayItemKey(fromItem), root.getTrayItemKey(toItem));
+            Qt.callLater(() => root.suppressShiftAnimation = false);
+        }
+        root.popupDraggedIndex = -1;
+        root.popupDropTargetIndex = -1;
+        return didReorder;
+    }
+
     property int draggedIndex: -1
     property int dropTargetIndex: -1
+    property int popupDraggedIndex: -1
+    property int popupDropTargetIndex: -1
     property bool suppressShiftAnimation: false
-    readonly property bool hasHiddenItems: allTrayItems.length > mainBarItems.length
+    readonly property bool hasHiddenItems: hiddenBarItems.length > 0
     readonly property bool inlineExpanded: hasHiddenItems && !useOverflowPopup && menuOpen
     visible: allTrayItems.length > 0
     opacity: allTrayItems.length > 0 ? 1 : 0
@@ -351,22 +472,7 @@ BasePill {
                     height: root.barThickness
                     z: dragHandler.dragging ? 100 : 0
 
-                    property real shiftOffset: {
+                    property real shiftOffset: root.dragShiftOffset(index, root.draggedIndex, root.dropTargetIndex, root.trayItemSize)
-                        if (root.draggedIndex < 0)
-                            return 0;
-                        if (index === root.draggedIndex)
-                            return 0;
-                        const dragIdx = root.draggedIndex;
-                        const dropIdx = root.dropTargetIndex;
-                        const shiftAmount = root.trayItemSize;
-                        if (dropIdx < 0)
-                            return 0;
-                        if (dragIdx < dropIdx && index > dragIdx && index <= dropIdx)
-                            return -shiftAmount;
-                        if (dragIdx > dropIdx && index >= dropIdx && index < dragIdx)
-                            return shiftAmount;
-                        return 0;
-                    }
 
                     transform: Translate {
                         x: delegateRoot.shiftOffset
@@ -466,19 +572,12 @@ BasePill {
                         onReleased: mouse => {
                             longPressTimer.stop();
                             const wasDragging = dragHandler.dragging;
-                            const didReorder = wasDragging && root.dropTargetIndex >= 0 && root.dropTargetIndex !== root.draggedIndex;
+                            if (wasDragging)
-
+                                root.finishMainDrag();
-                            if (didReorder) {
-                                root.suppressShiftAnimation = true;
-                                root.moveTrayItemInFullOrder(root.draggedIndex, root.dropTargetIndex);
-                                Qt.callLater(() => root.suppressShiftAnimation = false);
-                            }
 
                             dragHandler.longPressing = false;
                             dragHandler.dragging = false;
                             dragHandler.dragAxisOffset = 0;
-                            root.draggedIndex = -1;
-                            root.dropTargetIndex = -1;
 
                             if (wasDragging || mouse.button !== Qt.LeftButton)
                                 return;
@@ -501,8 +600,7 @@ BasePill {
                                 const distance = Math.abs(mouse.x - dragHandler.dragStartPos.x);
                                 if (distance > 5) {
                                     dragHandler.dragging = true;
-                                    root.draggedIndex = root.reverseInlineHorizontal ? (root.mainBarItems.length - 1 - index) : index;
+                                    root.beginMainDrag(index, root.reverseInlineHorizontal);
-                                    root.dropTargetIndex = root.draggedIndex;
                                 }
                             }
                             if (!dragHandler.dragging)
@@ -510,13 +608,7 @@ BasePill {
 
                             const axisOffset = mouse.x - dragHandler.dragStartPos.x;
                             dragHandler.dragAxisOffset = axisOffset;
-                            const itemSize = root.trayItemSize;
+                            root.updateMainDrag(axisOffset, index, root.reverseInlineHorizontal);
-                            const slotOffset = Math.round(axisOffset / itemSize);
-                            const visualTargetIndex = Math.max(0, Math.min(root.mainBarItems.length - 1, index + slotOffset));
-                            const newTargetIndex = root.reverseInlineHorizontal ? (root.mainBarItems.length - 1 - visualTargetIndex) : visualTargetIndex;
-                            if (newTargetIndex !== root.dropTargetIndex) {
-                                root.dropTargetIndex = newTargetIndex;
-                            }
                         }
 
                         onClicked: mouse => {
@@ -706,22 +798,7 @@ BasePill {
             height: root.trayItemSize
             z: dragHandler.dragging ? 100 : 0
 
-            property real shiftOffset: {
+            property real shiftOffset: root.dragShiftOffset(index, root.draggedIndex, root.dropTargetIndex, root.trayItemSize)
-                if (root.draggedIndex < 0)
-                    return 0;
-                if (index === root.draggedIndex)
-                    return 0;
-                const dragIdx = root.draggedIndex;
-                const dropIdx = root.dropTargetIndex;
-                const shiftAmount = root.trayItemSize;
-                if (dropIdx < 0)
-                    return 0;
-                if (dragIdx < dropIdx && index > dragIdx && index <= dropIdx)
-                    return -shiftAmount;
-                if (dragIdx > dropIdx && index >= dropIdx && index < dragIdx)
-                    return shiftAmount;
-                return 0;
-            }
 
             transform: Translate {
                 y: shiftOffset
@@ -821,19 +898,12 @@ BasePill {
                 onReleased: mouse => {
                     longPressTimer.stop();
                     const wasDragging = dragHandler.dragging;
-                    const didReorder = wasDragging && root.dropTargetIndex >= 0 && root.dropTargetIndex !== root.draggedIndex;
+                    if (wasDragging)
-
+                        root.finishMainDrag();
-                    if (didReorder) {
-                        root.suppressShiftAnimation = true;
-                        root.moveTrayItemInFullOrder(root.draggedIndex, root.dropTargetIndex);
-                        Qt.callLater(() => root.suppressShiftAnimation = false);
-                    }
 
                     dragHandler.longPressing = false;
                     dragHandler.dragging = false;
                     dragHandler.dragAxisOffset = 0;
-                    root.draggedIndex = -1;
-                    root.dropTargetIndex = -1;
 
                     if (wasDragging || mouse.button !== Qt.LeftButton)
                         return;
@@ -856,8 +926,7 @@ BasePill {
                         const distance = Math.abs(mouse.y - dragHandler.dragStartPos.y);
                         if (distance > 5) {
                             dragHandler.dragging = true;
-                            root.draggedIndex = index;
+                            root.beginMainDrag(index, false);
-                            root.dropTargetIndex = root.draggedIndex;
                         }
                     }
                     if (!dragHandler.dragging)
@@ -865,12 +934,7 @@ BasePill {
 
                     const axisOffset = mouse.y - dragHandler.dragStartPos.y;
                     dragHandler.dragAxisOffset = axisOffset;
-                    const itemSize = root.trayItemSize;
+                    root.updateMainDrag(axisOffset, index, false);
-                    const slotOffset = Math.round(axisOffset / itemSize);
-                    const newTargetIndex = Math.max(0, Math.min(root.mainBarItems.length - 1, index + slotOffset));
-                    if (newTargetIndex !== root.dropTargetIndex) {
-                        root.dropTargetIndex = newTargetIndex;
-                    }
                 }
 
                 onClicked: mouse => {
@@ -1115,11 +1179,12 @@ BasePill {
         }
 
         function updatePosition() {
-            const globalPos = root.mapToGlobal(0, 0);
+            // Window-local maps directly to screen-local because the bar window spans the
-            const screenX = screen.x || 0;
+            // full screen edge; this avoids mixing mapToGlobal with a separately-tracked
-            const screenY = screen.y || 0;
+            // screen.x/.y origin, which desync on non-primary monitors and after DPMS/hotplug.
-            const relativeX = globalPos.x - screenX;
+            const localPos = root.mapToItem(null, 0, 0);
-            const relativeY = globalPos.y - screenY;
+            const relativeX = localPos.x;
+            const relativeY = localPos.y;
 
             if (root.isVerticalOrientation) {
                 const edge = root.axis?.edge;
@@ -1136,20 +1201,38 @@ BasePill {
             id: menuContainer
             objectName: "overflowMenuContainer"
 
+            readonly property bool popupUsesVerticalLine: root.useSingleLineOverflowPopup && root.isVerticalOrientation
+            readonly property real popupPadding: Theme.spacingS + (popupUsesVerticalLine ? 3 : 0)
+
             readonly property real rawWidth: {
                 const itemCount = root.hiddenBarItems.length;
-                const cols = Math.min(5, itemCount);
+                if (itemCount === 0)
+                    return 0;
+                if (popupUsesVerticalLine)
+                    return root.trayItemSize + 4 + popupPadding * 2;
+                const cols = root.useSingleLineOverflowPopup ? itemCount : Math.min(5, itemCount);
                 const itemSize = root.trayItemSize + 4;
                 const spacing = 2;
-                return cols * itemSize + (cols - 1) * spacing + Theme.spacingS * 2;
+                const desiredWidth = cols * itemSize + (cols - 1) * spacing + popupPadding * 2;
+                if (!root.useSingleLineOverflowPopup)
+                    return desiredWidth;
+                const maxWidth = Math.max(itemSize + popupPadding * 2, overflowMenu.maskWidth - 20);
+                return Math.min(desiredWidth, maxWidth);
             }
             readonly property real rawHeight: {
                 const itemCount = root.hiddenBarItems.length;
-                const cols = Math.min(5, itemCount);
+                if (itemCount === 0)
-                const rows = Math.ceil(itemCount / cols);
+                    return 0;
                 const itemSize = root.trayItemSize + 4;
                 const spacing = 2;
-                return rows * itemSize + (rows - 1) * spacing + Theme.spacingS * 2;
+                if (popupUsesVerticalLine) {
+                    const desiredHeight = itemCount * itemSize + (itemCount - 1) * spacing + popupPadding * 2;
+                    const maxHeight = Math.max(itemSize + popupPadding * 2, overflowMenu.maskHeight - 20);
+                    return Math.min(desiredHeight, maxHeight);
+                }
+                const cols = root.useSingleLineOverflowPopup ? itemCount : Math.min(5, itemCount);
+                const rows = Math.ceil(itemCount / cols);
+                return rows * itemSize + (rows - 1) * spacing + popupPadding * 2;
             }
 
             readonly property real alignedWidth: Theme.px(rawWidth, overflowMenu.dpr)
@@ -1230,76 +1313,161 @@ BasePill {
                 z: 100
             }
 
-            Grid {
+            Flickable {
-                id: menuGrid
                 anchors.centerIn: parent
-                columns: Math.min(5, root.hiddenBarItems.length)
+                width: parent.width - menuContainer.popupPadding * 2
-                spacing: 2
+                height: parent.height - menuContainer.popupPadding * 2
-                rowSpacing: 2
+                contentWidth: menuGrid.implicitWidth
+                contentHeight: menuGrid.implicitHeight
+                boundsBehavior: Flickable.StopAtBounds
+                clip: true
+                interactive: root.useSingleLineOverflowPopup && (menuContainer.popupUsesVerticalLine ? contentHeight > height : contentWidth > width)
 
-                Repeater {
+                Grid {
-                    model: root.hiddenBarItems
+                    id: menuGrid
+                    anchors.verticalCenter: menuContainer.popupUsesVerticalLine ? undefined : parent.verticalCenter
+                    anchors.horizontalCenter: menuContainer.popupUsesVerticalLine ? parent.horizontalCenter : undefined
+                    columns: menuContainer.popupUsesVerticalLine ? 1 : (root.useSingleLineOverflowPopup ? root.hiddenBarItems.length : Math.min(5, root.hiddenBarItems.length))
+                    spacing: 2
+                    rowSpacing: 2
 
-                    delegate: Rectangle {
+                    Repeater {
-                        property var trayItem: modelData
+                        model: root.hiddenBarItems
-                        property string iconSource: root.trayIconSourceFor(trayItem)
 
-                        width: root.trayItemSize + 4
+                        delegate: Rectangle {
-                        height: root.trayItemSize + 4
+                            id: overflowItemRoot
-                        radius: Theme.cornerRadius
+                            property var trayItem: modelData
-                        color: itemArea.containsMouse ? BlurService.hoverColor(Theme.widgetBaseHoverColor) : Theme.withAlpha(Theme.surfaceContainer, 0)
+                            property string itemKey: root.getTrayItemKey(trayItem)
+                            property string iconSource: root.trayIconSourceFor(trayItem)
 
-                        IconImage {
+                            width: root.trayItemSize + 4
-                            id: menuIconImg
+                            height: root.trayItemSize + 4
-                            anchors.centerIn: parent
+                            z: popupDragHandler.dragging ? 100 : 0
-                            width: Theme.barIconSize(root.barThickness, undefined, root.barConfig?.maximizeWidgetIcons, root.barConfig?.iconScale)
+                            radius: Theme.cornerRadius
-                            height: Theme.barIconSize(root.barThickness, undefined, root.barConfig?.maximizeWidgetIcons, root.barConfig?.iconScale)
+                            color: itemArea.containsMouse ? BlurService.hoverColor(Theme.widgetBaseHoverColor) : Theme.withAlpha(Theme.surfaceContainer, 0)
-                            source: parent.iconSource
+                            border.width: popupDragHandler.dragging ? 2 : 0
-                            asynchronous: true
+                            border.color: Theme.primary
-                            smooth: true
+                            opacity: popupDragHandler.dragging ? 0.8 : 1.0
-                            mipmap: true
-                            visible: status === Image.Ready
-                            layer.enabled: root.trayIconTintEnabled
-                            layer.effect: MultiEffect {
-                                saturation: root.trayIconSaturation
-                                colorization: root.trayIconColorization
-                                colorizationColor: root.trayIconTintColor
-                            }
-                        }
 
-                        StyledText {
+                            property real shiftOffset: root.dragShiftOffset(index, root.popupDraggedIndex, root.popupDropTargetIndex, root.trayItemSize + 6)
-                            anchors.centerIn: parent
-                            visible: !menuIconImg.visible
-                            text: {
-                                const itemId = trayItem?.id || "";
-                                if (!itemId)
-                                    return "?";
-                                return itemId.charAt(0).toUpperCase();
-                            }
-                            font.pixelSize: 10
-                            color: Theme.widgetTextColor
-                        }
 
-                        MouseArea {
+                            transform: Translate {
-                            id: itemArea
+                                x: !menuContainer.popupUsesVerticalLine ? overflowItemRoot.shiftOffset + (popupDragHandler.dragging ? popupDragHandler.dragAxisOffset : 0) : 0
-                            anchors.fill: parent
+                                y: menuContainer.popupUsesVerticalLine ? overflowItemRoot.shiftOffset + (popupDragHandler.dragging ? popupDragHandler.dragAxisOffset : 0) : 0
-                            hoverEnabled: true
+                                Behavior on x {
-                            acceptedButtons: Qt.LeftButton | Qt.RightButton
+                                    enabled: !root.suppressShiftAnimation && !menuContainer.popupUsesVerticalLine
-                            cursorShape: Qt.PointingHandCursor
+                                    NumberAnimation {
-                            onClicked: mouse => {
+                                        duration: 150
-                                if (!trayItem)
+                                        easing.type: Easing.OutCubic
-                                    return;
+                                    }
-                                if (mouse.button === Qt.LeftButton && !trayItem.onlyMenu) {
-                                    trayItem.activate();
-                                    root.menuOpen = false;
-                                    return;
                                 }
-                                if (!trayItem.hasMenu) {
+                                Behavior on y {
-                                    const gp = itemArea.mapToGlobal(mouse.x, mouse.y);
+                                    enabled: !root.suppressShiftAnimation && menuContainer.popupUsesVerticalLine
-                                    root.callContextMenuFallback(trayItem.id, Math.round(gp.x), Math.round(gp.y));
+                                    NumberAnimation {
-                                    return;
+                                        duration: 150
+                                        easing.type: Easing.OutCubic
+                                    }
+                                }
+                            }
+
+                            Item {
+                                id: popupDragHandler
+                                anchors.fill: parent
+                                property bool dragging: false
+                                property point dragStartPos: Qt.point(0, 0)
+                                property real dragAxisOffset: 0
+                                property bool longPressing: false
+
+                                Timer {
+                                    id: popupLongPressTimer
+                                    interval: 400
+                                    repeat: false
+                                    onTriggered: popupDragHandler.longPressing = true
+                                }
+                            }
+
+                            IconImage {
+                                id: menuIconImg
+                                anchors.centerIn: parent
+                                width: Theme.barIconSize(root.barThickness, undefined, root.barConfig?.maximizeWidgetIcons, root.barConfig?.iconScale)
+                                height: Theme.barIconSize(root.barThickness, undefined, root.barConfig?.maximizeWidgetIcons, root.barConfig?.iconScale)
+                                source: parent.iconSource
+                                asynchronous: true
+                                smooth: true
+                                mipmap: true
+                                visible: status === Image.Ready
+                                layer.enabled: root.trayIconTintEnabled
+                                layer.effect: MultiEffect {
+                                    saturation: root.trayIconSaturation
+                                    colorization: root.trayIconColorization
+                                    colorizationColor: root.trayIconTintColor
+                                }
+                            }
+
+                            StyledText {
+                                anchors.centerIn: parent
+                                visible: !menuIconImg.visible
+                                text: {
+                                    const itemId = trayItem?.id || "";
+                                    if (!itemId)
+                                        return "?";
+                                    return itemId.charAt(0).toUpperCase();
+                                }
+                                font.pixelSize: 10
+                                color: Theme.widgetTextColor
+                            }
+
+                            MouseArea {
+                                id: itemArea
+                                anchors.fill: parent
+                                hoverEnabled: true
+                                acceptedButtons: Qt.LeftButton | Qt.RightButton
+                                cursorShape: popupDragHandler.longPressing ? Qt.DragMoveCursor : Qt.PointingHandCursor
+                                onPressed: mouse => {
+                                    if (mouse.button === Qt.LeftButton) {
+                                        popupDragHandler.dragStartPos = Qt.point(mouse.x, mouse.y);
+                                        popupLongPressTimer.start();
+                                    }
+                                }
+                                onReleased: mouse => {
+                                    popupLongPressTimer.stop();
+                                    const wasDragging = popupDragHandler.dragging;
+                                    if (wasDragging)
+                                        root.finishPopupDrag();
+
+                                    popupDragHandler.longPressing = false;
+                                    popupDragHandler.dragging = false;
+                                    popupDragHandler.dragAxisOffset = 0;
+                                }
+                                onPositionChanged: mouse => {
+                                    const axisDelta = menuContainer.popupUsesVerticalLine ? (mouse.y - popupDragHandler.dragStartPos.y) : (mouse.x - popupDragHandler.dragStartPos.x);
+                                    if (popupDragHandler.longPressing && !popupDragHandler.dragging && Math.abs(axisDelta) > 5) {
+                                        popupDragHandler.dragging = true;
+                                        root.beginPopupDrag(index);
+                                    }
+                                    if (!popupDragHandler.dragging)
+                                        return;
+
+                                    popupDragHandler.dragAxisOffset = axisDelta;
+                                    root.updatePopupDrag(axisDelta, index);
+                                }
+                                onClicked: mouse => {
+                                    if (popupDragHandler.dragging)
+                                        return;
+                                    if (!trayItem)
+                                        return;
+                                    if (mouse.button === Qt.LeftButton && !trayItem.onlyMenu) {
+                                        trayItem.activate();
+                                        root.menuOpen = false;
+                                        return;
+                                    }
+                                    if (!trayItem.hasMenu) {
+                                        const gp = itemArea.mapToGlobal(mouse.x, mouse.y);
+                                        root.callContextMenuFallback(trayItem.id, Math.round(gp.x), Math.round(gp.y));
+                                        return;
+                                    }
+                                    root.showForTrayItem(trayItem, menuContainer, parentScreen, root.isAtBottom, root.isVerticalOrientation, root.axis);
                                 }
-                                root.showForTrayItem(trayItem, menuContainer, parentScreen, root.isAtBottom, root.isVerticalOrientation, root.axis);
                             }
                         }
                     }
@@ -1555,11 +1723,13 @@ BasePill {
                             anchorPos = Qt.point(targetX, targetY);
                         }
                     } else {
-                        const globalPos = targetItem.mapToGlobal(0, 0);
+                        // Window-local maps directly to screen-local because the bar window spans
-                        const screenX = screen.x || 0;
+                        // the full screen edge; this avoids mixing mapToGlobal with a separately-
-                        const screenY = screen.y || 0;
+                        // tracked screen.x/.y origin, which desync on non-primary monitors and after
-                        const relativeX = globalPos.x - screenX;
+                        // DPMS/hotplug.
-                        const relativeY = globalPos.y - screenY;
+                        const localPos = targetItem.mapToItem(null, 0, 0);
+                        const relativeX = localPos.x;
+                        const relativeY = localPos.y;
 
                         if (menuRoot.isVertical) {
                             const edge = menuRoot.axis?.edge;
@@ -1695,7 +1865,12 @@ BasePill {
                                 anchors.left: parent.left
                                 anchors.leftMargin: Theme.spacingS
                                 anchors.verticalCenter: parent.verticalCenter
-                                text: menuRoot.trayItem?.id || "Unknown"
+                                text: {
+                                    const itemId = menuRoot.trayItem?.id || "Unknown";
+                                    if (root.isAutoOverflowTrayItem(menuRoot.trayItem))
+                                        return itemId + " · " + I18n.tr("Keep in Bar");
+                                    return itemId;
+                                }
                                 font.pixelSize: Theme.fontSizeSmall
                                 color: Theme.surfaceTextMedium
                                 elide: Text.ElideMiddle
@@ -1706,7 +1881,11 @@ BasePill {
                                 anchors.right: parent.right
                                 anchors.rightMargin: Theme.spacingS
                                 anchors.verticalCenter: parent.verticalCenter
-                                name: SessionData.isHiddenTrayId(root.getTrayItemKey(menuRoot.trayItem)) ? "visibility" : "visibility_off"
+                                name: {
+                                    if (root.isAutoOverflowTrayItem(menuRoot.trayItem))
+                                        return "push_pin";
+                                    return root.isManualHiddenTrayItem(menuRoot.trayItem) ? "visibility" : "visibility_off";
+                                }
                                 size: 16
                                 color: Theme.widgetTextColor
                             }
@@ -1720,7 +1899,9 @@ BasePill {
                                     const itemKey = root.getTrayItemKey(menuRoot.trayItem);
                                     if (!itemKey)
                                         return;
-                                    if (SessionData.isHiddenTrayId(itemKey)) {
+                                    if (root.isAutoOverflowTrayItem(menuRoot.trayItem)) {
+                                        root.promoteTrayItemToBar(menuRoot.trayItem);
+                                    } else if (root.isManualHiddenTrayItem(menuRoot.trayItem)) {
                                         SessionData.showTrayId(itemKey);
                                     } else {
                                         SessionData.hideTrayId(itemKey);

quickshell/Modules/DankBar/Widgets/Weather.qml

@@ -9,9 +9,8 @@ BasePill {
 
     visible: SettingsData.weatherEnabled
 
-    Ref {
+    Component.onCompleted: WeatherService.addRef()
-        service: WeatherService
+    Component.onDestruction: WeatherService.removeRef()
-    }
 
     content: Component {
         Item {

quickshell/Modules/DankBar/Widgets/WorkspaceSwitcher.qml

@@ -1192,38 +1192,25 @@ Item {
                     return Math.max(baseHeight + iconsExtraHeight, contentImplicitHeight + padding);
                 }
 
-                readonly property color unfocusedColor: {
+                function colorFromMode(mode, fallbackColor, customColor, customFallbackColor) {
-                    switch (SettingsData.workspaceUnfocusedColorMode) {
+                    switch (mode) {
-                    case "s":
+                    case "primary":
-                        return Theme.surface;
+                    case "pri":
-                    case "sc":
-                        return Theme.surfaceContainer;
-                    case "sch":
-                        return Theme.surfaceContainerHigh;
-                    default:
-                        return Theme.surfaceTextAlpha;
-                    }
-                }
-
-                readonly property color activeColor: {
-                    switch (SettingsData.workspaceColorMode) {
-                    case "s":
-                        return Theme.surface;
-                    case "sc":
-                        return Theme.surfaceContainer;
-                    case "sch":
-                        return Theme.surfaceContainerHigh;
-                    case "none":
-                        return unfocusedColor;
-                    default:
                         return Theme.primary;
-                    }
+                    case "primaryContainer":
-                }
+                        return Theme.primaryContainer;
-
+                    case "secondary":
-                readonly property color occupiedColor: {
-                    switch (SettingsData.workspaceOccupiedColorMode) {
                     case "sec":
                         return Theme.secondary;
+                    case "secondaryContainer":
+                        return Theme.secondaryContainer;
+                    case "tertiary":
+                    case "ter":
+                        return Theme.tertiary;
+                    case "tertiaryContainer":
+                        return Theme.tertiaryContainer;
+                    case "surfaceText":
+                        return Theme.surfaceText;
                     case "s":
                         return Theme.surface;
                     case "sc":
@@ -1232,37 +1219,34 @@ Item {
                         return Theme.surfaceContainerHigh;
                     case "schh":
                         return Theme.surfaceContainerHighest;
-                    default:
+                    case "error":
-                        return unfocusedColor;
+                    case "err":
-                    }
-                }
-
-                readonly property color urgentColor: {
-                    switch (SettingsData.workspaceUrgentColorMode) {
-                    case "primary":
-                        return Theme.primary;
-                    case "secondary":
-                        return Theme.secondary;
-                    case "s":
-                        return Theme.surface;
-                    case "sc":
-                        return Theme.surfaceContainer;
-                    default:
                         return Theme.error;
+                    case "custom":
+                        return Theme.safeColor(customColor, customFallbackColor);
+                    default:
+                        return fallbackColor;
                     }
                 }
 
-                readonly property color focusedBorderColor: {
+                readonly property color unfocusedColor: colorFromMode(SettingsData.workspaceUnfocusedColorMode, Theme.surfaceTextAlpha, SettingsData.workspaceUnfocusedCustomColor, Theme.surfaceTextAlpha)
-                    switch (SettingsData.workspaceFocusedBorderColor) {
+
-                    case "surfaceText":
+                readonly property color activeColor: {
-                        return Theme.surfaceText;
+                    if (SettingsData.workspaceColorMode === "none")
-                    case "secondary":
+                        return unfocusedColor;
-                        return Theme.secondary;
+                    return colorFromMode(SettingsData.workspaceColorMode, Theme.primary, SettingsData.workspaceFocusedCustomColor, Theme.primary);
-                    default:
-                        return Theme.primary;
-                    }
                 }
 
+                readonly property color occupiedColor: {
+                    if (SettingsData.workspaceOccupiedColorMode === "none")
+                        return unfocusedColor;
+                    return colorFromMode(SettingsData.workspaceOccupiedColorMode, unfocusedColor, SettingsData.workspaceOccupiedCustomColor, Theme.secondary);
+                }
+
+                readonly property color urgentColor: colorFromMode(SettingsData.workspaceUrgentColorMode, Theme.error, SettingsData.workspaceUrgentCustomColor, Theme.error)
+
+                readonly property color focusedBorderColor: colorFromMode(SettingsData.workspaceFocusedBorderColor, Theme.primary, SettingsData.workspaceFocusedBorderCustomColor, Theme.primary)
+
                 function getContrastingIconColor(bgColor) {
                     const luminance = 0.299 * bgColor.r + 0.587 * bgColor.g + 0.114 * bgColor.b;
                     return luminance > 0.4 ? Qt.rgba(0.15, 0.15, 0.15, 1) : Qt.rgba(0.8, 0.8, 0.8, 1);

quickshell/Modules/DankDash/DankDashPopout.qml

@@ -227,6 +227,13 @@ DankPopout {
                     return;
                 }
 
+                if (root.currentTabIndex === 0 && overviewLoader.item?.handleKeyEvent) {
+                    if (overviewLoader.item.handleKeyEvent(event)) {
+                        event.accepted = true;
+                        return;
+                    }
+                }
+
                 if (root.currentTabIndex === 1 && mediaLoader.item?.handleKeyEvent) {
                     if (mediaLoader.item.handleKeyEvent(event)) {
                         event.accepted = true;
@@ -356,6 +363,7 @@ DankPopout {
                         sourceComponent: Component {
                             OverviewTab {
                                 onCloseDash: root.dashVisible = false
+                                onNavFocusRequested: mainContainer.forceActiveFocus()
                                 onSwitchToWeatherTab: {
                                     if (SettingsData.weatherEnabled) {
                                         root.currentTabIndex = 3;

quickshell/Modules/DankDash/Overview/CalendarEventDetail.qml

@@ -0,0 +1,311 @@
+import QtQuick
+import qs.Common
+import qs.Services
+import qs.Widgets
+
+Item {
+    id: root
+
+    LayoutMirroring.enabled: I18n.isRtl
+    LayoutMirroring.childrenInherit: true
+
+    property var eventData: null
+    property bool canEdit: false
+
+    signal editRequested
+    signal deleteRequested
+    signal closeRequested
+
+    readonly property bool _descriptionIsHtml: /<[a-z][^>]*>/i.test((eventData && eventData.description) || "")
+
+    function _styleAnchors(html) {
+        return html.replace(/<a\s([^>]*)>/gi, (m, attrs) => {
+            const cleaned = attrs.replace(/style="[^"]*"/gi, "");
+            return "<a style=\"text-decoration:none; color:" + Theme.primary + ";\" " + cleaned + ">";
+        });
+    }
+
+    function _inlineMarkdown(line) {
+        let out = line.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+        out = out.replace(/\\([\\`*_{}[\]()#+\-.!~>])/g, "$1");
+        out = out.replace(/(?:https?:\/\/|www\.)[^\s<>)\]]*[^\s<>)\].,;:!?"']/g, (m, offset, s) => {
+            const prev = offset > 0 ? s[offset - 1] : "";
+            if (prev === "(" || prev === "[" || prev === "\"" || prev === "'")
+                return m;
+            const href = m.startsWith("www.") ? "https://" + m : m;
+            return "<a href=\"" + href + "\">" + m + "</a>";
+        });
+        out = out.replace(/\[([^\]]+)\]\(([^()\s]+)\)/g, "<a href=\"$2\">$1</a>");
+        out = out.replace(/\*\*([^*]+)\*\*/g, "<b>$1</b>");
+        out = out.replace(/(^|[^*])\*([^*\s][^*]*)\*/g, "$1<i>$2</i>");
+        return out;
+    }
+
+    // Descriptions arrive as HTML (Google) or markdown/plain text; both render
+    // as RichText so links become clickable anchors recolored to the theme.
+    function _descriptionRichText() {
+        const raw = ((eventData && eventData.description) || "").trim();
+        if (raw === "")
+            return "";
+        if (_descriptionIsHtml)
+            return _styleAnchors(raw);
+
+        const parts = [];
+        let list = "";
+        const closeList = () => {
+            if (list === "")
+                return;
+            parts.push("</" + list + ">");
+            list = "";
+        };
+
+        const lines = raw.split("\n");
+        for (let i = 0; i < lines.length; i++) {
+            const ul = lines[i].match(/^\s*[-*+]\s+(.+)$/);
+            const ol = lines[i].match(/^\s*\d+[.)]\s+(.+)$/);
+            if (ul || ol) {
+                const tag = ul ? "ul" : "ol";
+                if (list !== tag) {
+                    closeList();
+                    parts.push("<" + tag + ">");
+                    list = tag;
+                }
+                parts.push("<li>" + _inlineMarkdown((ul || ol)[1]) + "</li>");
+                continue;
+            }
+            closeList();
+            parts.push(_inlineMarkdown(lines[i]) + "<br/>");
+        }
+        closeList();
+        return _styleAnchors(parts.join("").replace(/<br\/>$/, ""));
+    }
+
+    function _timeText() {
+        if (!eventData)
+            return "";
+        const dateStr = Qt.formatDate(eventData.start, "ddd, MMM d");
+        if (eventData.allDay)
+            return I18n.tr("All day") + " · " + dateStr;
+        const fmt = SettingsData.use24HourClock ? "HH:mm" : "h:mm AP";
+        const startStr = Qt.formatTime(eventData.start, fmt);
+        if (eventData.start.getTime() === eventData.end.getTime())
+            return dateStr + " · " + startStr;
+        return dateStr + " · " + startStr + " – " + Qt.formatTime(eventData.end, fmt);
+    }
+
+    Rectangle {
+        anchors.fill: parent
+        radius: Theme.cornerRadius
+        color: Qt.rgba(0, 0, 0, 0.45)
+
+        MouseArea {
+            anchors.fill: parent
+            onClicked: root.closeRequested()
+        }
+    }
+
+    Rectangle {
+        anchors.centerIn: parent
+        width: Math.min(parent.width - Theme.spacingL * 2, 380)
+        height: Math.min(parent.height - Theme.spacingM * 2, body.implicitHeight + Theme.spacingL * 2)
+        radius: Theme.cornerRadius
+        color: Theme.surfaceContainerHigh
+        border.color: Theme.outlineMedium
+        border.width: 1
+        clip: true
+
+        MouseArea {
+            anchors.fill: parent
+        }
+
+        DankActionButton {
+            id: closeButton
+            anchors.top: parent.top
+            anchors.right: parent.right
+            anchors.margins: Theme.spacingXS
+            circular: false
+            iconName: "close"
+            iconSize: 16
+            z: 1
+            onClicked: root.closeRequested()
+        }
+
+        DankFlickable {
+            anchors.fill: parent
+            anchors.margins: Theme.spacingL
+            anchors.topMargin: Theme.spacingL
+            contentWidth: width
+            contentHeight: body.implicitHeight
+            clip: true
+
+            Column {
+                id: body
+                width: parent.width
+                spacing: Theme.spacingS
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingS
+
+                    Rectangle {
+                        width: 4
+                        height: titleText.implicitHeight
+                        radius: 2
+                        anchors.top: parent.top
+                        color: (root.eventData && root.eventData.color) ? root.eventData.color : Theme.primary
+                    }
+
+                    StyledText {
+                        id: titleText
+                        width: parent.width - 4 - Theme.spacingS - closeButton.width
+                        text: root.eventData ? root.eventData.title : ""
+                        font.pixelSize: Theme.fontSizeLarge
+                        font.weight: Font.Medium
+                        color: Theme.surfaceText
+                        horizontalAlignment: Text.AlignLeft
+                        wrapMode: Text.Wrap
+                        maximumLineCount: 3
+                        elide: Text.ElideRight
+                    }
+                }
+
+                StyledText {
+                    width: parent.width
+                    text: root._timeText()
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.surfaceVariantText
+                    wrapMode: Text.Wrap
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingXS
+                    visible: root.eventData && root.eventData.calendar
+
+                    DankIcon {
+                        name: "calendar_month"
+                        size: 14
+                        color: Theme.surfaceVariantText
+                        anchors.top: parent.top
+                        anchors.topMargin: 2
+                    }
+
+                    StyledText {
+                        width: parent.width - 14 - Theme.spacingXS
+                        text: {
+                            if (!root.eventData)
+                                return "";
+                            const acc = root.eventData.account || "";
+                            return root.eventData.calendar + (acc ? " · " + acc : "");
+                        }
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.surfaceVariantText
+                        wrapMode: Text.Wrap
+                        maximumLineCount: 2
+                        elide: Text.ElideRight
+                    }
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingXS
+                    visible: root.eventData && root.eventData.location
+
+                    DankIcon {
+                        name: "place"
+                        size: 14
+                        color: Theme.surfaceVariantText
+                        anchors.top: parent.top
+                        anchors.topMargin: 2
+                    }
+
+                    StyledText {
+                        width: parent.width - 14 - Theme.spacingXS
+                        text: root.eventData ? root.eventData.location : ""
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.surfaceVariantText
+                        wrapMode: Text.Wrap
+                        maximumLineCount: 2
+                        elide: Text.ElideRight
+                    }
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingXS
+                    visible: root.eventData && root.eventData.url
+
+                    DankIcon {
+                        name: "link"
+                        size: 14
+                        color: Theme.primary
+                        anchors.top: parent.top
+                        anchors.topMargin: 2
+                    }
+
+                    StyledText {
+                        width: parent.width - 14 - Theme.spacingXS
+                        text: root.eventData ? root.eventData.url : ""
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.primary
+                        wrapMode: Text.WrapAnywhere
+                        maximumLineCount: 2
+                        elide: Text.ElideRight
+
+                        MouseArea {
+                            anchors.fill: parent
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: {
+                                if (root.eventData && root.eventData.url)
+                                    Qt.openUrlExternally(root.eventData.url);
+                            }
+                        }
+                    }
+                }
+
+                StyledText {
+                    id: descriptionText
+                    width: parent.width
+                    text: root._descriptionRichText()
+                    visible: root.eventData && root.eventData.description
+                    textFormat: Text.RichText
+                    linkColor: Theme.primary
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.surfaceText
+                    horizontalAlignment: Text.AlignLeft
+                    wrapMode: Text.Wrap
+                    onLinkActivated: link => Qt.openUrlExternally(link)
+
+                    MouseArea {
+                        anchors.fill: parent
+                        acceptedButtons: Qt.NoButton
+                        cursorShape: descriptionText.hoveredLink !== "" ? Qt.PointingHandCursor : Qt.ArrowCursor
+                    }
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingS
+                    visible: root.canEdit
+                    topPadding: Theme.spacingXS
+
+                    DankButton {
+                        text: I18n.tr("Edit")
+                        iconName: "edit"
+                        buttonHeight: 32
+                        onClicked: root.editRequested()
+                    }
+
+                    DankButton {
+                        text: I18n.tr("Delete")
+                        iconName: "delete"
+                        buttonHeight: 32
+                        backgroundColor: Theme.withAlpha(Theme.error, 0.15)
+                        textColor: Theme.error
+                        onClicked: root.deleteRequested()
+                    }
+                }
+            }
+        }
+    }
+}

quickshell/Modules/DankDash/Overview/CalendarEventEditor.qml

@@ -0,0 +1,350 @@
+import QtQuick
+import qs.Common
+import qs.Services
+import qs.Widgets
+
+Item {
+    id: root
+
+    LayoutMirroring.enabled: I18n.isRtl
+    LayoutMirroring.childrenInherit: true
+
+    property var eventData: null
+    property date initialDate: new Date()
+
+    signal saved
+    signal closeRequested
+
+    property string fTitle: ""
+    property bool fAllDay: false
+    property date fDate: initialDate
+    property string fStart: "10:00"
+    property string fEnd: "11:00"
+    property string fLocation: ""
+    property string fDescription: ""
+    property string fCalendarId: ""
+    property int fReminder: -1
+    property string errorText: ""
+    property bool saving: false
+
+    readonly property var _cals: CalendarService.writableCalendars()
+    readonly property var _remLabels: [I18n.tr("No reminder"), I18n.tr("At start"), I18n.tr("5 min before"), I18n.tr("10 min before"), I18n.tr("15 min before"), I18n.tr("30 min before"), I18n.tr("1 hour before"), I18n.tr("1 day before")]
+    readonly property var _remMins: [-1, 0, 5, 10, 15, 30, 60, 1440]
+
+    function _parseTime(value) {
+        const m = value.trim().match(/^(\d{1,2}):(\d{2})$/);
+        if (!m)
+            return null;
+        const h = parseInt(m[1]);
+        const min = parseInt(m[2]);
+        if (h > 23 || min > 59)
+            return null;
+        return {
+            "h": h,
+            "m": min
+        };
+    }
+
+    function _isoFromDateTime(dateObj, h, m) {
+        const d = new Date(dateObj);
+        d.setHours(h, m, 0, 0);
+        return d.toISOString();
+    }
+
+    function _allDayIso(dateObj, dayOffset) {
+        return new Date(Date.UTC(dateObj.getFullYear(), dateObj.getMonth(), dateObj.getDate() + dayOffset)).toISOString();
+    }
+
+    function _calendarName(id) {
+        for (let i = 0; i < _cals.length; i++) {
+            if (_cals[i].id === id)
+                return _cals[i].name;
+        }
+        return _cals.length > 0 ? _cals[0].name : "";
+    }
+
+    function save() {
+        const title = fTitle.trim();
+        if (!title) {
+            errorText = I18n.tr("Title is required");
+            return;
+        }
+        let calId = fCalendarId;
+        if (!calId) {
+            const def = CalendarService.defaultCalendar();
+            calId = def ? def.id : "";
+        }
+        if (!calId) {
+            errorText = I18n.tr("No writable calendar available");
+            return;
+        }
+        let startIso, endIso;
+        if (fAllDay) {
+            startIso = _allDayIso(fDate, 0);
+            endIso = _allDayIso(fDate, 1);
+        } else {
+            const s = _parseTime(fStart);
+            const e = _parseTime(fEnd);
+            if (!s || !e) {
+                errorText = I18n.tr("Use HH:MM time format");
+                return;
+            }
+            startIso = _isoFromDateTime(fDate, s.h, s.m);
+            endIso = _isoFromDateTime(fDate, e.h, e.m);
+            if (new Date(endIso).getTime() <= new Date(startIso).getTime()) {
+                errorText = I18n.tr("End must be after start");
+                return;
+            }
+        }
+        const fields = {
+            "calendarId": calId,
+            "summary": title,
+            "description": fDescription,
+            "location": fLocation,
+            "start": startIso,
+            "end": endIso,
+            "allDay": fAllDay,
+            "reminders": fReminder >= 0 ? [
+                {
+                    "method": "popup",
+                    "minutes": fReminder
+                }
+            ] : []
+        };
+        saving = true;
+        errorText = "";
+        const cb = response => {
+            saving = false;
+            if (response.error) {
+                errorText = response.error;
+                return;
+            }
+            root.saved();
+        };
+        if (eventData && eventData.id)
+            CalendarService.updateEvent(eventData.id, fields, cb);
+        else
+            CalendarService.createEvent(fields, cb);
+    }
+
+    Component.onCompleted: {
+        if (!eventData) {
+            fCalendarId = CalendarService.defaultCalendar() ? CalendarService.defaultCalendar().id : "";
+            return;
+        }
+        fTitle = eventData.title || "";
+        fAllDay = !!eventData.allDay;
+        fDate = eventData.start;
+        const fmt = "HH:mm";
+        fStart = Qt.formatTime(eventData.start, fmt);
+        fEnd = Qt.formatTime(eventData.end, fmt);
+        fLocation = eventData.location || "";
+        fDescription = eventData.description || "";
+        fCalendarId = eventData.calendarId || "";
+        if (eventData.reminders && eventData.reminders.length > 0)
+            fReminder = eventData.reminders[0].minutes;
+    }
+
+    Rectangle {
+        anchors.fill: parent
+        radius: Theme.cornerRadius
+        color: Qt.rgba(0, 0, 0, 0.45)
+
+        MouseArea {
+            anchors.fill: parent
+            onClicked: root.closeRequested()
+        }
+    }
+
+    Rectangle {
+        anchors.centerIn: parent
+        width: Math.min(parent.width - Theme.spacingL * 2, 400)
+        height: Math.min(parent.height - Theme.spacingM, 300)
+        radius: Theme.cornerRadius
+        color: Theme.surfaceContainerHigh
+        border.color: Theme.outlineMedium
+        border.width: 1
+
+        MouseArea {
+            anchors.fill: parent
+        }
+
+        DankFlickable {
+            anchors.fill: parent
+            anchors.margins: Theme.spacingM
+            contentWidth: width
+            contentHeight: form.implicitHeight
+            clip: true
+
+            Column {
+                id: form
+                width: parent.width
+                spacing: Theme.spacingS
+
+                StyledText {
+                    width: parent.width
+                    text: root.eventData ? I18n.tr("Edit event") : I18n.tr("New event")
+                    font.pixelSize: Theme.fontSizeMedium
+                    font.weight: Font.Medium
+                    color: Theme.surfaceText
+                    horizontalAlignment: Text.AlignLeft
+                }
+
+                DankTextField {
+                    width: parent.width
+                    labelText: I18n.tr("Title")
+                    leftIconName: "title"
+                    leftIconSize: Theme.iconSize - 6
+                    placeholderText: I18n.tr("Event title")
+                    text: root.fTitle
+                    onTextChanged: root.fTitle = text
+                }
+
+                DankToggle {
+                    width: parent.width
+                    text: I18n.tr("All day")
+                    checked: root.fAllDay
+                    onToggled: checked => root.fAllDay = checked
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingXS
+
+                    DankActionButton {
+                        circular: false
+                        iconName: "chevron_left"
+                        iconSize: 16
+                        onClicked: {
+                            let d = new Date(root.fDate);
+                            d.setDate(d.getDate() - 1);
+                            root.fDate = d;
+                        }
+                    }
+
+                    StyledText {
+                        width: parent.width - 72
+                        text: Qt.formatDate(root.fDate, "ddd, MMM d yyyy")
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.surfaceText
+                        horizontalAlignment: Text.AlignHCenter
+                        verticalAlignment: Text.AlignVCenter
+                        height: 32
+                    }
+
+                    DankActionButton {
+                        circular: false
+                        iconName: "chevron_right"
+                        iconSize: 16
+                        onClicked: {
+                            let d = new Date(root.fDate);
+                            d.setDate(d.getDate() + 1);
+                            root.fDate = d;
+                        }
+                    }
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingS
+                    visible: !root.fAllDay
+
+                    DankTextField {
+                        width: (parent.width - Theme.spacingS) / 2
+                        labelText: I18n.tr("Start")
+                        leftIconName: "schedule"
+                        leftIconSize: Theme.iconSize - 6
+                        placeholderText: "HH:MM"
+                        text: root.fStart
+                        onTextChanged: root.fStart = text
+                    }
+
+                    DankTextField {
+                        width: (parent.width - Theme.spacingS) / 2
+                        labelText: I18n.tr("End")
+                        placeholderText: "HH:MM"
+                        text: root.fEnd
+                        onTextChanged: root.fEnd = text
+                    }
+                }
+
+                DankDropdown {
+                    width: parent.width
+                    text: I18n.tr("Calendar")
+                    options: root._cals.map(c => c.name)
+                    currentValue: root._calendarName(root.fCalendarId)
+                    onValueChanged: value => {
+                        for (let i = 0; i < root._cals.length; i++) {
+                            if (root._cals[i].name === value) {
+                                root.fCalendarId = root._cals[i].id;
+                                return;
+                            }
+                        }
+                    }
+                }
+
+                DankDropdown {
+                    width: parent.width
+                    text: I18n.tr("Reminder")
+                    options: root._remLabels
+                    currentValue: root._remLabels[Math.max(0, root._remMins.indexOf(root.fReminder))]
+                    onValueChanged: value => {
+                        const idx = root._remLabels.indexOf(value);
+                        if (idx >= 0)
+                            root.fReminder = root._remMins[idx];
+                    }
+                }
+
+                DankTextField {
+                    width: parent.width
+                    labelText: I18n.tr("Location")
+                    leftIconName: "place"
+                    leftIconSize: Theme.iconSize - 6
+                    placeholderText: I18n.tr("Add location")
+                    text: root.fLocation
+                    onTextChanged: root.fLocation = text
+                }
+
+                DankTextField {
+                    width: parent.width
+                    labelText: I18n.tr("Notes")
+                    leftIconName: "notes"
+                    leftIconSize: Theme.iconSize - 6
+                    placeholderText: I18n.tr("Add notes")
+                    text: root.fDescription
+                    onTextChanged: root.fDescription = text
+                }
+
+                StyledText {
+                    width: parent.width
+                    text: root.errorText
+                    visible: root.errorText !== ""
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.error
+                    wrapMode: Text.WordWrap
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingS
+
+                    DankButton {
+                        text: root.saving ? I18n.tr("Saving…") : I18n.tr("Save")
+                        iconName: "check"
+                        buttonHeight: 32
+                        backgroundColor: Theme.primary
+                        textColor: Theme.primaryText
+                        enabled: !root.saving
+                        onClicked: root.save()
+                    }
+
+                    DankButton {
+                        text: I18n.tr("Cancel")
+                        buttonHeight: 32
+                        onClicked: root.closeRequested()
+                    }
+                }
+            }
+        }
+    }
+}

quickshell/Modules/DankDash/Overview/CalendarOverviewCard.qml

@@ -8,14 +8,21 @@ Rectangle {
     id: root
     readonly property var log: Log.scoped("CalendarOverviewCard")
 
+    LayoutMirroring.enabled: I18n.isRtl
+    LayoutMirroring.childrenInherit: true
+
     implicitWidth: SettingsData.showWeekNumber ? 736 : 700
 
     property bool showEventDetails: false
     property date selectedDate: systemClock.date
     property var selectedDateEvents: []
     property bool hasEvents: selectedDateEvents && selectedDateEvents.length > 0
+    property var detailEvent: null
+    property bool showEditor: false
+    property var editorEvent: null
 
     signal closeDash
+    signal navFocusRequested
 
     function weekStartQt() {
         if (SettingsData.firstDayOfWeek >= 7 || SettingsData.firstDayOfWeek < 0) {
@@ -79,7 +86,7 @@ Rectangle {
     }
 
     function updateSelectedDateEvents() {
-        if (CalendarService && CalendarService.khalAvailable) {
+        if (CalendarService && CalendarService.calendarAvailable) {
             const events = CalendarService.getEventsForDate(selectedDate);
             selectedDateEvents = events;
         } else {
@@ -88,7 +95,7 @@ Rectangle {
     }
 
     function loadEventsForMonth() {
-        if (!CalendarService || !CalendarService.khalAvailable) {
+        if (!CalendarService || !CalendarService.calendarAvailable) {
             return;
         }
 
@@ -104,11 +111,83 @@ Rectangle {
         CalendarService.loadEvents(startDate, endDate);
     }
 
+    function goToToday() {
+        const now = systemClock.date;
+        calendarGrid.selectedDate = now;
+        calendarGrid.displayDate = now;
+        root.selectedDate = now;
+        loadEventsForMonth();
+    }
+
+    function moveSelection(days) {
+        let d = new Date(calendarGrid.selectedDate);
+        d.setDate(d.getDate() + days);
+        calendarGrid.selectedDate = d;
+        root.selectedDate = d;
+        if (d.getMonth() !== calendarGrid.displayDate.getMonth() || d.getFullYear() !== calendarGrid.displayDate.getFullYear()) {
+            calendarGrid.displayDate = d;
+            loadEventsForMonth();
+        }
+    }
+
+    function shiftMonth(delta) {
+        let d = new Date(calendarGrid.displayDate);
+        d.setMonth(d.getMonth() + delta);
+        calendarGrid.displayDate = d;
+        loadEventsForMonth();
+    }
+
+    function handleKeyEvent(event) {
+        if (showEventDetails) {
+            if (event.key === Qt.Key_Escape) {
+                showEventDetails = false;
+                return true;
+            }
+            return false;
+        }
+        switch (event.key) {
+        case Qt.Key_Left:
+        case Qt.Key_H:
+            moveSelection(I18n.isRtl ? 1 : -1);
+            return true;
+        case Qt.Key_Right:
+        case Qt.Key_L:
+            moveSelection(I18n.isRtl ? -1 : 1);
+            return true;
+        case Qt.Key_Up:
+        case Qt.Key_K:
+            moveSelection(-7);
+            return true;
+        case Qt.Key_Down:
+        case Qt.Key_J:
+            moveSelection(7);
+            return true;
+        case Qt.Key_PageUp:
+            shiftMonth(-1);
+            return true;
+        case Qt.Key_PageDown:
+            shiftMonth(1);
+            return true;
+        case Qt.Key_T:
+            goToToday();
+            return true;
+        case Qt.Key_Return:
+        case Qt.Key_Enter:
+        case Qt.Key_Space:
+            root.selectedDate = calendarGrid.selectedDate;
+            showEventDetails = true;
+            return true;
+        }
+        return false;
+    }
+
     onSelectedDateChanged: updateSelectedDateEvents()
 
     onShowEventDetailsChanged: {
         if (showEventDetails) {
             taskInput.forceActiveFocus();
+        } else {
+            navFocusRequested();
         }
     }
 
@@ -122,8 +201,8 @@ Rectangle {
             updateSelectedDateEvents();
         }
 
-        function onKhalAvailableChanged() {
+        function onCalendarAvailableChanged() {
-            if (CalendarService && CalendarService.khalAvailable) {
+            if (CalendarService && CalendarService.calendarAvailable) {
                 loadEventsForMonth();
             }
             updateSelectedDateEvents();
@@ -143,6 +222,55 @@ Rectangle {
         anchors.margins: Theme.spacingM
         spacing: Theme.spacingS
 
+        Rectangle {
+            id: dankWarning
+            width: parent.width
+            visible: CalendarService && CalendarService.dankNeedsLaunch
+            height: visible ? Math.max(28, warningRow.implicitHeight) + Theme.spacingS : 0
+            radius: Theme.cornerRadius
+            color: Qt.rgba(Theme.warning.r, Theme.warning.g, Theme.warning.b, 0.12)
+            border.color: Qt.rgba(Theme.warning.r, Theme.warning.g, Theme.warning.b, 0.35)
+            border.width: 1
+
+            Row {
+                id: warningRow
+                anchors.left: parent.left
+                anchors.right: parent.right
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.leftMargin: Theme.spacingS
+                anchors.rightMargin: Theme.spacingS
+                spacing: Theme.spacingS
+
+                DankIcon {
+                    name: "warning"
+                    size: 16
+                    color: Theme.warning
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                StyledText {
+                    width: parent.width - 16 - Theme.spacingS - (launchButton.visible ? launchButton.width + Theme.spacingS : 0)
+                    anchors.verticalCenter: parent.verticalCenter
+                    text: (CalendarService && CalendarService.dankBinaryExists) ? I18n.tr("DankCalendar isn't running") : I18n.tr("DankCalendar isn't installed")
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.surfaceText
+                    horizontalAlignment: Text.AlignLeft
+                    wrapMode: Text.Wrap
+                }
+
+                DankButton {
+                    id: launchButton
+                    anchors.verticalCenter: parent.verticalCenter
+                    visible: CalendarService && CalendarService.dankBinaryExists
+                    text: I18n.tr("Launch")
+                    buttonHeight: 26
+                    backgroundColor: Theme.primary
+                    textColor: Theme.primaryText
+                    onClicked: CalendarService.launchDankCalendar()
+                }
+            }
+        }
+
         Item {
             width: parent.width
             height: 40
@@ -173,11 +301,40 @@ Rectangle {
                 }
             }
 
+            Rectangle {
+                width: 32
+                height: 32
+                anchors.verticalCenter: parent.verticalCenter
+                anchors.right: parent.right
+                anchors.rightMargin: Theme.spacingS
+                radius: Theme.cornerRadius
+                visible: CalendarService && CalendarService.canCreateEvents
+                color: addEventArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+                DankIcon {
+                    anchors.centerIn: parent
+                    name: "event"
+                    size: 16
+                    color: Theme.primary
+                }
+
+                MouseArea {
+                    id: addEventArea
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    cursorShape: Qt.PointingHandCursor
+                    onClicked: {
+                        root.editorEvent = null;
+                        root.showEditor = true;
+                    }
+                }
+            }
+
             StyledText {
                 anchors.left: parent.left
                 anchors.right: parent.right
                 anchors.leftMargin: 32 + Theme.spacingS * 2
-                anchors.rightMargin: Theme.spacingS
+                anchors.rightMargin: (CalendarService && CalendarService.canCreateEvents) ? 32 + Theme.spacingS * 2 : Theme.spacingS
                 height: 40
                 anchors.verticalCenter: parent.verticalCenter
                 text: {
@@ -229,7 +386,7 @@ Rectangle {
             }
 
             StyledText {
-                width: parent.width - 56
+                width: parent.width - 84
                 height: 28
                 text: calendarGrid.displayDate.toLocaleDateString(I18n.locale(), "MMMM yyyy")
                 font.pixelSize: Theme.fontSizeMedium
@@ -239,6 +396,28 @@ Rectangle {
                 verticalAlignment: Text.AlignVCenter
             }
 
+            Rectangle {
+                width: 28
+                height: 28
+                radius: Theme.cornerRadius
+                color: todayArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+                DankIcon {
+                    anchors.centerIn: parent
+                    name: "today"
+                    size: 14
+                    color: Theme.primary
+                }
+
+                MouseArea {
+                    id: todayArea
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    cursorShape: Qt.PointingHandCursor
+                    onClicked: root.goToToday()
+                }
+            }
+
             Rectangle {
                 width: 28
                 height: 28
@@ -388,6 +567,8 @@ Rectangle {
                                 height: width
                                 color: isToday ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : dayArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : "transparent"
                                 radius: Theme.cornerRadius
+                                border.color: (isSelected && !isToday) ? Theme.primary : "transparent"
+                                border.width: (isSelected && !isToday) ? 1 : 0
 
                                 StyledText {
                                     anchors.centerIn: parent
@@ -397,21 +578,31 @@ Rectangle {
                                     font.weight: isToday ? Font.Medium : Font.Normal
                                 }
 
-                                Rectangle {
+                                Row {
                                     anchors.bottom: parent.bottom
                                     anchors.horizontalCenter: parent.horizontalCenter
-                                    anchors.bottomMargin: 4
+                                    anchors.bottomMargin: 3
-                                    width: 12
+                                    spacing: 2
-                                    height: 2
+                                    visible: CalendarService && CalendarService.calendarAvailable && CalendarService.hasEventsForDate(dayDate)
-                                    radius: Theme.cornerRadius
-                                    visible: CalendarService && CalendarService.khalAvailable && CalendarService.hasEventsForDate(dayDate)
-                                    color: isToday ? Qt.lighter(Theme.primary, 1.3) : Theme.primary
-                                    opacity: isToday ? 0.9 : 0.7
 
-                                    Behavior on opacity {
+                                    Repeater {
-                                        NumberAnimation {
+                                        model: {
-                                            duration: Theme.shortDuration
+                                            const evs = CalendarService.getEventsForDate(dayDate);
-                                            easing.type: Theme.standardEasing
+                                            const seen = [];
+                                            for (let i = 0; i < evs.length && seen.length < 3; i++) {
+                                                const c = (evs[i].color && evs[i].color.length) ? evs[i].color : "primary";
+                                                if (seen.indexOf(c) === -1)
+                                                    seen.push(c);
+                                            }
+                                            return seen;
+                                        }
+
+                                        Rectangle {
+                                            width: 5
+                                            height: 5
+                                            radius: 2.5
+                                            color: modelData === "primary" ? (isToday ? Qt.lighter(Theme.primary, 1.3) : Theme.primary) : modelData
+                                            opacity: isToday ? 0.95 : 0.8
                                         }
                                     }
                                 }
@@ -423,6 +614,7 @@ Rectangle {
                                 hoverEnabled: true
                                 cursorShape: Qt.PointingHandCursor
                                 onClicked: {
+                                    calendarGrid.selectedDate = dayDate;
                                     root.selectedDate = dayDate;
                                     root.showEventDetails = true;
                                 }
@@ -622,7 +814,15 @@ Rectangle {
                             }
                         }
 
-                        color: isDragging ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.15) : (eventMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.06) : Theme.nestedSurface)
+                        readonly property bool isTask: modelData && modelData.id && modelData.id.startsWith("task_")
+                        readonly property color accentColor: {
+                            if (isTask)
+                                return modelData.completed ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.4) : Theme.primary;
+                            return (modelData && modelData.color && modelData.color.length) ? modelData.color : Theme.primary;
+                        }
+                        readonly property color surfaceColor: isDragging ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.15) : (eventMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.06) : Theme.nestedSurface)
+
+                        color: surfaceColor
                         border.color: isDragging ? Theme.primary : (eventMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.15) : Theme.outlineMedium)
                         border.width: (isDragging || eventMouseArea.containsMouse) ? 1 : Theme.layerOutlineWidth
 
@@ -660,15 +860,22 @@ Rectangle {
                             }
                         }
 
-                        Rectangle {
+                        Item {
-                            width: 3
+                            id: accentClip
-                            height: parent.height - 6
+                            width: 4
+                            clip: true
+                            anchors.top: parent.top
+                            anchors.bottom: parent.bottom
                             anchors.left: parent.left
-                            anchors.leftMargin: 3
+
-                            anchors.verticalCenter: parent.verticalCenter
+                            Rectangle {
-                            radius: Theme.cornerRadius
+                                width: taskItem.width
-                            color: (modelData && modelData.id && modelData.id.startsWith("task_")) ? (modelData.completed ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.4) : Theme.primary) : Theme.primary
+                                height: taskItem.height
-                            opacity: 0.8
+                                radius: taskItem.radius
+                                color: taskItem.accentColor
+                                anchors.top: parent.top
+                                anchors.left: parent.left
+                            }
                         }
 
                         // Drag Handle
@@ -767,6 +974,7 @@ Rectangle {
                                 font.pixelSize: Theme.fontSizeSmall
                                 color: (modelData && modelData.id && modelData.id.startsWith("task_") && modelData.completed) ? Qt.rgba(Theme.surfaceText.r, Theme.surfaceText.g, Theme.surfaceText.b, 0.5) : Theme.surfaceText
                                 font.weight: Font.Medium
+                                horizontalAlignment: Text.AlignLeft
                                 elide: Text.ElideRight
                                 maximumLineCount: 1
                             }
@@ -774,21 +982,24 @@ Rectangle {
                             StyledText {
                                 width: parent.width
                                 text: {
-                                    if (!modelData || modelData.allDay) {
+                                    if (!modelData)
-                                        return I18n.tr("All day", "calendar task with no specific time");
+                                        return "";
-                                    } else if (modelData.start && modelData.end) {
+                                    const cal = (modelData.calendar && modelData.calendar.length) ? " · " + modelData.calendar : "";
+                                    if (modelData.allDay)
+                                        return I18n.tr("All day", "calendar task with no specific time") + cal;
+                                    if (modelData.start && modelData.end) {
                                         const timeFormat = SettingsData.use24HourClock ? "HH:mm" : "h:mm AP";
                                         const startTime = Qt.formatTime(modelData.start, timeFormat);
-                                        if (modelData.start.toDateString() !== modelData.end.toDateString() || modelData.start.getTime() !== modelData.end.getTime()) {
+                                        if (modelData.start.toDateString() !== modelData.end.toDateString() || modelData.start.getTime() !== modelData.end.getTime())
-                                            return startTime + " – " + Qt.formatTime(modelData.end, timeFormat);
+                                            return startTime + " – " + Qt.formatTime(modelData.end, timeFormat) + cal;
-                                        }
+                                        return startTime + cal;
-                                        return startTime;
                                     }
                                     return "";
                                 }
                                 font.pixelSize: Theme.fontSizeSmall
                                 color: Qt.rgba(Theme.surfaceText.r, Theme.surfaceText.g, Theme.surfaceText.b, 0.7)
                                 font.weight: Font.Normal
+                                horizontalAlignment: Text.AlignLeft
                                 visible: text !== "" && modelData && modelData.id && !modelData.id.startsWith("task_")
                             }
                         }
@@ -824,8 +1035,9 @@ Rectangle {
                                     taskItem.isEditing = false;
                                 }
 
-                                Keys.onEscapePressed: {
+                                Keys.onEscapePressed: event => {
                                     taskItem.isEditing = false;
+                                    event.accepted = true;
                                 }
                             }
                         }
@@ -838,18 +1050,15 @@ Rectangle {
                             anchors.leftMargin: (modelData && modelData.id && modelData.id.startsWith("task_")) ? 32 : 6
                             anchors.rightMargin: (modelData && modelData.id && modelData.id.startsWith("task_")) ? 64 : 0
                             hoverEnabled: true
-                            cursorShape: (modelData && (modelData.url || (modelData.id && modelData.id.startsWith("task_")))) ? Qt.PointingHandCursor : Qt.ArrowCursor
+                            cursorShape: modelData ? Qt.PointingHandCursor : Qt.ArrowCursor
-                            enabled: modelData && (modelData.url !== "" || (modelData.id && modelData.id.startsWith("task_"))) && !taskItem.isEditing
+                            enabled: modelData && !taskItem.isEditing
                             onClicked: {
                                 if (modelData && modelData.id && modelData.id.startsWith("task_")) {
                                     CalendarService.toggleTask(modelData.id);
-                                } else if (modelData && modelData.url && modelData.url !== "") {
+                                    return;
-                                    if (Qt.openUrlExternally(modelData.url) === false) {
-                                        log.warn("Failed to open URL: " + modelData.url);
-                                    } else {
-                                        root.closeDash();
-                                    }
                                 }
+                                if (modelData)
+                                    root.detailEvent = modelData;
                             }
                         }
 
@@ -953,7 +1162,7 @@ Rectangle {
                 Text {
                     text: I18n.tr("Add a task...", "placeholder in the new-task input field")
                     color: Qt.rgba(Theme.surfaceText.r, Theme.surfaceText.g, Theme.surfaceText.b, 0.4)
-                    visible: !taskInput.text && !taskInput.activeFocus
+                    visible: taskInput.text.length === 0
                     font.pixelSize: Theme.fontSizeSmall
                     anchors.verticalCenter: parent.verticalCenter
                 }
@@ -965,6 +1174,52 @@ Rectangle {
                         text = "";
                     }
                 }
+
+                Keys.onEscapePressed: event => {
+                    root.showEventDetails = false;
+                    event.accepted = true;
+                }
+            }
+        }
+    }
+
+    Loader {
+        anchors.fill: parent
+        z: 1000
+        active: root.detailEvent !== null
+
+        sourceComponent: CalendarEventDetail {
+            eventData: root.detailEvent
+            canEdit: CalendarService && CalendarService.canCreateEvents && root.detailEvent && !root.detailEvent.readOnly && !(root.detailEvent.id && root.detailEvent.id.startsWith("task_"))
+            onCloseRequested: root.detailEvent = null
+            onEditRequested: {
+                root.editorEvent = root.detailEvent;
+                root.detailEvent = null;
+                root.showEditor = true;
+            }
+            onDeleteRequested: {
+                if (root.detailEvent && root.detailEvent.id)
+                    CalendarService.deleteEvent(root.detailEvent.id, null);
+                root.detailEvent = null;
+            }
+        }
+    }
+
+    Loader {
+        anchors.fill: parent
+        z: 1000
+        active: root.showEditor
+
+        sourceComponent: CalendarEventEditor {
+            eventData: root.editorEvent
+            initialDate: root.selectedDate
+            onCloseRequested: {
+                root.showEditor = false;
+                root.editorEvent = null;
+            }
+            onSaved: {
+                root.showEditor = false;
+                root.editorEvent = null;
             }
         }
     }

quickshell/Modules/DankDash/OverviewTab.qml

@@ -14,6 +14,11 @@ Item {
     signal switchToWeatherTab
     signal switchToMediaTab
     signal closeDash
+    signal navFocusRequested
+
+    function handleKeyEvent(event) {
+        return calendarCard.handleKeyEvent(event);
+    }
 
     Item {
         anchors.fill: parent
@@ -54,12 +59,14 @@ Item {
 
         // Calendar - bottom middle (wider and taller)
         CalendarOverviewCard {
+            id: calendarCard
             x: parent.width * 0.2 - Theme.spacingM
             y: 100 + Theme.spacingM
             width: parent.width * 0.6
             height: 300
 
             onCloseDash: root.closeDash()
+            onNavFocusRequested: root.navFocusRequested()
         }
 
         // Media - bottom right (narrow and taller)

quickshell/Modules/DankDash/WeatherTab.qml

@@ -18,6 +18,9 @@ Item {
     property bool showHourly: false
     property bool available: WeatherService.weather.available
 
+    Component.onCompleted: WeatherService.addRef()
+    Component.onDestruction: WeatherService.removeRef()
+
     function syncFrom(type) {
         if (!dailyLoader.item || !hourlyLoader.item)
             return;

quickshell/Modules/Lock/Lock.qml

@@ -60,6 +60,10 @@ Scope {
     function lock() {
         if (SettingsData.customPowerActionLock?.length > 0) {
             Quickshell.execDetached(["sh", "-c", SettingsData.customPowerActionLock]);
+            // The custom locker manages its own surface; DMS never engages
+            // WlSessionLock here, so isShellLocked stays false and the fade
+            // overlay would never be dismissed. Hand off by dismissing it now.
+            IdleService.dismissFadeToLock();
             return;
         }
         if (shouldLock || pendingLock)

quickshell/Modules/Network/WifiConnectionActions.qml

@@ -0,0 +1,47 @@
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+import Quickshell
+import qs.Services
+
+Singleton {
+    id: root
+
+    function connectToNetwork(network, options) {
+        if (!network)
+            return;
+
+        const actionOptions = options || {};
+        const ssid = network.ssid || "";
+        if (!ssid)
+            return;
+
+        const connected = actionOptions.connected ?? network.connected ?? (ssid === NetworkService.currentWifiSSID);
+        if (connected) {
+            if (actionOptions.disconnectWhenConnected ?? false)
+                NetworkService.disconnectWifi();
+            return;
+        }
+
+        if (shouldPromptForCredentials(network)) {
+            PopoutService.showWifiPasswordModal(ssid);
+            return;
+        }
+
+        NetworkService.connectToWifi(ssid);
+    }
+
+    function connectToNetworkFromDetails(ssid, secured, saved, enterprise, connected, options) {
+        connectToNetwork({
+            ssid: ssid,
+            secured: secured,
+            saved: saved,
+            enterprise: enterprise,
+            connected: connected
+        }, options);
+    }
+
+    function shouldPromptForCredentials(network) {
+        return (network.secured ?? false) && !(network.saved ?? false);
+    }
+}

quickshell/Modules/Notepad/Notepad.qml

@@ -44,6 +44,12 @@ Item {
         service: NotepadStorageService
     }
 
+    // In connected frame mode the slideout sits on the Overlay layer
+    onFileDialogOpenChanged: {
+        if (slideout)
+            slideout.suppressOverlayLayer = fileDialogOpen;
+    }
+
     Connections {
         target: slideout
         enabled: slideout !== null

quickshell/Modules/Settings/NetworkEthernetTab.qml

@@ -0,0 +1,462 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import qs.Common
+import qs.Modules.Settings.Widgets
+import qs.Services
+import qs.Widgets
+
+Item {
+    id: networkEthernetTab
+
+    LayoutMirroring.enabled: I18n.isRtl
+    LayoutMirroring.childrenInherit: true
+
+    Component.onCompleted: {
+        NetworkService.addRef();
+    }
+
+    Component.onDestruction: {
+        NetworkService.removeRef();
+    }
+
+    DankFlickable {
+        anchors.fill: parent
+        clip: true
+        contentHeight: mainColumn.height + Theme.spacingXL
+        contentWidth: width
+
+        Column {
+            id: mainColumn
+
+            topPadding: 4
+            width: Math.min(600, parent.width - Theme.spacingL * 2)
+            anchors.horizontalCenter: parent.horizontalCenter
+            spacing: Theme.spacingL
+
+            SettingsCard {
+                id: root
+
+                property string expandedEthDevice: ""
+
+                title: I18n.tr("Ethernet")
+                iconName: "settings_ethernet"
+                settingKey: "networkEthernet"
+                tags: ["ethernet", "wired", "network", "adapters", "connection"]
+
+                width: parent.width
+
+                Column {
+                    id: ethernetSection
+
+                    width: parent.width
+                    spacing: Theme.spacingM
+
+                    StyledText {
+                        text: {
+                            const devices = NetworkService.ethernetDevices;
+                            const connected = devices.filter(d => d.connected).length;
+                            if (devices.length === 0)
+                                return I18n.tr("No adapters");
+                            if (connected === 0)
+                                return devices.length === 1 ? I18n.tr("%1 adapter, none connected").arg(devices.length) : I18n.tr("%1 adapters, none connected").arg(devices.length);
+                            return I18n.tr("%1 connected").arg(connected);
+                        }
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: NetworkService.ethernetConnected ? Theme.primary : Theme.surfaceVariantText
+                        width: parent.width
+                        horizontalAlignment: Text.AlignLeft
+                    }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 1
+                        color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
+                    }
+
+                    Column {
+                        width: parent.width
+                        spacing: 4
+                        visible: NetworkService.ethernetDevices.length > 0
+
+                        StyledText {
+                            text: I18n.tr("Adapters")
+                            font.pixelSize: Theme.fontSizeMedium
+                            font.weight: Font.Medium
+                            color: Theme.surfaceText
+                            width: parent.width
+                            horizontalAlignment: Text.AlignLeft
+                        }
+
+                        Repeater {
+                            model: NetworkService.ethernetDevices
+
+                            delegate: Rectangle {
+                                id: ethDeviceDelegate
+                                required property var modelData
+                                required property int index
+
+                                readonly property bool isConnected: modelData.connected || false
+                                readonly property bool isExpanded: root.expandedEthDevice === modelData.name
+
+                                width: parent.width
+                                height: isExpanded ? 56 + ethExpandedContent.height : 56
+                                radius: Theme.cornerRadius
+                                color: ethDeviceMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceLight
+                                border.width: isConnected ? 2 : 0
+                                border.color: Theme.primary
+                                clip: true
+
+                                Behavior on height {
+                                    NumberAnimation {
+                                        duration: 150
+                                        easing.type: Easing.OutQuad
+                                    }
+                                }
+
+                                Column {
+                                    anchors.fill: parent
+                                    spacing: 0
+
+                                    Item {
+                                        width: parent.width
+                                        height: 56
+
+                                        Row {
+                                            anchors.left: parent.left
+                                            anchors.leftMargin: Theme.spacingM
+                                            anchors.verticalCenter: parent.verticalCenter
+                                            anchors.right: ethDeviceActions.left
+                                            anchors.rightMargin: Theme.spacingS
+                                            spacing: Theme.spacingS
+
+                                            DankIcon {
+                                                name: "lan"
+                                                size: 20
+                                                color: isConnected ? Theme.primary : Theme.surfaceText
+                                                anchors.verticalCenter: parent.verticalCenter
+                                            }
+
+                                            Column {
+                                                anchors.verticalCenter: parent.verticalCenter
+                                                spacing: 2
+                                                width: parent.width - 20 - Theme.spacingS
+
+                                                StyledText {
+                                                    text: modelData.name || I18n.tr("Unknown")
+                                                    font.pixelSize: Theme.fontSizeMedium
+                                                    color: isConnected ? Theme.primary : Theme.surfaceText
+                                                    font.weight: isConnected ? Font.Medium : Font.Normal
+                                                    elide: Text.ElideRight
+                                                    width: parent.width
+                                                    horizontalAlignment: Text.AlignLeft
+                                                }
+
+                                                Row {
+                                                    anchors.left: parent.left
+                                                    spacing: Theme.spacingXS
+
+                                                    StyledText {
+                                                        text: {
+                                                            switch (modelData.state) {
+                                                            case "activated":
+                                                                return I18n.tr("Connected");
+                                                            case "disconnected":
+                                                                return I18n.tr("Disconnected");
+                                                            case "unavailable":
+                                                                return I18n.tr("Unavailable");
+                                                            default:
+                                                                return modelData.state || I18n.tr("Unknown");
+                                                            }
+                                                        }
+                                                        font.pixelSize: Theme.fontSizeSmall
+                                                        color: isConnected ? Theme.primary : Theme.surfaceVariantText
+                                                    }
+
+                                                    StyledText {
+                                                        text: "•"
+                                                        font.pixelSize: Theme.fontSizeSmall
+                                                        color: Theme.surfaceVariantText
+                                                        visible: (modelData.ip || "").length > 0
+                                                    }
+
+                                                    StyledText {
+                                                        text: modelData.ip || ""
+                                                        font.pixelSize: Theme.fontSizeSmall
+                                                        color: Theme.surfaceVariantText
+                                                        visible: (modelData.ip || "").length > 0
+                                                    }
+                                                }
+                                            }
+                                        }
+
+                                        Row {
+                                            id: ethDeviceActions
+                                            anchors.right: parent.right
+                                            anchors.rightMargin: Theme.spacingS
+                                            anchors.verticalCenter: parent.verticalCenter
+                                            spacing: Theme.spacingXS
+
+                                            Rectangle {
+                                                width: 28
+                                                height: 28
+                                                radius: 14
+                                                color: ethExpandBtn.containsMouse ? Theme.surfacePressed : "transparent"
+                                                visible: isConnected
+
+                                                DankIcon {
+                                                    anchors.centerIn: parent
+                                                    name: isExpanded ? "expand_less" : "expand_more"
+                                                    size: 18
+                                                    color: Theme.surfaceText
+                                                }
+
+                                                MouseArea {
+                                                    id: ethExpandBtn
+                                                    anchors.fill: parent
+                                                    hoverEnabled: true
+                                                    cursorShape: Qt.PointingHandCursor
+                                                    onClicked: {
+                                                        if (isExpanded) {
+                                                            root.expandedEthDevice = "";
+                                                        } else {
+                                                            root.expandedEthDevice = modelData.name;
+                                                            NetworkService.fetchWiredNetworkInfo(NetworkService.ethernetConnectionUuid);
+                                                        }
+                                                    }
+                                                }
+                                            }
+
+                                            Rectangle {
+                                                width: 28
+                                                height: 28
+                                                radius: 14
+                                                color: ethDisconnectBtn.containsMouse ? Theme.errorHover : "transparent"
+                                                visible: isConnected
+
+                                                DankIcon {
+                                                    anchors.centerIn: parent
+                                                    name: "link_off"
+                                                    size: 18
+                                                    color: ethDisconnectBtn.containsMouse ? Theme.error : Theme.surfaceVariantText
+                                                }
+
+                                                MouseArea {
+                                                    id: ethDisconnectBtn
+                                                    anchors.fill: parent
+                                                    hoverEnabled: true
+                                                    cursorShape: Qt.PointingHandCursor
+                                                    onClicked: NetworkService.disconnectEthernetDevice(modelData.name)
+                                                }
+                                            }
+                                        }
+
+                                        MouseArea {
+                                            id: ethDeviceMouseArea
+                                            anchors.fill: parent
+                                            anchors.rightMargin: ethDeviceActions.width + Theme.spacingM
+                                            hoverEnabled: true
+                                        }
+                                    }
+
+                                    Column {
+                                        id: ethExpandedContent
+                                        width: parent.width
+                                        visible: isExpanded
+
+                                        Rectangle {
+                                            width: parent.width - Theme.spacingM * 2
+                                            height: 1
+                                            x: Theme.spacingM
+                                            color: Theme.outlineLight
+                                        }
+
+                                        Item {
+                                            width: parent.width
+                                            height: ethDetailsColumn.implicitHeight + Theme.spacingM * 2
+
+                                            Column {
+                                                id: ethDetailsColumn
+                                                anchors.fill: parent
+                                                anchors.margins: Theme.spacingM
+                                                spacing: Theme.spacingS
+
+                                                Flow {
+                                                    width: parent.width
+                                                    spacing: Theme.spacingXS
+
+                                                    Repeater {
+                                                        model: {
+                                                            const fields = [];
+                                                            const dev = modelData;
+                                                            if (!dev)
+                                                                return fields;
+
+                                                            if (dev.ip)
+                                                                fields.push({
+                                                                    label: I18n.tr("IP"),
+                                                                    value: dev.ip
+                                                                });
+                                                            if (dev.speed && dev.speed > 0)
+                                                                fields.push({
+                                                                    label: I18n.tr("Speed"),
+                                                                    value: dev.speed + " Mbps"
+                                                                });
+                                                            if (dev.hwAddress)
+                                                                fields.push({
+                                                                    label: I18n.tr("MAC"),
+                                                                    value: dev.hwAddress
+                                                                });
+                                                            if (dev.driver)
+                                                                fields.push({
+                                                                    label: I18n.tr("Driver"),
+                                                                    value: dev.driver
+                                                                });
+                                                            fields.push({
+                                                                label: I18n.tr("State"),
+                                                                value: dev.state || I18n.tr("Unknown")
+                                                            });
+
+                                                            return fields;
+                                                        }
+
+                                                        delegate: Rectangle {
+                                                            required property var modelData
+                                                            required property int index
+
+                                                            width: ethFieldContent.width + Theme.spacingM * 2
+                                                            height: 32
+                                                            radius: Theme.cornerRadius - 2
+                                                            color: Theme.surfaceContainerHigh
+                                                            border.width: 1
+                                                            border.color: Theme.outlineLight
+
+                                                            Row {
+                                                                id: ethFieldContent
+                                                                anchors.centerIn: parent
+                                                                spacing: Theme.spacingXS
+
+                                                                StyledText {
+                                                                    text: modelData.label + ":"
+                                                                    font.pixelSize: Theme.fontSizeSmall
+                                                                    color: Theme.surfaceVariantText
+                                                                    anchors.verticalCenter: parent.verticalCenter
+                                                                }
+
+                                                                StyledText {
+                                                                    text: modelData.value
+                                                                    font.pixelSize: Theme.fontSizeSmall
+                                                                    color: Theme.surfaceText
+                                                                    font.weight: Font.Medium
+                                                                    anchors.verticalCenter: parent.verticalCenter
+                                                                }
+                                                            }
+                                                        }
+                                                    }
+                                                }
+
+                                                Item {
+                                                    width: parent.width
+                                                    height: NetworkService.networkWiredInfoLoading ? 40 : 0
+                                                    visible: NetworkService.networkWiredInfoLoading
+
+                                                    DankSpinner {
+                                                        anchors.centerIn: parent
+                                                        size: 20
+                                                    }
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+
+                    Column {
+                        width: parent.width
+                        spacing: Theme.spacingS
+                        visible: NetworkService.wiredConnections.length > 0
+
+                        Rectangle {
+                            width: parent.width
+                            height: 1
+                            color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Saved Configurations")
+                            font.pixelSize: Theme.fontSizeMedium
+                            font.weight: Font.Medium
+                            color: Theme.surfaceText
+                            width: parent.width
+                            horizontalAlignment: Text.AlignLeft
+                        }
+
+                        Repeater {
+                            model: NetworkService.wiredConnections
+
+                            delegate: Rectangle {
+                                required property var modelData
+                                required property int index
+
+                                width: parent.width
+                                height: 48
+                                radius: Theme.cornerRadius
+                                color: wiredMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceLight
+                                border.width: modelData.isActive ? 2 : 0
+                                border.color: Theme.primary
+
+                                Row {
+                                    anchors.left: parent.left
+                                    anchors.leftMargin: Theme.spacingM
+                                    anchors.verticalCenter: parent.verticalCenter
+                                    spacing: Theme.spacingS
+
+                                    DankIcon {
+                                        name: "lan"
+                                        size: 20
+                                        color: modelData.isActive ? Theme.primary : Theme.surfaceText
+                                        anchors.verticalCenter: parent.verticalCenter
+                                    }
+
+                                    Column {
+                                        anchors.verticalCenter: parent.verticalCenter
+                                        spacing: 2
+
+                                        StyledText {
+                                            text: modelData.id || I18n.tr("Unknown")
+                                            font.pixelSize: Theme.fontSizeMedium
+                                            color: modelData.isActive ? Theme.primary : Theme.surfaceText
+                                            font.weight: modelData.isActive ? Font.Medium : Font.Normal
+                                        }
+
+                                        StyledText {
+                                            text: modelData.isActive ? I18n.tr("Active") : ""
+                                            font.pixelSize: Theme.fontSizeSmall
+                                            color: Theme.primary
+                                            visible: modelData.isActive
+                                        }
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: wiredMouseArea
+
+                                    anchors.fill: parent
+                                    hoverEnabled: true
+                                    cursorShape: Qt.PointingHandCursor
+                                    onClicked: {
+                                        if (!modelData.isActive) {
+                                            NetworkService.connectToSpecificWiredConfig(modelData.uuid);
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

quickshell/Modules/Settings/NetworkStatusTab.qml

@@ -0,0 +1,202 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import qs.Common
+import qs.Modules.Settings.Widgets
+import qs.Services
+import qs.Widgets
+
+Item {
+    id: networkStatusTab
+
+    LayoutMirroring.enabled: I18n.isRtl
+    LayoutMirroring.childrenInherit: true
+
+    Component.onCompleted: {
+        NetworkService.addRef();
+    }
+
+    Component.onDestruction: {
+        NetworkService.removeRef();
+    }
+
+    DankFlickable {
+        anchors.fill: parent
+        clip: true
+        contentHeight: mainColumn.height + Theme.spacingXL
+        contentWidth: width
+
+        Column {
+            id: mainColumn
+
+            topPadding: 4
+            width: Math.min(600, parent.width - Theme.spacingL * 2)
+            anchors.horizontalCenter: parent.horizontalCenter
+            spacing: Theme.spacingL
+
+            SettingsCard {
+                id: root
+
+                title: I18n.tr("Network Status")
+                iconName: "lan"
+                settingKey: "networkStatus"
+                tags: ["status", "network", "connectivity", "internet"]
+
+                width: parent.width
+
+                Column {
+                    id: overviewSection
+
+                    width: parent.width
+                    spacing: Theme.spacingM
+
+                    StyledText {
+                        text: I18n.tr("Overview of your network connections")
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.surfaceVariantText
+                        width: parent.width
+                        horizontalAlignment: Text.AlignLeft
+                    }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 1
+                        color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
+                    }
+
+                    Grid {
+                        columns: 2
+                        columnSpacing: Theme.spacingL
+                        rowSpacing: Theme.spacingS
+                        width: parent.width
+
+                        StyledText {
+                            text: I18n.tr("Backend")
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceVariantText
+                        }
+                        StyledText {
+                            text: NetworkService.backend || I18n.tr("Unknown")
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceText
+                            font.weight: Font.Medium
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Status")
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceVariantText
+                        }
+                        Row {
+                            spacing: Theme.spacingS
+
+                            Rectangle {
+                                width: 8
+                                height: 8
+                                radius: 4
+                                anchors.verticalCenter: parent.verticalCenter
+                                color: {
+                                    switch (NetworkService.networkStatus) {
+                                    case "ethernet":
+                                    case "wifi":
+                                        return Theme.success;
+                                    case "disconnected":
+                                        return Theme.error;
+                                    default:
+                                        return Theme.warning;
+                                    }
+                                }
+                            }
+
+                            StyledText {
+                                text: {
+                                    switch (NetworkService.networkStatus) {
+                                    case "ethernet":
+                                        return I18n.tr("Ethernet");
+                                    case "wifi":
+                                        return I18n.tr("WiFi");
+                                    case "disconnected":
+                                        return I18n.tr("Disconnected");
+                                    default:
+                                        return NetworkService.networkStatus || I18n.tr("Unknown");
+                                    }
+                                }
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                            }
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Primary")
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceVariantText
+                            visible: NetworkService.primaryConnection.length > 0
+                        }
+                        StyledText {
+                            text: NetworkService.primaryConnection || "-"
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceText
+                            elide: Text.ElideRight
+                            visible: NetworkService.primaryConnection.length > 0
+                        }
+                    }
+
+                    Row {
+                        width: parent.width
+                        spacing: Theme.spacingM
+                        visible: NetworkService.backend === "networkmanager" && NetworkService.ethernetConnected && NetworkService.wifiConnected
+
+                        StyledText {
+                            text: I18n.tr("Preference")
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceVariantText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        Item {
+                            width: parent.width - preferenceLabel.width - preferenceButtons.width - Theme.spacingM * 2
+                            height: 1
+                        }
+
+                        DankButtonGroup {
+                            id: preferenceButtons
+                            model: [I18n.tr("Auto"), I18n.tr("Ethernet"), I18n.tr("WiFi")]
+                            currentIndex: {
+                                switch (NetworkService.userPreference) {
+                                case "ethernet":
+                                    return 1;
+                                case "wifi":
+                                    return 2;
+                                default:
+                                    return 0;
+                                }
+                            }
+                            onSelectionChanged: (index, selected) => {
+                                if (!selected)
+                                    return;
+                                switch (index) {
+                                case 0:
+                                    NetworkService.setNetworkPreference("auto");
+                                    break;
+                                case 1:
+                                    NetworkService.setNetworkPreference("ethernet");
+                                    break;
+                                case 2:
+                                    NetworkService.setNetworkPreference("wifi");
+                                    break;
+                                }
+                            }
+                        }
+                    }
+
+                    StyledText {
+                        id: preferenceLabel
+                        visible: false
+                        text: I18n.tr("Preference")
+                    }
+                }
+            }
+        }
+    }
+}

quickshell/Modules/Settings/NetworkVpnTab.qml

@@ -0,0 +1,516 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell
+import qs.Common
+import qs.Modules.Settings.Widgets
+import qs.Modals.Common
+import qs.Modals.FileBrowser
+import qs.Services
+import qs.Widgets
+
+Item {
+    id: networkVpnTab
+
+    LayoutMirroring.enabled: I18n.isRtl
+    LayoutMirroring.childrenInherit: true
+
+    Component.onCompleted: {
+        NetworkService.addRef();
+    }
+
+    Component.onDestruction: {
+        NetworkService.removeRef();
+    }
+
+    DankFlickable {
+        anchors.fill: parent
+        clip: true
+        contentHeight: mainColumn.height + Theme.spacingXL
+        contentWidth: width
+
+        Column {
+            id: mainColumn
+
+            topPadding: 4
+            width: Math.min(600, parent.width - Theme.spacingL * 2)
+            anchors.horizontalCenter: parent.horizontalCenter
+            spacing: Theme.spacingL
+
+            SettingsCard {
+                id: root
+
+                property string expandedVpnUuid: ""
+
+                title: I18n.tr("VPN")
+                iconName: "vpn_key"
+                settingKey: "networkVpn"
+                tags: ["vpn", "network", "profiles", "import", "openvpn", "wireguard"]
+
+                function openVpnFileBrowser() {
+                    vpnFileBrowserLoader.active = true;
+                    if (vpnFileBrowserLoader.item)
+                        vpnFileBrowserLoader.item.open();
+                }
+
+                property var vpnFileBrowserLoader: LazyLoader {
+                    active: false
+
+                    FileBrowserModal {
+                        browserTitle: I18n.tr("Import VPN")
+                        browserIcon: "vpn_key"
+                        browserType: "vpn"
+                        fileExtensions: VPNService.getFileFilter()
+
+                        onFileSelected: path => {
+                            VPNService.importVpn(path.replace("file://", ""));
+                        }
+                    }
+                }
+
+                property var deleteVpnConfirm: ConfirmModal {}
+
+                width: parent.width
+
+                Column {
+                    id: vpnSection
+
+                    width: parent.width
+                    spacing: Theme.spacingM
+
+                    StyledText {
+                        text: I18n.tr("Unavailable")
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.surfaceVariantText
+                        width: parent.width
+                        horizontalAlignment: Text.AlignLeft
+                        visible: !DMSNetworkService.vpnAvailable
+                    }
+
+                    Row {
+                        width: parent.width
+                        spacing: Theme.spacingM
+                        visible: DMSNetworkService.vpnAvailable
+
+                        StyledText {
+                            text: {
+                                if (!DMSNetworkService.connected)
+                                    return I18n.tr("Disconnected");
+                                const names = DMSNetworkService.activeNames || [];
+                                if (names.length <= 1)
+                                    return names[0] || I18n.tr("Connected");
+                                return names[0] + " +" + (names.length - 1);
+                            }
+                            font.pixelSize: Theme.fontSizeSmall
+                            color: DMSNetworkService.connected ? Theme.primary : Theme.surfaceVariantText
+                            width: parent.width - vpnHeaderControls.width - Theme.spacingM
+                            horizontalAlignment: Text.AlignLeft
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        Row {
+                            id: vpnHeaderControls
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: Theme.spacingS
+
+                            Rectangle {
+                                height: 28
+                                radius: 14
+                                width: importVpnRow.width + Theme.spacingM * 2
+                                color: importVpnArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceLight
+                                opacity: VPNService.importing ? 0.5 : 1.0
+
+                                Row {
+                                    id: importVpnRow
+                                    anchors.centerIn: parent
+                                    spacing: Theme.spacingXS
+
+                                    DankIcon {
+                                        name: VPNService.importing ? "sync" : "add"
+                                        size: Theme.fontSizeSmall
+                                        color: Theme.primary
+                                    }
+
+                                    StyledText {
+                                        text: I18n.tr("Import")
+                                        font.pixelSize: Theme.fontSizeSmall
+                                        color: Theme.primary
+                                        font.weight: Font.Medium
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: importVpnArea
+                                    anchors.fill: parent
+                                    hoverEnabled: true
+                                    cursorShape: VPNService.importing ? Qt.BusyCursor : Qt.PointingHandCursor
+                                    enabled: !VPNService.importing
+                                    onClicked: root.openVpnFileBrowser()
+                                }
+                            }
+
+                            Rectangle {
+                                height: 28
+                                radius: 14
+                                width: disconnectAllRow.width + Theme.spacingM * 2
+                                color: disconnectAllArea.containsMouse ? Theme.errorHover : Theme.surfaceLight
+                                visible: DMSNetworkService.connected
+                                opacity: DMSNetworkService.isBusy ? 0.5 : 1.0
+
+                                Row {
+                                    id: disconnectAllRow
+                                    anchors.centerIn: parent
+                                    spacing: Theme.spacingXS
+
+                                    DankIcon {
+                                        name: "link_off"
+                                        size: Theme.fontSizeSmall
+                                        color: Theme.surfaceText
+                                    }
+
+                                    StyledText {
+                                        text: I18n.tr("Disconnect")
+                                        font.pixelSize: Theme.fontSizeSmall
+                                        color: Theme.surfaceText
+                                        font.weight: Font.Medium
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: disconnectAllArea
+                                    anchors.fill: parent
+                                    hoverEnabled: true
+                                    cursorShape: DMSNetworkService.isBusy ? Qt.BusyCursor : Qt.PointingHandCursor
+                                    enabled: !DMSNetworkService.isBusy
+                                    onClicked: DMSNetworkService.disconnectAllActive()
+                                }
+                            }
+                        }
+                    }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 1
+                        color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
+                        visible: DMSNetworkService.vpnAvailable
+                    }
+
+                    Item {
+                        width: parent.width
+                        height: 100
+                        visible: DMSNetworkService.vpnAvailable && DMSNetworkService.profiles.length === 0
+
+                        Column {
+                            anchors.centerIn: parent
+                            spacing: Theme.spacingS
+
+                            DankIcon {
+                                name: "vpn_key_off"
+                                size: 36
+                                color: Theme.surfaceVariantText
+                                anchors.horizontalCenter: parent.horizontalCenter
+                            }
+
+                            StyledText {
+                                text: I18n.tr("No VPN profiles")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceVariantText
+                                anchors.horizontalCenter: parent.horizontalCenter
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Click Import to add a .ovpn or .conf")
+                                font.pixelSize: Theme.fontSizeSmall
+                                color: Theme.surfaceVariantText
+                                anchors.horizontalCenter: parent.horizontalCenter
+                            }
+                        }
+                    }
+
+                    Column {
+                        width: parent.width
+                        spacing: 4
+                        visible: DMSNetworkService.vpnAvailable && DMSNetworkService.profiles.length > 0
+
+                        Repeater {
+                            model: DMSNetworkService.profiles
+
+                            delegate: Rectangle {
+                                id: vpnProfileRow
+                                required property var modelData
+                                required property int index
+
+                                readonly property bool isActive: DMSNetworkService.isActiveUuid(modelData.uuid)
+                                readonly property bool isTransient: !!modelData.transient
+                                readonly property bool canExpand: modelData.canExpand !== false
+                                readonly property bool canDelete: modelData.canDelete !== false
+                                readonly property bool isExpanded: root.expandedVpnUuid === modelData.uuid
+                                readonly property var configData: (!isTransient && isExpanded) ? VPNService.editConfig : null
+
+                                width: parent.width
+                                height: isExpanded ? 56 + vpnExpandedContent.height : 56
+                                radius: Theme.cornerRadius
+                                color: vpnRowArea.containsMouse ? Theme.primaryHoverLight : (isActive ? Theme.primaryPressed : Theme.surfaceLight)
+                                border.width: isActive ? 2 : 0
+                                border.color: Theme.primary
+                                opacity: DMSNetworkService.isBusy ? 0.6 : 1.0
+                                clip: true
+
+                                Behavior on height {
+                                    NumberAnimation {
+                                        duration: 150
+                                        easing.type: Easing.OutQuad
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: vpnRowArea
+                                    anchors.fill: parent
+                                    hoverEnabled: true
+                                    cursorShape: DMSNetworkService.isBusy ? Qt.BusyCursor : Qt.PointingHandCursor
+                                    enabled: !DMSNetworkService.isBusy
+                                    onClicked: DMSNetworkService.toggle(modelData.uuid)
+                                }
+
+                                Column {
+                                    anchors.fill: parent
+                                    anchors.margins: Theme.spacingS
+                                    spacing: Theme.spacingS
+
+                                    Row {
+                                        width: parent.width
+                                        height: 56 - Theme.spacingS * 2
+                                        spacing: Theme.spacingS
+
+                                        DankIcon {
+                                            name: isActive ? "vpn_lock" : "vpn_key_off"
+                                            size: 20
+                                            color: isActive ? Theme.primary : Theme.surfaceText
+                                            anchors.verticalCenter: parent.verticalCenter
+                                        }
+
+                                        Column {
+                                            spacing: 2
+                                            anchors.verticalCenter: parent.verticalCenter
+                                            width: parent.width - 20 - ((canExpand ? 28 : 0) + (canDelete ? 28 : 0)) - Theme.spacingS * 4
+
+                                            StyledText {
+                                                text: modelData.name
+                                                font.pixelSize: Theme.fontSizeMedium
+                                                color: isActive ? Theme.primary : Theme.surfaceText
+                                                elide: Text.ElideRight
+                                                width: parent.width
+                                                horizontalAlignment: Text.AlignLeft
+                                            }
+
+                                            StyledText {
+                                                text: VPNService.getVpnTypeFromProfile(modelData)
+                                                font.pixelSize: Theme.fontSizeSmall
+                                                color: Theme.surfaceVariantText
+                                                anchors.left: parent.left
+                                            }
+                                        }
+
+                                        Item {
+                                            width: Theme.spacingXS
+                                            height: 1
+                                        }
+
+                                        Rectangle {
+                                            width: 28
+                                            height: 28
+                                            radius: 14
+                                            color: vpnExpandBtn.containsMouse ? Theme.surfacePressed : "transparent"
+                                            anchors.verticalCenter: parent.verticalCenter
+                                            visible: canExpand
+
+                                            DankIcon {
+                                                anchors.centerIn: parent
+                                                name: isExpanded ? "expand_less" : "expand_more"
+                                                size: 18
+                                                color: Theme.surfaceText
+                                            }
+
+                                            MouseArea {
+                                                id: vpnExpandBtn
+                                                anchors.fill: parent
+                                                hoverEnabled: true
+                                                cursorShape: Qt.PointingHandCursor
+                                                onClicked: {
+                                                    if (isExpanded) {
+                                                        root.expandedVpnUuid = "";
+                                                    } else {
+                                                        root.expandedVpnUuid = modelData.uuid;
+                                                        VPNService.getConfig(modelData.uuid);
+                                                    }
+                                                }
+                                            }
+                                        }
+
+                                        Rectangle {
+                                            width: 28
+                                            height: 28
+                                            radius: 14
+                                            color: vpnDeleteBtn.containsMouse ? Theme.errorHover : "transparent"
+                                            anchors.verticalCenter: parent.verticalCenter
+                                            visible: canDelete
+
+                                            DankIcon {
+                                                anchors.centerIn: parent
+                                                name: "delete"
+                                                size: 18
+                                                color: vpnDeleteBtn.containsMouse ? Theme.error : Theme.surfaceVariantText
+                                            }
+
+                                            MouseArea {
+                                                id: vpnDeleteBtn
+                                                anchors.fill: parent
+                                                hoverEnabled: true
+                                                cursorShape: Qt.PointingHandCursor
+                                                onClicked: {
+                                                    deleteVpnConfirm.showWithOptions({
+                                                        title: I18n.tr("Delete VPN"),
+                                                        message: I18n.tr("Delete \"%1\"?").arg(modelData.name),
+                                                        confirmText: I18n.tr("Delete"),
+                                                        confirmColor: Theme.error,
+                                                        onConfirm: () => VPNService.deleteVpn(modelData.uuid)
+                                                    });
+                                                }
+                                            }
+                                        }
+                                    }
+
+                                    Column {
+                                        id: vpnExpandedContent
+                                        width: parent.width
+                                        spacing: Theme.spacingXS
+                                        visible: !isTransient && isExpanded
+
+                                        Rectangle {
+                                            width: parent.width
+                                            height: 1
+                                            color: Theme.outlineLight
+                                        }
+
+                                        Item {
+                                            width: parent.width
+                                            height: VPNService.configLoading ? 40 : 0
+                                            visible: VPNService.configLoading
+
+                                            DankSpinner {
+                                                anchors.centerIn: parent
+                                                size: 20
+                                            }
+                                        }
+
+                                        Flow {
+                                            width: parent.width
+                                            spacing: Theme.spacingXS
+                                            visible: !VPNService.configLoading && configData
+
+                                            Repeater {
+                                                model: {
+                                                    if (!configData)
+                                                        return [];
+                                                    const fields = [];
+                                                    const data = configData.data || {};
+
+                                                    if (data.remote)
+                                                        fields.push({
+                                                            label: I18n.tr("Server"),
+                                                            value: data.remote
+                                                        });
+                                                    if (configData.username || data.username)
+                                                        fields.push({
+                                                            label: I18n.tr("Username"),
+                                                            value: configData.username || data.username
+                                                        });
+                                                    if (data.cipher)
+                                                        fields.push({
+                                                            label: I18n.tr("Cipher"),
+                                                            value: data.cipher
+                                                        });
+                                                    if (data.auth)
+                                                        fields.push({
+                                                            label: I18n.tr("Auth"),
+                                                            value: data.auth
+                                                        });
+                                                    if (data["proto-tcp"] === "yes" || data["proto-tcp"] === "no")
+                                                        fields.push({
+                                                            label: I18n.tr("Protocol"),
+                                                            value: data["proto-tcp"] === "yes" ? "TCP" : "UDP"
+                                                        });
+                                                    if (data["tunnel-mtu"])
+                                                        fields.push({
+                                                            label: I18n.tr("MTU"),
+                                                            value: data["tunnel-mtu"]
+                                                        });
+                                                    if (data["connection-type"])
+                                                        fields.push({
+                                                            label: I18n.tr("Auth Type"),
+                                                            value: data["connection-type"]
+                                                        });
+                                                    return fields;
+                                                }
+
+                                                delegate: Rectangle {
+                                                    required property var modelData
+                                                    required property int index
+
+                                                    width: vpnFieldContent.width + Theme.spacingM * 2
+                                                    height: 32
+                                                    radius: Theme.cornerRadius - 2
+                                                    color: Theme.surfaceContainerHigh
+                                                    border.width: 1
+                                                    border.color: Theme.outlineLight
+
+                                                    Row {
+                                                        id: vpnFieldContent
+                                                        anchors.centerIn: parent
+                                                        spacing: Theme.spacingXS
+
+                                                        StyledText {
+                                                            text: modelData.label + ":"
+                                                            font.pixelSize: Theme.fontSizeSmall
+                                                            color: Theme.surfaceVariantText
+                                                            anchors.verticalCenter: parent.verticalCenter
+                                                        }
+
+                                                        StyledText {
+                                                            text: modelData.value
+                                                            font.pixelSize: Theme.fontSizeSmall
+                                                            color: Theme.surfaceText
+                                                            font.weight: Font.Medium
+                                                            anchors.verticalCenter: parent.verticalCenter
+                                                        }
+                                                    }
+                                                }
+                                            }
+                                        }
+
+                                        DankToggle {
+                                            width: parent.width
+                                            text: I18n.tr("Autoconnect")
+                                            checked: configData ? (configData.autoconnect || false) : false
+                                            visible: !VPNService.configLoading && configData !== null
+                                            onToggled: checked => {
+                                                VPNService.updateConfig(modelData.uuid, {
+                                                    autoconnect: checked
+                                                });
+                                            }
+                                        }
+
+                                        Item {
+                                            width: 1
+                                            height: Theme.spacingXS
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

quickshell/Modules/Settings/SoundsTab.qml

@@ -131,6 +131,23 @@ Item {
                         checked: SettingsData.soundPluggedIn
                         onToggled: checked => SettingsData.set("soundPluggedIn", checked)
                     }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 1
+                        color: Theme.outline
+                        opacity: 0.2
+                    }
+
+                    SettingsToggleRow {
+                        tab: "sounds"
+                        tags: ["sound", "media", "playback", "mute", "mpris", "music"]
+                        settingKey: "muteSoundsWhenMediaPlaying"
+                        text: I18n.tr("Mute During Playback")
+                        description: I18n.tr("Silence system sounds while media is playing")
+                        checked: SettingsData.muteSoundsWhenMediaPlaying
+                        onToggled: checked => SettingsData.set("muteSoundsWhenMediaPlaying", checked)
+                    }
                 }
             }
 

quickshell/Modules/Settings/ThemeColorsTab.qml

@@ -20,6 +20,31 @@ Item {
     property var cachedMatugenSchemes: Theme.availableMatugenSchemes.map(option => option.label)
     property var installedRegistryThemes: []
     property var templateDetection: []
+    readonly property var widgetBackgroundOptions: [({
+                "value": "sth",
+                "label": I18n.tr("Subtle Overlay", "widget background color option")
+            }), ({
+                "value": "s",
+                "label": I18n.tr("Surface", "widget background color option")
+            }), ({
+                "value": "sc",
+                "label": I18n.tr("Surface Container", "widget background color option")
+            }), ({
+                "value": "sch",
+                "label": I18n.tr("Surface High", "widget background color option")
+            }), ({
+                "value": "primaryContainer",
+                "label": I18n.tr("Primary Container", "widget background color option")
+            }), ({
+                "value": "secondaryContainer",
+                "label": I18n.tr("Secondary Container", "widget background color option")
+            }), ({
+                "value": "tertiaryContainer",
+                "label": I18n.tr("Tertiary Container", "widget background color option")
+            }), ({
+                "value": "custom",
+                "label": I18n.tr("Custom", "widget background color option")
+            })]
 
     property var cursorIncludeStatus: ({
             "exists": false,
@@ -1524,10 +1549,10 @@ Item {
 
                 SettingsButtonGroupRow {
                     tab: "theme"
-                    tags: ["widget", "style", "colorful", "default"]
+                    tags: ["widget", "text", "style", "colorful", "default"]
                     settingKey: "widgetColorMode"
-                    text: I18n.tr("Widget Style")
+                    text: I18n.tr("Widget Text Style")
-                    description: I18n.tr("Change bar appearance")
+                    description: I18n.tr("Choose neutral or accent-colored widget text")
                     model: [I18n.tr("Default", "widget style option"), I18n.tr("Colorful", "widget style option")]
                     currentIndex: SettingsData.widgetColorMode === "colorful" ? 1 : 0
                     onSelectionChanged: (index, selected) => {
@@ -1537,38 +1562,41 @@ Item {
                     }
                 }
 
-                SettingsButtonGroupRow {
+                WorkspaceColorRow {
                     tab: "theme"
-                    tags: ["widget", "background", "color"]
+                    tags: ["widget", "background", "color", "surface", "material"]
                     settingKey: "widgetBackgroundColor"
                     text: I18n.tr("Widget Background Color")
                     description: I18n.tr("Choose the background color for widgets")
-                    model: ["sth", "s", "sc", "sch"]
+                    dropdownWidth: 220
-                    buttonHeight: 20
+                    options: themeColorsTab.widgetBackgroundOptions
-                    minButtonWidth: 32
+                    currentMode: SettingsData.widgetBackgroundColor
-                    buttonPadding: Theme.spacingS
+                    customColor: SettingsData.widgetBackgroundCustomColor || "#6750A4"
-                    checkIconSize: Theme.iconSizeSmall - 2
+                    pickerTitle: I18n.tr("Widget Background Color")
-                    textSize: Theme.fontSizeSmall - 2
+                    onModeSelected: mode => SettingsData.set("widgetBackgroundColor", mode)
-                    spacing: 1
+                    onCustomColorSelected: selectedColor => SettingsData.set("widgetBackgroundCustomColor", selectedColor.toString())
-                    currentIndex: {
+                }
-                        switch (SettingsData.widgetBackgroundColor) {
+
-                        case "sth":
+                SettingsSliderRow {
-                            return 0;
+                    id: widgetBackgroundCustomStrengthSlider
-                        case "s":
+                    visible: SettingsData.widgetBackgroundColor === "custom"
-                            return 1;
+                    tab: "theme"
-                        case "sc":
+                    tags: ["widget", "background", "color", "custom", "blend"]
-                            return 2;
+                    settingKey: "widgetBackgroundCustomStrength"
-                        case "sch":
+                    text: I18n.tr("Custom Blend")
-                            return 3;
+                    description: I18n.tr("Blend between Surface High and the selected custom color")
-                        default:
+                    value: Math.round(SettingsData.widgetBackgroundCustomStrength * 100)
-                            return 0;
+                    minimum: 0
-                        }
+                    maximum: 100
-                    }
+                    unit: "%"
-                    onSelectionChanged: (index, selected) => {
+                    defaultValue: 40
-                        if (!selected)
+                    onSliderValueChanged: newValue => SettingsData.set("widgetBackgroundCustomStrength", newValue / 100)
-                            return;
+
-                        const colorOptions = ["sth", "s", "sc", "sch"];
+                    Binding {
-                        SettingsData.set("widgetBackgroundColor", colorOptions[index]);
+                        target: widgetBackgroundCustomStrengthSlider
+                        property: "value"
+                        value: Math.round(SettingsData.widgetBackgroundCustomStrength * 100)
+                        restoreMode: Binding.RestoreBinding
                     }
                 }
 

quickshell/Modules/Settings/TimeWeatherTab.qml

@@ -115,6 +115,34 @@ Item {
                     }
                 }
 
+                SettingsDropdownRow {
+                    tab: "time"
+                    tags: ["calendar", "backend", "daemon", "khal", "dankcalendar", "events"]
+                    settingKey: "calendarBackend"
+                    text: I18n.tr("Calendar Backend")
+                    description: {
+                        const resolved = CalendarService.activeBackend;
+                        switch (resolved) {
+                        case "dankcal":
+                            return I18n.tr("Using DankCalendar%1", "calendar backend status").arg(CalendarService.isDankActive && CalendarService.calendars.length > 0 ? "" : " (connecting…)");
+                        case "khal":
+                            return I18n.tr("Using khal", "calendar backend status");
+                        default:
+                            return I18n.tr("No calendar source available", "calendar backend status");
+                        }
+                    }
+                    readonly property var _backendValues: ["auto", "khal", "dankcal"]
+                    readonly property var _backendLabels: [I18n.tr("Auto", "calendar backend option"), I18n.tr("khal", "calendar backend option"), I18n.tr("DankCalendar", "calendar backend option")]
+                    options: _backendLabels
+                    currentValue: _backendLabels[Math.max(0, _backendValues.indexOf(SettingsData.calendarBackend))]
+                    onValueChanged: value => {
+                        const idx = _backendLabels.indexOf(value);
+                        if (idx < 0)
+                            return;
+                        SettingsData.set("calendarBackend", _backendValues[idx]);
+                    }
+                }
+
                 Rectangle {
                     width: parent.width
                     height: 1

quickshell/Modules/Settings/WidgetsTab.qml

@@ -460,7 +460,7 @@ Item {
             "id": widget.id,
             "enabled": widget.enabled
         };
-        var keys = ["size", "selectedGpuIndex", "pciId", "mountPath", "diskUsageMode", "minimumWidth", "showSwap", "showInGb", "mediaSize", "clockCompactMode", "focusedWindowSize", "focusedWindowCompactMode", "runningAppsCompactMode", "keyboardLayoutNameCompactMode", "keyboardLayoutNameShowIcon", "runningAppsGroupByApp", "runningAppsCurrentWorkspace", "runningAppsCurrentMonitor", "showNetworkIcon", "showBluetoothIcon", "showAudioIcon", "showAudioPercent", "showVpnIcon", "showBrightnessIcon", "showBrightnessPercent", "showMicIcon", "showMicPercent", "showBatteryIcon", "showPrinterIcon", "showScreenSharingIcon", "showIdleInhibitorIcon", "showDoNotDisturbIcon", "controlCenterGroupOrder", "barMaxVisibleApps", "barMaxVisibleRunningApps", "barShowOverflowBadge", "trayUseInlineExpansion", "hideWhenIdle"];
+        var keys = ["size", "selectedGpuIndex", "pciId", "mountPath", "diskUsageMode", "minimumWidth", "showSwap", "showInGb", "mediaSize", "clockCompactMode", "focusedWindowSize", "focusedWindowCompactMode", "runningAppsCompactMode", "keyboardLayoutNameCompactMode", "keyboardLayoutNameShowIcon", "runningAppsGroupByApp", "runningAppsCurrentWorkspace", "runningAppsCurrentMonitor", "showNetworkIcon", "showBluetoothIcon", "showAudioIcon", "showAudioPercent", "showVpnIcon", "showBrightnessIcon", "showBrightnessPercent", "showMicIcon", "showMicPercent", "showBatteryIcon", "showPrinterIcon", "showScreenSharingIcon", "showIdleInhibitorIcon", "showDoNotDisturbIcon", "controlCenterGroupOrder", "barMaxVisibleApps", "barMaxVisibleRunningApps", "barShowOverflowBadge", "trayUseInlineExpansion", "trayPopupSingleLine", "trayAutoOverflow", "trayMaxVisibleItems", "hideWhenIdle"];
         for (var i = 0; i < keys.length; i++) {
             if (widget[keys[i]] !== undefined)
                 result[keys[i]] = widget[keys[i]];
@@ -803,6 +803,12 @@ Item {
                     item.barShowOverflowBadge = widget.barShowOverflowBadge;
                 if (widget.trayUseInlineExpansion !== undefined)
                     item.trayUseInlineExpansion = widget.trayUseInlineExpansion;
+                if (widget.trayPopupSingleLine !== undefined)
+                    item.trayPopupSingleLine = widget.trayPopupSingleLine;
+                if (widget.trayAutoOverflow !== undefined)
+                    item.trayAutoOverflow = widget.trayAutoOverflow;
+                if (widget.trayMaxVisibleItems !== undefined)
+                    item.trayMaxVisibleItems = widget.trayMaxVisibleItems;
                 if (widget.hideWhenIdle !== undefined)
                     item.hideWhenIdle = widget.hideWhenIdle;
             }

quickshell/Modules/Settings/WidgetsTabSection.qml

@@ -43,7 +43,7 @@ Column {
             "id": widget.id,
             "enabled": widget.enabled
         };
-        var keys = ["size", "selectedGpuIndex", "pciId", "mountPath", "diskUsageMode", "minimumWidth", "showSwap", "showInGb", "mediaSize", "clockCompactMode", "focusedWindowSize", "focusedWindowCompactMode", "runningAppsCompactMode", "keyboardLayoutNameCompactMode", "keyboardLayoutNameShowIcon", "runningAppsGroupByApp", "runningAppsCurrentWorkspace", "runningAppsCurrentMonitor", "showNetworkIcon", "showBluetoothIcon", "showAudioIcon", "showAudioPercent", "showVpnIcon", "showBrightnessIcon", "showBrightnessPercent", "showMicIcon", "showMicPercent", "showBatteryIcon", "showPrinterIcon", "showScreenSharingIcon", "showIdleInhibitorIcon", "showDoNotDisturbIcon", "controlCenterGroupOrder", "barMaxVisibleApps", "barMaxVisibleRunningApps", "barShowOverflowBadge", "trayUseInlineExpansion"];
+        var keys = ["size", "selectedGpuIndex", "pciId", "mountPath", "diskUsageMode", "minimumWidth", "showSwap", "showInGb", "mediaSize", "clockCompactMode", "focusedWindowSize", "focusedWindowCompactMode", "runningAppsCompactMode", "keyboardLayoutNameCompactMode", "keyboardLayoutNameShowIcon", "runningAppsGroupByApp", "runningAppsCurrentWorkspace", "runningAppsCurrentMonitor", "showNetworkIcon", "showBluetoothIcon", "showAudioIcon", "showAudioPercent", "showVpnIcon", "showBrightnessIcon", "showBrightnessPercent", "showMicIcon", "showMicPercent", "showBatteryIcon", "showPrinterIcon", "showScreenSharingIcon", "showIdleInhibitorIcon", "showDoNotDisturbIcon", "controlCenterGroupOrder", "barMaxVisibleApps", "barMaxVisibleRunningApps", "barShowOverflowBadge", "trayUseInlineExpansion", "trayPopupSingleLine", "trayAutoOverflow", "trayMaxVisibleItems"];
         for (var i = 0; i < keys.length; i++) {
             if (widget[keys[i]] !== undefined)
                 result[keys[i]] = widget[keys[i]];
@@ -1126,6 +1126,188 @@ Column {
                         }
                     }
                 }
+
+                Rectangle {
+                    width: parent.width
+                    height: 32
+                    radius: Theme.cornerRadius
+                    color: trayPopupLineArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+                    opacity: (trayContextMenu.currentWidgetData?.trayUseInlineExpansion ?? false) ? 0.55 : 1
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingS
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingS
+
+                        DankIcon {
+                            name: "view_week"
+                            size: 16
+                            color: Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Single-Line Popup")
+                            font.pixelSize: Theme.fontSizeSmall
+                            color: Theme.surfaceText
+                            font.weight: Font.Normal
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+
+                    DankToggle {
+                        id: trayPopupLineToggle
+                        anchors.right: parent.right
+                        anchors.rightMargin: Theme.spacingS
+                        anchors.verticalCenter: parent.verticalCenter
+                        width: 40
+                        height: 20
+                        checked: trayContextMenu.currentWidgetData?.trayPopupSingleLine ?? SettingsData.trayPopupSingleLine
+                        enabled: !(trayContextMenu.currentWidgetData?.trayUseInlineExpansion ?? false)
+                    }
+
+                    MouseArea {
+                        id: trayPopupLineArea
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: (trayContextMenu.currentWidgetData?.trayUseInlineExpansion ?? false) ? Qt.ArrowCursor : Qt.PointingHandCursor
+                        onClicked: {
+                            if (trayContextMenu.currentWidgetData?.trayUseInlineExpansion ?? false)
+                                return;
+                            const newValue = !(trayContextMenu.currentWidgetData?.trayPopupSingleLine ?? SettingsData.trayPopupSingleLine);
+                            root.overflowSettingChanged(trayContextMenu.sectionId, trayContextMenu.widgetIndex, "trayPopupSingleLine", newValue);
+                        }
+                    }
+                }
+
+                Rectangle {
+                    width: parent.width
+                    height: 32
+                    radius: Theme.cornerRadius
+                    color: trayAutoOverflowArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingS
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingS
+
+                        DankIcon {
+                            name: "responsive_layout"
+                            size: 16
+                            color: Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Auto Overflow")
+                            font.pixelSize: Theme.fontSizeSmall
+                            color: Theme.surfaceText
+                            font.weight: Font.Normal
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+
+                    DankToggle {
+                        id: trayAutoOverflowToggle
+                        anchors.right: parent.right
+                        anchors.rightMargin: Theme.spacingS
+                        anchors.verticalCenter: parent.verticalCenter
+                        width: 40
+                        height: 20
+                        checked: trayContextMenu.currentWidgetData?.trayAutoOverflow ?? SettingsData.trayAutoOverflow
+                    }
+
+                    MouseArea {
+                        id: trayAutoOverflowArea
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: {
+                            const newValue = !(trayContextMenu.currentWidgetData?.trayAutoOverflow ?? SettingsData.trayAutoOverflow);
+                            root.overflowSettingChanged(trayContextMenu.sectionId, trayContextMenu.widgetIndex, "trayAutoOverflow", newValue);
+                        }
+                    }
+                }
+
+                Rectangle {
+                    width: parent.width
+                    height: 36
+                    radius: Theme.cornerRadius
+                    color: trayMaxVisibleArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+                    opacity: (trayContextMenu.currentWidgetData?.trayAutoOverflow ?? SettingsData.trayAutoOverflow) ? 1 : 0.55
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingS
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingS
+
+                        DankIcon {
+                            name: "low_priority"
+                            size: 16
+                            color: Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Max Visible")
+                            font.pixelSize: Theme.fontSizeSmall
+                            color: Theme.surfaceText
+                            font.weight: Font.Normal
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: {
+                                const value = trayContextMenu.currentWidgetData?.trayMaxVisibleItems ?? SettingsData.trayMaxVisibleItems;
+                                return value > 0 ? String(value) : I18n.tr("Auto");
+                            }
+                            font.pixelSize: Theme.fontSizeSmall
+                            color: Theme.surfaceTextMedium
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+
+                    Row {
+                        anchors.right: parent.right
+                        anchors.rightMargin: Theme.spacingXS
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: 2
+
+                        DankActionButton {
+                            buttonSize: 28
+                            iconName: "remove"
+                            iconSize: 16
+                            iconColor: Theme.surfaceText
+                            enabled: trayContextMenu.currentWidgetData?.trayAutoOverflow ?? SettingsData.trayAutoOverflow
+                            onClicked: {
+                                const current = trayContextMenu.currentWidgetData?.trayMaxVisibleItems ?? SettingsData.trayMaxVisibleItems;
+                                root.overflowSettingChanged(trayContextMenu.sectionId, trayContextMenu.widgetIndex, "trayMaxVisibleItems", Math.max(0, current - 1));
+                            }
+                        }
+
+                        DankActionButton {
+                            buttonSize: 28
+                            iconName: "add"
+                            iconSize: 16
+                            iconColor: Theme.surfaceText
+                            enabled: trayContextMenu.currentWidgetData?.trayAutoOverflow ?? SettingsData.trayAutoOverflow
+                            onClicked: {
+                                const current = trayContextMenu.currentWidgetData?.trayMaxVisibleItems ?? SettingsData.trayMaxVisibleItems;
+                                root.overflowSettingChanged(trayContextMenu.sectionId, trayContextMenu.widgetIndex, "trayMaxVisibleItems", Math.min(20, current + 1));
+                            }
+                        }
+                    }
+
+                    MouseArea {
+                        id: trayMaxVisibleArea
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        acceptedButtons: Qt.NoButton
+                    }
+                }
             }
         }
     }

quickshell/Modules/Settings/WorkspaceAppearanceCard.qml

@@ -4,41 +4,195 @@ import qs.Services
 import qs.Modules.Settings.Widgets
 
 SettingsCard {
+    id: root
+
     iconName: "palette"
     title: I18n.tr("Workspace Appearance")
     settingKey: "workspaceAppearance"
     collapsible: true
     expanded: false
 
-    SettingsButtonGroupRow {
+    readonly property var focusedColorOptions: [({
+                "value": "default",
+                "label": I18n.tr("Primary", "workspace color option")
+            }), ({
+                "value": "primaryContainer",
+                "label": I18n.tr("Primary Container", "workspace color option")
+            }), ({
+                "value": "secondary",
+                "label": I18n.tr("Secondary", "workspace color option")
+            }), ({
+                "value": "secondaryContainer",
+                "label": I18n.tr("Secondary Container", "workspace color option")
+            }), ({
+                "value": "tertiary",
+                "label": I18n.tr("Tertiary", "workspace color option")
+            }), ({
+                "value": "tertiaryContainer",
+                "label": I18n.tr("Tertiary Container", "workspace color option")
+            }), ({
+                "value": "s",
+                "label": I18n.tr("Surface", "workspace color option")
+            }), ({
+                "value": "sc",
+                "label": I18n.tr("Surface Container", "workspace color option")
+            }), ({
+                "value": "sch",
+                "label": I18n.tr("Surface High", "workspace color option")
+            }), ({
+                "value": "schh",
+                "label": I18n.tr("Surface Highest", "workspace color option")
+            }), ({
+                "value": "none",
+                "label": I18n.tr("None", "workspace color option")
+            }), ({
+                "value": "custom",
+                "label": I18n.tr("Custom", "workspace color option")
+            })]
+
+    readonly property var occupiedColorOptions: [({
+                "value": "none",
+                "label": I18n.tr("None", "workspace color option")
+            }), ({
+                "value": "primary",
+                "label": I18n.tr("Primary", "workspace color option")
+            }), ({
+                "value": "primaryContainer",
+                "label": I18n.tr("Primary Container", "workspace color option")
+            }), ({
+                "value": "sec",
+                "label": I18n.tr("Secondary", "workspace color option")
+            }), ({
+                "value": "secondaryContainer",
+                "label": I18n.tr("Secondary Container", "workspace color option")
+            }), ({
+                "value": "tertiary",
+                "label": I18n.tr("Tertiary", "workspace color option")
+            }), ({
+                "value": "tertiaryContainer",
+                "label": I18n.tr("Tertiary Container", "workspace color option")
+            }), ({
+                "value": "s",
+                "label": I18n.tr("Surface", "workspace color option")
+            }), ({
+                "value": "sc",
+                "label": I18n.tr("Surface Container", "workspace color option")
+            }), ({
+                "value": "sch",
+                "label": I18n.tr("Surface High", "workspace color option")
+            }), ({
+                "value": "schh",
+                "label": I18n.tr("Surface Highest", "workspace color option")
+            }), ({
+                "value": "custom",
+                "label": I18n.tr("Custom", "workspace color option")
+            })]
+
+    readonly property var unfocusedColorOptions: [({
+                "value": "default",
+                "label": I18n.tr("Default", "workspace color option")
+            }), ({
+                "value": "surfaceText",
+                "label": I18n.tr("Surface Text", "workspace color option")
+            }), ({
+                "value": "primary",
+                "label": I18n.tr("Primary", "workspace color option")
+            }), ({
+                "value": "secondary",
+                "label": I18n.tr("Secondary", "workspace color option")
+            }), ({
+                "value": "tertiary",
+                "label": I18n.tr("Tertiary", "workspace color option")
+            }), ({
+                "value": "s",
+                "label": I18n.tr("Surface", "workspace color option")
+            }), ({
+                "value": "sc",
+                "label": I18n.tr("Surface Container", "workspace color option")
+            }), ({
+                "value": "sch",
+                "label": I18n.tr("Surface High", "workspace color option")
+            }), ({
+                "value": "schh",
+                "label": I18n.tr("Surface Highest", "workspace color option")
+            }), ({
+                "value": "custom",
+                "label": I18n.tr("Custom", "workspace color option")
+            })]
+
+    readonly property var urgentColorOptions: [({
+                "value": "default",
+                "label": I18n.tr("Error", "workspace color option")
+            }), ({
+                "value": "primary",
+                "label": I18n.tr("Primary", "workspace color option")
+            }), ({
+                "value": "primaryContainer",
+                "label": I18n.tr("Primary Container", "workspace color option")
+            }), ({
+                "value": "secondary",
+                "label": I18n.tr("Secondary", "workspace color option")
+            }), ({
+                "value": "secondaryContainer",
+                "label": I18n.tr("Secondary Container", "workspace color option")
+            }), ({
+                "value": "tertiary",
+                "label": I18n.tr("Tertiary", "workspace color option")
+            }), ({
+                "value": "tertiaryContainer",
+                "label": I18n.tr("Tertiary Container", "workspace color option")
+            }), ({
+                "value": "s",
+                "label": I18n.tr("Surface", "workspace color option")
+            }), ({
+                "value": "sc",
+                "label": I18n.tr("Surface Container", "workspace color option")
+            }), ({
+                "value": "sch",
+                "label": I18n.tr("Surface High", "workspace color option")
+            }), ({
+                "value": "custom",
+                "label": I18n.tr("Custom", "workspace color option")
+            })]
+
+    readonly property var borderColorOptions: [({
+                "value": "surfaceText",
+                "label": I18n.tr("Surface Text", "workspace color option")
+            }), ({
+                "value": "primary",
+                "label": I18n.tr("Primary", "workspace color option")
+            }), ({
+                "value": "primaryContainer",
+                "label": I18n.tr("Primary Container", "workspace color option")
+            }), ({
+                "value": "secondary",
+                "label": I18n.tr("Secondary", "workspace color option")
+            }), ({
+                "value": "secondaryContainer",
+                "label": I18n.tr("Secondary Container", "workspace color option")
+            }), ({
+                "value": "tertiary",
+                "label": I18n.tr("Tertiary", "workspace color option")
+            }), ({
+                "value": "tertiaryContainer",
+                "label": I18n.tr("Tertiary Container", "workspace color option")
+            }), ({
+                "value": "custom",
+                "label": I18n.tr("Custom", "workspace color option")
+            })]
+
+    readonly property bool workspaceStateColorsVisible: CompositorService.isNiri || CompositorService.isHyprland || CompositorService.isMango
+    readonly property bool urgentWorkspaceColorsVisible: workspaceStateColorsVisible || CompositorService.isSway || CompositorService.isScroll || CompositorService.isMiracle
+
+    WorkspaceColorRow {
         text: I18n.tr("Focused Color")
-        model: ["pri", "s", "sc", "sch", "none"]
+        settingKey: "workspaceColorMode"
-        buttonHeight: 22
+        tags: ["workspace", "focused", "color", "custom"]
-        minButtonWidth: 36
+        options: root.focusedColorOptions
-        buttonPadding: Theme.spacingS
+        currentMode: SettingsData.workspaceColorMode
-        checkIconSize: Theme.iconSizeSmall - 2
+        customColor: SettingsData.workspaceFocusedCustomColor || "#6750A4"
-        textSize: Theme.fontSizeSmall - 1
+        onModeSelected: mode => SettingsData.set("workspaceColorMode", mode)
-        spacing: 1
+        onCustomColorSelected: selectedColor => SettingsData.set("workspaceFocusedCustomColor", selectedColor.toString())
-        currentIndex: {
-            switch (SettingsData.workspaceColorMode) {
-            case "s":
-                return 1;
-            case "sc":
-                return 2;
-            case "sch":
-                return 3;
-            case "none":
-                return 4;
-            default:
-                return 0;
-            }
-        }
-        onSelectionChanged: (index, selected) => {
-            if (!selected)
-                return;
-            const modes = ["default", "s", "sc", "sch", "none"];
-            SettingsData.set("workspaceColorMode", modes[index]);
-        }
     }
 
     Rectangle {
@@ -48,38 +202,16 @@ SettingsCard {
         opacity: 0.15
     }
 
-    SettingsButtonGroupRow {
+    WorkspaceColorRow {
         text: I18n.tr("Occupied Color")
-        model: ["none", "sec", "s", "sc", "sch", "schh"]
+        settingKey: "workspaceOccupiedColorMode"
-        visible: CompositorService.isNiri || CompositorService.isHyprland || CompositorService.isMango
+        tags: ["workspace", "occupied", "color", "custom"]
-        buttonHeight: 22
+        visible: root.workspaceStateColorsVisible
-        minButtonWidth: 36
+        options: root.occupiedColorOptions
-        buttonPadding: Theme.spacingS
+        currentMode: SettingsData.workspaceOccupiedColorMode
-        checkIconSize: Theme.iconSizeSmall - 2
+        customColor: SettingsData.workspaceOccupiedCustomColor || "#625B71"
-        textSize: Theme.fontSizeSmall - 1
+        onModeSelected: mode => SettingsData.set("workspaceOccupiedColorMode", mode)
-        spacing: 1
+        onCustomColorSelected: selectedColor => SettingsData.set("workspaceOccupiedCustomColor", selectedColor.toString())
-        currentIndex: {
-            switch (SettingsData.workspaceOccupiedColorMode) {
-            case "sec":
-                return 1;
-            case "s":
-                return 2;
-            case "sc":
-                return 3;
-            case "sch":
-                return 4;
-            case "schh":
-                return 5;
-            default:
-                return 0;
-            }
-        }
-        onSelectionChanged: (index, selected) => {
-            if (!selected)
-                return;
-            const modes = ["none", "sec", "s", "sc", "sch", "schh"];
-            SettingsData.set("workspaceOccupiedColorMode", modes[index]);
-        }
     }
 
     Rectangle {
@@ -90,33 +222,16 @@ SettingsCard {
         visible: CompositorService.isNiri || CompositorService.isHyprland || CompositorService.isMango
     }
 
-    SettingsButtonGroupRow {
+    WorkspaceColorRow {
         text: I18n.tr("Unfocused Color")
-        model: ["def", "s", "sc", "sch"]
+        settingKey: "workspaceUnfocusedColorMode"
-        buttonHeight: 22
+        tags: ["workspace", "unfocused", "color", "custom"]
-        minButtonWidth: 36
+        options: root.unfocusedColorOptions
-        buttonPadding: Theme.spacingS
+        defaultColor: Theme.surfaceText
-        checkIconSize: Theme.iconSizeSmall - 2
+        currentMode: SettingsData.workspaceUnfocusedColorMode
-        textSize: Theme.fontSizeSmall - 1
+        customColor: SettingsData.workspaceUnfocusedCustomColor || "#49454E"
-        spacing: 1
+        onModeSelected: mode => SettingsData.set("workspaceUnfocusedColorMode", mode)
-        currentIndex: {
+        onCustomColorSelected: selectedColor => SettingsData.set("workspaceUnfocusedCustomColor", selectedColor.toString())
-            switch (SettingsData.workspaceUnfocusedColorMode) {
-            case "s":
-                return 1;
-            case "sc":
-                return 2;
-            case "sch":
-                return 3;
-            default:
-                return 0;
-            }
-        }
-        onSelectionChanged: (index, selected) => {
-            if (!selected)
-                return;
-            const modes = ["default", "s", "sc", "sch"];
-            SettingsData.set("workspaceUnfocusedColorMode", modes[index]);
-        }
     }
 
     Rectangle {
@@ -127,36 +242,17 @@ SettingsCard {
         visible: CompositorService.isNiri || CompositorService.isHyprland || CompositorService.isMango || CompositorService.isSway || CompositorService.isScroll || CompositorService.isMiracle
     }
 
-    SettingsButtonGroupRow {
+    WorkspaceColorRow {
         text: I18n.tr("Urgent Color")
-        visible: CompositorService.isNiri || CompositorService.isHyprland || CompositorService.isMango || CompositorService.isSway || CompositorService.isScroll || CompositorService.isMiracle
+        settingKey: "workspaceUrgentColorMode"
-        model: ["err", "pri", "sec", "s", "sc"]
+        tags: ["workspace", "urgent", "color", "custom"]
-        buttonHeight: 22
+        visible: root.urgentWorkspaceColorsVisible
-        minButtonWidth: 36
+        options: root.urgentColorOptions
-        buttonPadding: Theme.spacingS
+        defaultColor: Theme.error
-        checkIconSize: Theme.iconSizeSmall - 2
+        currentMode: SettingsData.workspaceUrgentColorMode
-        textSize: Theme.fontSizeSmall - 1
+        customColor: SettingsData.workspaceUrgentCustomColor || "#B3261E"
-        spacing: 1
+        onModeSelected: mode => SettingsData.set("workspaceUrgentColorMode", mode)
-        currentIndex: {
+        onCustomColorSelected: selectedColor => SettingsData.set("workspaceUrgentCustomColor", selectedColor.toString())
-            switch (SettingsData.workspaceUrgentColorMode) {
-            case "primary":
-                return 1;
-            case "secondary":
-                return 2;
-            case "s":
-                return 3;
-            case "sc":
-                return 4;
-            default:
-                return 0;
-            }
-        }
-        onSelectionChanged: (index, selected) => {
-            if (!selected)
-                return;
-            const modes = ["default", "primary", "secondary", "s", "sc"];
-            SettingsData.set("workspaceUrgentColorMode", modes[index]);
-        }
     }
 
     Rectangle {
@@ -181,39 +277,16 @@ SettingsCard {
         visible: SettingsData.workspaceFocusedBorderEnabled
         leftPadding: Theme.spacingM
 
-        SettingsButtonGroupRow {
+        WorkspaceColorRow {
             width: parent.width - parent.leftPadding
             text: I18n.tr("Border Color")
-            model: [I18n.tr("Surface"), I18n.tr("Secondary"), I18n.tr("Primary")]
+            settingKey: "workspaceFocusedBorderColor"
-            currentIndex: {
+            tags: ["workspace", "focused", "border", "color", "custom"]
-                switch (SettingsData.workspaceFocusedBorderColor) {
+            options: root.borderColorOptions
-                case "surfaceText":
+            currentMode: SettingsData.workspaceFocusedBorderColor
-                    return 0;
+            customColor: SettingsData.workspaceFocusedBorderCustomColor || "#6750A4"
-                case "secondary":
+            onModeSelected: mode => SettingsData.set("workspaceFocusedBorderColor", mode)
-                    return 1;
+            onCustomColorSelected: selectedColor => SettingsData.set("workspaceFocusedBorderCustomColor", selectedColor.toString())
-                case "primary":
-                    return 2;
-                default:
-                    return 2;
-                }
-            }
-            onSelectionChanged: (index, selected) => {
-                if (!selected)
-                    return;
-                let newColor = "primary";
-                switch (index) {
-                case 0:
-                    newColor = "surfaceText";
-                    break;
-                case 1:
-                    newColor = "secondary";
-                    break;
-                case 2:
-                    newColor = "primary";
-                    break;
-                }
-                SettingsData.set("workspaceFocusedBorderColor", newColor);
-            }
         }
 
         SettingsSliderRow {

quickshell/Modules/Settings/WorkspaceColorRow.qml

@@ -0,0 +1,211 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import qs.Common
+import qs.Services
+import qs.Widgets
+import qs.Modules.Settings.Widgets
+
+Column {
+    id: root
+
+    property string text: ""
+    property string description: ""
+    property string settingKey: ""
+    property string tab: ""
+    property var tags: []
+    property var options: []
+    property string currentMode: "default"
+    property color customColor: "#6750A4"
+    property string pickerTitle: text
+    property int dropdownWidth: 230
+    property color defaultColor: Theme.primary
+
+    readonly property var optionColorMap: {
+        var map = {};
+        for (var i = 0; i < options.length; i++)
+            map[options[i].label] = root.colorForValue(options[i].value);
+        return map;
+    }
+
+    function colorForValue(value) {
+        switch (value) {
+        case "primary":
+        case "pri":
+            return Theme.primary;
+        case "primaryContainer":
+            return Theme.primaryContainer;
+        case "secondary":
+        case "sec":
+            return Theme.secondary;
+        case "secondaryContainer":
+            return Theme.secondaryContainer;
+        case "tertiary":
+        case "ter":
+            return Theme.tertiary;
+        case "tertiaryContainer":
+            return Theme.tertiaryContainer;
+        case "surfaceText":
+            return Theme.surfaceText;
+        case "s":
+            return Theme.surface;
+        case "sc":
+            return Theme.surfaceContainer;
+        case "sch":
+            return Theme.surfaceContainerHigh;
+        case "schh":
+            return Theme.surfaceContainerHighest;
+        case "sth":
+            return Theme.surfaceTextHover;
+        case "error":
+        case "err":
+            return Theme.error;
+        case "custom":
+            return root.customColor;
+        case "none":
+            return "transparent";
+        default:
+            return root.defaultColor;
+        }
+    }
+
+    signal modeSelected(string mode)
+    signal customColorSelected(color selectedColor)
+
+    width: parent?.width ?? 0
+    spacing: Theme.spacingS
+
+    function optionLabels() {
+        return options.map(option => option.label);
+    }
+
+    function optionLabel(value) {
+        for (var i = 0; i < options.length; i++) {
+            if (options[i].value === value)
+                return options[i].label;
+        }
+        return options.length > 0 ? options[0].label : "";
+    }
+
+    function optionValue(label) {
+        for (var i = 0; i < options.length; i++) {
+            if (options[i].label === label)
+                return options[i].value;
+        }
+        return options.length > 0 ? options[0].value : "default";
+    }
+
+    function openCustomColorPicker() {
+        PopoutService.colorPickerModal.selectedColor = root.customColor;
+        PopoutService.colorPickerModal.pickerTitle = root.pickerTitle;
+        PopoutService.colorPickerModal.onColorSelectedCallback = function (selectedColor) {
+            root.customColorSelected(selectedColor);
+            root.modeSelected("custom");
+        };
+        PopoutService.colorPickerModal.show();
+    }
+
+    SettingsDropdownRow {
+        text: root.text
+        description: root.description
+        tab: root.tab
+        settingKey: root.settingKey
+        tags: root.tags
+        options: root.optionLabels()
+        optionColorMap: root.optionColorMap
+        currentValue: root.optionLabel(root.currentMode)
+        dropdownWidth: root.dropdownWidth
+        onValueChanged: value => root.modeSelected(root.optionValue(value))
+    }
+
+    Item {
+        width: parent.width
+        height: root.currentMode === "custom" ? customChip.height : 0
+        opacity: root.currentMode === "custom" ? 1 : 0
+        clip: true
+
+        Behavior on height {
+            NumberAnimation {
+                duration: Theme.mediumDuration
+                easing.type: Theme.emphasizedEasing
+            }
+        }
+
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Theme.mediumDuration
+                easing.type: Theme.emphasizedEasing
+            }
+        }
+
+        Rectangle {
+            id: customChip
+
+            width: parent.width
+            height: 56
+            radius: Theme.cornerRadius
+            color: Theme.surfaceContainerHigh
+
+            Row {
+                anchors.fill: parent
+                anchors.leftMargin: Theme.spacingM
+                anchors.rightMargin: Theme.spacingM
+                spacing: Theme.spacingM
+
+                Rectangle {
+                    width: 36
+                    height: 36
+                    radius: 18
+                    color: root.customColor
+                    border.color: Theme.outline
+                    border.width: 1
+                    anchors.verticalCenter: parent.verticalCenter
+
+                    DankIcon {
+                        anchors.centerIn: parent
+                        name: "colorize"
+                        size: 16
+                        color: (root.customColor.r * 0.299 + root.customColor.g * 0.587 + root.customColor.b * 0.114) > 0.5 ? "#000000" : "#ffffff"
+                    }
+                }
+
+                Column {
+                    width: parent.width - 36 - editIcon.width - Theme.spacingM * 2
+                    anchors.verticalCenter: parent.verticalCenter
+                    spacing: Theme.spacingXS
+
+                    StyledText {
+                        text: I18n.tr("Custom Color")
+                        font.pixelSize: Theme.fontSizeMedium
+                        font.weight: Font.Medium
+                        color: Theme.surfaceText
+                        width: parent.width
+                        horizontalAlignment: Text.AlignLeft
+                    }
+
+                    StyledText {
+                        text: root.customColor.toString()
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.surfaceVariantText
+                        width: parent.width
+                        elide: Text.ElideRight
+                        horizontalAlignment: Text.AlignLeft
+                    }
+                }
+
+                DankIcon {
+                    id: editIcon
+                    name: "edit"
+                    size: Theme.iconSizeSmall
+                    color: Theme.surfaceVariantText
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+            }
+
+            StateLayer {
+                stateColor: Theme.surfaceText
+                onClicked: root.openCustomColorPicker()
+            }
+        }
+    }
+}

quickshell/Services/AudioService.qml

@@ -589,38 +589,42 @@ EOFCONFIG
         return MprisController.activePlayer?.isPlaying ?? false;
     }
 
+    function shouldMuteForMedia() {
+        return SettingsData.muteSoundsWhenMediaPlaying && isMediaPlaying();
+    }
+
     function playVolumeChangeSound() {
-        if (!soundsAvailable || !volumeChangeSound || notificationsAudioMuted || isMediaPlaying())
+        if (!soundsAvailable || !volumeChangeSound || notificationsAudioMuted || shouldMuteForMedia())
             return;
         volumeChangeSound.play();
     }
 
     function playPowerPlugSound() {
-        if (!soundsAvailable || !powerPlugSound || notificationsAudioMuted || isMediaPlaying())
+        if (!soundsAvailable || !powerPlugSound || notificationsAudioMuted || shouldMuteForMedia())
             return;
         powerPlugSound.play();
     }
 
     function playPowerUnplugSound() {
-        if (!soundsAvailable || !powerUnplugSound || notificationsAudioMuted || isMediaPlaying())
+        if (!soundsAvailable || !powerUnplugSound || notificationsAudioMuted || shouldMuteForMedia())
             return;
         powerUnplugSound.play();
     }
 
     function playNormalNotificationSound() {
-        if (!soundsAvailable || !normalNotificationSound || SessionData.doNotDisturb || notificationsAudioMuted || isMediaPlaying())
+        if (!soundsAvailable || !normalNotificationSound || SessionData.doNotDisturb || notificationsAudioMuted || shouldMuteForMedia())
             return;
         normalNotificationSound.play();
     }
 
     function playCriticalNotificationSound() {
-        if (!soundsAvailable || !criticalNotificationSound || SessionData.doNotDisturb || notificationsAudioMuted || isMediaPlaying())
+        if (!soundsAvailable || !criticalNotificationSound || SessionData.doNotDisturb || notificationsAudioMuted || shouldMuteForMedia())
             return;
         criticalNotificationSound.play();
     }
 
     function playLoginSound() {
-        if (!soundsAvailable || !loginSound || notificationsAudioMuted || isMediaPlaying()) {
+        if (!soundsAvailable || !loginSound || notificationsAudioMuted || shouldMuteForMedia()) {
             return;
         }
         loginSound.play();

quickshell/Services/CalendarDankBackend.qml

@@ -0,0 +1,481 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell
+import Quickshell.Io
+import qs.Common
+import qs.Services
+
+Item {
+    id: root
+    readonly property var log: Log.scoped("CalendarDankBackend")
+
+    property bool enabled: false
+
+    property string socketPath: ""
+    readonly property bool socketFound: socketPath.length > 0
+    property bool connected: false
+    property bool binaryExists: false
+    property bool binaryChecked: false
+
+    property var calendars: []
+    property var events: []
+    property var eventsByDate: ({})
+    property string lastError: ""
+    property date focusDate: new Date()
+    property var _loadedFrom: null
+    property var _loadedTo: null
+
+    property var pendingRequests: ({})
+    property int requestCounter: 0
+
+    readonly property var fallbackPalette: ["#7287fd", "#f38ba8", "#a6e3a1", "#fab387", "#cba6f7", "#94e2d5", "#f9e2af", "#89dceb"]
+
+    signal eventsUpdated
+
+    onEnabledChanged: {
+        if (enabled) {
+            if (!connected)
+                discoverProcess.running = true;
+            return;
+        }
+        requestSocket.connected = false;
+        subscribeSocket.connected = false;
+        socketPath = "";
+        connected = false;
+    }
+
+    Component.onCompleted: {
+        binaryCheck.running = true;
+        discoverProcess.running = true;
+    }
+
+    Process {
+        id: binaryCheck
+        command: ["sh", "-c", "command -v dcal"]
+        running: false
+        onExited: code => {
+            root.binaryExists = (code === 0);
+            root.binaryChecked = true;
+        }
+    }
+
+    Process {
+        id: discoverProcess
+        running: false
+        command: ["sh", "-c", "s=\"${DANKCAL_SOCKET:-}\"; if [ -S \"$s\" ]; then echo \"$s\"; exit 0; fi; for f in \"${XDG_RUNTIME_DIR:-/tmp}\"/dankcal-*.sock /tmp/dankcal-*.sock; do [ -S \"$f\" ] || continue; p=$(basename \"$f\" .sock); p=${p#dankcal-}; if kill -0 \"$p\" 2>/dev/null; then echo \"$f\"; exit 0; fi; done"]
+
+        stdout: StdioCollector {
+            onStreamFinished: {
+                const path = text.trim().split('\n')[0] || "";
+                if (path.length > 0) {
+                    root._applySocketPath(path);
+                    return;
+                }
+                if (!root.connected) {
+                    if (root.socketPath !== "")
+                        root.log.info("dankcal socket gone, waiting for daemon");
+                    requestSocket.connected = false;
+                    subscribeSocket.connected = false;
+                    root.socketPath = "";
+                }
+            }
+        }
+    }
+
+    Timer {
+        id: rediscoverTimer
+        interval: 3000
+        repeat: true
+        running: root.enabled && !root.connected
+        onTriggered: {
+            if (!discoverProcess.running)
+                discoverProcess.running = true;
+        }
+    }
+
+    function launch() {
+        if (!binaryExists)
+            return;
+        Quickshell.execDetached(["dcal", "run", "-d", "--hidden"]);
+        if (enabled && !connected)
+            discoverProcess.running = true;
+    }
+
+    function _applySocketPath(path) {
+        const changed = path !== socketPath;
+        if (changed)
+            log.info("dankcal socket discovered:", path);
+        if (!changed && connected)
+            return;
+        socketPath = path;
+        _reconnect();
+    }
+
+    function _reconnect() {
+        requestSocket.connected = false;
+        subscribeSocket.connected = false;
+        Qt.callLater(() => requestSocket.connected = true);
+    }
+
+    DankSocket {
+        id: requestSocket
+        path: root.socketPath
+        connected: false
+
+        onConnectionStateChanged: {
+            if (linkUp) {
+                root.connected = true;
+                subscribeSocket.connected = true;
+                root.log.info("connected to dankcal:", root.socketPath);
+                root.refreshCalendars();
+                root.reloadEvents();
+                return;
+            }
+            if (!root.connected && !root.socketFound)
+                return;
+            root.connected = false;
+            root._flushPending();
+            requestSocket.connected = false;
+            subscribeSocket.connected = false;
+            root.log.info("dankcal disconnected, rediscovering");
+            if (root.enabled)
+                discoverProcess.running = true;
+        }
+
+        parser: SplitParser {
+            onRead: line => {
+                if (!line || line.length === 0)
+                    return;
+                let response;
+                try {
+                    response = JSON.parse(line);
+                } catch (e) {
+                    return;
+                }
+                root._handleResponse(response);
+            }
+        }
+    }
+
+    DankSocket {
+        id: subscribeSocket
+        path: root.socketPath
+        connected: false
+
+        onConnectionStateChanged: {
+            if (linkUp)
+                root._sendSubscribe();
+        }
+
+        parser: SplitParser {
+            onRead: line => {
+                if (!line || line.length === 0)
+                    return;
+                let event;
+                try {
+                    event = JSON.parse(line);
+                } catch (e) {
+                    return;
+                }
+                root._handleEvent(event);
+            }
+        }
+    }
+
+    Timer {
+        id: refreshDebounce
+        interval: 400
+        repeat: false
+        onTriggered: {
+            root.refreshCalendars();
+            root.reloadEvents();
+        }
+    }
+
+    function _sendSubscribe() {
+        subscribeSocket.send({
+            "id": _nextId(),
+            "method": "subscribe",
+            "params": {
+                "topics": ["accounts", "calendars", "events", "sync"]
+            }
+        });
+    }
+
+    function _nextId() {
+        requestCounter++;
+        return Date.now() + requestCounter;
+    }
+
+    function _flushPending() {
+        const ids = Object.keys(pendingRequests);
+        for (const id of ids) {
+            const cb = pendingRequests[id];
+            delete pendingRequests[id];
+            if (cb)
+                cb({
+                    "error": "disconnected"
+                });
+        }
+    }
+
+    function _handleResponse(response) {
+        if (response.event) {
+            _handleEvent(response);
+            return;
+        }
+        const id = response.id;
+        if (!id)
+            return;
+        const cb = pendingRequests[id];
+        if (cb) {
+            delete pendingRequests[id];
+            cb(response);
+        }
+    }
+
+    function _handleEvent(event) {
+        switch (event.event) {
+        case "accounts":
+        case "calendars":
+            refreshCalendars();
+            refreshDebounce.restart();
+            break;
+        case "events":
+        case "sync":
+            refreshDebounce.restart();
+            break;
+        }
+    }
+
+    function sendRequest(method, params, callback) {
+        if (!connected) {
+            if (callback)
+                callback({
+                    "error": "not connected to dankcal socket"
+                });
+            return;
+        }
+        const id = _nextId();
+        const req = {
+            "id": id,
+            "method": method
+        };
+        if (params)
+            req.params = params;
+        if (callback)
+            pendingRequests[id] = callback;
+        requestSocket.send(req);
+    }
+
+    function refreshCalendars() {
+        sendRequest("calendars.list", null, response => {
+            if (response.error) {
+                lastError = response.error;
+                return;
+            }
+            const list = response.result || [];
+            for (let i = 0; i < list.length; i++) {
+                if (!list[i].color)
+                    list[i].color = fallbackPalette[i % fallbackPalette.length];
+            }
+            calendars = list;
+            _rebuildEventsByDate();
+        });
+    }
+
+    function calendarById(id) {
+        for (let i = 0; i < calendars.length; i++) {
+            if (calendars[i].id === id)
+                return calendars[i];
+        }
+        return null;
+    }
+
+    function writableCalendars() {
+        return calendars.filter(c => !c.readOnly);
+    }
+
+    function defaultCalendar() {
+        const writable = writableCalendars().filter(c => !c.hidden);
+        return writable.length > 0 ? writable[0] : null;
+    }
+
+    function loadEvents(startDate, endDate) {
+        const mid = new Date((startDate.getTime() + endDate.getTime()) / 2);
+        focusDate = mid;
+        _ensureWindow();
+    }
+
+    function _ensureWindow() {
+        if (!connected)
+            return;
+        if (!_loadedFrom || !_loadedTo) {
+            reloadEvents();
+            return;
+        }
+        const margin = 14 * 86400000;
+        const t = focusDate.getTime();
+        if (t < _loadedFrom.getTime() + margin || t > _loadedTo.getTime() - margin)
+            reloadEvents();
+        else
+            _rebuildEventsByDate();
+    }
+
+    function reloadEvents() {
+        if (!connected)
+            return;
+        const from = new Date(focusDate.getTime() - 60 * 86400000);
+        const to = new Date(focusDate.getTime() + 90 * 86400000);
+        sendRequest("events.list", {
+            "from": from.toISOString(),
+            "to": to.toISOString(),
+            "limit": 5000
+        }, response => {
+            if (response.error) {
+                lastError = response.error;
+                return;
+            }
+            _loadedFrom = from;
+            _loadedTo = to;
+            const raw = (response.result || {}).events || [];
+            events = raw.map(e => _normalizeEvent(e));
+            _rebuildEventsByDate();
+        });
+    }
+
+    function _dayBoundary(iso) {
+        const d = new Date(iso);
+        return new Date(d.getUTCFullYear(), d.getUTCMonth(), d.getUTCDate());
+    }
+
+    function _normalizeEvent(e) {
+        const allDay = !!e.allDay;
+        const id = e.id || "";
+        if (id.startsWith("task_"))
+            log.warn("daemon event id collides with task prefix:", id);
+        return {
+            "id": id,
+            "calendarId": e.calendarId || "",
+            "title": e.summary || "(untitled)",
+            "description": e.description || "",
+            "location": e.location || "",
+            "url": e.url || "",
+            "start": allDay ? _dayBoundary(e.start) : new Date(e.start),
+            "end": allDay ? _dayBoundary(e.end) : new Date(e.end),
+            "allDay": allDay,
+            "status": e.status || "confirmed",
+            "recurringId": e.recurringId || "",
+            "attendees": e.attendees || [],
+            "organizer": e.organizer || null,
+            "reminders": e.reminders || []
+        };
+    }
+
+    function decorateEvent(ev) {
+        const cal = calendarById(ev.calendarId);
+        const out = Object.assign({}, ev);
+        out.color = cal ? cal.color : fallbackPalette[0];
+        out.calendar = cal ? cal.name : "";
+        out.account = cal ? (cal.accountName || cal.accountId || "") : "";
+        out.readOnly = cal ? !!cal.readOnly : false;
+        out.isMultiDay = ev.start.toDateString() !== ev.end.toDateString();
+        return out;
+    }
+
+    function _hiddenCalendarIds() {
+        const hidden = {};
+        for (let i = 0; i < calendars.length; i++) {
+            if (calendars[i].hidden)
+                hidden[calendars[i].id] = true;
+        }
+        return hidden;
+    }
+
+    function _clampForDay(ev, cur, endDay) {
+        const out = Object.assign({}, ev);
+        const dayStart = new Date(cur.getFullYear(), cur.getMonth(), cur.getDate());
+        const startDay = new Date(ev.start.getFullYear(), ev.start.getMonth(), ev.start.getDate());
+        if (dayStart.getTime() === startDay.getTime()) {
+            out.start = new Date(ev.start);
+        } else {
+            out.start = new Date(dayStart);
+            if (!ev.allDay)
+                out.start.setHours(0, 0, 0, 0);
+        }
+        if (dayStart.getTime() === endDay.getTime()) {
+            out.end = new Date(ev.end);
+        } else {
+            out.end = new Date(dayStart);
+            if (!ev.allDay)
+                out.end.setHours(23, 59, 59, 999);
+        }
+        return out;
+    }
+
+    function _rebuildEventsByDate() {
+        const hidden = _hiddenCalendarIds();
+        const map = {};
+        for (const raw of events) {
+            if (raw.status === "cancelled")
+                continue;
+            if (hidden[raw.calendarId])
+                continue;
+            const ev = decorateEvent(raw);
+            const lastInstant = ev.allDay ? new Date(ev.end.getTime() - 1) : ev.end;
+            let cur = new Date(ev.start.getFullYear(), ev.start.getMonth(), ev.start.getDate());
+            let endDay = new Date(lastInstant.getFullYear(), lastInstant.getMonth(), lastInstant.getDate());
+            if (endDay < cur)
+                endDay = new Date(cur);
+            while (cur <= endDay) {
+                const key = Qt.formatDate(cur, "yyyy-MM-dd");
+                if (!map[key])
+                    map[key] = [];
+                if (!map[key].some(e => e.id === ev.id))
+                    map[key].push(_clampForDay(ev, cur, endDay));
+                cur.setDate(cur.getDate() + 1);
+            }
+        }
+        eventsByDate = map;
+        eventsUpdated();
+    }
+
+    function createEvent(fields, callback) {
+        sendRequest("events.create", fields, response => {
+            if (response.error)
+                lastError = response.error;
+            else
+                reloadEvents();
+            if (callback)
+                callback(response);
+        });
+    }
+
+    function updateEvent(id, fields, callback) {
+        const params = Object.assign({
+            "id": id
+        }, fields);
+        sendRequest("events.update", params, response => {
+            if (response.error)
+                lastError = response.error;
+            else
+                reloadEvents();
+            if (callback)
+                callback(response);
+        });
+    }
+
+    function deleteEvent(id, callback) {
+        sendRequest("events.delete", {
+            "id": id
+        }, response => {
+            if (response.error)
+                lastError = response.error;
+            else
+                reloadEvents();
+            if (callback)
+                callback(response);
+        });
+    }
+}

quickshell/Services/CalendarKhalBackend.qml

@@ -0,0 +1,237 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell.Io
+import qs.Common
+import qs.Services
+
+Item {
+    id: root
+    readonly property var log: Log.scoped("CalendarKhalBackend")
+
+    property bool installed: false
+    property var eventsByDate: ({})
+    property bool isLoading: false
+    property string lastError: ""
+    property date lastStartDate
+    property date lastEndDate
+    property string dateFormat: "MM/dd/yyyy"
+
+    function checkAvailability() {
+        if (!formatProcess.running)
+            formatProcess.running = true;
+    }
+
+    function loadCurrentMonth() {
+        let today = new Date();
+        let firstDay = new Date(today.getFullYear(), today.getMonth(), 1);
+        let lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0);
+        let startDate = new Date(firstDay);
+        startDate.setDate(startDate.getDate() - firstDay.getDay() - 7);
+        let endDate = new Date(lastDay);
+        endDate.setDate(endDate.getDate() + (6 - lastDay.getDay()) + 7);
+        loadEvents(startDate, endDate);
+    }
+
+    function loadEvents(startDate, endDate) {
+        if (!installed)
+            return;
+        if (eventsProcess.running)
+            return;
+        root.lastStartDate = startDate;
+        root.lastEndDate = endDate;
+        root.isLoading = true;
+        let startDateStr = Qt.formatDate(startDate, root.dateFormat);
+        let endDateStr = Qt.formatDate(endDate, root.dateFormat);
+        eventsProcess.requestStartDate = startDate;
+        eventsProcess.requestEndDate = endDate;
+        eventsProcess.command = ["khal", "list", "--json", "title", "--json", "description", "--json", "start-date", "--json", "start-time", "--json", "end-date", "--json", "end-time", "--json", "all-day", "--json", "location", "--json", "url", startDateStr, endDateStr];
+        eventsProcess.running = true;
+    }
+
+    function _parseDateFormat(formatExample) {
+        return formatExample.replace("12", "MM").replace("21", "dd").replace("2013", "yyyy");
+    }
+
+    Component.onCompleted: checkAvailability()
+
+    Process {
+        id: formatProcess
+
+        command: ["khal", "printformats"]
+        running: false
+        onExited: exitCode => {
+            if (exitCode !== 0)
+                checkProcess.running = true;
+        }
+
+        stdout: StdioCollector {
+            onStreamFinished: {
+                let lines = text.split('\n');
+                for (let line of lines) {
+                    if (!line.startsWith('dateformat:'))
+                        continue;
+                    let formatExample = line.substring(line.indexOf(':') + 1).trim();
+                    root.dateFormat = root._parseDateFormat(formatExample);
+                    break;
+                }
+                checkProcess.running = true;
+            }
+        }
+    }
+
+    Process {
+        id: checkProcess
+
+        command: ["khal", "list", "today"]
+        running: false
+        onExited: exitCode => {
+            root.installed = (exitCode === 0);
+            if (root.installed)
+                root.loadCurrentMonth();
+        }
+    }
+
+    Process {
+        id: eventsProcess
+
+        property date requestStartDate
+        property date requestEndDate
+        property string rawOutput: ""
+
+        running: false
+        onExited: exitCode => {
+            root.isLoading = false;
+            if (exitCode !== 0) {
+                root.lastError = "Failed to load events (exit code: " + exitCode + ")";
+                return;
+            }
+            try {
+                let newEventsByDate = {};
+                let lines = eventsProcess.rawOutput.split('\n');
+                for (let line of lines) {
+                    line = line.trim();
+                    if (!line || line === "[]")
+                        continue;
+
+                    let dayEvents = JSON.parse(line);
+                    for (let event of dayEvents) {
+                        if (!event.title)
+                            continue;
+
+                        let startDate, endDate;
+                        if (event['start-date'])
+                            startDate = Date.fromLocaleString(I18n.locale(), event['start-date'], root.dateFormat);
+                        else
+                            startDate = new Date();
+                        if (event['end-date'])
+                            endDate = Date.fromLocaleString(I18n.locale(), event['end-date'], root.dateFormat);
+                        else
+                            endDate = new Date(startDate);
+
+                        let startTime = new Date(startDate);
+                        let endTime = new Date(endDate);
+                        if (event['start-time'] && event['all-day'] !== "True") {
+                            let timeStr = event['start-time'];
+                            if (timeStr) {
+                                let timeParts = timeStr.match(/(\d+):(\d+)(?::\d+)?\s*(AM|PM)?/i);
+                                if (timeParts) {
+                                    let hours = parseInt(timeParts[1]);
+                                    let minutes = parseInt(timeParts[2]);
+                                    if (timeParts[3]) {
+                                        let period = timeParts[3].toUpperCase();
+                                        if (period === 'PM' && hours !== 12)
+                                            hours += 12;
+                                        else if (period === 'AM' && hours === 12)
+                                            hours = 0;
+                                    }
+                                    startTime.setHours(hours, minutes);
+                                    if (event['end-time']) {
+                                        let endTimeParts = event['end-time'].match(/(\d+):(\d+)(?::\d+)?\s*(AM|PM)?/i);
+                                        if (endTimeParts) {
+                                            let endHours = parseInt(endTimeParts[1]);
+                                            let endMinutes = parseInt(endTimeParts[2]);
+                                            if (endTimeParts[3]) {
+                                                let endPeriod = endTimeParts[3].toUpperCase();
+                                                if (endPeriod === 'PM' && endHours !== 12)
+                                                    endHours += 12;
+                                                else if (endPeriod === 'AM' && endHours === 12)
+                                                    endHours = 0;
+                                            }
+                                            endTime.setHours(endHours, endMinutes);
+                                        }
+                                    } else {
+                                        endTime = new Date(startTime);
+                                        endTime.setHours(startTime.getHours() + 1);
+                                    }
+                                }
+                            }
+                        }
+                        let eventId = event.title + "_" + event['start-date'] + "_" + (event['start-time'] || 'allday');
+                        let extractedUrl = "";
+                        if (!event.url && event.description) {
+                            let urlMatch = event.description.match(/https?:\/\/[^\s]+/);
+                            if (urlMatch)
+                                extractedUrl = urlMatch[0];
+                        }
+                        let eventTemplate = {
+                            "id": eventId,
+                            "title": event.title || "Untitled Event",
+                            "start": startTime,
+                            "end": endTime,
+                            "location": event.location || "",
+                            "description": event.description || "",
+                            "url": event.url || extractedUrl,
+                            "calendar": "",
+                            "color": "",
+                            "allDay": event['all-day'] === "True",
+                            "isMultiDay": startDate.toDateString() !== endDate.toDateString()
+                        };
+                        let currentDate = new Date(startDate);
+                        while (currentDate <= endDate) {
+                            let dateKey = Qt.formatDate(currentDate, "yyyy-MM-dd");
+                            if (!newEventsByDate[dateKey])
+                                newEventsByDate[dateKey] = [];
+
+                            let existingEvent = newEventsByDate[dateKey].find(e => e.id === eventId);
+                            if (existingEvent) {
+                                currentDate.setDate(currentDate.getDate() + 1);
+                                continue;
+                            }
+                            let dayEvent = Object.assign({}, eventTemplate);
+                            if (currentDate.getTime() === startDate.getTime()) {
+                                dayEvent.start = new Date(startTime);
+                            } else {
+                                dayEvent.start = new Date(currentDate);
+                                if (!dayEvent.allDay)
+                                    dayEvent.start.setHours(0, 0, 0, 0);
+                            }
+                            if (currentDate.getTime() === endDate.getTime()) {
+                                dayEvent.end = new Date(endTime);
+                            } else {
+                                dayEvent.end = new Date(currentDate);
+                                if (!dayEvent.allDay)
+                                    dayEvent.end.setHours(23, 59, 59, 999);
+                            }
+                            newEventsByDate[dateKey].push(dayEvent);
+                            currentDate.setDate(currentDate.getDate() + 1);
+                        }
+                    }
+                }
+                root.eventsByDate = newEventsByDate;
+                root.lastError = "";
+            } catch (error) {
+                root.lastError = "Failed to parse events JSON: " + error.toString();
+                root.eventsByDate = {};
+            }
+            eventsProcess.rawOutput = "";
+        }
+
+        stdout: SplitParser {
+            splitMarker: "\n"
+            onRead: data => {
+                eventsProcess.rawOutput += data + "\n";
+            }
+        }
+    }
+}

quickshell/Services/CalendarService.qml

@@ -11,71 +11,87 @@ Singleton {
     id: root
     readonly property var log: Log.scoped("CalendarService")
 
-    property bool khalAvailable: true // Always true to enable DMS calendar card UI
+    readonly property string backendPref: SettingsData.calendarBackend
-    property bool khalInstalled: false // Tracks if khal is actually on the system
+    readonly property string activeBackend: {
+        switch (backendPref) {
+        case "khal":
+            return "khal";
+        case "dankcal":
+            return "dankcal";
+        default:
+            if (dankBackend.connected)
+                return "dankcal";
+            if (khalBackend.installed)
+                return "khal";
+            return "none";
+        }
+    }
+
+    readonly property bool calendarAvailable: activeBackend !== "none"
+    readonly property bool isDankActive: activeBackend === "dankcal"
+    readonly property bool canCreateEvents: isDankActive && dankBackend.connected
+    property bool khalAvailable: true // compatibility alias - calendar card UI gate
+
+    readonly property bool dankConnected: dankBackend.connected
+    readonly property bool dankBinaryExists: dankBackend.binaryExists
+    readonly property bool dankNeedsLaunch: backendPref === "dankcal" && !dankBackend.connected && !dankBackend.socketFound
+
+    property var calendars: dankBackend.calendars
     property var eventsByDate: ({})
-    property var khalEventsByDate: ({})
     property var taskEventsByDate: ({})
     property var localTasks: ({})
-    property bool isLoading: false
+    property bool isLoading: khalBackend.isLoading
     property string lastError: ""
+
+    property bool _rangeSet: false
     property date lastStartDate
     property date lastEndDate
-    property string khalDateFormat: "MM/dd/yyyy"
 
-    onKhalEventsByDateChanged: mergeEvents()
     onTaskEventsByDateChanged: mergeEvents()
-
+    onActiveBackendChanged: {
-    function checkKhalAvailability() {
+        mergeEvents();
-        if (!khalCheckProcess.running)
+        if (_rangeSet)
-            khalCheckProcess.running = true;
+            loadEvents(lastStartDate, lastEndDate);
     }
 
-    function detectKhalDateFormat() {
+    CalendarKhalBackend {
-        if (!khalFormatProcess.running)
+        id: khalBackend
-            khalFormatProcess.running = true;
+        onEventsByDateChanged: root.mergeEvents()
     }
 
-    function parseKhalDateFormat(formatExample) {
+    CalendarDankBackend {
-        let qtFormat = formatExample.replace("12", "MM").replace("21", "dd").replace("2013", "yyyy");
+        id: dankBackend
-        return {
+        enabled: root.backendPref === "dankcal" || root.backendPref === "auto"
-            format: qtFormat,
+        onEventsByDateChanged: root.mergeEvents()
-            parser: null
+        onConnectedChanged: {
-        };
+            if (connected && root._rangeSet)
-    }
+                root.loadEvents(root.lastStartDate, root.lastEndDate);
-
+        }
-    function loadCurrentMonth() {
-        if (!root.khalAvailable)
-            return;
-        let today = new Date();
-        let firstDay = new Date(today.getFullYear(), today.getMonth(), 1);
-        let lastDay = new Date(today.getFullYear(), today.getMonth() + 1, 0);
-        // Add padding
-        let startDate = new Date(firstDay);
-        startDate.setDate(startDate.getDate() - firstDay.getDay() - 7);
-        let endDate = new Date(lastDay);
-        endDate.setDate(endDate.getDate() + (6 - lastDay.getDay()) + 7);
-        loadEvents(startDate, endDate);
     }
 
     function loadEvents(startDate, endDate) {
-        if (!root.khalInstalled) {
-            return;
-        }
-        if (eventsProcess.running) {
-            return;
-        }
-        // Store last requested date range for refresh timer
         root.lastStartDate = startDate;
         root.lastEndDate = endDate;
-        root.isLoading = true;
+        root._rangeSet = true;
-        // Format dates for khal using detected format
+        switch (activeBackend) {
-        let startDateStr = Qt.formatDate(startDate, root.khalDateFormat);
+        case "dankcal":
-        let endDateStr = Qt.formatDate(endDate, root.khalDateFormat);
+            dankBackend.loadEvents(startDate, endDate);
-        eventsProcess.requestStartDate = startDate;
+            break;
-        eventsProcess.requestEndDate = endDate;
+        case "khal":
-        eventsProcess.command = ["khal", "list", "--json", "title", "--json", "description", "--json", "start-date", "--json", "start-time", "--json", "end-date", "--json", "end-time", "--json", "all-day", "--json", "location", "--json", "url", startDateStr, endDateStr];
+            khalBackend.loadEvents(startDate, endDate);
-        eventsProcess.running = true;
+            break;
+        }
+    }
+
+    function _activeBackendEventsByDate() {
+        switch (activeBackend) {
+        case "dankcal":
+            return dankBackend.eventsByDate;
+        case "khal":
+            return khalBackend.eventsByDate;
+        default:
+            return {};
+        }
     }
 
     function getEventsForDate(date) {
@@ -84,11 +100,54 @@ Singleton {
     }
 
     function hasEventsForDate(date) {
-        let events = getEventsForDate(date);
+        return getEventsForDate(date).length > 0;
-        return events.length > 0;
+    }
+
+    function writableCalendars() {
+        return isDankActive ? dankBackend.writableCalendars() : [];
+    }
+
+    function defaultCalendar() {
+        return isDankActive ? dankBackend.defaultCalendar() : null;
+    }
+
+    function launchDankCalendar() {
+        dankBackend.launch();
+    }
+
+    function createEvent(fields, callback) {
+        if (isDankActive) {
+            dankBackend.createEvent(fields, callback);
+            return;
+        }
+        if (callback)
+            callback({
+                "error": "read-only backend"
+            });
+    }
+
+    function updateEvent(id, fields, callback) {
+        if (isDankActive) {
+            dankBackend.updateEvent(id, fields, callback);
+            return;
+        }
+        if (callback)
+            callback({
+                "error": "read-only backend"
+            });
+    }
+
+    function deleteEvent(id, callback) {
+        if (isDankActive) {
+            dankBackend.deleteEvent(id, callback);
+            return;
+        }
+        if (callback)
+            callback({
+                "error": "read-only backend"
+            });
     }
 
-    // In-memory Task CRUD methods
     function loadTasks(text) {
         if (!text || text.trim() === "") {
             root.localTasks = {};
@@ -129,8 +188,7 @@ Singleton {
                     "description": "Task from your Planner",
                     "url": "",
                     "calendar": "Todo Planner",
-                    "color": "#10B981" // Pastel Green
+                    "color": "#10B981",
-                    ,
                     "allDay": true,
                     "isMultiDay": false
                 });
@@ -142,9 +200,8 @@ Singleton {
     function addTaskForDate(date, text) {
         let dateKey = Qt.formatDate(date, "yyyy-MM-dd");
         let tasks = Object.assign({}, root.localTasks);
-        if (!tasks[dateKey]) {
+        if (!tasks[dateKey])
             tasks[dateKey] = [];
-        }
         let taskId = (new Date().getTime()) + "-dms";
         tasks[dateKey].push({
             "id": taskId,
@@ -187,11 +244,10 @@ Singleton {
             let list = tasks[dateKey];
             let filtered = list.filter(item => item.id !== cleanId);
             if (filtered.length !== list.length) {
-                if (filtered.length === 0) {
+                if (filtered.length === 0)
                     delete tasks[dateKey];
-                } else {
+                else
                     tasks[dateKey] = filtered;
-                }
                 updated = true;
                 break;
             }
@@ -208,20 +264,17 @@ Singleton {
         let tasks = Object.assign({}, root.localTasks);
         let v = tasks[dateKey] || [];
         let idToItem = {};
-        for (let item of v) {
+        for (let item of v)
             idToItem[item.id] = item;
-        }
         let newV = [];
         for (let tid of orderedIds) {
-            if (idToItem[tid]) {
+            if (idToItem[tid])
                 newV.push(idToItem[tid]);
-            }
         }
         let orderedSet = new Set(orderedIds);
         for (let item of v) {
-            if (!orderedSet.has(item.id)) {
+            if (!orderedSet.has(item.id))
                 newV.push(item);
-            }
         }
         tasks[dateKey] = newV;
         root.localTasks = tasks;
@@ -254,30 +307,24 @@ Singleton {
 
     function mergeEvents() {
         let merged = {};
+        let backendEvents = _activeBackendEventsByDate();
 
-        // Merge khal events
+        for (let dateKey in backendEvents)
-        for (let dateKey in root.khalEventsByDate) {
+            merged[dateKey] = [].concat(backendEvents[dateKey]);
-            merged[dateKey] = [].concat(root.khalEventsByDate[dateKey]);
-        }
 
-        // Merge task events
         for (let dateKey in root.taskEventsByDate) {
-            if (!merged[dateKey]) {
+            if (!merged[dateKey])
                 merged[dateKey] = [];
-            }
             for (let event of root.taskEventsByDate[dateKey]) {
-                if (!merged[dateKey].some(e => e.id === event.id)) {
+                if (!merged[dateKey].some(e => e.id === event.id))
                     merged[dateKey].push(event);
-                }
             }
         }
 
-        // Sort events within each date
         for (let dateKey in merged) {
             let list = merged[dateKey];
-            for (let idx = 0; idx < list.length; idx++) {
+            for (let idx = 0; idx < list.length; idx++)
                 list[idx]._origIdx = idx;
-            }
             list.sort((a, b) => {
                 let diff = a.start.getTime() - b.start.getTime();
                 if (diff !== 0)
@@ -289,12 +336,6 @@ Singleton {
         root.eventsByDate = merged;
     }
 
-    // Initialize on component completion
-    Component.onCompleted: {
-        detectKhalDateFormat();
-    }
-
-    // Atomic file view for tasks
     FileView {
         id: tasksFileView
         path: Quickshell.env("HOME") + "/.config/niri-calendar-todo/tasks.json"
@@ -304,233 +345,11 @@ Singleton {
         watchChanges: true
         printErrors: false
 
-        onLoaded: {
+        onLoaded: loadTasks(tasksFileView.text())
-            loadTasks(tasksFileView.text());
-        }
 
         onLoadFailed: {
             root.localTasks = {};
             root.taskEventsByDate = {};
         }
     }
-
-    // Process for detecting khal date format
-    Process {
-        id: khalFormatProcess
-
-        command: ["khal", "printformats"]
-        running: false
-        onExited: exitCode => {
-            if (exitCode !== 0) {
-                checkKhalAvailability();
-            }
-        }
-
-        stdout: StdioCollector {
-            onStreamFinished: {
-                let lines = text.split('\n');
-                for (let line of lines) {
-                    if (line.startsWith('dateformat:')) {
-                        let formatExample = line.substring(line.indexOf(':') + 1).trim();
-                        let formatInfo = parseKhalDateFormat(formatExample);
-                        root.khalDateFormat = formatInfo.format;
-                        break;
-                    }
-                }
-                checkKhalAvailability();
-            }
-        }
-    }
-
-    // Process for checking khal configuration
-    Process {
-        id: khalCheckProcess
-
-        command: ["khal", "list", "today"]
-        running: false
-        onExited: exitCode => {
-            root.khalInstalled = (exitCode === 0);
-            if (root.khalInstalled) {
-                loadCurrentMonth();
-            } else {
-                loadEvents(root.lastStartDate || new Date(), root.lastEndDate || new Date());
-            }
-        }
-    }
-
-    // Process for loading events
-    Process {
-        id: eventsProcess
-
-        property date requestStartDate
-        property date requestEndDate
-        property string rawOutput: ""
-
-        running: false
-        onExited: exitCode => {
-            root.isLoading = false;
-            if (exitCode !== 0) {
-                root.lastError = "Failed to load events (exit code: " + exitCode + ")";
-                return;
-            }
-            try {
-                let newEventsByDate = {};
-                let lines = eventsProcess.rawOutput.split('\n');
-                for (let line of lines) {
-                    line = line.trim();
-                    if (!line || line === "[]")
-                        continue;
-
-                    // Parse JSON line
-                    let dayEvents = JSON.parse(line);
-                    // Process each event in this day's array
-                    for (let event of dayEvents) {
-                        if (!event.title)
-                            continue;
-
-                        // Parse start and end dates using detected format
-                        let startDate, endDate;
-                        if (event['start-date']) {
-                            startDate = Date.fromLocaleString(I18n.locale(), event['start-date'], root.khalDateFormat);
-                        } else {
-                            startDate = new Date();
-                        }
-                        if (event['end-date']) {
-                            endDate = Date.fromLocaleString(I18n.locale(), event['end-date'], root.khalDateFormat);
-                        } else {
-                            endDate = new Date(startDate);
-                        }
-                        // Create start/end times
-                        let startTime = new Date(startDate);
-                        let endTime = new Date(endDate);
-                        if (event['start-time'] && event['all-day'] !== "True") {
-                            // Parse time if available and not all-day
-                            let timeStr = event['start-time'];
-                            if (timeStr) {
-                                // Match time with optional seconds and AM/PM
-                                let timeParts = timeStr.match(/(\d+):(\d+)(?::\d+)?\s*(AM|PM)?/i);
-                                if (timeParts) {
-                                    let hours = parseInt(timeParts[1]);
-                                    let minutes = parseInt(timeParts[2]);
-
-                                    // Handle AM/PM conversion if present
-                                    if (timeParts[3]) {
-                                        let period = timeParts[3].toUpperCase();
-                                        if (period === 'PM' && hours !== 12) {
-                                            hours += 12;
-                                        } else if (period === 'AM' && hours === 12) {
-                                            hours = 0;
-                                        }
-                                    }
-
-                                    startTime.setHours(hours, minutes);
-                                    if (event['end-time']) {
-                                        let endTimeParts = event['end-time'].match(/(\d+):(\d+)(?::\d+)?\s*(AM|PM)?/i);
-                                        if (endTimeParts) {
-                                            let endHours = parseInt(endTimeParts[1]);
-                                            let endMinutes = parseInt(endTimeParts[2]);
-
-                                            // Handle AM/PM conversion if present
-                                            if (endTimeParts[3]) {
-                                                let endPeriod = endTimeParts[3].toUpperCase();
-                                                if (endPeriod === 'PM' && endHours !== 12) {
-                                                    endHours += 12;
-                                                } else if (endPeriod === 'AM' && endHours === 12) {
-                                                    endHours = 0;
-                                                }
-                                            }
-
-                                            endTime.setHours(endHours, endMinutes);
-                                        }
-                                    } else {
-                                        // Default to 1 hour duration on same day
-                                        endTime = new Date(startTime);
-                                        endTime.setHours(startTime.getHours() + 1);
-                                    }
-                                }
-                            }
-                        }
-                        // Create unique ID for this event (to track multi-day events)
-                        let eventId = event.title + "_" + event['start-date'] + "_" + (event['start-time'] || 'allday');
-                        // Create event object template
-                        let extractedUrl = "";
-                        if (!event.url && event.description) {
-                            let urlMatch = event.description.match(/https?:\/\/[^\s]+/);
-                            if (urlMatch) {
-                                extractedUrl = urlMatch[0];
-                            }
-                        }
-                        let eventTemplate = {
-                            "id": eventId,
-                            "title": event.title || "Untitled Event",
-                            "start": startTime,
-                            "end": endTime,
-                            "location": event.location || "",
-                            "description": event.description || "",
-                            "url": event.url || extractedUrl,
-                            "calendar": "",
-                            "color": "",
-                            "allDay": event['all-day'] === "True",
-                            "isMultiDay": startDate.toDateString() !== endDate.toDateString()
-                        };
-                        // Add event to each day it spans
-                        let currentDate = new Date(startDate);
-                        while (currentDate <= endDate) {
-                            let dateKey = Qt.formatDate(currentDate, "yyyy-MM-dd");
-                            if (!newEventsByDate[dateKey])
-                                newEventsByDate[dateKey] = [];
-
-                            // Check if this exact event is already added to this date (prevent duplicates)
-                            let existingEvent = newEventsByDate[dateKey].find(e => {
-                                return e.id === eventId;
-                            });
-                            if (existingEvent) {
-                                // Move to next day without adding duplicate
-                                currentDate.setDate(currentDate.getDate() + 1);
-                                continue;
-                            }
-                            // Create a copy of the event for this date
-                            let dayEvent = Object.assign({}, eventTemplate);
-                            // For multi-day events, adjust the display time for this specific day
-                            if (currentDate.getTime() === startDate.getTime()) {
-                                // First day - use original start time
-                                dayEvent.start = new Date(startTime);
-                            } else {
-                                // Subsequent days - start at beginning of day for all-day events
-                                dayEvent.start = new Date(currentDate);
-                                if (!dayEvent.allDay)
-                                    dayEvent.start.setHours(0, 0, 0, 0);
-                            }
-                            if (currentDate.getTime() === endDate.getTime()) {
-                                // Last day - use original end time
-                                dayEvent.end = new Date(endTime);
-                            } else {
-                                // Earlier days - end at end of day for all-day events
-                                dayEvent.end = new Date(currentDate);
-                                if (!dayEvent.allDay)
-                                    dayEvent.end.setHours(23, 59, 59, 999);
-                            }
-                            newEventsByDate[dateKey].push(dayEvent);
-                            // Move to next day
-                            currentDate.setDate(currentDate.getDate() + 1);
-                        }
-                    }
-                }
-                root.khalEventsByDate = newEventsByDate;
-                root.lastError = "";
-            } catch (error) {
-                root.lastError = "Failed to parse events JSON: " + error.toString();
-                root.khalEventsByDate = {};
-            }
-            // Reset for next run
-            eventsProcess.rawOutput = "";
-        }
-
-        stdout: SplitParser {
-            splitMarker: "\n"
-            onRead: data => {
-                eventsProcess.rawOutput += data + "\n";
-            }
-        }
-    }
 }

quickshell/Services/DMSNetworkService.qml

@@ -69,6 +69,7 @@ Singleton {
     property bool changingPreference: false
     property string targetPreference: ""
     property var savedWifiNetworks: []
+    readonly property int savedWifiStateApiVersion: 26
     property string connectionStatus: ""
     property string lastConnectionError: ""
     property bool passwordDialogShouldReopen: false
@@ -309,17 +310,21 @@ Singleton {
 
         if (state.wifiNetworks) {
             wifiNetworks = state.wifiNetworks;
+        }
 
+        if (state.wifiNetworks || state.savedWifiNetworks) {
+            const hasSavedWifiState = DMSService.apiVersion >= savedWifiStateApiVersion && Array.isArray(state.savedWifiNetworks);
+            const sourceSavedNetworks = hasSavedWifiState ? state.savedWifiNetworks : (state.wifiNetworks || []).filter(network => network.saved);
             const saved = [];
             const mapping = {};
-            for (const network of state.wifiNetworks) {
+            for (const network of sourceSavedNetworks) {
-                if (network.saved) {
+                const normalized = Object.assign({}, network, {
-                    saved.push({
+                    saved: true,
-                        ssid: network.ssid,
+                    outOfRange: hasSavedWifiState ? network.outOfRange === true : false
-                        saved: true
+                });
-                    });
+                saved.push(normalized);
+                if (network?.ssid)
                     mapping[network.ssid] = network.ssid;
-                }
             }
             savedConnections = saved;
             savedWifiNetworks = saved;
@@ -596,6 +601,7 @@ Singleton {
                 }
                 wifiNetworks = updated;
                 networksUpdated();
+                Qt.callLater(() => refreshSavedWifiNetworks());
             }
             forgetSSID = "";
         });
@@ -985,4 +991,11 @@ Singleton {
             }
         });
     }
+
+    function refreshSavedWifiNetworks() {
+        if (!networkAvailable)
+            return;
+
+        getState();
+    }
 }

quickshell/Services/IdleService.qml

@@ -53,6 +53,7 @@ Singleton {
     signal lockRequested
     signal fadeToLockRequested
     signal cancelFadeToLock
+    signal dismissFadeToLock
     signal fadeToDpmsRequested
     signal cancelFadeToDpms
     signal requestMonitorOff

quickshell/Services/LegacyNetworkService.qml

@@ -142,9 +142,11 @@ Singleton {
 
     readonly property var savedConnections: wifiNetworks.filter(n => n.saved).map(n => ({
                 "ssid": n.ssid,
-                "saved": true
+                "saved": true,
+                "outOfRange": false
             }))
     readonly property var savedWifiNetworks: savedConnections
+    readonly property int savedWifiStateApiVersion: 26
     readonly property var ssidToConnectionName: {
         const map = {};
         for (const n of wifiNetworks) {

quickshell/Services/NetworkService.qml

@@ -54,6 +54,7 @@ Singleton {
     property bool changingPreference: activeService?.changingPreference ?? false
     property string targetPreference: activeService?.targetPreference ?? ""
     property var savedWifiNetworks: activeService?.savedWifiNetworks ?? []
+    readonly property int savedWifiStateApiVersion: activeService?.savedWifiStateApiVersion ?? 26
     property string connectionStatus: activeService?.connectionStatus ?? ""
     property string lastConnectionError: activeService?.lastConnectionError ?? ""
     property bool passwordDialogShouldReopen: activeService?.passwordDialogShouldReopen ?? false
@@ -180,6 +181,12 @@ Singleton {
         }
     }
 
+    function refreshSavedWifiNetworks() {
+        if (activeService && activeService.refreshSavedWifiNetworks) {
+            activeService.refreshSavedWifiNetworks();
+        }
+    }
+
     function connectToWifi(ssid, password = "", username = "", anonymousIdentity = "", domainSuffixMatch = "") {
         if (activeService && activeService.connectToWifi) {
             activeService.connectToWifi(ssid, password, username, anonymousIdentity, domainSuffixMatch);

quickshell/Services/PopoutService.qml

@@ -392,8 +392,7 @@ Singleton {
     function toggleSettingsWithTab(tabName: string) {
         if (settingsModal) {
             var idx = settingsModal.resolveTabIndex(tabName);
-            if (idx >= 0)
+            settingsModal.setTabIndex(idx);
-                settingsModal.currentTabIndex = idx;
             settingsModal.toggle();
             return;
         }
@@ -433,8 +432,7 @@ Singleton {
                     return;
                 }
                 var idx = settingsModal.resolveTabIndex(tabName);
-                if (idx >= 0)
+                settingsModal.setTabIndex(idx);
-                    settingsModal.currentTabIndex = idx;
                 toplevel.activate();
                 return;
             }
@@ -466,12 +464,11 @@ Singleton {
         if (_settingsWantsToggle) {
             _settingsWantsToggle = false;
             if (_settingsPendingTabIndex >= 0) {
-                settingsModal.currentTabIndex = _settingsPendingTabIndex;
+                settingsModal?.setTabIndex(_settingsPendingTabIndex);
                 _settingsPendingTabIndex = -1;
             } else if (_settingsPendingTab) {
                 var idx = settingsModal?.resolveTabIndex(_settingsPendingTab) ?? -1;
-                if (idx >= 0)
+                settingsModal?.setTabIndex(idx);
-                    settingsModal.currentTabIndex = idx;
                 _settingsPendingTab = "";
             }
             settingsModal?.toggle();
@@ -759,8 +756,11 @@ Singleton {
     function showWifiPasswordModal(ssid) {
         if (wifiPasswordModalLoader)
             wifiPasswordModalLoader.active = true;
-        if (wifiPasswordModal)
+        if (wifiPasswordModal) {
             wifiPasswordModal.show(ssid);
+        } else {
+            Qt.callLater(() => wifiPasswordModal?.show(ssid));
+        }
     }
 
     function showWifiQRCodeModal(ssid) {
@@ -773,8 +773,11 @@ Singleton {
     function showHiddenNetworkModal() {
         if (wifiPasswordModalLoader)
             wifiPasswordModalLoader.active = true;
-        if (wifiPasswordModal)
+        if (wifiPasswordModal) {
             wifiPasswordModal.showHidden();
+        } else {
+            Qt.callLater(() => wifiPasswordModal?.showHidden());
+        }
     }
 
     function hideWifiPasswordModal() {

quickshell/Services/TailscaleService.qml

@@ -41,6 +41,7 @@ Singleton {
     property string tailnetName: ""
     property var selfNode: null
     property var peers: []
+    property bool exitNodeAllowLanAccess: false
 
     property bool available: false
     property bool stateInitialized: false
@@ -56,6 +57,19 @@ Singleton {
 
     readonly property var onlinePeers: allPeersList.filter(p => p.online)
 
+    // Peers that may be used as an exit node (offered && approved). Self is
+    // excluded: a node can never route through itself, and tailscaled rejects it.
+    readonly property var exitNodeOptions: allPeersList.filter(p => p && p.exitNodeOption && p !== selfNode)
+
+    // The currently selected exit node, or null if none is in use.
+    readonly property var currentExitNode: {
+        for (const p of allPeersList) {
+            if (p && p.exitNode)
+                return p;
+        }
+        return null;
+    }
+
     readonly property var myPeers: {
         if (!selfNode)
             return allPeersList;
@@ -141,6 +155,7 @@ Singleton {
         tailnetName = data.tailnetName || "";
         selfNode = data.self || null;
         peers = data.peers || [];
+        exitNodeAllowLanAccess = data.exitNodeAllowLanAccess || false;
     }
 
     function refresh(callback) {
@@ -152,6 +167,45 @@ Singleton {
         });
     }
 
+    // sendAction issues a state-changing request. The backend refreshes and
+    // broadcasts on success, so subscribers update without an extra getStatus.
+    function sendAction(method, params, callback) {
+        if (!available)
+            return;
+        DMSService.sendRequest(method, params, response => {
+            if (response.error) {
+                root.log.warn(method + " failed: " + response.error);
+                ToastService.showError(I18n.tr("Tailscale action failed", "Toast shown when a Tailscale write action is rejected"), response.error);
+            }
+            if (callback)
+                callback(response);
+        });
+    }
+
+    function connectTailscale(callback) {
+        sendAction("tailscale.connect", null, callback);
+    }
+
+    function disconnectTailscale(callback) {
+        sendAction("tailscale.disconnect", null, callback);
+    }
+
+    function setExitNode(id, callback) {
+        sendAction("tailscale.setExitNode", {
+            "id": id || ""
+        }, callback);
+    }
+
+    function clearExitNode(callback) {
+        setExitNode("", callback);
+    }
+
+    function setAllowLanAccess(enabled, callback) {
+        sendAction("tailscale.setAllowLanAccess", {
+            "enabled": enabled
+        }, callback);
+    }
+
     function isMine(peer) {
         const myOwner = selfNode ? (selfNode.owner || "") : "";
         if (peer.owner === myOwner && myOwner !== "")

quickshell/Services/WeatherService.qml

@@ -43,6 +43,8 @@ Singleton {
     property int lastFetchTime: 0
     property int minFetchInterval: 30000
     property int persistentRetryCount: 0
+    property int _geocodeReqId: 0
+    property var _pendingCoords: null
 
     readonly property var lowPriorityCmd: ["nice", "-n", "19", "ionice", "-c3"]
     readonly property var curlBaseCmd: ["curl", "-sS", "--fail", "--connect-timeout", "3", "--max-time", "6", "--limit-rate", "100k", "--compressed"]
@@ -452,16 +454,54 @@ Singleton {
         if (!location) {
             return null;
         }
-
+        return getWeatherApiUrlForCoords(location.latitude, location.longitude);
-        const params = ["latitude=" + location.latitude, "longitude=" + location.longitude, "current=temperature_2m,relative_humidity_2m,apparent_temperature,is_day,precipitation,weather_code,surface_pressure,wind_speed_10m", "daily=sunrise,sunset,temperature_2m_max,temperature_2m_min,weather_code,precipitation_probability_max", "hourly=temperature_2m,weather_code,precipitation_probability,wind_speed_10m,apparent_temperature,relative_humidity_2m,surface_pressure,visibility,cloud_cover", "timezone=auto", "forecast_days=7"];
-
-        return "https://api.open-meteo.com/v1/forecast?" + params.join('&');
     }
 
     function getGeocodingUrl(query) {
         return "https://geocoding-api.open-meteo.com/v1/search?name=" + encodeURIComponent(query) + "&count=1&language=en&format=json";
     }
 
+    function getConfiguredLocationName() {
+        return SessionData.isGreeterMode ? GreetdSettings.weatherLocation : SettingsData.weatherLocation;
+    }
+
+    function setLocation(lat, lon, city, country) {
+        root.location = {
+            city: city || I18n.tr("Local Weather"),
+            country: country || "",
+            latitude: lat,
+            longitude: lon
+        };
+    }
+
+    function updateLocationCity(city, country) {
+        if (!root.location)
+            return;
+
+        root.location = {
+            latitude: root.location.latitude,
+            longitude: root.location.longitude,
+            city: city || root.location.city,
+            country: country || root.location.country
+        };
+
+        if (root.weather.available) {
+            root.weather = Object.assign({}, root.weather, {
+                city: city || root.weather.city,
+                country: country || root.weather.country
+            });
+        }
+    }
+
+    function getWeatherApiUrlForCoords(lat, lon) {
+        if (lat == null || lon == null)
+            return null;
+
+        const params = ["latitude=" + lat, "longitude=" + lon, "current=temperature_2m,relative_humidity_2m,apparent_temperature,is_day,precipitation,weather_code,surface_pressure,wind_speed_10m", "daily=sunrise,sunset,temperature_2m_max,temperature_2m_min,weather_code,precipitation_probability_max", "hourly=temperature_2m,weather_code,precipitation_probability,wind_speed_10m,apparent_temperature,relative_humidity_2m,surface_pressure,visibility,cloud_cover", "timezone=auto", "forecast_days=7"];
+
+        return "https://api.open-meteo.com/v1/forecast?" + params.join('&');
+    }
+
     function addRef() {
         refCount++;
 
@@ -490,20 +530,30 @@ Singleton {
                 const lat = parseFloat(parts[0]);
                 const lon = parseFloat(parts[1]);
                 if (!isNaN(lat) && !isNaN(lon)) {
-                    getLocationFromCoords(lat, lon);
+                    if (cityName) {
+                        // User provided both: trust the configured name and coordinates, skip geocoding
+                        setLocation(lat, lon, cityName, "");
+                        fetchWeather(lat, lon);
+                    } else {
+                        getLocationFromCoords(lat, lon);
+                    }
                     return;
                 }
             }
         }
 
-        if (cityName)
+        if (cityName) {
             getLocationFromCity(cityName);
+        } else {
+            root.handleWeatherFailure();
+        }
     }
 
     function getLocationFromCoords(lat, lon) {
-        const url = "https://nominatim.openstreetmap.org/reverse?lat=" + lat + "&lon=" + lon + "&format=json&addressdetails=1&accept-language=en";
+        // Use coordinates immediately for weather; resolve city name in parallel with fallbacks
-        reverseGeocodeFetcher.command = lowPriorityCmd.concat(curlBaseCmd).concat(["-H", "User-Agent: DankMaterialShell Weather Widget", url]);
+        setLocation(lat, lon, I18n.tr("Local Weather"), "");
-        reverseGeocodeFetcher.running = true;
+        fetchWeather(lat, lon);
+        resolveCityName(lat, lon);
     }
 
     function getLocationFromCity(city) {
@@ -512,19 +562,78 @@ Singleton {
     }
 
     function getLocationFromService() {
-        if (!LocationService.valid)
+        if (!LocationService.valid) {
+            getLocationFromIP();
             return;
-        getLocationFromCoords(LocationService.latitude, LocationService.longitude);
+        }
+
+        const lat = LocationService.latitude;
+        const lon = LocationService.longitude;
+
+        if (lat === 0 && lon === 0) {
+            getLocationFromIP();
+            return;
+        }
+
+        getLocationFromCoords(lat, lon);
     }
 
-    function fetchWeather() {
+    function getLocationFromIP() {
+        ipLocationFetcher.running = true;
+    }
+
+    function resolveCityName(lat, lon) {
+        // Cancel any in-flight city resolution to avoid stale updates
+        if (nominatimFetcher.running)
+            nominatimFetcher.running = false;
+        if (photonFetcher.running)
+            photonFetcher.running = false;
+        if (bigDataCloudFetcher.running)
+            bigDataCloudFetcher.running = false;
+
+        root._geocodeReqId++;
+        root._pendingCoords = {
+            latitude: lat,
+            longitude: lon,
+            reqId: root._geocodeReqId
+        };
+
+        tryNominatim(lat, lon, root._geocodeReqId);
+    }
+
+    function tryNominatim(lat, lon, reqId) {
+        const url = "https://nominatim.openstreetmap.org/reverse?lat=" + lat + "&lon=" + lon + "&format=json&addressdetails=1&accept-language=en";
+        nominatimFetcher.command = lowPriorityCmd.concat(curlBaseCmd).concat(["-H", "User-Agent: DankMaterialShell Weather Widget", url]);
+        nominatimFetcher.reqId = reqId;
+        nominatimFetcher.running = true;
+    }
+
+    function tryPhoton(lat, lon, reqId) {
+        const url = "https://photon.komoot.io/reverse?lat=" + lat + "&lon=" + lon + "&lang=en";
+        photonFetcher.command = lowPriorityCmd.concat(curlBaseCmd).concat([url]);
+        photonFetcher.reqId = reqId;
+        photonFetcher.running = true;
+    }
+
+    function tryBigDataCloud(lat, lon, reqId) {
+        const url = "https://api.bigdatacloud.net/data/reverse-geocode-client?latitude=" + lat + "&longitude=" + lon + "&localityLanguage=zh";
+        bigDataCloudFetcher.command = lowPriorityCmd.concat(curlBaseCmd).concat([url]);
+        bigDataCloudFetcher.reqId = reqId;
+        bigDataCloudFetcher.running = true;
+    }
+
+    function fetchWeather(lat, lon) {
         if (root.refCount === 0 || !SettingsData.weatherEnabled) {
             return;
         }
 
-        if (!location) {
+        if (lat == null || lon == null) {
-            updateLocation();
+            if (!location) {
-            return;
+                updateLocation();
+                return;
+            }
+            lat = location.latitude;
+            lon = location.longitude;
         }
 
         if (weatherFetcher.running) {
@@ -536,7 +645,7 @@ Singleton {
             return;
         }
 
-        const apiUrl = getWeatherApiUrl();
+        const apiUrl = getWeatherApiUrlForCoords(lat, lon);
         if (!apiUrl) {
             return;
         }
@@ -586,9 +695,123 @@ Singleton {
     }
 
     Process {
-        id: reverseGeocodeFetcher
+        id: nominatimFetcher
+        property int reqId: 0
         running: false
 
+        stdout: StdioCollector {
+            onStreamFinished: {
+                if (nominatimFetcher.reqId !== root._geocodeReqId)
+                    return;
+
+                const raw = text.trim();
+                if (!raw || raw[0] !== "{") {
+                    root.tryPhoton(root._pendingCoords.latitude, root._pendingCoords.longitude, root._geocodeReqId);
+                    return;
+                }
+
+                try {
+                    const data = JSON.parse(raw);
+                    const address = data.address || {};
+                    const city = address.hamlet || address.city || address.town || address.village || I18n.tr("Unknown");
+                    const country = address.country || I18n.tr("Unknown");
+                    root.updateLocationCity(city, country);
+                } catch (e) {
+                    root.tryPhoton(root._pendingCoords.latitude, root._pendingCoords.longitude, root._geocodeReqId);
+                }
+            }
+        }
+
+        onExited: exitCode => {
+            if (nominatimFetcher.reqId !== root._geocodeReqId)
+                return;
+            if (exitCode !== 0) {
+                root.tryPhoton(root._pendingCoords.latitude, root._pendingCoords.longitude, root._geocodeReqId);
+            }
+        }
+    }
+
+    Process {
+        id: photonFetcher
+        property int reqId: 0
+        running: false
+
+        stdout: StdioCollector {
+            onStreamFinished: {
+                if (photonFetcher.reqId !== root._geocodeReqId)
+                    return;
+
+                const raw = text.trim();
+                if (!raw || raw[0] !== "{") {
+                    root.tryBigDataCloud(root._pendingCoords.latitude, root._pendingCoords.longitude, root._geocodeReqId);
+                    return;
+                }
+
+                try {
+                    const data = JSON.parse(raw);
+                    const features = data.features;
+                    if (!features || features.length === 0) {
+                        throw new Error("No Photon results");
+                    }
+
+                    const props = features[0].properties || {};
+                    const city = props.city || props.town || props.village || props.locality || props.name || I18n.tr("Unknown");
+                    const country = props.country || I18n.tr("Unknown");
+                    root.updateLocationCity(city, country);
+                } catch (e) {
+                    root.tryBigDataCloud(root._pendingCoords.latitude, root._pendingCoords.longitude, root._geocodeReqId);
+                }
+            }
+        }
+
+        onExited: exitCode => {
+            if (photonFetcher.reqId !== root._geocodeReqId)
+                return;
+            if (exitCode !== 0) {
+                root.tryBigDataCloud(root._pendingCoords.latitude, root._pendingCoords.longitude, root._geocodeReqId);
+            }
+        }
+    }
+
+    Process {
+        id: bigDataCloudFetcher
+        property int reqId: 0
+        running: false
+
+        stdout: StdioCollector {
+            onStreamFinished: {
+                if (bigDataCloudFetcher.reqId !== root._geocodeReqId)
+                    return;
+
+                const raw = text.trim();
+                if (!raw || raw[0] !== "{") {
+                    // All city resolution fallbacks failed; weather is already displayed
+                    return;
+                }
+
+                try {
+                    const data = JSON.parse(raw);
+                    const city = data.city || data.locality || I18n.tr("Unknown");
+                    const country = data.countryName || I18n.tr("Unknown");
+                    root.updateLocationCity(city, country);
+                } catch (e) {
+                    // All fallbacks failed; keep placeholder city name
+                }
+            }
+        }
+
+        onExited: exitCode => {
+            if (bigDataCloudFetcher.reqId !== root._geocodeReqId)
+                return;
+            // Final fallback; no further action needed
+        }
+    }
+
+    Process {
+        id: ipLocationFetcher
+        running: false
+        command: lowPriorityCmd.concat(curlBaseCmd).concat(["http://ip-api.com/json/"])
+
         stdout: StdioCollector {
             onStreamFinished: {
                 const raw = text.trim();
@@ -599,16 +822,21 @@ Singleton {
 
                 try {
                     const data = JSON.parse(raw);
-                    const address = data.address || {};
 
-                    root.location = {
+                    if (data.status === "fail") {
-                        city: address.hamlet || address.city || address.town || address.village || I18n.tr("Unknown"),
+                        throw new Error("IP location lookup failed");
-                        country: address.country || I18n.tr("Unknown"),
+                    }
-                        latitude: parseFloat(data.lat),
-                        longitude: parseFloat(data.lon)
-                    };
 
-                    fetchWeather();
+                    const lat = parseFloat(data.lat);
+                    const lon = parseFloat(data.lon);
+                    const city = data.city;
+
+                    if (!city || isNaN(lat) || isNaN(lon)) {
+                        throw new Error("Missing or invalid location data");
+                    }
+
+                    setLocation(lat, lon, city, data.countryName || "");
+                    fetchWeather(lat, lon);
                 } catch (e) {
                     root.handleWeatherFailure();
                 }
@@ -833,8 +1061,10 @@ Singleton {
         function onLocationChanged(data) {
             if (!SettingsData.useAutoLocation)
                 return;
-            if (data.latitude === 0 && data.longitude === 0)
+            if (data.latitude === 0 && data.longitude === 0) {
+                root.getLocationFromIP();
                 return;
+            }
             root.getLocationFromCoords(data.latitude, data.longitude);
         }
     }

quickshell/Widgets/DankDropdown.qml

@@ -28,6 +28,7 @@ Item {
     property var optionIcons: []
     property bool enableFuzzySearch: false
     property var optionIconMap: ({})
+    property var optionColorMap: ({})
 
     function rebuildIconMap() {
         const map = {};
@@ -160,7 +161,24 @@ Item {
             anchors.rightMargin: Theme.spacingS
             spacing: Theme.spacingS
 
+            Rectangle {
+                id: triggerSwatch
+
+                property var swatchColor: root.optionColorMap[root.currentValue]
+
+                width: 16
+                height: 16
+                radius: 8
+                color: swatchColor !== undefined ? swatchColor : "transparent"
+                border.color: Theme.outline
+                border.width: 1
+                anchors.verticalCenter: parent.verticalCenter
+                visible: swatchColor !== undefined
+            }
+
             DankIcon {
+                id: triggerIcon
+
                 name: root.optionIconMap[root.currentValue] ?? ""
                 size: 18
                 color: Theme.surfaceText
@@ -173,7 +191,7 @@ Item {
                 text: root.currentValue !== "" ? root.currentValue : root.emptyText
                 font.pixelSize: Theme.fontSizeMedium
                 color: root.currentValue !== "" ? Theme.surfaceText : Theme.outline
-                width: contentRow.width - (contentRow.children[0].visible ? contentRow.children[0].width + contentRow.spacing : 0)
+                width: contentRow.width - (triggerSwatch.visible ? triggerSwatch.width + contentRow.spacing : 0) - (triggerIcon.visible ? triggerIcon.width + contentRow.spacing : 0)
                 elide: Text.ElideRight
                 wrapMode: Text.NoWrap
                 horizontalAlignment: Text.AlignLeft
@@ -406,6 +424,7 @@ Item {
                         property bool isSelected: dropdownMenu.selectedIndex === index
                         property bool isCurrentValue: root.currentValue === modelData
                         property string iconName: root.optionIconMap[modelData] ?? ""
+                        property var swatchColor: root.optionColorMap[modelData]
 
                         width: ListView.view.width
                         height: 32
@@ -420,6 +439,19 @@ Item {
                             anchors.verticalCenter: parent.verticalCenter
                             spacing: Theme.spacingS
 
+                            Rectangle {
+                                id: optionSwatch
+
+                                width: 16
+                                height: 16
+                                radius: 8
+                                color: delegateRoot.swatchColor !== undefined ? delegateRoot.swatchColor : "transparent"
+                                border.color: delegateRoot.isCurrentValue ? Theme.primary : Theme.outline
+                                border.width: 1
+                                anchors.verticalCenter: parent.verticalCenter
+                                visible: delegateRoot.swatchColor !== undefined
+                            }
+
                             DankIcon {
                                 name: delegateRoot.iconName
                                 size: 18
@@ -433,7 +465,7 @@ Item {
                                 font.pixelSize: Theme.fontSizeMedium
                                 color: delegateRoot.isCurrentValue ? Theme.primary : Theme.surfaceText
                                 font.weight: delegateRoot.isCurrentValue ? Font.Medium : Font.Normal
-                                width: root.popupWidth > 0 ? undefined : (delegateRoot.width - parent.x - Theme.spacingS * 2)
+                                width: root.popupWidth > 0 ? undefined : (delegateRoot.width - parent.x - Theme.spacingS * 2 - (optionSwatch.visible ? optionSwatch.width + parent.spacing : 0))
                                 elide: root.popupWidth > 0 ? Text.ElideNone : Text.ElideRight
                                 wrapMode: Text.NoWrap
                                 horizontalAlignment: Text.AlignLeft

quickshell/Widgets/DankSlideout.qml

@@ -16,6 +16,8 @@ PanelWindow {
     property var targetScreen: null
     property var modelData: null
     property bool triggerUsesOverlayLayer: false
+    // Drop off the Overlay layer (back to Top) while an overlay modal
+    property bool suppressOverlayLayer: false
     property real slideoutWidth: 480
     property bool expandable: false
     property bool expandedWidth: false
@@ -67,7 +69,7 @@ PanelWindow {
 
     readonly property bool slideoutBlurActive: root.visible && BlurService.enabled && Theme.connectedSurfaceBlurEnabled
 
-    WlrLayershell.layer: (triggerUsesOverlayLayer || CompositorService.framePeerSurfacesUseOverlayForScreen(modelData)) ? WlrLayershell.Overlay : WlrLayershell.Top
+    WlrLayershell.layer: (!suppressOverlayLayer && (triggerUsesOverlayLayer || CompositorService.framePeerSurfacesUseOverlayForScreen(modelData))) ? WlrLayershell.Overlay : WlrLayershell.Top
     WlrLayershell.exclusiveZone: 0
     WlrLayershell.keyboardFocus: isVisible ? WlrKeyboardFocus.OnDemand : WlrKeyboardFocus.None
 

quickshell/Widgets/DankTextField.qml

@@ -23,6 +23,7 @@ StyledRect {
 
     property alias text: textInput.text
     property string placeholderText: ""
+    property string labelText: ""
     property alias font: textInput.font
     property alias textColor: textInput.color
     property alias echoMode: textInput.echoMode
@@ -85,8 +86,10 @@ StyledRect {
         textInput.insert(textInput.cursorPosition, str);
     }
 
+    readonly property real labelBandHeight: Math.round(Theme.fontSizeSmall * 1.4) + Theme.spacingXS * 2
+
     width: 200
-    height: Math.round(Theme.fontSizeMedium * 3)
+    height: labelText !== "" ? Math.round(Theme.fontSizeMedium * 3) + labelBandHeight : Math.round(Theme.fontSizeMedium * 3)
     radius: cornerRadius
     color: backgroundColor
     border.color: textInput.activeFocus ? focusedBorderColor : normalBorderColor
@@ -97,13 +100,27 @@ StyledRect {
 
         anchors.left: parent.left
         anchors.leftMargin: Theme.spacingM
-        anchors.verticalCenter: parent.verticalCenter
+        anchors.verticalCenter: textInput.verticalCenter
         name: leftIconName
         size: leftIconSize
         color: textInput.activeFocus ? leftIconFocusedColor : leftIconColor
         visible: leftIconName !== ""
     }
 
+    StyledText {
+        id: fieldLabel
+
+        anchors.left: textInput.left
+        anchors.right: textInput.right
+        anchors.top: parent.top
+        anchors.topMargin: Theme.spacingXS
+        text: root.labelText
+        visible: root.labelText !== ""
+        font.pixelSize: Theme.fontSizeSmall
+        color: textInput.activeFocus ? Theme.primary : Theme.surfaceVariantText
+        elide: Text.ElideRight
+    }
+
     TextInput {
         id: textInput
 
@@ -112,7 +129,7 @@ StyledRect {
         anchors.right: rightButtonsRow.left
         anchors.rightMargin: rightButtonsRow.visible ? Theme.spacingS : Theme.spacingM
         anchors.top: parent.top
-        anchors.topMargin: root.topPadding
+        anchors.topMargin: root.labelText !== "" ? root.labelBandHeight : root.topPadding
         anchors.bottom: parent.bottom
         anchors.bottomMargin: root.bottomPadding
         font.pixelSize: Theme.fontSizeMedium