How to add SVG in compose and change its color by CSS color or fill param?

Does anyone know how to write in groovy the equivalent of

rootProject.plugins.withType(org.jetbrains.kotlin.gradle.targets.js.nodejs.NodeJsRootPlugin::class.java) {
    rootProject.the<org.jetbrains.kotlin.gradle.targets.js.nodejs.NodeJsRootExtension>().nodeVersion = "..."
}

Is there a place to report problems generating externals for npm dependencies for specific libraries? Kotlin/dukat might be it, but it doesn’t look very active.

I have a multiplatform project that compiles successfully. But when I try to run the Compose/Web subproject using

jsBrowserDevelopmentRun

, I get the following "internal compiler error", without any context about the cause of the problem. Do you have any idea how can I find the root of the problem? Besides,

jsBrowserProductionRun

seems to work OK (but it is too slow to be usable instead of

jsBrowserDevelopmentRun

).

java.lang.AssertionError: Assertion failed
	at org.jetbrains.kotlin.ir.backend.js.transformers.irToJs.JsAstUtilsKt.translateCallArguments(jsAstUtils.kt:343)
	at org.jetbrains.kotlin.ir.backend.js.transformers.irToJs.JsAstUtilsKt.translateCall(jsAstUtils.kt:111)
	at org.jetbrains.kotlin.ir.backend.js.transformers.irToJs.IrElementToJsStatementTransformer.visitCall(IrElementToJsStatementTransformer.kt:140)

Maybe this is a dumb question, but what's the easiest way to get the equivalent of Kotlin/JVM's

readLine()

in Kotlin/JS (nodejs target)?

Hello, I'm trying to create this class in kotlin/js

.left-slide {
  height: 100%;
  width: 35%;
  position: absolute;
  top: 0;
  left: 0;
  transition: transform .5s ease-in-out;
}

So far I have

styledDiv {
                    css {
                        height = LinearDimension("100%")
                        width = LinearDimension("35%")
                        position = Position.absolute
                        top = LinearDimension("0")
                        left = LinearDimension("0")
                        transition = ???

                    }
...}

and I don't know how to create this transition. Is someone able to help me ? Thank you in advance

I'm using Kotlin/JS with IR compiler:

kotlin {
     js(IR) { ... }
 }

and when I try to add ksp:

plugins {
     ...
     kotlin("js") version "1.6.10"
     id("com.google.devtools.ksp") version "1.6.10-1.0.2"
 }

it gives me this error:

You already registered Kotlin/JS target with another compiler: legacy

Googling indicates that ksp does support IR, I think? What am I doing wrong?

How are you supposed to do a date in Kotlin JS? I found a great way to do it in regular Kotlin but I don't appear to have access to that and every method in the kotlin.js seems to be depricated.

After upgrading to Kotlin

1.6.10

Should we commit this file

kotlin-js-store/yarn.lock

or

gitignore

it? Based on Github search, I see repos where they add it and some others where they do not keep it And there is this comment on this channel where @Oliver.O says that the

intention is to track it on version control

Can someone please clarify on this?

after updating our codebase to use kotlin 1.6.10 dependencies the compilter seems to run into this error with IR:

e: Could not find "org.jetbrains.kotlinx:kotlinx-serialization-json" in [C:\Users\nikky\AppData\Local\kotlin\daemon]

has anyone seen this before ? more in :thread-please:

Is anyone consuming Kotlin coroutines or Flows as callbacks from a real JS or TS (not Kotlin/JS) codebase? Any tips, hints, code snippets, etc? Trying to understand: • what scopes to use (is GlobalScope actually ok?!) • how folks are handling cancellations, • what a TS-friendly interface looks like that supports

@JsExport

, and • if there's any automated way to convert coroutines/flows to callbacks

Hi I am trying to call a JS function from a dependency in Kotlin. The function

toASCII

here, my dependency definition looks like this

jsMain {
      dependencies {
        api(npm("punycode", "2.1.1"))
        api(npm("urlencode", "1.1.0"))
        api(npm("buffer", "6.0.3"))
        api(npm("string_decoder", "1.3.0"))
      }
    }

