survey-core 1.10.1 → 1.10.3

package/survey.core.js

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.10.1
+ * surveyjs - Survey JavaScript library v1.10.3
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -742,11 +742,12 @@ function createDropdownActionModelAdvanced(actionOptions, listOptions, popupOpti
         }
         listOptions.onSelectionChanged(item);
         innerPopupModel.toggleVisibility();
-    }, listOptions.allowSelection, listOptions.selectedItem, listOptions.onFilterStringChangedCallback);
+    }, listOptions.allowSelection, listOptions.selectedItem);
     listModel.locOwner = locOwner;
-    var innerPopupModel = new _popup__WEBPACK_IMPORTED_MODULE_4__["PopupModel"]("sv-list", { model: listModel }, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.verticalPosition, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.horizontalPosition, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.showPointer, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.isModal, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.onCancel, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.onApply, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.onHide, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.onShow, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.cssClass, popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.title, function () {
-        listModel.dispose();
-    });
+    listModel.setOnFilterStringChangedCallback(listOptions.onFilterStringChangedCallback);
+    var options = popupOptions || {};
+    options.onDispose = function () { listModel.dispose(); };
+    var innerPopupModel = new _popup__WEBPACK_IMPORTED_MODULE_4__["PopupModel"]("sv-list", { model: listModel }, options);
     innerPopupModel.displayMode = popupOptions === null || popupOptions === void 0 ? void 0 : popupOptions.displayMode;
     var newActionOptions = Object.assign({}, actionOptions, {
         component: "sv-action-bar-item-dropdown",
@@ -770,7 +771,6 @@ var BaseAction = /** @class */ (function (_super) {
     function BaseAction() {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.rendredIdValue = BaseAction.getNextRendredId();
-        _this.iconSize = 24;
         return _this;
     }
     BaseAction.getNextRendredId = function () { return BaseAction.renderedId++; };
@@ -973,7 +973,7 @@ var BaseAction = /** @class */ (function (_super) {
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_2__["property"])()
     ], BaseAction.prototype, "iconName", void 0);
     __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_2__["property"])()
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_2__["property"])({ defaultValue: 24 })
     ], BaseAction.prototype, "iconSize", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_2__["property"])()
