bar: use swipeview

config/BarConfig.qml

@@ -1,16 +1,21 @@
 pragma Singleton
+pragma ComponentBehavior: Bound
 
 import Quickshell
 import QtQuick
 
 Singleton {
+    id: root
+
     property bool vertical: false
+    property Preset preset: presets.pills
 
     readonly property Sizes sizes: Sizes {}
     readonly property Workspaces workspaces: Workspaces {}
+    readonly property Presets presets: Presets {}
 
     component Sizes: QtObject {
-        readonly property int height: 50
+        readonly property int height: 40
         readonly property int innerHeight: 30
         readonly property int floatingGap: 10
         readonly property int floatingGapLarge: 15
@@ -21,4 +26,16 @@ Singleton {
         readonly property string style: ""
         readonly property bool occupiedBg: true
     }
+
+    component Preset: QtObject {
+        required property string name
+        required property int totalHeight
+    }
+
+    component Presets: QtObject {
+        readonly property Preset pills: Preset {
+            name: "pills"
+            totalHeight: root.sizes.height + root.sizes.floatingGap
+        }
+    }
 }

modules/bar/Bar.qml

@@ -19,8 +19,8 @@ Variants {
         namespace: "caelestia-bar"
         color: "transparent"
 
-        width: content.width
+        width: BarConfig.vertical ? BarConfig.preset.totalHeight : -1
-        height: content.height
+        height: BarConfig.vertical ? -1 : BarConfig.preset.totalHeight
 
         anchors.top: true
         anchors.left: true
@@ -42,13 +42,16 @@ Variants {
         //     }
         // }
 
-        // SwipeView {
+        SwipeView {
-        //     anchors.fill: parent
+            anchors.fill: parent
+            currentIndex: 1
 
-        // }
+            // Item {
             Pills {
                 id: content
             }
+            // }
+        }
 
         // Box {
         //     id: contents

modules/bar/Pills.qml

@@ -4,11 +4,10 @@ import "root:/widgets"
 import "root:/config"
 import "components"
 import "components/workspaces"
-import Quickshell
 import Quickshell.Wayland
 import QtQuick
-import QtQuick.Controls
 
+Item {
     Item {
         id: root
 
@@ -22,9 +21,6 @@ Item {
         anchors.rightMargin: get(BarConfig.sizes.floatingGapLarge, 0)
         anchors.bottomMargin: get(0, BarConfig.sizes.floatingGapLarge)
 
-    width: get(-1, BarConfig.sizes.height + BarConfig.sizes.floatingGap)
-    height: get(BarConfig.sizes.height + BarConfig.sizes.floatingGap, -1)
-
         Pill {
             anchors.left: parent.left
 
@@ -70,6 +66,7 @@ Item {
                 anchors.verticalCenter: root.get(parent.verticalCenter, undefined)
             }
         }
+    }
 
     component Pill: PaddedRect {
         id: pill
@@ -78,28 +75,7 @@ Item {
         radius: Appearance.rounding.full
         padding: BarConfig.vertical ? [Appearance.padding.large, 0] : [0, Appearance.padding.large]
 
-        anchors.top: parent.top
+        width: BarConfig.vertical ? BarConfig.sizes.height : implicitWidth
-        anchors.bottom: parent.bottom
+        height: BarConfig.vertical ? implicitHeight : BarConfig.sizes.height
-
-        state: BarConfig.vertical ? "vertical" : ""
-        states: State {
-            name: "vertical"
-
-            AnchorChanges {
-                target: pill
-                anchors.top: undefined
-                anchors.bottom: undefined
-                anchors.left: parent.left
-                anchors.right: parent.right
-            }
-        }
-
-        transitions: Transition {
-            AnchorAnimation {
-                duration: Appearance.anim.durations.normal
-                easing.type: Easing.BezierSpline
-                easing.bezierCurve: Appearance.anim.curves.emphasized
-            }
-        }
     }
 }