On Thursday, October 13, 2016 at 12:23:30 PM UTC+1, Rupert Smith wrote: > > Which is ok, but what I really want is for the listbox user to be able to > display more than just a string in the listbox, along these lines: > > root : Model -> Html Msg > root model = > listbox [ attrForSelect "value", onSelectedChanged SelectChanged ] > [ listItem [ value "1" ] [ text "one" ], > listItem [ value "2" ] [ text "two" ], > ... > ] >
I have been having a little experiment with adding events into the UI component. On the consumer side I did this: listbox [ items model.roleLookup, onSelectedChanged SelectChanged ] [ Button.render Mdl [ 0 ] model.mdl [ Button.onClick SomeAction ] [ text "test" ] ] ] When I click the button, the event is received by the consumer application. On the component side, I did this: woodItem styleAttrs [ text value , (Button.render Mdl [ 5 ] model.mdl [ Button.onClick (Select "test") ] [ text "test" ] ) ] Clicking this button triggers the Select "test" event on the consumer Elm program. So now I have a UI element owned by the consuming application, showing a list of items rendered by the component application. Within it there is a button which triggers an event on the consumer, and buttons which trigger events on the component! If I would like the consumer of a component to be able to custom render within the component, allowing the consumer to build whatever <content> it wants inside the component would be convenient. However, I could still have the component render custom content, by simply creating a little DSL for building HTML, and passing this down as part of the component config, and having the component render it. So between those two options, I think I can do components that are very customizeable from the consumer of the components perspective. But I have to chose which side it would be more useful to let the consumer define events on? For example, if the component were a data table, and there was a column with 'action' button in it, for example, to take you to a screen to edit an item from the table, it makes sense for the consumer to be able to hook into the event. If the component were the video example, with the consumer defining a custom control bar, it would be useful for the DSL to allow the consumer to say that a button hooks up to the components 'pause' action. Be nice if I could do both, but I can't see a way to doing that yet. Also, for the pause action, I could set a property instead of directly triggering an event within the component. Then the consumer could hook up to the pause button and set property playState = "paused" on the component, which will in turn get picked up by the component. On that basis, I guess it is more useful to allow the consumer of a component to render customer <content> within it using the Html library and Html.Events. -- You received this message because you are subscribed to the Google Groups "Elm Discuss" group. To unsubscribe from this group and stop receiving emails from it, send an email to elm-discuss+unsubscr...@googlegroups.com. For more options, visit https://groups.google.com/d/optout.