survey-react 1.12.33 → 1.12.35

package/modern.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.33
+ * surveyjs - Survey JavaScript library v1.12.35
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */

package/modern.min.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.33
+ * surveyjs - Survey JavaScript library v1.12.35
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "survey-react",
-  "version": "1.12.33",
+  "version": "1.12.35",
   "description": "survey.js is a JavaScript Survey Library. It is a modern way to add a survey to your website. It uses JSON for survey metadata and results.",
   "keywords": [
     "Survey",

package/survey.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.33
+ * surveyjs - Survey JavaScript library v1.12.35
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */

package/survey.min.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.33
+ * surveyjs - Survey JavaScript library v1.12.35
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */

package/survey.react.d.ts

@@ -17241,7 +17241,8 @@ declare module "packages/survey-core/src/dropdownListModel" {
         protected applyHintString(): void;
         get inputStringRendered(): string;
         set inputStringRendered(val: string);
-        get placeholderRendered(): any;
+        inputPlaceholder: string;
+        get placeholderRendered(): string;
         get listElementId(): string;
         hasScroll: boolean;
         hintString: string;
@@ -17261,6 +17262,7 @@ declare module "packages/survey-core/src/dropdownListModel" {
         get inputMode(): "none" | "text";
         setSearchEnabled(newValue: boolean): void;
         setChoicesLazyLoadEnabled(newValue: boolean): void;
+        setInputPlaceholder(newValue: string): void;
         updateItems(): void;
         onClick(event: any): void;
         chevronPointerDown(event: any): void;
@@ -17296,9 +17298,10 @@ declare module "packages/survey-core/src/question_dropdown" {
     export class QuestionDropdownModel extends QuestionSelectBase {
         dropdownListModelValue: DropdownListModel;
         lastSelectedItemValue: ItemValue;
-        updateReadOnlyText(): void;
         constructor(name: string);
         locStrsChanged(): void;
+        private updateReadOnlyText;
+        private updateInputPlaceholder;
         get showOptionsCaption(): boolean;
         set showOptionsCaption(val: boolean);
         get showClearButton(): boolean;
@@ -17394,7 +17397,10 @@ declare module "packages/survey-core/src/question_dropdown" {
          */
         textWrapEnabled: boolean;
         inputHasValue: boolean;
-        readOnlyText: string;
+        get readOnlyText(): string;
+        set readOnlyText(val: string);
+        get locReadOnlyText(): LocalizableString;
+        protected calculateReadOnlyText(): string;
         /**
          * Enables lazy loading. If you set this property to `true`, you should implement the Survey's [`onChoicesLazyLoad`](https://surveyjs.io/form-library/documentation/surveymodel#onChoicesLazyLoad) event handler.
          * @see choicesLazyLoadPageSize
@@ -18572,6 +18578,8 @@ declare module "packages/survey-core/src/question_rating" {
     export class QuestionRatingModel extends Question {
         constructor(name: string);
         private setIconsToRateValues;
+        locStrsChanged(): void;
+        private updateReadOnlyText;
         endLoadingFromJson(): void;
         private _syncPropertiesChanging;
         private registerSychProperties;
@@ -18829,7 +18837,9 @@ declare module "packages/survey-core/src/question_rating" {
         get renderedValue(): any;
         set renderedValue(val: any);
         isItemSelected(item: ItemValue): boolean;
-        get readOnlyText(): any;
+        get readOnlyText(): string;
+        set readOnlyText(val: string);
+        get locReadOnlyText(): LocalizableString;
         needResponsiveWidth(): boolean;
         protected supportResponsiveness(): boolean;
         protected onBeforeSetCompactRenderer(): void;
@@ -19233,6 +19243,8 @@ declare module "packages/survey-core/src/question_buttongroup" {
      */
     export class QuestionButtonGroupModel extends QuestionCheckboxBase {
         constructor(name: string);
+        locStrsChanged(): void;
+        private updateReadOnlyText;
         getType(): string;
         protected getItemValueType(): string;
         supportOther(): boolean;

package/survey.react.js

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.33
+ * surveyjs - Survey JavaScript library v1.12.35
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -16071,7 +16071,7 @@ var getElement = function (element) {
 };
 function isElementVisible(element, threshold) {
     if (threshold === void 0) { threshold = 0; }
-    if (typeof settings.environment === "undefined") {
+    if (typeof settings.environment === "undefined" || !element.offsetHeight) {
         return false;
     }
     var root = settings.environment.root;
@@ -39834,7 +39834,7 @@ var page_PageModel = /** @class */ (function (_super) {
         if (this.randomizeElements(this.areQuestionsRandomized)) {
             var singleQuestion = (_a = this.survey) === null || _a === void 0 ? void 0 : _a.currentSingleElement;
             if ((singleQuestion === null || singleQuestion === void 0 ? void 0 : singleQuestion.page) === this) {
-                this.survey.currentSingleElement = this.elements[0];
+                this.survey.currentSingleElement = this.getFirstVisibleElement();
             }
         }
     };
@@ -48938,9 +48938,9 @@ var survey_SurveyModel = /** @class */ (function (_super) {
         var isNeedWaitForPageRendered = this.activePage !== question.page && !question.page.isStartPage;
         if (isNeedWaitForPageRendered) {
             this.currentPage = question.page;
-            if (this.isSingleVisibleQuestion && !this.isDesignMode) {
-                this.currentSingleElement = question;
-            }
+        }
+        if (this.isSingleVisibleQuestion && !this.isDesignMode) {
+            this.currentSingleElement = question;
         }
         if (!isNeedWaitForPageRendered) {
             this.focusQuestionInfo();
@@ -49110,12 +49110,12 @@ var survey_SurveyModel = /** @class */ (function (_super) {
             }
             else if (isStrCiEqual(layoutElement.id, "buttons-navigation")) {
                 if (container === "contentTop") {
-                    if (["top", "both"].indexOf(this.isNavigationButtonsShowing) !== -1) {
+                    if (this.isNavigationButtonsShowingOnTop) {
                         containerLayoutElements.push(layoutElement);
                     }
                 }
                 if (container === "contentBottom") {
-                    if (["bottom", "both"].indexOf(this.isNavigationButtonsShowing) !== -1) {
+                    if (this.isNavigationButtonsShowingOnBottom) {
                         containerLayoutElements.push(layoutElement);
                     }
                 }
@@ -51387,7 +51387,7 @@ var question_baseselect_QuestionSelectBase = /** @class */ (function (_super) {
     };
     QuestionSelectBase.prototype.updateValueFromSurvey = function (newValue, clearData) {
         var newComment = "";
-        if (this.hasOther &&
+        if (this.hasOther && this.activeChoices.length > 0 &&
             !this.isRunningChoices &&
             !this.choicesByUrl.isRunning &&
             this.getStoreOthersAsComment()) {
@@ -53229,6 +53229,7 @@ var dropdownListModel_DropdownListModel = /** @class */ (function (_super) {
         _this.listModel = _this.createListModel();
         _this.updateAfterListModelCreated(_this.listModel);
         _this.setChoicesLazyLoadEnabled(_this.question.choicesLazyLoadEnabled);
+        _this.setInputPlaceholder(_this.question.placeholder);
         _this.setSearchEnabled(_this.question.searchEnabled);
         _this.setTextWrapEnabled(_this.question.textWrapEnabled);
         _this.createPopup();
@@ -53554,7 +53555,7 @@ var dropdownListModel_DropdownListModel = /** @class */ (function (_super) {
     });
     Object.defineProperty(DropdownListModel.prototype, "placeholderRendered", {
         get: function () {
-            return this.hintString ? "" : this.question.readOnlyText;
+            return (this.hintString || this.question.readOnly || !this.question.isEmpty()) ? "" : this.inputPlaceholder;
         },
         enumerable: false,
         configurable: true
@@ -53665,6 +53666,9 @@ var dropdownListModel_DropdownListModel = /** @class */ (function (_super) {
     DropdownListModel.prototype.setChoicesLazyLoadEnabled = function (newValue) {
         this.listModel.setOnFilterStringChangedCallback(newValue ? this.listModelFilterStringChanged : undefined);
     };
+    DropdownListModel.prototype.setInputPlaceholder = function (newValue) {
+        this.inputPlaceholder = newValue;
+    };
     DropdownListModel.prototype.updateItems = function () {
         this.listModel.setItems(this.getAvailableItems());
     };
@@ -53881,6 +53885,9 @@ var dropdownListModel_DropdownListModel = /** @class */ (function (_super) {
     dropdownListModel_decorate([
         jsonobject_property()
     ], DropdownListModel.prototype, "ariaActivedescendant", void 0);
+    dropdownListModel_decorate([
+        jsonobject_property()
+    ], DropdownListModel.prototype, "inputPlaceholder", void 0);
     dropdownListModel_decorate([
         jsonobject_property({
             defaultValue: false,
@@ -53945,33 +53952,29 @@ var question_dropdown_QuestionDropdownModel = /** @class */ (function (_super) {
         _this.ariaExpanded = "false";
         _this.createLocalizableString("placeholder", _this, false, true);
         _this.createLocalizableString("clearCaption", _this, false, true);
+        _this.createLocalizableString("readOnlyText", _this, true);
         _this.registerPropertyChangedHandlers(["choicesMin", "choicesMax", "choicesStep"], function () {
             _this.onVisibleChoicesChanged();
         });
         _this.registerPropertyChangedHandlers(["value", "renderAs", "showOtherItem", "otherText", "placeholder", "choices", "visibleChoices"], function () {
+            _this.getSingleSelectedItem();
             _this.updateReadOnlyText();
         });
         _this.updateReadOnlyText();
         return _this;
     }
-    QuestionDropdownModel.prototype.updateReadOnlyText = function () {
-        var result = !!this.selectedItem ? "" : this.placeholder;
-        if (this.renderAs == "select") {
-            if (this.isOtherSelected) {
-                result = this.otherText;
-            }
-            else if (this.isNoneSelected) {
-                result = this.noneText;
-            }
-            else if (!!this.selectedItem) {
-                result = this.selectedItemText;
-            }
-        }
-        this.readOnlyText = result;
-    };
     QuestionDropdownModel.prototype.locStrsChanged = function () {
         _super.prototype.locStrsChanged.call(this);
         this.updateReadOnlyText();
+        this.updateInputPlaceholder(this.placeholder);
+    };
+    QuestionDropdownModel.prototype.updateReadOnlyText = function () {
+        this.readOnlyText = this.calculateReadOnlyText();
+    };
+    QuestionDropdownModel.prototype.updateInputPlaceholder = function (val) {
+        if (!!this.dropdownListModelValue) {
+            this.dropdownListModel.setInputPlaceholder(val);
+        }
     };
     Object.defineProperty(QuestionDropdownModel.prototype, "showOptionsCaption", {
         get: function () {
@@ -54009,6 +54012,7 @@ var question_dropdown_QuestionDropdownModel = /** @class */ (function (_super) {
         },
         set: function (val) {
             this.setLocalizableStringText("placeholder", val);
+            this.updateInputPlaceholder(val);
         },
         enumerable: false,
         configurable: true
@@ -54156,6 +54160,34 @@ var question_dropdown_QuestionDropdownModel = /** @class */ (function (_super) {
         enumerable: false,
         configurable: true
     });
+    Object.defineProperty(QuestionDropdownModel.prototype, "readOnlyText", {
+        get: function () {
+            return this.getLocalizableStringText("readOnlyText");
+        },
+        set: function (val) {
+            this.setLocalizableStringText("readOnlyText", val);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(QuestionDropdownModel.prototype, "locReadOnlyText", {
+        get: function () {
+            return this.getLocalizableString("readOnlyText");
+        },
+        enumerable: false,
+        configurable: true
+    });
+    QuestionDropdownModel.prototype.calculateReadOnlyText = function () {
+        if (this.renderAs == "select") {
+            if (this.isOtherSelected)
+                return this.otherText;
+            if (this.isNoneSelected)
+                return this.noneText;
+            if (!!this.selectedItem)
+                return this.selectedItemText;
+        }
+        return !!this.selectedItem ? this.selectedItemText : this.placeholder;
+    };
     QuestionDropdownModel.prototype.getControlClass = function () {
         return new CssClassBuilder()
             .append(this.cssClasses.control)
@@ -54343,9 +54375,6 @@ var question_dropdown_QuestionDropdownModel = /** @class */ (function (_super) {
     question_dropdown_decorate([
         jsonobject_property({ defaultValue: false })
     ], QuestionDropdownModel.prototype, "inputHasValue", void 0);
-    question_dropdown_decorate([
-        jsonobject_property({ defaultValue: "" })
-    ], QuestionDropdownModel.prototype, "readOnlyText", void 0);
     question_dropdown_decorate([
         jsonobject_property({
             onSet: function (newValue, target) {
@@ -56073,7 +56102,7 @@ var question_text_QuestionTextModel = /** @class */ (function (_super) {
                 value = this.maskInstance.getUnmaskedValue(val);
                 this._inputValue = this.maskInstance.getMaskedValue(value);
                 if (!!value && this.maskSettings.saveMaskedValue) {
-                    value = this.maskInstance.getMaskedValue(value);
+                    value = this._inputValue;
                 }
             }
             this.value = value;
@@ -56086,14 +56115,20 @@ var question_text_QuestionTextModel = /** @class */ (function (_super) {
         this.updateInputValue();
     };
     QuestionTextModel.prototype.updateInputValue = function () {
+        var _value = this.value;
         if (this.maskTypeIsEmpty) {
-            this._inputValue = this.value;
+            this._inputValue = _value;
         }
         else if (this.maskSettings.saveMaskedValue) {
-            this._inputValue = !!this.value ? this.value : this.maskInstance.getMaskedValue("");
+            if (!_value) {
+                this._inputValue = this.maskInstance.getMaskedValue("");
+            }
+            else {
+                this.inputValue = _value;
+            }
         }
         else {
-            this._inputValue = this.maskInstance.getMaskedValue(this.value);
+            this._inputValue = this.maskInstance.getMaskedValue(_value);
         }
     };
     QuestionTextModel.prototype.hasToConvertToUTC = function (val) {
@@ -59443,6 +59478,9 @@ var question_tagbox_QuestionTagboxModel = /** @class */ (function (_super) {
         },
         set: function (val) {
             this.setLocalizableStringText("placeholder", val);
+            if (!!this.dropdownListModelValue) {
+                this.dropdownListModel.setInputPlaceholder(val);
+            }
         },
         enumerable: false,
         configurable: true
@@ -63340,6 +63378,11 @@ var question_rating_QuestionRatingModel = /** @class */ (function (_super) {
             .onStringChanged.add(function (sender, options) {
             _this.hasMaxRateDescription = !sender.isEmpty;
         });
+        _this.createLocalizableString("readOnlyText", _this, true);
+        _this.registerPropertyChangedHandlers(["value", "renderAs", "placeholder", "choices", "visibleChoices"], function () {
+            _this.updateReadOnlyText();
+        });
+        _this.updateReadOnlyText();
         _this.initPropertyDependencies();
         return _this;
     }
@@ -63349,6 +63392,15 @@ var question_rating_QuestionRatingModel = /** @class */ (function (_super) {
             this.rateValues.map(function (item) { return item.icon = _this.getItemSmiley(item); });
         }
     };
+    QuestionRatingModel.prototype.locStrsChanged = function () {
+        var _a;
+        _super.prototype.locStrsChanged.call(this);
+        this.updateReadOnlyText();
+        (_a = this.dropdownListModelValue) === null || _a === void 0 ? void 0 : _a.locStrsChanged();
+    };
+    QuestionRatingModel.prototype.updateReadOnlyText = function () {
+        this.readOnlyText = this.displayValue || this.placeholder;
+    };
     QuestionRatingModel.prototype.endLoadingFromJson = function () {
         _super.prototype.endLoadingFromJson.call(this);
         if (this.jsonObj.rateMin !== undefined && this.jsonObj.rateCount !== undefined && this.jsonObj.rateMax === undefined) {
@@ -64154,9 +64206,17 @@ var question_rating_QuestionRatingModel = /** @class */ (function (_super) {
     };
     Object.defineProperty(QuestionRatingModel.prototype, "readOnlyText", {
         get: function () {
-            if (this.readOnly)
-                return (this.displayValue || this.placeholder);
-            return this.isEmpty() ? this.placeholder : "";
+            return this.getLocalizableStringText("readOnlyText");
+        },
+        set: function (val) {
+            this.setLocalizableStringText("readOnlyText", val);
+        },
+        enumerable: false,
+        configurable: true
+    });
+    Object.defineProperty(QuestionRatingModel.prototype, "locReadOnlyText", {
+        get: function () {
+            return this.getLocalizableString("readOnlyText");
         },
         enumerable: false,
         configurable: true
@@ -71413,8 +71473,24 @@ var question_buttongroup_ButtonGroupItemValue = /** @class */ (function (_super)
 var QuestionButtonGroupModel = /** @class */ (function (_super) {
     question_buttongroup_extends(QuestionButtonGroupModel, _super);
     function QuestionButtonGroupModel(name) {
-        return _super.call(this, name) || this;
+        var _this = _super.call(this, name) || this;
+        _this.createLocalizableString("buttongroupOptionsCaption", _this, false, true);
+        _this.createLocalizableString("readOnlyText", _this, true);
+        _this.registerPropertyChangedHandlers(["value", "renderAs", "placeholder", "choices", "visibleChoices"], function () {
+            _this.updateReadOnlyText();
+        });
+        _this.updateReadOnlyText();
+        return _this;
     }
+    QuestionButtonGroupModel.prototype.locStrsChanged = function () {
+        var _a;
+        _super.prototype.locStrsChanged.call(this);
+        this.updateReadOnlyText();
+        (_a = this.dropdownListModelValue) === null || _a === void 0 ? void 0 : _a.locStrsChanged();
+    };
+    QuestionButtonGroupModel.prototype.updateReadOnlyText = function () {
+        this.readOnlyText = this.displayValue || this.placeholder;
+    };
     QuestionButtonGroupModel.prototype.getType = function () {
         return "buttongroup";
     };
@@ -72999,9 +73075,9 @@ Serializer.addClass("currencymask", [
 
 var Version;
 var ReleaseDate;
-Version = "" + "1.12.33";
+Version = "" + "1.12.35";
 settings.version = Version;
-ReleaseDate = "" + "2025-04-24";
+ReleaseDate = "" + "2025-05-06";
 function checkLibraryVersion(ver, libraryName) {
     if (Version != ver) {
         var str = "survey-core has version '" + Version + "' and " + libraryName
@@ -83853,8 +83929,9 @@ var row_SurveyRow = /** @class */ (function (_super) {
         this.row.isNeedRender = !this.row.isLazyRendering();
     };
     SurveyRow.prototype.componentWillUnmount = function () {
+        var isCurrentStateElement = this.isCurrentStateElement(this.getStateElement());
         _super.prototype.componentWillUnmount.call(this);
-        if (this.isCurrentStateElement(this.getStateElement())) {
+        if (isCurrentStateElement) {
             this.row.setRootElement(undefined);
             this.stopLazyRendering();
         }
@@ -87515,19 +87592,21 @@ var dropdown_base_SurveyQuestionDropdownBase = /** @class */ (function (_super)
         return this.questionBase.renderedValue;
     };
     SurveyQuestionDropdownBase.prototype.renderReadOnlyElement = function () {
-        return external_root_React_commonjs2_react_commonjs_react_amd_react_["createElement"]("div", null, this.question.readOnlyText);
+        if (this.question.locReadOnlyText) {
+            return this.renderLocString(this.question.locReadOnlyText);
+        }
+        else {
+            return null;
+        }
     };
     SurveyQuestionDropdownBase.prototype.renderSelect = function (cssClasses) {
         var _this = this;
         var _a, _b;
         var selectElement = null;
         if (this.question.isReadOnly) {
-            var text = (this.question.selectedItemLocText) ? this.renderLocString(this.question.selectedItemLocText) : "";
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
             // @ts-ignore
-            selectElement = external_root_React_commonjs2_react_commonjs_react_amd_react_["createElement"]("div", { id: this.question.inputId, "aria-label": this.question.a11y_input_ariaLabel, "aria-labelledby": this.question.a11y_input_ariaLabelledBy, "aria-describedby": this.question.a11y_input_ariaDescribedBy, tabIndex: this.question.isDisabledAttr ? undefined : 0, className: this.question.getControlClass(), ref: function (div) { return (_this.setControl(div)); } },
-                text,
-                this.renderReadOnlyElement());
+            selectElement = external_root_React_commonjs2_react_commonjs_react_amd_react_["createElement"]("div", { id: this.question.inputId, "aria-label": this.question.a11y_input_ariaLabel, "aria-labelledby": this.question.a11y_input_ariaLabelledBy, "aria-describedby": this.question.a11y_input_ariaDescribedBy, tabIndex: this.question.isDisabledAttr ? undefined : 0, className: this.question.getControlClass(), ref: function (div) { return (_this.setControl(div)); } }, this.renderReadOnlyElement());
         }
         else {
             selectElement = external_root_React_commonjs2_react_commonjs_react_amd_react_["createElement"](external_root_React_commonjs2_react_commonjs_react_amd_react_["Fragment"], null,