survey-react 1.9.94 → 1.9.96

package/survey.react.js

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.9.94
+ * surveyjs - Survey JavaScript library v1.9.96
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -7526,6 +7526,7 @@ var DropdownListModel = /** @class */ (function (_super) {
                     _this.resetItemsSettings();
                 }
             }
+            _this.question.processPopupVisiblilityChanged(_this.popupModel, option.isVisible);
         });
     };
     DropdownListModel.prototype.setFilterStringToListModel = function (newValue) {
@@ -8539,7 +8540,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 +8839,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 +8993,7 @@ __webpack_require__.r(__webpack_exports__);
 // import "../../main.scss";
 //import "../../modern.scss";
 var Version;
-Version = "" + "1.9.94";
+Version = "" + "1.9.96";
 function checkLibraryVersion(ver, libraryName) {
     if (Version != ver) {
         var str = "survey-core has version '" + Version + "' and " + libraryName
@@ -9098,7 +9101,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 +9347,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 +9544,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 +9790,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 +10347,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 +10593,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"]; });
@@ -16151,6 +16160,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",
@@ -16369,6 +16379,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 ***!
@@ -16736,8 +16757,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 +16787,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 +17200,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 +17210,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;
@@ -27217,6 +27237,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);
@@ -29901,18 +29927,7 @@ var PopupDropdownViewModel = /** @class */ (function (_super) {
             _this.clientY = event.touches[0].clientY;
         };
         _this.touchMoveEventCallback = function (event) {
-            var currentElement = event.target;
-            while (currentElement !== _this.container) {
-                if (window.getComputedStyle(currentElement).overflowY === "auto" && currentElement.scrollHeight !== currentElement.offsetHeight) {
-                    var scrollHeight = currentElement.scrollHeight, scrollTop = currentElement.scrollTop, clientHeight = currentElement.clientHeight;
-                    var deltaY = _this.clientY - event.changedTouches[0].clientY;
-                    if (!(deltaY > 0 && Math.abs(scrollHeight - clientHeight - scrollTop) < 1) && !(deltaY < 0 && scrollTop <= 0)) {
-                        return;
-                    }
-                }
-                currentElement = currentElement.parentElement;
-            }
-            event.preventDefault();
+            _this.preventScrollOuside(event, _this.clientY - event.changedTouches[0].clientY);
         };
         _this.model.onRecalculatePosition.add(function (_, options) {
             if (!_this.isOverlay) {
@@ -30091,7 +30106,6 @@ var PopupDropdownViewModel = /** @class */ (function (_super) {
 __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PopupModalViewModel", function() { return PopupModalViewModel; });
 /* harmony import */ var _popup_view_model__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./popup-view-model */ "./src/popup-view-model.ts");
-/* harmony import */ var _utils_utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./utils/utils */ "./src/utils/utils.ts");
 var __extends = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -30108,13 +30122,12 @@ var __extends = (undefined && undefined.__extends) || (function () {
     };
 })();
 
-
 var PopupModalViewModel = /** @class */ (function (_super) {
     __extends(PopupModalViewModel, _super);
     function PopupModalViewModel(model) {
         var _this = _super.call(this, model) || this;
         _this.onScrollOutsideCallback = function (event) {
-            Object(_utils_utils__WEBPACK_IMPORTED_MODULE_1__["preventDefaults"])(event);
+            _this.preventScrollOuside(event, event.deltaY);
         };
         return _this;
     }
@@ -30252,6 +30265,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 () { };
@@ -30456,6 +30479,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);
@@ -30838,6 +30866,19 @@ var PopupBaseViewModel = /** @class */ (function (_super) {
             this.containerElement = componentRoot;
         }
     };
+    PopupBaseViewModel.prototype.preventScrollOuside = function (event, deltaY) {
+        var currentElement = event.target;
+        while (currentElement !== this.container) {
+            if (window.getComputedStyle(currentElement).overflowY === "auto" && currentElement.scrollHeight !== currentElement.offsetHeight) {
+                var scrollHeight = currentElement.scrollHeight, scrollTop = currentElement.scrollTop, clientHeight = currentElement.clientHeight;
+                if (!(deltaY > 0 && Math.abs(scrollHeight - clientHeight - scrollTop) < 1) && !(deltaY < 0 && scrollTop <= 0)) {
+                    return;
+                }
+            }
+            currentElement = currentElement.parentElement;
+        }
+        event.preventDefault();
+    };
     __decorate([
         Object(_jsonobject__WEBPACK_IMPORTED_MODULE_1__["property"])({ defaultValue: "0px" })
     ], PopupBaseViewModel.prototype, "top", void 0);
@@ -31229,6 +31270,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
     });
@@ -33169,6 +33221,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 +33542,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 +34108,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 +34420,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 {
@@ -34591,6 +34665,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 +34674,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 +34685,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 +34694,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 +35333,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;
@@ -35656,14 +35734,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);
         }
@@ -37845,6 +37916,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);
@@ -39815,13 +39889,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;
             });
