Dynamic elements based on behavior in three pennies

Question

Simply put, I'm looking for a way to display Behaviour (UI Element) .

In my actual use case, a table is displayed that can be filtered. Therefore, I have a function tableElement :: String -> UI Element ( String parameter is a filter condition) and an input field filterElement :: Element that represents the filter. The most natural way to combine them is something like this:

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

This is also the way this is done in Elm.

The closest I've found so far is to use sink children , but this only works with [Element] , not [UI Element] . In addition, I have to use the dummy element as a parent or violin with the remaining children.

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

Answer 1

(Author here)

Note that the UI Element represents an action that, when executed, can create a new Element . You will need to perform an action to complete the latter. Unfortunately, there is currently no way to do this completely in FRP style, you have to resort to the onChanges combinator to recreate the table every time you change the filter. There you can use set children .

Example:

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

Bartab.hs and CRUD.hs examples may be relevant to your situation.

Answer 2

You can use currentValue to get the UI Element from where you (hopefully) come from in the UI , and you can get the element to include in the HTML.