Yun UI Kit

This library favors:

* only supporting "all-green" browsers

over messy code for backwards compatability

* functional implementations using the ramdajs library

over imparative code

* minimal implementations for components supporting the most common use cases

over an ocean of component properties

* composition through render callbacks

over properties to tell components how to render themselves

``


NO

AmazingComponent {showBullets: true, height: 10, propertyToUse:'name'}

YES

AmazingComponent
renderItem: (item) ->
div {style: {height:10}},
span {}, \'*\'
span {}, item.name

NOTE: react-hot-loader does not support render callbacks yet.

Because of this a workaround approach is used instead:

MyComponent = React.createClass
render: ->
{style, item} = @props
div {style},
span {}, \'*\'
span {}, item.name

AmazingComponent
itemComponent: MyComponent
itemProps: {style: {height:10}}
`

Inline styles

Also, right now this library is trying out inline styles. So for example, instead of specifying what children should look like:

`
.popup > ul { ... }
.content-box ul { ... }
.panel .list { ... }
``

...which is hard to override later. Inline styles gives a less cascading, more modular way of working.
If this is the best solution or if something like css-modules will win is left to see though :)

TODO

- Components to try
- Topbar like inbox
- input fields in topbar (like inbox)
- Card

- [ ] switch port from 300 which might be coliding causing hot reloading to fail