survey-creator-react 1.9.121 → 1.9.123

package/README.md

@@ -1,5 +1,9 @@
 # Survey Creator / Form Builder for React
 
+
+<video src="https://github.com/surveyjs/survey-creator/assets/22315929/884eeb5b-68e6-4d38-a8f9-d2483e6ce386"></video>
+
+
 [![Build Status](https://dev.azure.com/SurveyJS/SurveyJS%20Integration%20Tests/_apis/build/status/SurveyJS%20Creator?branchName=master)](https://dev.azure.com/SurveyJS/SurveyJS%20Integration%20Tests/_build/latest?definitionId=8&branchName=master)
 <a href="https://www.npmjs.com/package/survey-creator"><img alt="NPM Version" src="https://img.shields.io/npm/v/survey-creator.svg" data-canonical-src="https://img.shields.io/npm/v/survey-creator.svg" style="max-width:100%;"></a>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "survey-creator-react",
-  "version": "1.9.121",
+  "version": "1.9.123",
   "description": "Use SurveyJS Creator to create or edit JSON for SurveyJS Form Library.",
   "keywords": [
     "Survey",
@@ -26,7 +26,9 @@
   },
   "typings": "survey-creator-react.d.ts",
   "peerDependencies": {
-    "ace-builds": "^1.4.12"
+    "ace-builds": "^1.4.12",
+    "react": "^16.5.0 || ^17.0.1 || ^18.1.0",
+    "react-dom": "^16.5.0 || ^17.0.1 || ^18.1.0"
   },
   "peerDependenciesMeta": {
     "ace-builds": {
@@ -34,11 +36,9 @@
     }
   },
   "dependencies": {
-    "survey-core": "1.9.121",
-    "survey-react-ui": "1.9.121",
-    "survey-creator-core": "1.9.121",
-    "react": "^16.5.0 || ^17.0.1 || ^18.1.0",
-    "react-dom": "^16.5.0 || ^17.0.1 || ^18.1.0"
+    "survey-core": "1.9.123",
+    "survey-react-ui": "1.9.123",
+    "survey-creator-core": "1.9.123"
   },
   "devDependencies": {}
 }

package/survey-creator-react.js

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator React v1.9.121
+ * SurveyJS Creator React v1.9.123
  * (c) 2015-2023 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
@@ -2158,15 +2158,18 @@ var PanelAdornerComponent = /** @class */ (function (_super) {
                 } },
                 react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", { className: "svc-text svc-text--normal svc-text--bold" }, this.model.addNewQuestionText))) : null));
     };
+    PanelAdornerComponent.prototype.disableTabStop = function () {
+        return true;
+    };
     PanelAdornerComponent.prototype.renderFooter = function () {
         var _this = this;
         return (react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_1___default.a.Fragment, null,
-            !this.model.isEmptyElement && this.model.element.isPanel && this.model.showAddQuestionButton ? Object(survey_react_ui__WEBPACK_IMPORTED_MODULE_2__["attachKey2click"])(react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: "svc-panel__add-new-question-container" },
-                react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: "svc-panel__add-new-question svc-action-button", onClick: function (e) {
+            !this.model.isEmptyElement && this.model.element.isPanel && this.model.showAddQuestionButton ? (react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: "svc-panel__add-new-question-container" },
+                Object(survey_react_ui__WEBPACK_IMPORTED_MODULE_2__["attachKey2click"])(react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: "svc-panel__add-new-question svc-action-button", onClick: function (e) {
                         e.stopPropagation();
                         _this.model.addNewQuestion();
                     } },
-                    react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", { className: "svc-text svc-text--normal svc-text--bold" }, this.model.addNewQuestionText)),
+                    react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", { className: "svc-text svc-text--normal svc-text--bold" }, this.model.addNewQuestionText)), undefined),
                 Object(survey_react_ui__WEBPACK_IMPORTED_MODULE_2__["attachKey2click"])(react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("button", { type: "button", onClick: function (e) {
                         e.stopPropagation();
                         _this.model.questionTypeSelectorModel.action();
@@ -2248,6 +2251,9 @@ var QuestionAdornerComponent = /** @class */ (function (_super) {
         var content = this.renderContent(allowInteractions);
         return (react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("div", { ref: this.rootRef, "data-sv-drop-target-survey-element": this.model.element.name || null, className: "svc-question__adorner" + this.model.rootCss(), onMouseOut: function (e) { return allowInteractions && _this.model.hover(e.nativeEvent, e.currentTarget); }, onMouseOver: function (e) { return allowInteractions && _this.model.hover(e.nativeEvent, e.currentTarget); } }, content));
     };
+    QuestionAdornerComponent.prototype.disableTabStop = function () {
+        return true;
+    };
     QuestionAdornerComponent.prototype.renderContent = function (allowInteractions) {
         var _this = this;
         var content = this.renderElementContent();
@@ -2258,13 +2264,15 @@ var QuestionAdornerComponent = /** @class */ (function (_super) {
         return Object(survey_react_ui__WEBPACK_IMPORTED_MODULE_4__["attachKey2click"])(react__WEBPACK_IMPORTED_MODULE_2___default.a.createElement("div", { className: "svc-question__content " + this.model.css(), onClick: function (e) { return _this.model.select(_this.model, new _events__WEBPACK_IMPORTED_MODULE_3__["ReactMouseEvent"](e)); } },
             this.renderHeader(),
             content,
-            this.renderFooter()), undefined, { disableTabStop: true });
+            this.renderFooter()), undefined, { disableTabStop: this.disableTabStop() });
     };
     QuestionAdornerComponent.prototype.renderHeader = function () {
         return survey_react_ui__WEBPACK_IMPORTED_MODULE_4__["ReactElementFactory"].Instance.createElement("svc-question-header", { model: this.model });
     };
     QuestionAdornerComponent.prototype.renderFooter = function () {
-        return survey_react_ui__WEBPACK_IMPORTED_MODULE_4__["ReactElementFactory"].Instance.createElement("svc-question-footer", { className: "svc-question__content-actions", model: this.model });
+        var allowInteractions = this.model.element
+            .isInteractiveDesignElement;
+        return allowInteractions ? survey_react_ui__WEBPACK_IMPORTED_MODULE_4__["ReactElementFactory"].Instance.createElement("svc-question-footer", { className: "svc-question__content-actions", model: this.model }) : null;
     };
     QuestionAdornerComponent.prototype.renderCarryForwardBanner = function () {
         if (!this.model.isUsingCarryForward)
@@ -2426,8 +2434,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! tslib */ "./src/entries/helpers.ts");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ "react");
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);
-/* harmony import */ var survey_react_ui__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! survey-react-ui */ "survey-react-ui");
-/* harmony import */ var survey_react_ui__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(survey_react_ui__WEBPACK_IMPORTED_MODULE_2__);
+/* harmony import */ var _events__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../events */ "./src/events.ts");
+/* harmony import */ var survey_react_ui__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! survey-react-ui */ "survey-react-ui");
+/* harmony import */ var survey_react_ui__WEBPACK_IMPORTED_MODULE_3___default = /*#__PURE__*/__webpack_require__.n(survey_react_ui__WEBPACK_IMPORTED_MODULE_3__);
+
 
 
 
@@ -2437,13 +2447,14 @@ var QuestionWrapperFooter = /** @class */ (function (_super) {
         return _super !== null && _super.apply(this, arguments) || this;
     }
     QuestionWrapperFooter.prototype.render = function () {
-        return (react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: this.props.className },
-            react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(survey_react_ui__WEBPACK_IMPORTED_MODULE_2__["SurveyActionBar"], { model: this.props.model.actionContainer, handleClick: false })));
+        var _this = this;
+        return (react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: this.props.className, onFocus: function (e) { return _this.props.model.select(_this.props.model, new _events__WEBPACK_IMPORTED_MODULE_2__["ReactMouseEvent"](e)); } },
+            react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(survey_react_ui__WEBPACK_IMPORTED_MODULE_3__["SurveyActionBar"], { model: this.props.model.actionContainer, handleClick: false })));
     };
     return QuestionWrapperFooter;
 }(react__WEBPACK_IMPORTED_MODULE_1___default.a.Component));
 