and the file punycode.kt looks like this:

@JsModule("punycode")
@JsNonModule
@JsName("toASCII")
public external val toASCII: (domain: String) -> String

But it fails with:

Uncaught TypeError: toASCII is not a function
  at /var/folders/qq/0zkljkj12jb9m0jnwftykyd00000gn/T/_karma_webpack_216427/commons.js:100744:17
  TypeError: toASCII is not a function
      at UriCompatibility.encodeDNSHost_6wfw3l_k$ (/var/folders/qq/0zkljkj12jb9m0jnwftykyd00000gn/T/_karma_webpack_216427/commons.js:100744:17)
      at _no_name_provided__274.invoke_6wfw3l_k$ (/var/folders/qq/0zkljkj12jb9m0jnwftykyd00000gn/T/_karma_webpack_216427/commons.js:97821:46)

Can we create a mapping of private members of TS/JS file in kotlin adaper file ?

Hello. folks Can I get some opinion on

Kvision

and

kotlin react

for building JS target in a multiplatform project ? I am looking for Stability here as well which could work in multiplatform environment ?

i'm seeing some weird behavior with the js compiler. i'm wondering if i'm doing something wrong, or if it's an issue with the compiler. the behavior is the same with both IR and legacy compilers. code snippets in thread.

Hi, can anyone here help me figure out how to create an instance of a js

web3.eth.Contract

? Forgive me if this is a stupid question, as I am not the most familiar with js. I am more used to standard kotlin/OOP. I've figured out that an instance of

web3.eth.Contract

must be created where

web3

must be an actual instance of a

Web3

class (created

new Web3(...)

) So I cannot simply create a contract instance by calling

new Web3.eth.Contract(...)

For example

js("""new (new Web3(window.ethereum)).eth.Contract(JSON.parse('...'), '...' )""")

will create a valid instance of a

Contract

But, when I attempt to create an instance of a kotlin defined contract:

@JsModule("web3-eth-contract")
@JsNonModule
open external class Contract constructor(jsonInterface: Array<AbiItem>, address: String, options: ContractOptions)

by calling

val contract = Contract (jsonInterface = abis as Array<AbiItem>, address = adr)

An instance of

Contract

IS created successfully, however it is worthless because the created contract seems to rely on a parent instance of

Web3

, (like in the first example I mentioned). How can I create a Contract class in kotlin, that is instantiated in the same way as

js("""new (new Web3(window.ethereum)).eth.Contract(JSON.parse('...'), '...' )""")

?

in JavaScript string templates, there's a mechanism where if you pass the string template to a function without brackets, the string template is split into pieces

function blah(...args) { console.log(args) }

running this:

blah`testing-${1}-${2}-${3}`

I get a list of parts (separators between ${}), pre/post-fix and values

0: (4) ['testing-', '-', '-', '', raw: Array(4)]
1: 1
2: 2
3: 3
length: 4

Is there anything planned for Kotlin that would allows taking a String template and splitting it up like that at compile time? (similar to how to trimIndent() is processed at compile time, a compile time mechanism that can decompose a String template into its static and dynamic parts)

val blah = """  
    testing-${1}-$var2-${var3 + 1}
""".trimIndent()

blah.decompose() // outputting the static parts, listOf("testing", "-", "-", "") and the dynamic parts, listOf(1, var2, { var3 + 1}())

Just wondering how else one would replicate what lit-html, lit-element, uhtml and many of these JS frameworks are doing in pure JavaScript

I’m on a mission to reduce the size of the bundle in my KMM project. I tried

-Xir-property-lazy-initialization

which doesn’t really do anything (actually increases our size). When paired with

-Xir-per-module

it reduces the size by 75%! However, this is only because it’s missing some imports. We use 3 libraries: • Kotlinx serialization • Kotlinx immutable collections • Kotlin stdlib I see 5 JS files as expected (two for serialization) in the build directory but the module JS file only contains this:

}(module.exports, require('./kotlin-kotlin-stdlib-js-ir.js'), require('./kotlinx-serialization-kotlinx-serialization-core-js-ir.js')));

