Generic Bootstrap Grid wrapper for ReactJS, WIP

Module: -> Bootstrap Grid Interface for ReactJS.js

(function (exports, DOM, undefined) {
  'use strict';
  var namespace = 'ReactLayout';

  // Data Column = Column { size :: Integer, component :: ReactComponent }

  //-- Constants ------------------------------------------------------
  var COLUMNS_TOTAL = 12,
      CONTAINER     = 'row-fluid',
      CELL          = 'span';

  //-- Export ---------------------------------------------------------
  exports[namespace] = {
    Column: Column,
    Row:    Row
  };

  //-- Module ---------------------------------------------------------
  //+ Row :: [Column] -> Maybe ReactDOM
  function Row(cs) {
    assert_length_to_total(length(cs));
    return DOM.div({className:CONTAINER}, cs.map(to_HTML));
  }

  //+ Column :: String -> ReactComponent -> Column
  function Column(s, c) { return {size:s, component:c}; }

  //-- Errors ---------------------------------------------------------
  //+ error_column_length :: Integer -> Maybe IO ()
  function error_column_length(l) {
    throw ['Column','length','is',l,'should','be',COLUMNS_TOTAL].join(' ');
  }

  //-- Asserts --------------------------------------------------------
  //+ assert_length_to_total :: Integer -> Maybe IO ()
  function assert_length_to_total(int) {
    if(!equals_total(int)) { error_column_length(int); }
    function equals_total(l) { return (l === COLUMNS_TOTAL); }
  }

  //-- Helpers --------------------------------------------------------
  //+ pluck :: Object => String -> Object -> A
  function pluck(string) {
    return function pluck_from(object) { return object[string]; };
  }

  //+ length :: [Column] -> Integer
  function length(cs) {
    return cs.map(pluck('size')).reduce(add, 0);
    function add(x,y) { return x+y; }
  }

  //+ to_HTML :: Column -> ReactDOM
  function to_HTML(c) {
    return DOM.div({className:to_class(c.size)}, c.component);
    function to_class(x) { return CELL+x }
  }
}(window, React.DOM));