Component local breakpoints

[jacojoubert]

Blocked on #46

@media css rules depend on the viewport size to enable css rules. The problem is when the same component gets used a multiple locations at different widths. There is no way to specify a break point based on the width of the component itself.

We should have a way to change a component's behaviour based not only based on the viewport size, but also on the component's size and bind to any changes.

Use Cases

• The table component uses different layouts depending on how much width it has available. We need to be able to detect when the space available changes and bind to it.

• When you create complex forms sometimes you need to reflow the content when the space gets too narrow.

[ebryn]

• figure out our unified layout strategy
  • investigate Flexi's approach