PlutoHTMLElement and PlutoHTMLElementList

[dralletje]

What

This replaces PlutoRunner.DivElement with two new primitives: PlutoHTMLElement and PlutoHTMLElementList.

Why

The problem with DivElement are

1. It's always a div
2. There is no way to have keyed children

How

I try to fix that by

1. Making PlutoHTMLElement very generic. It basically takes all the same arguments as a Preact.createElement call and passes these on directly. It does some special handling for children, more on that later.
2. Making PlutoHTMLElementList. PlutoHTMLElementList takes a Dict{String,Any} (!!) where every key is the key prop the child will get on the Preact side. This allows for creating changing lists that preserve identity.

It does contain a polyfill for DivElement based on PlutoHTMLElement, so it doesn't break current PlutoUI.Experimental.Layout uses.

Todo

• [ ] Make sure elements refresh when cell is explicitly re-run (currently some inputs keep their value)
• [ ] Experiment and design the way the identities get preserved (I don't really get yet what parts we want and can make reactive)
• [ ] What to do about children!!! As I mentioned before, we apply special handling to the children prop, which we wrap in Pluto-show-thingies. One problem is, (p)react components often use different props for renderable stuff (title, body, icon). Is there a way we can figure out what props we should wrap in Pluto-show-thingies?

[github-actions[bot]]

Try this Pull Request!

Open Julia and type:

julia> import Pkg
julia> Pkg.activate(temp=true)
julia> Pkg.add(url="https://github.com/fonsp/Pluto.jl", rev="PlutoHTMLElement-and-PlutoHTMLElementList")
julia> using Pluto

[fonsp]

@dralletje Can you make a TODO list?

[dralletje]

From @fonsp during a call: Why are there two primitives rather than one. This is a good question, I'll ponder it a bit. I still think we need two primitives, but they might be different ones.

[fonsp]

Can you make the changes to the preact import on main instead?