survey-creator-react 2.0.5 → 2.0.7

package/fesm/survey-creator-react.mjs

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator React v2.0.5
+ * SurveyJS Creator React v2.0.7
  * (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
@@ -7,10 +7,10 @@
 
 import * as React from 'react';
 import { createElement, Fragment } from 'react';
-import * as ReactDOM from 'react-dom';
-import { ReactElementFactory, SurveyElementBase, attachKey2click, SvgIcon, Survey, SvgBundleComponent, PopupModal, SurveyActionBar, NotifierComponent, ReactQuestionFactory, SurveyLocStringViewer, TitleElement, ReactSurveyElementsWrapper, LoadingIndicatorComponent, SurveyPage, Popup, LogoImage, SurveyQuestionElementBase, SurveyQuestion, Scroll, CharacterCounterComponent, SurveyQuestionDropdown, SurveyHeader, List, SurveyQuestionButtonGroup, SurveyQuestionText } from 'survey-react-ui';
-import { assign, SurveyCreatorModel, RowViewModel, QuestionAdornerViewModel, QuestionDropdownAdornerViewModel, QuestionImageAdornerViewModel, QuestionRatingAdornerViewModel, PageAdorner, LogoImageViewModel, editorLocalization, ItemValueWrapperViewModel, ImageItemValueWrapperViewModel, MatrixCellWrapperViewModel, SurveyResultsModel, ToolboxToolViewModel, editableStringRendererName, StringEditorViewModelBase, initLogicOperator, PageNavigatorViewModel } from 'survey-creator-core';
+import { ReactElementFactory, SurveyElementBase, attachKey2click, SvgIcon, Survey, ReactQuestionFactory, SurveyLocStringViewer, SvgBundleComponent, PopupModal, SurveyActionBar, NotifierComponent, TitleElement, ReactSurveyElementsWrapper, LoadingIndicatorComponent, SurveyPage, Popup, LogoImage, SurveyQuestionElementBase, SurveyQuestion, Scroll, CharacterCounterComponent, SurveyQuestionDropdown, SurveyHeader, List, SurveyQuestionText } from 'survey-react-ui';
+import { SurveyCreatorModel, assign, RowViewModel, QuestionAdornerViewModel, QuestionDropdownAdornerViewModel, QuestionImageAdornerViewModel, QuestionRatingAdornerViewModel, PageAdorner, LogoImageViewModel, editorLocalization, ItemValueWrapperViewModel, ImageItemValueWrapperViewModel, MatrixCellWrapperViewModel, SurveyResultsModel, ToolboxToolViewModel, editableStringRendererName, StringEditorViewModelBase, initLogicOperator, PageNavigatorViewModel } from 'survey-creator-core';
 export { PropertyGridEditorCollection, SurveyLogic, SurveyLogicUI, SurveyQuestionEditorDefinition, ToolboxToolViewModel, editorLocalization, localization, settings, svgBundle } from 'survey-creator-core';
+import * as ReactDOM from 'react-dom';
 import { ResponsivityManager, CssClassBuilder, settings, VerticalResponsivityManager, RendererFactory, unwrap, checkLibraryVersion } from 'survey-core';
 
 class TabbedMenuComponent extends SurveyElementBase {
@@ -214,15 +214,8 @@ class SurveyCreator extends SurveyCreatorModel {
         super(options, options2);
     }
     render(target) {
-        let node = target;
-        if (typeof target === "string") {
-            node = document.getElementById(target);
-        }
-        /* eslint-disable react/no-deprecated */
-        ReactDOM.unmountComponentAtNode(node);
-        ReactDOM.render(React.createElement(React.StrictMode, null,
-            React.createElement(SurveyCreatorComponent, { creator: this })), node);
-        /* eslint-enable react/no-deprecated */
+        // eslint-disable-next-line no-console
+        console.error("The render method is deprecated. Use SurveyCreatorComponent instead.");
     }
     //ISurveyCreator
     createQuestionElement(question) {
@@ -1125,6 +1118,15 @@ class ImageItemValueAdornerComponent extends CreatorModelElement {
         return React.createElement("div", { className: "svc-image-item-value__loading" },
             React.createElement(LoadingIndicatorComponent, null));
     }
+    renderNewItemControls() {
+        const addButton = attachKey2click(React.createElement("span", { className: this.model.addButtonCss, onClick: () => this.model.chooseNewFile(this.model) }, this.model.showChooseButtonAsIcon ?
+            React.createElement(SvgIcon, { size: "auto", iconName: "icon-add-lg", title: this.model.addFileTitle }) :
+            React.createElement("span", null, this.model.chooseImageText)));
+        const placeholder = this.model.showPlaceholder ? React.createElement("span", { className: "svc-image-item-value__placeholder" }, this.model.placeholderText) : null;
+        return React.createElement(React.Fragment, null,
+            placeholder,
+            addButton);
+    }
     render() {
         this.model.item = this.props.item;
         const isNew = !this.props.question.isItemInList(this.props.item);
@@ -1133,12 +1135,13 @@ class ImageItemValueAdornerComponent extends CreatorModelElement {
         let content = null;
         if (isNew || this.model.isUploading) {
             content = (React.createElement(React.Fragment, null,
-                React.createElement("div", { className: "svc-image-item-value__item", onDrop: this.model.onDrop, onDragOver: this.model.onDragOver, onDragLeave: this.model.onDragLeave },
+                React.createElement("div", { className: "svc-image-item-value__item" },
                     React.createElement("div", { className: "sd-imagepicker__item sd-imagepicker__item--inline" },
                         React.createElement("label", { className: "sd-imagepicker__label" },
                             React.createElement("div", { style: imageStyle, className: "sd-imagepicker__image" }, this.model.isUploading ? this.renderLoadingIndicator() : null)))),
-                React.createElement("div", { className: "svc-image-item-value-controls" }, this.model.allowAdd && !this.model.isUploading ? attachKey2click(React.createElement("span", { className: "svc-context-button svc-image-item-value-controls__add", onClick: () => this.model.chooseNewFile(this.model) },
-                    React.createElement(SvgIcon, { size: "auto", iconName: "icon-add-lg", title: this.model.addFileTitle }))) : null)));
+                this.model.allowAdd && !this.model.isUploading ?
+                    React.createElement("div", { className: "svc-image-item-value-controls" }, this.renderNewItemControls())
+                    : null));
         }
         else {
             content = (React.createElement(React.Fragment, null,
@@ -1155,7 +1158,7 @@ class ImageItemValueAdornerComponent extends CreatorModelElement {
                             React.createElement(SvgIcon, { role: "button", size: "auto", iconName: "icon-delete", title: this.model.removeFileTitle }))) : null)
                     : null));
         }
-        return (React.createElement("div", { ref: this.rootRef, className: this.model.getRootCss(), key: this.props.element.key, "data-sv-drop-target-item-value": this.model.isDraggable ? this.model.item.value : undefined, onPointerDown: (event) => this.model.onPointerDown(event), onDragStart: this.preventDragHandler },
+        return (React.createElement("div", { ref: this.rootRef, className: this.model.getRootCss(), key: this.props.element.key, "data-sv-drop-target-item-value": this.model.isDraggable ? this.model.item.value : undefined, onPointerDown: (event) => this.model.onPointerDown(event), onDragStart: this.preventDragHandler, onDrop: this.model.onDrop, onDragEnter: this.model.onDragEnter, onDragOver: this.model.onDragOver, onDragLeave: this.model.onDragLeave },
             React.createElement("div", { className: "svc-image-item-value-wrapper__ghost", style: imageStyle }),
             React.createElement("div", { className: "svc-image-item-value-wrapper__content" },
                 React.createElement("input", { type: "file", "aria-hidden": "true", tabIndex: -1, accept: this.model.acceptedTypes, className: "svc-choose-file-input", style: {
@@ -2056,14 +2059,12 @@ class SurveyLogicOpertor extends SurveyQuestionDropdown {
     renderInput() {
         const q = this.question;
         initLogicOperator(q);
-        const text = (q.selectedItemLocText) ? this.renderLocString(q.selectedItemLocText) : "";
+        const text = (q.locReadOnlyText) ? this.renderLocString(q.locReadOnlyText) : "";
         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,
-                React.createElement("div", null, q.readOnlyText)),
+            React.createElement("div", { className: this.question.cssClasses.controlValue }, text),
             this.createClearButton()));
     }
 }
@@ -2594,9 +2595,6 @@ class PropertyGridComponent extends SurveyElementBase {
             React.createElement(Survey, { model: this.model.survey })));
     }
 }
-ReactQuestionFactory.Instance.registerQuestion("buttongroup", (props) => {
-    return React.createElement(SurveyQuestionButtonGroup, props);
-});
 ReactElementFactory.Instance.registerElement("svc-property-grid", (props) => {
     return React.createElement(PropertyGridComponent, props);
 });
@@ -2737,7 +2735,7 @@ class SurveyQuestionFileEditor extends SurveyQuestionText {
     }
     renderInput() {
         return (React.createElement(React.Fragment, null,
-            React.createElement("input", { disabled: this.isDisplayMode, className: this.questionFile.cssClasses.control, placeholder: this.questionFile.renderedPlaceholder, ref: (input) => (this.setControl(input)), autoComplete: "off", type: "text", onBlur: (event) => this.questionFile.onInputBlur(event.nativeEvent), onChange: (event) => this.questionFile.onInputChange(event.nativeEvent) })));
+            React.createElement("input", { disabled: this.question.isTextInputReadOnly, className: this.questionFile.cssClasses.control, placeholder: this.questionFile.renderedPlaceholder, ref: (input) => (this.setControl(input)), autoComplete: "off", type: "text", onBlur: (event) => this.questionFile.onInputBlur(event.nativeEvent), onChange: (event) => this.questionFile.onInputChange(event.nativeEvent) })));
     }
     renderFileInput() {
         return (React.createElement("input", { type: "file", disabled: this.isDisplayMode, className: this.questionFile.cssClasses.fileInput, id: this.questionFile.inputId, "aria-required": this.questionFile.ariaRequired, "aria-label": this.questionFile.ariaLabel, "aria-invalid": this.questionFile.ariaInvalid, "aria-describedby": this.questionFile.ariaDescribedBy, multiple: false, title: this.questionFile.inputTitle, accept: this.questionFile.acceptedTypes, tabIndex: -1, onChange: (event) => this.questionFile.onFileInputChange(event.nativeEvent) }));
@@ -2815,8 +2813,8 @@ ReactQuestionFactory.Instance.registerQuestion("sv-boolean-switch", (props) => {
 RendererFactory.Instance.registerRenderer("boolean", "switch", "sv-boolean-switch");
 
 let Version;
-Version = `${"2.0.5"}`;
-checkLibraryVersion(`${"2.0.5"}`, "survey-creator-react");
+Version = `${"2.0.7"}`;
+checkLibraryVersion(`${"2.0.7"}`, "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