survey-react-ui 3.0.3 → 3.1.0

package/fesm/survey-react-ui.mjs

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v3.0.3
+ * surveyjs - Survey JavaScript library v3.1.0
  * Copyright (c) 2015-2026 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -3583,7 +3583,7 @@ class SurveyQuestionMatrix extends SurveyQuestionElementBase {
     }
     renderElement() {
         var cssClasses = this.question.cssClasses;
-        var rowsTH = this.question.hasRows ? React.createElement("td", null) : null;
+        var rowsTH = this.question.hasRows ? React.createElement("td", { className: this.question.emptyCellCss }) : null;
         var headers = [];
         for (var i = 0; i < this.question.visibleColumns.length; i++) {
             var column = this.question.visibleColumns[i];
@@ -3610,7 +3610,7 @@ class SurveyQuestionMatrix extends SurveyQuestionElementBase {
                 React.createElement("legend", { className: "sv-visuallyhidden" }, this.question.locTitle.renderedHtml),
                 React.createElement("table", { className: this.question.getTableCss(), role: "presentation" },
                     header,
-                    React.createElement("tbody", null, rows)))));
+                    React.createElement("tbody", { className: this.question.getTableBodyCss() }, rows)))));
     }
 }
 class SurveyQuestionMatrixRow extends ReactSurveyElement {
@@ -4366,30 +4366,6 @@ ReactElementFactory.Instance.registerElement("sv-matrix-row", (props) => {
     return React.createElement(MatrixRow, props);
 });
 
-class SurveyQuestionMatrixDynamicDragDropIcon extends ReactSurveyElement {
-    get question() {
-        return this.props.item.data.question;
-    }
-    get row() {
-        return this.props.item.data.row;
-    }
-    renderElement() {
-        return React.createElement("div", { onPointerDown: (event) => { this.question.onPointerDown(event.nativeEvent, this.row); } }, this.renderIcon());
-    }
-    renderIcon() {
-        if (this.question.iconDragElement) {
-            return (React.createElement("svg", { className: this.question.cssClasses.dragElementDecorator },
-                React.createElement("use", { xlinkHref: this.question.iconDragElement })));
-        }
-        else {
-            return (React.createElement("span", { className: this.question.cssClasses.iconDrag }));
-        }
-    }
-}
-ReactElementFactory.Instance.registerElement("sv-matrix-drag-drop-icon", (props) => {
-    return React.createElement(SurveyQuestionMatrixDynamicDragDropIcon, props);
-});
-
 class SurveyQuestionMatrixTable extends SurveyElementBase {
     get question() {
         return this.props.question;
@@ -4448,7 +4424,7 @@ class SurveyQuestionMatrixTable extends SurveyElementBase {
         for (var i = 0; i < renderedRows.length; i++) {
             rows.push(this.renderRow(renderedRows[i].id, renderedRows[i], cssClasses));
         }
-        return React.createElement("tbody", null, rows);
+        return React.createElement("tbody", { className: this.question.getTableBodyCss() }, rows);
     }
     renderRow(keyValue, row, cssClasses, reason) {
         const matrixrow = [];
@@ -4457,7 +4433,7 @@ class SurveyQuestionMatrixTable extends SurveyElementBase {
             matrixrow.push(this.renderCell(cells[i], cssClasses, reason));
         }
         const key = "row" + keyValue;
-        return (React.createElement(React.Fragment, { key: key }, (reason == "row-footer") ? React.createElement("tr", null, matrixrow) : React.createElement(MatrixRow, { model: row, parentMatrix: this.question }, matrixrow)));
+        return (React.createElement(React.Fragment, { key: key }, (reason == "row-footer") ? React.createElement("tr", { className: row.className }, matrixrow) : React.createElement(MatrixRow, { model: row, parentMatrix: this.question }, matrixrow)));
     }
     renderCell(cell, cssClasses, reason) {
         const key = "cell" + cell.id;
@@ -4502,10 +4478,6 @@ class SurveyQuestionMatrixTable extends SurveyElementBase {
                 str,
                 require));
         }
-        if (cell.isDragHandlerCell) {
-            cellContent = (React.createElement(React.Fragment, null,
-                React.createElement(SurveyQuestionMatrixDynamicDragDropIcon, { item: { data: { row: cell.row, question: this.question } } })));
-        }
         if (cell.isActionsCell) {
             cellContent = (ReactElementFactory.Instance.createElement("sv-matrixdynamic-actions-cell", {
                 question: this.question, cssClasses, cell, model: cell.item.getData()
@@ -4684,9 +4656,12 @@ class SurveyQuestionMatrixDropdownCell extends SurveyQuestionAndErrorsCell {
         const responsiveTitle = this.cell.showResponsiveTitle ? (React.createElement("span", { className: this.cell.responsiveTitleCss },
             this.renderLocString(this.cell.responsiveLocTitle),
             React.createElement(SurveyQuestionMatrixHeaderRequired, { column: this.cell.column, question: this.cell.matrix }))) : null;
+        const errors = this.cell.matrix.isMobile ? React.createElement(SurveyElementErrors, { element: this.cell.question, creator: this.props.creator, cssClasses: this.question.cssClasses }) : null;
         return React.createElement(React.Fragment, null,
+            this.cell.matrix.getErrorLocation() === "top" ? errors : null,
             responsiveTitle,
-            content);
+            content,
+            this.cell.matrix.getErrorLocation() === "bottom" ? errors : null);
     }
     renderQuestion() {
         if (!this.question.isVisible)
@@ -4748,18 +4723,16 @@ class SurveyQuestionMatrixDynamic extends SurveyQuestionMatrixDropdownBase {
             mainDiv,
             this.renderBottomToolbar()));
     }
-    renderToolbar() {
-        return React.createElement("div", { className: this.matrix.cssClasses.footer }, ReactElementFactory.Instance.createElement("sv-action-bar", { model: this.matrix.toolbar }));
+    renderToolbar(location) {
+        if (!this.matrix.getShowToolbar(location))
+            return null;
+        return React.createElement("div", { className: this.matrix.getToolbarCssClass(location) }, ReactElementFactory.Instance.createElement("sv-action-bar", { model: this.matrix.toolbar }));
     }
     renderTopToolbar() {
-        if (!this.matrix.getShowToolbar("top"))
-            return null;
-        return this.renderToolbar();
+        return this.renderToolbar("top");
     }
     renderBottomToolbar() {
-        if (!this.matrix.getShowToolbar("bottom"))
-            return null;
-        return this.renderToolbar();
+        return this.renderToolbar("bottom");
     }
     renderNoRowsContent(cssClasses) {
         return ReactElementFactory.Instance.createElement("sv-placeholder-matrixdynamic", { cssClasses: cssClasses, question: this.matrix });
@@ -5905,6 +5878,32 @@ ReactElementFactory.Instance.registerElement("sv-logo-image", (props) => {
     return React.createElement(LogoImage, props);
 });
 
+class SurveyQuestionMatrixDynamicDragDropIcon extends ReactSurveyElement {
+    get question() {
+        return this.props.item.data.question;
+    }
+    get row() {
+        return this.props.item.data.row;
+    }
+    getStateElement() {
+        return this.props.item;
+    }
+    renderElement() {
+        return React.createElement("div", { onPointerDown: (event) => { this.question.onPointerDown(event.nativeEvent, this.row); } }, this.renderIcon());
+    }
+    renderIcon() {
+        if (this.question.iconDragElement) {
+            return React.createElement(SvgIcon, { className: this.question.cssClasses.dragElementDecorator, size: this.props.item.iconSize, iconName: this.props.item.iconName });
+        }
+        else {
+            return (React.createElement("span", { className: this.question.cssClasses.iconDrag }));
+        }
+    }
+}
+ReactElementFactory.Instance.registerElement("sv-matrix-drag-drop-icon", (props) => {
+    return React.createElement(SurveyQuestionMatrixDynamicDragDropIcon, props);
+});
+
 class SurveyQuestionPanelDynamicProgressText extends ReactSurveyElement {
     get data() {
         return (this.props.item && this.props.item.data) || this.props.data;
@@ -6133,7 +6132,7 @@ ReactElementFactory.Instance.registerElement(LocalizableString.editableRenderer,
     return React.createElement(SurveyLocStringEditor, props);
 });
 
-checkLibraryVersion(`${"3.0.3"}`, "survey-react-ui");
+checkLibraryVersion(`${"3.1.0"}`, "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, SurveyActionBarItemDropdown, SurveyActionBarSeparator, SurveyElementBase, SurveyElementErrors, SurveyFileChooseButton, SurveyFileItem, SurveyFilePreview, SurveyFlowPanel, SurveyHeader, SurveyLocStringEditor, SurveyLocStringViewer, SurveyNavigationBase, SurveyPage, SurveyPanel, SurveyProgress, SurveyProgressButtons, SurveyProgressToc, SurveyQuestion, SurveyQuestionAndErrorsCell, SurveyQuestionBoolean, SurveyQuestionBooleanCheckbox, SurveyQuestionBooleanRadio, SurveyQuestionBooleanSwitch, SurveyQuestionButtonGroup, SurveyQuestionButtonGroupDropdown, SurveyQuestionCheckbox, SurveyQuestionCheckboxItem, SurveyQuestionComment, SurveyQuestionCommentItem, SurveyQuestionComposite, SurveyQuestionCustom, SurveyQuestionDropdown, SurveyQuestionDropdownBase, SurveyQuestionDropdownSelect, SurveyQuestionElementBase, SurveyQuestionEmpty, SurveyQuestionExpression, SurveyQuestionFile, SurveyQuestionHtml, SurveyQuestionImage, SurveyQuestionImageMap, SurveyQuestionImagePicker, SurveyQuestionMatrix, SurveyQuestionMatrixCell, SurveyQuestionMatrixDropdown, SurveyQuestionMatrixDropdownBase, SurveyQuestionMatrixDropdownCell, SurveyQuestionMatrixDynamic, SurveyQuestionMatrixDynamicDragDropIcon, SurveyQuestionMatrixRow, SurveyQuestionMultipleText, SurveyQuestionOptionItem, SurveyQuestionPanelDynamic, SurveyQuestionPanelDynamicProgressText, 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