survey-react-ui 1.11.2 → 1.11.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "survey-react-ui",
-  "version": "1.11.2",
+  "version": "1.11.4",
   "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",
@@ -21,7 +21,7 @@
   },
   "typings": "survey-react-ui.d.ts",
   "peerDependencies": {
-    "survey-core": "1.11.2",
+    "survey-core": "1.11.4",
     "react": "^16.5.0 || ^17.0.1 || ^18.2.0",
     "react-dom": "^16.5.0 || ^17.0.1 || ^18.2.0"
   }

package/survey-react-ui.js

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.11.2
+ * surveyjs - Survey JavaScript library v1.11.4
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -2344,7 +2344,8 @@ var Base = /** @class */ (function () {
         configurable: true
     });
     Base.prototype.afterRerender = function () {
-        this.onElementRerendered.fire(this, undefined);
+        var _a;
+        (_a = this.onElementRerendered) === null || _a === void 0 ? void 0 : _a.fire(this, undefined);
     };
     Base.currentDependencis = undefined;
     return Base;
@@ -3776,7 +3777,7 @@ __webpack_require__.r(__webpack_exports__);
 
 
 
-Object(survey_core__WEBPACK_IMPORTED_MODULE_2__["checkLibraryVersion"])("" + "1.11.2", "survey-react-ui");
+Object(survey_core__WEBPACK_IMPORTED_MODULE_2__["checkLibraryVersion"])("" + "1.11.4", "survey-react-ui");
 
 
 /***/ }),
@@ -8074,6 +8075,11 @@ var DomWindowHelper = /** @class */ (function () {
             return;
         window.removeEventListener(type, listener);
     };
+    DomWindowHelper.matchMedia = function (mediaQueryString) {
+        if (!DomWindowHelper.isAvailable() || typeof window.matchMedia === "undefined")
+            return null;
+        return window.matchMedia(mediaQueryString);
+    };
     return DomWindowHelper;
 }());
 
@@ -10743,13 +10749,13 @@ var ListModel = /** @class */ (function (_super) {
             if (_this.allowSelection) {
                 _this.selectedItem = itemValue;
             }
+            if (!!_this.onSelectionChanged) {
+                _this.onSelectionChanged(itemValue);
+            }
             var action = itemValue.action;
             if (!!action) {
                 action(itemValue);
             }
-            if (!!_this.onSelectionChanged) {
-                _this.onSelectionChanged(itemValue);
-            }
         };
         _this.onItemHover = function (itemValue) {
             _this.mouseOverHandler(itemValue);
@@ -11870,6 +11876,7 @@ var englishStrings = {
     emptyMessage: "No data to display",
     noEntriesText: "No entries yet.\nClick the button below to add a new entry.",
     noEntriesReadonlyText: "No entries",
+    tabTitlePlaceholder: "New Panel",
     more: "More",
     tagboxDoneButtonCaption: "OK",
     selectToRankEmptyRankedAreaText: "All choices are selected for ranking",
@@ -12314,7 +12321,7 @@ var SurveyQuestionBoolean = /** @class */ (function (_super) {
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: cssClasses.sliderGhost, onClick: function (event) { return _this.handleOnLabelClick(event, _this.question.swapOrder); } },
                     react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", { className: this.question.getLabelCss(this.question.swapOrder) }, this.renderLocString(this.question.locLabelLeft))),
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: cssClasses.switch, onClick: this.handleOnSwitchClick },
-                    react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", { className: cssClasses.slider, style: { marginLeft: this.question.thumbMargin } }, this.question.isDeterminated && cssClasses.sliderText ?
+                    react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", { className: cssClasses.slider }, this.question.isDeterminated && cssClasses.sliderText ?
                         react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", { className: cssClasses.sliderText }, this.renderLocString(this.question.getCheckedLabel()))
                         : null)),
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: cssClasses.sliderGhost, onClick: function (event) { return _this.handleOnLabelClick(event, !_this.question.swapOrder); } },
@@ -12829,7 +12836,7 @@ var ComponentsContainer = /** @class */ (function (_super) {
                 return _element_factory__WEBPACK_IMPORTED_MODULE_1__["ReactElementFactory"].Instance.createElement(component.component, { survey: _this.props.survey, model: component.data, container: _this.props.container, key: component.id });
             }));
         }
-        return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", { className: "sv-components-column" }, components.map(function (component) {
+        return react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", { className: "sv-components-column" + " sv-components-container-" + this.props.container }, components.map(function (component) {
             return _element_factory__WEBPACK_IMPORTED_MODULE_1__["ReactElementFactory"].Instance.createElement(component.component, { survey: _this.props.survey, model: component.data, container: _this.props.container, key: component.id });
         }));
     };
