New dropdowns (working keyboard events, multi-select), checkboxes, radio groups, and examples

[tomsmalley]

This is more of a request for comment, the goal is to replace the old functions entirely, but that would be a breaking change so it is up to the maintainers what the next move should be.

I've added some new dropdown functions which work fully, example at https://tomsmalley.github.io/reflex-dom-semui/. So far only static valued dropdowns are done. The old functions are quite broken: they only take into account click events, so using the keyboard can cause the state to be out of sync with the semantic-ui state. This is fixed by providing initialisation with a callback function so semantic notifies us when the value is changed - the value is set to the index of the item vector. Multi dropdowns are also included. The collection of items is now a Vector of tuples instead of a Map, this is for better user customisable ordering as well as easier indexing capability.

The ghc implementations have not been tested.

I ended up adding a dependency on lens and vector but hopefully that is okay.

I included the themes directory of semantic-ui since icons weren't working. Also the semantic library has been updated, not sure if this breaks old code.

I also suggest enabling github pages in the docs/ folder so users can see functionality more easily. I'm not sure how to build a better build system than the bash script I left in. Ideally cabal build example would do all of the work, I'm not particularly familiar with cabal though having relied on stack in the past.

[tomsmalley]

I've added more configurable options along with examples.

[tomsmalley]

Another thing to note is that these implementations do not put a name for the input element, meaning native submissions won't work. We could provide wrappers which encode the result type using aeson and put it in a hidden element. I imagine that native form submissions aren't used much though since reflex is probably used for SPAs.

[mightybyte]

Thanks! Keep up the good work!

[tomsmalley]

Could you enable github-pages for the /docs folder? Then we can add a link in the description or readme to live examples at https://reflex-frp.github.io/reflex-dom-semui.

[ryantrinkle]

We've also got docs.reflex-frp.org; is there a good way to integrate it there?

On Mon, May 22, 2017 at 10:35 AM, Tom Smalley notifications@github.com wrote:

Could you enable github-pages for the /docs folder? Then we can add a link in the description or readme to live examples at https://reflex-frp.github.io/reflex-dom-semui.

— You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub https://github.com/reflex-frp/reflex-dom-semui/pull/12#issuecomment-303118437, or mute the thread https://github.com/notifications/unsubscribe-auth/ABGlYPQJPu3K_vsrrGQwOsQ2JPpoDp2xks5r8Z0igaJpZM4Ndv4- .

[tomsmalley]

I don't know of a good way of doing that since the examples aren't in a similar format - they're not really documentation, just elements generated by reflex-dom-semui to test functionality. I had intended users to read the source code in 'example' along with opening 'docs/index.html' in a browser. Github pages isn't entirely necessary, but it lets us show the components without users having to clone the repo (see https://tomsmalley.github.io/reflex-dom-semui/).

[mightybyte]

Done. If there's a better way of integrating it, we can switch to that later.

[tomsmalley]

Thanks!