@@ -40043,19 +40111,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 +42534,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 +42814,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 +42839,7 @@ var MatrixDropdownRowModelBase = /** @class */ (function () {
             }
             res = panelHasError || res;
         }
+        this.validationValues = undefined;
         return res;
     };
     MatrixDropdownRowModelBase.prototype.updateCellOnColumnChanged = function (cell, name, newValue) {
@@ -44112,6 +44188,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 () {
@@ -48250,6 +48327,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 +50204,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 +50493,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 +50505,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);
@@ -51186,15 +51257,33 @@ var QuestionRankingModel = /** @class */ (function (_super) {
                     return;
                 }
                 if (key === "ArrowUp" && index) {
-                    _this.handleArrowKeys(index, choice, false);
+                    _this.handleArrowUp(index, choice);
                     event.preventDefault();
                 }
                 if (key === "ArrowDown" && index !== _this.rankingChoices.length - 1) {
-                    _this.handleArrowKeys(index, choice, true);
+                    _this.handleArrowDown(index, choice);
                     event.preventDefault();
                 }
             }
         };
+        _this.handleArrowUp = function (index, choice) {
+            var choices = _this.rankingChoices;
+            choices.splice(index, 1);
+            choices.splice(index - 1, 0, choice);
+            _this.setValue();
+            setTimeout(function () {
+                _this.focusItem(index - 1);
+            }, 1);
+        };
+        _this.handleArrowDown = function (index, choice) {
+            var choices = _this.rankingChoices;
+            choices.splice(index, 1);
+            choices.splice(index + 1, 0, choice);
+            _this.setValue();
+            setTimeout(function () {
+                _this.focusItem(index + 1);
+            }, 1);
+        };
         _this.focusItem = function (index, container) {
             if (_this.selectToRankEnabled && container) {
                 var containerSelector = "[data-ranking='" + container + "']";
@@ -51447,53 +51536,49 @@ var QuestionRankingModel = /** @class */ (function (_super) {
     QuestionRankingModel.prototype.supportNone = function () {
         return false;
     };
-    QuestionRankingModel.prototype.handleArrowKeys = function (index, choice, isDown) {
-        var _this = this;
-        var delta = isDown ? 1 : -1;
-        var choices = this.rankingChoices;
-        choices.splice(index, 1);
-        choices.splice(index + delta, 0, choice);
-        this.setValue();
-        setTimeout(function () {
-            _this.focusItem(index + delta);
-        }, 1);
-    };
     QuestionRankingModel.prototype.handleKeydownSelectToRank = function (event, movedElement) {
         if (this.isDesignMode)
             return;
-        var key = event.key;
-        if (key !== " " && key !== "ArrowUp" && key !== "ArrowDown")
-            return;
         var dnd = this.dragDropRankingChoices; //????
+        var key = event.key;
         var rankingChoices = this.rankingChoices;
+        var unRankingChoices = this.unRankingChoices;
         var isMovedElementRanked = rankingChoices.indexOf(movedElement) !== -1;
-        var choices = isMovedElementRanked ? rankingChoices : this.unRankingChoices;
-        var fromIndex = choices.indexOf(movedElement);
-        if (fromIndex < 0)
-            return;
+        var isMovedElementUnRanked = !isMovedElementRanked;
+        var fromIndex;
         var toIndex;
-        if (key === " " && !isMovedElementRanked) {
+        if (key === " " && isMovedElementUnRanked) {
+            fromIndex = unRankingChoices.indexOf(movedElement);
             toIndex = 0;
             dnd.selectToRank(this, fromIndex, toIndex);
             this.setValueAfterKeydown(toIndex, "to-container");
             return;
         }
-        if (isMovedElementRanked)
-            return;
-        if (key === " ") {
+        if (key === " " && isMovedElementRanked) {
+            fromIndex = rankingChoices.indexOf(movedElement);
             dnd.unselectFromRank(this, fromIndex);
             toIndex = this.unRankingChoices.indexOf(movedElement); //'this.' leads to actual array after the 'unselectFromRank' method
             this.setValueAfterKeydown(toIndex, "from-container");
             return;
         }
-        var delta = key === "ArrowUp" ? -1 : (key === "ArrowDown" ? 1 : 0);
-        if (delta === 0)
+        if (key === "ArrowUp" && isMovedElementRanked) {
+            fromIndex = rankingChoices.indexOf(movedElement);
+            toIndex = fromIndex - 1;
+            if (fromIndex < 0)
+                return;
+            dnd.reorderRankedItem(this, fromIndex, toIndex);
+            this.setValueAfterKeydown(toIndex, "to-container");
             return;
-        toIndex = fromIndex + delta;
-        if (toIndex < 0 || toIndex >= rankingChoices.length)
+        }
+        if (key === "ArrowDown" && isMovedElementRanked) {
+            fromIndex = rankingChoices.indexOf(movedElement);
+            toIndex = fromIndex + 1;
+            if (toIndex >= rankingChoices.length)
+                return;
+            dnd.reorderRankedItem(this, fromIndex, toIndex);
+            this.setValueAfterKeydown(toIndex, "to-container");
             return;
-        dnd.reorderRankedItem(this, fromIndex, toIndex);
-        this.setValueAfterKeydown(toIndex, "to-container");
+        }
     };
     QuestionRankingModel.prototype.setValueAfterKeydown = function (index, container) {
         var _this = this;
@@ -52736,6 +52821,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))
@@ -52744,7 +52833,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;
         }
     };
@@ -52818,6 +52909,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.
@@ -52883,7 +52993,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);
@@ -52941,12 +53051,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",
@@ -52982,12 +53097,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 },
@@ -58716,7 +58834,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)
@@ -59381,6 +59500,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 ||
@@ -59401,16 +59522,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"]));
@@ -66364,11 +66494,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
          */
@@ -66412,11 +66542,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();
         /**
@@ -66642,11 +66772,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();
@@ -66935,25 +67065,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();
         /**
@@ -66978,6 +67106,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
@@ -67225,6 +67357,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 {
@@ -67453,8 +67588,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");
@@ -67480,7 +67618,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
@@ -67497,7 +67635,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
@@ -67516,7 +67654,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 () {
@@ -67546,9 +67684,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");
@@ -68084,8 +68222,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);
@@ -68105,7 +68248,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();
@@ -68498,12 +68645,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");
@@ -68590,7 +68737,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);
@@ -68640,7 +68790,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
          */
@@ -70967,7 +71117,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.
      *
@@ -72286,20 +72436,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) {
@@ -72310,7 +72458,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) {
@@ -72330,17 +72478,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,
@@ -73860,6 +74007,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)
@@ -74585,7 +74735,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";
@@ -74593,9 +74743,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");
+
+
 
 
 
@@ -74614,7 +74769,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,
@@ -74623,6 +74778,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; })
@@ -74640,9 +74796,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;
+}());
+
 
 
 /***/ }),