@@ -15876,9 +15883,11 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SurveyElementHeader", function() { return SurveyElementHeader; });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
-/* harmony import */ var _components_action_bar_action_bar__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./components/action-bar/action-bar */ "./src/react/components/action-bar/action-bar.tsx");
-/* harmony import */ var _components_title_title_element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/title/title-element */ "./src/react/components/title/title-element.tsx");
-/* harmony import */ var _reactquestion_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./reactquestion_element */ "./src/react/reactquestion_element.tsx");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! survey-core */ "survey-core");
+/* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _components_action_bar_action_bar__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/action-bar/action-bar */ "./src/react/components/action-bar/action-bar.tsx");
+/* harmony import */ var _components_title_title_element__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components/title/title-element */ "./src/react/components/title/title-element.tsx");
+/* harmony import */ var _reactquestion_element__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./reactquestion_element */ "./src/react/reactquestion_element.tsx");
 var __extends = (undefined && undefined.__extends) || (function () {
     var extendStatics = function (d, b) {
         extendStatics = Object.setPrototypeOf ||
@@ -15898,6 +15907,7 @@ var __extends = (undefined && undefined.__extends) || (function () {
 
 
 
+
 var SurveyElementHeader = /** @class */ (function (_super) {
     __extends(SurveyElementHeader, _super);
     function SurveyElementHeader() {
@@ -15912,12 +15922,16 @@ var SurveyElementHeader = /** @class */ (function (_super) {
     });
     SurveyElementHeader.prototype.render = function () {
         var element = this.element;
-        var title = element.hasTitle ? (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_title_title_element__WEBPACK_IMPORTED_MODULE_2__["TitleElement"], { element: element })) : null;
+        var title = element.hasTitle ? (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_title_title_element__WEBPACK_IMPORTED_MODULE_3__["TitleElement"], { element: element })) : null;
         var description = element.hasDescriptionUnderTitle
-            ? _reactquestion_element__WEBPACK_IMPORTED_MODULE_3__["SurveyElementBase"].renderQuestionDescription(this.element)
+            ? _reactquestion_element__WEBPACK_IMPORTED_MODULE_4__["SurveyElementBase"].renderQuestionDescription(this.element)
             : null;
-        var additionalTitleToolbarElement = element.hasAdditionalTitleToolbar ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_action_bar_action_bar__WEBPACK_IMPORTED_MODULE_1__["SurveyActionBar"], { model: element.additionalTitleToolbar }) : null;
-        return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", { className: element.cssHeader, onClick: function (e) { return element.clickTitleFunction && element.clickTitleFunction(e.nativeEvent); } },
+        var additionalTitleToolbarElement = element.hasAdditionalTitleToolbar ? react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement(_components_action_bar_action_bar__WEBPACK_IMPORTED_MODULE_2__["SurveyActionBar"], { model: element.additionalTitleToolbar }) : null;
+        var headerStyle = { width: undefined };
+        if (element instanceof survey_core__WEBPACK_IMPORTED_MODULE_1__["Question"]) {
+            headerStyle.width = element.titleWidth;
+        }
+        return (react__WEBPACK_IMPORTED_MODULE_0___default.a.createElement("div", { className: element.cssHeader, onClick: function (e) { return element.clickTitleFunction && element.clickTitleFunction(e.nativeEvent); }, style: headerStyle },
             title,
             description,
             additionalTitleToolbarElement));
@@ -18147,11 +18161,14 @@ var SurveyQuestionAndErrorsCell = /** @class */ (function (_super) {
             }
         }
     };
+    SurveyQuestionAndErrorsCell.prototype.renderCellContent = function () {
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.props.cell.cellQuestionWrapperClassName }, this.renderQuestion()));
+    };
     SurveyQuestionAndErrorsCell.prototype.renderElement = function () {
         var style = this.getCellStyle();
         var cell = this.props.cell;
         var focusIn = function () { cell.focusIn(); };
-        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("td", { ref: this.cellRef, className: this.itemCss, colSpan: cell.colSpans, "data-responsive-title": this.getHeaderText(), title: cell.getTitle(), style: style, onFocus: focusIn }, this.wrapCell(this.props.cell, (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.props.cell.cellQuestionWrapperClassName }, this.renderQuestion())))));
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("td", { ref: this.cellRef, className: this.itemCss, colSpan: cell.colSpans, title: cell.getTitle(), style: style, onFocus: focusIn }, this.wrapCell(this.props.cell, this.renderCellContent())));
     };
     SurveyQuestionAndErrorsCell.prototype.getCellStyle = function () {
         return null;
@@ -20126,7 +20143,7 @@ var SurveyQuestionMatrixTable = /** @class */ (function (_super) {
             if (!!cell.minWidth)
                 cellStyle.minWidth = cell.minWidth;
         }
-        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("td", { className: cell.className, key: key, style: cellStyle, colSpan: cell.colSpans, "data-responsive-title": cell.headers, title: cell.getTitle() }, cellContent));
+        return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("td", { className: cell.className, key: key, style: cellStyle, colSpan: cell.colSpans, title: cell.getTitle() }, cellContent));
     };
     SurveyQuestionMatrixTable.prototype.renderCellContent = function (cell, reason, cssClasses) {
         var cellContent = null;
@@ -20345,6 +20362,13 @@ var SurveyQuestionMatrixDropdownCell = /** @class */ (function (_super) {
     SurveyQuestionMatrixDropdownCell.prototype.getHeaderText = function () {
         return this.cell.headers;
     };
+    SurveyQuestionMatrixDropdownCell.prototype.renderCellContent = function () {
+        var content = _super.prototype.renderCellContent.call(this);
+        var responsiveTitle = this.cell.showResponsiveTitle ? (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("span", { className: this.cell.responsiveTitleCss }, this.renderLocString(this.cell.responsiveLocTitle))) : null;
+        return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null,
+            responsiveTitle,
+            content);
+    };
     SurveyQuestionMatrixDropdownCell.prototype.renderQuestion = function () {
         if (!this.question.isVisible)
             return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](react__WEBPACK_IMPORTED_MODULE_0__["Fragment"], null);
@@ -21332,7 +21356,7 @@ var SurveyQuestionRankingItem = /** @class */ (function (_super) {
             react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("use", { xlinkHref: this.question.dashSvgIcon })));
     };
     SurveyQuestionRankingItem.prototype.renderElement = function () {
-        var itemContentComponent = _element_factory__WEBPACK_IMPORTED_MODULE_4__["ReactElementFactory"].Instance.createElement(this.question.itemContentComponent, { item: this.item, cssClasses: this.cssClasses });
+        var itemContent = _element_factory__WEBPACK_IMPORTED_MODULE_4__["ReactElementFactory"].Instance.createElement(this.question.itemComponent, { item: this.item, cssClasses: this.cssClasses });
         return (react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { tabIndex: this.itemTabIndex, className: this.itemClass, onKeyDown: this.handleKeydown, onPointerDown: this.handlePointerDown, onPointerUp: this.handlePointerUp, "data-sv-drop-target-ranking-item": this.index },
             react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { tabIndex: -1, style: { outline: "none" } },
                 react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.cssClasses.itemGhostNode }),
@@ -21343,7 +21367,7 @@ var SurveyQuestionRankingItem = /** @class */ (function (_super) {
                         react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("svg", { className: this.question.getIconFocusCss() },
                             react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("use", { xlinkHref: this.question.arrowsSvgIcon }))),
                     react__WEBPACK_IMPORTED_MODULE_0__["createElement"]("div", { className: this.question.getItemIndexClasses(this.item) }, (!this.unrankedItem && this.indexText) ? this.indexText : this.renderEmptyIcon()),
-                    itemContentComponent))));
+                    itemContent))));
     };
     return SurveyQuestionRankingItem;
 }(_reactquestion_element__WEBPACK_IMPORTED_MODULE_1__["ReactSurveyElement"]));