@@ -994,9 +994,9 @@ var Action = /** @class */ (function (_super) {
         //Object.assign(this, item) to support IE11
         if (!!innerItem) {
             for (var key in innerItem) {
-                if (key !== "locTitle") {
-                    _this[key] = innerItem[key];
-                }
+                if (key === "locTitle" || key === "title" && !!_this.locTitle && !!_this.title)
+                    continue;
+                _this[key] = innerItem[key];
             }
         }
         if (!!_this.locTitleName) {
@@ -1847,6 +1847,8 @@ var Base = /** @class */ (function () {
          * A new value for the property.
          * - `options.oldValue`: `any`\
          * An old value of the property. If the property is an array, `oldValue` contains the same array as `newValue` does.
+         *
+         * If you need to add and remove property change event handlers dynamically, use the [`registerPropertyChangedHandlers`](#registerPropertyChangedHandlers) and [`unregisterPropertyChangedHandlers`](#unregisterPropertyChangedHandlers) methods instead.
          */
         this.onPropertyChanged = this.addEvent();
         /**
@@ -2242,8 +2244,6 @@ var Base = /** @class */ (function () {
      * @param val A new value for the property.
      */
     Base.prototype.setPropertyValue = function (name, val) {
-        if (name) {
-        }
         if (!this.isLoadingFromJson) {
             var prop = this.getPropertyByName(name);
             if (!!prop) {
@@ -2419,9 +2419,11 @@ var Base = /** @class */ (function () {
         return res;
     };
     /**
-     * Registers a function to call when a property value changes.
+     * Registers a single value change handler for one or multiple properties.
+     *
+     * The `registerPropertyChangedHandlers` and [`unregisterPropertyChangedHandlers`](#unregisterPropertyChangedHandlers) methods allow you to manage property change event handlers dynamically. If you only need to attach an event handler without removing it afterwards, you can use the [`onPropertyChanged`](#onPropertyChanged) event instead.
      * @param propertyNames An array of one or multiple property names.
-     * @param handler A function to call when one of the listed properties change.
+     * @param handler A function to call when one of the listed properties change. Accepts a new property value as an argument.
      * @param key *(Optional)* A key that identifies the current registration. If a function for one of the properties is already registered with the same key, the function will be overwritten. You can also use the key to subsequently unregister handlers.
      * @see unregisterPropertyChangedHandlers
      */
@@ -6037,6 +6039,8 @@ var defaultV2Css = {
         selectWrapper: "sv-dropdown_select-wrapper",
         controlValue: "sd-dropdown__value",
         controlDisabled: "sd-input--disabled",
+        controlReadOnly: "sd-input--readonly",
+        controlPreview: "sd-input--preview",
         controlEmpty: "sd-dropdown--empty",
         filterStringInput: "sd-dropdown__filter-string-input",
         chevronButton: "sd-dropdown_chevron-button",
@@ -7366,17 +7370,12 @@ var DragDropDOMAdapter = /** @class */ (function () {
     DragDropDOMAdapter.prototype.getShortcutRightCoordinate = function (currentX, shortcutWidth, shortcutXOffset) {
         return currentX + shortcutWidth - shortcutXOffset;
     };
-    DragDropDOMAdapter.prototype.doScroll = function (clientY, clientX) {
+    DragDropDOMAdapter.prototype.requestAnimationFrame = function (callback) {
+        return requestAnimationFrame(callback);
+    };
+    DragDropDOMAdapter.prototype.scrollByDrag = function (scrollableParentNode, clientY, clientX) {
         var _this = this;
-        cancelAnimationFrame(this.scrollIntervalId);
         var startScrollBoundary = 100;
-        var displayProp = this.draggedElementShortcut.style.display;
-        //this.draggedElementShortcut.hidden = true;
-        this.draggedElementShortcut.style.display = "none";
-        var dragOverNode = this.documentOrShadowRoot.elementFromPoint(clientX, clientY);
-        //this.draggedElementShortcut.hidden = false;
-        this.draggedElementShortcut.style.display = displayProp || "block";
-        var scrollableParentNode = Object(_utils_utils__WEBPACK_IMPORTED_MODULE_0__["findScrollableParent"])(dragOverNode);
         var top;
         var bottom;
         var left;
@@ -7394,21 +7393,36 @@ var DragDropDOMAdapter = /** @class */ (function () {
             right = scrollableParentNode.getBoundingClientRect().right;
         }
         var repeat = function () {
-            if (clientY - top <= startScrollBoundary) {
+            var isTop = clientY - top <= startScrollBoundary;
+            var isBottom = bottom - clientY <= startScrollBoundary;
+            var isLeft = clientX - left <= startScrollBoundary;
+            var isRight = right - clientX <= startScrollBoundary;
+            if (isTop && !isLeft && !isRight) {
                 scrollableParentNode.scrollTop -= 15;
             }
-            else if (bottom - clientY <= startScrollBoundary) {
+            else if (isBottom && !isLeft && !isRight) {
                 scrollableParentNode.scrollTop += 15;
             }
-            else if (right - clientX <= startScrollBoundary) {
+            else if (isRight && !isTop && !isBottom) {
                 scrollableParentNode.scrollLeft += 15;
             }
-            else if (clientX - left <= startScrollBoundary) {
+            else if (isLeft && !isTop && !isBottom) {
                 scrollableParentNode.scrollLeft -= 15;
             }
-            _this.scrollIntervalId = requestAnimationFrame(repeat);
+            _this.scrollIntervalId = _this.requestAnimationFrame(repeat);
         };
-        this.scrollIntervalId = requestAnimationFrame(repeat);
+        this.scrollIntervalId = this.requestAnimationFrame(repeat);
+    };
+    DragDropDOMAdapter.prototype.doScroll = function (clientY, clientX) {
+        cancelAnimationFrame(this.scrollIntervalId);
+        var displayProp = this.draggedElementShortcut.style.display;
+        //this.draggedElementShortcut.hidden = true;
+        this.draggedElementShortcut.style.display = "none";
+        var dragOverNode = this.documentOrShadowRoot.elementFromPoint(clientX, clientY);
+        //this.draggedElementShortcut.hidden = false;
+        this.draggedElementShortcut.style.display = displayProp || "block";
+        var scrollableParentNode = Object(_utils_utils__WEBPACK_IMPORTED_MODULE_0__["findScrollableParent"])(dragOverNode);
+        this.scrollByDrag(scrollableParentNode, clientY, clientX);
     };
     DragDropDOMAdapter.prototype.doStartDrag = function (event, draggedElement, parentElement, draggedElementNode) {
         if (_utils_devices__WEBPACK_IMPORTED_MODULE_1__["IsTouch"]) {
@@ -7702,7 +7716,6 @@ var DragDropRankingChoices = /** @class */ (function (_super) {
         if (!draggedElementShortcut)
             return;
         draggedElementShortcut.className = this.shortcutClass + " sv-ranking-shortcut";
-        draggedElementShortcut.style.cssText = " \n          cursor: grabbing;\n          position: absolute;\n          z-index: 10000;\n          border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));\n          min-width: 100px;\n          max-width: 400px;\n          box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));\n          background-color: var(--sjs-general-backcolor, var(--background, #fff));\n          font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));\n        ";
         var isDeepClone = true;
         var clone = draggedElementNode.cloneNode(isDeepClone);
         draggedElementShortcut.appendChild(clone);
@@ -8097,6 +8110,7 @@ var DropdownListModel = /** @class */ (function (_super) {
         _this.showInputFieldComponent = _this.question.showInputFieldComponent;
         _this.listModel = _this.createListModel();
         _this.updateAfterListModelCreated(_this.listModel);
+        _this.setChoicesLazyLoadEnabled(_this.question.choicesLazyLoadEnabled);
         _this.setSearchEnabled(_this.question.searchEnabled);
         _this.setTextWrapEnabled(_this.question.textWrapEnabled);
         _this.createPopup();
@@ -8159,7 +8173,8 @@ var DropdownListModel = /** @class */ (function (_super) {
     };
     DropdownListModel.prototype.createPopup = function () {
         var _this = this;
-        this._popupModel = new _popup__WEBPACK_IMPORTED_MODULE_5__["PopupModel"]("sv-list", { model: this.listModel }, "bottom", "center", false);
+        var popupOptions = { verticalPosition: "bottom", horizontalPosition: "center", showPointer: false };
+        this._popupModel = new _popup__WEBPACK_IMPORTED_MODULE_5__["PopupModel"]("sv-list", { model: this.listModel }, popupOptions);
         this._popupModel.displayMode = _utils_devices__WEBPACK_IMPORTED_MODULE_9__["IsTouch"] ? "overlay" : "popup";
         this._popupModel.positionMode = "fixed";
         this._popupModel.isFocusedContainer = false;
@@ -8177,6 +8192,7 @@ var DropdownListModel = /** @class */ (function (_super) {
             }
             if (option.isVisible && _this.question.choicesLazyLoadEnabled) {
                 _this.listModel.actions = [];
+                _this.resetItemsSettings();
                 _this.updateQuestionChoices();
             }
             if (option.isVisible && !!_this.question.onOpenedCallBack) {
@@ -8219,7 +8235,6 @@ var DropdownListModel = /** @class */ (function (_super) {
     DropdownListModel.prototype.onHidePopup = function () {
         this.resetFilterString();
         this.question.suggestedItem = null;
-        this.listModel.refresh();
     };
     DropdownListModel.prototype.getAvailableItems = function () {
         return this.question.visibleChoices;
@@ -8247,7 +8262,7 @@ var DropdownListModel = /** @class */ (function (_super) {
                 _this.popupModel.isVisible = false;
             };
         }
-        var res = new _list__WEBPACK_IMPORTED_MODULE_4__["ListModel"](visibleItems, _onSelectionChanged, false, undefined, this.question.choicesLazyLoadEnabled ? this.listModelFilterStringChanged : undefined, this.listElementId);
+        var res = new _list__WEBPACK_IMPORTED_MODULE_4__["ListModel"](visibleItems, _onSelectionChanged, false, undefined, this.listElementId);
         this.setOnTextSearchCallbackForListModel(res);
         res.renderElements = false;
         res.forceShowFilter = true;
@@ -8480,6 +8495,9 @@ var DropdownListModel = /** @class */ (function (_super) {
         this.listModel.showSearchClearButton = _utils_devices__WEBPACK_IMPORTED_MODULE_9__["IsTouch"];
         this.searchEnabled = newValue;
     };
+    DropdownListModel.prototype.setChoicesLazyLoadEnabled = function (newValue) {
+        this.listModel.setOnFilterStringChangedCallback(newValue ? this.listModelFilterStringChanged : undefined);
+    };
     DropdownListModel.prototype.updateItems = function () {
         this.listModel.setItems(this.getAvailableItems());
     };
@@ -8499,9 +8517,6 @@ var DropdownListModel = /** @class */ (function (_super) {
         if (options.name == "value") {
             this.showInputFieldComponent = this.question.showInputFieldComponent;
         }
-        if (options.name == "choicesLazyLoadEnabled" && options.newValue) {
-            this.listModel.setOnFilterStringChangedCallback(this.listModelFilterStringChanged);
-        }
         if (options.name == "textWrapEnabled") {
             this.setTextWrapEnabled(options.newValue);
         }
@@ -8830,7 +8845,7 @@ var DropdownMultiSelectListModel = /** @class */ (function (_super) {
                 }
             };
         }
-        var res = new _multiSelectListModel__WEBPACK_IMPORTED_MODULE_3__["MultiSelectListModel"](visibleItems, _onSelectionChanged, false, undefined, this.question.choicesLazyLoadEnabled ? this.listModelFilterStringChanged : undefined, this.listElementId);
+        var res = new _multiSelectListModel__WEBPACK_IMPORTED_MODULE_3__["MultiSelectListModel"](visibleItems, _onSelectionChanged, false, undefined, this.listElementId);
         res.actions.forEach(function (a) { return a.disableTabStop = true; });
         this.setOnTextSearchCallbackForListModel(res);
         res.forceShowFilter = true;
@@ -9694,8 +9709,8 @@ __webpack_require__.r(__webpack_exports__);
 
 var Version;
 var ReleaseDate;
-Version = "" + "1.10.1";
-ReleaseDate = "" + "2024-04-25";
+Version = "" + "1.10.3";
+ReleaseDate = "" + "2024-05-07";
 function checkLibraryVersion(ver, libraryName) {
     if (Version != ver) {
         var str = "survey-core has version '" + Version + "' and " + libraryName
@@ -19221,10 +19236,18 @@ var JsonMetadata = /** @class */ (function () {
         return metaClass.getAllProperties();
     };
     JsonMetadata.prototype.getPropertiesByObj = function (obj) {
-        if (!obj || !obj.getType)
+        var type = !!obj && !!obj.getType ? obj.getType() : undefined;
+        if (!type)
             return [];
-        var props = this.getProperties(obj.getType());
+        var props = this.getProperties(type);
         var dynamicProps = this.getDynamicPropertiesByObj(obj);
+        for (var i = dynamicProps.length - 1; i >= 0; i--) {
+            if (this.findProperty(type, dynamicProps[i].name)) {
+                dynamicProps.splice(i, 1);
+            }
+        }
+        if (dynamicProps.length === 0)
+            return props;
         return [].concat(props).concat(dynamicProps);
     };
     JsonMetadata.prototype.addDynamicPropertiesIntoObj = function (dest, src, props) {
@@ -19935,7 +19958,7 @@ var JsonObject = /** @class */ (function () {
         this.removePosFromObj(value);
     };
     JsonObject.prototype.removePosFromObj = function (obj) {
-        if (!obj)
+        if (!obj || typeof obj.getType === "function")
             return;
         if (Array.isArray(obj)) {
             for (var i = 0; i < obj.length; i++) {
@@ -20152,11 +20175,10 @@ var defaultListCss = {
 };
 var ListModel = /** @class */ (function (_super) {
     __extends(ListModel, _super);
-    function ListModel(items, onSelectionChanged, allowSelection, selectedItem, onFilterStringChangedCallback, elementId) {
+    function ListModel(items, onSelectionChanged, allowSelection, selectedItem, elementId) {
         var _this = _super.call(this) || this;
         _this.onSelectionChanged = onSelectionChanged;
         _this.allowSelection = allowSelection;
-        _this.onFilterStringChangedCallback = onFilterStringChangedCallback;
         _this.elementId = elementId;
         _this.onItemClick = function (itemValue) {
             if (_this.isItemDisabled(itemValue)) {
@@ -21156,7 +21178,7 @@ var englishStrings = {
     questionsProgressText: "Answered {0}/{1} questions",
     emptySurvey: "The survey doesn't contain any visible elements.",
     completingSurvey: "Thank you for completing the survey",
-    completingSurveyBefore: "Our records show that you have already completed this survey.",
+    completingSurveyBefore: "You have already completed this survey.",
     loadingSurvey: "Loading Survey...",
     placeholder: "Select...",
     ratingOptionsCaption: "Select...",
@@ -21206,7 +21228,7 @@ var englishStrings = {
     savingData: "The results are being saved on the server...",
     savingDataError: "An error occurred and we could not save the results.",
     savingDataSuccess: "The results were saved successfully!",
-    savingExceedSize: "Your response exceeds 64KB. Please reduce the size of your file(s) and try again or contact a survey owner.",
+    savingExceedSize: "Your response exceeds 64KB. Please reduce the size of your file(s) and try again or contact the survey owner.",
     saveAgainButton: "Try again",
     timerMin: "min",
     timerSec: "sec",
@@ -23272,8 +23294,8 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
 
 var MultiSelectListModel = /** @class */ (function (_super) {
     __extends(MultiSelectListModel, _super);
-    function MultiSelectListModel(items, onSelectionChanged, allowSelection, selectedItems, onFilterStringChangedCallback, elementId) {
-        var _this = _super.call(this, items, onSelectionChanged, allowSelection, undefined, onFilterStringChangedCallback, elementId) || this;
+    function MultiSelectListModel(items, onSelectionChanged, allowSelection, selectedItems, elementId) {
+        var _this = _super.call(this, items, onSelectionChanged, allowSelection, undefined, elementId) || this;
         _this.onItemClick = function (item) {
             if (_this.isItemDisabled(item))
                 return;
@@ -23507,7 +23529,6 @@ var PageModel = /** @class */ (function (_super) {
                 return _this.num + ". " + text;
             return text;
         };
-        _this.createLocalizableString("navigationTitle", _this, true);
         _this.createLocalizableString("navigationDescription", _this, true);
         _this.dragDropPageHelper = new _drag_drop_page_helper_v1__WEBPACK_IMPORTED_MODULE_3__["DragDropPageHelperV1"](_this);
         return _this;
@@ -23546,13 +23567,6 @@ var PageModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(PageModel.prototype, "locNavigationTitle", {
-        get: function () {
-            return this.getLocalizableString("navigationTitle");
-        },
-        enumerable: false,
-        configurable: true
-    });
     Object.defineProperty(PageModel.prototype, "navigationDescription", {
         /**
          * Explanatory text displayed under a navigation button in the progress bar. Applies when the [progress bar is visible](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#showProgressBar), `SurveyModel`'s [`progressBarType`](https://surveyjs.io/form-library/documentation/surveymodel#progressBarType) is set to `"pages"`, and [`progressBarShowPageTitles`](https://surveyjs.io/form-library/documentation/surveymodel#progressBarShowPageTitles) is `true`.
@@ -23574,16 +23588,12 @@ var PageModel = /** @class */ (function (_super) {
         configurable: true
     });
     PageModel.prototype.navigationLocStrChanged = function () {
+        if (this.locNavigationTitle.isEmpty) {
+            this.locTitle.strChanged();
+        }
         this.locNavigationTitle.strChanged();
         this.locNavigationDescription.strChanged();
     };
-    Object.defineProperty(PageModel.prototype, "renderedNavigationTitle", {
-        get: function () {
-            return this.locNavigationTitle.renderedHtml || this.title || this.name;
-        },
-        enumerable: false,
-        configurable: true
-    });
     Object.defineProperty(PageModel.prototype, "passed", {
         get: function () {
             return this.getPropertyValue("passed", false);
@@ -24225,6 +24235,9 @@ var PanelModelBase = /** @class */ (function (_super) {
         _this.addExpressionProperty("enableIf", function (obj, res) { _this.readOnly = res === false; });
         _this.addExpressionProperty("requiredIf", function (obj, res) { _this.isRequired = res === true; });
         _this.createLocalizableString("requiredErrorText", _this);
+        _this.createLocalizableString("navigationTitle", _this, true).onGetTextCallback = function (text) {
+            return text || _this.title || _this.name;
+        };
         _this.registerPropertyChangedHandlers(["questionTitleLocation"], function () {
             _this.onVisibleChanged.bind(_this);
             _this.updateElementCss(true);
@@ -24341,9 +24354,22 @@ var PanelModelBase = /** @class */ (function (_super) {
             this.elements[i].locStrsChanged();
         }
     };
+    PanelModelBase.prototype.getMarkdownHtml = function (text, name) {
+        if (name === "navigationTitle" && this.locNavigationTitle.isEmpty) {
+            return this.locTitle.renderedHtml || this.name;
+        }
+        return _super.prototype.getMarkdownHtml.call(this, text, name);
+    };
+    Object.defineProperty(PanelModelBase.prototype, "locNavigationTitle", {
+        get: function () {
+            return this.getLocalizableString("navigationTitle");
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(PanelModelBase.prototype, "renderedNavigationTitle", {
         get: function () {
-            return this.title || this.name;
+            return this.locNavigationTitle.renderedHtml;
         },
         enumerable: false,
         configurable: true
@@ -24855,7 +24881,7 @@ var PanelModelBase = /** @class */ (function (_super) {
         if (rec.result !== true)
             rec.result = false;
         this.hasErrorsCore(rec);
-        if (rec.firstErrorQuestion) {
+        if (rec.focuseOnFirstError && rec.firstErrorQuestion) {
             rec.firstErrorQuestion.focus(true);
         }
         return !rec.result;
@@ -27176,14 +27202,30 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _popup__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./popup */ "./src/popup.ts");
 /* harmony import */ var _popup_dropdown_view_model__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./popup-dropdown-view-model */ "./src/popup-dropdown-view-model.ts");
 /* harmony import */ var _popup_modal_view_model__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./popup-modal-view-model */ "./src/popup-modal-view-model.ts");
+var __assign = (undefined && undefined.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 
 
 
 
 function createPopupModalViewModel(options, rootElement) {
     var _a;
-    var popupModel = new _popup__WEBPACK_IMPORTED_MODULE_1__["PopupModel"](options.componentName, options.data, "top", "left", false, true, options.onCancel, options.onApply, options.onHide, options.onShow, options.cssClass, options.title);
-    popupModel.displayMode = options.displayMode || "popup";
+    var popupOptions = __assign({}, options);
+    popupOptions.verticalPosition = "top";
+    popupOptions.horizontalPosition = "left";
+    popupOptions.showPointer = false;
+    popupOptions.isModal = true;
+    popupOptions.displayMode = options.displayMode || "popup";
+    var popupModel = new _popup__WEBPACK_IMPORTED_MODULE_1__["PopupModel"](options.componentName, options.data, popupOptions);
     popupModel.isFocusedContent = (_a = options.isFocusedContent) !== null && _a !== void 0 ? _a : true;
     var popupViewModel = new _popup_modal_view_model__WEBPACK_IMPORTED_MODULE_3__["PopupModalViewModel"](popupModel);
     if (!!rootElement && !!rootElement.appendChild) {
@@ -27687,36 +27729,29 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
 
 var PopupModel = /** @class */ (function (_super) {
     __extends(PopupModel, _super);
-    function PopupModel(contentComponentName, contentComponentData, verticalPosition, horizontalPosition, showPointer, isModal, onCancel, onApply, onHide, onShow, cssClass, title, onDispose) {
-        if (verticalPosition === void 0) { verticalPosition = "bottom"; }
-        if (horizontalPosition === void 0) { horizontalPosition = "left"; }
-        if (showPointer === void 0) { showPointer = true; }
-        if (isModal === void 0) { isModal = false; }
-        if (onCancel === void 0) { onCancel = function () { }; }
-        if (onApply === void 0) { onApply = function () { return true; }; }
-        if (onHide === void 0) { onHide = function () { }; }
-        if (onShow === void 0) { onShow = function () { }; }
-        if (cssClass === void 0) { cssClass = ""; }
-        if (title === void 0) { title = ""; }
-        if (onDispose === void 0) { onDispose = function () { }; }
+    function PopupModel(contentComponentName, contentComponentData, option1, option2) {
         var _this = _super.call(this) || this;
-        _this.onDispose = onDispose;
         _this.focusFirstInputSelector = "";
+        _this.onCancel = function () { };
+        _this.onApply = function () { return true; };
+        _this.onHide = function () { };
+        _this.onShow = function () { };
+        _this.onDispose = function () { };
         _this.onVisibilityChanged = _this.addEvent();
         _this.onFooterActionsCreated = _this.addEvent();
         _this.onRecalculatePosition = _this.addEvent();
         _this.contentComponentName = contentComponentName;
         _this.contentComponentData = contentComponentData;
-        _this.verticalPosition = verticalPosition;
-        _this.horizontalPosition = horizontalPosition;
-        _this.showPointer = showPointer;
-        _this.isModal = isModal;
-        _this.onCancel = onCancel;
-        _this.onApply = onApply;
-        _this.onHide = onHide;
-        _this.onShow = onShow;
-        _this.cssClass = cssClass;
-        _this.title = title;
+        if (!!option1 && typeof option1 === "string") {
+            _this.verticalPosition = option1;
+            _this.horizontalPosition = option2;
+        }
+        else if (!!option1) {
+            var popupOptions = option1;
+            for (var key in popupOptions) {
+                _this[key] = popupOptions[key];
+            }
+        }
         return _this;
     }
     PopupModel.prototype.refreshInnerModel = function () {
@@ -27772,7 +27807,7 @@ var PopupModel = /** @class */ (function (_super) {
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: "left" })
     ], PopupModel.prototype, "horizontalPosition", void 0);
     __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: false })
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: true })
     ], PopupModel.prototype, "showPointer", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: false })
@@ -27783,18 +27818,6 @@ var PopupModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: true })
     ], PopupModel.prototype, "isFocusedContainer", void 0);
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: function () { } })
-    ], PopupModel.prototype, "onCancel", void 0);
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: function () { return true; } })
-    ], PopupModel.prototype, "onApply", void 0);
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: function () { } })
-    ], PopupModel.prototype, "onHide", void 0);
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: function () { } })
-    ], PopupModel.prototype, "onShow", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: "" })
     ], PopupModel.prototype, "cssClass", void 0);
@@ -30953,7 +30976,6 @@ var Question = /** @class */ (function (_super) {
     };
     Question.prototype.isDefaultRendering = function () {
         return (!!this.customWidget ||
-            this.renderAs === "default" ||
             this.getComponentName() === "default");
     };
     //ISurveyErrorOwner
@@ -31777,7 +31799,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         return "itemvalue";
     };
     QuestionSelectBase.prototype.createItemValue = function (value, text) {
-        var res = _jsonobject__WEBPACK_IMPORTED_MODULE_0__["Serializer"].createClass(this.getItemValueType(), value);
+        var res = _jsonobject__WEBPACK_IMPORTED_MODULE_0__["Serializer"].createClass(this.getItemValueType(), { value: value });
         res.locOwner = this;
         if (!!text)
             res.text = text;
@@ -32231,7 +32253,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
     QuestionSelectBase.prototype.canSurveyChangeItemVisibility = function () {
         return !!this.survey && this.survey.canChangeChoiceItemsVisibility();
     };
-    QuestionSelectBase.prototype.changeItemVisisbility = function () {
+    QuestionSelectBase.prototype.changeItemVisibility = function () {
         var _this = this;
         return this.canSurveyChangeItemVisibility() ?
             function (item, val) { return _this.survey.getChoiceItemVisibility(_this, item, val); }
@@ -32239,7 +32261,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
     };
     QuestionSelectBase.prototype.runConditionsForItems = function (values, properties) {
         this.filteredChoicesValue = [];
-        var calcVisibility = this.changeItemVisisbility();
+        var calcVisibility = this.changeItemVisibility();
         return _itemvalue__WEBPACK_IMPORTED_MODULE_3__["ItemValue"].runConditionsForItems(this.activeChoices, this.getFilteredChoices(), this.areInvisibleElementsShowing
             ? null
             : this.conditionChoicesVisibleIfRunner, values, properties, !this.survey || !this.survey.areInvisibleElementsShowing, function (item, val) {
@@ -32897,7 +32919,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
     QuestionSelectBase.prototype.canShowOptionItem = function (item, isAddAll, hasItem) {
         var res = (isAddAll && (!!this.canShowOptionItemCallback ? this.canShowOptionItemCallback(item) : true)) || hasItem;
         if (this.canSurveyChangeItemVisibility()) {
-            var calc = this.changeItemVisisbility();
+            var calc = this.changeItemVisibility();
             return calc(item, res);
         }
         return res;
@@ -33445,8 +33467,8 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         var superVal = _super.prototype.isVisibleCore.call(this);
         if (!this.hideIfChoicesEmpty || !superVal)
             return superVal;
-        var filteredChoices = this.getFilteredChoices();
-        return !filteredChoices || filteredChoices.length > 0;
+        var choices = this.isUsingCarryForward ? this.visibleChoices : this.getFilteredChoices();
+        return !choices || choices.length > 0;
     };
     QuestionSelectBase.prototype.sortVisibleChoices = function (array) {
         if (this.isDesignMode)
@@ -34166,6 +34188,7 @@ var QuestionBooleanModel = /** @class */ (function (_super) {
             this.value = val == true ? this.getValueTrue() : this.getValueFalse();
             this.booleanValueRendered = val;
         }
+        this.updateThumbMargin();
     };
     Object.defineProperty(QuestionBooleanModel.prototype, "defaultValue", {
         get: function () {
@@ -34205,6 +34228,27 @@ var QuestionBooleanModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    QuestionBooleanModel.prototype.updateThumbMargin = function () {
+        var _this = this;
+        if (!this.isIndeterminate && this.leftAnswerElement) {
+            if (!this.swapOrder && this.value === this.getValueTrue() || this.swapOrder && this.value === this.getValueFalse()) {
+                var el_1 = this.leftAnswerElement;
+                setTimeout(function () {
+                    _this.thumbMargin = el_1.clientWidth + (_this.swapOrder ? 4 : 2) + "px";
+                }, 50);
+            }
+        }
+        this.thumbMargin = undefined;
+    };
+    QuestionBooleanModel.prototype.afterRender = function (el) {
+        _super.prototype.afterRender.call(this, el);
+        this.leftAnswerElement = el.querySelectorAll("." + this.cssClasses.sliderGhost)[0];
+        this.updateThumbMargin();
+    };
+    QuestionBooleanModel.prototype.beforeDestroyQuestionElement = function (el) {
+        _super.prototype.beforeDestroyQuestionElement.call(this, el);
+        this.leftAnswerElement = undefined;
+    };
     Object.defineProperty(QuestionBooleanModel.prototype, "isLabelRendered", {
         get: function () {
             return this.titleLocation === "hidden";
@@ -34475,6 +34519,12 @@ var QuestionBooleanModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
     ], QuestionBooleanModel.prototype, "booleanValueRendered", void 0);
+    __decorate([
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
+    ], QuestionBooleanModel.prototype, "leftAnswerElement", void 0);
+    __decorate([
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
+    ], QuestionBooleanModel.prototype, "thumbMargin", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
     ], QuestionBooleanModel.prototype, "showTitle", void 0);
@@ -35408,7 +35458,7 @@ var QuestionCheckboxModel = /** @class */ (function (_super) {
     QuestionCheckboxModel.prototype.getConditionJson = function (operator, path) {
         if (operator === void 0) { operator = null; }
         if (path === void 0) { path = null; }
-        var json = _super.prototype.getConditionJson.call(this);
+        var json = _super.prototype.getConditionJson.call(this, operator, path);
         if (operator == "contains" || operator == "notcontains") {
             json["type"] = "radiogroup";
         }
@@ -37335,7 +37385,13 @@ var QuestionDropdownModel = /** @class */ (function (_super) {
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: "" })
     ], QuestionDropdownModel.prototype, "readOnlyText", void 0);
     __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])()
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({
+            onSet: function (newValue, target) {
+                if (!!target.dropdownListModel) {
+                    target.dropdownListModel.setChoicesLazyLoadEnabled(newValue);
+                }
+            }
+        })
     ], QuestionDropdownModel.prototype, "choicesLazyLoadEnabled", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])()
@@ -38236,6 +38292,7 @@ var QuestionFileModel = /** @class */ (function (_super) {
             }
         };
         _this.createLocalizableString("takePhotoCaption", _this, false, true);
+        _this.createLocalizableString("clearCaption", _this, false, true);
         _this.actionsContainer = new _actions_container__WEBPACK_IMPORTED_MODULE_7__["ActionContainer"]();
         _this.actionsContainer.locOwner = _this;
         _this.fileIndexAction = new _actions_action__WEBPACK_IMPORTED_MODULE_8__["Action"]({
@@ -38312,7 +38369,7 @@ var QuestionFileModel = /** @class */ (function (_super) {
             iconName: "icon-clear",
             id: "sv-file-clean",
             iconSize: "auto",
-            title: new _base__WEBPACK_IMPORTED_MODULE_3__["ComputedUpdater"](function () { return _this.clearButtonCaption; }),
+            locTitle: _this.locClearButtonCaption,
             showTitle: false,
             enabledIf: function () { return !_this.isInputReadOnly; },
             innerCss: new _base__WEBPACK_IMPORTED_MODULE_3__["ComputedUpdater"](function () { return _this.cssClasses.removeButton; }),
@@ -38624,6 +38681,23 @@ var QuestionFileModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(QuestionFileModel.prototype, "clearButtonCaption", {
+        get: function () {
+            return this.getLocalizableStringText("clearCaption");
+        },
+        set: function (value) {
+            this.setLocalizableStringText("clearCaption", value);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(QuestionFileModel.prototype, "locClearButtonCaption", {
+        get: function () {
+            return this.getLocalizableString("clearCaption");
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(QuestionFileModel.prototype, "locRenderedPlaceholder", {
         get: function () {
             var _this = this;
@@ -39199,9 +39273,6 @@ var QuestionFileModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ localizable: { defaultStr: "replaceFileCaption" } })
     ], QuestionFileModel.prototype, "replaceButtonCaption", void 0);
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ localizable: { defaultStr: "clearCaption" } })
-    ], QuestionFileModel.prototype, "clearButtonCaption", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ localizable: { defaultStr: "removeFileCaption" } })
     ], QuestionFileModel.prototype, "removeFileCaption", void 0);
@@ -40223,6 +40294,9 @@ var QuestionImagePickerModel = /** @class */ (function (_super) {
     QuestionImagePickerModel.prototype.needResponsiveness = function () {
         return this.supportResponsiveness() && this.isDefaultV2Theme;
     };
+    QuestionImagePickerModel.prototype.needResponsiveWidth = function () {
+        return this.colCount > 2;
+    };
     QuestionImagePickerModel.prototype.getCurrentColCount = function () {
         if (this.responsiveColCount === undefined || this.colCount === 0) {
             return this.colCount;
@@ -40454,6 +40528,9 @@ var MatrixRowModel = /** @class */ (function (_super) {
             if (_this.data)
                 _this.data.onMatrixRowChanged(_this);
         });
+        if (_this.data && _this.data.hasErrorInRow(_this)) {
+            _this.hasError = true;
+        }
         return _this;
     }
     Object.defineProperty(MatrixRowModel.prototype, "name", {
@@ -40504,11 +40581,21 @@ var MatrixRowModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(MatrixRowModel.prototype, "hasError", {
+        get: function () {
+            return this.getPropertyValue("hasError", false);
+        },
+        set: function (val) {
+            this.setPropertyValue("hasError", val);
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(MatrixRowModel.prototype, "rowClasses", {
         get: function () {
             var cssClasses = this.data.cssClasses;
             return new _utils_cssClassBuilder__WEBPACK_IMPORTED_MODULE_11__["CssClassBuilder"]().append(cssClasses.row)
-                .append(cssClasses.rowError, this.data.hasErrorInRow(this))
+                .append(cssClasses.rowError, this.hasError)
                 .append(cssClasses.rowReadOnly, this.isReadOnly)
                 .append(cssClasses.rowDisabled, this.data.isDisabledStyle)
                 .toString();
@@ -40834,7 +40921,7 @@ var QuestionMatrixModel = /** @class */ (function (_super) {
         return new _utils_cssClassBuilder__WEBPACK_IMPORTED_MODULE_11__["CssClassBuilder"]()
             .append(css.cell, hasCellText)
             .append(hasCellText ? css.cellText : css.label)
-            .append(css.itemOnError, !hasCellText && (this.isAllRowRequired ? this.hasErrorInRow(row) : this.hasCssError()))
+            .append(css.itemOnError, !hasCellText && (this.isAllRowRequired || this.eachRowUnique ? row.hasError : this.hasCssError()))
             .append(hasCellText ? css.cellTextSelected : css.itemChecked, isChecked)
             .append(hasCellText ? css.cellTextDisabled : css.itemDisabled, this.isDisabledStyle)
             .append(hasCellText ? css.cellTextReadOnly : css.itemReadOnly, this.isReadOnlyStyle)
@@ -40964,72 +41051,76 @@ var QuestionMatrixModel = /** @class */ (function (_super) {
         return loc ? loc : this.emptyLocalizableString;
     };
     QuestionMatrixModel.prototype.supportGoNextPageAutomatic = function () {
-        return this.isMouseDown === true && this.hasValuesInAllRows(false);
+        return this.isMouseDown === true && this.hasValuesInAllRows();
     };
     QuestionMatrixModel.prototype.onCheckForErrors = function (errors, isOnValueChanged) {
         _super.prototype.onCheckForErrors.call(this, errors, isOnValueChanged);
-        this.errorsInRow = undefined;
         if (!isOnValueChanged || this.hasCssError()) {
-            if (this.hasErrorAllRowsRequired()) {
+            var rowsErrors = { noValue: false, isNotUnique: false };
+            this.checkErrorsAllRows(true, rowsErrors);
+            if (rowsErrors.noValue) {
                 errors.push(new _error__WEBPACK_IMPORTED_MODULE_6__["RequiredInAllRowsError"](null, this));
             }
-            if (this.hasErrorEachRowUnique()) {
+            if (rowsErrors.isNotUnique) {
                 errors.push(new _error__WEBPACK_IMPORTED_MODULE_6__["EachRowUniqueError"](null, this));
             }
         }
     };
-    QuestionMatrixModel.prototype.hasErrorAllRowsRequired = function () {
-        return this.isAllRowRequired && !this.hasValuesInAllRows(true);
-    };
-    QuestionMatrixModel.prototype.hasErrorEachRowUnique = function () {
-        return this.eachRowUnique && this.hasNonUniqueValueInRow();
+    QuestionMatrixModel.prototype.hasValuesInAllRows = function () {
+        var rowsErrors = { noValue: false, isNotUnique: false };
+        this.checkErrorsAllRows(false, rowsErrors, true);
+        return !rowsErrors.noValue;
     };
-    QuestionMatrixModel.prototype.hasValuesInAllRows = function (addError) {
+    QuestionMatrixModel.prototype.checkErrorsAllRows = function (modifyErrors, res, allRowsRequired) {
+        var _this = this;
         var rows = this.generatedVisibleRows;
         if (!rows)
             rows = this.visibleRows;
         if (!rows)
-            return true;
-        var res = true;
-        for (var i = 0; i < rows.length; i++) {
-            var row = rows[i];
-            var hasValue = !this.isValueEmpty(row.value);
-            if (addError && !hasValue) {
-                this.addErrorIntoRow(row);
-            }
-            res = res && hasValue;
+            return;
+        var rowsRequired = this.isAllRowRequired || allRowsRequired;
+        var rowsUnique = this.eachRowUnique;
+        res.noValue = false;
+        res.isNotUnique = false;
+        if (modifyErrors) {
+            this.errorsInRow = undefined;
         }
-        return res;
-    };
-    QuestionMatrixModel.prototype.hasNonUniqueValueInRow = function () {
-        var rows = this.generatedVisibleRows;
-        if (!rows)
-            rows = this.visibleRows;
-        if (!rows)
-            return false;
+        if (!rowsRequired && !rowsUnique)
+            return;
         var hash = {};
-        var res = true;
         for (var i = 0; i < rows.length; i++) {
             var val = rows[i].value;
             var isEmpty = this.isValueEmpty(val);
-            var isUnique = isEmpty || hash[val] !== true;
-            if (!isUnique) {
+            var isNotUnique = rowsUnique && (!isEmpty && hash[val] === true);
+            isEmpty = isEmpty && rowsRequired;
+            if (modifyErrors && (isEmpty || isNotUnique)) {
                 this.addErrorIntoRow(rows[i]);
             }
-            res = res && isUnique;
             if (!isEmpty) {
                 hash[val] = true;
             }
+            res.noValue = res.noValue || isEmpty;
+            res.isNotUnique = res.isNotUnique || isNotUnique;
+        }
+        if (modifyErrors) {
+            rows.forEach(function (row) {
+                row.hasError = _this.hasErrorInRow(row);
+            });
         }
-        return !res;
     };
     QuestionMatrixModel.prototype.addErrorIntoRow = function (row) {
         if (!this.errorsInRow)
             this.errorsInRow = {};
         this.errorsInRow[row.name] = true;
+        row.hasError = true;
+    };
+    QuestionMatrixModel.prototype.refreshRowsErrors = function () {
+        if (!this.errorsInRow)
+            return;
+        this.checkErrorsAllRows(true, { noValue: false, isNotUnique: false });
     };
     QuestionMatrixModel.prototype.getIsAnswered = function () {
-        return _super.prototype.getIsAnswered.call(this) && this.hasValuesInAllRows(false);
+        return _super.prototype.getIsAnswered.call(this) && this.hasValuesInAllRows();
     };
     QuestionMatrixModel.prototype.createMatrixRow = function (item, fullName, value) {
         var row = new MatrixRowModel(item, fullName, this, value);
@@ -41058,6 +41149,7 @@ var QuestionMatrixModel = /** @class */ (function (_super) {
                 this.generatedVisibleRows[i].setValueDirectly(rowVal);
             }
         }
+        this.refreshRowsErrors();
         this.updateIsAnswered();
         this.isRowChanging = false;
     };
@@ -41125,7 +41217,7 @@ var QuestionMatrixModel = /** @class */ (function (_super) {
         if (operator === void 0) { operator = null; }
         if (path === void 0) { path = null; }
         if (!path)
-            return _super.prototype.getConditionJson.call(this);
+            return _super.prototype.getConditionJson.call(this, operator);
         var question = new _question_dropdown__WEBPACK_IMPORTED_MODULE_9__["QuestionDropdownModel"](path);
         question.choices = this.columns;
         var json = new _jsonobject__WEBPACK_IMPORTED_MODULE_3__["JsonObject"]().toJsonObject(question);
@@ -42962,7 +43054,7 @@ var QuestionMatrixDropdownModelBase = /** @class */ (function (_super) {
         if (operator === void 0) { operator = null; }
         if (path === void 0) { path = null; }
         if (!path)
-            return _super.prototype.getConditionJson.call(this);
+            return _super.prototype.getConditionJson.call(this, operator);
         var columnName = "";
         for (var i = path.length - 1; i >= 0; i--) {
             if (path[i] == ".")
@@ -48387,7 +48479,7 @@ var QuestionMultipleTextModel = /** @class */ (function (_super) {
         if (operator === void 0) { operator = null; }
         if (path === void 0) { path = null; }
         if (!path)
-            return _super.prototype.getConditionJson.call(this);
+            return _super.prototype.getConditionJson.call(this, operator);
         var item = this.getItemByName(path);
         if (!item)
             return null;
@@ -49646,14 +49738,23 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
     });
     QuestionPanelDynamicModel.prototype.getPanelsAnimationOptions = function () {
         var _this = this;
-        var getDirection = function () {
+        var getDirectionCssClass = function () {
             if (_this.isRenderModeList)
                 return "";
+            var cssClass = new _utils_cssClassBuilder__WEBPACK_IMPORTED_MODULE_10__["CssClassBuilder"]();
+            var isRemoving = false;
             var leavingPanel = _this.renderedPanels.filter(function (el) { return el !== _this.currentPanel; })[0];
             var leavingPanelIndex = _this.visiblePanels.indexOf(leavingPanel);
-            if (leavingPanelIndex < 0)
+            if (leavingPanelIndex < 0) {
+                isRemoving = true;
                 leavingPanelIndex = _this.removedPanelIndex;
-            return leavingPanelIndex > _this.currentIndex ? "-right" : "-left";
+            }
+            return cssClass
+                .append("sv-pd-animation-adding", !!_this.focusNewPanelCallback)
+                .append("sv-pd-animation-removing", isRemoving)
+                .append("sv-pd-animation-left", leavingPanelIndex <= _this.currentIndex)
+                .append("sv-pd-animation-right", leavingPanelIndex > _this.currentIndex)
+                .toString();
         };
         return {
             getAnimatedElement: function (panel) {
@@ -49664,7 +49765,7 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
                 }
             },
             getEnterOptions: function () {
-                var cssClass = _this.cssClasses.panelWrapperFadeIn ? "" + _this.cssClasses.panelWrapperFadeIn + getDirection() : "";
+                var cssClass = new _utils_cssClassBuilder__WEBPACK_IMPORTED_MODULE_10__["CssClassBuilder"]().append(_this.cssClasses.panelWrapperFadeIn).append(getDirectionCssClass()).toString();
                 return {
                     onBeforeRunAnimation: function (el) {
                         var _a;
@@ -49683,7 +49784,7 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
                 };
             },
             getLeaveOptions: function () {
-                var cssClass = _this.cssClasses.panelWrapperFadeOut ? "" + _this.cssClasses.panelWrapperFadeOut + getDirection() : "";
+                var cssClass = new _utils_cssClassBuilder__WEBPACK_IMPORTED_MODULE_10__["CssClassBuilder"]().append(_this.cssClasses.panelWrapperFadeOut).append(getDirectionCssClass()).toString();
                 return {
                     onBeforeRunAnimation: function (el) {
                         var _a;
@@ -50823,11 +50924,16 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
             var prefixName = this.getValueName() + indexStr;
             var prefixText = this.processedTitle + indexStr;
             for (var i = 0; i < panelObjs.length; i++) {
-                objects.push({
-                    name: prefixName + panelObjs[i].name,
-                    text: prefixText + panelObjs[i].text,
-                    question: panelObjs[i].question,
-                });
+                if (!!panelObjs[i].context) {
+                    objects.push(panelObjs[i]);
+                }
+                else {
+                    objects.push({
+                        name: prefixName + panelObjs[i].name,
+                        text: prefixText + panelObjs[i].text,
+                        question: panelObjs[i].question,
+                    });
+                }
             }
         }
         if (hasContext) {
@@ -50841,9 +50947,7 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
                     text: prefixText + QuestionPanelDynamicItem.ItemVariableName + "." + panelObjs[i].text,
                     question: panelObjs[i].question
                 };
-                if (context === true) {
-                    obj.context = this;
-                }
+                obj.context = this;
                 objects.push(obj);
             }
         }
@@ -50860,7 +50964,7 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
         if (operator === void 0) { operator = null; }
         if (path === void 0) { path = null; }
         if (!path)
-            return _super.prototype.getConditionJson.call(this, operator, path);
+            return _super.prototype.getConditionJson.call(this, operator);
         var questionName = path;
         var pos = path.indexOf(".");
         if (pos > -1) {
@@ -51969,6 +52073,13 @@ var QuestionRadiogroupModel = /** @class */ (function (_super) {
     QuestionRadiogroupModel.prototype.supportGoNextPageAutomatic = function () {
         return this.isMouseDown === true && !this.isOtherSelected;
     };
+    QuestionRadiogroupModel.prototype.getConditionJson = function (operator, path) {
+        if (operator === void 0) { operator = null; }
+        if (path === void 0) { path = null; }
+        var json = _super.prototype.getConditionJson.call(this, operator, path);
+        delete json["showClearButton"];
+        return json;
+    };
     QuestionRadiogroupModel.prototype.setNewComment = function (newValue) {
         this.isMouseDown = true;
         _super.prototype.setNewComment.call(this, newValue);
@@ -53630,7 +53741,9 @@ var QuestionRatingModel = /** @class */ (function (_super) {
             .append(this.cssClasses.control)
             .append(this.cssClasses.controlEmpty, this.isEmpty())
             .append(this.cssClasses.onError, this.hasCssError())
-            .append(this.cssClasses.controlDisabled, this.isReadOnly)
+            .append(this.cssClasses.controlDisabled, this.isDisabledStyle)
+            .append(this.cssClasses.controlReadOnly, this.isReadOnlyStyle)
+            .append(this.cssClasses.controlPreview, this.isPreviewStyle)
             .toString();
     };
     Object.defineProperty(QuestionRatingModel.prototype, "placeholder", {
@@ -54605,7 +54718,14 @@ var QuestionTagboxModel = /** @class */ (function (_super) {
     };
     QuestionTagboxModel.prototype.onSurveyLoad = function () {
         _super.prototype.onSurveyLoad.call(this);
-        if (!this.dropdownListModel) {
+        this.createDropdownListModel();
+    };
+    QuestionTagboxModel.prototype.onSetData = function () {
+        _super.prototype.onSetData.call(this);
+        this.createDropdownListModel();
+    };
+    QuestionTagboxModel.prototype.createDropdownListModel = function () {
+        if (!this.dropdownListModel && !this.isLoadingFromJson) {
             this.dropdownListModel = new _dropdownMultiSelectListModel__WEBPACK_IMPORTED_MODULE_4__["DropdownMultiSelectListModel"](this);
         }
     };
@@ -54816,7 +54936,13 @@ var QuestionTagboxModel = /** @class */ (function (_super) {
         })
     ], QuestionTagboxModel.prototype, "hideSelectedItems", void 0);
     __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])()
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({
+            onSet: function (newValue, target) {
+                if (!!target.dropdownListModel) {
+                    target.dropdownListModel.setChoicesLazyLoadEnabled(newValue);
+                }
+            }
+        })
     ], QuestionTagboxModel.prototype, "choicesLazyLoadEnabled", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])()
@@ -56287,20 +56413,34 @@ __webpack_require__.r(__webpack_exports__);
 var RendererFactory = /** @class */ (function () {
     function RendererFactory() {
         this.renderersHash = {};
+        this.defaultHash = {};
     }
     RendererFactory.prototype.unregisterRenderer = function (questionType, rendererAs) {
         delete this.renderersHash[questionType][rendererAs];
+        if (this.defaultHash[questionType] === rendererAs) {
+            delete this.defaultHash[questionType];
+        }
     };
-    RendererFactory.prototype.registerRenderer = function (questionType, renderAs, renderer) {
+    RendererFactory.prototype.registerRenderer = function (questionType, renderAs, renderer, useAsDefault) {
+        if (useAsDefault === void 0) { useAsDefault = false; }
         if (!this.renderersHash[questionType]) {
             this.renderersHash[questionType] = {};
         }
         this.renderersHash[questionType][renderAs] = renderer;
+        if (useAsDefault) {
+            this.defaultHash[questionType] = renderAs;
+        }
     };
     RendererFactory.prototype.getRenderer = function (questionType, renderAs) {
-        return ((this.renderersHash[questionType] &&
-            this.renderersHash[questionType][renderAs]) ||
-            "default");
+        var qHash = this.renderersHash[questionType];
+        if (!!qHash) {
+            if (!!renderAs && qHash[renderAs])
+                return qHash[renderAs];
+            var dVal = this.defaultHash[questionType];
+            if (!!dVal && qHash[dVal])
+                return qHash[dVal];
+        }
+        return "default";
     };
     RendererFactory.prototype.getRendererByQuestion = function (question) {
         return this.getRenderer(question.getType(), question.renderAs);
@@ -59803,6 +59943,7 @@ var SurveyModel = /** @class */ (function (_super) {
         _this.skippedPages = [];
         _this.skeletonComponentName = "sv-skeleton";
         _this.taskManager = new _surveyTaskManager__WEBPACK_IMPORTED_MODULE_22__["SurveyTaskManagerModel"]();
+        _this.questionErrorComponent = "sv-question-error";
         if (_global_variables_utils__WEBPACK_IMPORTED_MODULE_25__["DomDocumentHelper"].isAvailable()) {
             SurveyModel.stylesManager = new _stylesmanager__WEBPACK_IMPORTED_MODULE_11__["StylesManager"]();
         }
@@ -67467,7 +67608,7 @@ _jsonobject__WEBPACK_IMPORTED_MODULE_1__["Serializer"].addClass("survey", [
     {
         name: "showProgressBar",
         default: "off",
-        choices: ["off", "auto", "aboveHeader", "belowHeader", "bottom", "topBottom"],
+        choices: ["off", "auto", "aboveheader", "belowheader", "bottom", "topbottom"],
     },
     {
         name: "progressBarType",
@@ -68106,11 +68247,9 @@ function createTOCListModel(survey, onAction) {
     var _a;
     var pagesSource = survey.questionsOnPageMode === "singlePage" ? (_a = survey.pages[0]) === null || _a === void 0 ? void 0 : _a.elements : survey.pages;
     var items = (pagesSource || []).map(function (page) {
-        var _a, _b;
         return new _actions_action__WEBPACK_IMPORTED_MODULE_0__["Action"]({
             id: page.name,
-            locTitle: ((_a = page.locNavigationTitle) === null || _a === void 0 ? void 0 : _a.text) ? page.locNavigationTitle : (((_b = page.locTitle) === null || _b === void 0 ? void 0 : _b.text) ? page.locTitle : undefined),
-            title: page.renderedNavigationTitle,
+            locTitle: page.locNavigationTitle,
             action: function () {
                 _global_variables_utils__WEBPACK_IMPORTED_MODULE_2__["DomDocumentHelper"].activeElementBlur();
                 !!onAction && onAction();
@@ -69372,10 +69511,15 @@ var AnimationUtils = /** @class */ (function () {
             options.onBeforeRunAnimation && options.onBeforeRunAnimation(element);
         }
     };
+    AnimationUtils.prototype.getCssClasses = function (options) {
+        return options.cssClass.replace(/\s+$/, "").split(/\s+/);
+    };
     AnimationUtils.prototype.runAnimation = function (element, options, callback) {
         if (element && options.cssClass) {
             this.reflow(element);
-            element.classList.add(options.cssClass);
+            this.getCssClasses(options).forEach(function (cssClass) {
+                element.classList.add(cssClass);
+            });
             this.onAnimationEnd(element, callback, options);
         }
         else {
@@ -69384,7 +69528,9 @@ var AnimationUtils = /** @class */ (function () {
     };
     AnimationUtils.prototype.clearHtmlElement = function (element, options) {
         if (element && options.cssClass) {
-            element.classList.remove(options.cssClass);
+            this.getCssClasses(options).forEach(function (cssClass) {
+                element.classList.remove(cssClass);
+            });
         }
     };
     AnimationUtils.prototype.onNextRender = function (callback, runEarly, isCancel) {