Is there a way in Compose Web to render a component from a Kotlin/JS library? For instance I'd like ...

# compose-web

[Joffrey]

Is there a way in Compose Web to render a component from a Kotlin/JS library? For instance I'd like to render some React chart component, can I use some built-in composable component that can embed a piece of DOM and render it in the canvas?

[Oleksandr Karpovich [JB]]

Currently there’s no built-in component for this.
I think this can be achieved by setting an absolute position to html subtree managed by React.

[Joffrey]

I think this can be achieved by setting an absolute position to html subtree managed by React.

Do you mean having the React HTML rendered on top of the Compose canvas (out of the component tree), and then create a gap in the canvas, and align the react HTML on top of the gap?

[Oleksandr Karpovich [JB]]

yes, that’s how I think we’ll eventually implement a component for embedding html into canvas

[Joffrey]

But if it's out of the component tree, it will be super hard to make it cohabit with the Compose components 🤔 It will no longer be part of the layout flow, it will mess up with scrolling, clipping, etc, right?

[Joffrey]

I also don't see how that can work with the stacking/z-index of components. Like how can one part of a Compose component be hidden by the HTML one, but at the same time another Compose component be drawn on top of the HTML one?

[Oleksandr Karpovich [JB]]

right. Ideally it should be somehow controlled by Compose - implemented as a built-in feature.
So in you case, it would likely be far from perfect in certain cases like scroll, etc

[Oleksandr Karpovich [JB]]

but at the same time another Compose component be drawn on top of the HTML one

I think it’s not likely we’ll implement this at all.

we won’t be able to draw on top of html embedded into canvas.

So there can be 2 layers:

-----html absolute x,y--
------------- canvas where compose renders to ---------------


_
Theoretically:

-canvas2--
-----html. ---- ---
------canvas1-----------
But it would require a lot of changes in compose. Not sure if it’s needed

[Joffrey]

Since chrome uses Skia for rendering, I wonder how much of Chrome would be duplicated if we actually rendered the HTML as part of the canvas (a sort of webview if I may say)

[Oleksandr Karpovich [JB]]

good question 🙂
ideally we wouldn’t need to build heavy skiko.wasm and just reuse skia from Chrome and potentially other html-rendering APIs if they existed.
But we still target firefox, safari, etc..

[Joffrey]

But we still target firefox, safari, etc..

Ah, right, we can't forget this part 😄