survey-react 1.9.95 → 1.9.97

package/survey.react.js

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.9.95
+ * surveyjs - Survey JavaScript library v1.9.97
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -1291,7 +1291,7 @@ var AdaptiveActionContainer = /** @class */ (function (_super) {
         }
     };
     AdaptiveActionContainer.prototype.initResponsivityManager = function (container) {
-        this.responsivityManager = new _utils_responsivity_manager__WEBPACK_IMPORTED_MODULE_0__["ResponsivityManager"](container, this, "& > .sv-action:not(.sv-dots) > .sv-action__content");
+        this.responsivityManager = new _utils_responsivity_manager__WEBPACK_IMPORTED_MODULE_0__["ResponsivityManager"](container, this, ":scope > .sv-action:not(.sv-dots) > .sv-action__content");
     };
     AdaptiveActionContainer.prototype.resetResponsivityManager = function () {
         if (!!this.responsivityManager) {
@@ -5102,6 +5102,7 @@ var defaultV2Css = {
     root: "sd-root-modern",
     rootMobile: "sd-root-modern--mobile",
     rootReadOnly: "sd-root--readonly",
+    rootBackgroundImage: "sd-root_background-image",
     container: "sd-container-modern",
     header: "sd-title sd-container-modern__title",
     bodyContainer: "sv-components-row",
@@ -5405,7 +5406,7 @@ var defaultV2Css = {
         root: "sd-selectbase",
         popup: "sv-dropdown-popup",
         small: "sd-row__question--small",
-        selectWrapper: "",
+        selectWrapper: "sv-dropdown_select-wrapper",
         other: "sd-input sd-comment sd-selectbase__other",
         onError: "sd-input--error",
         label: "sd-selectbase__label",
@@ -5418,6 +5419,9 @@ var defaultV2Css = {
         cleanButton: "sd-dropdown_clean-button",
         cleanButtonSvg: "sd-dropdown_clean-button-svg",
         cleanButtonIconId: "icon-clear",
+        chevronButton: "sd-dropdown_chevron-button",
+        chevronButtonSvg: "sd-dropdown_chevron-button-svg",
+        chevronButtonIconId: "icon-chevron",
         control: "sd-input sd-dropdown",
         controlInputFieldComponent: "sd-dropdown__input-field-component",
         controlValue: "sd-dropdown__value",
@@ -5576,10 +5580,14 @@ var defaultV2Css = {
         itemFixedSize: "sd-rating__item--fixed-size",
         control: "sd-input sd-dropdown",
         itemSmall: "sd-rating--small",
+        selectWrapper: "sv-dropdown_select-wrapper",
         controlValue: "sd-dropdown__value",
         controlDisabled: "sd-input--disabled",
         controlEmpty: "sd-dropdown--empty",
         filterStringInput: "sd-dropdown__filter-string-input",
+        chevronButton: "sd-dropdown_chevron-button",
+        chevronButtonSvg: "sd-dropdown_chevron-button-svg",
+        chevronButtonIconId: "icon-chevron",
         popup: "sv-dropdown-popup",
         onError: "sd-input--error",
     },
@@ -5674,6 +5682,7 @@ var defaultV2Css = {
         itemIndex: "sv-ranking-item__index sd-ranking-item__index",
         itemIndexEmptyMode: "sv-ranking-item__index--empty sd-ranking-item__index--empty",
         // itemText: "sv-ranking-item__text",
+        itemDisabled: "sv-ranking-item--disabled",
         controlLabel: "sv-ranking-item__text",
         itemGhostNode: "sv-ranking-item__ghost",
         itemIconContainer: "sv-ranking-item__icon-container",
@@ -5727,7 +5736,7 @@ var defaultV2Css = {
         root: "sd-selectbase",
         popup: "sv-dropdown-popup",
         small: "sd-row__question--small",
-        selectWrapper: "",
+        selectWrapper: "sv-dropdown_select-wrapper",
         other: "sd-input sd-comment sd-selectbase__other",
         onError: "sd-input--error",
         label: "sd-selectbase__label",
@@ -5744,6 +5753,9 @@ var defaultV2Css = {
         cleanItemButton: "sd-tagbox-item_clean-button",
         cleanItemButtonSvg: "sd-tagbox-item_clean-button-svg",
         cleanItemButtonIconId: "icon-clear_16x16",
+        chevronButton: "sd-dropdown_chevron-button",
+        chevronButtonSvg: "sd-dropdown_chevron-button-svg",
+        chevronButtonIconId: "icon-chevron",
         control: "sd-input sd-tagbox sd-dropdown",
         controlValue: "sd-tagbox__value sd-dropdown__value",
         controlValueItems: "sd-tagbox__value-items",
@@ -6494,9 +6506,9 @@ var DragDropCore = /** @class */ (function () {
         this.parentElement = parentElement;
         var shortcutText = this.getShortcutText(this.draggedElement);
         this.domAdapter.draggedElementShortcut = this.createDraggedElementShortcut(shortcutText, draggedElementNode, event);
-        this.onStartDrag();
+        this.onStartDrag(event);
     };
-    DragDropCore.prototype.onStartDrag = function () {
+    DragDropCore.prototype.onStartDrag = function (event) {
     };
     DragDropCore.prototype.isDropTargetDoesntChanged = function (newIsBottom) {
         return (this.dropTarget === this.prevDropTarget && newIsBottom === this.isBottom);
@@ -7227,6 +7239,13 @@ var DragDropRankingSelectToRank = /** @class */ (function (_super) {
     function DragDropRankingSelectToRank() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
+    DragDropRankingSelectToRank.prototype.onStartDrag = function (event) {
+        var target = event.target;
+        var fromContainerNode = target.closest(".sv-ranking__container--from");
+        if (!!fromContainerNode) {
+            fromContainerNode.style.minHeight = fromContainerNode.offsetHeight + "px";
+        }
+    };
     DragDropRankingSelectToRank.prototype.findDropTargetNodeByDragOverNode = function (dragOverNode) {
         if (dragOverNode.dataset.ranking === "from-container" || dragOverNode.dataset.ranking === "to-container") {
             return dragOverNode;
@@ -7284,7 +7303,7 @@ var DragDropRankingSelectToRank = /** @class */ (function (_super) {
         var fromIndex = fromChoicesArray.indexOf(this.draggedElement);
         var toIndex = toChoicesArray.indexOf(this.dropTarget);
         if (toIndex === -1)
-            toIndex = 0;
+            toIndex = toChoicesArray.length;
         rankFunction(questionModel, fromIndex, toIndex);
         this.doUIEffects(dropTargetNode, fromIndex, toIndex);
     };
@@ -7526,6 +7545,7 @@ var DropdownListModel = /** @class */ (function (_super) {
                     _this.resetItemsSettings();
                 }
             }
+            _this.question.processPopupVisiblilityChanged(_this.popupModel, option.isVisible);
         });
     };
     DropdownListModel.prototype.setFilterStringToListModel = function (newValue) {
@@ -8539,7 +8559,7 @@ __webpack_require__.r(__webpack_exports__);
 /*!*************************************!*\
   !*** ./src/entries/chunks/model.ts ***!
   \*************************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, TOCModel, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -8838,6 +8858,8 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "getTocRootCss", function() { return _surveyToc__WEBPACK_IMPORTED_MODULE_55__["getTocRootCss"]; });
 
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TOCModel", function() { return _surveyToc__WEBPACK_IMPORTED_MODULE_55__["TOCModel"]; });
+
 /* harmony import */ var _surveyProgress__WEBPACK_IMPORTED_MODULE_56__ = __webpack_require__(/*! ../../surveyProgress */ "./src/surveyProgress.ts");
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SurveyProgressModel", function() { return _surveyProgress__WEBPACK_IMPORTED_MODULE_56__["SurveyProgressModel"]; });
 
@@ -8990,7 +9012,7 @@ __webpack_require__.r(__webpack_exports__);
 // import "../../main.scss";
 //import "../../modern.scss";
 var Version;
-Version = "" + "1.9.95";
+Version = "" + "1.9.97";
 function checkLibraryVersion(ver, libraryName) {
     if (Version != ver) {
         var str = "survey-core has version '" + Version + "' and " + libraryName
@@ -9098,7 +9120,7 @@ function checkLibraryVersion(ver, libraryName) {
 /*!**************************************!*\
   !*** ./src/entries/core-wo-model.ts ***!
   \**************************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, getActionDropdownButtonTarget, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, TOCModel, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, getActionDropdownButtonTarget, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -9344,6 +9366,8 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "getTocRootCss", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["getTocRootCss"]; });
 
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TOCModel", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["TOCModel"]; });
+
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SurveyProgressModel", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["SurveyProgressModel"]; });
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SurveyProgressButtonsModel", function() { return _chunks_model__WEBPACK_IMPORTED_MODULE_0__["SurveyProgressButtonsModel"]; });
@@ -9539,7 +9563,7 @@ __webpack_require__.r(__webpack_exports__);
 /*!*****************************!*\
   !*** ./src/entries/core.ts ***!
   \*****************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, getActionDropdownButtonTarget, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, TOCModel, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, getActionDropdownButtonTarget, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -9785,6 +9809,8 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "getTocRootCss", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["getTocRootCss"]; });
 
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TOCModel", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["TOCModel"]; });
+
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SurveyProgressModel", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["SurveyProgressModel"]; });
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SurveyProgressButtonsModel", function() { return _core_wo_model__WEBPACK_IMPORTED_MODULE_0__["SurveyProgressButtonsModel"]; });
@@ -10340,7 +10366,7 @@ __webpack_require__.r(__webpack_exports__);
 /*!******************************!*\
   !*** ./src/entries/react.ts ***!
   \******************************/
-/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, getActionDropdownButtonTarget, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model, bootstrapThemeName, bootstrapThemeColors, bootstrapThemeCssRules, bootstrapMaterialThemeName, bootstrapMaterialThemeColors, bootstrapMaterialThemeCssRules, defaultBootstrapCss, defaultBootstrapMaterialCss, Survey, attachKey2click, ReactSurveyElementsWrapper, SurveyNavigationBase, SurveyTimerPanel, SurveyPage, SurveyRow, SurveyPanel, SurveyFlowPanel, SurveyQuestion, SurveyElementErrors, SurveyQuestionAndErrorsCell, ReactSurveyElement, SurveyElementBase, SurveyQuestionElementBase, SurveyQuestionCommentItem, SurveyQuestionComment, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionRanking, SurveyQuestionRankingItem, RatingItem, RatingItemStar, RatingItemSmiley, TagboxFilterString, SurveyQuestionOptionItem, SurveyQuestionDropdownBase, SurveyQuestionDropdown, SurveyQuestionTagboxItem, SurveyQuestionTagbox, SurveyQuestionDropdownSelect, SurveyQuestionMatrix, SurveyQuestionMatrixRow, SurveyQuestionHtml, SurveyQuestionFile, SurveyQuestionMultipleText, SurveyQuestionRadiogroup, SurveyQuestionRadioItem, SurveyQuestionText, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionEmpty, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicAddButton, SurveyQuestionPanelDynamic, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionExpression, PopupSurvey, SurveyWindow, ReactQuestionFactory, ReactElementFactory, SurveyQuestionImagePicker, SurveyQuestionImage, SurveyQuestionSignaturePad, SurveyQuestionButtonGroup, SurveyQuestionCustom, SurveyQuestionComposite, Popup, List, TitleActions, TitleElement, SurveyActionBar, LogoImage, SurveyHeader, SvgIcon, SurveyQuestionMatrixDynamicRemoveButton, SurveyQuestionMatrixDetailButton, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionPanelDynamicAddButton, SurveyQuestionPanelDynamicRemoveButton, SurveyQuestionPanelDynamicPrevButton, SurveyQuestionPanelDynamicNextButton, SurveyQuestionPanelDynamicProgressText, SurveyNavigationButton, MatrixRow, Skeleton, NotifierComponent, ComponentsContainer, CharacterCounterComponent, SurveyLocStringViewer, SurveyLocStringEditor */
+/*! exports provided: Version, checkLibraryVersion, settings, Helpers, AnswerCountValidator, EmailValidator, NumericValidator, RegexValidator, SurveyValidator, TextValidator, ValidatorResult, ExpressionValidator, ValidatorRunner, ItemValue, Base, Event, EventBase, ArrayChanges, ComputedUpdater, SurveyError, SurveyElementCore, SurveyElement, DragTypeOverMeEnum, CalculatedValue, CustomError, AnswerRequiredError, OneAnswerRequiredError, RequreNumericError, ExceedSizeError, LocalizableString, LocalizableStrings, HtmlConditionItem, UrlConditionItem, ChoicesRestful, ChoicesRestfull, FunctionFactory, registerFunction, ConditionRunner, ExpressionRunner, ExpressionExecutor, Operand, Const, BinaryOperand, Variable, FunctionOperand, ArrayOperand, UnaryOperand, ConditionsParser, ProcessValue, JsonError, JsonIncorrectTypeError, JsonMetadata, JsonMetadataClass, JsonMissingTypeError, JsonMissingTypeErrorBase, JsonObject, JsonObjectProperty, JsonRequiredPropertyError, JsonUnknownPropertyError, Serializer, property, propertyArray, MatrixDropdownCell, MatrixDropdownRowModelBase, QuestionMatrixDropdownModelBase, MatrixDropdownColumn, matrixDropdownColumnTypes, QuestionMatrixDropdownRenderedCell, QuestionMatrixDropdownRenderedRow, QuestionMatrixDropdownRenderedTable, MatrixDropdownRowModel, QuestionMatrixDropdownModel, MatrixDynamicRowModel, QuestionMatrixDynamicModel, MatrixRowModel, MatrixCells, QuestionMatrixModel, QuestionMatrixBaseModel, MultipleTextItemModel, QuestionMultipleTextModel, MultipleTextEditorModel, PanelModel, PanelModelBase, QuestionRowModel, FlowPanelModel, PageModel, DefaultTitleModel, Question, QuestionNonValue, QuestionEmptyModel, QuestionCheckboxBase, QuestionSelectBase, QuestionCheckboxModel, QuestionTagboxModel, QuestionRankingModel, QuestionCommentModel, QuestionDropdownModel, QuestionFactory, ElementFactory, QuestionFileModel, QuestionHtmlModel, QuestionRadiogroupModel, QuestionRatingModel, RenderedRatingItem, QuestionExpressionModel, QuestionTextBase, CharacterCounter, QuestionTextModel, QuestionBooleanModel, QuestionImagePickerModel, ImageItemValue, QuestionImageModel, QuestionSignaturePadModel, QuestionPanelDynamicModel, QuestionPanelDynamicItem, SurveyTimer, SurveyTimerModel, tryNavigateToPage, createTOCListModel, getTocRootCss, TOCModel, SurveyProgressModel, SurveyProgressButtonsModel, SurveyModel, SurveyTrigger, SurveyTriggerComplete, SurveyTriggerSetValue, SurveyTriggerVisible, SurveyTriggerCopyValue, SurveyTriggerRunExpression, Trigger, PopupSurveyModel, SurveyWindowModel, TextPreProcessor, Notifier, dxSurveyService, englishStrings, surveyLocalization, surveyStrings, QuestionCustomWidget, CustomWidgetCollection, QuestionCustomModel, QuestionCompositeModel, ComponentQuestionJSON, ComponentCollection, StylesManager, ListModel, MultiSelectListModel, PopupModel, createDialogOptions, PopupBaseViewModel, PopupDropdownViewModel, PopupModalViewModel, createPopupViewModel, createPopupModalViewModel, DropdownListModel, DropdownMultiSelectListModel, QuestionButtonGroupModel, ButtonGroupItemModel, ButtonGroupItemValue, IsMobile, IsTouch, _setIsTouch, confirmAction, detectIEOrEdge, doKey2ClickUp, doKey2ClickDown, doKey2ClickBlur, loadFileFromBase64, increaseHeightByContent, createSvg, sanitizeEditableContent, CssClassBuilder, surveyCss, defaultV2Css, defaultV2ThemeName, DragDropCore, DragDropChoices, DragDropRankingSelectToRank, defaultStandardCss, modernCss, SvgIconRegistry, SvgRegistry, SvgBundleViewModel, RendererFactory, ResponsivityManager, VerticalResponsivityManager, unwrap, getOriginalEvent, getElement, createDropdownActionModel, createDropdownActionModelAdvanced, getActionDropdownButtonTarget, BaseAction, Action, ActionDropdownViewModel, AdaptiveActionContainer, defaultActionBarCss, ActionContainer, TooltipManager, DragOrClickHelper, Model, bootstrapThemeName, bootstrapThemeColors, bootstrapThemeCssRules, bootstrapMaterialThemeName, bootstrapMaterialThemeColors, bootstrapMaterialThemeCssRules, defaultBootstrapCss, defaultBootstrapMaterialCss, Survey, attachKey2click, ReactSurveyElementsWrapper, SurveyNavigationBase, SurveyTimerPanel, SurveyPage, SurveyRow, SurveyPanel, SurveyFlowPanel, SurveyQuestion, SurveyElementErrors, SurveyQuestionAndErrorsCell, ReactSurveyElement, SurveyElementBase, SurveyQuestionElementBase, SurveyQuestionCommentItem, SurveyQuestionComment, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionRanking, SurveyQuestionRankingItem, RatingItem, RatingItemStar, RatingItemSmiley, TagboxFilterString, SurveyQuestionOptionItem, SurveyQuestionDropdownBase, SurveyQuestionDropdown, SurveyQuestionTagboxItem, SurveyQuestionTagbox, SurveyQuestionDropdownSelect, SurveyQuestionMatrix, SurveyQuestionMatrixRow, SurveyQuestionHtml, SurveyQuestionFile, SurveyQuestionMultipleText, SurveyQuestionRadiogroup, SurveyQuestionRadioItem, SurveyQuestionText, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionEmpty, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicAddButton, SurveyQuestionPanelDynamic, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionExpression, PopupSurvey, SurveyWindow, ReactQuestionFactory, ReactElementFactory, SurveyQuestionImagePicker, SurveyQuestionImage, SurveyQuestionSignaturePad, SurveyQuestionButtonGroup, SurveyQuestionCustom, SurveyQuestionComposite, Popup, List, TitleActions, TitleElement, SurveyActionBar, LogoImage, SurveyHeader, SvgIcon, SurveyQuestionMatrixDynamicRemoveButton, SurveyQuestionMatrixDetailButton, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionPanelDynamicAddButton, SurveyQuestionPanelDynamicRemoveButton, SurveyQuestionPanelDynamicPrevButton, SurveyQuestionPanelDynamicNextButton, SurveyQuestionPanelDynamicProgressText, SurveyNavigationButton, MatrixRow, Skeleton, NotifierComponent, ComponentsContainer, CharacterCounterComponent, SurveyLocStringViewer, SurveyLocStringEditor */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -10586,6 +10612,8 @@ __webpack_require__.r(__webpack_exports__);
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "getTocRootCss", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["getTocRootCss"]; });
 
+/* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "TOCModel", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["TOCModel"]; });
+
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SurveyProgressModel", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["SurveyProgressModel"]; });
 
 /* harmony reexport (safe) */ __webpack_require__.d(__webpack_exports__, "SurveyProgressButtonsModel", function() { return _core__WEBPACK_IMPORTED_MODULE_0__["SurveyProgressButtonsModel"]; });
@@ -15872,8 +15900,14 @@ var Helpers = /** @class */ (function () {
         return array;
     };
     Helpers.getUnbindValue = function (value) {
+        if (Array.isArray(value)) {
+            var res = [];
+            for (var i = 0; i < value.length; i++) {
+                res.push(Helpers.getUnbindValue(value[i]));
+            }
+            return res;
+        }
         if (!!value && value instanceof Object && !(value instanceof Date)) {
-            //do not return the same object instance!!!
             return JSON.parse(JSON.stringify(value));
         }
         return value;
@@ -16151,6 +16185,7 @@ var map = {
 	"./ModernCheck.svg": "./src/images/ModernCheck.svg",
 	"./ModernRadio.svg": "./src/images/ModernRadio.svg",
 	"./More.svg": "./src/images/More.svg",
+	"./NavMenu_24x24.svg": "./src/images/NavMenu_24x24.svg",
 	"./ProgressButton.svg": "./src/images/ProgressButton.svg",
 	"./ProgressButtonV2.svg": "./src/images/ProgressButtonV2.svg",
 	"./RemoveFile.svg": "./src/images/RemoveFile.svg",
@@ -16160,6 +16195,7 @@ var map = {
 	"./V2Check.svg": "./src/images/V2Check.svg",
 	"./V2Check_24x24.svg": "./src/images/V2Check_24x24.svg",
 	"./V2DragElement_16x16.svg": "./src/images/V2DragElement_16x16.svg",
+	"./chevron.svg": "./src/images/chevron.svg",
 	"./clear_16x16.svg": "./src/images/clear_16x16.svg",
 	"./collapseDetail.svg": "./src/images/collapseDetail.svg",
 	"./expandDetail.svg": "./src/images/expandDetail.svg",
@@ -16369,6 +16405,17 @@ module.exports = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\
 
 /***/ }),
 
+/***/ "./src/images/NavMenu_24x24.svg":
+/*!**************************************!*\
+  !*** ./src/images/NavMenu_24x24.svg ***!
+  \**************************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+module.exports = "<svg viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M16 7H2V5H16V7ZM2 11V13H22V11H2ZM2 19H10V17H2V19Z\" fill=\"black\" fill-opacity=\"0.45\"></path></svg>"
+
+/***/ }),
+
 /***/ "./src/images/ProgressButton.svg":
 /*!***************************************!*\
   !*** ./src/images/ProgressButton.svg ***!
@@ -16468,6 +16515,17 @@ module.exports = "<svg viewBox=\"0 0 16 16\" xmlns=\"http://www.w3.org/2000/svg\
 
 /***/ }),
 
+/***/ "./src/images/chevron.svg":
+/*!********************************!*\
+  !*** ./src/images/chevron.svg ***!
+  \********************************/
+/*! no static exports found */
+/***/ (function(module, exports) {
+
+module.exports = "<svg viewBox=\"0 0 24 24\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M12 15L17 10H7L12 15Z\"></path></svg>"
+
+/***/ }),
+
 /***/ "./src/images/clear_16x16.svg":
 /*!************************************!*\
   !*** ./src/images/clear_16x16.svg ***!
@@ -16736,8 +16794,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _base__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./base */ "./src/base.ts");
 /* harmony import */ var _settings__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./settings */ "./src/settings.ts");
 /* harmony import */ var _actions_action__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./actions/action */ "./src/actions/action.ts");
-/* harmony import */ var _question_baseselect__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./question_baseselect */ "./src/question_baseselect.ts");
-/* harmony import */ var _question__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./question */ "./src/question.ts");
+/* harmony import */ var _question__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./question */ "./src/question.ts");
 var __extends = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -16767,7 +16824,6 @@ var __decorate = (undefined && undefined.__decorate) || function (decorators, ta
 
 
 
-
 /**
  * Array of ItemValue is used in checkbox, dropdown and radiogroup choices, matrix columns and rows.
  * It has two main properties: value and text. If text is empty, value is used for displaying.
@@ -17181,8 +17237,9 @@ var ItemValue = /** @class */ (function (_super) {
     Object.defineProperty(ItemValue.prototype, "selected", {
         get: function () {
             var _this = this;
-            if (this._locOwner instanceof _question_baseselect__WEBPACK_IMPORTED_MODULE_7__["QuestionSelectBase"] && this.selectedValue === undefined) {
-                this.selectedValue = (new _base__WEBPACK_IMPORTED_MODULE_4__["ComputedUpdater"](function () { return _this._locOwner.isItemSelected(_this); }));
+            var locOwner = this._locOwner;
+            if (locOwner instanceof _question__WEBPACK_IMPORTED_MODULE_7__["Question"] && locOwner.isItemSelected && this.selectedValue === undefined) {
+                this.selectedValue = (new _base__WEBPACK_IMPORTED_MODULE_4__["ComputedUpdater"](function () { return locOwner.isItemSelected(_this); }));
             }
             return this.selectedValue;
         },
@@ -17190,7 +17247,7 @@ var ItemValue = /** @class */ (function (_super) {
         configurable: true
     });
     ItemValue.prototype.getComponent = function () {
-        if (this._locOwner instanceof _question__WEBPACK_IMPORTED_MODULE_8__["Question"]) {
+        if (this._locOwner instanceof _question__WEBPACK_IMPORTED_MODULE_7__["Question"]) {
             return this.componentValue || this._locOwner.itemComponent;
         }
         return this.componentValue;
@@ -18672,7 +18729,9 @@ var JsonMetadata = /** @class */ (function () {
         return res;
     };
     JsonMetadata.prototype.getChemeRefName = function (className, isRoot) {
-        return isRoot ? "#/definitions/" + className : className + "#";
+        //Fix for #6486, according to https://niem.github.io/json/reference/json-schema/references/#:~:text=In%20a%20JSON%20schema%2C%20a,%2C%20an%20in%2Dschema%20reference
+        return "#/definitions/" + className;
+        //return isRoot ? "#/definitions/" + className : className + "#";
     };
     JsonMetadata.prototype.generateChemaClass = function (className, schemaDef, isRoot) {
         if (!!schemaDef[className])
@@ -18710,6 +18769,7 @@ var JsonError = /** @class */ (function () {
         this.message = message;
         this.description = "";
         this.at = -1;
+        this.end = -1;
     }
     JsonError.prototype.getFullDescription = function () {
         return this.message + (this.description ? "\n" + this.description : "");
@@ -18823,7 +18883,7 @@ var JsonObject = /** @class */ (function () {
         this.toObjectCore(jsonObj, obj);
         var error = this.getRequiredError(obj, jsonObj);
         if (!!error) {
-            this.addNewError(error, jsonObj);
+            this.addNewError(error, jsonObj, obj);
         }
     };
     JsonObject.prototype.toObjectCore = function (jsonObj, obj) {
@@ -18854,7 +18914,7 @@ var JsonObject = /** @class */ (function () {
             var property = this.findProperty(properties, key);
             if (!property) {
                 if (needAddErrors) {
-                    this.addNewError(new JsonUnknownPropertyError(key.toString(), objType), jsonObj);
+                    this.addNewError(new JsonUnknownPropertyError(key.toString(), objType), jsonObj, obj);
                 }
                 continue;
             }
@@ -19017,7 +19077,7 @@ var JsonObject = /** @class */ (function () {
             }
         }
         if (error) {
-            this.addNewError(error, value);
+            this.addNewError(error, value, newObj);
         }
         return error;
     };
@@ -19038,11 +19098,17 @@ var JsonObject = /** @class */ (function () {
         }
         return null;
     };
-    JsonObject.prototype.addNewError = function (error, jsonObj) {
-        if (jsonObj && jsonObj[JsonObject.positionPropertyName]) {
-            error.at = jsonObj[JsonObject.positionPropertyName].start;
-        }
+    JsonObject.prototype.addNewError = function (error, jsonObj, element) {
+        error.jsonObj = jsonObj;
+        error.element = element;
         this.errors.push(error);
+        if (!jsonObj)
+            return;
+        var posObj = jsonObj[JsonObject.positionPropertyName];
+        if (!posObj)
+            return;
+        error.at = posObj.start;
+        error.end = posObj.end;
     };
     JsonObject.prototype.valueToArray = function (value, obj, key, property) {
         if (obj[key] && !this.isValueArray(obj[key]))
@@ -21028,8 +21094,8 @@ var englishStrings = {
     noEntriesReadonlyText: "There are no entries.",
     more: "More",
     tagboxDoneButtonCaption: "OK",
-    selectToRankFromContainerPlaceholder: "All items are ranked.",
-    selectToRankToContainerPlaceholder: "Drop the items which you like not to be selected here.",
+    selectToRankEmptyRankedAreaText: "All choices are ranked",
+    selectToRankEmptyUnrankedAreaText: "Drag and drop choices here to rank them",
 };
 // Uncomment the lines below if you create a custom dictionary.
 // Replace "en" with a custom locale code (for example, "fr" or "de"),
@@ -27217,6 +27283,12 @@ var PanelModelBase = /** @class */ (function (_super) {
         }
         return !rec.result;
     };
+    PanelModelBase.prototype.validateContainerOnly = function () {
+        this.hasErrorsInPanels({ fireCallback: true });
+        if (!!this.parent) {
+            this.parent.validateContainerOnly();
+        }
+    };
     PanelModelBase.prototype.hasErrorsInPanels = function (rec) {
         var errors = [];
         this.hasRequiredError(rec, errors);
@@ -29600,7 +29672,7 @@ function setStyles() {
         ".sv_q_dd_value": "width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative;",
         ".sv_q_dd_root": "position: relative;",
         ".sv_q_dd_select_wrapper::after": "content: \"\"; display: block;background-image: url(\"data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 10 10' style='enable-background:new 0 0 10 10;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23404040;%7D%0A%3C/style%3E%3Cpolygon class='st0' points='2,2 0,4 5,9 10,4 8,2 5,5 '/%3E%3C/svg%3E%0A\"); background-repeat: no-repeat; background-position: center center; background-size: 10px 12px; width: 34px; height: 100%; position: absolute; inset-inline-end: 0; top: 0;",
-        ".sv_q_dd_filter-string-input": "outline: none; border: none; background-color: transparent; position: absolute; inset-inline-start: 0;",
+        ".sv_q_dd_filter-string-input": "outline: none; border: none; background-color: transparent; position: absolute; inset-inline-start: 0; inset-block-start: 0;",
         ".sv_q_dropdown_clean-button": "margin: auto 2em;",
         ".sv_q_tagbox__placeholder": "position: absolute; top: 0; inset-inline-start: 1em; max-width: 100%; width: auto; height: 100%; text-align: start; cursor: text; pointer-events: none;",
         ".sv_qstn .sv-q-col-1, .sv-question .sv-q-col-1": "width: 100%; display: inline-block; padding-right: 1em; box-sizing: border-box; word-break: break-word;",
@@ -29761,7 +29833,7 @@ function setStyles() {
         "sv-popup": "display: block; position: absolute; z-index: -1;",
         ".sv-popup": "position: fixed; left: 0; top: 0; width: 100vw; height: 100vh; outline: none; z-index: 1500;",
         ".sv-popup__container": "box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1); position: absolute; padding: 0;",
-        ".sv-popup__body-content": "background-color: var(--background, #fff); border-radius: calc(0.5 * var(--base-unit, 8px)); width: 100%; height: 100%; box-sizing: border-box; display: flex; flex-direction: column; max-height: 90vh; max-width: 90vw;",
+        ".sv-popup__body-content": "background-color: var(--background, #fff); border-radius: calc(0.5 * var(--base-unit, 8px)); width: 100%; height: 100%; box-sizing: border-box; display: flex; flex-direction: column; max-height: 90vh; max-width: 100vw;",
         ".sv-popup--modal .sv-list__filter": "padding-top: 8px;",
         ".sv-popup--modal .sv-list__filter-icon": "top: 20px;",
         ".sv-popup--overlay .sv-list__filter": "padding-top: 8px;",
@@ -29915,13 +29987,14 @@ var PopupDropdownViewModel = /** @class */ (function (_super) {
         this.isTablet = width >= PopupDropdownViewModel.tabletSizeBreakpoint;
     };
     PopupDropdownViewModel.prototype._updatePosition = function () {
-        var _a;
+        var _a, _b, _c;
         if (!this.targetElement)
             return;
         var targetElementRect = this.targetElement.getBoundingClientRect();
         var popupContainer = (_a = this.container) === null || _a === void 0 ? void 0 : _a.querySelector(this.containerSelector);
         if (!popupContainer)
             return;
+        var fixedPopupContainer = (_b = this.container) === null || _b === void 0 ? void 0 : _b.querySelector(this.fixedPopupContainer);
         var scrollContent = popupContainer.querySelector(this.scrollingContentSelector);
         var popupComputedStyle = window.getComputedStyle(popupContainer);
         var marginLeft = (parseFloat(popupComputedStyle.marginLeft) || 0);
@@ -29932,7 +30005,8 @@ var PopupDropdownViewModel = /** @class */ (function (_super) {
         var verticalPosition = this.model.verticalPosition;
         var actualHorizontalPosition = this.getActualHorizontalPosition();
         if (!!window) {
-            height = Math.ceil(Math.min(height, window.innerHeight * 0.9, window.visualViewport.height));
+            var heightValues = [height, window.innerHeight * 0.9, (_c = window.visualViewport) === null || _c === void 0 ? void 0 : _c.height];
+            height = Math.ceil(Math.min.apply(Math, heightValues.filter(function (each) { return typeof each === "number"; })));
             verticalPosition = _utils_popup__WEBPACK_IMPORTED_MODULE_1__["PopupUtils"].updateVerticalPosition(targetElementRect, height, this.model.verticalPosition, this.model.showPointer, window.innerHeight);
         }
         this.popupDirection = _utils_popup__WEBPACK_IMPORTED_MODULE_1__["PopupUtils"].calculatePopupDirection(verticalPosition, actualHorizontalPosition);
@@ -29949,6 +30023,11 @@ var PopupDropdownViewModel = /** @class */ (function (_super) {
                 pos.left = newHorizontalDimensions.left;
             }
         }
+        if (!!fixedPopupContainer) {
+            var rect = fixedPopupContainer.getBoundingClientRect();
+            pos.top -= rect.top;
+            pos.left -= rect.left;
+        }
         this.left = pos.left + "px";
         this.top = pos.top + "px";
         if (this.showHeader) {
@@ -30239,6 +30318,16 @@ var PopupSurveyModel = /** @class */ (function (_super) {
         _this.width = _this.survey.width;
         _this.updateCss();
         _this.onCreating();
+        _this.survey.onPopupVisibleChanged.add(function (_, opt) {
+            if (opt.visible) {
+                _this.onScrollCallback = function () {
+                    opt.popup.toggleVisibility();
+                };
+            }
+            else {
+                _this.onScrollCallback = undefined;
+            }
+        });
         return _this;
     }
     PopupSurveyModel.prototype.onCreating = function () { };
@@ -30443,6 +30532,11 @@ var PopupSurveyModel = /** @class */ (function (_super) {
                     : 0;
         }
     };
+    PopupSurveyModel.prototype.onScroll = function () {
+        if (this.onScrollCallback) {
+            this.onScrollCallback();
+        }
+    };
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_2__["property"])()
     ], PopupSurveyModel.prototype, "width", void 0);
@@ -30553,6 +30647,7 @@ var PopupBaseViewModel = /** @class */ (function (_super) {
     function PopupBaseViewModel(model) {
         var _this = _super.call(this) || this;
         _this.popupSelector = ".sv-popup";
+        _this.fixedPopupContainer = ".sv-popup";
         _this.containerSelector = ".sv-popup__container";
         _this.scrollingContentSelector = ".sv-popup__scrolling-content";
         _this.model = model;
@@ -31229,6 +31324,17 @@ var Question = /** @class */ (function (_super) {
         get: function () {
             return this.isReadyValue;
         },
+        set: function (val) {
+            var oldIsReady = this.isReadyValue;
+            this.isReadyValue = val;
+            if (oldIsReady != val) {
+                this.onReadyChanged.fire(this, {
+                    question: this,
+                    isReady: val,
+                    oldIsReady: oldIsReady,
+                });
+            }
+        },
         enumerable: false,
         configurable: true
     });
@@ -32204,9 +32310,25 @@ var Question = /** @class */ (function (_super) {
      * @param onError Pass `true` if you want to focus an input field with the first validation error. Default value: `false` (focuses the first input field). Applies to question types with multiple input fields.
      */
     Question.prototype.focus = function (onError) {
+        var _this = this;
         if (onError === void 0) { onError = false; }
-        if (this.isDesignMode)
+        if (this.isDesignMode || !this.isVisible || !this.survey)
             return;
+        var page = this.page;
+        if (!page && !!this.parentQuestion) {
+            page = this.parentQuestion.page;
+        }
+        var shouldChangePage = !!page && this.survey.currentPage !== page;
+        if (shouldChangePage) {
+            this.survey.currentPage = page;
+            setTimeout(function () { return _this.focuscore(onError); }, 0);
+        }
+        else {
+            this.focuscore(onError);
+        }
+    };
+    Question.prototype.focuscore = function (onError) {
+        if (onError === void 0) { onError = false; }
         if (!!this.survey) {
             this.expandAllParents(this);
             this.survey.scrollElementToTop(this, this, null, this.id);
@@ -33169,6 +33291,11 @@ var Question = /** @class */ (function (_super) {
     Question.prototype.validate = function (fireCallback, rec) {
         if (fireCallback === void 0) { fireCallback = true; }
         if (rec === void 0) { rec = null; }
+        if (!!rec && rec.isOnValueChanged) {
+            if (!!this.parent) {
+                this.parent.validateContainerOnly();
+            }
+        }
         return !this.hasErrors(fireCallback, rec);
     };
     Object.defineProperty(Question.prototype, "currentErrorCount", {
@@ -33485,6 +33612,9 @@ var Question = /** @class */ (function (_super) {
     Question.prototype.getAllValues = function () {
         return !!this.data ? this.data.getAllValues() : null;
     };
+    Question.prototype.processPopupVisiblilityChanged = function (popupModel, visible) {
+        this.survey.processPopupVisiblityChanged(this, popupModel, visible);
+    };
     Question.prototype.transformToMobileView = function () { };
     Question.prototype.transformToDesktopView = function () { };
     Question.prototype.needResponsiveWidth = function () {
@@ -34048,6 +34178,20 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         };
         return _this;
     }
+    Object.defineProperty(QuestionSelectBase.prototype, "waitingChoicesByURL", {
+        get: function () {
+            return !this.isChoicesLoaded && !this.choicesByUrl.isEmpty;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(QuestionSelectBase.prototype, "waitingAcyncOperations", {
+        get: function () {
+            return this.waitingChoicesByURL || this.waitingGetChoiceDisplayValueResponse;
+        },
+        enumerable: false,
+        configurable: true
+    });
     QuestionSelectBase.prototype.getType = function () {
         return "selectbase";
     };
@@ -34346,7 +34490,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         (_a = this.survey) === null || _a === void 0 ? void 0 : _a.loadedChoicesFromServer(this);
     };
     QuestionSelectBase.prototype.getItemIfChoicesNotContainThisValue = function (value, text) {
-        if (!this.isReady) {
+        if (this.waitingChoicesByURL) {
             return this.createItemValue(value, text);
         }
         else {
@@ -34359,7 +34503,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
             return null;
         var itemValue = _itemvalue__WEBPACK_IMPORTED_MODULE_3__["ItemValue"].getItemByValue(this.visibleChoices, this.value);
         this.onGetSingleSelectedItem(itemValue);
-        if (!itemValue && !selectedItemValues) {
+        if (!itemValue && (!selectedItemValues || this.value != selectedItemValues.id)) {
             this.updateSelectedItemValues();
         }
         return itemValue || selectedItemValues || (this.isOtherSelected ? this.otherItem : this.getItemIfChoicesNotContainThisValue(this.value));
@@ -34591,6 +34735,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         var _this = this;
         if (!!this.survey && !this.isEmpty() && !_itemvalue__WEBPACK_IMPORTED_MODULE_3__["ItemValue"].getItemByValue(this.choices, this.value)) {
             this.waitingGetChoiceDisplayValueResponse = true;
+            this.isReady = !this.waitingAcyncOperations;
             this.survey.getChoiceDisplayValue({
                 question: this,
                 values: [this.value],
@@ -34599,6 +34744,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
                     if (!displayValues || !displayValues.length)
                         return;
                     _this.selectedItemValues = _this.createItemValue(_this.value, displayValues[0]);
+                    _this.isReady = !_this.waitingAcyncOperations;
                 }
             });
         }
@@ -34609,6 +34755,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         var hasItemWithValues = valueArray.some(function (val) { return !_itemvalue__WEBPACK_IMPORTED_MODULE_3__["ItemValue"].getItemByValue(_this.choices, val); });
         if (!!this.survey && !this.isEmpty() && hasItemWithValues) {
             this.waitingGetChoiceDisplayValueResponse = true;
+            this.isReady = this.waitingAcyncOperations;
             this.survey.getChoiceDisplayValue({
                 question: this,
                 values: valueArray,
@@ -34617,6 +34764,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
                     if (!displayValues || !displayValues.length)
                         return;
                     _this.selectedItemValues = displayValues.map(function (displayValue, index) { return _this.createItemValue(_this.value[index], displayValue); });
+                    _this.isReady = !_this.waitingAcyncOperations;
                 }
             });
         }
@@ -35255,7 +35403,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
             processor = this.survey;
         if (!processor)
             return;
-        this.isReadyValue = this.isChoicesLoaded || this.choicesByUrl.isEmpty;
+        this.isReadyValue = !this.waitingAcyncOperations;
         this.isRunningChoices = true;
         this.choicesByUrl.run(processor);
         this.isRunningChoices = false;
@@ -35375,7 +35523,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
         for (var i = 0; i < this.dependedQuestions.length; i++) {
             var q = this.dependedQuestions[i];
             q.onVisibleChoicesChanged();
-            q.clearIncorrectValuesCore();
+            q.clearIncorrectValues();
         }
         this.isUpdatingChoicesDependedQuestions = false;
     };
@@ -35470,11 +35618,11 @@ var QuestionSelectBase = /** @class */ (function (_super) {
     };
     QuestionSelectBase.prototype.clearIncorrectValuesCore = function () {
         var val = this.value;
-        if (this.canClearValueAnUnknow(val)) {
+        if (this.canClearValueAnUnknown(val)) {
             this.clearValue();
         }
     };
-    QuestionSelectBase.prototype.canClearValueAnUnknow = function (val) {
+    QuestionSelectBase.prototype.canClearValueAnUnknown = function (val) {
         if (!this.getStoreOthersAsComment() && this.isOtherSelected)
             return false;
         return this.hasUnknownValue(val, true, true, true);
@@ -35656,14 +35804,7 @@ var QuestionSelectBase = /** @class */ (function (_super) {
     });
     QuestionSelectBase.prototype.choicesLoaded = function () {
         this.isChoicesLoaded = true;
-        var oldIsReady = this.isReadyValue;
-        this.isReadyValue = true;
-        this.onReadyChanged &&
-            this.onReadyChanged.fire(this, {
-                question: this,
-                isReady: true,
-                oldIsReady: oldIsReady,
-            });
+        this.isReady = !this.waitingAcyncOperations;
         if (this.survey) {
             this.survey.loadedChoicesFromServer(this);
         }
@@ -36929,7 +37070,7 @@ var QuestionCheckboxModel = /** @class */ (function (_super) {
         if (Array.isArray(val)) {
             for (var i = 0; i < val.length; i++) {
                 var rVal = this.getRealValue(val[i]);
-                if (this.canClearValueAnUnknow(rVal)) {
+                if (this.canClearValueAnUnknown(rVal)) {
                     this.addIntoInvisibleOldValues(rVal);
                 }
             }
@@ -37068,7 +37209,7 @@ var QuestionCheckboxModel = /** @class */ (function (_super) {
         var newValue = [];
         for (var i = 0; i < val.length; i++) {
             var rItemVal = this.getRealValue(val[i]);
-            var isUnkown = this.canClearValueAnUnknow(rItemVal);
+            var isUnkown = this.canClearValueAnUnknown(rItemVal);
             if ((!clearDisabled && !isUnkown) ||
                 (clearDisabled && !this.isValueDisabled(rItemVal))) {
                 newValue.push(val[i]);
@@ -37568,6 +37709,14 @@ var ComponentQuestionJSON = /** @class */ (function () {
             return question.getDisplayValue(keyAsText, value);
         return this.json.getDisplayValue(question);
     };
+    ComponentQuestionJSON.prototype.setValueToQuestion = function (val) {
+        var converter = this.json.valueToQuestion || this.json.setValue;
+        return !!converter ? converter(val) : val;
+    };
+    ComponentQuestionJSON.prototype.getValueFromQuestion = function (val) {
+        var converter = this.json.valueFromQuestion || this.json.getValue;
+        return !!converter ? converter(val) : val;
+    };
     Object.defineProperty(ComponentQuestionJSON.prototype, "isComposite", {
         get: function () {
             return !!this.json.elementsJSON || !!this.json.createElements;
@@ -37845,6 +37994,9 @@ var QuestionCustomModelBase = /** @class */ (function (_super) {
     QuestionCustomModelBase.prototype.ensureRowsVisibility = function () {
         // do nothing
     };
+    QuestionCustomModelBase.prototype.validateContainerOnly = function () {
+        // do nothing
+    };
     QuestionCustomModelBase.prototype.getContentDisplayValueCore = function (keyAsText, value, question) {
         if (!question)
             return _super.prototype.getDisplayValueCore.call(this, keyAsText, value);
@@ -37953,7 +38105,7 @@ var QuestionCustomModel = /** @class */ (function (_super) {
         if (!this.contentQuestion)
             return;
         if (this.isEmpty() && !this.contentQuestion.isEmpty()) {
-            this.value = this.contentQuestion.value;
+            this.value = this.getContentQuestionValue();
         }
     };
     QuestionCustomModel.prototype.runCondition = function (values, properties) {
@@ -37972,9 +38124,24 @@ var QuestionCustomModel = /** @class */ (function (_super) {
     };
     QuestionCustomModel.prototype.convertDataValue = function (name, newValue) {
         return this.convertDataName(name) == _super.prototype.convertDataName.call(this, name)
-            ? this.contentQuestion.value
+            ? this.getContentQuestionValue()
             : newValue;
     };
+    QuestionCustomModel.prototype.getContentQuestionValue = function () {
+        if (!this.contentQuestion)
+            return undefined;
+        var val = this.contentQuestion.value;
+        if (!!this.customQuestion)
+            val = this.customQuestion.getValueFromQuestion(val);
+        return val;
+    };
+    QuestionCustomModel.prototype.setContentQuestionValue = function (val) {
+        if (!this.contentQuestion)
+            return;
+        if (!!this.customQuestion)
+            val = this.customQuestion.setValueToQuestion(val);
+        this.contentQuestion.value = val;
+    };
     QuestionCustomModel.prototype.canSetValueToSurvey = function () {
         return false;
     };
@@ -37982,8 +38149,8 @@ var QuestionCustomModel = /** @class */ (function (_super) {
         if (updateIsAnswered === void 0) { updateIsAnswered = true; }
         _super.prototype.setQuestionValue.call(this, newValue, updateIsAnswered);
         if (!this.isLoadingFromJson && !!this.contentQuestion &&
-            !this.isTwoValueEquals(this.contentQuestion.value, newValue)) {
-            this.contentQuestion.value = this.getUnbindValue(newValue);
+            !this.isTwoValueEquals(this.getContentQuestionValue(), newValue)) {
+            this.setContentQuestionValue(this.getUnbindValue(newValue));
         }
     };
     QuestionCustomModel.prototype.onSurveyValueChanged = function (newValue) {
@@ -37994,7 +38161,7 @@ var QuestionCustomModel = /** @class */ (function (_super) {
     };
     QuestionCustomModel.prototype.getValueCore = function () {
         if (!!this.contentQuestion)
-            return this.contentQuestion.value;
+            return this.getContentQuestionValue();
         return _super.prototype.getValueCore.call(this);
     };
     QuestionCustomModel.prototype.initElement = function (el) {
@@ -38150,7 +38317,7 @@ var QuestionCompositeModel = /** @class */ (function (_super) {
         }
         _super.prototype.onSurveyLoad.call(this);
         if (!!this.contentPanel) {
-            var val = this.contentPanel.getValue();
+            var val = this.getContentPanelValue();
             if (!_helpers__WEBPACK_IMPORTED_MODULE_3__["Helpers"].isValueEmpty(val)) {
                 this.value = val;
             }
@@ -38215,12 +38382,20 @@ var QuestionCompositeModel = /** @class */ (function (_super) {
         this.settingNewValue = false;
     };
     QuestionCompositeModel.prototype.updateValueCoreWithPanelValue = function () {
-        var panelValue = this.contentPanel.getValue();
+        var panelValue = this.getContentPanelValue();
         if (this.isTwoValueEquals(this.getValueCore(), panelValue))
             return false;
         this.setValueCore(panelValue);
         return true;
     };
+    QuestionCompositeModel.prototype.getContentPanelValue = function (val) {
+        if (!val)
+            val = this.contentPanel.getValue();
+        return this.customQuestion.setValueToQuestion(val);
+    };
+    QuestionCompositeModel.prototype.getValueForContentPanel = function (val) {
+        return this.customQuestion.getValueFromQuestion(val);
+    };
     QuestionCompositeModel.prototype.setNewValueIntoQuestion = function (name, newValue) {
         var q = this.getQuestionByName(name);
         if (!!q && !this.isTwoValueEquals(newValue, q.value)) {
@@ -38242,7 +38417,7 @@ var QuestionCompositeModel = /** @class */ (function (_super) {
         }
     };
     QuestionCompositeModel.prototype.convertDataValue = function (name, newValue) {
-        var val = this.value;
+        var val = this.getValueForContentPanel(this.value);
         if (!val)
             val = {};
         if (this.isValueEmpty(newValue) && !this.isEditingSurveyElement) {
@@ -38251,19 +38426,20 @@ var QuestionCompositeModel = /** @class */ (function (_super) {
         else {
             val[name] = newValue;
         }
-        return val;
+        return this.getContentPanelValue(val);
     };
     QuestionCompositeModel.prototype.setQuestionValue = function (newValue, updateIsAnswered) {
         if (updateIsAnswered === void 0) { updateIsAnswered = true; }
         this.setValuesIntoQuestions(newValue);
         if (!this.isEditingSurveyElement && !!this.contentPanel) {
-            newValue = this.contentPanel.getValue();
+            newValue = this.getContentPanelValue();
         }
         _super.prototype.setQuestionValue.call(this, newValue, updateIsAnswered);
     };
     QuestionCompositeModel.prototype.setValuesIntoQuestions = function (newValue) {
         if (!this.contentPanel)
             return;
+        newValue = this.getValueForContentPanel(newValue);
         var oldSettingNewValue = this.settingNewValue;
         this.settingNewValue = true;
         var questions = this.contentPanel.questions;
@@ -38361,7 +38537,7 @@ var QuestionDropdownModel = /** @class */ (function (_super) {
         _this.registerPropertyChangedHandlers(["choicesMin", "choicesMax", "choicesStep"], function () {
             _this.onVisibleChoicesChanged();
         });
-        _this.registerPropertyChangedHandlers(["value", "renderAs", "showOtherItem", "otherText", "placeholder", "choices"], function () {
+        _this.registerPropertyChangedHandlers(["value", "renderAs", "showOtherItem", "otherText", "placeholder", "choices", "visibleChoices"], function () {
             _this.updateReadOnlyText();
         });
         _this.updateReadOnlyText();
@@ -39679,6 +39855,13 @@ var QuestionFileModel = /** @class */ (function (_super) {
             }
         });
     };
+    Object.defineProperty(QuestionFileModel.prototype, "renderCapture", {
+        get: function () {
+            return this.allowCameraAccess ? "user" : undefined;
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(QuestionFileModel.prototype, "multipleRendered", {
         get: function () {
             return this.allowMultiple ? "multiple" : undefined;
@@ -39815,13 +39998,7 @@ var QuestionFileModel = /** @class */ (function (_super) {
                         _this.previewValue.push(val);
                     });
                 }
-                _this.isReadyValue = true;
-                _this.onReadyChanged &&
-                    _this.onReadyChanged.fire(_this, {
-                        question: _this,
-                        isReady: true,
-                        oldIsReady: false,
-                    });
+                _this.isReady = true;
                 _this._previewLoader.dispose();
                 _this._previewLoader = undefined;
             });
@@ -39984,6 +40161,9 @@ var QuestionFileModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: false })
     ], QuestionFileModel.prototype, "containsMultiplyFiles", void 0);
+    __decorate([
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
+    ], QuestionFileModel.prototype, "allowCameraAccess", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ localizable: { defaultStr: "confirmRemoveFile" } })
     ], QuestionFileModel.prototype, "confirmRemoveMessage", void 0);
@@ -40029,6 +40209,7 @@ _jsonobject__WEBPACK_IMPORTED_MODULE_1__["Serializer"].addClass("file", [
     { name: "correctAnswer", visible: false },
     { name: "validators", visible: false },
     { name: "needConfirmRemoveFile:boolean" },
+    { name: "allowCameraAccess:switch", category: "general" }
 ], function () {
     return new QuestionFileModel("");
 }, "question");
@@ -40043,19 +40224,22 @@ var FileLoader = /** @class */ (function () {
     }
     FileLoader.prototype.load = function (files) {
         var _this = this;
-        files.forEach(function (value) {
+        var downloadedCount = 0;
+        this.loaded = new Array(files.length);
+        files.forEach(function (value, index) {
             if (_this.fileQuestion.survey) {
                 _this.fileQuestion.survey.downloadFile(_this.fileQuestion, _this.fileQuestion.name, value, function (status, data) {
                     if (!_this.fileQuestion || !_this.callback) {
                         return;
                     }
                     if (status === "success") {
-                        _this.loaded.push({
+                        _this.loaded[index] = {
                             content: data,
                             name: value.name,
                             type: value.type,
-                        });
-                        if (_this.loaded.length === files.length) {
+                        };
+                        downloadedCount++;
+                        if (downloadedCount === files.length) {
                             _this.callback("loaded", _this.loaded);
                         }
                     }
@@ -42463,7 +42647,10 @@ var MatrixDropdownRowModelBase = /** @class */ (function () {
     };
     MatrixDropdownRowModelBase.prototype.getFilteredValues = function () {
         var allValues = this.getAllValues();
-        var values = { row: allValues };
+        var values = this.validationValues;
+        if (!values)
+            values = {};
+        values.row = allValues;
         for (var key in allValues) {
             values[key] = allValues[key];
         }
@@ -42740,6 +42927,7 @@ var MatrixDropdownRowModelBase = /** @class */ (function () {
         var cells = this.cells;
         if (!cells)
             return res;
+        this.validationValues = rec.validationValues;
         for (var colIndex = 0; colIndex < cells.length; colIndex++) {
             if (!cells[colIndex])
                 continue;
@@ -42764,6 +42952,7 @@ var MatrixDropdownRowModelBase = /** @class */ (function () {
             }
             res = panelHasError || res;
         }
+        this.validationValues = undefined;
         return res;
     };
     MatrixDropdownRowModelBase.prototype.updateCellOnColumnChanged = function (cell, name, newValue) {
@@ -44112,6 +44301,7 @@ var QuestionMatrixDropdownModelBase = /** @class */ (function (_super) {
             rec = {};
         if (!rows)
             return rec;
+        rec.validationValues = this.getDataFilteredValues();
         rec.isSingleDetailPanel = this.detailPanelMode === "underRowSingle";
         for (var i = 0; i < rows.length; i++) {
             res = rows[i].hasErrors(fireCallback, rec, function () {
@@ -45087,10 +45277,10 @@ var MatrixDropdownColumn = /** @class */ (function (_super) {
     });
     Object.defineProperty(MatrixDropdownColumn.prototype, "width", {
         get: function () {
-            return this.getPropertyValue("width", "");
+            return this.templateQuestion.width;
         },
         set: function (val) {
-            this.setPropertyValue("width", val);
+            this.templateQuestion.width = val;
         },
         enumerable: false,
         configurable: true
@@ -48250,6 +48440,9 @@ var QuestionMultipleTextModel = /** @class */ (function (_super) {
     QuestionMultipleTextModel.prototype.ensureRowsVisibility = function () {
         // do nothing
     };
+    QuestionMultipleTextModel.prototype.validateContainerOnly = function () {
+        // do nothing
+    };
     QuestionMultipleTextModel.prototype.getItemLabelCss = function (item) {
         return new _utils_cssClassBuilder__WEBPACK_IMPORTED_MODULE_7__["CssClassBuilder"]().append(this.cssClasses.itemLabel).append(this.cssClasses.itemLabelOnError, item.editor.errors.length > 0).toString();
     };
@@ -50124,12 +50317,11 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
             var res = this.changingValueQuestion.hasErrors(fireCallback, rec);
             res = this.hasKeysDuplicated(fireCallback, rec) || res;
             this.updatePanelsContainsErrors();
-            return res;
         }
         else {
-            var errosInPanels = this.hasErrorInPanels(fireCallback, rec);
-            return _super.prototype.hasErrors.call(this, fireCallback) || errosInPanels;
+            res = this.hasErrorInPanels(fireCallback, rec);
         }
+        return _super.prototype.hasErrors.call(this, fireCallback, rec) || res;
     };
     QuestionPanelDynamicModel.prototype.getContainsErrors = function () {
         var res = _super.prototype.getContainsErrors.call(this);
@@ -50414,7 +50606,6 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
     };
     QuestionPanelDynamicModel.prototype.recalculateIsReadyValue = function () {
         var _this = this;
-        var oldIsReady = this.isReadyValue;
         var isReady = true;
         this.panels.forEach(function (panel) {
             panel.questions.forEach(function (q) {
@@ -50427,14 +50618,7 @@ var QuestionPanelDynamicModel = /** @class */ (function (_super) {
                 }
             });
         });
-        this.isReadyValue = isReady;
-        if (oldIsReady != this.isReadyValue) {
-            this.onReadyChanged.fire(this, {
-                question: this,
-                oldIsReady: oldIsReady,
-                isReady: this.isReadyValue
-            });
-        }
+        this.isReady = isReady;
     };
     QuestionPanelDynamicModel.prototype.onSetData = function () {
         _super.prototype.onSetData.call(this);
@@ -51173,7 +51357,7 @@ var QuestionRankingModel = /** @class */ (function (_super) {
             var target = event.target;
             if (!_this.isDragStartNodeValid(target))
                 return;
-            if (_this.allowStartDrag) {
+            if (_this.allowStartDrag && _this.canStartDragDueMaxSelectedChoices(target)) {
                 _this.dragDropRankingChoices.startDrag(event, choice, _this, node);
             }
         };
@@ -51447,6 +51631,22 @@ var QuestionRankingModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    QuestionRankingModel.prototype.canStartDragDueMaxSelectedChoices = function (target) {
+        if (!this.selectToRankEnabled)
+            return true;
+        var fromContainer = target.closest("[data-ranking='from-container']");
+        if (fromContainer) {
+            return this.checkMaxSelectedChoicesUnreached();
+        }
+        return true;
+    };
+    QuestionRankingModel.prototype.checkMaxSelectedChoicesUnreached = function () {
+        if (this.maxSelectedChoices < 1)
+            return true;
+        var val = this.value;
+        var len = !Array.isArray(val) ? 0 : val.length;
+        return len < this.maxSelectedChoices;
+    };
     //cross framework initialization
     QuestionRankingModel.prototype.afterRenderQuestionElement = function (el) {
         this.domNode = el;
@@ -51476,14 +51676,14 @@ var QuestionRankingModel = /** @class */ (function (_super) {
         var isMovedElementUnRanked = !isMovedElementRanked;
         var fromIndex;
         var toIndex;
-        if (key === " " && isMovedElementUnRanked) {
+        if ((key === " " || key === "Enter") && isMovedElementUnRanked) {
             fromIndex = unRankingChoices.indexOf(movedElement);
             toIndex = 0;
             dnd.selectToRank(this, fromIndex, toIndex);
             this.setValueAfterKeydown(toIndex, "to-container");
             return;
         }
-        if (key === " " && isMovedElementRanked) {
+        if ((key === " " || key === "Enter") && isMovedElementRanked) {
             fromIndex = rankingChoices.indexOf(movedElement);
             dnd.unselectFromRank(this, fromIndex);
             toIndex = this.unRankingChoices.indexOf(movedElement); //'this.' leads to actual array after the 'unselectFromRank' method
@@ -51575,6 +51775,8 @@ var QuestionRankingModel = /** @class */ (function (_super) {
          * @see selectToRankAreasLayout
         */
         get: function () {
+            if (_utils_devices__WEBPACK_IMPORTED_MODULE_7__["IsMobile"])
+                return "vertical";
             return this.getPropertyValue("selectToRankAreasLayout", "horizontal");
         },
         set: function (val) {
@@ -51600,11 +51802,11 @@ var QuestionRankingModel = /** @class */ (function (_super) {
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_3__["property"])({ defaultValue: null })
     ], QuestionRankingModel.prototype, "dropTargetNodeMove", void 0);
     __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_3__["property"])({ localizable: { defaultStr: "selectToRankFromContainerPlaceholder" } })
-    ], QuestionRankingModel.prototype, "selectToRankFromContainerPlaceholder", void 0);
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_3__["property"])({ localizable: { defaultStr: "selectToRankEmptyRankedAreaText" } })
+    ], QuestionRankingModel.prototype, "selectToRankEmptyRankedAreaText", void 0);
     __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_3__["property"])({ localizable: { defaultStr: "selectToRankToContainerPlaceholder" } })
-    ], QuestionRankingModel.prototype, "selectToRankToContainerPlaceholder", void 0);
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_3__["property"])({ localizable: { defaultStr: "selectToRankEmptyUnrankedAreaText" } })
+    ], QuestionRankingModel.prototype, "selectToRankEmptyUnrankedAreaText", void 0);
     return QuestionRankingModel;
 }(_question_checkbox__WEBPACK_IMPORTED_MODULE_5__["QuestionCheckboxModel"]));
 
@@ -52750,6 +52952,10 @@ var QuestionSignaturePadModel = /** @class */ (function (_super) {
     function QuestionSignaturePadModel(name) {
         return _super.call(this, name) || this;
     }
+    QuestionSignaturePadModel.prototype.getPenColorFromTheme = function () {
+        var _survey = this.survey;
+        return !!_survey && !!_survey.themeVariables && _survey.themeVariables["--sjs-primary-backcolor"];
+    };
     QuestionSignaturePadModel.prototype.getCssRoot = function (cssClasses) {
         return new _utils_cssClassBuilder__WEBPACK_IMPORTED_MODULE_4__["CssClassBuilder"]()
             .append(_super.prototype.getCssRoot.call(this, cssClasses))
@@ -52758,7 +52964,9 @@ var QuestionSignaturePadModel = /** @class */ (function (_super) {
     };
     QuestionSignaturePadModel.prototype.updateValue = function () {
         if (this.signaturePad) {
-            var data = this.signaturePad.toDataURL(this.dataFormat);
+            var format = this.dataFormat === "jpeg" ? "image/jpeg" :
+                (this.dataFormat === "svg" ? "image/svg+xml" : "");
+            var data = this.signaturePad.toDataURL(format);
             this.value = data;
         }
     };
@@ -52832,6 +53040,25 @@ var QuestionSignaturePadModel = /** @class */ (function (_super) {
         this.readOnlyChangedCallback = null;
         this.signaturePad = null;
     };
+    Object.defineProperty(QuestionSignaturePadModel.prototype, "dataFormat", {
+        /**
+         * Specifies the format in which to store the signature image.
+         *
+         * Possible values:
+         *
+         * - `"png"` (default)
+         * - `"jpeg"`
+         * - `"svg"`
+         */
+        get: function () {
+            return this.getPropertyValue("dataFormat");
+        },
+        set: function (val) {
+            this.setPropertyValue("dataFormat", correctFormatData(val));
+        },
+        enumerable: false,
+        configurable: true
+    });
     Object.defineProperty(QuestionSignaturePadModel.prototype, "signatureWidth", {
         /**
          * Specifies the width of the signature area. Accepts positive integer numbers.
@@ -52897,7 +53124,7 @@ var QuestionSignaturePadModel = /** @class */ (function (_super) {
          * @see backgroundColor
          */
         get: function () {
-            return this.getPropertyValue("penColor");
+            return this.getPropertyValue("penColor", this.getPenColorFromTheme());
         },
         set: function (val) {
             this.setPropertyValue("penColor", val);
@@ -52955,12 +53182,17 @@ var QuestionSignaturePadModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: false })
     ], QuestionSignaturePadModel.prototype, "isDrawingValue", void 0);
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_0__["property"])({ defaultValue: "" })
-    ], QuestionSignaturePadModel.prototype, "dataFormat", void 0);
     return QuestionSignaturePadModel;
 }(_question__WEBPACK_IMPORTED_MODULE_2__["Question"]));
 
+function correctFormatData(val) {
+    if (!val)
+        val = "png";
+    val = val.replace("image/", "").replace("+xml", "");
+    if (val !== "jpeg" && val !== "svg")
+        val = "png";
+    return val;
+}
 _jsonobject__WEBPACK_IMPORTED_MODULE_0__["Serializer"].addClass("signaturepad", [
     {
         name: "signatureWidth:number",
@@ -52996,12 +53228,15 @@ _jsonobject__WEBPACK_IMPORTED_MODULE_0__["Serializer"].addClass("signaturepad",
     {
         name: "dataFormat",
         category: "general",
-        default: "",
+        default: "png",
         choices: [
-            { value: "", text: "PNG" },
+            { value: "png", text: "PNG" },
             { value: "image/jpeg", text: "JPEG" },
             { value: "image/svg+xml", text: "SVG" },
         ],
+        onSettingValue: function (obj, val) {
+            return correctFormatData(val);
+        }
     },
     { name: "defaultValue", visible: false },
     { name: "correctAnswer", visible: false },
@@ -57452,7 +57687,9 @@ var SurveyQuestionDropdownBase = /** @class */ (function (_super) {
                 this.renderInput(this.question["dropdownListModel"]),
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_popup_popup__WEBPACK_IMPORTED_MODULE_2__["Popup"], { model: (_b = (_a = this.question) === null || _a === void 0 ? void 0 : _a.dropdownListModel) === null || _b === void 0 ? void 0 : _b.popupModel }));
         }
-        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: cssClasses.selectWrapper }, selectElement));
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: cssClasses.selectWrapper, onClick: this.click },
+            selectElement,
+            this.createChevronButton()));
     };
     SurveyQuestionDropdownBase.prototype.renderValueElement = function (dropdownListModel) {
         if (this.question.showInputFieldComponent) {
@@ -57472,7 +57709,7 @@ var SurveyQuestionDropdownBase = /** @class */ (function (_super) {
                 dropdownListModel.inputStringRendered = e.target.value;
             }
         };
-        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { id: this.question.inputId, className: this.question.getControlClass(), tabIndex: dropdownListModel.inputReadOnly ? undefined : 0, onClick: this.click, 
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { id: this.question.inputId, className: this.question.getControlClass(), tabIndex: dropdownListModel.inputReadOnly ? undefined : 0, 
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
             // @ts-ignore
             disabled: this.question.isInputReadOnly, required: this.question.isRequired, onKeyDown: this.keyhandler, onBlur: this.blur, role: this.question.ariaRole, "aria-required": this.question.ariaRequired, "aria-label": this.question.ariaLabel, "aria-invalid": this.question.ariaInvalid, "aria-describedby": this.question.ariaDescribedBy, "aria-expanded": this.question.ariaExpanded === null ? undefined : this.question.ariaExpanded === "true", "aria-controls": dropdownListModel.listElementId, "aria-activedescendant": dropdownListModel.ariaActivedescendant },
@@ -57495,6 +57732,12 @@ var SurveyQuestionDropdownBase = /** @class */ (function (_super) {
         return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.cssClasses.cleanButton, style: style, onClick: this.clear },
             react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_svg_icon_svg_icon__WEBPACK_IMPORTED_MODULE_3__["SvgIcon"], { className: this.question.cssClasses.cleanButtonSvg, iconName: this.question.cssClasses.cleanButtonIconId, title: this.question.clearCaption, size: "auto" })));
     };
+    SurveyQuestionDropdownBase.prototype.createChevronButton = function () {
+        if (!this.question.cssClasses.chevronButtonIconId)
+            return null;
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.cssClasses.chevronButton },
+            react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_svg_icon_svg_icon__WEBPACK_IMPORTED_MODULE_3__["SvgIcon"], { className: this.question.cssClasses.chevronButtonSvg, iconName: this.question.cssClasses.chevronButtonIconId, size: 24 })));
+    };
     SurveyQuestionDropdownBase.prototype.renderOther = function (cssClasses) {
         return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.getCommentAreaCss(true) },
             react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_reactquestion_comment__WEBPACK_IMPORTED_MODULE_5__["SurveyQuestionOtherValueItem"], { question: this.question, otherCss: cssClasses.other, cssClasses: cssClasses, isDisplayMode: this.isDisplayMode, isOther: true })));
@@ -57658,7 +57901,9 @@ var SurveyQuestionDropdownSelect = /** @class */ (function (_super) {
             (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("select", { id: this.question.inputId, className: this.question.getControlClass(), ref: function (select) { return (_this.setControl(select)); }, autoComplete: this.question.autocomplete, onChange: this.updateValueOnEvent, onInput: this.updateValueOnEvent, onClick: click, onKeyUp: keyup, "aria-required": this.question.ariaRequired, "aria-label": this.question.ariaLabel, "aria-invalid": this.question.ariaInvalid, "aria-describedby": this.question.ariaDescribedBy, required: this.question.isRequired },
                 this.question.allowClear ? (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("option", { value: "" }, this.question.placeholder)) : null,
                 this.question.visibleChoices.map(function (item, i) { return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_dropdown_item__WEBPACK_IMPORTED_MODULE_4__["SurveyQuestionOptionItem"], { key: "item" + i, item: item }); })));
-        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: cssClasses.selectWrapper }, selectElement));
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: cssClasses.selectWrapper },
+            selectElement,
+            this.createChevronButton()));
     };
     return SurveyQuestionDropdownSelect;
 }(_reactquestion_dropdown__WEBPACK_IMPORTED_MODULE_3__["SurveyQuestionDropdown"]));
@@ -58730,7 +58975,8 @@ var PopupSurvey = /** @class */ (function (_super) {
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", { className: this.popup.cssHeaderTitle, style: styleTitle }, "X"))) : null));
     };
     PopupSurvey.prototype.renderBody = function () {
-        return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.popup.cssBody }, this.doRender());
+        var _this = this;
+        return react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.popup.cssBody, onScroll: function () { return _this.popup.onScroll(); } }, this.doRender());
     };
     PopupSurvey.prototype.createSurvey = function (newProps) {
         if (!newProps)
@@ -58906,6 +59152,7 @@ var Survey = /** @class */ (function (_super) {
         else {
             renderResult = this.renderSurvey();
         }
+        var backgroundImage = !!this.survey.renderBackgroundImage ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.css.rootBackgroundImage, style: this.survey.backgroundImageStyle }) : null;
         var header = react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_survey_header_survey_header__WEBPACK_IMPORTED_MODULE_5__["SurveyHeader"], { survey: this.survey });
         var onSubmit = function (event) {
             event.preventDefault();
@@ -58916,11 +59163,9 @@ var Survey = /** @class */ (function (_super) {
         }
         var rootCss = this.survey.getRootCss();
         var cssClasses = this.rootNodeClassName ? this.rootNodeClassName + " " + rootCss : rootCss;
-        var formStyle = {
-            backgroundColor: this.survey.renderBackgroundOpacity
-        };
         return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { id: this.rootNodeId, ref: this.rootRef, className: cssClasses, style: this.survey.themeVariables },
-            react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("form", { onSubmit: onSubmit, style: formStyle },
+            backgroundImage,
+            react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("form", { onSubmit: onSubmit },
                 customHeader,
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.css.container },
                     header,
@@ -59395,6 +59640,8 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _reactSurveyNavigationBase__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./reactSurveyNavigationBase */ "./src/react/reactSurveyNavigationBase.tsx");
 /* harmony import */ var _element_factory__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./element-factory */ "./src/react/element-factory.tsx");
 /* harmony import */ var _components_list_list__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components/list/list */ "./src/react/components/list/list.tsx");
+/* harmony import */ var _components_popup_popup__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components/popup/popup */ "./src/react/components/popup/popup.tsx");
+/* harmony import */ var _components_svg_icon_svg_icon__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./components/svg-icon/svg-icon */ "./src/react/components/svg-icon/svg-icon.tsx");
 var __extends = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -59415,16 +59662,25 @@ var __extends = (undefined && undefined.__extends) || (function () {
 
 
 
+
+
 var SurveyProgressToc = /** @class */ (function (_super) {
     __extends(SurveyProgressToc, _super);
     function SurveyProgressToc() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     SurveyProgressToc.prototype.render = function () {
-        var listModel = Object(survey_core__WEBPACK_IMPORTED_MODULE_1__["createTOCListModel"])(this.props.model);
-        var rootCss = Object(survey_core__WEBPACK_IMPORTED_MODULE_1__["getTocRootCss"])(this.props.model);
-        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: rootCss },
-            react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_list_list__WEBPACK_IMPORTED_MODULE_4__["List"], { model: listModel })));
+        var tocModel = new survey_core__WEBPACK_IMPORTED_MODULE_1__["TOCModel"](this.props.model);
+        var content;
+        if (tocModel.isMobile) {
+            content = react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { onClick: tocModel.togglePopup },
+                react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_svg_icon_svg_icon__WEBPACK_IMPORTED_MODULE_6__["SvgIcon"], { iconName: tocModel.icon, size: 24 }),
+                react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_popup_popup__WEBPACK_IMPORTED_MODULE_5__["Popup"], { model: tocModel.popupModel }));
+        }
+        else {
+            content = react__WEBPACK_IMPORTED_MODULE_0__["createElement"](_components_list_list__WEBPACK_IMPORTED_MODULE_4__["List"], { model: tocModel.listModel });
+        }
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: tocModel.containerCss }, content));
     };
     return SurveyProgressToc;
 }(_reactSurveyNavigationBase__WEBPACK_IMPORTED_MODULE_2__["SurveyNavigationBase"]));
@@ -61100,7 +61356,7 @@ var SurveyQuestionFile = /** @class */ (function (_super) {
         fileInput = (this.isDisplayMode ?
             react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("input", { type: "file", disabled: this.isDisplayMode, className: !this.isDisplayMode ? this.question.cssClasses.fileInput : this.question.getReadOnlyFileCss(), id: this.question.inputId, ref: function (input) { return (_this.setControl(input)); }, style: !this.isDisplayMode ? {} : { color: "transparent" }, onChange: !this.isDisplayMode ? this.question.doChange : (function () { }), multiple: this.question.allowMultiple, placeholder: this.question.title, accept: this.question.acceptedTypes })
             :
-                react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("input", { type: "file", disabled: this.isDisplayMode, tabIndex: -1, className: !this.isDisplayMode ? this.question.cssClasses.fileInput : this.question.getReadOnlyFileCss(), id: this.question.inputId, ref: function (input) { return (_this.setControl(input)); }, style: !this.isDisplayMode ? {} : { color: "transparent" }, onChange: !this.isDisplayMode ? this.question.doChange : (function () { }), "aria-required": this.question.ariaRequired, "aria-label": this.question.ariaLabel, "aria-invalid": this.question.ariaInvalid, "aria-describedby": this.question.ariaDescribedBy, multiple: this.question.allowMultiple, title: this.question.inputTitle, accept: this.question.acceptedTypes }));
+                react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("input", { type: "file", disabled: this.isDisplayMode, tabIndex: -1, className: !this.isDisplayMode ? this.question.cssClasses.fileInput : this.question.getReadOnlyFileCss(), id: this.question.inputId, ref: function (input) { return (_this.setControl(input)); }, style: !this.isDisplayMode ? {} : { color: "transparent" }, onChange: !this.isDisplayMode ? this.question.doChange : (function () { }), "aria-required": this.question.ariaRequired, "aria-label": this.question.ariaLabel, "aria-invalid": this.question.ariaInvalid, "aria-describedby": this.question.ariaDescribedBy, multiple: this.question.allowMultiple, title: this.question.inputTitle, accept: this.question.acceptedTypes, capture: this.question.renderCapture }));
         return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.fileRootCss },
             fileInput,
             react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.cssClasses.dragArea, onDrop: this.question.onDrop, onDragOver: this.question.onDragOver, onDragLeave: this.question.onDragLeave, onDragEnter: this.question.onDragEnter },
@@ -62669,12 +62925,12 @@ var SurveyQuestionRanking = /** @class */ (function (_super) {
                     this.getItems(this.question.unRankingChoices, unrankedItem),
                     this.question.unRankingChoices.length === 0 ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.cssClasses.containerPlaceholder },
                         " ",
-                        this.question.selectToRankFromContainerPlaceholder,
+                        this.question.selectToRankEmptyRankedAreaText,
                         " ") : null),
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.cssClasses.containersDivider }),
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.getContainerClasses("to"), "data-ranking": "to-container" },
                     this.getItems(),
-                    this.question.rankingChoices.length === 0 ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.cssClasses.containerPlaceholder }, this.question.selectToRankToContainerPlaceholder) : null)));
+                    this.question.rankingChoices.length === 0 ? react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.cssClasses.containerPlaceholder }, this.question.selectToRankEmptyUnrankedAreaText) : null)));
         }
     };
     SurveyQuestionRanking.prototype.getItems = function (choices, unrankedItem) {
@@ -62958,7 +63214,7 @@ var SurveyQuestionTagbox = /** @class */ (function (_super) {
         var _this = this;
         var dropdownMultiSelectListModel = dropdownListModel;
         var items = this.question.selectedChoices.map(function (choice, index) { return _this.renderItem("item" + index, choice); });
-        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { id: this.question.inputId, className: this.question.getControlClass(), tabIndex: dropdownListModel.inputReadOnly ? undefined : 0, onClick: this.click, 
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { id: this.question.inputId, className: this.question.getControlClass(), tabIndex: dropdownListModel.inputReadOnly ? undefined : 0, 
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
             // @ts-ignore
             disabled: this.question.isInputReadOnly, required: this.question.isRequired, onKeyDown: this.keyhandler, onBlur: this.blur, role: this.question.ariaRole, "aria-required": this.question.ariaRequired, "aria-label": this.question.ariaLabel, "aria-invalid": this.question.ariaInvalid, "aria-describedby": this.question.ariaDescribedBy, "aria-expanded": this.question.ariaExpanded === null ? undefined : this.question.ariaExpanded === "true", "aria-controls": dropdownListModel.listElementId, "aria-activedescendant": dropdownListModel.ariaActivedescendant },
@@ -66378,11 +66634,11 @@ var SurveyModel = /** @class */ (function (_super) {
         _this.variablesHash = {};
         //#region Event declarations
         /**
-         * An event that is raised after a trigger is executed.
+         * An event that is raised after a [trigger](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#triggers) is executed.
          *
          * For information on event handler parameters, refer to descriptions within the interface.
          *
-         * For more information about triggers, refer to the following help topic: [Conditional Survey Logic (Triggers)](https://surveyjs.io/form-library/documentation/design-survey/conditional-logic#conditional-survey-logic-triggers).
+         * [Conditional Survey Logic (Triggers)](https://surveyjs.io/form-library/documentation/design-survey/conditional-logic#conditional-survey-logic-triggers (linkStyle)).
          * @see triggers
          * @see runTriggers
          */
@@ -66426,11 +66682,11 @@ var SurveyModel = /** @class */ (function (_super) {
          */
         _this.onStarted = _this.addEvent();
         /**
-         * Use this event to save incomplete survey results. Enable the [`sendResultOnPageNext`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#sendResultOnPageNext) property for this event to occur.
+         * An event that is raised to save incomplete survey results. Enable the [`sendResultOnPageNext`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#sendResultOnPageNext) property for this event to occur.
          *
          * For information on event handler parameters, refer to descriptions within the interface.
          *
-         * Refer to the following help topic for more information on the use case: [Continue an Incomplete Survey](https://surveyjs.io/form-library/documentation/handle-survey-results-continue-incomplete).
+         * [Continue an Incomplete Survey](https://surveyjs.io/form-library/documentation/handle-survey-results-continue-incomplete (linkStyle)).
          */
         _this.onPartialSend = _this.addEvent();
         /**
@@ -66656,11 +66912,11 @@ var SurveyModel = /** @class */ (function (_super) {
          */
         _this.onTextRenderAs = _this.addEvent();
         /**
-         * The event fires when it gets response from the [api.surveyjs.io](https://api.surveyjs.io) service on saving survey results. Use it to find out if the results have been saved successfully.
+         * An event that is raised after a request to save survey results on [SurveyJS Service](https://api.surveyjs.io/) has been completed. Use this event to find out if the results have been saved successfully.
          */
         _this.onSendResult = _this.addEvent();
         /**
-         * Use it to get results after calling the `getResult` method. It returns a simple analytics from [api.surveyjs.io](https://api.surveyjs.io) service.
+         * An event that is raised when the [`getResult(resultId, questionName)`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#getResult) method is called. Use this event to obtain answers to an individual question from [SurveyJS Service](https://api.surveyjs.io/).
          * @see getResult
          */
         _this.onGetResult = _this.addEvent();
@@ -66949,25 +67205,23 @@ var SurveyModel = /** @class */ (function (_super) {
         _this.onScrollingElementToTop = _this.addEvent();
         _this.onLocaleChangedEvent = _this.addEvent();
         /**
-         * Use this event to create/customize actions to be displayed in a question's title.
+         * An event that allows you to add, delete, or modify actions in a question title.
          *
          * For information on event handler parameters, refer to descriptions within the interface.
          *
          * [View Demo](https://surveyjs.io/form-library/examples/survey-titleactions/ (linkStyle))
-         * @see IAction
-         * @see Question
         */
         _this.onGetQuestionTitleActions = _this.addEvent();
         /**
-         * Use this event to create/customize actions to be displayed in a panel's title.
-         * @see IAction
-         * @see PanelModel
+         * An event that allows you to add, delete, or modify actions in a panel title.
          */
         _this.onGetPanelTitleActions = _this.addEvent();
         /**
-         * Use this event to create/customize actions to be displayed in a page's title.
-         * @see IAction
-         * @see PageModel
+         * An event that allows you to add, delete, or modify actions in a page title.
+         *
+         * For information on event handler parameters, refer to descriptions within the interface.
+         *
+         * [View Demo](https://surveyjs.io/form-library/examples/modify-titles-of-survey-elements/ (linkStyle))
          */
         _this.onGetPageTitleActions = _this.addEvent();
         /**
@@ -66992,6 +67246,10 @@ var SurveyModel = /** @class */ (function (_super) {
          * An event that is raised before expression question convert it's value into display value for rendering.
          */
         _this.onGetExpressionDisplayValue = _this.addEvent();
+        /**
+         * An event that is raised after the visibility of a popup is changed. This event can be raised for [Single-](https://surveyjs.io/form-library/documentation/api-reference/dropdown-menu-model) and [Multi-Select Dropdown](https://surveyjs.io/form-library/documentation/api-reference/dropdown-tag-box-model) questions and [Rating](https://surveyjs.io/form-library/documentation/api-reference/rating-scale-question-model) questions [rendered as drop-down menus](https://surveyjs.io/form-library/documentation/api-reference/rating-scale-question-model#displayMode).
+         */
+        _this.onPopupVisibleChanged = _this.addEvent();
         /**
          * The list of errors on loading survey JSON. If the list is empty after loading a JSON, then the JSON is correct and has no errors.
          * @see JsonError
@@ -67239,6 +67497,9 @@ var SurveyModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    SurveyModel.prototype.processClosedPopup = function (question, popupModel) {
+        throw new Error("Method not implemented.");
+    };
     SurveyModel.prototype.createTryAgainAction = function () {
         var _this = this;
         return {
@@ -67467,8 +67728,11 @@ var SurveyModel = /** @class */ (function (_super) {
     };
     Object.defineProperty(SurveyModel.prototype, "triggers", {
         /**
-         * Gets or sets a list of triggers in the survey.
-         * @see SurveyTrigger
+         * A list of triggers in the survey.
+         *
+         * [Conditional Survey Logic (Triggers)](https://surveyjs.io/form-library/documentation/design-survey/conditional-logic#conditional-survey-logic-triggers (linkStyle))
+         * @see runTriggers
+         * @see onTriggerExecuted
          */
         get: function () {
             return this.getPropertyValue("triggers");
@@ -67494,7 +67758,7 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "surveyId", {
         /**
-         * The identifier of a survey JSON schema to load from the [SurveyJS Service](https://api.surveyjs.io).
+         * The identifier of a survey JSON schema to load from [SurveyJS Service](https://api.surveyjs.io).
          *
          * Refer to the following help topic for more information: [Store Survey Results in the SurveyJS Service](https://surveyjs.io/form-library/documentation/handle-survey-results-store#store-survey-results-in-the-surveyjs-service).
          * @see loadSurveyFromService
@@ -67511,7 +67775,7 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "surveyPostId", {
         /**
-         * An identifier used to save survey results to the [SurveyJS Service](https://api.surveyjs.io).
+         * An identifier used to save survey results to [SurveyJS Service](https://api.surveyjs.io).
          *
          * Refer to the following help topic for more information: [Store Survey Results in the SurveyJS Service](https://surveyjs.io/form-library/documentation/handle-survey-results-store#store-survey-results-in-the-surveyjs-service).
          * @see onComplete
@@ -67530,7 +67794,7 @@ var SurveyModel = /** @class */ (function (_super) {
         /**
          * A user identifier (e-mail or other unique ID).
          *
-         * If your application works with the [SurveyJS Service](https://api.surveyjs.io), the ID ensures that users do not pass the same survey twice. On the second run, they will see the [Completed Before page](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#completedBeforeHtml).
+         * If your application works with [SurveyJS Service](https://api.surveyjs.io), the ID ensures that users do not pass the same survey twice. On the second run, they will see the [Completed Before page](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#completedBeforeHtml).
          * @see cookieName
          */
         get: function () {
@@ -67560,9 +67824,9 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "sendResultOnPageNext", {
         /**
-         * Specifies whether to save survey results when respondents swtich between pages. Handle the [`onPartialSend`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#onPartialSend) event to implement the save operation.
+         * Specifies whether to save survey results when respondents switch between pages. Handle the [`onPartialSend`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#onPartialSend) event to implement the save operation.
          *
-         * Refer to the following help topic for more information on the use case: [Continue an Incomplete Survey](https://surveyjs.io/form-library/documentation/handle-survey-results-continue-incomplete).
+         * [Continue an Incomplete Survey](https://surveyjs.io/form-library/documentation/handle-survey-results-continue-incomplete (linkStyle)).
          */
         get: function () {
             return this.getPropertyValue("sendResultOnPageNext");
@@ -68098,8 +68362,13 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "locale", {
         /**
-         * Gets or sets the survey locale. The default value it is empty, this means the 'en' locale is used.
-         * You can set it to 'de' - German, 'fr' - French and so on. The library has built-in localization for several languages. The library has a multi-language support as well.
+         * Specifies the survey's locale.
+         *
+         * Default value: `""` (a default locale is used)
+         *
+         * [Localization & Globalization help topic](https://surveyjs.io/form-library/documentation/survey-localization (linkStyle))
+         *
+         * [Survey Localization demo](https://surveyjs.io/form-library/examples/survey-localization/ (linkStyle))
          */
         get: function () {
             return this.getPropertyValue("locale", _surveyStrings__WEBPACK_IMPORTED_MODULE_8__["surveyLocalization"].currentLocale);
@@ -68119,7 +68388,11 @@ var SurveyModel = /** @class */ (function (_super) {
         this.onLocaleChangedEvent.fire(this, this.locale);
     };
     /**
-     * Returns an array of locales that are used in the survey's translation.
+     * Returns an array of locales whose translations are used in the survey.
+     *
+     * [Localization & Globalization help topic](https://surveyjs.io/form-library/documentation/survey-localization (linkStyle))
+     *
+     * [Survey Localization demo](https://surveyjs.io/form-library/examples/survey-localization/ (linkStyle))
      */
     SurveyModel.prototype.getUsedLocales = function () {
         var locs = new Array();
@@ -68436,10 +68709,7 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "themeVariables", {
         get: function () {
-            var result = Object.assign({}, this.cssVariables);
-            result.backgroundImage = this.renderBackgroundImage;
-            result.backgroundSize = this.backgroundImageFit;
-            return result;
+            return Object.assign({}, this.cssVariables);
         },
         enumerable: false,
         configurable: true
@@ -68512,12 +68782,12 @@ var SurveyModel = /** @class */ (function (_super) {
         configurable: true
     });
     SurveyModel.prototype.updateRenderBackgroundImage = function () {
-        this.renderBackgroundImage = ["url(", this.getLocalizableString("backgroundImage").renderedHtml, ")"].join("");
+        var path = this.getLocalizableString("backgroundImage").renderedHtml;
+        this.renderBackgroundImage = !!path ? ["url(", path, ")"].join("") : "";
     };
     Object.defineProperty(SurveyModel.prototype, "backgroundOpacity", {
         /**
-         * A value from 0 to 1 that specifies how transparent the survey background should be: 0 makes the background completely transparent, and 1 makes it opaque.
-         * @see backgroundImage
+         * A value from 0 to 1 that specifies how transparent the [background image](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#backgroundImage) should be: 0 makes the image completely transparent, and 1 makes it opaque.
          */
         get: function () {
             return this.getPropertyValue("backgroundOpacity");
@@ -68528,14 +68798,14 @@ var SurveyModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
-    Object.defineProperty(SurveyModel.prototype, "renderBackgroundOpacity", {
+    Object.defineProperty(SurveyModel.prototype, "backgroundImageStyle", {
         get: function () {
-            var backgroundOpacityProperty = this.getPropertyByName("backgroundOpacity");
-            if (backgroundOpacityProperty.isDefaultValue(this.backgroundOpacity)) {
-                return "";
-            }
-            var alpha = 1 - this.backgroundOpacity;
-            return ["rgba(255, 255, 255, ", alpha, ")"].join("");
+            return {
+                opacity: this.backgroundOpacity,
+                backgroundImage: this.renderBackgroundImage,
+                backgroundSize: this.backgroundImageFit,
+                backgroundAttachment: this.backgroundImageAttachment
+            };
         },
         enumerable: false,
         configurable: true
@@ -68604,7 +68874,10 @@ var SurveyModel = /** @class */ (function (_super) {
         return new _conditions__WEBPACK_IMPORTED_MODULE_13__["ConditionRunner"](expression).run(values, properties);
     };
     /**
-     * Run all triggers that performs on value changed and not on moving to the next page.
+     * Executes [all triggers](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#triggers), except ["complete"](https://surveyjs.io/form-library/documentation/design-survey/conditional-logic#complete).
+     *
+     * [Conditional Survey Logic (Triggers)](https://surveyjs.io/form-library/documentation/design-survey/conditional-logic#conditional-survey-logic-triggers (linkStyle))
+     * @see onTriggerExecuted
      */
     SurveyModel.prototype.runTriggers = function () {
         this.checkTriggers(this.getFilteredValues(), false);
@@ -68654,7 +68927,7 @@ var SurveyModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(SurveyModel.prototype, "loadingHtml", {
         /**
-         * HTML content displayed while a survey JSON schema is being loaded from the [SurveyJS Service](https://api.surveyjs.io).
+         * HTML content displayed while a survey JSON schema is being loaded from [SurveyJS Service](https://api.surveyjs.io).
          * @see surveyId
          * @see processedLoadingHtml
          */
@@ -70195,7 +70468,19 @@ var SurveyModel = /** @class */ (function (_super) {
     Object.defineProperty(SurveyModel.prototype, "areEmptyElementsHidden", {
         get: function () {
             return (this.isShowingPreview &&
-                this.showPreviewBeforeComplete == "showAnsweredQuestions");
+                this.showPreviewBeforeComplete == "showAnsweredQuestions" && this.isAnyQuestionAnswered);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(SurveyModel.prototype, "isAnyQuestionAnswered", {
+        get: function () {
+            var questions = this.getAllQuestions(true);
+            for (var i = 0; i < questions.length; i++) {
+                if (!questions[i].isEmpty())
+                    return true;
+            }
+            return false;
         },
         enumerable: false,
         configurable: true
@@ -70981,7 +71266,7 @@ var SurveyModel = /** @class */ (function (_super) {
      * 1. Switches the survey [`state`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#state) to `"completed"`.
      * 1. Raises the [`onComplete`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#onComplete) event.
      * 1. Navigates the user to a URL specified by the [`navigateToUrl`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#navigateToUrl) or [`navigateToUrlOnCondition`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#navigateToUrlOnCondition) property.
-     * 1. Calls the [`sendResult()`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#sendResult) method if Form Library works with the [SurveyJS Service](https://api.surveyjs.io/).
+     * 1. Calls the [`sendResult()`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#sendResult) method if Form Library works with [SurveyJS Service](https://api.surveyjs.io/).
      *
      * The `doComplete()` method completes the survey regardless of validation errors and the current page. If you need to ensure that survey results are valid and full, call the [`completeLastPage()`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#completeLastPage) method instead.
      *
@@ -70989,11 +71274,11 @@ var SurveyModel = /** @class */ (function (_super) {
      * @returns `false` if survey completion is cancelled within the [`onCompleting`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#onCompleting) event handler; otherwise, `true`.
      * @see surveyPostId
      */
-    SurveyModel.prototype.doComplete = function (isCompleteOnTrigger) {
+    SurveyModel.prototype.doComplete = function (isCompleteOnTrigger, completeTrigger) {
         if (isCompleteOnTrigger === void 0) { isCompleteOnTrigger = false; }
         if (this.isCompleted)
             return;
-        if (!this.checkOnCompletingEvent(isCompleteOnTrigger)) {
+        if (!this.checkOnCompletingEvent(isCompleteOnTrigger, completeTrigger)) {
             this.isCompleted = false;
             return false;
         }
@@ -71001,11 +71286,11 @@ var SurveyModel = /** @class */ (function (_super) {
         this.stopTimer();
         this.isCompleted = true;
         this.clearUnusedValues();
-        this.saveDataOnComplete(isCompleteOnTrigger);
+        this.saveDataOnComplete(isCompleteOnTrigger, completeTrigger);
         this.setCookie();
         return true;
     };
-    SurveyModel.prototype.saveDataOnComplete = function (isCompleteOnTrigger) {
+    SurveyModel.prototype.saveDataOnComplete = function (isCompleteOnTrigger, completeTrigger) {
         var _this = this;
         if (isCompleteOnTrigger === void 0) { isCompleteOnTrigger = false; }
         var previousCookie = this.hasCookie;
@@ -71026,6 +71311,7 @@ var SurveyModel = /** @class */ (function (_super) {
         var savingDataStarted = false;
         var onCompleteOptions = {
             isCompleteOnTrigger: isCompleteOnTrigger,
+            completeTrigger: completeTrigger,
             showSaveInProgress: showSaveInProgress,
             showSaveError: showSaveError,
             showSaveSuccess: showSaveSuccess,
@@ -71044,11 +71330,12 @@ var SurveyModel = /** @class */ (function (_super) {
             this.navigateTo();
         }
     };
-    SurveyModel.prototype.checkOnCompletingEvent = function (isCompleteOnTrigger) {
+    SurveyModel.prototype.checkOnCompletingEvent = function (isCompleteOnTrigger, completeTrigger) {
         var options = {
             allowComplete: true,
             allow: true,
             isCompleteOnTrigger: isCompleteOnTrigger,
+            completeTrigger: completeTrigger
         };
         this.onCompleting.fire(this, options);
         return options.allowComplete && options.allow;
@@ -71193,8 +71480,8 @@ var SurveyModel = /** @class */ (function (_super) {
             this.doComplete(true);
         }
     };
-    SurveyModel.prototype.setCompleted = function () {
-        this.doComplete(true);
+    SurveyModel.prototype.setCompleted = function (trigger) {
+        this.doComplete(true, trigger);
     };
     SurveyModel.prototype.canBeCompleted = function (trigger, isCompleted) {
         if (!_settings__WEBPACK_IMPORTED_MODULE_14__["settings"].triggers.changeNavigationButtonsOnComplete)
@@ -72300,20 +72587,18 @@ var SurveyModel = /** @class */ (function (_super) {
         }
     };
     /**
-     * Sends a survey result to the [api.surveyjs.io](https://api.surveyjs.io) service.
-     * @param postId [api.surveyjs.io](https://api.surveyjs.io) service postId
-     * @param clientId Typically a customer e-mail or an identifier
-     * @param isPartialCompleted Set it to `true` if the survey is not completed yet and the results are intermediate
-     * @see surveyPostId
-     * @see clientId
+     * Posts a survey result to [SurveyJS Service](https://api.surveyjs.io/).
+     * @param postId An identifier used to save survey results. You can find it on the [My Surveys](https://surveyjs.io/service/mysurveys) page. If you do not specify this parameter, the survey uses the [`surveyPostId`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#surveyPostId) property value.
+     * @param clientId A respondent identifier (e-mail or other unique ID). This ID ensures that the respondent does not pass the same survey twice.
+     * @param isPartial Pass `true` to save partial survey results (see [Continue an Incomplete Survey](https://surveyjs.io/form-library/documentation/handle-survey-results-continue-incomplete)).
      */
-    SurveyModel.prototype.sendResult = function (postId, clientId, isPartialCompleted) {
+    SurveyModel.prototype.sendResult = function (postId, clientId, isPartial) {
         if (postId === void 0) { postId = null; }
         if (clientId === void 0) { clientId = null; }
-        if (isPartialCompleted === void 0) { isPartialCompleted = false; }
+        if (isPartial === void 0) { isPartial = false; }
         if (!this.isEditMode)
             return;
-        if (isPartialCompleted && this.onPartialSend) {
+        if (isPartial && this.onPartialSend) {
             this.onPartialSend.fire(this, null);
         }
         if (!postId && this.surveyPostId) {
@@ -72324,7 +72609,7 @@ var SurveyModel = /** @class */ (function (_super) {
         if (clientId) {
             this.clientId = clientId;
         }
-        if (isPartialCompleted && !this.clientId)
+        if (isPartial && !this.clientId)
             return;
         var self = this;
         if (this.surveyShowDataSaving) {
@@ -72344,17 +72629,16 @@ var SurveyModel = /** @class */ (function (_super) {
                 response: response,
                 request: request,
             });
-        }, this.clientId, isPartialCompleted);
+        }, this.clientId, isPartial);
     };
     /**
-     * Calls the [api.surveyjs.io](https://api.surveyjs.io) service and, on callback, fires the `onGetResult` event with all answers that your users made for a question.
-     * @param resultId [api.surveyjs.io](https://api.surveyjs.io) service resultId
-     * @param name The question name
-     * @see onGetResult
+     * Requests [SurveyJS Service](https://api.surveyjs.io/) to retrieve all answers to a specified question. Handle the [`onGetResult`](https://surveyjs.io/form-library/documentation/api-reference/survey-data-model#onGetResult) event to access the answers.
+     * @param resultId A result ID that identifies the required survey. You can find it on the [My Surveys](https://surveyjs.io/service/mysurveys) page.
+     * @param questionName A question name.
      */
-    SurveyModel.prototype.getResult = function (resultId, name) {
+    SurveyModel.prototype.getResult = function (resultId, questionName) {
         var self = this;
-        this.createSurveyService().getResult(resultId, name, function (success, data, dataList, response) {
+        this.createSurveyService().getResult(resultId, questionName, function (success, data, dataList, response) {
             self.onGetResult.fire(self, {
                 success: success,
                 data: data,
@@ -73830,7 +74114,7 @@ var SurveyModel = /** @class */ (function (_super) {
                     }
                 }
             }
-            else if (isStrCiEqual(layoutElement.id, "progress-" + this.progressBarType)) {
+            else if (this.state === "running" && isStrCiEqual(layoutElement.id, "progress-" + this.progressBarType)) {
                 if (container === "header") {
                     if (this.isShowProgressBarOnTop && !this.isShowStartingPage) {
                         containerLayoutElements.push(layoutElement);
@@ -73874,6 +74158,9 @@ var SurveyModel = /** @class */ (function (_super) {
         }
         return containerLayoutElements;
     };
+    SurveyModel.prototype.processPopupVisiblityChanged = function (question, popup, visible) {
+        this.onPopupVisibleChanged.fire(this, { question: question, popup: popup, visible: visible });
+    };
     SurveyModel.prototype.applyTheme = function (theme) {
         var _this = this;
         if (!theme)
@@ -73916,9 +74203,6 @@ var SurveyModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: {} })
     ], SurveyModel.prototype, "cssVariables", void 0);
-    __decorate([
-        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
-    ], SurveyModel.prototype, "backgroundImagePosition", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
     ], SurveyModel.prototype, "_isMobile", void 0);
@@ -73931,6 +74215,9 @@ var SurveyModel = /** @class */ (function (_super) {
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
     ], SurveyModel.prototype, "backgroundImageFit", void 0);
+    __decorate([
+        Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
+    ], SurveyModel.prototype, "backgroundImageAttachment", void 0);
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])()
     ], SurveyModel.prototype, "rootCss", void 0);
@@ -74185,6 +74472,7 @@ _jsonobject__WEBPACK_IMPORTED_MODULE_1__["Serializer"].addClass("survey", [
     { name: "width", visibleIf: function (obj) { return obj.widthMode === "static"; } },
     { name: "backgroundImage", serializationProperty: "locBackgroundImage", visible: false },
     { name: "backgroundImageFit", default: "cover", choices: ["auto", "contain", "cover"], visible: false },
+    { name: "backgroundImageAttachment", default: "scroll", choices: ["scroll", "fixed"], visible: false },
     { name: "backgroundOpacity:number", minValue: 0, maxValue: 1, default: 1, visible: false },
     { name: "showBrandInfo:boolean", default: false, visible: false }
 ]);
@@ -74599,7 +74887,7 @@ var SurveyTimerModel = /** @class */ (function (_super) {
 /*!**************************!*\
   !*** ./src/surveyToc.ts ***!
   \**************************/
-/*! exports provided: tryNavigateToPage, createTOCListModel, getTocRootCss */
+/*! exports provided: tryNavigateToPage, createTOCListModel, getTocRootCss, TOCModel */
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -74607,9 +74895,14 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "tryNavigateToPage", function() { return tryNavigateToPage; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "createTOCListModel", function() { return createTOCListModel; });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getTocRootCss", function() { return getTocRootCss; });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TOCModel", function() { return TOCModel; });
 /* harmony import */ var _actions_action__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./actions/action */ "./src/actions/action.ts");
 /* harmony import */ var _base__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./base */ "./src/base.ts");
 /* harmony import */ var _list__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./list */ "./src/list.ts");
+/* harmony import */ var _popup__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./popup */ "./src/popup.ts");
+/* harmony import */ var _utils_devices__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./utils/devices */ "./src/utils/devices.ts");
+
+
 
 
 
@@ -74628,7 +74921,7 @@ function tryNavigateToPage(survey, page) {
     }
     return true;
 }
-function createTOCListModel(survey) {
+function createTOCListModel(survey, onAction) {
     var items = survey.pages.map(function (page) {
         return new _actions_action__WEBPACK_IMPORTED_MODULE_0__["Action"]({
             id: page.name,
@@ -74637,6 +74930,7 @@ function createTOCListModel(survey) {
                 if (typeof document !== undefined && !!document.activeElement) {
                     !!document.activeElement.blur && document.activeElement.blur();
                 }
+                !!onAction && onAction();
                 return tryNavigateToPage(survey, page);
             },
             visible: new _base__WEBPACK_IMPORTED_MODULE_1__["ComputedUpdater"](function () { return page.isVisible && !page.isStartPage; })
@@ -74654,9 +74948,35 @@ function createTOCListModel(survey) {
     });
     return listModel;
 }
-function getTocRootCss(survey) {
+function getTocRootCss(survey, isMobile) {
+    if (isMobile === void 0) { isMobile = false; }
+    if (isMobile) {
+        return "sv_progress-toc sv_progress-toc--mobile";
+    }
     return "sv_progress-toc" + (" sv_progress-toc--" + (survey.tocLocation || "").toLowerCase());
 }
+var TOCModel = /** @class */ (function () {
+    function TOCModel(survey) {
+        var _this = this;
+        this.survey = survey;
+        this.isMobile = _utils_devices__WEBPACK_IMPORTED_MODULE_4__["IsTouch"];
+        this.icon = "icon-navmenu_24x24";
+        this.togglePopup = function () {
+            _this.popupModel.toggleVisibility();
+        };
+        this.listModel = createTOCListModel(survey, function () { _this.popupModel.isVisible = false; });
+        this.popupModel = new _popup__WEBPACK_IMPORTED_MODULE_3__["PopupModel"]("sv-list", { model: this.listModel });
+    }
+    Object.defineProperty(TOCModel.prototype, "containerCss", {
+        get: function () {
+            return getTocRootCss(this.survey, this.isMobile);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    return TOCModel;
+}());
+
 
 
 /***/ }),
@@ -75484,7 +75804,7 @@ var SurveyTriggerComplete = /** @class */ (function (_super) {
         if (!this.owner)
             return;
         if (this.isRealExecution()) {
-            this.owner.setCompleted();
+            this.owner.setCompleted(this);
         }
         else {
             this.owner.canBeCompleted(this, true);