refactor(slint): promote ToggleButton to a shared primitive

LabelReleasesView and DiscoverBrowseView each carried a verbatim copy of
the 34px segmented/toolbar toggle. Move it to primitives/ToggleButton and
import it in both. No visual change — same surface, one definition.

cc

crates/qbz-slint/ui/discover/DiscoverBrowseView.slint

@@ -18,6 +18,7 @@ import { LoadingSpinner } from "../primitives/LoadingSpinner.slint";
 import { ListScrollbar } from "../primitives/ListScrollbar.slint";
 import { NavButtons } from "../shell/NavButtons.slint";
 import { QbzIcon } from "../primitives/QbzIcon.slint";
+import { ToggleButton } from "../primitives/ToggleButton.slint";
 
 // Search field — a leading magnifier, the input, and a trailing X that
 // clears (mirrors Tauri's .search-wrapper).
@@ -144,35 +145,6 @@ component GenreButton inherits Rectangle {
     }
 }
 
-// One half of the grid/list segmented toggle.
-component ToggleButton inherits Rectangle {
-    in property <image> icon;
-    in property <bool> active: false;
-    callback clicked();
-
-    width: 34px;
-    height: 34px;
-    background: root.active
-        ? Theme.surface-hover
-        : (ta.has-hover ? Theme.surface-elevated : transparent);
-
-    QbzIcon {
-        source: root.icon;
-        width: 17px;
-        height: 17px;
-        x: (parent.width - self.width) / 2;
-        y: (parent.height - self.height) / 2;
-        tint: root.active ? Theme.text-primary : Theme.text-muted;
-    }
-
-    ta := TouchArea {
-        mouse-cursor: pointer;
-        clicked => {
-            root.clicked();
-        }
-    }
-}
-
 export component DiscoverBrowseView inherits Rectangle {
     callback open-album(string);
     callback open-artist(string);

crates/qbz-slint/ui/label/LabelReleasesView.slint

@@ -18,38 +18,9 @@ import { QbzSelect } from "../primitives/QbzSelect.slint";
 import { ExpandableSearch } from "../primitives/ExpandableSearch.slint";
 import { ListScrollbar } from "../primitives/ListScrollbar.slint";
 import { LoadingSpinner } from "../primitives/LoadingSpinner.slint";
+import { ToggleButton } from "../primitives/ToggleButton.slint";
 import { NavButtons } from "../shell/NavButtons.slint";
 
-// One half of a segmented toggle (grid/list) or a standalone toolbar
-// toggle (group / Hi-Res). Identical surface to DiscoverBrowseView's.
-component ToggleButton inherits Rectangle {
-    in property <image> icon;
-    in property <bool> active: false;
-    callback clicked();
-
-    width: 34px;
-    height: 34px;
-    background: root.active
-        ? Theme.surface-hover
-        : (ta.has-hover ? Theme.surface-elevated : transparent);
-
-    QbzIcon {
-        source: root.icon;
-        width: 17px;
-        height: 17px;
-        x: (parent.width - self.width) / 2;
-        y: (parent.height - self.height) / 2;
-        tint: root.active ? Theme.text-primary : Theme.text-muted;
-    }
-
-    ta := TouchArea {
-        mouse-cursor: pointer;
-        clicked => {
-            root.clicked();
-        }
-    }
-}
-
 // Wrapping album grid over a model — shared by the flat view and each
 // group-by-artist section so the column math lives in one place.
 component AlbumGrid inherits Rectangle {

crates/qbz-slint/ui/primitives/ToggleButton.slint

@@ -0,0 +1,35 @@
+// One half of a segmented toggle (grid/list) or a standalone toolbar
+// toggle (group-by / Hi-Res / filter). Shared by every album-toolbar
+// view (Discover Browse, Label Releases, Favorites). 34px square icon
+// button: highlighted when active, surface-elevated on hover.
+
+import { Theme } from "../foundation/semantic-colors.slint";
+import { QbzIcon } from "QbzIcon.slint";
+
+export component ToggleButton inherits Rectangle {
+    in property <image> icon;
+    in property <bool> active: false;
+    callback clicked();
+
+    width: 34px;
+    height: 34px;
+    background: root.active
+        ? Theme.surface-hover
+        : (ta.has-hover ? Theme.surface-elevated : transparent);
+
+    QbzIcon {
+        source: root.icon;
+        width: 17px;
+        height: 17px;
+        x: (parent.width - self.width) / 2;
+        y: (parent.height - self.height) / 2;
+        tint: root.active ? Theme.text-primary : Theme.text-muted;
+    }
+
+    ta := TouchArea {
+        mouse-cursor: pointer;
+        clicked => {
+            root.clicked();
+        }
+    }
+}