What if all BS components followed a common convention for the "create" functions:

public static function create(required api values, ?optional api values, required state values, ?optional state values, ?api, ?state, ?children) {
  // construct
}

So a button might look like:

class Button extends Component<ButtonApi, ButtonState> {
  public static function create(onClick, buttonStyle, ?buttonSize, ?api, ?state, ?children) : Button {
    if (api == null) api = /* create default api obj */;
    api.onClick = onClick;
    // optional api things

    if (state == null) state = /* create default state obj */;
    state.style = buttonStyle;
    // etc.

    return new Button(api, state, children);
  }
}

I thought it would be useful to have a list of components to implement...

General stuff

• Container
• ContainerFluid
• Row
• Column (not sure how best to deal with all the .col-xs-, .col-sm-, .col-md-, col-lg-, col-xl-* column classes
• Media
• responsive classes (http://v4-alpha.getbootstrap.com/layout/responsive-utilities/) - maybe each BS component can support these in a type-safe way somehow?

Bootstrap components

• Button
• ButtonGroup
• ButtonDropdown
• Form
• InputGroup
• Dropdown
• Jumbotron
• Label
• Alert
• Card
• Nav
• Navbar
• Breadcrumb
• Pagination
• Progress
• ListGroup
• Modal
• Scrollspy
• Tooltip
• Popover
• Collapse
• Carousel
• utility classes? not sure if these are components, or are options for certain components? http://v4-alpha.getbootstrap.com/components/utilities/

E.g. if you have a Button component which has it's own state object, the render method only has access to the values defined in state. What if you wanted to add your own custom class to the button component?

Should all component state typedefs extend from a common base "state" for components, which allows for extra things like classes, attributes, id, etc.?

typedef ComponentState = {
  classes: String,
  id: String,
  attributes: Map<String, AttributeValue>,
  // ?
};

// then for something like Button:
typedef ButtonState = { > ComponentState,
  style: ButtonStyle,
  size: ButtonSize,
  // etc.
}

You could also do the same type of thing for APIs, so common events don't have to be duplicated?