Using Compose for HTML, is there a way to embed HTML from a string?

# compose-web

[martmists]

Using Compose for HTML, is there a way to embed HTML from a string?

[Big Chungus]

You could access native dom element and use innerHtml prop via attrs.ref block

[David Herman]

Here's a code example getting the native dom element: https://github.com/JetBrains/compose-multiplatform/blob/a2cd678c82e711bcaca302a01c93f3912cc06d54/tutorials/HTML/Using_Effects/README.md?plain=1#L16

[martmists]

Unfortunately ref doesn't look like it'd work:

The lambda that ref takes in is not Composable. It will be called only once when an element added into a composition. Likewise, the lambda passed in onDispose will be called only once when an element leaves the composition.

This means if the content is produced by a produceState, it will never be set to the new content when produceState updates.

[Big Chungus]

There's also SideEffect.nativeElement

[martmists]

Hmm, I only see

fun SideEffect(
    effect: () -> Unit
) {
    currentComposer.recordSideEffect(effect)
}

with no nativeElement specified anywhere. Where should I look?

[Big Chungus]

Maybe it's in DisposableEffect afterall

[Big Chungus]

It's defined as an extension prop on receiver

[martmists]

Hmm, it doesn't seem to be present in the HTML libraries at least

[Big Chungus]

DisposableSideEffect then?

[Big Chungus]

Ah, it's scopeElement afterall! https://github.com/JetBrains/compose-multiplatform/blob/336ba2c7a1ed9c8bff484dd32730ff9b4b2785f4/html/core/src/jsMain/kotlin/org/jetbrains/compose/web/elements/ElementScope.kt#L124C46-L124C46

[Big Chungus]

My bad