UNPKG

react-json-verbling

Version:

A JSON editor packed as a React.js component and the simplest way of creating web forms.

182 lines (130 loc) 70.9 kB
/* react-json v0.0.1 https://github.com/arqex/react-json MIT: https://github.com/arqex/react-json/raw/master/LICENSE */ (function webpackUniversalModuleDefinition(root, factory) { if(typeof exports === 'object' && typeof module === 'object') module.exports = factory(require(undefined)); else if(typeof define === 'function' && define.amd) define([], factory); else if(typeof exports === 'object') exports["Json"] = factory(require(undefined)); else root["Json"] = factory(root["React"]); })(this, function(__WEBPACK_EXTERNAL_MODULE_1__) { return /******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) /******/ return installedModules[moduleId].exports; /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ exports: {}, /******/ id: moduleId, /******/ loaded: false /******/ }; /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ // Flag the module as loaded /******/ module.loaded = true; /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ // Load entry module and return exports /******/ return __webpack_require__(0); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1),\n\tFreezer = __webpack_require__(13),\n\tobjectAssign = __webpack_require__(12),\n\tTypeField = __webpack_require__(2),\n\tObjectField = __webpack_require__(3),\n\tArrayField = __webpack_require__(4),\n\tStringField = __webpack_require__(5),\n\tBooleanField = __webpack_require__(6),\n\tNumberField = __webpack_require__(7),\n\tTextField = __webpack_require__(8),\n\tPasswordField = __webpack_require__(9),\n\tSelectField = __webpack_require__(10),\n\tdeepSettings = __webpack_require__(11)\n;\n\n\n/**\n * The main component. It will refresh the props when the store changes.\n *\n * @prop {Object|FreezerNode} value The JSON object, value of the form.\n * @prop {Object} settings Customization settings\n */\nvar Json = React.createClass({\n\n\tgetDefaultProps: function(){\n\t\treturn {\n\t\t\tvalue: {},\n\t\t\terrors: false,\n\t\t\tupdating: false\n\t\t};\n\t},\n\n\tchildContextTypes: {\n\t\ttypeDefaults: React.PropTypes.object\n\t},\n\n\tgetChildContext: function(){\n\t\treturn {\n\t\t\ttypeDefaults: this.state.defaults\n\t\t};\n\t},\n\n\tgetInitialState: function(){\n\t\tvar me = this,\n\t\t\tvalue = this.props.value,\n\t\t\tlistener\n\t\t;\n\n\t\t// If it is a freezer node\n\t\tif( !value.getListener )\n\t\t\tvalue = new Freezer( value ).get();\n\n\t\t// Listen to changes\n\t\tvalue.getListener().on('update', function( updated ){\n\t\t\tif( me.state.updating )\n\t\t\t\treturn me.setState({ updating: false });\n\n\t\t\tme.setState({value: updated});\n\n\t\t\tif( me.state.errors )\n\t\t\t\tme.getValidationErrors();\n\n\t\t\tif( me.props.onChange )\n\t\t\t\tme.props.onChange( updated.toJS() );\n\t\t});\n\n\t\treturn {\n\t\t\tvalue: value,\n\t\t\tdefaults: this.createDefaults(),\n\t\t\tid: this.getId()\n\t\t};\n\t},\n\n\tcomponentWillReceiveProps: function( newProps ){\n\t\tif( !newProps.value.getListener ){\n\t\t\tthis.setState({updating: true, value: this.state.value.reset( newProps.value )});\n\t\t}\n\n\t\tthis.setState( {defaults: this.createDefaults()} );\n\t},\n\n\trender: function(){\n\t\tvar settings = this.props.settings || {},\n\t\t\tob = React.createElement( TypeField, {\n\t\t\t\ttype: 'object',\n\t\t\t\tvalue: this.state.value,\n\t\t\t\tsettings: objectAssign( {}, this.state.defaults.object, {\n\t\t\t\t\tfields: settings.fields,\n\t\t\t\t\tediting: this.getFormSetting( settings, 'editing', 'always'),\n\t\t\t\t\tfixedFields: this.getFormSetting( settings, 'fixedFields', true),\n\t\t\t\t\tadder: this.getFormSetting( settings, 'adder', false),\n\t\t\t\t\theader: false,\n\t\t\t\t\torder: settings.order\n\t\t\t\t}),\n\t\t\t\tref: 'value',\n\t\t\t\tdefaults: this.state.defaults,\n\t\t\t\tid: this.state.id\n\t\t\t})\n\t\t;\n\n\t\treturn React.DOM.div({className: \"jsonEditor\"}, ob);\n\t},\n\n\tgetValue: function(){\n\t\treturn this.state.value.toJS();\n\t},\n\n\tgetValidationErrors: function(){\n\t\tvar jsonValue = this.getValue(),\n\t\t\terrors = this.refs.value.getValidationErrors( jsonValue )\n\t\t;\n\n\t\tthis.setState( {errors: errors.length} );\n\t\treturn errors.length ? errors : false;\n\t},\n\tgetDeepSettings: function(){\n\t\tvar settings = {};\n\n\t\tfor( var key in deepSettings ){\n\t\t\tsettings[ key ] = deepSettings[ key ]( this, settings[key] );\n\t\t}\n\n\t\treturn settings;\n\t},\n\tcreateDefaults: function(){\n\t\tvar settings = this.props.settings || {},\n\t\t\tcomponents = TypeField.prototype.components,\n\t\t\tpropDefaults = settings.defaults || {},\n\t\t\tdefaults = {}\n\t\t;\n\n\t\tfor( var type in components ){\n\t\t\tdefaults[ type ] = objectAssign( {}, components[ type ].prototype.defaults || {}, propDefaults[ type ] || {});\n\t\t}\n\n\t\treturn defaults;\n\t},\n\n\tgetId: function(){\n\t\treturn btoa( parseInt( Math.random() * 10000 ) ).replace(/=/g, '');\n\t},\n\n\tgetFormSetting: function( settings, field, def ){\n\t\tif( typeof settings[ field ] != 'undefined' )\n\t\t\treturn settings[ field ];\n\t\tif( settings.form )\n\t\t\treturn def;\n\t}\n});\n\n// Add global modifier functions\nJson.registerType = TypeField.registerType.bind( TypeField );\n\n// Register basic types\nJson.registerType( 'object', ObjectField );\nJson.registerType( 'array', ArrayField, true );\nJson.registerType( 'string', StringField, true );\nJson.registerType( 'text', TextField, true );\nJson.registerType( 'number', NumberField, true );\nJson.registerType( 'boolean', BooleanField, true );\nJson.registerType( 'password', PasswordField );\nJson.registerType( 'select', SelectField );\n\nmodule.exports = Json;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./Json.js\n ** module id = 0\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./Json.js?"); /***/ }, /* 1 */ /***/ function(module, exports, __webpack_require__) { eval("module.exports = __WEBPACK_EXTERNAL_MODULE_1__;\n\n/*****************\n ** WEBPACK FOOTER\n ** external {\"root\":\"React\"}\n ** module id = 1\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///external_%7B%22root%22:%22React%22%7D?"); /***/ }, /* 2 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nvar React = __webpack_require__(1),\n\tdeepSettings = __webpack_require__(11),\n\tobjectAssign = __webpack_require__(12)\n;\n\nvar components = {};\nvar typeCheckOrder = [];\n\nvar TypeField = React.createClass({\n\tcomponents: {},\n\ttypeCheckOrder: [],\n\n\tcontextTypes: {\n\t\ttypeDefaults: React.PropTypes.object\n\t},\n\n\trender: function() {\n\t\tvar Component = this.getComponent(),\n\t\t\tsettings = objectAssign(\n\t\t\t\t{},\n\t\t\t\tthis.context.typeDefaults[ this.props.type ],\n\t\t\t\tthis.props.settings\n\t\t\t)\n\t\t;\n\n\t\tthis.addDeepSettings( settings );\n\n\t\treturn React.createElement( Component, {\n\t\t\tvalue: this.props.value,\n\t\t\tsettings: settings,\n\t\t\tonUpdated: this.props.onUpdated,\n\t\t\tid: this.props.id,\n\t\t\tref: 'field'\n\t\t});\n\t},\n\n\tgetComponent: function(){\n\t\tvar type = this.props.type;\n\t\tif( !type )\n\t\t\ttype = this.guessType( this.props.value );\n\n\t\tthis.fieldType = type;\n\n\t\treturn this.components[ type ];\n\t},\n\n\tguessType: function( value ){\n\t\tvar type = false,\n\t\t\ti = 0,\n\t\t\ttypes = this.typeCheckOrder,\n\t\t\tcomponent\n\t\t;\n\n\t\twhile( !type && i < types.length ){\n\t\t\tcomponent = this.components[ types[i] ].prototype;\n\t\t\tif( component.isType && component.isType( value ) )\n\t\t\t\ttype = types[i++];\n\t\t\telse\n\t\t\t\ti++;\n\t\t}\n\n\t\treturn type || 'object';\n\t},\n\n\tgetValidationErrors: function( jsonValue ){\n\t\treturn this.refs.field.getValidationErrors( jsonValue );\n\t},\n\n\taddDeepSettings: function( settings ){\n\t\tvar parentSettings = this.props.parentSettings || {},\n\t\t\tdeep\n\t\t;\n\n\t\tfor( var key in deepSettings ){\n\t\t\tdeep = deepSettings[ key ]( parentSettings[key], settings[key] );\n\t\t\tif( typeof deep != 'undefined' )\n\t\t\t\tsettings[ key ] = deep;\n\t\t}\n \t}\n});\n\nTypeField.registerType = function( name, Component, selectable ){\n\tvar proto = TypeField.prototype;\n\tproto.components[ name ] = Component;\n\tif( selectable )\n\t\tproto.typeCheckOrder.unshift( name );\n};\n\nmodule.exports = TypeField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/TypeField.js\n ** module id = 2\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/TypeField.js?"); /***/ }, /* 3 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nvar React = __webpack_require__(1),\n\tField = __webpack_require__(14),\n\tassign = __webpack_require__(12),\n\tCompoundFieldMixin = __webpack_require__(15)\n;\n\n/**\n * Component for editing a hash.\n * @param {FreezerNode} value The value of the object.\n * @param {Mixed} original The value of the component it the original json.\n */\nvar ObjectField = React.createClass({\n\tmixins: [CompoundFieldMixin],\n\n\tgetInitialState: function(){\n\t\treturn this.getStateFromProps( this.props );\n\t},\n\n\tgetStateFromProps: function( props ){\n\t\treturn {\n\t\t\tediting: props.settings.editing || false,\n\t\t\tfields: assign({}, props.settings && props.settings.fields || {})\n\t\t};\n\t},\n\n\tdefaultValue: {},\n\n\trender: function(){\n\t\tvar me = this,\n\t\t\tsettings = this.props.settings,\n\t\t\tclassName = this.state.editing || settings.header === false ? 'open jsonObject jsonCompound' : 'jsonObject jsonCompound',\n\t\t\topenHash = '',\n\t\t\tdefinitions = this.state.fields,\n\t\t\tattrs = [],\n\t\t\tvalue = assign({}, this.props.value ),\n\t\t\tfixedFields = this.getFixedFields(),\n\t\t\tgroupCount = 0,\n\t\t\tdefinition\n\t\t;\n\n\t\tthis.getFieldOrder().forEach( function( field ){\n\t\t\t// If the field is an array handle grouping\n\t\t\tif( field.constructor === Array )\n\t\t\t\tattrs.push( me.renderGroup( field, fixedFields, ++groupCount ) );\n\t\t\telse\n\t\t\t\tattrs.push( me.renderField( field, fixedFields ) );\n\t\t});\n\n\t\tvar openHashChildren = [ attrs ];\n\t\tif( settings.adder !== false ){\n\t\t\topenHashChildren.push( this.renderAdder() );\n\t\t}\n\n\t\topenHash = React.DOM.div({ key: 'o', className: 'jsonChildren'}, openHashChildren);\n\t\treturn React.DOM.span({className: className}, [\n\t\t\tthis.renderHeader(),\n\t\t\topenHash\n\t\t]);\n\t},\n\n\trenderField: function( key, fixedFields ){\n\t\tvar value = this.props.value[ key ],\n\t\t\tdefinition = this.state.fields[ key ] || {},\n\t\t\tfixed = fixedFields === true || typeof fixedFields == 'object' && fixedFields[ key ]\n\t\t;\n\n\t\tif( !definition.settings )\n\t\t\tdefinition.settings = {};\n\n\t\treturn React.createElement( Field, {\n\t\t\tvalue: value,\n\t\t\tkey: key,\n\t\t\tname: key,\n\t\t\tref: key,\n\t\t\tfixed: fixed,\n\t\t\tid: this.props.id,\n\t\t\tdefinition: definition,\n\t\t\tonUpdated: this.updateField,\n\t\t\tonDeleted: this.deleteField,\n\t\t\tparentSettings: this.props.settings\n\t\t});\n\t},\n\n\trenderGroup: function( fieldNames, fixedFields, groupNumber ){\n\t\tvar me = this,\n\t\t\tfields = []\n\t\t;\n\n\t\tfieldNames.forEach( function( field ){\n\t\t\tfields.push( me.renderField( field, fixedFields ) );\n\t\t});\n\n\t\treturn React.DOM.div({ className: 'jsonGroup jsonGroup_' + groupNumber }, fields );\n\t},\n\n\tgetDefaultHeader: function(){\n\t\treturn 'Map [' + Object.keys( this.props.value ).length + ']';\n\t},\n\n\tgetDefaultAdder: function(){\n\t\treturn '+ Add field';\n\t},\n\n\tupdateField: function( key, value ){\n\t\tthis.checkEditingSetting( key );\n\t\tthis.props.value.set( key, value );\n\t},\n\n\tdeleteField: function( key ){\n\t\tthis.props.value.remove( key );\n\t},\n\n\tgetValidationErrors: function( jsonValue ){\n\t\tvar me = this,\n\t\t\terrors = [],\n\t\t\tattrs = Object.keys( this.refs )\n\t\t;\n\n\t\tattrs.forEach( function( attr ){\n\t\t\tvar error = me.refs[attr].getValidationErrors();\n\t\t\tif( error )\n\t\t\t\terrors = errors.concat( error );\n\t\t});\n\n\t\treturn errors;\n\t},\n\n\tgetFieldOrder: function(){\n\t\tvar me = this,\n\t\t\tsettingsOrder = this.props.settings.order,\n\t\t\torderType = typeof settingsOrder,\n\t\t\tfields = this.props.settings.fields || {},\n\t\t\tgroup\n\t\t;\n\n\t\tif( !settingsOrder || (orderType != 'function' && settingsOrder.constructor !== Array) )\n\t\t\treturn Object.keys( this.props.value );\n\n\t\tvar value = assign( {}, this.props.value ),\n\t\t\torder = []\n\t\t;\n\n\t\tif( orderType == 'function' )\n\t\t\treturn settingsOrder( value );\n\n\t\t// Add fields in the array\n\t\tif( settingsOrder.constructor === Array ){\n\t\t\tsettingsOrder.forEach( function( field ){\n\n\t\t\t\t// An array, handle group\n\t\t\t\tif( field.constructor == Array ){\n\t\t\t\t\tgroup = [];\n\t\t\t\t\tfield.forEach( function( groupField ){\n\t\t\t\t\t\tif( me.addFieldToOrder( groupField, value, fields ) ){\n\t\t\t\t\t\t\tgroup.push( groupField );\n\n\t\t\t\t\t\t\t// Delete them from current values\n\t\t\t\t\t\t\tdelete value[ groupField ];\n\t\t\t\t\t\t}\n\t\t\t\t\t});\n\t\t\t\t\tif( group.length )\n\t\t\t\t\t\torder.push( group );\n\t\t\t\t}\n\t\t\t\telse if( me.addFieldToOrder( field, value, fields ) ){\n\t\t\t\t\torder.push( field );\n\n\t\t\t\t\t// Delete them from current values\n\t\t\t\t\tdelete value[ field ];\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\n\t\t// Add the keys left in the value\n\t\tfor( var key in value ){\n\t\t\tif( order.indexOf( key ) == -1 )\n\t\t\t\torder.push( key );\n\t\t}\n\n\t\treturn order;\n\t},\n\n\t/**\n\t * Checks when a field that appears in the sort settings needs to be added to\n\t * the fieldOrder array\n\t *\n\t * @param {String} field The field name\n\t */\n\taddFieldToOrder: function( field, value, fields ){\n\t\treturn typeof value[ field ] != 'undefined' || fields[ field ] && fields[ field ].type == 'react';\n\t}\n});\n\nmodule.exports = ObjectField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/ObjectField.js\n ** module id = 3\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/ObjectField.js?"); /***/ }, /* 4 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nvar React = __webpack_require__(1),\n\tField = __webpack_require__(14),\n\tassign = __webpack_require__(12),\n\tCompoundFieldMixin = __webpack_require__(15)\n;\n\n/**\n * Component for editing an array.\n * @param {FreezerNode} value The value of the array.\n * @param {Mixed} original The value of the component it the original json.\n */\nvar ArrayField = React.createClass({\n\tmixins: [CompoundFieldMixin],\n\n\tgetInitialState: function(){\n\t\treturn this.getStateFromProps( this.props );\n\t},\n\n\tgetStateFromProps: function( props ){\n\t\treturn {\n\t\t\tediting: props.settings.editing || false,\n\t\t\tfields: this.state && this.state.fields || {}\n\t\t};\n\t},\n\n\tdefaultValue: [],\n\n\trender: function(){\n\t\tvar settings = this.props.settings,\n\t\t\tclassName = this.state.editing ? 'open jsonArray jsonCompound' : 'jsonArray jsonCompound',\n\t\t\topenArray = '',\n\t\t\tfixedFields = this.getFixedFields(),\n\t\t\tdefinitions = this.state.fields\n\t\t;\n\n\t\tvar attrs = [],\n\t\t\tdefinition, fixed\n\t\t;\n\t\tfor (var i = 0; i < this.props.value.length; i++) {\n\t\t\tdefinition = definitions[ i ] || {};\n\t\t\tif( !definition.settings )\n\t\t\t\tdefinition.settings = {};\n\n\t\t\tfixed = fixedFields === true || typeof fixedFields == 'object' && fixedFields[ i ];\n\n\t\t\tattrs.push( React.createElement( Field, {\n\t\t\t\tvalue: this.props.value[i],\n\t\t\t\tkey: i,\n\t\t\t\tname: i,\n\t\t\t\tid: this.props.id,\n\t\t\t\tdefinition: definition,\n\t\t\t\tfixed: fixed,\n\t\t\t\tonUpdated: this.updateField,\n\t\t\t\tonDeleted: this.deleteField,\n\t\t\t\tparentSettings: this.props.settings\n\t\t\t}));\n\t\t}\n\n\t\tvar openArrayChildren = [ attrs ];\n\t\tif( settings.adder !== false ){\n\t\t\topenArrayChildren.push( this.renderAdder( this.props.value.length ) );\n\t\t}\n\n\t\topenArray = React.DOM.div({ key:'o', className: 'jsonChildren' }, openArrayChildren );\n\n\t\treturn React.DOM.span({className: className}, [\n\t\t\tthis.renderHeader(),\n\t\t\topenArray\n\t\t]);\n\t},\n\n\tgetDefaultHeader: function(){\n\t\treturn 'List [' + this.props.value.length + ']';\n\t},\n\n\tgetDefaultAdder: function(){\n\t\treturn '+ Add element';\n\t},\n\n\tupdateField: function( key, value ){\n\t\tthis.checkEditingSetting( key );\n\t\tthis.props.value.set( key, value );\n\t},\n\n\tdeleteField: function( key ){\n\t\tvar fields = {};\n\n\t\tfor( var index in this.state.fields ){\n\t\t\tif( index > key ){\n\t\t\t\tfields[ index - 1 ] = this.state.fields[ index ];\n\t\t\t}\n\t\t\telse if( index < key ){\n\t\t\t\tfields[ index ] = this.state.fields[ index ];\n\t\t\t}\n\t\t\t// If they are equal we are deleting the element, do nothing\n\t\t}\n\n\t\tthis.props.value.splice( key, 1 );\n\t\tthis.setState( { fields: fields } );\n\t},\n\n\tisType: function( value ){\n\t\treturn value && value.constructor == Array;\n\t}\n});\n\nmodule.exports = ArrayField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/ArrayField.js\n ** module id = 4\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/ArrayField.js?"); /***/ }, /* 5 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1),\n\tLeafMixin = __webpack_require__(16)\n;\n\n\n/**\n * Component for editing a string.\n * @param {string} value The value of the string.\n * @param {Mixed} original The value of the component it the original json.\n * @param {FreezerNode} parent The parent node to let the string component update its value.\n */\nvar StringField = React.createClass({\n\tmixins: [LeafMixin],\n\ttypeClass: 'jsonString',\n\tinputType: 'text',\n\tdefaultValue: '',\n\n\tgetInitialState: function(){\n\t\treturn this.getStateFromProps( this.props );\n\t},\n\n\trender: function(){\n\t\treturn this.renderInput();\n\t},\n\n\tupdateValue: function( e ){\n\t\tthis.setState({ value: e.target.value });\n\t},\n\n\tisType: function( value ){\n\t\treturn typeof value != 'object';\n\t}\n});\n\nmodule.exports = StringField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/StringField.js\n ** module id = 5\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/StringField.js?"); /***/ }, /* 6 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1);\n\n/**\n * Component for editing a boolean.\n * @param {string} value The value of the boolean.\n */\nvar BooleanField = React.createClass({\n\n\tdefaultValue: false,\n\n\trender: function(){\n\t\tvar className = 'jsonBoolean';\n\n\t\treturn React.DOM.input({\n\t\t\ttype: \"checkbox\",\n\t\t\tclassName: className,\n\t\t\tid: this.props.id,\n\t\t\tchecked: this.props.value,\n\t\t\tonChange: this.updateValue\n\t\t});\n\t},\n\n\tupdateValue: function( e ){\n\t\tthis.props.onUpdated( e.target.checked );\n\t},\n\n\tisType: function( value ){\n\t\treturn typeof value == 'boolean';\n\t},\n\n\tcomponentWillReceiveProps: function( nextProps ){\n\t\tif( this.props.value != nextProps.value )\n\t\t\tthis.setState( { value: nextProps.value } );\n\t}\n});\n\nmodule.exports = BooleanField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/BooleanField.js\n ** module id = 6\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/BooleanField.js?"); /***/ }, /* 7 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1),\n\tLeafMixin = __webpack_require__(16)\n;\n\n/**\n * Component for editing a number.\n * @param {string} value The value of the string.\n * @param {Mixed} original The value of the component it the original json.\n * @param {FreezerNode} parent The parent node to let the string component update its value.\n */\nvar NumberField = React.createClass({\n\tmixins: [LeafMixin],\n\ttypeClass: 'jsonNumber',\n\tinputType: 'number',\n\tdefaultValue: '',\n\n\tgetInitialState: function(){\n\t\treturn this.getStateFromProps( this.props );\n\t},\n\n\trender: function(){\n\t\treturn this.renderInput();\n\t},\n\n\tupdateValue: function( e ){\n\t\tthis.setState({ value: parseFloat( e.target.value ) });\n\t},\n\n\tisType: function( value ){\n\t\treturn typeof value == 'number';\n\t}\n});\n\nmodule.exports = NumberField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/NumberField.js\n ** module id = 7\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/NumberField.js?"); /***/ }, /* 8 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1),\n\tLeafMixin = __webpack_require__(16)\n;\n\n/**\n * Component for editing a long string.\n * @param {string} value The value of the string.\n * @param {Mixed} original The value of the component it the original json.\n * @param {FreezerNode} parent The parent node to let the string component update its value.\n */\nvar TextField = React.createClass({\n\tmixins: [LeafMixin],\n\tdefaultValue: '',\n\n\tgetInitialState: function(){\n\t\treturn this.getStateFromProps( this.props );\n\t},\n\n\trender: function(){\n\t\tvar className = 'jsonText';\n\n\t\tif( !this.state.editing )\n\t\t\treturn React.DOM.span( {onClick: this.setEditMode, className: className}, this.props.value );\n\n\t\treturn React.DOM.textarea({\n\t\t\tvalue: this.state.value,\n\t\t\tid: this.props.id,\n\t\t\tonChange: this.updateValue,\n\t\t\tplaceholder: this.props.settings.placeholder || '',\n\t\t\tonBlur: this.setValue,\n\t\t\tref: 'input'\n\t\t});\n\t},\n\n\tupdateValue: function( e ){\n\t\tthis.setState({ value: e.target.value });\n\t},\n\n\tisType: function( value ){\n\t\treturn typeof value == 'string' && value.length > 100;\n\t}\n});\n\nmodule.exports = TextField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/TextField.js\n ** module id = 8\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/TextField.js?"); /***/ }, /* 9 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1),\n\tLeafMixin = __webpack_require__(16)\n;\n\n\n/**\n * Component for editing a password.\n * @param {string} value The value of the password.\n * @param {Mixed} original The value of the component it the original json.\n * @param {FreezerNode} parent The parent node to let the password component update its value.\n */\nvar PasswordField = React.createClass({\n\tmixins: [LeafMixin],\n\ttypeClass: 'jsonPassword',\n\tinputType: 'password',\n\tdefaultValue: '',\n\n\tgetInitialState: function(){\n\t\treturn this.getStateFromProps( this.props );\n\t},\n\n\trender: function(){\n\t\treturn this.renderInput();\n\t},\n\n\tgetDisplayModeString: function(){\n\t\treturn this.getWildcards();\n\t},\n\n\tgetWildcards: function(){\n\t\tvar out = '';\n\t\tfor (var i = this.state.value.length - 1; i >= 0; i--) {\n\t\t\tout += '*';\n\t\t}\n\t\treturn out;\n\t},\n\n\tisType: function(){\n\t\treturn false;\n\t},\n\n\tupdateValue: function( e ){\n\t\tthis.setState({ value: e.target.value });\n\t}\n});\n\nmodule.exports = PasswordField;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/PasswordField.js\n ** module id = 9\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/PasswordField.js?"); /***/ }, /* 10 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1);\n\n/**\n * Component for editing a boolean.\n * @param {string} value The value of the boolean.\n */\nvar SelectType = React.createClass({\n\n\tdefaultValue: '',\n\n\tgetInitialState: function(){\n\t\treturn {\n\t\t\tvalue: this.props.value\n\t\t};\n\t},\n\n\trender: function(){\n\t\tvar className = 'jsonSelect';\n\n\t\treturn React.DOM.select({\n\t\t\tclassName: className,\n\t\t\tid: this.props.id,\n\t\t\tvalue: this.props.value,\n\t\t\tonChange: this.updateValue\n\t\t}, this.renderOptions() );\n\t},\n\n\trenderOptions: function(){\n\t\tvar opts = this.props.settings.options,\n\t\t\toptions = []\n\t\t;\n\n\t\tif( !opts || !opts.length )\n\t\t\treturn options;\n\n\t\topts.forEach( function( opt ){\n\t\t\tvar data = opt;\n\t\t\tif( typeof opt != 'object' )\n\t\t\t\tdata = { value: opt, label: opt };\n\n\t\t\toptions.push(\n\t\t\t\tReact.DOM.option({value: data.value}, data.label)\n\t\t\t);\n\t\t});\n\n\t\treturn options;\n\t},\n\n\tupdateValue: function( e ){\n\t\tthis.props.onUpdated( e.target.value );\n\t},\n\n\tcomponentWillReceiveProps: function( nextProps ){\n\t\tif( this.props.value != nextProps.value )\n\t\t\tthis.setState( { value: nextProps.value } );\n\t}\n});\n\nmodule.exports = SelectType;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/types/SelectField.js\n ** module id = 10\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/types/SelectField.js?"); /***/ }, /* 11 */ /***/ function(module, exports, __webpack_require__) { eval("module.exports = {\n\tediting: function( parentValue, value ){\n\t\tif( typeof value != 'undefined' )\n\t\t\treturn value;\n\n\t\tif( parentValue == 'always' )\n\t\t\treturn 'always';\n\n\t\t// else return undefined: do not override\n\t},\n\tadder: function( parentValue, value ){\n\n\t\tif( typeof value != 'undefined' )\n\t\t\treturn value;\n\t\tif( typeof parentValue != 'undefined' )\n\t\t\treturn parentValue;\n\n\t\treturn true;\n\t},\n\tfixedFields: function( parentValue, value ){\n\t\tif( typeof value != 'undefined' )\n\t\t\treturn value;\n\n\t\tif( typeof parentValue == 'boolean' )\n\t\t\treturn parentValue;\n\t}\n};\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/deepSettings.js\n ** module id = 11\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/deepSettings.js?"); /***/ }, /* 12 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nfunction ToObject(val) {\n\tif (val == null) {\n\t\tthrow new TypeError('Object.assign cannot be called with null or undefined');\n\t}\n\n\treturn Object(val);\n}\n\nmodule.exports = Object.assign || function (target, source) {\n\tvar from;\n\tvar keys;\n\tvar to = ToObject(target);\n\n\tfor (var s = 1; s < arguments.length; s++) {\n\t\tfrom = arguments[s];\n\t\tkeys = Object.keys(Object(from));\n\n\t\tfor (var i = 0; i < keys.length; i++) {\n\t\t\tto[keys[i]] = from[keys[i]];\n\t\t}\n\t}\n\n\treturn to;\n};\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/object-assign/index.js\n ** module id = 12\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./~/object-assign/index.js?"); /***/ }, /* 13 */ /***/ function(module, exports, __webpack_require__) { eval("var Freezer = __webpack_require__(17);\nmodule.exports = Freezer;\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/freezer-js/freezer.js\n ** module id = 13\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./~/freezer-js/freezer.js?"); /***/ }, /* 14 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nvar React = __webpack_require__(1),\n\tobjectAssign = __webpack_require__(12),\n\tValidation = __webpack_require__(18),\n\tTypeField = __webpack_require__(2)\n;\n\n/**\n * Field component that represent each Array element or Object field.\n * @param {string} name The key of the attribute in the parent.\n * @param {Mixed} value The value of the attribute.\n * @param {Mixed} original The value of the attibute in the original json to highlight the changes.\n * @param {FreezerNode} parent The parent node to notify attribute updates.\n */\nvar Field = React.createClass({\n\n\tgetInitialState: function(){\n\t\treturn {error: false};\n\t},\n\tgetDefaultProps: function(){\n\t\treturn {\n\t\t\tdefinition: {}\n\t\t};\n\t},\n\trender: function(){\n\t\tvar definition = this.props.definition || {},\n\t\t\tclassName = 'jsonField',\n\t\t\ttype = definition.type || TypeField.prototype.guessType( this.props.value ),\n\t\t\tid = this.props.id + '_' + this.props.name,\n\t\t\terror = '',\n\t\t\ttypeField\n\t\t;\n\n\t\tif( type == 'react' )\n\t\t\treturn this.renderReactField( definition );\n\n\t\ttypeField = this.renderTypeField( type, id );\n\n\t\tclassName += ' ' + type + 'Field';\n\n\t\tif( this.state.error ){\n\t\t\tclassName += ' jsonError';\n\t\t\tif( this.state.error !== true )\n\t\t\t\terror = React.DOM.span({ key:'e', className: 'jsonErrorMsg' }, this.state.error );\n\t\t}\n\n\t\tvar jsonName = [ React.DOM.label({ key: 's1', htmlFor: id }, (definition.title || this.props.name) + ':' ) ];\n\n\t\tif( this.props.fixed ){\n\t\t\t// If the field cannot be removed, add a placeholder to maintain the design\n\t\t\tjsonName.unshift( React.DOM.span({ key:'f', className: 'jsonFixed' }) );\n\t\t}\n\t\telse{\n\t\t\tjsonName.unshift( React.DOM.a({ key:'a', href: '#', className: 'jsonRemove', onClick: this.handleRemove}, 'x') );\n\t\t}\n\n\t\treturn React.DOM.div({className: className}, [\n\t\t\tReact.DOM.span( {className: 'jsonName', key: 'n'}, jsonName ),\n\t\t\tReact.DOM.span( {className: 'jsonValue', key: 'v'}, typeField ),\n\t\t\terror\n\t\t]);\n\t},\n\n\trenderTypeField: function( type, id ){\n\t\tvar definition = this.props.definition,\n\t\t\tsettings = objectAssign( {}, definition.settings || {} ),\n\t\t\tcomponent\n\t\t;\n\n\t\tif( definition.fields )\n\t\t\tsettings.fields = definition.fields;\n\n\t\tcomponent = React.createElement( TypeField, {\n\t\t\ttype: type,\n\t\t\tvalue: this.props.value,\n\t\t\tsettings: settings,\n\t\t\tonUpdated: this.onUpdated,\n\t\t\tref: 'typeField',\n\t\t\tid: id,\n\t\t\tparentSettings: this.props.parentSettings\n\t\t});\n\t\treturn component;\n\t},\n\n\trenderReactField: function( definition ){\n\t\treturn React.DOM.div( { className: 'jsonField reactField' }, definition.output );\n\t},\n\n\thandleRemove: function( e ){\n\t\tthis.props.onDeleted( this.props.name );\n\t},\n\n\tshouldComponentUpdate: function( nextProps, nextState ){\n\t\treturn nextProps.value != this.props.value || nextState.error != this.state.error;\n\t},\n\n\tonUpdated: function( value ){\n\t\tvar definition = this.props.definition;\n\t\tif( this.props.value !== value ){\n\t\t\tthis.props.onUpdated( this.props.name, value );\n\t\t\tif( definition.onChange )\n\t\t\t\tdefinition.onChange( value, this.props.value );\n\t\t}\n\t},\n\n\tgetValidationErrors: function( jsonValue ){\n\t\tvar childErrors = [],\n\t\t\tvalidates = this.props.definition.validates,\n\t\t\tname = this.props.name,\n\t\t\tfield = this.refs.typeField\n\t\t;\n\n\t\tif( !field )\n\t\t\treturn [];\n\n\t\tif( field.fieldType == 'object' ){\n\t\t\tchildErrors = field.getValidationErrors( jsonValue );\n\t\t\tchildErrors.forEach( function( error ){\n\t\t\t\tif( !error.path )\n\t\t\t\t\terror.path = name;\n\t\t\t\telse\n\t\t\t\t\terror.path = name + '.' + error.path;\n\t\t\t});\n\n\t\t\tif( childErrors.length )\n\t\t\t\tthis.setState( {error: true} );\n\t\t}\n\n\t\tif( !validates )\n\t\t\treturn childErrors;\n\n\n\t\tvar error = Validation.getValidationError( this.props.value, jsonValue, validates ),\n\t\t\tmessage\n\t\t;\n\n\t\tif( error ){\n\t\t\tmessage = this.props.definition.errorMessage;\n\t\t\tif( !message )\n\t\t\t\tmessage = ( this.props.definition.label || this.props.name ) + ' value is not valid.';\n\n\t\t\terror.path = name;\n\t\t\terror.message = message;\n\t\t\tthis.setState( {error: message} );\n\t\t\tchildErrors = childErrors.concat( [error] );\n\t\t}\n\t\telse if( this.state.error ){\n\t\t\tthis.setState( {error: false} );\n\t\t}\n\n\t\treturn childErrors;\n\t}\n});\n\nmodule.exports = Field;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/Field.js\n ** module id = 14\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/Field.js?"); /***/ }, /* 15 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nvar React = __webpack_require__(1),\n\tFieldAdder = __webpack_require__(19),\n\tassign = __webpack_require__(12)\n;\n\nmodule.exports = {\n\trenderHeader: function(){\n\t\tvar settingsHeader = this.props.settings.header;\n\t\tif( settingsHeader === false )\n\t\t\treturn '';\n\n\t\tvar type = typeof settingsHeader,\n\t\t\theader\n\t\t;\n\n\t\tif( type == 'function' ){\n\t\t\theader = settingsHeader( this.props.value.toJS() );\n\t\t}\n\t\telse if( type == 'undefined' ){\n\t\t\theader = this.getDefaultHeader();\n\t\t}\n\t\telse {\n\t\t\theader = settingsHeader;\n\t\t}\n\n\t\treturn React.DOM.span({ key: 's', onClick: this.toggleEditing, className: 'compoundToggle' }, header);\n\t},\n\n\ttoggleEditing: function(){\n\t\tif( this.state.editing != 'always' && this.props.settings.header !== false )\n\t\t\tthis.setState({editing: !this.state.editing});\n\t},\n\n\tcomponentWillReceiveProps: function( nextProps ){\n\t\tif( this.props.settings.editing != nextProps.settings.editing )\n\t\t\tthis.setState({ editing: nextProps.editing });\n\t},\n\n\trenderAdder: function( name ){\n\t\tvar settingsAdder = this.props.settings.adder,\n\t\t\ttype = typeof settingsAdder,\n\t\t\tadder\n\t\t;\n\n\t\tif( type == 'function' ){\n\t\t\tadder = settingsAdder( this.props.value.toJS() );\n\t\t}\n\t\telse if( settingsAdder === true || type == 'undefined' ){\n\t\t\tadder = this.getDefaultAdder();\n\t\t}\n\t\telse {\n\t\t\tadder = settingsAdder;\n\t\t}\n\n\t\treturn React.createElement( FieldAdder, {\n\t\t\tonCreate: this.createField,\n\t\t\tname: name,\n\t\t\tkey: 'add',\n\t\t\ttext: adder\n\t\t});\n\t},\n\n\tcreateField: function( key, value, definition ){\n\n\t\tif( this.props.value[ key ] )\n\t\t\treturn console.log( 'Field ' + key + ' already exists.');\n\n\t\t// Start editing and focus\n\t\tdefinition.settings = {\n\t\t\tediting: this.state.editing == 'always' ? 'always' : true,\n\t\t\tfocus: true\n\t\t};\n\n\t\tvar fields = assign( {}, this.state.fields );\n\t\tfields[ key ] = definition;\n\n\t\tthis.setState({fields: fields});\n\t\tthis.props.value.set( key, value );\n\t},\n\n\t/**\n\t * Checks if the current key editing setting is true\n\t * and set it to false. The editing setting is set\n\t * to true when a new child is added to edit it automatically\n\t * after is edited it loses the point.\n\t *\n\t * @param {String} key The child key\n\t */\n\tcheckEditingSetting: function( key ){\n\t\tvar fields = this.state.fields;\n\t\tif( fields[ key ] && fields[ key ].settings.focus === true ){\n\t\t\tfields = assign({}, fields);\n\t\t\tfields[key].settings.focus = false;\n\t\t\tthis.setState( {fields: fields} );\n\t\t}\n\t},\n\n\tgetFixedFields: function(){\n\t\tvar fields = this.props.settings.fixedFields,\n\t\t\tfixed = {}\n\t\t;\n\t\tif( fields && fields.constructor == Array ){\n\t\t\tfields.forEach( function( f ){\n\t\t\t\tfixed[ f ] = 1;\n\t\t\t});\n\t\t\treturn fixed;\n\t\t}\n\t\treturn fields;\n\t}\n};\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./mixins/CompoundFieldMixin.js\n ** module id = 15\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./mixins/CompoundFieldMixin.js?"); /***/ }, /* 16 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nvar React = __webpack_require__(1);\n\nmodule.exports = {\n\tgetStateFromProps: function( props ){\n\t\treturn {\n\t\t\tediting: props.settings.editing || false,\n\t\t\tvalue: props.value\n\t\t};\n\t},\n\n\trenderInput: function(){\n\t\tvar className = this.typeClass;\n\n\t\tif( !this.state.editing )\n\t\t\treturn React.DOM.span( {onClick: this.setEditMode, className: className}, this.getDisplayString() );\n\n\t\treturn React.DOM.input({\n\t\t\ttype: this.inputType,\n\t\t\tvalue: this.state.value,\n\t\t\tid: this.props.id,\n\t\t\tplaceholder: this.props.settings.placeholder || '',\n\t\t\tonChange: this.updateValue,\n\t\t\tonBlur: this.setValue,\n\t\t\tref: 'input',\n\t\t\tonKeyDown: this.handleKeyDown\n\t\t});\n\t},\n\n\tgetDisplayString: function(){\n\t\tif( this.getDisplayModeString )\n\t\t\treturn this.getDisplayModeString();\n\n\t\tif( this.props.value === '' )\n\t\t\treturn React.DOM.span( {className: 'jsonNovalue'}, 'No value' );\n\n\t\treturn this.props.value;\n\t},\n\n\tcomponentWillReceiveProps: function( nextProps ){\n\t\tvar nextState = {},\n\t\t\tupdate = false\n\t\t;\n\n\t\tif( this.props.value != nextProps.value ){\n\t\t\tupdate = true;\n\t\t\tnextState.value = nextProps.value;\n\t\t}\n\t\tif( this.props.settings.editing != nextProps.settings.editing ){\n\t\t\tupdate = true;\n\t\t\tnextState.editing = nextProps.editing;\n\t\t}\n\t\tif( update )\n\t\t\tthis.setState( nextState );\n\t},\n\n\tcomponentDidUpdate: function( prevProps, prevState ){\n\t\tif( this.state.editing && ! prevState.editing || this.props.settings.focus ){\n\t\t\tthis.focus();\n\t\t}\n\t},\n\n\tcomponentDidMount: function(){\n\t\tif( this.state.editing === true || this.props.settings.focus )\n\t\t\tthis.focus();\n\t},\n\n\tsetEditMode: function(){\n\t\tthis.setState({editing: true});\n\t},\n\n\tsetValue: function(){\n\t\tif( this.state.editing != 'always' )\n\t\t\tthis.setState({editing: false});\n\t\tthis.props.onUpdated( this.state.value );\n\t},\n\n\ttoggleEditing: function(){\n\t\tthis.setState({ editing: !this.state.editing });\n\t},\n\n\thandleKeyDown: function( e ){\n\t\tif( e.which == 13 )\n\t\t\tthis.setValue();\n\t},\n\n\tfocus: function(){\n\t\tvar node = this.refs.input.getDOMNode();\n\t\tnode.focus();\n\t\tnode.value = node.value;\n\t}\n};\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./mixins/LeafFieldMixin.js\n ** module id = 16\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./mixins/LeafFieldMixin.js?"); /***/ }, /* 17 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\r\n\r\nvar Utils = __webpack_require__( 20 ),\r\n\tEmitter = __webpack_require__( 21 ),\r\n\tMixins = __webpack_require__( 22 ),\r\n\tFrozen = __webpack_require__( 23 )\r\n;\r\n\r\n//#build\r\nvar Freezer = function( initialValue, mutable ) {\r\n\tvar me = this;\r\n\r\n\t// Immutable data\r\n\tvar frozen;\r\n\r\n\tvar notify = function notify( eventName, node, options ){\r\n\t\tif( eventName == 'listener' )\r\n\t\t\treturn Frozen.createListener( node );\r\n\r\n\t\treturn Frozen.update( eventName, node, options );\r\n\t};\r\n\r\n\tvar freeze = function(){};\r\n\tif( !mutable )\r\n\t\tfreeze = function( obj ){ Object.freeze( obj ); };\r\n\r\n\t// Create the frozen object\r\n\tfrozen = Frozen.freeze( initialValue, notify, freeze );\r\n\r\n\t// Listen to its changes immediately\r\n\tvar listener = frozen.getListener();\r\n\r\n\t// Updating flag to trigger the event on nextTick\r\n\tvar updating = false;\r\n\r\n\tlistener.on( 'immediate', function( prevNode, updated ){\r\n\t\tif( prevNode != frozen )\r\n\t\t\treturn;\r\n\r\n\t\tfrozen = updated;\r\n\r\n\t\t// Trigger on next tick\r\n\t\tif( !updating ){\r\n\t\t\tupdating = true;\r\n\t\t\tUtils.nextTick( function(){\r\n\t\t\t\tupdating = false;\r\n\t\t\t\tme.trigger( 'update', frozen );\r\n\t\t\t});\r\n\t\t}\r\n\t});\r\n\r\n\tUtils.addNE( this, {\r\n\t\tget: function(){\r\n\t\t\treturn frozen;\r\n\t\t},\r\n\t\tset: function( node ){\r\n\t\t\tvar newNode = notify( 'reset', frozen, node );\r\n\t\t\tnewNode.__.listener.trigger( 'immediate', frozen, newNode );\r\n\t\t}\r\n\t});\r\n\r\n\tUtils.addNE( this, { getData: this.get, setData: this.set } );\r\n\r\n\t// The event store\r\n\tthis._events = [];\r\n}\r\n\r\nFreezer.prototype = Utils.createNonEnumerable({constructor: Freezer}, Emitter);\r\n//#build\r\n\r\nmodule.exports = Freezer;\r\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./~/freezer-js/src/freezer.js\n ** module id = 17\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./~/freezer-js/src/freezer.js?"); /***/ }, /* 18 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\nvar ValidationMethods = {\n required: function( value ){\n if( !value )\n return false;\n\n // Empty trimmed string does not validate\n if( typeof value == 'string' && !value.trim() )\n return false;\n\n return true;\n },\n\n email: function( value ){\n\n // If nothing given, maybe the field is not required\n // so it passes the check.\n if( !value )\n return true;\n\n /* http://stackoverflow.com/questions/46155/validate-email-address-in-javascript */\n var re = /^(([^<>()[\\]\\\\.,;:\\s@\"]+(\\.[^<>()[\\]\\\\.,;:\\s@\"]+)*)|(\".+\"))@((\\[[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}\\.[0-9]{1,3}])|(([a-zA-Z\\-0-9]+\\.)+[a-zA-Z]{2,}))$/;\n return re.test( value );\n },\n\n length: function( value, jsonValue, min, max ){\n if( !min )\n min = 0;\n if( !max )\n max = Infinity;\n\n return ( value.length >= min && value.length <= max );\n },\n\n integer: function( value, jsonValue, min, max ){\n if( !min && min !== 0 )\n min = -Infinity;\n if( !max )\n max = Infinity;\n\n // Empty string passes the check\n if(!value && value != 0)\n return true;\n\n var intVal = parseInt( value );\n\n if( value != intVal )\n return false;\n\n return ( intVal <= max && intVal >= min );\n },\n\n checked: function( value ){\n return value;\n },\n\n matches: function( value, jsonValue, path ){\n return value == findInTree( path.split('.'), jsonValue );\n }\n};\n\n\nmodule.exports = {\n\tgetValidationError: function( value, jsonValue, validates ){\n\t\tvar methods = [],\n\t\t\terror = false,\n\t\t\ti = 0\n\t\t;\n\n\t\t// Store the validation methods in an array\n\t\tif( typeof validates == 'string' ){\n\t\t\tmethods = parseMethodString( validates );\n\t\t}\n\t\telse if( typeof validates == 'function' ){\n\t\t\tmethods = [ validates ];\n\t\t}\n\t\telse if( validates && validates.constructor === Array ){\n\t\t\tmethods = validates;\n\t\t}\n\n\n\t\tvar definition, f, method;\n\t\twhile( !error && i < methods.length ){\n\t\t\tmethod = methods[i++];\n\t\t\tif( typeof method == 'string' ){\n\n\t\t\t\t// definition {name, args}\n\t\t\t\tdefinition = parseMethodName( method );\n\t\t\t\tf = ValidationMethods[ definition.name ];\n\t\t\t\tif( !f )\n\t\t\t\t\tconsole.log( 'Unkown validation method ' + definition.name );\n\t\t\t\telse if( !f.apply( null, [ value, jsonValue ].concat( definition.args ) )){\n\t\t\t\t\terror = {\n\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t\tmethod: method\n\t\t\t\t\t};\n\t\t\t\t}\n\t\t\t}\n\t\t\telse if( typeof method == 'function' ){\n\t\t\t\tif( !method( value, jsonValue ) )\n\t\t\t\t\terror = {\n\t\t\t\t\t\tvalue: value,\n\t\t\t\t\t\tmethod: 'custom'\n\t\t\t\t\t};\n\t\t\t}\n\t\t}\n\n\t\treturn error;\n\t}\n};\n\n/*\n HELPER METHODS\n */\n\nvar parseMethodString = function( string ){\n\treturn string.match(/[^\\s\\[]+(\\[[^\\]]+?\\])?/ig);\n};\n\n/**\n * Parse a method call in the data-validation attribute.\n * @param {String} methodStr A method call like method[arg1, arg2, ...]\n * @return {Object} An object like {name: 'method', args: [arg1, arg2, ...]}\n */\nvar parseMethodName = function( methodStr ){\n var parts = methodStr.split('['),\n definition = {\n name: parts[0],\n args: []\n },\n args\n ;\n\n if( parts.length > 1 ){\n args = parts[1];\n\n if( args[ args.length - 1 ] == ']' )\n args = args.slice(0, args.length - 1);\n\n definition.args = args.split(/\\s*,\\s*/);\n }\n\n return definition;\n};\n\n/**\n * Get the value of a field node, hiding the differences among\n * different type of inputs.\n *\n * @param {DOMElement} field The field.\n * @return {String} The current value of the given field.\n */\nvar getFieldValue = function( field ){\n var tagName = field.tagName.toLowerCase();\n\n if( tagName == 'input' && field.type == 'checkbox' ){\n return field.checked;\n }\n\n if( tagName == 'select' ){\n return field.options[field.selectedIndex].value;\n }\n\n return field.value;\n};\n\nfunction findInTree( path, jsonValue ){\n\tif( !path.length )\n\t\treturn jsonValue;\n\n\treturn findInTree(path.slice(1), jsonValue[ path[0] ]);\n}\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/validation.js\n ** module id = 18\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/validation.js?"); /***/ }, /* 19 */ /***/ function(module, exports, __webpack_require__) { eval("var React = __webpack_require__(1),\n\tTypeField = __webpack_require__(2)\n;\n\n/**\n * Component to add fields to an Object or Array.\n * @param {FreezerNode} root The parent to add the attribute.\n * @param {string} name Optional. If provided, the attribute added will have that key (arrays).\n * Otherwise an input will be shown to let the user define the key.\n */\nvar FieldAdder = React.createClass({\n\tgetInitialState: function(){\n\t\treturn {\n\t\t\tcreating: this.props.creating || false,\n\t\t\tname: this.props.name,\n\t\t\ttype: 'string'\n\t\t};\n\t},\n\n\trender: function(){\n\t\tif( !this.state.creating )\n\t\t\treturn React.DOM.a({ className: 'jsonAdd', href: '#', onClick: this.handleCreate }, this.props.text );\n\n\t\tvar options = this.getTypes().map( function( type ){\n\t\t\t\treturn React.DOM.option({value: type, key: type}, type[0].toUpperCase() + type.slice(1));\n\t\t\t}),\n\t\t\tfieldName\n\t\t;\n\n\t\tif( typeof this.props.name != 'undefined' )\n\t\t\tfieldName = [\n\t\t\t\tReact.DOM.span({className: 'jsonName'}, this.props.name),\n\t\t\t\tReact.DOM.span(null, ':')\n\t\t\t];\n\t\telse {\n\t\t\tfieldName = [\n\t\t\t\tReact.DOM.input({ref: 'keyInput', type: 'text', value: this.state.value, onChange: this.changeKey}),\n\t\t\t\tReact.DOM.span(null, ':')\n\t\t\t];\n\t\t}\n\n\t\treturn React.DOM.div( {className: 'jsonField jsonFieldAdder'}, [\n\t\t\tfieldName,\n\t\t\tReact.DOM.select({ key: 's', value: this.state.type, onChange: this.changeType, ref: 'typeSelector'}, options),\n\t\t\tReact.DOM.button({ key: 'b', onClick: this.createField }, 'OK' ),\n\t\t\tReact.DOM.a({ key: 'a', href: '#', className: 'cancelField', onClick: this.handleCancel}, 'Cancel')\n\t\t]);\n\t},\n\n\tcomponentDidUpdate: function( prevProps, prevState ){\n\t\tif( !prevState.creating && this.state.creating ){\n\t\t\tif( this.refs.keyInput )\n\t\t\t\tthis.refs.keyInput.getDOMNode().focus();\n\t\t\telse\n\t\t\t\tthis.refs.typeSelector.getDOMNode().focus();\n\t\t}\n\t},\n\n\tcomponentWillReceiveProps: function( newProps ){\n\t\tthis.setState({name: newProps.name});\n\t},\n\n\thandleCreate: function( e ){\n\t\te.preventDefault();\n\t\tthis.setState({creating: true});\n\t},\n\n\thandleCancel: function( e ){\n\t\te.preventDefault();\n\t\tthis.setState({creating: false});\n\t},\n\n\tchangeType: function( e ){\n\t\tthis.setState({type: e.target.value});\n\t},\n\n\tchangeKey: function( e ){\n\t\tthis.setState({name: e.target.value});\n\t},\n\n\tcreateField: function(){\n\t\tthis.setState({creating: false});\n\n\t\tvar value = TypeField.prototype.components[ this.state.type ].prototype.defaultValue;\n\n\t\tthis.props.onCreate( this.state.name, value, {type: this.state.type });\n\t},\n\n\tgetTypes: function(){\n\t\treturn Object.keys( TypeField.prototype.components );\n\t}\n});\n\nmodule.exports = FieldAdder;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/FieldAdder.js\n ** module id = 19\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/FieldAdder.js?"); /***/ }, /* 20 */ /***/ function(module, exports, __webpack_require__) { eval("'use strict';\n\n//#build\nvar global = (new Function(\"return this\")());\n\nvar Utils = {\n\textend: function( ob, props ){\n\t\tfor( var p in props ){\n\t\t\tob[p] = props[p];\n\t\t}\n\t\treturn ob;\n\t},\n\n\tcreateNonEnumerable: function( obj, proto ){\n\t\tvar ne = {};\n\t\tfor( var key in obj )\n\t\t\tne[key] = {value: obj[key] };\n\t\treturn Object.create( proto || {}, ne );\n\t},\n\n\terror: function( message ){\n\t\tvar err = new Error( message );\n\t\tif( console )\n\t\t\treturn console.error( err );\n\t\telse\n\t\t\tthrow err;\n\t},\n\n\teach: function( o, clbk ){\n\t\tvar i,l,keys;\n\t\tif( o && o.constructor == Array ){\n\t\t\tfor (i = 0, l = o.length; i < l; i++)\n\t\t\t\tclbk( o[i], i );\n\t\t}\n\t\telse {\n\t\t\tkeys = Object.keys( o );\n\t\t\tfor( i = 0, l = keys.length; i < l; i++ )\n\t\t\t\tclbk( o[ keys[i] ], keys[i] );\n\t\t}\n\t},\n\n\taddNE: function( node, attrs ){\n\t\tfor( var key in attrs ){\n\t\t\tObject.defineProperty( node, key, {\n\t\t\t\tenumerable: false,\n\t\t\t\tconfigurable: true,\n\t\t\t\twritable: true,\n\t\t\t\tvalue: attrs[ key ]\n\t\t\t});\n\t\t}\n\t},\n\n\t// nextTick - by stagas / public domain\n \tnextTick: (function () {\n var queue = [],\n\t\t\tdirty = false,\n\t\t\tfn,\n\t\t\thasPostMessage = !!global.postMessage,\n\t\t\tmessageName = 'nexttick',\n\t\t\ttrigger = (function () {\n\t\t\t\treturn hasPostMessage\n\t\t\t\t\t? function trigger () {\n\t\t\t\t\tglobal.postMessage(messageName, '*');\n\t\t\t\t}\n\t\t\t\t: function trigger () {\n\t\t\t\t\tsetTimeout(function () { processQueue() }, 0);\n\t\t\t\t};\n\t\t\t}()),\n\t\t\tprocessQueue = (function () {\n\t\t\t\treturn hasPostMessage\n\t\t\t\t\t? function processQueue (event) {\n\t\t\t\t\t\tif (event.source === global && event.data === messageName) {\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\tflushQueue();\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t\t