Are `compose.foundation` and `compose.material` no...

# compose-web

[CLOVIS]

Are compose.foundation and compose.material not available yet for JS? Gradle refuses to build if I put them in commonMain, saying the JS IR variants are missing.

[Big Chungus]

Material is definitely not available, not too sure about foundation either

[Big Chungus]

You can checkout this module I'm crafting internally if you want material feel on the web https://github.com/mpetuska/kamp/tree/feature/compose/app/client/kmdc

[CLOVIS]

That looks amazing! Do you have an example of sharing Compose code between desktop and web? JetBrains doesn't have any examples that do that (or I'm blind...)

[CLOVIS]

Also I've seen that the examples use a “multiplatform” module and then add a module per platform as well, is this recommended? If so, why?

[Big Chungus]

That module shares compose-redux middleware between desktop and web in commonMain

[Big Chungus]

Well its parent module "client"

[Big Chungus]

Module per platform is only really needed if you target ios or Android as those are special snowflakes

[Big Chungus]

For jvm and js I find single mpp module with multiple sourceSets more natural to work with

[CLOVIS]

I didn't find compose-redux in that repo, is it somewhere else?

[CLOVIS]

Currently my build.gradle.kts looks like (only copying the source sets, for brievety):

val commonMain by getting {
   dependencies {
      api(project(":core")) // other module with my business model

      api(compose.runtime)
   }
}

val jvmMain by getting {
   dependencies {
      api(compose.desktop.currentOs)

      api(compose.foundation)
      api(compose.material)

      implementation(compose.preview)
   }
}

val jsMain by getting {
   dependencies {
      api(compose.web.core)
   }
}

This works fine, however since commonMain depends only on compose.runtime I can use @Composable in common code, but not Text or any other standard UI composables.

[CLOVIS]

Or maybe there's no desktop-web multiplatform yet and I have to define all my components as expect?

[CLOVIS]

What I was missing is compose.web.widgets.

[Scott Kruse]

Did you get anywhere with this? I'm getting an error trying to reference a common compose module that leverages compose.foundation

[Scott Kruse]

Could not determine the dependencies of task ':web:jsPackageJson'.
> Could not resolve all dependencies for configuration ':web:jsNpm'.
   > Could not resolve org.jetbrains.compose.foundation:foundation:1.0.0-alpha3.
     Required by:
         project :web > project :common
      >

[Big Chungus]

Is your js sourceSet using ir backend? Compose doesn't work with legacy

[Scott Kruse]

was looking at this doc: https://github.com/JetBrains/compose-jb/tree/master/tutorials/Web/Getting_Started

js(IR) {
        browser()
        binaries.executable()
    }

[CLOVIS]

My conclusion yesterday was that Foundation and Material are not available for JS, but I could be wrong.

[CLOVIS]

They are available for both Android and Desktop, however.

[Big Chungus]

Android and desktop uses skia to draw on canvas, so naturally a lot more is shared. Web focuses on dom tree rendering instead

[CLOVIS]

Skiko just merged web canvas rendering, so that might change.

[Big Chungus]

Even so, the preferred option will remain dom rendering simply due to size and accessibility concerns

[Scott Kruse]

This makes sense, does this mean most likely there will be significant limitations to what can be shared between common / platform compose modules? E.g colors / theming.

[Scott Kruse]

They are available for both Android and Desktop, however.

Yeah I was able to reuse common module button composables on desktop, pretty awesome

[Big Chungus]

I assume you'll be given an option. Reuse skiko widgets and sacrifice bundle size an accessability or don't reuse ui composables and use dom composables to get propper hrml layout