hbp-quickfire
Version:
A library of useful user-interface components built with React on top of React Bootstrap and MobX
101 lines (80 loc) • 15.8 kB
JavaScript
var _extends = Object.assign || function (target) {for (var i = 1; i < arguments.length; i++) {var source = arguments[i];for (var key in source) {if (Object.prototype.hasOwnProperty.call(source, key)) {target[key] = source[key];}}}return target;};var _createClass = function () {function defineProperties(target, props) {for (var i = 0; i < props.length; i++) {var descriptor = props[i];descriptor.enumerable = descriptor.enumerable || false;descriptor.configurable = true;if ("value" in descriptor) descriptor.writable = true;Object.defineProperty(target, descriptor.key, descriptor);}}return function (Constructor, protoProps, staticProps) {if (protoProps) defineProperties(Constructor.prototype, protoProps);if (staticProps) defineProperties(Constructor, staticProps);return Constructor;};}();function _defineProperty(obj, key, value) {if (key in obj) {Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true });} else {obj[key] = value;}return obj;}function _classCallCheck(instance, Constructor) {if (!(instance instanceof Constructor)) {throw new TypeError("Cannot call a class as a function");}}function _possibleConstructorReturn(self, call) {if (!self) {throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return call && (typeof call === "object" || typeof call === "function") ? call : self;}function _inherits(subClass, superClass) {if (typeof superClass !== "function" && superClass !== null) {throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);}subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } });if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;} /*
* Copyright (c) Human Brain Project
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
import React from "react";
import { Provider } from "mobx-react";import pick from "lodash/pick";
import { components, catchedEvents, validatedEvents, passedDownPropsName } from "./Field";
import NestedActionButton from "./NestedActionButton";
import FormStore from "../Stores/FormStore";
/**
* SingleField is a generic react component that supports all kinds of different input types without a form component
* @class SingleField
* @namespace SingleField
*/var
SingleField = function (_React$Component) {_inherits(SingleField, _React$Component);
function SingleField(props) {_classCallCheck(this, SingleField);var _this = _possibleConstructorReturn(this, (SingleField.__proto__ || Object.getPrototypeOf(SingleField)).call(this,
props));
if (!props.type) {
throw "Single field needs at least a type prop";
}
if (FormStore.typesMapping[props.type] === undefined) {
throw "Unable to find this type of field : " + props.type;
}
_this.name = "_singleField_" + Math.random().toString(36).substr(2, 16);
var fieldDefinition = pick(props, FormStore.typesMapping[props.type].properties);
_this.formStore = new FormStore({
fields: _defineProperty({},
_this.name, fieldDefinition) });
_this.field = _this.formStore.structure.fields[_this.name];return _this;
}_createClass(SingleField, [{ key: "componentWillReceiveProps", value: function componentWillReceiveProps(
newProps) {var _this2 = this;
if (this.props.type !== newProps.type) {
throw "SingleField type cannot be changed once mounted";
}
FormStore.typesMapping[this.props.type].properties.forEach(function (defProperty) {
if (_this2.props[defProperty] !== newProps[defProperty]) {
if (defProperty === "value") {
_this2.field.injectValue(newProps[defProperty]);
} else {
_this2.field[defProperty] = newProps[defProperty];
}
}
});
} }, { key: "render", value: function render()
{var _this3 = this;
var FieldComponent = components[this.field.type];
var parentEvHandlers = pick(this.props, catchedEvents);
var parentProps = pick(this.props, ["className"]);
var passedDownProps = pick(this.props, passedDownPropsName);
Object.keys(parentEvHandlers).forEach(function (event) {
var handler = parentEvHandlers[event];
parentEvHandlers[event] = function (e) {
handler(e, _this3.field, _this3.formStore);
};
});var _iteratorNormalCompletion = true;var _didIteratorError = false;var _iteratorError = undefined;try {
for (var _iterator = validatedEvents[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {var event = _step.value;
if (this.field.shouldValidateOnEvent(event)) {(function () {
var existingHandler = parentEvHandlers[event] ? parentEvHandlers[event] : function () {};
parentEvHandlers[event] = function () {
existingHandler.apply(undefined, arguments);
_this3.field.validate();
};})();
}
}} catch (err) {_didIteratorError = true;_iteratorError = err;} finally {try {if (!_iteratorNormalCompletion && _iterator.return) {_iterator.return();}} finally {if (_didIteratorError) {throw _iteratorError;}}}
parentProps.className = parentProps.className ? parentProps.className + " quickfire-field quickfire-form-field" : "quickfire-field quickfire-form-field";
return (
React.createElement(Provider, { formStore: this.formStore },
React.createElement("div", _extends({}, parentEvHandlers, parentProps),
React.createElement(FieldComponent, _extends({ name: this.name, field: this.field }, passedDownProps),
this.props.children))));
} }, { key: "value", get: function get()
{
return this.field.getValue();
} }]);return SingleField;}(React.Component);export { SingleField as default };
SingleField.Remove = NestedActionButton.Remove;
SingleField.MoveUp = NestedActionButton.MoveUp;
SingleField.MoveDown = NestedActionButton.MoveDown;
SingleField.Duplicate = NestedActionButton.Duplicate;