survey-creator-react 1.12.37 → 1.12.39

package/fesm/survey-creator-react.mjs

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator React v2.0.9
+ * SurveyJS Creator React v2.1.1
  * (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
@@ -359,6 +359,11 @@ class ReactDragEvent extends ReactMouseEvent {
     }
 }
 
+function QuestionElementContentFunc(props) {
+    return props.element;
+}
+const QuestionElementContent = React.memo(QuestionElementContentFunc);
+QuestionElementContent.displayName = "QuestionElementContent";
 class QuestionAdornerComponent extends CreatorModelElement {
     constructor(props) {
         super(props);
@@ -433,7 +438,7 @@ class QuestionAdornerComponent extends CreatorModelElement {
     }
     renderElementContent() {
         return (React.createElement(React.Fragment, null,
-            this.props.element,
+            React.createElement(QuestionElementContent, { element: this.props.element }),
             this.renderElementPlaceholder(),
             this.renderCarryForwardBanner()));
     }
@@ -651,9 +656,9 @@ class QuestionRatingAdornerComponent extends CreatorModelElement {
         return (React.createElement(React.Fragment, null,
             React.createElement("div", { className: "svc-rating-question-content" },
                 React.createElement("div", { className: model.controlsClassNames },
-                    model.allowRemove ? attachKey2click(React.createElement("span", { className: model.removeClassNames, "aria-label": model.removeTooltip, onClick: () => model.removeItem(model) },
+                    model.allowRemove ? attachKey2click(React.createElement("span", { role: "button", className: model.removeClassNames, "aria-label": model.removeTooltip, onClick: () => model.removeItem(model) },
                         React.createElement(SvgIcon, { size: "auto", iconName: "icon-remove_16x16", title: model.removeTooltip }))) : null,
-                    model.allowAdd ? attachKey2click(React.createElement("span", { className: model.addClassNames, "aria-label": model.addTooltip, onClick: () => model.addItem(model) },
+                    model.allowAdd ? attachKey2click(React.createElement("span", { role: "button", className: model.addClassNames, "aria-label": model.addTooltip, onClick: () => model.addItem(model) },
                         React.createElement(SvgIcon, { size: "auto", iconName: "icon-add_16x16", title: model.addTooltip }))) : null),
                 this.props.element)));
     }
@@ -732,6 +737,10 @@ ReactElementFactory.Instance.registerElement("svc-cell-dropdown-question", (prop
     return React.createElement(CellQuestionDropdownAdornerComponent, props);
 });
 
+const PageElementContent = React.memo(({ page, survey, creator }) => {
+    return React.createElement(SurveyPage, { page: page, survey: survey, creator: creator });
+});
+PageElementContent.displayName = "PageElementContent";
 class CreatorSurveyPageComponent extends CreatorModelElement {
     constructor(props) {
         super(props);
@@ -741,9 +750,12 @@ class CreatorSurveyPageComponent extends CreatorModelElement {
         if (this.model) {
             this.model.attachToUI(props.page, this.rootRef.current);
         }
-        this.model = new PageAdorner(props.creator, props.page);
+        this.model = this.createPageAdorner(props.creator, props.page);
         this.model.isGhost = this.props.isGhost;
     }
+    createPageAdorner(creator, page) {
+        return new PageAdorner(creator, page);
+    }
     shouldComponentUpdate(nextProps, nextState) {
         const res = super.shouldComponentUpdate(nextProps, nextState);
         if (this.model) {
@@ -793,7 +805,11 @@ class CreatorSurveyPageComponent extends CreatorModelElement {
                 React.createElement("div", { className: "svc-panel__placeholder" }, this.model.placeholderText))));
     }
     renderContent() {
-        return (React.createElement(SurveyPage, { page: this.props.page, survey: this.props.survey, creator: this.props.creator, css: this.model.css }));
+        if (!this.model.needRenderContent) {
+            return React.createElement("div", { className: "svc-page__loading-content" },
+                React.createElement(LoadingIndicatorComponent, null));
+        }
+        return (React.createElement(PageElementContent, { page: this.props.page, survey: this.props.survey, creator: this.props.creator }));
     }
     renderHeader() {
         const actions = (React.createElement("div", { className: "svc-page__content-actions" },
@@ -1060,7 +1076,7 @@ class ItemValueAdornerComponent extends CreatorModelElement {
     }
     render() {
         this.model.item = this.props.item;
-        const button = this.model.allowAdd ? (attachKey2click(React.createElement("span", { className: "svc-item-value-controls__button svc-item-value-controls__add", "aria-label": this.model.tooltip, onClick: () => {
+        const button = this.model.allowAdd ? (attachKey2click(React.createElement("span", { role: "button", className: "svc-item-value-controls__button svc-item-value-controls__add", "aria-label": this.model.tooltip, onClick: () => {
                 this.model.add(this.model);
                 this.model.isNew = false;
             } },
@@ -1068,7 +1084,7 @@ class ItemValueAdornerComponent extends CreatorModelElement {
             " ",
             this.model.isDraggable ? (React.createElement("span", { className: "svc-item-value-controls__button svc-item-value-controls__drag" },
                 React.createElement(SvgIcon, { className: "svc-item-value-controls__drag-icon", size: "auto", iconName: "icon-drag-24x24", title: this.model.dragTooltip }))) : null,
-            this.model.allowRemove ? attachKey2click(React.createElement("span", { className: "svc-item-value-controls__button svc-item-value-controls__remove", "aria-label": this.model.tooltip, onClick: () => this.model.remove(this.model) },
+            this.model.allowRemove ? attachKey2click(React.createElement("span", { role: "button", className: "svc-item-value-controls__button svc-item-value-controls__remove", "aria-label": this.model.tooltip, onClick: () => this.model.remove(this.model) },
                 React.createElement(SvgIcon, { size: "auto", iconName: "icon-remove_16x16", title: this.model.tooltip }))) : null));
         const itemkey = this.props.element.key + (this.model.allowAdd ? "_new" : "");
         return (React.createElement("div", { ref: this.rootRef, className: "svc-item-value-wrapper" +
@@ -2060,12 +2076,15 @@ class SurveyLogicOpertor extends SurveyQuestionDropdown {
         const q = this.question;
         initLogicOperator(q);
         const text = (q.locReadOnlyText) ? this.renderLocString(q.locReadOnlyText) : "";
+        const dropdownListModel = this.question.dropdownListModel;
         return (React.createElement("div", { id: this.question.inputId, className: q.getControlClass(), tabIndex: this.question.isInputReadOnly ? undefined : 0, 
             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
             // @ts-ignore
-            disabled: this.question.isInputReadOnly, required: this.question.isRequired, onChange: this.updateValueOnEvent, onInput: this.updateValueOnEvent, onKeyUp: this.keyhandler, role: this.question.ariaRole, "aria-required": this.question.ariaRequired, "aria-label": this.question.ariaLabel, "aria-labelledby": this.question.ariaLabelledBy, "aria-invalid": this.question.ariaInvalid, "aria-errormessage": this.question.ariaErrormessage, "aria-expanded": this.question.ariaExpanded },
-            React.createElement("div", { className: this.question.cssClasses.controlValue }, text),
-            this.createClearButton()));
+            disabled: this.question.isInputReadOnly, required: this.question.isRequired, onChange: this.updateValueOnEvent, onInput: this.updateValueOnEvent, onKeyUp: this.keyhandler, role: dropdownListModel.ariaQuestionRole, "aria-required": dropdownListModel.ariaQuestionRequired, "aria-invalid": dropdownListModel.ariaQuestionInvalid, "aria-errormessage": dropdownListModel.ariaQuestionErrorMessage, "aria-expanded": dropdownListModel.ariaQuestionExpanded, "aria-label": dropdownListModel.ariaQuestionLabel, "aria-labelledby": dropdownListModel.ariaQuestionLabelledby, "aria-controls": dropdownListModel.ariaQuestionControls },
+            React.createElement("div", { className: this.question.cssClasses.controlValue }, text)));
+    }
+    renderEditorButtons() {
+        return null;
     }
 }
 ReactQuestionFactory.Instance.registerQuestion("sv-logic-operator", (props) => {
@@ -2107,9 +2126,10 @@ class SurveyPageNavigator extends CreatorModelElement {
         if (this.model.isPopupOpened)
             className += " svc-page-navigator__button--pressed";
         return (React.createElement("div", { className: "svc-page-navigator", ref: this.containerRef, style: { display: this.model.visible ? "flex" : "none" } },
-            attachKey2click(React.createElement("div", { role: "button", className: className, onClick: () => this.model.togglePageSelector(), title: this.model.pageSelectorCaption },
-                React.createElement(SvgIcon, { className: "svc-page-navigator__button-icon", iconName: this.model.icon, size: "auto", title: this.model.pageSelectorCaption }),
-                React.createElement(Popup, { model: this.model.popupModel }))),
+            React.createElement("div", null,
+                attachKey2click(React.createElement("div", { role: "button", className: className, onClick: () => this.model.togglePageSelector(), title: this.model.pageSelectorCaption },
+                    React.createElement(SvgIcon, { className: "svc-page-navigator__button-icon", iconName: this.model.icon, size: "auto", title: this.model.pageSelectorCaption }))),
+                React.createElement(Popup, { model: this.model.popupModel })),
             React.createElement("div", null, this.model.visibleItems.map((item) => (React.createElement(SurveyPageNavigatorItem, { key: item.id, item: item }))))));
     }
 }
@@ -2813,8 +2833,8 @@ ReactQuestionFactory.Instance.registerQuestion("sv-boolean-switch", (props) => {
 RendererFactory.Instance.registerRenderer("boolean", "switch", "sv-boolean-switch");
 
 let Version;
-Version = `${"2.0.9"}`;
-checkLibraryVersion(`${"2.0.9"}`, "survey-creator-react");
+Version = `${"2.1.1"}`;
+checkLibraryVersion(`${"2.1.1"}`, "survey-creator-react");
 
 export { ActionButton, AdaptiveToolbox, CellQuestionAdornerComponent, CellQuestionDropdownAdornerComponent, CreatorSurveyPageComponent, ImageItemValueAdornerComponent, ItemValueAdornerComponent, LogoImageComponent, MatrixCellAdornerComponent, PanelAdornerComponent, PropertyGridComponent, PropertyGridPlaceholderComponent, QuestionAdornerComponent, QuestionBanner, QuestionDropdownAdornerComponent, QuestionEditorContentComponent, QuestionErrorComponent, QuestionImageAdornerComponent, QuestionRatingAdornerComponent, QuestionWidgetAdornerComponent, QuestionWrapperFooter, QuestionWrapperHeader, ReactDragEvent, ReactMouseEvent, RowWrapper, SearchComponent, SideBarDefaultHeader, SidebarComponent, SurveyCreator, SurveyCreatorComponent, SurveyCreatorToolboxCategory, SurveyCreatorToolboxItem, SurveyCreatorToolboxItemGroup, SurveyCreatorToolboxTool, SurveyElementEmbeddedSurvey, SurveyLocStringEditor, SurveyLogicOpertor, SurveyNavigation, SurveyQuestionBooleanSwitch, SurveyQuestionColor, SurveyQuestionFileEditor, SurveyQuestionLinkValue, SurveyQuestionSpinEditor, SurveyQuestionTextWithReset, SurveyResults, SurveyResultsByRow, SurveySimulator, SwitcherComponent, TabButtonComponent, TabDesignerComponent, TabJsonEditorAceComponent, TabJsonEditorErrorsComponent, TabJsonEditorTextareaComponent, TabLogicAddButtonComponent, TabLogicComponent, TabPreviewSurveyComponent, TabPreviewTestSurveyAgainComponent, TabThemeSurveyComponent, TabTranslationComponent, TabbedMenuComponent, TabbedMenuItemComponent, ToolboxList, TranslateFromAction, TranslationLineSkeleton, Version };
 //# sourceMappingURL=survey-creator-react.mjs.map