-survey_react_ui__WEBPACK_IMPORTED_MODULE_2__["ReactElementFactory"].Instance.registerElement("svc-question-footer", function (props) {
+survey_react_ui__WEBPACK_IMPORTED_MODULE_3__["ReactElementFactory"].Instance.registerElement("svc-question-footer", function (props) {
     return react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(QuestionWrapperFooter, props);
 });
 
@@ -2646,7 +2657,7 @@ var QuestionRatingAdornerComponent = /** @class */ (function (_super) {
         var model = this.ratingModel;
         return (react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(react__WEBPACK_IMPORTED_MODULE_1___default.a.Fragment, null,
             react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: "svc-rating-question-content" },
-                react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: "svc-rating-question-controls svc-item-value-controls" },
+                react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("div", { className: model.controlsClassNames },
                     model.allowRemove ? Object(survey_react_ui__WEBPACK_IMPORTED_MODULE_3__["attachKey2click"])(react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", { className: model.removeClassNames, "aria-label": model.removeTooltip, onClick: function () { return model.removeItem(model); } },
                         react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement(survey_react_ui__WEBPACK_IMPORTED_MODULE_3__["SvgIcon"], { size: 16, iconName: "icon-remove_16x16", title: model.removeTooltip }))) : null,
                     model.allowAdd ? Object(survey_react_ui__WEBPACK_IMPORTED_MODULE_3__["attachKey2click"])(react__WEBPACK_IMPORTED_MODULE_1___default.a.createElement("span", { className: model.addClassNames, "aria-label": model.addTooltip, onClick: function () { return model.addItem(model); } },
@@ -3329,7 +3340,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_52__ = __webpack_require__(/*! survey-core */ "survey-core");
 /* harmony import */ var survey_core__WEBPACK_IMPORTED_MODULE_52___default = /*#__PURE__*/__webpack_require__.n(survey_core__WEBPACK_IMPORTED_MODULE_52__);
 var Version;
-Version = "".concat("1.9.121");
+Version = "".concat("1.9.123");
 // import "@survey/creator/survey-creator-core.css";
 
 
@@ -3391,7 +3402,7 @@ Version = "".concat("1.9.121");
 
 
 
-Object(survey_core__WEBPACK_IMPORTED_MODULE_52__["checkLibraryVersion"])("".concat("1.9.121"), "survey-creator-react");
+Object(survey_core__WEBPACK_IMPORTED_MODULE_52__["checkLibraryVersion"])("".concat("1.9.123"), "survey-creator-react");
 
 
 /***/ }),
@@ -4614,7 +4625,7 @@ var SurveyCreatorToolboxTool = /** @class */ (function (_super) {
     SurveyCreatorToolboxTool.prototype.render = function () {
         var _this = this;
         var item = this.item;
-        var className = "svc-toolbox__tool " + item.css + (item.isVisible ? "" : " sv-action--hidden");
+        var className = "svc-toolbox__tool " + (item.css || "") + (item.isVisible ? "" : " sv-action--hidden");
         var itemComponent = survey_react_ui__WEBPACK_IMPORTED_MODULE_3__["ReactElementFactory"].Instance.createElement(this.item.component || "svc-toolbox-item", {
             item: this.item,
             creator: this.creator,