Bar settings: use qs.Ui.ButtonGroup for the position picker

The custom PositionButtonGroup component wrapped Repeater + Button
directly without setting bordered: true on the delegates. After the
recent Button changes (idle non-bordered Buttons have zero border
width), the non-selected position chips lost their visible chip
structure entirely \u2014 they rendered as floating text labels and read
as unclickable.

Replace the bespoke component with qs.Ui.ButtonGroup (which sets
bordered: true on each chip) inside a Column with a 'Position' label,
and drop the now-unused PositionButtonGroup definition. All four
options now read as clickable chips and the chosen value still paints
the accent fill+border.

shell/plugins/settings/SettingsPanel.qml

@@ -726,14 +726,31 @@ Item {
       Layout.fillWidth: true
       spacing: 14
 
-      PositionButtonGroup {
+      Column {
-        value: root.draft.bar.position
+        spacing: 4
-        onChanged: function(v) {
+
-          if (root.draft.bar.position === v) return
+        Text {
-          var next = root.cloneJson(root.draft)
+          text: "Position"
-          next.bar.position = v
+          color: Qt.darker(root.foreground, 1.4)
-          root.draft = next
+          font.family: root.fontFamily
-          root.markDirty()
+          font.pixelSize: Style.font.caption
+          font.bold: true
+        }
+
+        ButtonGroup {
+          options: ["top", "right", "bottom", "left"]
+          value: root.draft.bar.position
+          foreground: root.foreground
+          background: root.background
+          accent: root.accent
+          fontFamily: root.fontFamily
+          onChanged: function(v) {
+            if (root.draft.bar.position === v) return
+            var next = root.cloneJson(root.draft)
+            next.bar.position = v
+            root.draft = next
+            root.markDirty()
+          }
         }
       }
 
@@ -799,52 +816,6 @@ Item {
     }
   }
 
-  // ===================== shared chrome =====================================
-  component PositionButtonGroup: Item {
-    id: positionGroup
-
-    property string value: "top"
-    readonly property var positions: ["top", "right", "bottom", "left"]
-
-    signal changed(string value)
-
-    implicitWidth: positionColumn.implicitWidth
-    implicitHeight: positionColumn.implicitHeight
-
-    Column {
-      id: positionColumn
-      spacing: 4
-
-      Text {
-        text: "Position"
-        color: Qt.darker(root.foreground, 1.4)
-        font.family: root.fontFamily
-        font.pixelSize: Style.font.caption
-        font.bold: true
-      }
-
-      Row {
-        spacing: 6
-
-        Repeater {
-          model: positionGroup.positions
-
-          delegate: Button {
-            required property string modelData
-
-            text: modelData
-            selected: positionGroup.value === modelData
-            foreground: root.foreground
-            background: root.background
-            accent: root.accent
-            fontFamily: root.fontFamily
-            onClicked: positionGroup.changed(modelData)
-          }
-        }
-      }
-    }
-  }
-
   // ===================== bar layout pieces =================================
   component SectionEditor: Column {
     id: section