devextreme-react 23.2.1-alpha-23255-1813 → 23.2.3

package/esm/core/component-base.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -37,16 +37,38 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from) {
+    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
+        to[j] = from[i];
+    return to;
+};
 import * as events from 'devextreme/events';
 import * as React from 'react';
 import { createPortal } from 'react-dom';
-import TemplatesManager from './templates-manager';
-import { TemplatesRenderer } from './templates-renderer';
-import { TemplatesStore } from './templates-store';
+import { requestAnimationFrame } from 'devextreme/animation/frame';
+import { deferUpdate } from 'devextreme/core/utils/common';
+import { TemplateManager } from './template-manager';
 import { OptionsManager, scheduleGuards, unscheduleGuards } from './options-manager';
 import { elementPropNames, getClassName } from './widget-config';
 import { buildConfigTree } from './configuration/react/tree';
 import { isIE } from './configuration/utils';
+import { RemovalLockerContext } from './helpers';
 var DX_REMOVE_EVENT = 'dxremove';
 var ComponentBase = /** @class */ (function (_super) {
     __extends(ComponentBase, _super);
@@ -57,15 +79,10 @@ var ComponentBase = /** @class */ (function (_super) {
         _this._childNodes = [];
         _this.useRequestAnimationFrameFlag = false;
         _this.useDeferUpdateForTemplates = false;
-        _this._setTemplatesRendererRef = _this._setTemplatesRendererRef.bind(_this);
+        _this.guardsUpdateScheduled = false;
         _this._createWidget = _this._createWidget.bind(_this);
-        _this._templatesStore = new TemplatesStore(function () {
-            if (_this._templatesRendererRef) {
-                _this._templatesRendererRef.scheduleUpdate(_this.useDeferUpdateForTemplates);
-            }
-        });
-        _this._templatesManager = new TemplatesManager(_this._templatesStore);
-        _this._optionsManager = new OptionsManager(_this._templatesManager);
+        _this._setTemplateManagerHooks = _this._setTemplateManagerHooks.bind(_this);
+        _this._optionsManager = new OptionsManager();
         return _this;
     }
     ComponentBase.displayContentsStyle = function () {
@@ -83,7 +100,7 @@ var ComponentBase = /** @class */ (function (_super) {
         var _b;
         var style = this.props.style;
         if ((_b = this._childNodes) === null || _b === void 0 ? void 0 : _b.length) {
-            (_a = this._element).append.apply(_a, this._childNodes);
+            (_a = this._element).append.apply(_a, __spreadArray([], __read(this._childNodes)));
         }
         else if (this._element.childNodes.length) {
             this._childNodes = Array.from(this._element.childNodes);
@@ -94,33 +111,60 @@ var ComponentBase = /** @class */ (function (_super) {
         }
     };
     ComponentBase.prototype.componentDidUpdate = function (prevProps) {
+        var _a;
         this._updateCssClasses(prevProps, this.props);
         var config = this._getConfig();
-        this._optionsManager.update(config);
-        if (this._templatesRendererRef) {
-            this._templatesRendererRef.scheduleUpdate(this.useDeferUpdateForTemplates, scheduleGuards);
-        }
-        unscheduleGuards();
+        var templateOptions = this._optionsManager.getTemplateOptions(config);
+        var dxTemplates = ((_a = this._createDXTemplates) === null || _a === void 0 ? void 0 : _a.call(this, templateOptions)) || {};
+        this._optionsManager.update(config, dxTemplates);
+        this._scheduleTemplatesUpdate();
     };
     ComponentBase.prototype.componentWillUnmount = function () {
         var _a;
+        this._lockParentOnRemoved();
         if (this._instance) {
+            var dxRemoveArgs = { isUnmounting: true };
             (_a = this._childNodes) === null || _a === void 0 ? void 0 : _a.forEach(function (child) { var _a; return (_a = child.parentNode) === null || _a === void 0 ? void 0 : _a.removeChild(child); });
-            events.triggerHandler(this._element, DX_REMOVE_EVENT);
+            events.triggerHandler(this._element, DX_REMOVE_EVENT, dxRemoveArgs);
             this._instance.dispose();
         }
         this._optionsManager.dispose();
+        this._unlockParentOnRemoved();
     };
     ComponentBase.prototype._createWidget = function (element) {
+        var _a, _b;
         element = element || this._element;
         var config = this._getConfig();
-        this._instance = new this._WidgetClass(element, __assign({ templatesRenderAsynchronously: true }, this._optionsManager.getInitialOptions(config)));
+        var options = __assign({ templatesRenderAsynchronously: true }, this._optionsManager.getInitialOptions(config));
+        var templateOptions = this._optionsManager.getTemplateOptions(config);
+        var dxTemplates = (_a = this._createDXTemplates) === null || _a === void 0 ? void 0 : _a.call(this, templateOptions);
+        if (dxTemplates && Object.keys(dxTemplates).length) {
+            options = __assign(__assign({}, options), { integrationOptions: {
+                    templates: dxTemplates,
+                } });
+        }
+        (_b = this._clearInstantiationModels) === null || _b === void 0 ? void 0 : _b.call(this);
+        this._instance = new this._WidgetClass(element, options);
         if (!this.useRequestAnimationFrameFlag) {
             this.useDeferUpdateForTemplates = this._instance.option('integrationOptions.useDeferUpdateForTemplates');
         }
         this._optionsManager.setInstance(this._instance, config, this.subscribableOptions, this.independentEvents);
         this._instance.on('optionChanged', this._optionsManager.onOptionChanged);
     };
+    ComponentBase.prototype._scheduleTemplatesUpdate = function () {
+        var _this = this;
+        if (this.guardsUpdateScheduled) {
+            return;
+        }
+        this.guardsUpdateScheduled = true;
+        var updateFunc = this.useDeferUpdateForTemplates ? deferUpdate : requestAnimationFrame;
+        updateFunc(function () {
+            var _a;
+            _this.guardsUpdateScheduled = false;
+            (_a = _this._updateTemplates) === null || _a === void 0 ? void 0 : _a.call(_this, function () { return scheduleGuards(); });
+        });
+        unscheduleGuards();
+    };
     ComponentBase.prototype._getConfig = function () {
         return buildConfigTree({
             templates: this._templateProps,
@@ -129,9 +173,6 @@ var ComponentBase = /** @class */ (function (_super) {
             expectedChildren: this._expectedChildren,
         }, this.props);
     };
-    ComponentBase.prototype._setTemplatesRendererRef = function (instance) {
-        this._templatesRendererRef = instance;
-    };
     ComponentBase.prototype._getElementProps = function () {
         var _this = this;
         var elementProps = {
@@ -148,7 +189,7 @@ var ComponentBase = /** @class */ (function (_super) {
     ComponentBase.prototype._setInlineStyles = function (styles) {
         var _this = this;
         Object.entries(styles).forEach(function (_a) {
-            var name = _a[0], value = _a[1];
+            var _b = __read(_a, 2), name = _b[0], value = _b[1];
             _this._element.style[name] = value;
         });
     };
@@ -162,16 +203,30 @@ var ComponentBase = /** @class */ (function (_super) {
         if (prevClassName) {
             var classNames = prevClassName.split(' ').filter(function (c) { return c; });
             if (classNames.length) {
-                (_a = this._element.classList).remove.apply(_a, classNames);
+                (_a = this._element.classList).remove.apply(_a, __spreadArray([], __read(classNames)));
             }
         }
         if (newClassName) {
             var classNames = newClassName.split(' ').filter(function (c) { return c; });
             if (classNames.length) {
-                (_b = this._element.classList).add.apply(_b, classNames);
+                (_b = this._element.classList).add.apply(_b, __spreadArray([], __read(classNames)));
             }
         }
     };
+    ComponentBase.prototype._lockParentOnRemoved = function () {
+        var _a;
+        (_a = this.context) === null || _a === void 0 ? void 0 : _a.lock();
+    };
+    ComponentBase.prototype._unlockParentOnRemoved = function () {
+        var _a;
+        (_a = this.context) === null || _a === void 0 ? void 0 : _a.unlock();
+    };
+    ComponentBase.prototype._setTemplateManagerHooks = function (_a) {
+        var createDXTemplates = _a.createDXTemplates, clearInstantiationModels = _a.clearInstantiationModels, updateTemplates = _a.updateTemplates;
+        this._createDXTemplates = createDXTemplates;
+        this._clearInstantiationModels = clearInstantiationModels;
+        this._updateTemplates = updateTemplates;
+    };
     ComponentBase.prototype.renderChildren = function () {
         // @ts-expect-error TS2339
         var children = this.props.children;
@@ -194,15 +249,14 @@ var ComponentBase = /** @class */ (function (_super) {
             : this.renderChildren();
     };
     ComponentBase.prototype.renderPortal = function () {
-        // @ts-expect-error TS2322
         return this.portalContainer && createPortal(this.renderChildren(), this.portalContainer);
     };
     ComponentBase.prototype.render = function () {
-        return React.createElement(React.Fragment, {}, React.createElement('div', this._getElementProps(), this.renderContent(), React.createElement(TemplatesRenderer, {
-            templatesStore: this._templatesStore,
-            ref: this._setTemplatesRendererRef,
+        return React.createElement(React.Fragment, {}, React.createElement('div', this._getElementProps(), this.renderContent(), React.createElement(TemplateManager, {
+            init: this._setTemplateManagerHooks,
         })), this.isPortalComponent && this.renderPortal());
     };
+    ComponentBase.contextType = RemovalLockerContext;
     return ComponentBase;
 }(React.PureComponent));
 export { ComponentBase, DX_REMOVE_EVENT, };

package/esm/core/component.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/config.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/configuration/comparer.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/configuration/config-node.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/configuration/react/element.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/configuration/react/templates.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/configuration/react/tree.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/configuration/tree.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/configuration/utils.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/extension-component.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/helpers.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -11,8 +11,83 @@
  * https://github.com/DevExpress/devextreme-react
  */
 
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (_) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+/* eslint-disable max-classes-per-file, no-restricted-syntax */
+import { createContext } from 'react';
+export var RemovalLockerContext = createContext({
+    lock: function () { return undefined; },
+    unlock: function () { return undefined; },
+});
 export function generateID() {
-    return Math.random().toString(36).substr(2);
+    return Math.random().toString(36).substring(2);
 }
 var DoubleKeyMap = /** @class */ (function () {
     function DoubleKeyMap() {
@@ -43,9 +118,85 @@ var DoubleKeyMap = /** @class */ (function () {
             this._map.delete(key1);
         }
     };
+    Object.defineProperty(DoubleKeyMap.prototype, "empty", {
+        get: function () {
+            return this._map.size === 0;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    DoubleKeyMap.prototype.shallowCopy = function () {
+        var copy = new DoubleKeyMap();
+        copy._map = this._map;
+        return copy;
+    };
+    DoubleKeyMap.prototype[Symbol.iterator] = function () {
+        var _a, _b, _c, key1, innerMap, innerMap_1, innerMap_1_1, _d, key2, value, e_1_1, e_2_1;
+        var e_2, _e, e_1, _f;
+        return __generator(this, function (_g) {
+            switch (_g.label) {
+                case 0:
+                    _g.trys.push([0, 11, 12, 13]);
+                    _a = __values(this._map), _b = _a.next();
+                    _g.label = 1;
+                case 1:
+                    if (!!_b.done) return [3 /*break*/, 10];
+                    _c = __read(_b.value, 2), key1 = _c[0], innerMap = _c[1];
+                    _g.label = 2;
+                case 2:
+                    _g.trys.push([2, 7, 8, 9]);
+                    innerMap_1 = (e_1 = void 0, __values(innerMap)), innerMap_1_1 = innerMap_1.next();
+                    _g.label = 3;
+                case 3:
+                    if (!!innerMap_1_1.done) return [3 /*break*/, 6];
+                    _d = __read(innerMap_1_1.value, 2), key2 = _d[0], value = _d[1];
+                    return [4 /*yield*/, [{ key1: key1, key2: key2 }, value]];
+                case 4:
+                    _g.sent();
+                    _g.label = 5;
+                case 5:
+                    innerMap_1_1 = innerMap_1.next();
+                    return [3 /*break*/, 3];
+                case 6: return [3 /*break*/, 9];
+                case 7:
+                    e_1_1 = _g.sent();
+                    e_1 = { error: e_1_1 };
+                    return [3 /*break*/, 9];
+                case 8:
+                    try {
+                        if (innerMap_1_1 && !innerMap_1_1.done && (_f = innerMap_1.return)) _f.call(innerMap_1);
+                    }
+                    finally { if (e_1) throw e_1.error; }
+                    return [7 /*endfinally*/];
+                case 9:
+                    _b = _a.next();
+                    return [3 /*break*/, 1];
+                case 10: return [3 /*break*/, 13];
+                case 11:
+                    e_2_1 = _g.sent();
+                    e_2 = { error: e_2_1 };
+                    return [3 /*break*/, 13];
+                case 12:
+                    try {
+                        if (_b && !_b.done && (_e = _a.return)) _e.call(_a);
+                    }
+                    finally { if (e_2) throw e_2.error; }
+                    return [7 /*endfinally*/];
+                case 13: return [2 /*return*/];
+            }
+        });
+    };
     return DoubleKeyMap;
 }());
 export { DoubleKeyMap };
+var TemplateInstantiationModels = /** @class */ (function (_super) {
+    __extends(TemplateInstantiationModels, _super);
+    function TemplateInstantiationModels() {
+        return _super !== null && _super.apply(this, arguments) || this;
+    }
+    return TemplateInstantiationModels;
+}(DoubleKeyMap));
+export { TemplateInstantiationModels };
 export function capitalizeFirstLetter(text) {
     if (text.length) {
         return "" + text[0].toUpperCase() + text.substr(1);

package/esm/core/nested-option.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *

package/esm/core/options-manager.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.1-alpha-23255-1813
- * Build date: Tue Sep 12 2023
+ * Version: 23.2.3
+ * Build date: Tue Nov 28 2023
  *
  * Copyright (c) 2012 - 2023 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -11,6 +11,27 @@
  * https://github.com/DevExpress/devextreme-react
  */
 
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from) {
+    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
+        to[j] = from[i];
+    return to;
+};
 /* eslint-disable no-restricted-globals */
 import { getChanges } from './configuration/comparer';
 import { buildConfig, findValue, ValueType } from './configuration/tree';
@@ -28,10 +49,9 @@ export function scheduleGuards() {
     });
 }
 var OptionsManager = /** @class */ (function () {
-    function OptionsManager(templatesManager) {
+    function OptionsManager() {
         this.guards = {};
         this.isUpdating = false;
-        this.templatesManager = templatesManager;
         optionsManagers.add(this);
         this.onOptionChanged = this.onOptionChanged.bind(this);
         this.wrapOptionValue = this.wrapOptionValue.bind(this);
@@ -45,21 +65,17 @@ var OptionsManager = /** @class */ (function () {
     OptionsManager.prototype.getInitialOptions = function (rootNode) {
         var _this = this;
         var config = buildConfig(rootNode, false);
-        Object.keys(config.templates).forEach(function (key) {
-            _this.templatesManager.add(key, config.templates[key]);
-        });
         var options = {};
         Object.keys(config.options).forEach(function (key) {
             options[key] = _this.wrapOptionValue(key, config.options[key]);
         });
-        if (this.templatesManager.templatesCount > 0) {
-            options.integrationOptions = {
-                templates: this.templatesManager.templates,
-            };
-        }
         return options;
     };
-    OptionsManager.prototype.update = function (config) {
+    OptionsManager.prototype.getTemplateOptions = function (rootNode) {
+        var config = buildConfig(rootNode, false);
+        return config.templates;
+    };
+    OptionsManager.prototype.update = function (config, dxtemplates) {
         var _this = this;
         var changedOptions = [];
         var optionChangedHandler = function (_a) {
@@ -76,12 +92,9 @@ var OptionsManager = /** @class */ (function () {
         changes.removedOptions.forEach(function (optionName) {
             _this.resetOption(optionName);
         });
-        Object.keys(changes.templates).forEach(function (key) {
-            _this.templatesManager.add(key, changes.templates[key]);
-        });
-        if (this.templatesManager.templatesCount > 0) {
+        if (Object.keys(dxtemplates).length > 0) {
             this.setValue('integrationOptions', {
-                templates: this.templatesManager.templates,
+                templates: dxtemplates,
             });
         }
         Object.keys(changes.options).forEach(function (key) {
@@ -91,7 +104,7 @@ var OptionsManager = /** @class */ (function () {
         this.instance.off('optionChanged', optionChangedHandler);
         this.currentConfig = config;
         changedOptions.forEach(function (_a) {
-            var name = _a[0], value = _a[1];
+            var _b = __read(_a, 2), name = _b[0], value = _b[1];
             var currentPropValue = config.options[name];
             if (Object.prototype.hasOwnProperty.call(config.options, name)
                 && currentPropValue !== value) {
@@ -186,7 +199,7 @@ var OptionsManager = /** @class */ (function () {
                     args[_i] = arguments[_i];
                 }
                 if (!_this.isUpdating || _this.isIndependentEvent(name)) {
-                    value.apply(void 0, args);
+                    value.apply(void 0, __spreadArray([], __read(args)));
                 }
             };
         }