I accidentally deleted the question from earlier, ...

# compose-web

[Stefano Milani]

I accidentally deleted the question from earlier, now I'm asking it again, sorry... Is there a way to import material3 in compose web to take the advantage of using AutoSizeText?

[Alex Styl]

what is AutoSizeText?

[Alex Styl]

tldr: you can import material3 by adding the material 3 dependency to your project. not sure what AutoSizeText is tho

[Stefano Milani]

AutoSizeText :https://medium.com/@gladiatorkilo/autosize-text-implementation-in-jetpack-compose-6b1c803eb7be and I know that I can import material3 but doing this is not recognized the AutoSizeText method

[Chrimaeon]

It’s not part of Material 3 - the article author created it. Check the GitHub Gist at the end of the article.

[Stan van der Bend]

I use it in web so yes, just add the dependency on material 3

[Stefano Milani]

Thank you Stan, can you please attach the libs.versions.toml and the implementation in the

commonMain.dependencies

that you use for material3?

[Stan van der Bend]

@Stefano Milani it comes with the jetbrains.compose gradle plugin, which you should already have enabled in ur build.gradle, u can then simply include material3 as:

implementation(compose.material3)

The version of your jetbrains compose plugin should not matter (https://plugins.gradle.org/plugin/org.jetbrains.compose)

Let me know if that helps 😄, otherwise please share your build.gradle.kts and libs.version.toml and I can probably help you out more

[Stefano Milani]

@Stan van der Bend Hi, here my settings:

sourceSets {
    
    commonMain.dependencies {
        implementation(compose.runtime)
        implementation(compose.foundation)
        implementation(compose.material)
        implementation(compose.ui)
        implementation(compose.components.resources)
        implementation(compose.components.uiToolingPreview)
        implementation(libs.androidx.lifecycle.viewmodel)
        implementation(libs.androidx.lifecycle.runtime.compose)
    }
}

and for toml:

[versions]
androidx-lifecycle = "2.8.4"
compose-multiplatform = "1.7.3"
junit = "4.13.2"
kotlin = "2.1.0"

[libraries]
kotlin-test = { module = "org.jetbrains.kotlin:kotlin-test", version.ref = "kotlin" }
kotlin-test-junit = { module = "org.jetbrains.kotlin:kotlin-test-junit", version.ref = "kotlin" }
junit = { group = "junit", name = "junit", version.ref = "junit" }
androidx-lifecycle-viewmodel = { group = "org.jetbrains.androidx.lifecycle", name = "lifecycle-viewmodel", version.ref = "androidx-lifecycle" }
androidx-lifecycle-runtime-compose = { group = "org.jetbrains.androidx.lifecycle", name = "lifecycle-runtime-compose", version.ref = "androidx-lifecycle" }

[plugins]
composeMultiplatform = { id = "org.jetbrains.compose", version.ref = "compose-multiplatform" }
composeCompiler = { id = "org.jetbrains.kotlin.plugin.compose", version.ref = "kotlin" }
kotlinMultiplatform = { id = "org.jetbrains.kotlin.multiplatform", version.ref = "kotlin" }

... so just add implementation(compose.material3) in the commonMain.dependencies of sourceSet?

[Stan van der Bend]

Yea @Stefano Milani u should be able to just add implementation(compose.material3) (notice the 3 at the end) below implementation(compose.material) with no additional configuration needed.

[Stefano Milani]

@Stan van der Bend ok thanks but I've already tried this and I have no access to anything about the new feature of material3, like windowSizeClass and AutoSizeText...

[Stan van der Bend]

Oh @Stefano Milani sorry I thought you meant this project: https://klibs.io/project/dshatz/autosizetext-mpp-compose when you referred to AutoSizeText, I was not aware this is part of the material 3 toolkit for android. Some features may not yet be ported to the multiplatform version.
Do make sure you change your import statements to material3 instead of material.

For your adaptive layouts that seems to be part of a different module which was recently commonized, can include it in gradle like this:

implementation(compose.material3AdaptiveNavigationSuite)

[Stan van der Bend]

You might have to add the dev repo though, not sure if it's on maven central yet (in settings.gradle.kts)

maven("<https://maven.pkg.jetbrains.space/public/p/compose/dev/>")

[Chrimaeon]

AutoSizeText is not part of the material 3 compose library.

[Chrimaeon]

there is a demo on who to have the functionality on a BasicText https://cs.android.com/androidx/platform/frameworks/support/+/androidx-main:compose/[…]pose/foundation/demos/text/ComposeText.kt?q=func:AutoSizeText

[Stan van der Bend]

Oh what u were looking for specifically seems to be in another module not shipped with the plugin:

implementation("org.jetbrains.compose.material3.adaptive:adaptive:1.1.0-alpha01")

@Stefano Milani

[Stefano Milani]

At the moment I haven't found a way to use AutoSizeText and I can't use material3, I implement it in the dependencies but I don't understand if I have to add something to the toml file too, it's a bit confusing at the moment. I can't use Basictext because I need the letterSpacing of Text so I'm waiting for news, thanks.