@@ -21373,7 +21397,7 @@ var SurveyQuestionRankingItemContent = /** @class */ (function (_super) {
     return SurveyQuestionRankingItemContent;
 }(_reactquestion_element__WEBPACK_IMPORTED_MODULE_1__["ReactSurveyElement"]));
 
-_element_factory__WEBPACK_IMPORTED_MODULE_4__["ReactElementFactory"].Instance.registerElement("sv-ranking-item-content", function (props) {
+_element_factory__WEBPACK_IMPORTED_MODULE_4__["ReactElementFactory"].Instance.registerElement("sv-ranking-item", function (props) {
     return react__WEBPACK_IMPORTED_MODULE_0__["createElement"](SurveyQuestionRankingItemContent, props);
 });
 _reactquestion_factory__WEBPACK_IMPORTED_MODULE_2__["ReactQuestionFactory"].Instance.registerQuestion("ranking", function (props) {
@@ -22903,6 +22927,7 @@ var settings = {
      * This setting applies to all TagBox questions on a page. You can use the [closeOnSelect](https://surveyjs.io/form-library/documentation/api-reference/dropdown-tag-box-model#closeOnSelect) property to specify the same setting for an individual TagBox question.
      */
     tagboxCloseOnSelect: false,
+    dropdownSearchDelay: 500,
     /**
      * A function that activates a browser confirm dialog.
      *