Expose a compiled-down version of the jsx source.

package.json

@@ -4,10 +4,10 @@
   "description": "A set of React JS components for use in a formsy-react form. Markup adheres to Bootstrap structure.",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "NODE_ENV=production gulp production",
-    "lint": "eslint src"
+    "lint": "eslint src",
+    "release": "jsx --no-cache-dir src release"
   },
-  "main": "./src/main.js",
+  "main": "./release/main.js",
   "repository": {
     "type": "git",
     "url": "https://github.com/twisty/formsy-react-components.git"

release/checkbox.js

@@ -0,0 +1,44 @@
+/*jshint node:true */
+
+'use strict';
+
+var React = require('react');
+var Formsy = require('formsy-react');
+
+var Checkbox = React.createClass({displayName: "Checkbox",
+
+    mixins: [Formsy.Mixin],
+
+    getDefaultProps: function() {
+        return {
+            label: '',
+            value: false,
+            onChange: function() {},
+            disabled: false
+        };
+    },
+
+    changeValue: function(event) {
+        var target = event.currentTarget;
+        this.setValue(target.checked);
+        this.props.onChange(this.props.name, target.checked);
+    },
+
+    render: function() {
+        return (
+            React.createElement("div", {className: "checkbox"}, 
+                React.createElement("label", null, 
+                    React.createElement("input", {
+                        checked: this.getValue() === true, 
+                        type: "checkbox", 
+                        value: this.props.value, 
+                        onChange: this.changeValue, 
+                        disabled: this.isFormDisabled() || this.props.disabled}
+                    ), " ", this.props.label
+                )
+            )
+        );
+    }
+});
+
+module.exports = Checkbox;

release/icon.js

@@ -0,0 +1,25 @@
+'use strict';
+
+var React = require('react');
+
+var Icon = React.createClass({displayName: "Icon",
+
+    requiredProps: {
+        symbol: React.PropTypes.string.isRequired,
+        className: React.PropTypes.string
+    },
+
+    defaultProps: {
+        className: ''
+    },
+
+    render: function() {
+        var className = 'glyphicon glyphicon-' + this.props.symbol + ' ' + this.props.className;
+        return (
+            React.createElement("span", {className: className, "aria-hidden": "true"})
+        );
+    }
+
+});
+
+module.exports = Icon;

release/input.js

@@ -0,0 +1,73 @@
+/*jshint node:true */
+
+'use strict';
+
+var React = require('react');
+var Formsy = require('formsy-react');
+var FRCMixin = require('./mixin');
+var Row = require('./row');
+var Icon = require('./icon.js');
+
+var Input = React.createClass({displayName: "Input",
+
+    mixins: [Formsy.Mixin, FRCMixin],
+
+    propTypes: {
+        type: React.PropTypes.oneOf(['text', 'date', 'email', 'password', 'hidden'])
+    },
+
+    changeValue: function(event) {
+        this.setValue(event.currentTarget.value);
+    },
+
+    getDefaultProps: function() {
+        return {
+            type: 'text'
+        };
+    },
+
+    render: function() {
+
+        var warningIcon = '';
+
+        if (this.showErrors()) {
+            warningIcon = (
+                React.createElement(Icon, {symbol: "remove", className: "form-control-feedback"})
+            );
+        }
+
+        if (this.props.layout === 'elementOnly' || this.props.type === 'hidden') {
+            return this.renderElement();
+        }
+
+        return (
+            React.createElement(Row, {
+                label: this.props.label, 
+                required: this.isRequired(), 
+                hasErrors: this.showErrors(), 
+                layout: this.props.layout
+            }, 
+                this.renderElement(), 
+                warningIcon, 
+                this.renderHelp(), 
+                this.renderErrorMessage()
+            )
+        );
+    },
+
+    renderElement: function() {
+        return (
+            React.createElement("input", React.__spread({
+                className: "form-control"}, 
+                this.props, 
+                {label: null, 
+                value: this.getValue(), 
+                onChange: this.changeValue, 
+                disabled: this.isFormDisabled() || this.props.disabled})
+            )
+        );
+    }
+
+});
+
+module.exports = Input;

release/main.js

@@ -0,0 +1,8 @@
+'use strict';
+
+module.exports = {
+    Input: require('./input'),
+    Textarea: require('./textarea'),
+    Select: require('./select'),
+    RadioGroup: require('./radio-group')
+};

release/mixin.js

@@ -0,0 +1,47 @@
+'use strict';
+
+var React = require('react');
+
+module.exports = {
+    getDefaultProps: function() {
+        return {
+            disabled: false,
+            validatePristine: false,
+            layout: 'horizontal',
+            onChange: function() {},
+            onFocus: function() {},
+            onBlur: function() {}
+        };
+    },
+
+    renderHelp: function() {
+        if (!this.props.help) {
+            return '';
+        }
+        return (
+            React.createElement("span", {className: "help-block"}, this.props.help)
+        );
+    },
+
+    renderErrorMessage: function() {
+        if (!this.showErrors()) {
+            return '';
+        }
+        var errorMessage = this.getErrorMessage();
+        if (!errorMessage) {
+            return '';
+        }
+        return (
+            React.createElement("span", {className: "help-block"}, errorMessage)
+        );
+    },
+
+    showErrors: function() {
+        if (this.isPristine() === true) {
+            if (this.props.validatePristine === false) {
+                return false;
+            }
+        }
+        return (this.isValid() === false);
+    }
+};

release/radio-group.js

@@ -0,0 +1,94 @@
+/*jshint node:true */
+
+'use strict';
+
+var React = require('react');
+var Formsy = require('formsy-react');
+var FRCMixin = require('./mixin');
+var Row = require('./row');
+
+var RadioGroup = React.createClass({displayName: "RadioGroup",
+
+    mixins: [Formsy.Mixin, FRCMixin],
+
+    propTypes: {
+        name: React.PropTypes.string.isRequired,
+        type: React.PropTypes.oneOf(['inline', 'stacked']),
+        options: React.PropTypes.array.isRequired
+    },
+
+    getDefaultProps: function() {
+        return {
+            type: 'stacked',
+            label: '',
+            help: null
+        };
+    },
+
+    changeRadio: function(event) {
+        var value = event.currentTarget.value;
+        this.setValue(value);
+        this.props.onChange(this.props.name, value);
+    },
+
+    renderElement: function() {
+        var _this = this;
+        var controls = this.props.options.map(function(radio, key) {
+            var checked = (_this.getValue() === radio.value);
+            var disabled = _this.isFormDisabled() || radio.disabled || _this.props.disabled;
+            var className = 'radio' + (disabled ? ' disabled' : '');
+            if (_this.props.type === 'inline') {
+                return (
+                    React.createElement("label", {className: "radio-inline", key: key}, 
+                        React.createElement("input", {
+                            checked: checked, 
+                            type: "radio", 
+                            value: radio.value, 
+                            onChange: _this.changeRadio, 
+                            disabled: disabled}
+                        ), " ", radio.label
+                    )
+                );
+            }
+            return (
+                React.createElement("div", {className: className, key: key}, 
+                    React.createElement("label", null, 
+                        React.createElement("input", {
+                            checked: checked, 
+                            type: "radio", 
+                            value: radio.value, 
+                            onChange: _this.changeRadio, 
+                            disabled: disabled}
+                        ), " ", radio.label
+                    )
+                )
+            );
+        });
+        return controls;
+    },
+
+    render: function() {
+
+        if (this.props.layout === 'elementOnly') {
+            return (
+                React.createElement("div", null, this.renderElement())
+            );
+        }
+
+        return (
+            React.createElement(Row, {
+                label: this.props.label, 
+                required: this.isRequired(), 
+                hasErrors: this.showErrors(), 
+                layout: this.props.layout, 
+                fakeLabel: true
+            }, 
+                this.renderElement(), 
+                this.renderHelp(), 
+                this.renderErrorMessage()
+            )
+        );
+    }
+});
+
+module.exports = RadioGroup;