hbp-quickfire
Version:
A library of useful user-interface components built with React on top of React Bootstrap and MobX
185 lines (126 loc) • 29.3 kB
JavaScript
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;};}();var _desc, _value, _class, _descriptor, _descriptor2, _descriptor3, _descriptor4, _descriptor5, _descriptor6, _descriptor7, _descriptor8, _descriptor9, _descriptor10, _descriptor11, _descriptor12, _descriptor13, _descriptor14, _descriptor15, _descriptor16, _descriptor17, _descriptor18, _descriptor19;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 _asyncToGenerator(fn) {return function () {var gen = fn.apply(this, arguments);return new Promise(function (resolve, reject) {function step(key, arg) {try {var info = gen[key](arg);var value = info.value;} catch (error) {reject(error);return;}if (info.done) {resolve(value);} else {return Promise.resolve(value).then(function (value) {step("next", value);}, function (err) {step("throw", err);});}}return step("next");});};}function _initDefineProp(target, property, descriptor, context) {if (!descriptor) return;Object.defineProperty(target, property, { enumerable: descriptor.enumerable, configurable: descriptor.configurable, writable: descriptor.writable, value: descriptor.initializer ? descriptor.initializer.call(context) : void 0 });}function _classCallCheck(instance, Constructor) {if (!(instance instanceof Constructor)) {throw new TypeError("Cannot call a class as a function");}}function _applyDecoratedDescriptor(target, property, decorators, descriptor, context) {var desc = {};Object['ke' + 'ys'](descriptor).forEach(function (key) {desc[key] = descriptor[key];});desc.enumerable = !!desc.enumerable;desc.configurable = !!desc.configurable;if ('value' in desc || desc.initializer) {desc.writable = true;}desc = decorators.slice().reverse().reduce(function (desc, decorator) {return decorator(target, property, desc) || desc;}, desc);if (context && desc.initializer !== void 0) {desc.value = desc.initializer ? desc.initializer.call(context) : void 0;desc.initializer = undefined;}if (desc.initializer === void 0) {Object['define' + 'Property'](target, property, desc);desc = null;}return desc;}function _initializerWarningHelper(descriptor, context) {throw new Error('Decorating class property failed. Please ensure that transform-class-properties is enabled.');} /*
* 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 { action, observable, toJS, isObservableArray } from "mobx";import merge from "lodash/merge";import isArray from "lodash/isArray";import remove from "lodash/remove";import isObject from "lodash/isObject";import pick from "lodash/pick";
import Validator from "validatorjs";var
DefaultField = (_class = function () {_createClass(DefaultField, null, [{ key: "properties",
//Properties are used to know what's part of a field definition
get: function get() {
return ["type", "label", "labelTooltip", "labelTooltipPlacement", "value", "defaultValue", "emptyToNull", "disabled",
"readOnly", "readAndDeleteOnly", "readMode", "validationRules", "customErrorMessages", "validationOptions",
"customValidationFunctions", "placeholder"];
} //This function is used to know what is the actual empty value of a field
//Note that it's a function so we get a new object and not the same reference again and again
//Also it's different from the defaultValue as the defaultValue can be changed by the application
}]);function DefaultField(fieldData, store, path) {_classCallCheck(this, DefaultField);_initDefineProp(this, "type", _descriptor, this);_initDefineProp(this, "label", _descriptor2, this);_initDefineProp(this, "labelTooltip", _descriptor3, this);_initDefineProp(this, "labelTooltipPlacement", _descriptor4, this);_initDefineProp(this, "value", _descriptor5, this);_initDefineProp(this, "placeholder", _descriptor6, this);_initDefineProp(this, "defaultValue", _descriptor7, this);_initDefineProp(this, "path", _descriptor8, this);_initDefineProp(this, "emptyToNull", _descriptor9, this);_initDefineProp(this, "disabled", _descriptor10, this);_initDefineProp(this, "readOnly", _descriptor11, this);_initDefineProp(this, "readAndDeleteOnly", _descriptor12, this);_initDefineProp(this, "readMode", _descriptor13, this);_initDefineProp(this, "validationState", _descriptor14, this);_initDefineProp(this, "validationErrors", _descriptor15, this);_initDefineProp(this, "validationRules", _descriptor16, this);_initDefineProp(this, "customErrorMessages", _descriptor17, this);_initDefineProp(this, "validationOptions", _descriptor18, this);_initDefineProp(this, "customValidationFunctions", _descriptor19, this);this.__emptyValue = function () {return null;};merge(this, fieldData);
//We just store a function that gives back the store owning the field
//That way we don't create circular references between store and fields
this._store = function () {return store;};
if (fieldData.value === undefined) {
this.value = toJS(this.defaultValue);
}
this.path = path;var
custFuncs = this.customValidationFunctions;
if (custFuncs) {
Object.keys(custFuncs).forEach(function (key) {return store.registerCustomValidationFunction(key, custFuncs[key].func, custFuncs[key].message);});
}
}_createClass(DefaultField, [{ key: "injectValue", value: function injectValue(
value) {
if (this.emptyToNull && value === null) {
this.value = this.__emptyValue();
} else {
this.value = value;
}
} }, { key: "getValue", value: function getValue()
{var applyMapping = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
return applyMapping ? this.mapReturnValue(toJS(this.value)) : toJS(this.value);
} }, { key: "reset", value: function reset()
{
this.injectValue(this.defaultValue);
this.validationState = null;
this.validationErrors = null;
} }, { key: "setPath", value: function setPath(
path) {
this.path = path;
} }, { key: "registerProvidedValue", value: function registerProvidedValue(
value) {var forceArray = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
var providedValue = toJS(value);
if (forceArray && !isArray(providedValue)) {
providedValue = [providedValue];
}
this.store.setFieldInternalData(this, "provided_value", providedValue);
} }, { key: "getProvidedValue", value: function getProvidedValue()
{
return this.store.getFieldInternalData(this, "provided_value");
} }, { key: "setValue", value: function setValue(
value) {
this.value = value;
} }, { key: "addValue", value: function addValue(
value, index) {
if (value && this.value.length !== undefined && this.value.indexOf(value) === -1) {
if (index !== undefined && index !== -1) {
this.value.splice(index, 0, value);
} else {
this.value.push(value);
}
}
} }, { key: "removeValue", value: function removeValue(
value) {
if (this.value.length !== undefined) {
remove(this.value, function (val) {return val === value;});
}
} }, { key: "mapReturnValue", value: function mapReturnValue(
value) {
if (this.mappingReturn) {
var mappingReturn = toJS(this.mappingReturn);
if (isArray(value)) {
if (isArray(mappingReturn)) {
value = value.map(function (obj) {return pick(obj, mappingReturn);});
} else {
value = value.map(function (obj) {return obj[mappingReturn];});
}
} else if (isObject(value)) {
if (isArray(mappingReturn)) {
value = pick(value, mappingReturn);
} else {
value = value[mappingReturn];
}
}
}
if (this.returnSingle && isArray(value)) {
value = value.length > 0 ? value[0] : null;
}
if (this.emptyToNull && (value === "" || value != null && value.length === 0)) {
value = null;
}
return value;
} }, { key: "shouldValidateOnEvent", value: function shouldValidateOnEvent(
eventType) {
return this.validationOptions[eventType] ? true : false;
} }, { key: "validate", value: function () {var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {var _this = this;var validationRules, resolveFunc, validationPromise, validation;return regeneratorRuntime.wrap(function _callee$(_context) {while (1) {switch (_context.prev = _context.next) {case 0:
validationRules = this.validationRules;if (
validationRules) {_context.next = 3;break;}return _context.abrupt("return", true);case 3:
if (isObservableArray(validationRules)) {
validationRules = toJS(validationRules); // validation framework can't handle ObservableArrays => transform to regular array
}
resolveFunc = void 0;
validationPromise = new Promise(function (resolve) {resolveFunc = resolve;});
validation = new Validator(_defineProperty({}, this.label, this.getValue()), _defineProperty({}, this.label, validationRules), this.customErrorMessages);
validation.passes(function () {
_this.validationState = "success";
_this.validationErrors = null;
resolveFunc(true);
});
validation.fails(function () {
_this.validationState = "error";
_this.validationErrors = validation.errors.get(_this.label);
resolveFunc(false);
});return _context.abrupt("return",
validationPromise);case 10:case "end":return _context.stop();}}}, _callee, this);}));function validate() {return _ref.apply(this, arguments);}return validate;}() }, { key: "invalidate", value: function invalidate(
errorMessage) {
this.validationState = "error";
this.validationErrors = [errorMessage];
} }, { key: "store", get: function get() {return this._store();} }]);return DefaultField;}(), (_descriptor = _applyDecoratedDescriptor(_class.prototype, "type", [observable], { enumerable: true, initializer: function initializer() {return "Default";} }), _descriptor2 = _applyDecoratedDescriptor(_class.prototype, "label", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor3 = _applyDecoratedDescriptor(_class.prototype, "labelTooltip", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor4 = _applyDecoratedDescriptor(_class.prototype, "labelTooltipPlacement", [observable], { enumerable: true, initializer: function initializer() {return "top";} }), _descriptor5 = _applyDecoratedDescriptor(_class.prototype, "value", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor6 = _applyDecoratedDescriptor(_class.prototype, "placeholder", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor7 = _applyDecoratedDescriptor(_class.prototype, "defaultValue", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor8 = _applyDecoratedDescriptor(_class.prototype, "path", [observable], { enumerable: true, initializer: function initializer() {return "";} }), _descriptor9 = _applyDecoratedDescriptor(_class.prototype, "emptyToNull", [observable], { enumerable: true, initializer: function initializer() {return false;} }), _descriptor10 = _applyDecoratedDescriptor(_class.prototype, "disabled", [observable], { enumerable: true, initializer: function initializer() {return false;} }), _descriptor11 = _applyDecoratedDescriptor(_class.prototype, "readOnly", [observable], { enumerable: true, initializer: function initializer() {return false;} }), _descriptor12 = _applyDecoratedDescriptor(_class.prototype, "readAndDeleteOnly", [observable], { enumerable: true, initializer: function initializer() {return false;} }), _descriptor13 = _applyDecoratedDescriptor(_class.prototype, "readMode", [observable], { enumerable: true, initializer: function initializer() {return false;} }), _descriptor14 = _applyDecoratedDescriptor(_class.prototype, "validationState", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor15 = _applyDecoratedDescriptor(_class.prototype, "validationErrors", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor16 = _applyDecoratedDescriptor(_class.prototype, "validationRules", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _descriptor17 = _applyDecoratedDescriptor(_class.prototype, "customErrorMessages", [observable], { enumerable: true, initializer: function initializer() {return {};} }), _descriptor18 = _applyDecoratedDescriptor(_class.prototype, "validationOptions", [observable], { enumerable: true, initializer: function initializer() {return { onBlur: true, onChange: false };} }), _descriptor19 = _applyDecoratedDescriptor(_class.prototype, "customValidationFunctions", [observable], { enumerable: true, initializer: function initializer() {return null;} }), _applyDecoratedDescriptor(_class.prototype, "injectValue", [action], Object.getOwnPropertyDescriptor(_class.prototype, "injectValue"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "reset", [action], Object.getOwnPropertyDescriptor(_class.prototype, "reset"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "setValue", [action], Object.getOwnPropertyDescriptor(_class.prototype, "setValue"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "addValue", [action], Object.getOwnPropertyDescriptor(_class.prototype, "addValue"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "removeValue", [action], Object.getOwnPropertyDescriptor(_class.prototype, "removeValue"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "validate", [action], Object.getOwnPropertyDescriptor(_class.prototype, "validate"), _class.prototype), _applyDecoratedDescriptor(_class.prototype, "invalidate", [action], Object.getOwnPropertyDescriptor(_class.prototype, "invalidate"), _class.prototype)), _class);export { DefaultField as default };