survey-react-ui 2.4.1 → 2.5.1

package/README.md

@@ -6,9 +6,7 @@
 
 [![Build Status](https://dev.azure.com/SurveyJS/SurveyJS%20Integration%20Tests/_apis/build/status/SurveyJS%20Library?branchName=master)](https://dev.azure.com/SurveyJS/SurveyJS%20Integration%20Tests/_build/latest?definitionId=7&branchName=master)
 [![Software License](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat)](LICENSE)
-<a href="https://github.com/DevExpress/testcafe">
-<img alt="Tested with TestCafe" src="https://img.shields.io/badge/tested%20with-TestCafe-2fa4cf.svg">
-</a>
+[![Tested with Playwright](https://img.shields.io/badge/tested%20with-Playwright-2fa4cf.svg)](https://playwright.dev)
 <a href="https://github.com/surveyjs/survey-library/issues">
 <img alt="Issues" title="Open Issues" src="https://img.shields.io/github/issues/surveyjs/survey-library.svg">
 </a>

package/fesm/survey-react-ui.mjs

@@ -1,10 +1,10 @@
 /*!
- * surveyjs - Survey JavaScript library v2.4.1
+ * surveyjs - Survey JavaScript library v2.5.1
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
 
-import { SurveyModel, Helpers, createSvg, createPopupViewModel, CssClassBuilder, ActionDropdownViewModel, RendererFactory, doKey2ClickUp, SvgRegistry, settings, createPopupModalViewModel, ScrollViewModel, doKey2ClickBlur, doKey2ClickDown, addIconsToThemeSet, Question, SurveyProgressModel, ProgressButtonsResponsivityManager, PopupSurveyModel, ButtonGroupItemModel, LocalizableString, checkLibraryVersion } from 'survey-core';
+import { SurveyModel, Helpers, createSvg, LocalizableString, createPopupViewModel, CssClassBuilder, ActionDropdownViewModel, RendererFactory, doKey2ClickUp, SvgRegistry, settings, createPopupModalViewModel, ScrollViewModel, doKey2ClickBlur, doKey2ClickDown, addIconsToThemeSet, Question, SurveyProgressModel, ProgressButtonsResponsivityManager, PopupSurveyModel, ButtonGroupItemModel, checkLibraryVersion } from 'survey-core';
 export { SurveyModel as Model, SurveyModel, SurveyWindowModel, settings, surveyLocalization, surveyStrings } from 'survey-core';
 import * as React from 'react';
 import * as ReactDOM from 'react-dom';
@@ -92,7 +92,7 @@ class SurveyElementBase extends React.Component {
         return ReactElementFactory.Instance.createElement(locStr.renderAs, {
             locStr: locStr.renderAsData,
             style: style,
-            key: key,
+            key: key
         });
     }
     static renderQuestionDescription(question) {
@@ -420,6 +420,65 @@ ReactElementFactory.Instance.registerElement("sv-action-bar-separator", (props)
     return React.createElement(SurveyActionBarSeparator, props);
 });
 
+class SurveyLocStringViewer extends React.Component {
+    constructor(props) {
+        super(props);
+        this.onChangedHandler = (sender, options) => {
+            if (this.isRendering)
+                return;
+            this.setState({ changed: !!this.state && this.state.changed ? this.state.changed + 1 : 1 });
+        };
+        this.rootRef = React.createRef();
+    }
+    get locStr() {
+        return this.props.locStr;
+    }
+    get style() {
+        return this.props.style;
+    }
+    get textClass() {
+        return this.props.textClass;
+    }
+    componentDidMount() {
+        this.reactOnStrChanged();
+    }
+    componentWillUnmount() {
+        if (!this.locStr)
+            return;
+        this.locStr.onStringChanged.remove(this.onChangedHandler);
+    }
+    componentDidUpdate(prevProps, prevState) {
+        if (!!prevProps.locStr) {
+            prevProps.locStr.onStringChanged.remove(this.onChangedHandler);
+        }
+        this.reactOnStrChanged();
+    }
+    reactOnStrChanged() {
+        if (!this.locStr)
+            return;
+        this.locStr.onStringChanged.add(this.onChangedHandler);
+    }
+    render() {
+        if (!this.locStr)
+            return null;
+        this.isRendering = true;
+        const strEl = this.renderString();
+        this.isRendering = false;
+        return strEl;
+    }
+    renderString() {
+        const className = this.locStr.getStringViewerClassName(this.textClass);
+        if (this.locStr.hasHtml) {
+            let htmlValue = { __html: this.locStr.renderedHtml };
+            return React.createElement("span", { ref: this.rootRef, className: className, style: this.style, dangerouslySetInnerHTML: htmlValue });
+        }
+        return React.createElement("span", { ref: this.rootRef, className: className, style: this.style }, this.locStr.renderedHtml);
+    }
+}
+ReactElementFactory.Instance.registerElement(LocalizableString.defaultRenderer, (props) => {
+    return React.createElement(SurveyLocStringViewer, props);
+});
+
 class SurveyAction extends SurveyElementBase {
     constructor(props) {
         super(props);
@@ -480,8 +539,7 @@ class SurveyActionBarItem extends SurveyElementBase {
     renderText() {
         if (!this.item.hasTitle)
             return null;
-        const titleClass = this.item.getActionBarItemTitleCss();
-        return React.createElement("span", { className: titleClass }, this.item.title);
+        return React.createElement(SurveyLocStringViewer, { locStr: this.item.locTitle, textClass: this.item.getActionBarItemTitleCss() });
     }
     renderButtonContent() {
         const text = this.renderText();
@@ -1056,7 +1114,7 @@ class PopupModal extends SurveyElementBase {
 PopupModal.modalDescriptors = [];
 
 /*!
- * surveyjs - Survey JavaScript library v2.4.1
+ * surveyjs - Survey JavaScript library v2.5.1
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -1126,7 +1184,7 @@ var iconsV1 = {
 };
 
 /*!
- * surveyjs - Survey JavaScript library v2.4.1
+ * surveyjs - Survey JavaScript library v2.5.1
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -1719,8 +1777,10 @@ class SurveyRow extends SurveyElementBase {
     componentWillUnmount() {
         super.componentWillUnmount();
         if (!!this.row) {
-            this.row.setRootElement(undefined);
-            this.stopLazyRendering();
+            if (!this.row.hasActiveUISubscribers) {
+                this.row.setRootElement(undefined);
+                this.stopLazyRendering();
+            }
         }
     }
     createElement(element, elementIndex) {
@@ -5920,62 +5980,6 @@ ReactElementFactory.Instance.registerElement("sv-nav-btn", (props) => {
     return React.createElement(SurveyNavigationButton, props);
 });
 
-class SurveyLocStringViewer extends React.Component {
-    constructor(props) {
-        super(props);
-        this.onChangedHandler = (sender, options) => {
-            if (this.isRendering)
-                return;
-            this.setState({ changed: !!this.state && this.state.changed ? this.state.changed + 1 : 1 });
-        };
-        this.rootRef = React.createRef();
-    }
-    get locStr() {
-        return this.props.locStr;
-    }
-    get style() {
-        return this.props.style;
-    }
-    componentDidMount() {
-        this.reactOnStrChanged();
-    }
-    componentWillUnmount() {
-        if (!this.locStr)
-            return;
-        this.locStr.onStringChanged.remove(this.onChangedHandler);
-    }
-    componentDidUpdate(prevProps, prevState) {
-        if (!!prevProps.locStr) {
-            prevProps.locStr.onStringChanged.remove(this.onChangedHandler);
-        }
-        this.reactOnStrChanged();
-    }
-    reactOnStrChanged() {
-        if (!this.locStr)
-            return;
-        this.locStr.onStringChanged.add(this.onChangedHandler);
-    }
-    render() {
-        if (!this.locStr)
-            return null;
-        this.isRendering = true;
-        const strEl = this.renderString();
-        this.isRendering = false;
-        return strEl;
-    }
-    renderString() {
-        const className = this.locStr.allowLineBreaks ? "sv-string-viewer sv-string-viewer--multiline" : "sv-string-viewer";
-        if (this.locStr.hasHtml) {
-            let htmlValue = { __html: this.locStr.renderedHtml };
-            return React.createElement("span", { ref: this.rootRef, className: className, style: this.style, dangerouslySetInnerHTML: htmlValue });
-        }
-        return React.createElement("span", { ref: this.rootRef, className: className, style: this.style }, this.locStr.renderedHtml);
-    }
-}
-ReactElementFactory.Instance.registerElement(LocalizableString.defaultRenderer, (props) => {
-    return React.createElement(SurveyLocStringViewer, props);
-});
-
 class QuestionErrorComponent extends React.Component {
     render() {
         const error = this.props.error;
@@ -6159,7 +6163,7 @@ ReactElementFactory.Instance.registerElement(LocalizableString.editableRenderer,
     return React.createElement(SurveyLocStringEditor, props);
 });
 
-checkLibraryVersion(`${"2.4.1"}`, "survey-react-ui");
+checkLibraryVersion(`${"2.5.1"}`, "survey-react-ui");
 
 export { CharacterCounterComponent, ComponentsContainer, Header, HeaderCell, HeaderMobile, List, ListItemContent, ListItemGroup, LoadingIndicatorComponent, LogoImage, MatrixRow, NotifierComponent, Popup, PopupModal, PopupSurvey, QuestionErrorComponent, RatingDropdownItem, RatingItem, RatingItemSmiley, RatingItemStar, ReactElementFactory, ReactQuestionFactory, ReactSurveyElement, ReactSurveyElementsWrapper, Scroll, Skeleton, SliderLabelItem, Survey, SurveyActionBar, SurveyElementBase, SurveyElementErrors, SurveyFileChooseButton, SurveyFileItem, SurveyFilePreview, SurveyFlowPanel, SurveyHeader, SurveyLocStringEditor, SurveyLocStringViewer, SurveyNavigationBase, SurveyNavigationButton, SurveyPage, SurveyPanel, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestion, SurveyQuestionAndErrorsCell, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionButtonGroup, SurveyQuestionButtonGroupDropdown, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionComment, SurveyQuestionCommentItem, SurveyQuestionComposite, SurveyQuestionCustom, SurveyQuestionDropdown, SurveyQuestionDropdownBase, SurveyQuestionDropdownSelect, SurveyQuestionElementBase, SurveyQuestionEmpty, SurveyQuestionExpression, SurveyQuestionFile, SurveyQuestionHtml, SurveyQuestionImage, SurveyQuestionImagePicker, SurveyQuestionMatrix, SurveyQuestionMatrixCell, SurveyQuestionMatrixDetailButton, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicAddButton, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionMatrixDynamicRemoveButton, SurveyQuestionMatrixRow, SurveyQuestionMultipleText, SurveyQuestionOptionItem, SurveyQuestionPanelDynamic, SurveyQuestionPanelDynamicAddButton, SurveyQuestionPanelDynamicNextButton, SurveyQuestionPanelDynamicPrevButton, SurveyQuestionPanelDynamicProgressText, SurveyQuestionPanelDynamicRemoveButton, SurveyQuestionRadioItem, SurveyQuestionRadiogroup, SurveyQuestionRanking, SurveyQuestionRankingItem, SurveyQuestionRankingItemContent, SurveyQuestionRating, SurveyQuestionRatingDropdown, SurveyQuestionSignaturePad, SurveyQuestionSlider, SurveyQuestionTagbox, SurveyQuestionTagboxItem, SurveyQuestionText, SurveyRow, SurveyTimerPanel, SurveyWindow, SvgBundleComponent, SvgIcon, TagboxFilterString, TitleActions, TitleElement, attachKey2click };
 //# sourceMappingURL=survey-react-ui.mjs.map