Add desktop demo and rework demo modules

- Add :demo:desktopApp (Compose JVM desktop application) consuming the
  shared MainScreen.
- Move :wasmApp under :demo:wasmApp and consume the shared MainScreen.
- Migrate demo image picking from peekaboo-image-picker to FileKit.
- Set the demo Res class package to
  com.github.skydoves.colorpickercomposedemo.shared via packageOfResClass.
- Drop the GlobalScope/CoroutineScope constructor from ColorPickerController;
  ColorPicker now collects on a rememberCoroutineScope.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

14 files changed, 210 insertions, 38 deletions

diff --git a/demo/androidApp/build.gradle.kts b/demo/androidApp/build.gradle.kts
index 59e60d4..1c76a8e 100644
--- a/demo/androidApp/build.gradle.kts
+++ b/demo/androidApp/build.gradle.kts
@@ -18,7 +18,6 @@ import com.github.skydoves.colorpicker.compose.Configuration
 plugins {
   alias(libs.plugins.android.application)
   alias(libs.plugins.compose.compiler)
-  alias(libs.plugins.baseline.profile)
 }
 
 android {
@@ -52,15 +51,6 @@ android {
   lint {
     abortOnError = false
   }
-
-  buildTypes {
-    create("benchmark") {
-      initWith(buildTypes.getByName("release"))
-      signingConfig = signingConfigs.getByName("debug")
-      matchingFallbacks += listOf("release")
-      isDebuggable = false
-    }
-  }
 }
 
 dependencies {
@@ -69,7 +59,7 @@ dependencies {
   implementation(libs.compose.foundation)
   implementation(libs.compose.material)
   implementation(libs.compose.ui)
-  baselineProfile(project(":benchmark"))
+  implementation(libs.filekit.dialogs.compose)
 }
 
 kotlin {
diff --git a/demo/androidApp/src/main/kotlin/com/github/skydoves/colorpickercomposedemo/MainActivity.kt b/demo/androidApp/src/main/kotlin/com/github/skydoves/colorpickercomposedemo/MainActivity.kt
index 64a00ef..14e0276 100644
--- a/demo/androidApp/src/main/kotlin/com/github/skydoves/colorpickercomposedemo/MainActivity.kt
+++ b/demo/androidApp/src/main/kotlin/com/github/skydoves/colorpickercomposedemo/MainActivity.kt
@@ -28,11 +28,16 @@ import androidx.compose.ui.ExperimentalComposeUiApi
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.semantics.semantics
 import androidx.compose.ui.semantics.testTagsAsResourceId
+import io.github.vinceglb.filekit.FileKit
+import io.github.vinceglb.filekit.dialogs.init
 
 class MainActivity : ComponentActivity() {
   override fun onCreate(savedInstanceState: Bundle?) {
     super.onCreate(savedInstanceState)
 
+    // Initialize FileKit
+    FileKit.init(this)
+
     setContent {
       MaterialTheme(colors = darkColors()) {
         Box(
diff --git a/demo/desktopApp/build.gradle.kts b/demo/desktopApp/build.gradle.kts
new file mode 100644
index 0000000..db10789
--- /dev/null
+++ b/demo/desktopApp/build.gradle.kts
@@ -0,0 +1,39 @@
+import org.jetbrains.compose.desktop.application.dsl.TargetFormat
+import org.jetbrains.kotlin.gradle.dsl.JvmTarget
+import org.jetbrains.kotlin.gradle.tasks.KotlinJvmCompile
+
+plugins {
+  alias(libs.plugins.kotlin.multiplatform)
+  alias(libs.plugins.jetbrains.compose)
+  alias(libs.plugins.compose.compiler)
+}
+
+kotlin {
+  jvm()
+
+  sourceSets {
+    jvmMain.dependencies {
+      implementation(compose.desktop.currentOs)
+      implementation(libs.filekit.dialogs.compose)
+
+      implementation(project(":demo:shared"))
+    }
+  }
+}
+
+compose.desktop {
+  application {
+    mainClass = "MainKt"
+    nativeDistributions {
+      targetFormats(TargetFormat.Dmg, TargetFormat.Msi, TargetFormat.Deb)
+      packageName = "ColorPickerComposeDemo"
+      packageVersion = "1.0.0"
+    }
+  }
+}
+
+tasks.withType<KotlinJvmCompile>().configureEach {
+  compilerOptions {
+    jvmTarget.set(JvmTarget.JVM_17)
+  }
+}
diff --git a/demo/desktopApp/src/jvmMain/kotlin/Main.kt b/demo/desktopApp/src/jvmMain/kotlin/Main.kt
new file mode 100644
index 0000000..79c16f3
--- /dev/null
+++ b/demo/desktopApp/src/jvmMain/kotlin/Main.kt
@@ -0,0 +1,32 @@
+/*
+ * Designed and developed by 2022 skydoves (Jaewoong Eum)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import androidx.compose.ui.window.Window
+import androidx.compose.ui.window.application
+import com.github.skydoves.colorpickercomposedemo.MainScreen
+import io.github.vinceglb.filekit.FileKit
+
+fun main() {
+  // Required so the image picker's native file dialog works on desktop.
+  FileKit.init("ColorPickerComposeDemo")
+  application {
+    Window(
+      onCloseRequest = ::exitApplication,
+      title = "ColorPicker Compose",
+    ) {
+      MainScreen()
+    }
+  }
+}
diff --git a/demo/shared/build.gradle.kts b/demo/shared/build.gradle.kts
index 40f3937..7c0af17 100644
--- a/demo/shared/build.gradle.kts
+++ b/demo/shared/build.gradle.kts
@@ -13,7 +13,10 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+@file:OptIn(ExperimentalWasmDsl::class)
+
 import com.github.skydoves.colorpicker.compose.Configuration
+import org.jetbrains.kotlin.gradle.ExperimentalWasmDsl
 
 plugins {
   alias(libs.plugins.kmp.android.library)
@@ -42,6 +45,12 @@ kotlin {
     }
   }
 
+  wasmJs {
+    browser()
+  }
+
+  jvm()
+
   sourceSets {
     commonMain.dependencies {
       implementation(libs.compose.runtime)
@@ -52,13 +61,17 @@ kotlin {
       implementation(libs.compose.components.resources)
 
       implementation(libs.androidx.compose.navigation)
-      implementation(libs.image.picker)
+      implementation(libs.filekit.dialogs.compose)
 
       api(project(":colorpicker-compose"))
     }
   }
 }
 
+compose.resources {
+  packageOfResClass = "com.github.skydoves.colorpickercomposedemo.shared"
+}
+
 dependencies {
   // The new com.android.kotlin.multiplatform.library plugin has no build variants,
   // so debugImplementation isn't available — use the unified android runtime classpath.
diff --git a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/MainScreen.kt b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/MainScreen.kt
index 7c2f304..44d1e64 100644
--- a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/MainScreen.kt
+++ b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/MainScreen.kt
@@ -42,12 +42,12 @@ import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import androidx.navigation.compose.currentBackStackEntryAsState
 import androidx.navigation.compose.rememberNavController
-import colorpickercomposedemo.demo.shared.generated.resources.Res
-import colorpickercomposedemo.demo.shared.generated.resources.app_name
-import colorpickercomposedemo.demo.shared.generated.resources.image_24px
-import colorpickercomposedemo.demo.shared.generated.resources.palette_24px
 import com.github.skydoves.colorpickercomposedemo.screens.HsvColorPickerColoredSelectorScreen
 import com.github.skydoves.colorpickercomposedemo.screens.ImageColorPickerScreen
+import com.github.skydoves.colorpickercomposedemo.shared.Res
+import com.github.skydoves.colorpickercomposedemo.shared.app_name
+import com.github.skydoves.colorpickercomposedemo.shared.image_24px
+import com.github.skydoves.colorpickercomposedemo.shared.palette_24px
 import org.jetbrains.compose.resources.DrawableResource
 import org.jetbrains.compose.resources.painterResource
 import org.jetbrains.compose.resources.stringResource
diff --git a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/PhotoPickerIcon.kt b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/PhotoPickerIcon.kt
index 27afaa1..94d0425 100644
--- a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/PhotoPickerIcon.kt
+++ b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/PhotoPickerIcon.kt
@@ -27,29 +27,29 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.ImageBitmap
 import androidx.compose.ui.unit.dp
-import colorpickercomposedemo.demo.shared.generated.resources.Res
-import colorpickercomposedemo.demo.shared.generated.resources.ic_gallery
-import com.preat.peekaboo.image.picker.SelectionMode
-import com.preat.peekaboo.image.picker.rememberImagePickerLauncher
-import com.preat.peekaboo.image.picker.toImageBitmap
+import com.github.skydoves.colorpickercomposedemo.shared.Res
+import com.github.skydoves.colorpickercomposedemo.shared.ic_gallery
+import io.github.vinceglb.filekit.PlatformFile
+import io.github.vinceglb.filekit.dialogs.FileKitType
+import io.github.vinceglb.filekit.dialogs.compose.rememberFilePickerLauncher
+import io.github.vinceglb.filekit.readBytes
+import kotlinx.coroutines.launch
+import org.jetbrains.compose.resources.decodeToImageBitmap
 import org.jetbrains.compose.resources.vectorResource
 
 @Composable
-fun ColumnScope.PhotoPickerIcon(
-  onImageSelected: (ImageBitmap?) -> Unit,
-) {
+fun ColumnScope.PhotoPickerIcon(onImageSelected: (ImageBitmap?) -> Unit) {
   val scope = rememberCoroutineScope()
 
-  val singleImagePicker = rememberImagePickerLauncher(
-    selectionMode = SelectionMode.Single,
-    scope = scope,
-    onResult = { byteArrays ->
-      byteArrays.firstOrNull()?.let {
-        val imageBitmap = it.toImageBitmap()
-        onImageSelected.invoke(imageBitmap)
-      }
-    },
-  )
+  val singleImagePicker = rememberFilePickerLauncher(
+    type = FileKitType.Image,
+  ) { file: PlatformFile? ->
+    file ?: return@rememberFilePickerLauncher
+    scope.launch {
+      val imageBitmap = file.readBytes().decodeToImageBitmap()
+      onImageSelected.invoke(imageBitmap)
+    }
+  }
 
   Box(
     modifier = Modifier
diff --git a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/HsvColorPickerColoredSelectorScreen.kt b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/HsvColorPickerColoredSelectorScreen.kt
index 8d7e009..3748bf3 100644
--- a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/HsvColorPickerColoredSelectorScreen.kt
+++ b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/HsvColorPickerColoredSelectorScreen.kt
@@ -15,6 +15,7 @@
  */
 package com.github.skydoves.colorpickercomposedemo.screens
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
@@ -63,7 +64,7 @@ fun HsvColorPickerColoredSelectorScreen() {
   var lastSource by remember { mutableStateOf(ColorChangeSource.Programmatic) }
   var isInteracting by remember { mutableStateOf(false) }
 
-  Column {
+  Column(Modifier.background(Color.Black)) {
     Spacer(modifier = Modifier.weight(1f))
 
     Row(modifier = Modifier.weight(3f)) {
@@ -160,7 +161,7 @@ fun HsvColorPickerColoredSelectorScreen() {
     AlphaTile(
       modifier = Modifier
         .size(80.dp)
-        .clip(RoundedCornerShape(6.dp))
+        // .clip(RoundedCornerShape(6.dp))
         .align(Alignment.CenterHorizontally),
       controller = controller,
     )
diff --git a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/ImageColorPickerScreen.kt b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/ImageColorPickerScreen.kt
index 221476b..3e1355d 100644
--- a/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/ImageColorPickerScreen.kt
+++ b/demo/shared/src/commonMain/kotlin/com/github/skydoves/colorpickercomposedemo/screens/ImageColorPickerScreen.kt
@@ -37,8 +37,6 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import colorpickercomposedemo.demo.shared.generated.resources.Res
-import colorpickercomposedemo.demo.shared.generated.resources.palettebar
 import com.github.skydoves.colorpicker.compose.AlphaSlider
 import com.github.skydoves.colorpicker.compose.AlphaTile
 import com.github.skydoves.colorpicker.compose.BrightnessSlider
@@ -46,6 +44,8 @@ import com.github.skydoves.colorpicker.compose.ColorEnvelope
 import com.github.skydoves.colorpicker.compose.ImageColorPicker
 import com.github.skydoves.colorpicker.compose.rememberColorPickerController
 import com.github.skydoves.colorpickercomposedemo.PhotoPickerIcon
+import com.github.skydoves.colorpickercomposedemo.shared.Res
+import com.github.skydoves.colorpickercomposedemo.shared.palettebar
 import org.jetbrains.compose.resources.imageResource
 import org.jetbrains.compose.resources.painterResource
 
diff --git a/demo/shared/src/iosMain/kotlin/MainViewController.kt b/demo/shared/src/iosMain/kotlin/MainViewController.kt
index a240015..ede3402 100644
--- a/demo/shared/src/iosMain/kotlin/MainViewController.kt
+++ b/demo/shared/src/iosMain/kotlin/MainViewController.kt
@@ -16,4 +16,7 @@
 import androidx.compose.ui.window.ComposeUIViewController
 import com.github.skydoves.colorpickercomposedemo.MainScreen
 
+// Entry point consumed by iosApp.xcodeproj (Swift: MainViewControllerKt.MainViewController()),
+// so the PascalCase name is required and not subject to the function-naming convention.
+@Suppress("ktlint:standard:function-naming")
 fun MainViewController() = ComposeUIViewController { MainScreen() }
diff --git a/demo/wasmApp/build.gradle.kts b/demo/wasmApp/build.gradle.kts
new file mode 100644
index 0000000..4c3a1cf
--- /dev/null
+++ b/demo/wasmApp/build.gradle.kts
@@ -0,0 +1,44 @@
+@file:OptIn(ExperimentalWasmDsl::class)
+
+import org.jetbrains.kotlin.gradle.ExperimentalWasmDsl
+import org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackConfig
+
+plugins {
+  alias(libs.plugins.kotlin.multiplatform)
+  alias(libs.plugins.jetbrains.compose)
+  alias(libs.plugins.compose.compiler)
+}
+
+kotlin {
+  wasmJs {
+    outputModuleName = "wasm-demo"
+    browser {
+      commonWebpackConfig {
+        outputFileName = "composeApp.js"
+        devServer = (devServer ?: KotlinWebpackConfig.DevServer()).apply {
+          static(
+            directory = project.projectDir.path
+          )
+        }
+      }
+    }
+    binaries.executable()
+  }
+
+  sourceSets {
+    commonMain.dependencies {
+      implementation(libs.compose.runtime)
+      implementation(libs.compose.foundation)
+      implementation(libs.compose.ui)
+      implementation(libs.compose.material)
+
+      implementation(project(":demo:shared"))
+    }
+  }
+}
+
+tasks.withType<org.jetbrains.kotlin.gradle.tasks.KotlinJvmCompile>().configureEach {
+  compilerOptions {
+    jvmTarget.set(org.jetbrains.kotlin.gradle.dsl.JvmTarget.JVM_17)
+  }
+}
diff --git a/demo/wasmApp/src/wasmJsMain/kotlin/Main.kt b/demo/wasmApp/src/wasmJsMain/kotlin/Main.kt
new file mode 100644
index 0000000..1c3476a
--- /dev/null
+++ b/demo/wasmApp/src/wasmJsMain/kotlin/Main.kt
@@ -0,0 +1,26 @@
+/*
+ * Designed and developed by 2022 skydoves (Jaewoong Eum)
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import androidx.compose.ui.ExperimentalComposeUiApi
+import androidx.compose.ui.window.ComposeViewport
+import com.github.skydoves.colorpickercomposedemo.MainScreen
+import kotlinx.browser.document
+
+@OptIn(ExperimentalComposeUiApi::class)
+fun main() {
+  ComposeViewport(document.body!!) {
+    MainScreen()
+  }
+}
diff --git a/demo/wasmApp/src/wasmJsMain/resources/index.html b/demo/wasmApp/src/wasmJsMain/resources/index.html
new file mode 100644
index 0000000..b574d51
--- /dev/null
+++ b/demo/wasmApp/src/wasmJsMain/resources/index.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>WasmJs Color Picker</title>
+  <link type="text/css" rel="stylesheet" href="style.css">
+  <script type="application/javascript" src="composeApp.js"></script>
+</head>
+<body>
+</body>
+</html>
\ No newline at end of file
diff --git a/demo/wasmApp/src/wasmJsMain/resources/style.css b/demo/wasmApp/src/wasmJsMain/resources/style.css
new file mode 100644
index 0000000..0608973
--- /dev/null
+++ b/demo/wasmApp/src/wasmJsMain/resources/style.css
@@ -0,0 +1,7 @@
+html, body {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  overflow: hidden;
+}
\ No newline at end of file