Dynamic Elements based on Behaviour in threepenny-gui

Question

To put it simple, I am looking for a way to display a Behaviour (UI Element).

My actual use-case is displaying a table, which can be filtered. So I have a function tableElement :: String -> UI Element (the String parameter being the filter condition) and an input field filterElement :: Element, which represents the filter. The most natural way for me to combine these would be something like this:

bFilter <- stepper "" (valueChange filterElement)
displaySomehow (fmap tableElement bFilter)

This is also the way it is done in Elm.

The closest thing I have found so far is using sink children, but that works only with [Element] and not with [UI Element]. Additionally I have to use a dummy element as parent or fiddle around with the remaining children.

What would be the best way to to implement something like this with threepenny-gui?

Answer 1

(Author here)

Note that UI Element represents an action that, when executed, may create a new Element. You will have to execute the action to do the latter. Unfortunately, there is currently no way to do that completely within the FRP style, you will have to resort to the onChanges combinator to create the table anew whenever the filter changes. There, you can use set children.

Example:

onChanges bFilter $ \s -> do
    el <- tableElement s
    myTable # sink children [el]

The Bartab.hs and CRUD.hs examples may be relevant for your situation.