So the bundle fails because one of the kotlinx serialization (the JSON part) and the kotlinx immutable is missing from the final, webpacked, JS file. Is this a bug or did I miss something?

Is there a set of wrappers for nodejs official modules like

net

? Or do I need to write my own to use those things?

I am trying to release a javascript library from our Multiplatform code base that will be targeting react native, my question is, which js target is closer to react native??

Js(IR) { browser() }
// or
Js(IR) { nodejs() }

Has anyone figured how to declare kotlin externals for TS constructor reference type? Given TS

class TSClassOne {
  constructor(someProp: string) {
    ...
  }
}

class TSClassTwo {
  TSClassOne: new (someProp: string) => TSClassOne
}

How to declare it in K/JS?

external class TSClassOne(someProp: String)

external class TSClassTwo {
  var TSClassOne: dynamic // actual: `new (someProp: string) => TSClassOne`, how do I tell kotlin that? `(String) -> TSClassOne` does not work as it's not invoking `new` call
}

Hello everyone, any idea about generating QR codes using Kotlin/JS?

I just found out that there is a wrapper for TypeScript that is out on kotlin-wrapperes, if anyone needs it ! https://github.com/JetBrains/kotlin-wrappers/tree/master/kotlin-typescript

I'm new to Kotlin/JS. I'm trying to import a TypeScript dependency. I added

generateExternals=true

to the gradle dependency and I get an error "Unresolved reference: JSX". Looking at the TypeScript definition, JSX is used but not imported. Is there a way to work around this?

Hi, what should be the type of an optional property of an external interface ?

I've been hit by this during jsTests:

Error: Timeout of 2000ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Promise, ensure it resolves.

But my test needs to run longuer than 2000ms. Is there anything I can do to increase that timeout?

One more for the day. Youtrack: https://youtrack.jetbrains.com/issue/KT-45727 Prelude Normally we'd like to have interfaces or abstract classes as our public API, and have underlying implementations private/internal to the module. Problem With kotlin multiplatform and kotlin js, this is still a huge challenge because despite using 

@JsExport

, properties of interfaces/abstract classes, are still mangled. It should be known that methods are not mangled at all Reproducer Reproducer can be found at ManglingImplementationTest

At the moment,

sealed class WatchMode {
    companion object {
        val DEFAULT: WatchMode = CASUALLY
    }
}

object EAGERLY : WatchMode()

object CASUALLY : WatchMode()

Generates the following type definitions

class WatchMode {
    private constructor();
    readonly Companion: {
        readonly DEFAULT: live.WatchMode;
    };
}
const EAGERLY: {
} & live.WatchMode;
const CASUALLY: {
} & live.WatchMode;

This makes it impossible to get the value of

WatchMode.DEFAULT

from js/typescript impossible, because one would need to create an instance of

WatchMode

(whose constructor is private) and then get the

DEFAULT

property from

Companion

. Why is it a property, can't it be defined on

WatchMode

instead of it's

prototype

? N;B. When the hierarchy is defined as show bellow

sealed class WatchMode {
    companion object {
        val DEFAULT: WatchMode = CASUALLY
    }

    object EAGERLY : WatchMode()

    object CASUALLY : WatchMode()
}

The generated types are still unsable from js/typescript code. Funny thing is, classes work like a

class WatchMode {
    private constructor();
    readonly Companion: {
        readonly DEFAULT: live.WatchMode;
    };
    readonly EAGERLY: {
    } & live.WatchMode;
    readonly CASUALLY: {
    } & live.WatchMode;
}

Is there a known workaround for this? or a reported ticket somehow?

This is ridiculous, but I simply cannot figure out how to get a String from a specified codepoint in Kotlin/JS. I have many codepoints, and I need to make them into a String. And I can't find a way to do it in Kotlin/JS...in fact, all (two) constructors for

String

are deprecated in Kotlin/JS!