Finalize m3 shadow & elevation

quickshell/Common/ElevationShadow.qml

@@ -0,0 +1,54 @@
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import QtQuick.Effects
+import qs.Common
+
+Item {
+    id: root
+
+    property var level: Theme.elevationLevel2
+    property string direction: Theme.elevationLightDirection
+    property real fallbackOffset: 4
+
+    property color targetColor: "white"
+    property real targetRadius: Theme.cornerRadius
+    property color borderColor: "transparent"
+    property real borderWidth: 0
+
+    property bool shadowEnabled: Theme.elevationEnabled
+    property real shadowBlurPx: level && level.blurPx !== undefined ? level.blurPx : 0
+    property real shadowSpreadPx: level && level.spreadPx !== undefined ? level.spreadPx : 0
+    property real shadowOffsetX: Theme.elevationOffsetXFor(level, direction, fallbackOffset)
+    property real shadowOffsetY: Theme.elevationOffsetYFor(level, direction, fallbackOffset)
+    property color shadowColor: Theme.elevationShadowColor(level)
+    property real shadowOpacity: 1
+    property real blurMax: Theme.elevationBlurMax
+
+    property alias sourceRect: sourceRect
+
+    layer.enabled: shadowEnabled
+
+    layer.effect: MultiEffect {
+        autoPaddingEnabled: true
+        shadowEnabled: true
+        blurEnabled: false
+        maskEnabled: false
+        shadowBlur: Math.max(0, Math.min(1, root.shadowBlurPx / Math.max(1, root.blurMax)))
+        shadowScale: 1 + (2 * root.shadowSpreadPx) / Math.max(1, Math.min(root.width, root.height))
+        shadowHorizontalOffset: root.shadowOffsetX
+        shadowVerticalOffset: root.shadowOffsetY
+        blurMax: root.blurMax
+        shadowColor: root.shadowColor
+        shadowOpacity: root.shadowOpacity
+    }
+
+    Rectangle {
+        id: sourceRect
+        anchors.fill: parent
+        radius: root.targetRadius
+        color: root.targetColor
+        border.color: root.borderColor
+        border.width: root.borderWidth
+    }
+}

quickshell/Common/Theme.qml

@@ -838,6 +838,18 @@ Singleton {
         return elevationOffsetYFor(level, elevationLightDirection, fallback);
     }
 
+    function elevationRenderPadding(level, direction, fallbackOffset, extraPadding, minPadding) {
+        const dir = direction !== undefined ? direction : elevationLightDirection;
+        const blur = (level && level.blurPx !== undefined) ? Math.max(0, level.blurPx) : 0;
+        const spread = (level && level.spreadPx !== undefined) ? Math.max(0, level.spreadPx) : 0;
+        const fallback = fallbackOffset !== undefined ? fallbackOffset : 0;
+        const extra = extraPadding !== undefined ? extraPadding : 8;
+        const minPad = minPadding !== undefined ? minPadding : 16;
+        const offsetX = Math.abs(elevationOffsetXFor(level, dir, fallback));
+        const offsetY = Math.abs(elevationOffsetYFor(level, dir, fallback));
+        return Math.max(minPad, blur + spread + Math.max(offsetX, offsetY) + extra);
+    }
+
     function elevationShadowColor(level) {
         const alpha = (level && level.alpha !== undefined) ? level.alpha : 0.3;
         let r = 0;