@agilemotion/oui-react-js 1.3.8 → 1.4.0

package/dist/components/form/Form.js

@@ -21,7 +21,7 @@ var _asyncMutex = require("async-mutex");
 
 var _Observable = _interopRequireDefault(require("../../event/Observable"));
 
-var _ApplicationContext = _interopRequireDefault(require("../../ApplicationContext"));
+var _ApplicationManager = _interopRequireDefault(require("../../ApplicationManager"));
 
 var _ServiceCallActionHandler = _interopRequireDefault(require("../../event/ServiceCallActionHandler"));
 
@@ -33,37 +33,13 @@ var _Event = _interopRequireDefault(require("../../event/Event"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-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 asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
-
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
-
-function _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
-
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 const useStyles = (0, _styles.makeStyles)(theme => ({
   container: {
     display: 'flex',
     flexWrap: 'wrap',
     width: '100%',
-    "& tr td": {
-      verticalAlign: "top"
+    '& tr td': {
+      verticalAlign: 'top'
     }
   },
   select: {
@@ -78,51 +54,24 @@ const useStyles = (0, _styles.makeStyles)(theme => ({
 }));
 
 const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwardRef((props, ref) => {
-  const _React$useState = _react.default.useState(!_Utils.default.isNull(props.values) ? props.values : {}),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        values = _React$useState2[0],
-        setValues = _React$useState2[1];
+  const values = _react.default.useRef(!_Utils.default.isNull(props.values) ? props.values : {});
 
-  const _React$useState3 = _react.default.useState(null),
-        _React$useState4 = _slicedToArray(_React$useState3, 2),
-        masterValues = _React$useState4[0],
-        setMasterValues = _React$useState4[1];
+  const [masterValues, setMasterValues] = _react.default.useState(null);
 
-  const _React$useState5 = _react.default.useState(null),
-        _React$useState6 = _slicedToArray(_React$useState5, 2),
-        config = _React$useState6[0],
-        setConfig = _React$useState6[1];
+  const [config, setConfig] = _react.default.useState(_Utils.default.parseConfig(props.config, props.viewId));
 
-  const _React$useState7 = _react.default.useState(_Utils.default.isNull(props.config.binder) ? 'PLAIN_OBJECT' : props.config.binder),
-        _React$useState8 = _slicedToArray(_React$useState7, 1),
-        binder = _React$useState8[0];
+  const [binder] = _react.default.useState(_Utils.default.isNull(props.config.binder) ? 'PLAIN_OBJECT' : props.config.binder);
 
-  const _React$useState9 = _react.default.useState([]),
-        _React$useState10 = _slicedToArray(_React$useState9, 1),
-        fields = _React$useState10[0];
+  const [fields] = _react.default.useState([]);
 
   const containerErrorCallback = _react.default.useRef();
 
-  const _React$useState11 = _react.default.useState({}),
-        _React$useState12 = _slicedToArray(_React$useState11, 1),
-        sectionHandles = _React$useState12[0];
-
-  const _React$useState13 = _react.default.useState([]),
-        _React$useState14 = _slicedToArray(_React$useState13, 1),
-        loadedComponents = _React$useState14[0];
+  const [sectionHandles] = _react.default.useState({});
 
-  const _React$useState15 = _react.default.useState({}),
-        _React$useState16 = _slicedToArray(_React$useState15, 1),
-        fieldParentErrors = _React$useState16[0];
+  const [fieldParentErrors] = _react.default.useState({});
 
   const loadingRef = _react.default.useRef(true);
 
-  const _React$useState17 = _react.default.useState(true),
-        _React$useState18 = _slicedToArray(_React$useState17, 2),
-        initializing = _React$useState18[0],
-        setInitializing = _React$useState18[1];
-
-  const mutex = new _asyncMutex.Mutex();
   let sectionCounter = 0;
 
   const api = () => {
@@ -141,22 +90,22 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
         doHandleChange(id, value);
       },
       handleSelectItemChange: (name, options, selectedId) => {
-        return _handleSelectItemChange(name, options, selectedId);
+        return handleSelectItemChange(name, options, selectedId);
       },
       handleChange: (id, value) => {
         doHandleChange(id, value);
       },
       getValuePath: (id, values) => {
-        return _getValuePath(id, values);
+        return getValuePath(id, values);
       },
       addField: (id, ref, parentId, bindValueToForm) => {
-        return _addField(id, ref, parentId, bindValueToForm);
+        return addField(id, ref, parentId, bindValueToForm);
       },
       removeField: id => {
-        _removeField(id);
+        removeField(id);
       },
       loadData: (actionConfig, event) => {
-        _loadData(actionConfig, config, event ? event.data : null);
+        loadData(actionConfig, config, event ? event.data : null);
       },
       bindData: data => {
         doBindData(data);
@@ -196,7 +145,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       },
 
       get model() {
-        return values;
+        return values.current;
       },
 
       set model(model) {
@@ -207,56 +156,36 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       get value() {
         if (loadingRef.current === false) {
           let data = null;
-          let currentValue = values;
           let valid = true;
-          let parentErrors = {};
+          data = {};
+          let map = !_Utils.default.isNull(masterValues) ? JSON.parse(JSON.stringify(masterValues)) : {};
 
-          if (binder === 'MAP_OBJECT') {
-            data = {};
-            let map = !_Utils.default.isNull(masterValues) ? JSON.parse(JSON.stringify(masterValues.map)) : {};
+          if (_Utils.default.isNull(map.id)) {
+            map.id = values.current.id;
+          }
 
-            if (_Utils.default.isNull(map.id)) {
-              map.id = values.id;
+          for (const field of fields) {
+            if (field.bindValueToForm === false) {
+              continue;
             }
 
-            var _iterator = _createForOfIteratorHelper(fields),
-                _step;
-
-            try {
-              for (_iterator.s(); !(_step = _iterator.n()).done;) {
-                const field = _step.value;
-
-                if (field.bindValueToForm === false) {
-                  continue;
-                }
-
-                let fieldValid = field.handle.api.validate(values, null);
+            let fieldValid = field.handle.api.validate(values.current, null);
 
-                if (fieldValid === false) {
-                  doValidateParent(field, !fieldValid);
-                  valid = false;
-                  console.log("INVALID FORM FIELD : " + field.handle.api.id);
-                } else if (valid) {
-                  let id = field.id;
-
-                  let path = _getValuePath(id, values);
-
-                  map[id] = field.handle.api.parseValue(path.valueObject[path.valueProperty], false);
-                }
-              }
-            } catch (err) {
-              _iterator.e(err);
-            } finally {
-              _iterator.f();
+            if (fieldValid === false) {
+              console.log("INVALID : " + field.id);
+              doValidateParent(field, !fieldValid, false);
+              valid = false;
+            } else if (valid) {
+              let id = field.id;
+              let path = getValuePath(id, values.current);
+              path.valueObject[path.valueProperty] = field.handle.api.parseValue(path.valueObject[path.valueProperty], false);
             }
+          }
 
-            if (binder === 'MAP_OBJECT') {
-              data.map = map;
-            } else {
-              data = map;
-            }
-          } else {
-            data = values;
+          data = values.current;
+
+          if (!_Utils.default.isNull(containerErrorCallback.current) && _ApplicationManager.default.isFormMarkersEnabled()) {
+            containerErrorCallback.current(fieldParentErrors);
           }
 
           return valid ? data : null;
@@ -266,7 +195,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       },
 
       setFieldError: (id, error) => {
-        return _setFieldError(id, error);
+        return setFieldError(id, error);
       },
       getChildren: () => {
         let children = [];
@@ -283,33 +212,13 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
 
         let properties = Object.getOwnPropertyNames(sectionHandles);
 
-        var _iterator2 = _createForOfIteratorHelper(properties),
-            _step2;
-
-        try {
-          for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
-            const property = _step2.value;
-            let sectionHandle = sectionHandles[property];
-            children.push(sectionHandle);
+        for (const property of properties) {
+          let sectionHandle = sectionHandles[property];
+          children.push(sectionHandle);
 
-            var _iterator3 = _createForOfIteratorHelper(sectionHandle.api.getChildren()),
-                _step3;
-
-            try {
-              for (_iterator3.s(); !(_step3 = _iterator3.n()).done;) {
-                const child = _step3.value;
-                children.push(child);
-              }
-            } catch (err) {
-              _iterator3.e(err);
-            } finally {
-              _iterator3.f();
-            }
+          for (const child of sectionHandle.api.getChildren()) {
+            children.push(child);
           }
-        } catch (err) {
-          _iterator2.e(err);
-        } finally {
-          _iterator2.f();
         }
 
         return children;
@@ -318,22 +227,12 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       refresh() {
         let properties = Object.getOwnPropertyNames(sectionHandles);
 
-        var _iterator4 = _createForOfIteratorHelper(properties),
-            _step4;
+        for (const property of properties) {
+          let sectionHandle = sectionHandles[property];
 
-        try {
-          for (_iterator4.s(); !(_step4 = _iterator4.n()).done;) {
-            const property = _step4.value;
-            let sectionHandle = sectionHandles[property];
-
-            if (sectionHandle.api.refresh) {
-              sectionHandle.api.refresh();
-            }
+          if (sectionHandle.api.refresh) {
+            sectionHandle.api.refresh();
           }
-        } catch (err) {
-          _iterator4.e(err);
-        } finally {
-          _iterator4.f();
         }
       }
 
@@ -351,12 +250,16 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
   };
 
   function updateViewTitle() {
-    let currentView = _ApplicationContext.default.getCurrentView();
+    if (props.viewId) {
+      let view = _ApplicationManager.default.getView(props.viewId);
 
-    let title = currentView.config.title;
+      if (view) {
+        let title = view.config.title;
 
-    if (title.includes(props.config.id)) {
-      _ApplicationContext.default.updateAppBarTitle(currentView.config.id, title);
+        if (title.includes(props.config.id)) {
+          _ApplicationManager.default.updateAppBarTitle(view.config.id, title);
+        }
+      }
     }
   }
 
@@ -371,28 +274,17 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
 
     _Observable.default.processSystemGeneratedSubscriptions(props.config.id);
 
-    var _iterator5 = _createForOfIteratorHelper(fields),
-        _step5;
-
-    try {
-      for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
-        const field = _step5.value;
-
-        _Observable.default.processSystemGeneratedSubscriptions(field.handle.api.id);
-      }
-    } catch (err) {
-      _iterator5.e(err);
-    } finally {
-      _iterator5.f();
+    for (const field of fields) {
+      _Observable.default.processSystemGeneratedSubscriptions(field.handle.api.id);
     }
   }
 
-  function _loadData(eventConfig, componentConfig, eventData = null) {
+  function loadData(eventConfig, componentConfig, eventData = null) {
     let service = !_Utils.default.isNull(componentConfig.dataService) ? componentConfig.dataService : eventConfig !== null ? eventConfig.dataService : null;
-    let componentValue = !_Utils.default.isNull(componentConfig.value) ? componentConfig.value : eventConfig !== null ? eventConfig.value : null;
+    let componentValue = !_Utils.default.isNull(componentConfig.value) ? _ApplicationManager.default.resolveParameterConfigValue(componentConfig.value, eventData) : eventConfig !== null ? _ApplicationManager.default.resolveParameterConfigValue(eventConfig.value, eventData) : null;
 
     if (!_Utils.default.isNull(service)) {
-      if (service.type === 'remoteObjectProxy') {
+      if (service.type === 'rpc') {
         (0, _RestUtils.invokeRpc)(service, props.handle, props.viewId, result => {
           try {
             if (!_Utils.default.isNull(result.data)) {
@@ -431,13 +323,17 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       return true;
     } else {
       if (!_Utils.default.isNull(componentValue)) {
-        let isEventData = componentValue.toString().startsWith("$event.data");
+        if (!_ApplicationManager.default.isExpression(componentValue)) {
+          componentValue = _ApplicationManager.default.fillEventDataValue(componentValue, eventData);
+        }
+
+        let isEventData = componentValue.toString().startsWith('$event.data');
 
-        if (_ApplicationContext.default.isExpression(componentValue) && !isEventData) {
+        if (_ApplicationManager.default.isExpression(componentValue) && !isEventData) {
           let path = _Utils.default.getPropertyChainPath(componentValue);
 
           if (!_Utils.default.isNull(path.valueObject)) {
-            _Observable.default.addSystemGeneratedSubscription(props.viewId, props.config.id, () => {
+            _Observable.default.addSystemGeneratedSubscription(props.viewId, props.viewId, props.config.id, () => {
               let value = _DynamicJS.default.executeScript("".concat(props.config.id, "ValueEvaluator"), componentValue);
 
               if (!_Utils.default.isNull(value)) {
@@ -454,7 +350,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
             });
           }
         } else {
-          let val = isEventData ? _ApplicationContext.default.resolveExpressionValue(componentValue, eventData) : componentValue;
+          let val = isEventData ? _ApplicationManager.default.resolveExpressionValue(componentValue, eventData) : componentValue;
 
           if (binder === 'MAP_OBJECT' && _Utils.default.isNull(componentValue.map)) {
             val = {};
@@ -473,39 +369,59 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     }
   }
 
+  _react.default.useEffect(() => {
+    return () => {
+      props.handle.api = null;
+    };
+  }, []);
+
   _react.default.useEffect(() => {
     props.handle.api = api();
+  });
 
-    if (initializing) {
-      let parsedConfig = _Utils.default.parseConfig(props.config, props.viewId);
+  _react.default.useEffect(() => {
+    props.handle.api = api();
+    let eventHandlingConfig = _Utils.default.isNull(config.eventHandlingConfig) ? {} : config.eventHandlingConfig;
+    eventHandlingConfig.subscriptions = _Utils.default.isNull(eventHandlingConfig.subscriptions) ? [] : eventHandlingConfig.subscriptions;
+
+    let autoLoadData = _Utils.default.getComponentAttribute(config, 'autoLoadData', null);
+
+    if (autoLoadData === null || autoLoadData === true) {
+      let subscription = {
+        publisher: props.viewId,
+        eventType: _EventType.default.COMPONENT_LOAD,
+        actions: [{
+          actionType: 'loadData'
+        }]
+      };
+      eventHandlingConfig.subscriptions.push(subscription);
+    } else {
+      handleDataArrived();
+    }
 
-      let eventHandlingConfig = _Utils.default.isNull(parsedConfig.eventHandlingConfig) ? {} : parsedConfig.eventHandlingConfig;
-      eventHandlingConfig.subscriptions = _Utils.default.isNull(eventHandlingConfig.subscriptions) ? [] : eventHandlingConfig.subscriptions;
+    _Observable.default.addSubscriptions(eventHandlingConfig, props.handle, props.viewId);
 
-      let autoLoadData = _Utils.default.getComponentAttribute(parsedConfig, 'autoLoadData', null);
+    _Observable.default.addSystemSubscriptions(props.viewId, config);
 
-      if (!_ApplicationContext.default.getCurrentView().handle.api.loaded() && autoLoadData === null || autoLoadData === true) {
-        let subscription = {
-          publisher: props.viewId,
-          eventType: _EventType.default.COMPONENT_LOAD,
-          actions: [{
-            actionType: "loadData"
-          }]
-        };
-        eventHandlingConfig.subscriptions.push(subscription);
-      } else {
-        loadingRef.current = false;
-        handleDataArrived();
+    setConfig(config);
+
+    for (const field of fields) {
+      let handle = field.handle;
+
+      if (!_Utils.default.isNull(handle)) {
+        handle.api.handleLoadComplete();
       }
+    }
 
-      _Observable.default.addSubscriptions(eventHandlingConfig, props.handle, props.viewId);
+    loadingRef.current = false;
+    let event = new _Event.default(props.handle, props.viewId, null);
 
-      _Observable.default.addSystemSubscriptions(parsedConfig);
+    _Observable.default.fireEvent(_EventType.default.COMPONENT_LOAD, event);
 
-      setConfig(parsedConfig);
-      setInitializing(false);
-    }
-  });
+    return () => {
+      _Observable.default.clearComponentEventListeners(props.handle);
+    };
+  }, []);
 
   _react.default.useEffect(() => {
     if (!_Utils.default.isNull(props.config) && !_Utils.default.isNull(props.values)) {
@@ -522,259 +438,19 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
   const getFieldsFromTab = tab => {
     let fields = [];
 
-    var _iterator6 = _createForOfIteratorHelper(tab.tabPages),
-        _step6;
-
-    try {
-      for (_iterator6.s(); !(_step6 = _iterator6.n()).done;) {
-        const tabPage = _step6.value;
-
-        var _iterator7 = _createForOfIteratorHelper(tabPage.components),
-            _step7;
-
-        try {
-          for (_iterator7.s(); !(_step7 = _iterator7.n()).done;) {
-            const component = _step7.value;
-
-            if (component.type === "formSection") {
-              var _iterator8 = _createForOfIteratorHelper(component.components),
-                  _step8;
-
-              try {
-                for (_iterator8.s(); !(_step8 = _iterator8.n()).done;) {
-                  const fieldset = _step8.value;
-                  fields = fields.concat(fieldset.fields);
-                }
-              } catch (err) {
-                _iterator8.e(err);
-              } finally {
-                _iterator8.f();
-              }
-            }
+    for (const tabPage of tab.tabPages) {
+      for (const component of tabPage.components) {
+        if (component.type === 'formSection') {
+          for (const fieldset of component.components) {
+            fields = fields.concat(fieldset.fields);
           }
-        } catch (err) {
-          _iterator7.e(err);
-        } finally {
-          _iterator7.f();
         }
       }
-    } catch (err) {
-      _iterator6.e(err);
-    } finally {
-      _iterator6.f();
     }
 
     return fields;
   };
 
-  function loadCompleteHandler(_x) {
-    return _loadCompleteHandler.apply(this, arguments);
-  }
-
-  function _loadCompleteHandler() {
-    _loadCompleteHandler = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(id) {
-      var release, allLoaded, _iterator9, _step9, section, _iterator11, _step11, component, fields, _iterator12, _step12, field, _iterator10, _step10, handle, event;
-
-      return regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
-          case 0:
-            if (_Utils.default.isNull(id)) {
-              _context.next = 68;
-              break;
-            }
-
-            _context.next = 3;
-            return mutex.acquire();
-
-          case 3:
-            release = _context.sent;
-            _context.prev = 4;
-
-            if (loadedComponents.includes(id)) {
-              _context.next = 65;
-              break;
-            }
-
-            loadedComponents.push(id);
-            allLoaded = true;
-            _iterator9 = _createForOfIteratorHelper(props.config.sections);
-            _context.prev = 9;
-
-            _iterator9.s();
-
-          case 11:
-            if ((_step9 = _iterator9.n()).done) {
-              _context.next = 55;
-              break;
-            }
-
-            section = _step9.value;
-            _iterator11 = _createForOfIteratorHelper(section.components);
-            _context.prev = 14;
-
-            _iterator11.s();
-
-          case 16:
-            if ((_step11 = _iterator11.n()).done) {
-              _context.next = 43;
-              break;
-            }
-
-            component = _step11.value;
-            fields = null;
-
-            if (component.type === 'tab') {
-              fields = getFieldsFromTab(component);
-            } else if (component.type === 'fieldSet') {
-              fields = component.fields;
-            }
-
-            if (!fields) {
-              _context.next = 39;
-              break;
-            }
-
-            _iterator12 = _createForOfIteratorHelper(fields);
-            _context.prev = 22;
-
-            _iterator12.s();
-
-          case 24:
-            if ((_step12 = _iterator12.n()).done) {
-              _context.next = 31;
-              break;
-            }
-
-            field = _step12.value;
-
-            if (loadedComponents.includes(field.id)) {
-              _context.next = 29;
-              break;
-            }
-
-            allLoaded = false;
-            return _context.abrupt("break", 31);
-
-          case 29:
-            _context.next = 24;
-            break;
-
-          case 31:
-            _context.next = 36;
-            break;
-
-          case 33:
-            _context.prev = 33;
-            _context.t0 = _context["catch"](22);
-
-            _iterator12.e(_context.t0);
-
-          case 36:
-            _context.prev = 36;
-
-            _iterator12.f();
-
-            return _context.finish(36);
-
-          case 39:
-            if (allLoaded) {
-              _context.next = 41;
-              break;
-            }
-
-            return _context.abrupt("break", 43);
-
-          case 41:
-            _context.next = 16;
-            break;
-
-          case 43:
-            _context.next = 48;
-            break;
-
-          case 45:
-            _context.prev = 45;
-            _context.t1 = _context["catch"](14);
-
-            _iterator11.e(_context.t1);
-
-          case 48:
-            _context.prev = 48;
-
-            _iterator11.f();
-
-            return _context.finish(48);
-
-          case 51:
-            if (allLoaded) {
-              _context.next = 53;
-              break;
-            }
-
-            return _context.abrupt("break", 55);
-
-          case 53:
-            _context.next = 11;
-            break;
-
-          case 55:
-            _context.next = 60;
-            break;
-
-          case 57:
-            _context.prev = 57;
-            _context.t2 = _context["catch"](9);
-
-            _iterator9.e(_context.t2);
-
-          case 60:
-            _context.prev = 60;
-
-            _iterator9.f();
-
-            return _context.finish(60);
-
-          case 63:
-            if (allLoaded) {
-              _iterator10 = _createForOfIteratorHelper(fields);
-
-              try {
-                for (_iterator10.s(); !(_step10 = _iterator10.n()).done;) {
-                  field = _step10.value;
-                  handle = field.handle;
-
-                  if (!_Utils.default.isNull(handle)) {
-                    handle.api.handleLoadComplete();
-                  }
-                }
-              } catch (err) {
-                _iterator10.e(err);
-              } finally {
-                _iterator10.f();
-              }
-            }
-
-            if (allLoaded && !_Utils.default.isNull(props.loadCompleteHandler)) {
-              props.loadCompleteHandler(props.config.id);
-              event = new _Event.default(props.handle, props.viewId, null);
-
-              _Observable.default.fireEvent(_EventType.default.COMPONENT_LOAD, event);
-            }
-
-          case 65:
-            _context.prev = 65;
-            release();
-            return _context.finish(65);
-
-          case 68:
-          case "end":
-            return _context.stop();
-        }
-      }, _callee, null, [[4,, 65, 68], [9, 57, 60, 63], [14, 45, 48, 51], [22, 33, 36, 39]]);
-    }));
-    return _loadCompleteHandler.apply(this, arguments);
-  }
-
   const transformDataObject = data => {
     let formValues = null;
 
@@ -823,10 +499,10 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       field.handle.api.clear();
     }
 
-    values.id = null;
+    values.current = {};
 
     if (!_Utils.default.isNull(props.valueChangeHandler)) {
-      props.valueChangeHandler(values);
+      props.valueChangeHandler({});
     }
   }
 
@@ -836,8 +512,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
         data = data.map;
       }
 
-      for (var _i2 = 0, _Object$keys = Object.keys(data); _i2 < _Object$keys.length; _i2++) {
-        const key = _Object$keys[_i2];
+      for (const key of Object.keys(data)) {
         let field = getField(key);
 
         if (!_Utils.default.isNull(field)) {
@@ -852,19 +527,17 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
 
     for (let i = 0; i < fields.length; i++) {
       let field = fields[i];
-
-      let path = _getValuePath(field.id, parsedValues);
-
+      let path = getValuePath(field.id, parsedValues);
       let objectValue = path.valueObject[path.valueProperty];
 
       if (!_Utils.default.isNull(field.handle.api)) {
         path.valueObject[path.valueProperty] = field.handle.api.parseValue(objectValue, true);
       } else {
-        console.error("NULL field reference while parsing form value - " + field.id);
+        console.error('NULL field reference while parsing form value - ' + field.id);
       }
     }
 
-    setValues(parsedValues);
+    values.current = parsedValues;
 
     if (!_Utils.default.isNull(props.dataArrivedHandler)) {
       props.dataArrivedHandler(parsedValues);
@@ -891,7 +564,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     return null;
   };
 
-  const _removeField = id => {
+  const removeField = id => {
     for (let i = 0; i < fields.length; i++) {
       if (fields[i].id === id) {
         fields.splice(i, 1);
@@ -899,9 +572,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     }
   };
 
-  function doValidateParent(field, invalid) {
-    let hasErrors = false;
-
+  function doValidateParent(field, invalid, updateErrors = true) {
     if (!_Utils.default.isNull(field.parentId)) {
       let isParentInvalid = invalid;
 
@@ -911,21 +582,22 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
         }
       }
 
-      hasErrors = hasErrors || isParentInvalid;
       fieldParentErrors[field.parentId] = isParentInvalid;
     }
 
-    if (!_Utils.default.isNull(containerErrorCallback.current) && _ApplicationContext.default.isFormMarkersEnabled()) {
+    if (updateErrors && !_Utils.default.isNull(containerErrorCallback.current) && _ApplicationManager.default.isFormMarkersEnabled()) {
       containerErrorCallback.current(fieldParentErrors);
     }
+
+    return fieldParentErrors;
   }
 
   const validateField = (field, id, value) => {
     if (loadingRef.current === false) {
       field.error = null;
-      let invalid = field.handle.api.validate(_objectSpread(_objectSpread({}, values), {}, {
+      let invalid = field.handle.api.validate({ ...values.current,
         [id]: value
-      }), value) === false;
+      }, value) === false;
       doValidateParent(field, invalid);
       return invalid;
     }
@@ -933,16 +605,16 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     return true;
   };
 
-  const _getValuePath = (id, vals) => {
+  const getValuePath = (id, vals) => {
     let path = {};
     let currentValues = vals;
 
     if (_Utils.default.isNull(vals)) {
-      currentValues = values;
+      currentValues = values.current;
     }
 
     if (!_Utils.default.isNull(currentValues)) {
-      let tokens = id.split(".");
+      let tokens = id.split('.');
 
       if (tokens.length === 1) {
         path.valueObject = currentValues;
@@ -970,7 +642,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
   };
 
   const doHandleChange = (id, value) => {
-    let path = _getValuePath(id, null);
+    let path = getValuePath(id, null);
 
     if (!_Utils.default.isNull(path.valueObject) && !_Utils.default.isNull(path.valueProperty) && loadingRef.current === false) {
       path.valueObject[path.valueProperty] = value;
@@ -987,8 +659,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
           if (!_Utils.default.isNull(validationGroup)) {
             if (field !== groupField && validationGroup === field.handle.api.getValidationGroup()) {
               let groupFieldId = groupField.handle.api.id;
-
-              let gridFieldPath = _getValuePath(groupFieldId, null);
+              let gridFieldPath = getValuePath(groupFieldId, null);
 
               if (!_Utils.default.isNull(gridFieldPath)) {
                 let groupFieldVal = gridFieldPath.valueObject[gridFieldPath.valueProperty];
@@ -1000,20 +671,20 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       }
 
       if (!_Utils.default.isNull(props.valueChangeHandler)) {
-        props.valueChangeHandler(invalid ? null : values, id, value);
+        props.valueChangeHandler(invalid ? null : values.current, id, value);
       }
     }
 
-    let isMarkersEnabled = _ApplicationContext.default.isFormMarkersEnabled();
-
-    _ApplicationContext.default.enableFormMarkers(false);
+    _ApplicationManager.default.enableFormMarkers(false);
 
     _Observable.default.processSystemGeneratedSubscriptions(props.config.id);
 
-    _ApplicationContext.default.enableFormMarkers(isMarkersEnabled);
+    let event = new _Event.default(props.handle, props.viewId, values.current);
+
+    _Observable.default.fireEvent(_EventType.default.VALUE_CHANGE, event);
   };
 
-  const _setFieldError = (id, error) => {
+  const setFieldError = (id, error) => {
     let field = getField(id);
 
     if (!_Utils.default.isNull(field)) {
@@ -1021,14 +692,13 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     }
   };
 
-  const _addField = (id, handle, parentId, bindValueToForm) => {
+  const addField = (id, handle, parentId, bindValueToForm) => {
     let field = getField(id);
     let error = null;
 
     if (!_Utils.default.isNull(field)) {
       error = field.error;
-
-      _removeField(id);
+      removeField(id);
     }
 
     field = {};
@@ -1038,10 +708,15 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
     field.bindValueToForm = bindValueToForm;
     field.parentId = parentId;
     fields.push(field);
+
+    if (values.current) {
+      parseValues(values.current);
+    }
+
     return field;
   };
 
-  const _handleSelectItemChange = (name, options, selectedId) => {
+  const handleSelectItemChange = (name, options, selectedId) => {
     let selectedValue = null;
 
     for (let i = 0; i < options.length; i++) {
@@ -1055,9 +730,9 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
   };
 
   const updateValue = (name, value) => {
-    props.valueChangeHandler(_objectSpread(_objectSpread({}, values), {}, {
+    props.valueChangeHandler({ ...values.current,
       [name]: value
-    }));
+    });
   };
 
   function render(form) {
@@ -1073,12 +748,11 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
         config: section,
         handle: createSectionHandle(section),
         ref: /*#__PURE__*/_react.default.createRef(),
-        loadCompleteHandler: loadCompleteHandler,
         form: () => {
           return !_Utils.default.isNull(props.handle.api) ? props.handle.api : api();
         },
         viewId: props.viewId,
-        values: values
+        values: values.current
       }));
     }));
   }
@@ -1092,7 +766,7 @@ const Form = /*#__PURE__*/_react.default.memo( /*#__PURE__*/_react.default.forwa
       overflow: 'auto',
       maxHeight: '70vh'
     }, props.config) : null
-  }, !_Utils.default.isNull(props.config.id) ? !initializing ? render(props.config) : null : /*#__PURE__*/_react.default.createElement("div", null, "ERROR: A form must have an ID"));
+  }, !_Utils.default.isNull(props.config.id) ? render(props.config) : /*#__PURE__*/_react.default.createElement("div", null, "ERROR: A form must have an ID"));
 }));
 
 var _default = Form;