Add .grayscale modifier support

README.md

@@ -1106,6 +1106,10 @@ Support levels:
       <td>✅</td>
       <td><code>.gradient</code> (<a href="https://skip.tools/docs/components/gradient/">example</a>)</td>
     </tr>
+    <tr>
+      <td>✅</td>
+      <td><code>.grayscale</code></td>
+    </tr>
     <tr>
       <td>✅</td>
       <td><code>.hidden</code></td>

Sources/SkipUI/SkipUI/Compose/ComposeModifiers.swift

@@ -0,0 +1,37 @@
+// Copyright 2023 Skip
+//
+// This is free software: you can redistribute and/or modify it
+// under the terms of the GNU Lesser General Public License 3.0
+// as published by the Free Software Foundation https://fsf.org
+
+#if SKIP
+import androidx.compose.ui.draw.DrawModifier
+import androidx.compose.ui.geometry.Rect
+import androidx.compose.ui.graphics.ColorFilter
+import androidx.compose.ui.graphics.ColorMatrix
+import androidx.compose.ui.graphics.Paint
+import androidx.compose.ui.graphics.drawscope.ContentDrawScope
+import androidx.compose.ui.graphics.drawscope.drawIntoCanvas
+
+class GrayscaleModifier : DrawModifier {
+    let amount: Double
+
+    init(amount: Double) {
+        self.amount = amount
+    }
+
+    // SKIP DECLARE: override fun ContentDrawScope.draw()
+    override func draw() {
+        let saturationMatrix = ColorMatrix().apply { setToSaturation(Float(max(0.0, 1.0 - amount))) }
+        let saturationFilter = ColorFilter.colorMatrix(saturationMatrix)
+        let paint = Paint().apply {
+            colorFilter = saturationFilter
+        }
+        drawIntoCanvas {
+            $0.saveLayer(Rect(Float(0.0), Float(0.0), size.width, size.height), paint)
+            drawContent()
+            $0.restore()
+        }
+    }
+}
+#endif

Sources/SkipUI/SkipUI/View/View.swift

@@ -465,9 +465,15 @@ extension View {
         #endif
     }
 
-    @available(*, unavailable)
     public func grayscale(_ amount: Double) -> some View {
+        #if SKIP
+        return ComposeModifierView(targetView: self) {
+            $0.modifier = $0.modifier.then(GrayscaleModifier(amount: amount))
+            return ComposeResult.ok
+        }
+        #else
         return self
+        #endif
     }
 
     @available(*, unavailable)