Add wasm target and migrate demo on it

terrakok · Jan 12, 2024 · 193a689 · 193a689
1 parent 73f139f
commit 193a689
Show file tree

Hide file tree

Showing 8 changed files with 50 additions and 5 deletions.
diff --git a/.github/workflows/deploy.yaml b/.github/workflows/deploy.yaml
@@ -29,10 +29,10 @@ jobs:
 
       - name: Build
         run: |
-          ./gradlew jsBrowserProductionWebpack
+          ./gradlew wasmJsBrowserProductionWebpack --no-configuration-cache
 
       - name: Deploy
         uses: JamesIves/[email protected]
         with:
           branch: gh-pages
-          folder: composeApp/build/dist/js/productionExecutable
+          folder: composeApp/build/dist/wasmJs/productionExecutable
diff --git a/composeApp/build.gradle.kts b/composeApp/build.gradle.kts
@@ -22,6 +22,11 @@ kotlin {
         binaries.executable()
     }
 
+    wasmJs {
+        browser()
+        binaries.executable()
+    }
+
     listOf(
         iosX64(),
         iosArm64(),

diff --git a/composeApp/src/wasmJsMain/kotlin/com/github/terrakok/App.wasmJs.kt b/composeApp/src/wasmJsMain/kotlin/com/github/terrakok/App.wasmJs.kt
@@ -0,0 +1,7 @@
+package com.github.terrakok
+
+import kotlinx.browser.window
+
+internal actual fun openUrl(url: String?) {
+    url?.let { window.open(it) }
+}
diff --git a/composeApp/src/wasmJsMain/kotlin/com/github/terrakok/main.kt b/composeApp/src/wasmJsMain/kotlin/com/github/terrakok/main.kt
@@ -0,0 +1,11 @@
+package com.github.terrakok
+
+import androidx.compose.ui.ExperimentalComposeUiApi
+import androidx.compose.ui.window.CanvasBasedWindow
+
+@OptIn(ExperimentalComposeUiApi::class)
+fun main() {
+    CanvasBasedWindow("Material 3 gallery") {
+        App()
+    }
+}
diff --git a/composeApp/src/wasmJsMain/kotlin/com/github/terrakok/theme/Theme.wasmJs.kt b/composeApp/src/wasmJsMain/kotlin/com/github/terrakok/theme/Theme.wasmJs.kt
@@ -0,0 +1,7 @@
+package com.github.terrakok.theme
+
+import androidx.compose.runtime.Composable
+
+@Composable
+internal actual fun SystemAppearance(isDark: Boolean) {
+}
diff --git a/composeApp/src/wasmJsMain/resources/index.html b/composeApp/src/wasmJsMain/resources/index.html
@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Material 3 gallery</title>
+    <script src="skiko.js"></script>
+</head>
+<body>
+<div>
+    <canvas id="ComposeTarget" width="800" height="600"></canvas>
+</div>
+<script src="composeApp.js"></script>
+</body>
+</html>
diff --git a/gradle.properties b/gradle.properties
@@ -11,6 +11,7 @@ kotlin.js.compiler=ir
 #Compose
 org.jetbrains.compose.experimental.uikit.enabled=true
 org.jetbrains.compose.experimental.jscanvas.enabled=true
+org.jetbrains.compose.experimental.wasm.enabled=true
 
 #Android
 android.useAndroidX=true

diff --git a/gradle/libs.versions.toml b/gradle/libs.versions.toml
@@ -1,12 +1,12 @@
 [versions]
 
 kotlin = "1.9.21"
-agp = "8.2.0"
-compose = "1.6.0-dev1347"
+agp = "8.2.1"
+compose = "1.6.0-dev1362"
 androidx-appcompat = "1.6.1"
 androidx-activityCompose = "1.8.2"
 compose-uitooling = "1.5.4"
-materialKolor = "1.2.9"
+materialKolor = "1.4.0-alpha01"
 
 [libraries]