survey-creator-js 2.2.0 → 2.2.2

package/fesm/survey-creator-js.mjs

@@ -1,5 +1,5 @@
 /*!
- * SurveyJS Creator UI v2.2.0
+ * SurveyJS Creator UI v2.2.2
  * (c) 2015-2025 Devsoft Baltic OÜ - http://surveyjs.io/
  * Github: https://github.com/surveyjs/survey-creator
  * License: https://surveyjs.io/Licenses#SurveyCreator
@@ -9,7 +9,7 @@ import * as React from 'survey-js-ui';
 import { ReactElementFactory, SurveyElementBase, attachKey2click, SvgIcon, Survey, SvgBundleComponent, PopupModal, SurveyActionBar, NotifierComponent, ReactQuestionFactory, SurveyLocStringViewer, TitleElement, ReactSurveyElementsWrapper, LoadingIndicatorComponent, SurveyPage, Popup, LogoImage, SurveyQuestionElementBase, SurveyQuestion, createElement, Scroll, CharacterCounterComponent, SurveyQuestionDropdown, SurveyHeader, List, Fragment, SurveyQuestionText, preact } from 'survey-js-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';
 export { PropertyGridEditorCollection, SurveyLogic, SurveyLogicUI, SurveyQuestionEditorDefinition, ToolboxToolViewModel, editorLocalization, localization, settings, svgBundle } from 'survey-creator-core';
-import { ResponsivityManager, CssClassBuilder, settings, VerticalResponsivityManager, RendererFactory, unwrap, checkLibraryVersion } from 'survey-core';
+import { CssClassBuilder, settings, RendererFactory, unwrap, checkLibraryVersion } from 'survey-core';
 
 class TabbedMenuComponent extends SurveyElementBase {
     get model() {
@@ -24,17 +24,24 @@ class TabbedMenuComponent extends SurveyElementBase {
     }
     renderElement() {
         const items = this.model.renderedActions.map((item) => React.createElement(TabbedMenuItemWrapper, { item: item, key: item.renderedId }));
-        return (React.createElement("div", { ref: this.rootRef, className: "svc-tabbed-menu", role: "tablist" }, items));
+        return (React.createElement("div", { ref: this.rootRef, className: "svc-tabbed-menu", role: "tablist", style: this.model.getRootStyle() }, items));
+    }
+    componentDidUpdate(prevProps, prevState) {
+        super.componentDidUpdate(prevProps, prevState);
+        const container = this.rootRef.current;
+        if (!container)
+            return;
+        this.model.initResponsivityManager(container);
     }
     componentDidMount() {
         super.componentDidMount();
         const container = this.rootRef.current;
         if (!container)
             return;
-        this.manager = new ResponsivityManager(container, this.model);
+        this.model.initResponsivityManager(container);
     }
     componentWillUnmount() {
-        this.manager && (this.manager.dispose());
+        this.model.resetResponsivityManager();
         super.componentWillUnmount();
     }
 }
@@ -1567,17 +1574,22 @@ class AdaptiveToolbox extends SurveyElementBase {
         super(props);
         this.rootRef = React.createRef();
     }
+    componentDidUpdate(prevProps, prevState) {
+        super.componentDidUpdate(prevProps, prevState);
+        const container = this.rootRef.current;
+        if (container) {
+            this.toolbox.afterRender(container);
+        }
+    }
     componentDidMount() {
         super.componentDidMount();
         const container = this.rootRef.current;
-        this.toolbox.setRootElement(container);
-        if (!container)
-            return;
-        this.manager = new VerticalResponsivityManager(this.toolbox.containerElement, this.toolbox);
+        if (container) {
+            this.toolbox.afterRender(container);
+        }
     }
     componentWillUnmount() {
-        this.manager && (this.manager.dispose());
-        this.toolbox.setRootElement(undefined);
+        this.toolbox.beforeDestroy();
         super.componentWillUnmount();
     }
     get creator() {
@@ -1610,11 +1622,9 @@ class AdaptiveToolbox extends SurveyElementBase {
             React.createElement("div", { className: "svc-toolbox__category-separator svc-toolbox__category-separator--search" })));
     }
     render() {
-        if (!this.toolbox.hasActions)
-            return null;
         const search = this.toolbox.showSearch ? this.renderSearch() : null;
         const placeholder = this.toolbox.showPlaceholder ? React.createElement("div", { className: "svc-toolbox__placeholder" }, this.toolbox.toolboxNoResultsFound) : null;
-        return (React.createElement("div", { ref: this.rootRef, className: this.toolbox.classNames },
+        return (React.createElement("div", { ref: this.rootRef, className: this.toolbox.classNames, style: this.toolbox.getRootStyle() },
             React.createElement("div", { onBlur: (e) => this.toolbox.focusOut(e), className: "svc-toolbox__panel" },
                 search,
                 placeholder,
@@ -2030,12 +2040,12 @@ class SurveyLocStringEditor extends CreatorModelElement {
             if (this.htmlValue.__html !== this.locString.renderedHtml) {
                 this.htmlValue = { __html: this.locString.renderedHtml };
             }
-            control = (React.createElement("span", { role: "textbox", ref: this.svStringEditorRef, className: "sv-string-editor sv-string-editor--html", contentEditable: this.contentEditable, spellCheck: false, "aria-placeholder": this.placeholder, "aria-label": this.placeholder || "content editable", suppressContentEditableWarning: true, 
+            control = (React.createElement("span", { role: "textbox", ref: this.svStringEditorRef, className: "sv-string-editor sv-string-editor--html", contentEditable: this.contentEditable, spellCheck: false, "aria-placeholder": this.placeholder, "aria-label": this.placeholder || "content editable", suppressContentEditableWarning: true, tabIndex: this.baseModel.tabIndex, 
                 // style={this.style}
                 dangerouslySetInnerHTML: this.htmlValue, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.onKeyDown, onMouseUp: this.onMouseUp, onClick: this.edit }));
         }
         else {
-            control = (React.createElement("span", { role: "textbox", ref: this.svStringEditorRef, className: "sv-string-editor", contentEditable: this.contentEditable, spellCheck: false, "aria-placeholder": this.placeholder, "aria-label": this.placeholder || "content editable", suppressContentEditableWarning: true, 
+            control = (React.createElement("span", { role: "textbox", ref: this.svStringEditorRef, className: "sv-string-editor", contentEditable: this.contentEditable, tabIndex: this.baseModel.tabIndex, spellCheck: false, "aria-placeholder": this.placeholder, "aria-label": this.placeholder || "content editable", suppressContentEditableWarning: true, 
                 // style={this.style}
                 key: this.locString.renderedHtml, onBlur: this.onBlur, onInput: this.onInput, onPaste: this.onPaste, onCompositionStart: this.onCompositionStart, onCompositionEnd: this.onCompositionEnd, onFocus: this.onFocus, onKeyDown: this.onKeyDown, onKeyUp: this.onKeyUp, onMouseUp: this.onMouseUp, onClick: this.edit }, this.locString.renderedHtml));
         }
@@ -2832,8 +2842,8 @@ ReactQuestionFactory.Instance.registerQuestion("sv-boolean-switch", (props) => {
 RendererFactory.Instance.registerRenderer("boolean", "switch", "sv-boolean-switch");
 
 let Version;
-Version = `${"2.2.0"}`;
-checkLibraryVersion(`${"2.2.0"}`, "survey-creator-react");
+Version = `${"2.2.2"}`;
+checkLibraryVersion(`${"2.2.2"}`, "survey-creator-react");
 
 function renderSurveyCreator(creator, element, props = {}) {
     let node = element;