What is the idiomatic way of creating instance of external interface in Kotlin JS

Question

Example: In @material-ui/core/createMuiTheme.d.ts there are a few interfaces defined, e.g. ThemeOptions and Theme It's possible to generate koltin bindings using ts2kt and it allows using createMuiTheme function to create Theme from ThemeOptions, but what is a correct [aka type safe] way of instantiating ThemeOptions which is an external interface and it doesn't have a constructor.

I created a data class that implements the interface and instantiate it. Sometimes I need to use the instance as dynamic as it allows 3rd party js code to modify it.

Is this approach any good assuming I don't want to lose type safety and use JsObject/json()/js()?

score 1 · Answer 1 · answered Dec 12 '18 at 09:04

1

The described way (implementing an interface by a data class) is good as well as any other way to implement an interface: by usual class, object expression and so on.

answered Dec 12 '18 at 09:04

bashor

8,073
4
34
33

1

`jsObject` function is a way to go here actually unless you need extra functionality from a class that implements the interface – Sam Dec 13 '18 at 10:41
what is `jsObject`? – bashor Dec 14 '18 at 13:23
sort of type safe builder for js objects: https://github.com/JetBrains/kotlin-wrappers/blob/master/kotlin-extensions/src/main/kotlin/kotlinext/js/Helpers.kt#L3-L8 – Sam Dec 15 '18 at 10:08

score 1 · Answer 2 · answered Aug 25 '22 at 13:20

You can use jso<ExternalInterface> {}.

Here's an example from the Kotlin wrappers: https://github.com/karakum-team/kotlin-mui-showcase/blob/main/src/main/kotlin/team/karakum/components/showcases/TextFields.kt

TextField {
  asDynamic().InputProps = jso<InputBaseProps> {
    startAdornment = InputAdornment.create {
      position = InputAdornmentPosition.start
      +"kg"
    }
  }
}

What is the idiomatic way of creating instance of external interface in Kotlin JS

2 Answers2