survey-creator-vue 2.5.21 → 2.5.23

package/survey-creator-vue.es.js

@@ -1,14 +1,14 @@
-import { useBase as $, SvComponent as c, key2ClickDirective as M, SurveyComponent as O, useQuestion as Q, ComponentFactory as ie } from "survey-vue3-ui";
-import { defineComponent as g, computed as k, toRaw as _e, ref as P, onMounted as R, onUnmounted as K, openBlock as a, createElementBlock as r, Fragment as T, createVNode as v, unref as s, createElementVNode as d, normalizeClass as m, normalizeStyle as F, createCommentVNode as p, createBlock as b, onUpdated as G, renderList as A, nextTick as re, withDirectives as h, toDisplayString as w, vShow as H, withCtx as X, createTextVNode as ge, mergeProps as V, shallowRef as be, watch as W, onBeforeUnmount as Y, vModelText as de, renderSlot as x } from "vue";
-import { editorLocalization as ce, SurveyResultsModel as ye, initLogicOperator as he, StringEditorViewModelBase as Ce, ToolboxToolViewModel as qe, PageAdorner as fe, RowViewModel as ke, QuestionAdornerViewModel as ee, QuestionImageAdornerViewModel as $e, QuestionRatingAdornerViewModel as we, MatrixCellWrapperViewModel as Te, ItemValueWrapperViewModel as De, ImageItemValueWrapperViewModel as Ne, LogoImageViewModel as Me, PageNavigatorViewModel as Se, QuestionDropdownAdornerViewModel as Ie, editableStringRendererName as Be } from "survey-creator-core";
-import { CssClassBuilder as Ee, RendererFactory as ue, DropdownListModel as Pe } from "survey-core";
+import { useBase as $, SvComponent as u, key2ClickDirective as M, SurveyComponent as G, useQuestion as Q, ComponentFactory as ie } from "survey-vue3-ui";
+import { defineComponent as g, computed as f, toRaw as _e, ref as P, onMounted as R, onUnmounted as K, openBlock as a, createElementBlock as i, Fragment as D, createVNode as v, unref as s, createElementVNode as d, normalizeClass as _, normalizeStyle as A, createCommentVNode as p, createBlock as b, onUpdated as O, renderList as L, nextTick as re, withDirectives as h, toDisplayString as T, vShow as U, withCtx as X, createTextVNode as ge, mergeProps as V, shallowRef as be, watch as W, onBeforeUnmount as Y, vModelText as de, renderSlot as x } from "vue";
+import { editorLocalization as ue, SurveyResultsModel as ye, initLogicOperator as he, StringEditorViewModelBase as Ce, ToolboxToolViewModel as qe, PageAdorner as fe, RowViewModel as ke, QuestionAdornerViewModel as ee, QuestionImageAdornerViewModel as $e, QuestionRatingAdornerViewModel as we, MatrixCellWrapperViewModel as Te, ItemValueWrapperViewModel as De, ImageItemValueWrapperViewModel as Ne, LogoImageViewModel as Me, PageNavigatorViewModel as Se, QuestionDropdownAdornerViewModel as Ie, editableStringRendererName as Be } from "survey-creator-core";
+import { CssClassBuilder as Ee, RendererFactory as ce, DropdownListModel as Pe } from "survey-core";
 const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element--growing" }, Ve = { class: "svc-top-bar" }, Ae = {
   key: 0,
   class: "svc-tabbed-menu-wrapper"
-}, ze = ["v-show"], Le = { class: "svc-creator__content-holder svc-flex-column" }, Fe = ["aria-labelledby", "id"], Ke = {
+}, Le = ["v-show"], ze = { class: "svc-creator__content-holder svc-flex-column" }, Fe = ["aria-labelledby", "id"], Ke = {
   key: 0,
   class: "svc-footer-bar"
-}, Ue = ["v-show"], He = {
+}, He = ["v-show"], Ue = {
   key: 0,
   class: "svc-creator__banner"
 }, Qe = ["innerHTML"], Oe = /* @__PURE__ */ g({
@@ -16,104 +16,104 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = k(() => _e(t.model)), o = P();
+  setup(c) {
+    const t = c, e = f(() => _e(t.model)), o = P();
     return $(
       () => e.value,
-      (n, i) => {
-        i && i.unsubscribeRootElement(), n && o.value && n.setRootElement(o.value);
+      (n, r) => {
+        r && r.unsubscribeRootElement(), n && o.value && n.setRootElement(o.value);
       }
     ), R(() => {
       o.value && t.model.setRootElement(o.value);
     }), K(() => {
       t.model.unsubscribeRootElement();
-    }), (n, i) => e.value.isCreatorDisposed ? p("", !0) : (a(), r(T, { key: 0 }, [
-      v(s(c), { is: "survey-popup-modal" }),
+    }), (n, r) => e.value.isCreatorDisposed ? p("", !0) : (a(), i(D, { key: 0 }, [
+      v(s(u), { is: "survey-popup-modal" }),
       d("div", {
-        class: m(e.value.getRootCss()),
-        style: F(e.value.themeVariables),
+        class: _(e.value.getRootCss()),
+        style: A(e.value.themeVariables),
         ref_key: "root",
         ref: o
       }, [
         d("div", null, [
-          v(s(c), { is: "sv-svg-bundle" })
+          v(s(u), { is: "sv-svg-bundle" })
         ]),
         d("div", {
-          class: m(["svc-full-container svc-creator__area svc-flex-column", {
+          class: _(["svc-full-container svc-creator__area svc-flex-column", {
             "svc-creator__area--with-banner": !e.value.haveCommercialLicense
           }])
         }, [
           d("div", {
-            class: m(["svc-flex-row svc-full-container", {
+            class: _(["svc-flex-row svc-full-container", {
               "svc-creator__side-bar--left": e.value.sidebarLocation == "left"
             }])
           }, [
             d("div", Re, [
               d("div", Ve, [
-                e.value.showTabs ? (a(), r("div", Ae, [
-                  v(s(c), {
+                e.value.showTabs ? (a(), i("div", Ae, [
+                  v(s(u), {
                     is: "svc-tabbed-menu",
                     model: e.value.tabbedMenu
                   }, null, 8, ["model"])
                 ])) : p("", !0),
-                e.value.showToolbar ? (a(), r("div", {
+                e.value.showToolbar ? (a(), i("div", {
                   key: 1,
                   class: "svc-toolbar-wrapper",
                   "v-show": e.value.showToolbar
                 }, [
-                  v(s(c), {
+                  v(s(u), {
                     is: "sv-action-bar",
                     model: e.value.toolbar
                   }, null, 8, ["model"])
-                ], 8, ze)) : p("", !0)
+                ], 8, Le)) : p("", !0)
               ]),
               d("div", {
-                class: m(["svc-creator__content-wrapper svc-flex-row", {
+                class: _(["svc-creator__content-wrapper svc-flex-row", {
                   "svc-creator__content-wrapper--footer-toolbar": e.value.isMobileView
                 }])
               }, [
-                d("div", Le, [
-                  e.value.activeTabMenuItem ? (a(), r("div", {
+                d("div", ze, [
+                  e.value.activeTabMenuItem ? (a(), i("div", {
                     role: "tabpanel",
-                    class: m(["svc-creator-tab", {
+                    class: _(["svc-creator-tab", {
                       "svc-creator__toolbox--right": e.value.toolboxLocation == "right"
                     }]),
                     key: e.value.activeTabId,
                     "aria-labelledby": "tab-" + e.value.activeTabId,
                     id: "scrollableDiv-" + e.value.activeTabId
                   }, [
-                    v(s(c), {
+                    v(s(u), {
                       is: e.value.activeTabMenuItem.componentContent,
                       model: e.value.activeTabMenuItem.data.model
                     }, null, 8, ["is", "model"])
                   ], 10, Fe)) : p("", !0)
                 ])
               ], 2),
-              e.value.isMobileView ? (a(), r("div", Ke, [
+              e.value.isMobileView ? (a(), i("div", Ke, [
                 d("div", {
                   class: "svc-toolbar-wrapper",
                   "v-show": e.value.isMobileView
                 }, [
-                  v(s(c), {
+                  v(s(u), {
                     is: "sv-action-bar",
                     model: e.value.footerToolbar
                   }, null, 8, ["model"])
-                ], 8, Ue)
+                ], 8, He)
               ])) : p("", !0)
             ]),
-            e.value.isSidebarVisible ? (a(), b(s(c), {
+            e.value.isSidebarVisible ? (a(), b(s(u), {
               key: 0,
               is: "svc-side-bar",
               model: e.value.sidebar
             }, null, 8, ["model"])) : p("", !0)
           ], 2),
-          e.value.haveCommercialLicense ? p("", !0) : (a(), r("div", He, [
+          e.value.haveCommercialLicense ? p("", !0) : (a(), i("div", Ue, [
             d("span", {
               class: "svc-creator__non-commercial-text",
               innerHTML: e.value.licenseText
             }, null, 8, Qe)
           ])),
-          v(s(c), {
+          v(s(u), {
             is: "sv-notifier",
             model: e.value.notifier
           }, null, 8, ["model"])
@@ -126,25 +126,25 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = P();
-    return $(() => t.model), G(() => {
+  setup(c) {
+    const t = c, e = P();
+    return $(() => t.model), O(() => {
       t.model.initResponsivityManager(e.value);
     }), R(() => {
       t.model.initResponsivityManager(e.value);
     }), K(() => {
       t.model.resetResponsivityManager();
-    }), (o, n) => (a(), r("div", {
+    }), (o, n) => (a(), i("div", {
       class: "svc-tabbed-menu",
       ref_key: "container",
       ref: e,
       role: "tablist",
-      style: F(o.model.getRootStyle())
+      style: A(o.model.getRootStyle())
     }, [
-      (a(!0), r(T, null, A(o.model.renderedActions, (i) => (a(), b(s(c), {
-        key: i.renderedId,
+      (a(!0), i(D, null, L(o.model.renderedActions, (r) => (a(), b(s(u), {
+        key: r.renderedId,
         is: "svc-tabbed-menu-item-wrapper",
-        item: i
+        item: r
       }, null, 8, ["item"]))), 128))
     ], 4));
   }
@@ -153,23 +153,23 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     item: {}
   },
-  setup(u) {
-    const t = P(), e = u;
+  setup(c) {
+    const t = P(), e = c;
     return $(() => e.item), R(() => {
       const o = e.item;
-      o.updateModeCallback = (n, i) => {
-        o.mode = n, re(() => i(n, t.value));
+      o.updateModeCallback = (n, r) => {
+        o.mode = n, re(() => r(n, t.value));
       }, o.afterRender();
     }), K(() => {
       const o = e.item;
       o.updateModeCallback = void 0;
-    }), (o, n) => (a(), r("span", {
-      class: m(["svc-tabbed-menu-item-container", [o.item.isVisible ? "" : "sv-action--hidden", o.item.css]]),
+    }), (o, n) => (a(), i("span", {
+      class: _(["svc-tabbed-menu-item-container", [o.item.isVisible ? "" : "sv-action--hidden", o.item.css]]),
       ref_key: "root",
       ref: t
     }, [
       d("div", We, [
-        v(s(c), {
+        v(s(u), {
           is: o.item.component || "svc-tabbed-menu-item",
           item: o.item
         }, null, 8, ["is", "item"])
@@ -181,27 +181,27 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     item: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.item), (e, o) => h((a(), r("div", {
+  setup(c) {
+    const t = c;
+    return $(() => t.item), (e, o) => h((a(), i("div", {
       role: "tab",
       id: "tab-" + e.item.id,
       "aria-selected": e.item.active,
       "aria-controls": "scrollableDiv-" + e.item.id,
-      class: m(["svc-tabbed-menu-item", e.item.getRootCss()]),
+      class: _(["svc-tabbed-menu-item", e.item.getRootCss()]),
       onClick: o[0] || (o[0] = //@ts-ignore
       (...n) => e.item.doAction && e.item.doAction(...n))
     }, [
-      e.item.hasTitle ? (a(), r("span", {
+      e.item.hasTitle ? (a(), i("span", {
         key: 0,
-        class: m(e.item.getTitleCss())
-      }, w(e.item.title), 3)) : p("", !0),
-      e.item.hasIcon ? (a(), b(s(c), {
+        class: _(e.item.getTitleCss())
+      }, T(e.item.title), 3)) : p("", !0),
+      e.item.hasIcon ? (a(), b(s(u), {
         key: 1,
         is: "sv-svg-icon",
         iconName: e.item.iconName,
         size: "auto",
-        class: m(e.item.getIconCss()),
+        class: _(e.item.getIconCss()),
         title: e.item.tooltip || e.item.title
       }, null, 8, ["iconName", "class", "title"])) : p("", !0)
     ], 10, Je)), [
@@ -213,20 +213,20 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = P();
+  setup(c) {
+    const t = c, e = P();
     return $(() => t.model), R(() => {
       t.model.initResizeManager(e.value);
     }), K(() => {
       t.model.resetResizeManager();
-    }), (o, n) => h((a(), r("div", {
-      class: m(["svc-side-bar", o.model.rootCss])
+    }), (o, n) => h((a(), i("div", {
+      class: _(["svc-side-bar", o.model.rootCss])
     }, [
       h(d("div", {
         class: "svc-side-bar__shadow",
         onClick: n[0] || (n[0] = () => o.model.collapseSidebar())
       }, null, 512), [
-        [H, o.model.renderContainer]
+        [U, o.model.renderContainer]
       ]),
       d("div", Xe, [
         h(d("div", Ye, [
@@ -235,29 +235,29 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
             ref_key: "root",
             ref: e
           }, [
-            v(s(c), {
+            v(s(u), {
               is: o.model.header.component,
               model: o.model.header.componentModel
             }, null, 8, ["is", "model"]),
             d("div", xe, [
-              (a(!0), r(T, null, A(o.model.pages, (i, l) => (a(), b(s(c), {
+              (a(!0), i(D, null, L(o.model.pages, (r, l) => (a(), b(s(u), {
                 key: l,
                 is: "svc-side-bar-page",
-                model: i
+                model: r
               }, null, 8, ["model"]))), 128))
             ])
           ], 512)
         ], 512), [
-          [H, o.model.renderContainer]
+          [U, o.model.renderContainer]
         ]),
-        o.model.sideAreaComponentName ? (a(), b(s(c), {
+        o.model.sideAreaComponentName ? (a(), b(s(u), {
           key: 0,
           is: o.model.sideAreaComponentName,
           model: o.model.sideAreaComponentData
         }, null, 8, ["is", "model"])) : p("", !0)
       ])
     ], 2)), [
-      [H, o.model.renderRoot]
+      [U, o.model.renderRoot]
     ]);
   }
 }), oo = { class: "svc-side-bar__container-header" }, so = { class: "svc-side-bar__container-actions" }, to = {
@@ -268,16 +268,16 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", oo, [
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", oo, [
       d("div", so, [
-        v(s(c), {
+        v(s(u), {
           is: "sv-action-bar",
           model: e.model.toolbar
         }, null, 8, ["model"])
       ]),
-      e.model.title ? (a(), r("div", to, w(e.model.title), 1)) : p("", !0)
+      e.model.title ? (a(), i("div", to, T(e.model.title), 1)) : p("", !0)
     ]));
   }
 }), ao = /* @__PURE__ */ g({
@@ -285,9 +285,9 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => e.model.visible ? (a(), b(s(c), {
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => e.model.visible ? (a(), b(s(u), {
       key: 0,
       is: e.model.componentName,
       model: e.model.componentData
@@ -298,9 +298,9 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => e.model.isVisible ? (a(), b(s(c), {
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => e.model.isVisible ? (a(), b(s(u), {
       key: 0,
       is: "sv-list",
       model: e.model.list
@@ -311,16 +311,16 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", {
-      class: m(e.model.rootCss)
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", {
+      class: _(e.model.rootCss)
     }, [
-      v(s(c), {
+      v(s(u), {
         is: "svc-search",
         model: e.model.searchManager
       }, null, 8, ["model"]),
-      e.model.survey ? (a(), b(s(O), {
+      e.model.survey ? (a(), b(s(G), {
         key: 0,
         survey: e.model.survey
       }, null, 8, ["survey"])) : p("", !0)
@@ -331,38 +331,38 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(!0), r(T, null, A(e.model.actions, (n, i) => (a(), b(s(c), {
-      key: i,
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(!0), i(D, null, L(e.model.actions, (n, r) => (a(), b(s(u), {
+      key: r,
       is: "svc-tab-button",
       model: n
     }, null, 8, ["model"]))), 128));
   }
-}), co = { class: "svc-sidebar-tabs__top-container" }, uo = { class: "svc-sidebar-tabs__collapse-button" }, po = /* @__PURE__ */ d("div", { class: "svc-sidebar-tabs__separator" }, [
+}), uo = { class: "svc-sidebar-tabs__top-container" }, co = { class: "svc-sidebar-tabs__collapse-button" }, po = /* @__PURE__ */ d("div", { class: "svc-sidebar-tabs__separator" }, [
   /* @__PURE__ */ d("div")
 ], -1), vo = { class: "svc-sidebar-tabs__items" }, mo = { class: "svc-sidebar-tabs__bottom-container" }, _o = { class: "svc-sidebar-tabs__items" }, go = /* @__PURE__ */ g({
   __name: "TabControl",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", {
-      class: m(e.model.sideBarClassName)
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", {
+      class: _(e.model.sideBarClassName)
     }, [
-      d("div", co, [
-        d("div", uo, [
-          v(s(c), {
+      d("div", uo, [
+        d("div", co, [
+          v(s(u), {
             is: "svc-tab-button",
             model: e.model.expandCollapseAction
           }, null, 8, ["model"])
         ]),
         po,
-        v(s(c), { is: "sv-scroll" }, {
+        v(s(u), { is: "sv-scroll" }, {
           default: X(() => [
             d("div", vo, [
-              v(s(c), {
+              v(s(u), {
                 is: "svc-tabs",
                 model: e.model.topToolbar
               }, null, 8, ["model"])
@@ -373,7 +373,7 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
       ]),
       d("div", mo, [
         d("div", _o, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-action-bar",
             model: e.model.bottomToolbar
           }, null, 8, ["model"])
@@ -389,17 +389,17 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => e.model.visible ? (a(), r("div", bo, [
-      h((a(), r("div", {
-        class: m(e.model.buttonClassName),
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => e.model.visible ? (a(), i("div", bo, [
+      h((a(), i("div", {
+        class: _(e.model.buttonClassName),
         title: e.model.tooltip,
         onClick: o[0] || (o[0] = (n) => e.model.action())
       }, [
         d("div", ho, [
           d("div", Co, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: e.model.iconName,
               size: "auto"
@@ -416,12 +416,12 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   /* @__PURE__ */ d("div", { class: "svc-property-grid-placeholder__image" })
 ], -1), Do = /* @__PURE__ */ g({
   __name: "PropertyGridPlaceholder",
-  setup(u) {
-    const t = ce;
-    return (e, o) => (a(), r("div", fo, [
+  setup(c) {
+    const t = ue;
+    return (e, o) => (a(), i("div", fo, [
       d("div", ko, [
-        d("span", $o, w(s(t).getString("ed.propertyGridPlaceholderTitle")), 1),
-        d("span", wo, w(s(t).getString("ed.propertyGridPlaceholderDescription")), 1)
+        d("span", $o, T(s(t).getString("ed.propertyGridPlaceholderTitle")), 1),
+        d("span", wo, T(s(t).getString("ed.propertyGridPlaceholderDescription")), 1)
       ]),
       To
     ]));
@@ -437,38 +437,38 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", No, [
-      e.model.subTitle ? p("", !0) : (a(), r("div", Mo, w(e.model.title), 1)),
-      e.model.subTitle ? (a(), r("div", So, [
-        d("span", Io, w(e.model.title), 1),
-        d("span", Bo, w(e.model.subTitle), 1)
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", No, [
+      e.model.subTitle ? p("", !0) : (a(), i("div", Mo, T(e.model.title), 1)),
+      e.model.subTitle ? (a(), i("div", So, [
+        d("span", Io, T(e.model.title), 1),
+        d("span", Bo, T(e.model.subTitle), 1)
       ])) : p("", !0)
     ]));
   }
-}), Po = { class: "svc-sidebar__header svc-sidebar__header--tabbed" }, Ro = { class: "svc-sidebar__header-container svc-sidebar__header-container--with-subtitle" }, Vo = { class: "svc-sidebar__header-content" }, Ao = { class: "svc-sidebar__header-caption" }, zo = { class: "svc-sidebar__header-title" }, Lo = { class: "svc-sidebar__header-subtitle" }, Fo = /* @__PURE__ */ g({
+}), Po = { class: "svc-sidebar__header svc-sidebar__header--tabbed" }, Ro = { class: "svc-sidebar__header-container svc-sidebar__header-container--with-subtitle" }, Vo = { class: "svc-sidebar__header-content" }, Ao = { class: "svc-sidebar__header-caption" }, Lo = { class: "svc-sidebar__header-title" }, zo = { class: "svc-sidebar__header-subtitle" }, Fo = /* @__PURE__ */ g({
   __name: "SideBarPropertyGridHeader",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", Po, [
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", Po, [
       d("div", Ro, [
         d("div", Vo, [
-          h((a(), r("div", {
-            class: m(e.model.buttonClassName),
+          h((a(), i("div", {
+            class: _(e.model.buttonClassName),
             onClick: o[0] || (o[0] = (n) => e.model.action())
           }, [
             d("div", Ao, [
-              d("span", zo, w(e.model.title), 1),
-              d("span", Lo, w(e.model.tooltip), 1)
+              d("span", Lo, T(e.model.title), 1),
+              d("span", zo, T(e.model.tooltip), 1)
             ])
           ], 2)), [
             [s(M), { processEsc: !1 }]
           ]),
-          v(s(c), {
+          v(s(u), {
             is: "sv-popup",
             model: e.model.popupModel
           }, null, 8, ["model"])
@@ -484,27 +484,27 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
     cssClasses: {},
     element: {}
   },
-  setup(u) {
-    return (t, e) => (a(), r("div", { key: t.errorKey }, [
-      v(s(c), {
+  setup(c) {
+    return (t, e) => (a(), i("div", { key: t.errorKey }, [
+      v(s(u), {
         is: "sv-svg-icon",
-        class: m(t.cssClasses.error.icon),
+        class: _(t.cssClasses.error.icon),
         iconName: "icon-alert_24x24",
         size: "auto"
       }, null, 8, ["class"]),
       d("span", {
-        class: m(
+        class: _(
           t.cssClasses ? t.cssClasses.error.item || void 0 : "panel-error-item"
         )
       }, [
-        v(s(c), {
+        v(s(u), {
           is: "survey-string",
           locString: t.error.locText
         }, null, 8, ["locString"])
       ], 2)
     ]));
   }
-}), Uo = ["title"], Ho = ["title"], Qo = ["title"], Oo = ["title"], Go = /* @__PURE__ */ g({
+}), Ho = ["title"], Uo = ["title"], Qo = ["title"], Oo = ["title"], Go = /* @__PURE__ */ g({
   __name: "ActionButton",
   props: {
     classes: {},
@@ -516,47 +516,47 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
     click: { type: Function },
     iconName: {}
   },
-  setup(u) {
-    const t = u, e = (n) => {
+  setup(c) {
+    const t = c, e = (n) => {
       t.click(), t.allowBubble || n.stopPropagation();
     }, o = () => new Ee().append(t.classes || "").append("svc-action-button").append("svc-action-button--icon", !!t.iconName).append("svc-action-button--selected", !!t.selected).append("svc-action-button--disabled", !!t.disabled).toString();
-    return (n, i) => (a(), r(T, null, [
-      n.iconName ? p("", !0) : (a(), r(T, { key: 0 }, [
-        n.disabled ? (a(), r("span", {
+    return (n, r) => (a(), i(D, null, [
+      n.iconName ? p("", !0) : (a(), i(D, { key: 0 }, [
+        n.disabled ? (a(), i("span", {
           key: 0,
-          class: m(["svc-action-button svc-action-button--disabled", n.classes]),
+          class: _(["svc-action-button svc-action-button--disabled", n.classes]),
           title: n.title
-        }, w(n.text), 11, Uo)) : p("", !0),
-        h((a(), r("span", {
+        }, T(n.text), 11, Ho)) : p("", !0),
+        h((a(), i("span", {
           role: "button",
-          class: m(["svc-action-button", o()]),
+          class: _(["svc-action-button", o()]),
           onClick: e,
           title: n.title
         }, [
-          ge(w(n.text), 1)
-        ], 10, Ho)), [
+          ge(T(n.text), 1)
+        ], 10, Uo)), [
           [s(M)]
         ])
       ], 64)),
-      n.iconName ? (a(), r(T, { key: 1 }, [
-        n.disabled ? (a(), r("span", {
+      n.iconName ? (a(), i(D, { key: 1 }, [
+        n.disabled ? (a(), i("span", {
           key: 0,
-          class: m(o()),
+          class: _(o()),
           title: n.title
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             iconName: n.iconName,
             size: "auto"
           }, null, 8, ["iconName"])
         ], 10, Qo)) : p("", !0),
-        h((a(), r("span", {
+        h((a(), i("span", {
           role: "button",
           onClick: e,
-          class: m(o()),
+          class: _(o()),
           title: n.title
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             iconName: n.iconName,
             size: "auto"
@@ -580,10 +580,10 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
   props: {
     item: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.item), (e, o) => h((a(), r("button", {
-      class: m(e.item.getActionBarItemCss()),
+  setup(c) {
+    const t = c;
+    return $(() => t.item), (e, o) => h((a(), i("button", {
+      class: _(e.item.getActionBarItemCss()),
       type: "button",
       onClick: o[0] || (o[0] = (n) => {
         e.item.action(e.item, !!n.pointerType);
@@ -598,114 +598,123 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
       role: e.item.ariaRole
     }, [
       d("div", {
-        class: m(e.item.getSwitcherIconCss())
+        class: _(e.item.getSwitcherIconCss())
       }, Jo, 2),
-      e.item.hasTitle ? (a(), r("span", Zo, w(e.item.title), 1)) : p("", !0)
+      e.item.hasTitle ? (a(), i("span", Zo, T(e.item.title), 1)) : p("", !0)
     ], 42, Wo)), [
       [s(M), { processEsc: !1, disableTabStop: e.item.disableTabStop }]
     ]);
   }
-}), xo = {
-  key: 0,
-  class: "svd-simulator-content"
-}, es = { class: "svd-simulator-content" }, os = /* @__PURE__ */ g({
+}), xo = /* @__PURE__ */ g({
   __name: "Simulator",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
+  setup(c) {
+    const t = c;
     $(() => t.model);
-    const e = k(() => t.model.simulatorFrame), o = () => {
+    const e = f(() => t.model.simulatorFrame), o = f(() => {
+      const l = t.model.popupOverlayHeight;
+      return l ? { "--sv-popup-overlay-height": l } : {};
+    });
+    R(() => t.model.queueSurveyLayoutRefresh()), O(() => t.model.queueSurveyLayoutRefresh()), K(() => t.model.cancelSurveyLayoutRefresh());
+    const n = () => {
       t.model.device !== "desktop" && t.model.activateZoom();
-    }, n = () => {
+    }, r = () => {
       t.model.device !== "desktop" && t.model.deactivateZoom();
     };
-    return (i, l) => (a(), r("div", {
-      class: m(i.model.getRootCss()),
-      onKeydown: l[0] || (l[0] = (_) => i.model.tryToZoom(void 0, _)),
-      onMouseover: l[1] || (l[1] = (_) => o()),
-      onMouseout: l[2] || (l[2] = (_) => n())
+    return (l, m) => (a(), i("div", {
+      class: _(l.model.getRootCss()),
+      onKeydown: m[0] || (m[0] = (w) => l.model.tryToZoom(void 0, w)),
+      onMouseover: m[1] || (m[1] = (w) => n()),
+      onMouseout: m[2] || (m[2] = (w) => r())
     }, [
-      i.model.hasFrame ? p("", !0) : (a(), r("div", xo, [
-        v(s(c), {
+      l.model.hasFrame ? p("", !0) : (a(), i("div", {
+        key: 0,
+        class: "svd-simulator-content",
+        style: A(o.value)
+      }, [
+        v(s(u), {
           is: "survey-widget",
-          model: i.model.survey
+          model: l.model.survey
         }, null, 8, ["model"])
-      ])),
-      i.model.hasFrame ? (a(), r("div", {
+      ], 4)),
+      l.model.hasFrame ? (a(), i("div", {
         key: 1,
         class: "svd-simulator-wrapper",
         id: "svd-simulator-wrapper",
-        style: F({
+        style: A({
           width: e.value.frameWidth + "px",
           height: e.value.frameHeight + "px"
         })
       }, [
         d("div", {
           class: "svd-simulator",
-          style: F({
+          style: A({
             width: e.value.deviceWidth + "px",
             height: e.value.deviceHeight + "px",
             transform: "scale(" + e.value.scale + ") translate(-50%, -50%)"
           })
         }, [
-          d("div", es, [
-            v(s(c), {
+          d("div", {
+            class: "svd-simulator-content",
+            style: A(o.value)
+          }, [
+            v(s(u), {
               is: "survey-widget",
-              model: i.model.survey
+              model: l.model.survey
             }, null, 8, ["model"])
-          ])
+          ], 4)
         ], 4)
       ], 4)) : p("", !0)
     ], 34));
   }
-}), ss = /* @__PURE__ */ g({
+}), es = /* @__PURE__ */ g({
   __name: "ComponentContainer",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return (e, o) => (a(), r("div", {
-      class: m(e.model.cssClass)
+  setup(c) {
+    const t = c;
+    return (e, o) => (a(), i("div", {
+      class: _(e.model.cssClass)
     }, [
-      (a(!0), r(T, null, A(t.model.elements, (n, i) => (a(), b(s(c), V({
+      (a(!0), i(D, null, L(t.model.elements, (n, r) => (a(), b(s(u), V({
         is: n.componentName
-      }, n.componentData, { key: i }), null, 16, ["is"]))), 128))
+      }, n.componentData, { key: r }), null, 16, ["is"]))), 128))
     ], 2));
   }
-}), ts = { class: "svc-surface-placeholder" }, ns = { class: "svc-surface-placeholder__text" }, as = { class: "svc-surface-placeholder__title" }, ls = { class: "svc-surface-placeholder__description" }, j = /* @__PURE__ */ g({
+}), os = { class: "svc-surface-placeholder" }, ss = { class: "svc-surface-placeholder__text" }, ts = { class: "svc-surface-placeholder__title" }, ns = { class: "svc-surface-placeholder__description" }, j = /* @__PURE__ */ g({
   __name: "SurfacePlaceholder",
   props: {
     name: {},
     placeholderTitleText: {},
     placeholderDescriptionText: {}
   },
-  setup(u) {
-    const t = u;
-    return (e, o) => (a(), r("div", ts, [
+  setup(c) {
+    const t = c;
+    return (e, o) => (a(), i("div", os, [
       d("div", {
-        class: m(["svc-surface-placeholder__image", "svc-surface-placeholder__image--" + e.name])
+        class: _(["svc-surface-placeholder__image", "svc-surface-placeholder__image--" + e.name])
       }, null, 2),
-      d("div", ns, [
-        d("div", as, w(t.placeholderTitleText), 1),
-        d("div", ls, w(t.placeholderDescriptionText), 1)
+      d("div", ss, [
+        d("div", ts, T(t.placeholderTitleText), 1),
+        d("div", ns, T(t.placeholderDescriptionText), 1)
       ])
     ]));
   }
-}), is = {
+}), as = {
   key: 2,
   class: "svc-plugin-tab__content-actions svc-test-tab__content-actions"
-}, rs = /* @__PURE__ */ g({
+}, ls = /* @__PURE__ */ g({
   __name: "Test",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", {
-      class: m(["svc-creator-tab__content svc-test-tab__content", {
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", {
+      class: _(["svc-creator-tab__content svc-test-tab__content", {
         "svc-creator-tab__content--with-toolbar": e.model.isPageToolbarVisible
       }])
     }, [
@@ -715,53 +724,53 @@ const Re = { class: "svc-flex-column svc-flex-row__element svc-flex-row__element
         placeholderTitleText: e.model.placeholderTitleText,
         placeholderDescriptionText: e.model.placeholderDescriptionText
       }, null, 8, ["placeholderTitleText", "placeholderDescriptionText"])) : p("", !0),
-      e.model.survey.isEmpty ? p("", !0) : (a(), r("div", {
+      e.model.survey.isEmpty ? p("", !0) : (a(), i("div", {
         key: 1,
         class: "svc-plugin-tab__content",
         onScroll: o[0] || (o[0] = (n) => e.model.onScroll())
       }, [
-        v(s(c), {
+        v(s(u), {
           is: "survey-simulator",
           model: e.model.simulator
         }, null, 8, ["model"]),
-        e.model.showResults ? (a(), b(s(c), {
+        e.model.showResults ? (a(), b(s(u), {
           key: 0,
           is: "survey-results",
           survey: e.model.survey
         }, null, 8, ["survey"])) : p("", !0)
       ], 32)),
-      e.model.isPageToolbarVisible ? (a(), r("div", is, [
-        v(s(c), {
+      e.model.isPageToolbarVisible ? (a(), i("div", as, [
+        v(s(u), {
           is: "sv-action-bar",
           model: e.model.pages
         }, null, 8, ["model"])
       ])) : p("", !0)
     ], 2));
   }
-}), ds = { class: "svc-btn__text" }, cs = /* @__PURE__ */ g({
+}), is = { class: "svc-btn__text" }, rs = /* @__PURE__ */ g({
   inheritAttrs: !1,
   __name: "TestAgain",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.model.testAgainAction);
-    return $(() => e.value), (o, n) => h((a(), r("div", {
+  setup(c) {
+    const t = c, e = f(() => t.model.testAgainAction);
+    return $(() => e.value), (o, n) => h((a(), i("div", {
       role: "button",
       class: "svc-preview__test-again svc-btn",
-      onClick: n[0] || (n[0] = (i) => e.value.action())
+      onClick: n[0] || (n[0] = (r) => e.value.action())
     }, [
-      d("span", ds, w(e.value.title), 1)
+      d("span", is, T(e.value.title), 1)
     ])), [
       [s(M)]
     ]);
   }
 });
-function z(u, t, e) {
+function z(c, t, e) {
   const o = be(), n = W(
-    t.map((i) => () => i()),
+    t.map((r) => () => r()),
     () => {
-      o.value = u();
+      o.value = c();
     },
     {
       immediate: !0
@@ -771,32 +780,32 @@ function z(u, t, e) {
     n();
   }), o;
 }
-const us = {
+const ds = {
   key: 0,
   class: "svd-test-results"
-}, ps = { class: "svd-test-results__content" }, vs = { class: "svd-test-results__header" }, ms = { class: "svd-test-results__header-text" }, _s = { class: "svd-test-results__header-types" }, gs = { class: "svd-test-results__text svd-light-bg-color" }, bs = { class: "svd-test-results__table svd-light-bg-color" }, ys = { class: "svd-light-background-color" }, hs = { class: "svd-dark-border-color" }, Cs = { class: "svd-dark-border-color" }, qs = /* @__PURE__ */ g({
+}, us = { class: "svd-test-results__content" }, cs = { class: "svd-test-results__header" }, ps = { class: "svd-test-results__header-text" }, vs = { class: "svd-test-results__header-types" }, ms = { class: "svd-test-results__text svd-light-bg-color" }, _s = { class: "svd-test-results__table svd-light-bg-color" }, gs = { class: "svd-light-background-color" }, bs = { class: "svd-dark-border-color" }, ys = { class: "svd-dark-border-color" }, hs = /* @__PURE__ */ g({
   __name: "SurveyResults",
   props: {
     survey: {}
   },
-  setup(u) {
-    const t = u, e = z(
+  setup(c) {
+    const t = c, e = z(
       () => t.survey ? new ye(t.survey) : void 0,
       [() => t.survey]
     );
-    return (o, n) => s(e) ? (a(), r("div", us, [
-      d("div", ps, [
-        d("div", vs, [
-          d("div", ms, w(s(e).surveyResultsText), 1),
-          d("div", _s, [
-            v(s(c), {
+    return (o, n) => s(e) ? (a(), i("div", ds, [
+      d("div", us, [
+        d("div", cs, [
+          d("div", ps, T(s(e).surveyResultsText), 1),
+          d("div", vs, [
+            v(s(u), {
               is: "svc-action-button",
               text: s(e).surveyResultsTableText,
               click: s(e).selectTableClick,
               disabled: !1,
               selected: s(e).isTableSelected
             }, null, 8, ["text", "click", "selected"]),
-            v(s(c), {
+            v(s(u), {
               is: "svc-action-button",
               text: s(e).surveyResultsJsonText,
               click: s(e).selectJsonClick,
@@ -805,168 +814,168 @@ const us = {
             }, null, 8, ["text", "click", "selected"])
           ])
         ]),
-        h(d("div", gs, [
-          d("div", null, w(s(e).resultText), 1)
+        h(d("div", ms, [
+          d("div", null, T(s(e).resultText), 1)
         ], 512), [
-          [H, s(e).resultViewType === "text"]
+          [U, s(e).resultViewType === "text"]
         ]),
-        h(d("div", bs, [
+        h(d("div", _s, [
           d("table", null, [
             d("thead", null, [
-              d("tr", ys, [
-                d("th", hs, w(s(e).resultsTitle), 1),
-                d("th", Cs, w(s(e).resultsDisplayValue), 1)
+              d("tr", gs, [
+                d("th", bs, T(s(e).resultsTitle), 1),
+                d("th", ys, T(s(e).resultsDisplayValue), 1)
               ])
             ]),
             d("tbody", null, [
-              (a(!0), r(T, null, A(s(e).resultData, (i, l) => (a(), b(s(c), {
+              (a(!0), i(D, null, L(s(e).resultData, (r, l) => (a(), b(s(u), {
                 is: "survey-results-table-row",
-                model: i,
+                model: r,
                 key: l
               }, null, 8, ["model"]))), 128))
             ])
           ])
         ], 512), [
-          [H, s(e).resultViewType === "table"]
+          [U, s(e).resultViewType === "table"]
         ])
       ])
     ])) : p("", !0);
   }
-}), fs = { key: 2 }, ks = /* @__PURE__ */ g({
+}), Cs = { key: 2 }, qs = /* @__PURE__ */ g({
   __name: "SurveyResultsRow",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r(T, null, [
-      h((a(), r("tr", {
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i(D, null, [
+      h((a(), i("tr", {
         onClick: o[0] || (o[0] = //@ts-ignore
         (...n) => e.model.toggle && e.model.toggle(...n))
       }, [
         d("td", {
           class: "svd-dark-border-color",
-          style: F({ paddingLeft: e.model.textMargin })
+          style: A({ paddingLeft: e.model.textMargin })
         }, [
-          e.model.isNode ? (a(), r("span", {
+          e.model.isNode ? (a(), i("span", {
             key: 0,
-            class: m(["svd-test-results__marker", { "svd-test-results__marker--expanded": !e.model.collapsed }]),
-            style: F({ left: e.model.markerMargin })
+            class: _(["svd-test-results__marker", { "svd-test-results__marker--expanded": !e.model.collapsed }]),
+            style: A({ left: e.model.markerMargin })
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-expand_16x16",
               size: 16
             })
           ], 6)) : p("", !0),
-          e.model.question ? (a(), b(s(c), {
+          e.model.question ? (a(), b(s(u), {
             key: 1,
             is: "survey-string",
             locString: e.model.question.locTitle
-          }, null, 8, ["locString"])) : (a(), r("span", fs, w(e.model.title), 1))
+          }, null, 8, ["locString"])) : (a(), i("span", Cs, T(e.model.title), 1))
         ], 4),
         d("td", {
-          class: m({
+          class: _({
             "svd-test-results__node-value": e.model.isNode,
             "svd-dark-border-color": !e.model.isNode
           })
-        }, w(e.model.getString(e.model.displayValue)), 3)
+        }, T(e.model.getString(e.model.displayValue)), 3)
       ])), [
         [s(M)]
       ]),
-      e.model.isNode && !e.model.collapsed ? (a(!0), r(T, { key: 0 }, A(e.model.data, (n, i) => (a(), b(s(c), {
+      e.model.isNode && !e.model.collapsed ? (a(!0), i(D, { key: 0 }, L(e.model.data, (n, r) => (a(), b(s(u), {
         is: "survey-results-table-row",
         model: n,
-        key: i + 1
+        key: r + 1
       }, null, 8, ["model"]))), 128)) : p("", !0)
     ], 64));
   }
-}), $s = { class: "svc-creator-tab__content" }, ws = { class: "svc-json-editor-tab__content" }, Ts = { class: "svc-json-editor-tab__errros_list" }, Ds = /* @__PURE__ */ g({
+}), fs = { class: "svc-creator-tab__content" }, ks = { class: "svc-json-editor-tab__content" }, $s = { class: "svc-json-editor-tab__errros_list" }, ws = /* @__PURE__ */ g({
   __name: "JsonEditorAce",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = P();
-    return $(() => t.model), R(() => t.model.init(window.ace.edit(e.value))), (o, n) => (a(), r("div", $s, [
-      d("div", ws, [
+  setup(c) {
+    const t = c, e = P();
+    return $(() => t.model), R(() => t.model.init(window.ace.edit(e.value))), (o, n) => (a(), i("div", fs, [
+      d("div", ks, [
         d("div", {
           class: "svc-json-editor-tab__ace-editor",
           ref_key: "inputEl",
           ref: e
         }, null, 512),
-        h(d("div", Ts, [
-          v(s(c), {
+        h(d("div", $s, [
+          v(s(u), {
             is: "sv-list",
             model: o.model.errorList
           }, null, 8, ["model"])
         ], 512), [
-          [H, o.model.hasErrors]
+          [U, o.model.hasErrors]
         ])
       ])
     ]));
   }
-}), Ns = { class: "svc-creator-tab__content" }, Ms = { class: "svc-json-editor-tab__content" }, Ss = ["aria-label", "disabled"], Is = { class: "svc-json-editor-tab__errros_list" }, Bs = /* @__PURE__ */ g({
+}), Ts = { class: "svc-creator-tab__content" }, Ds = { class: "svc-json-editor-tab__content" }, Ns = ["aria-label", "disabled"], Ms = { class: "svc-json-editor-tab__errros_list" }, Ss = /* @__PURE__ */ g({
   __name: "JsonEditorTextArea",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = P(), o = t.model;
+  setup(c) {
+    const t = c, e = P(), o = t.model;
     return o.canShowErrors = !1, $(() => t.model), R(() => {
       const n = t.model;
       n.textElement = e.value;
-    }), (n, i) => (a(), r("div", Ns, [
-      d("div", Ms, [
+    }), (n, r) => (a(), i("div", Ts, [
+      d("div", Ds, [
         h(d("textarea", {
           class: "svc-json-editor-tab__content-area",
           "aria-label": s(o).ariaLabel,
           disabled: s(o).readOnly,
-          "onUpdate:modelValue": i[0] || (i[0] = (l) => s(o).text = l),
-          onKeydown: i[1] || (i[1] = (l) => s(o).checkKey(s(o), l)),
+          "onUpdate:modelValue": r[0] || (r[0] = (l) => s(o).text = l),
+          onKeydown: r[1] || (r[1] = (l) => s(o).checkKey(s(o), l)),
           ref_key: "inputEl",
           ref: e
         }, `
-      `, 40, Ss), [
+      `, 40, Ns), [
           [de, s(o).text]
         ]),
-        h(d("div", Is, [
-          v(s(c), {
+        h(d("div", Ms, [
+          v(s(u), {
             is: "sv-list",
             model: s(o).errorList
           }, null, 8, ["model"])
         ], 512), [
-          [H, s(o).hasErrors]
+          [U, s(o).hasErrors]
         ])
       ])
     ]));
   }
-}), Es = { class: "svc-json-error__container" }, Ps = { class: "svc-json-error__title" }, Rs = ["title", "aria-label"], Vs = /* @__PURE__ */ g({
+}), Is = { class: "svc-json-error__container" }, Bs = { class: "svc-json-error__title" }, Es = ["title", "aria-label"], Ps = /* @__PURE__ */ g({
   __name: "JsonEditorErrorItem",
   props: {
     item: {}
   },
-  setup(u) {
-    const t = u;
+  setup(c) {
+    const t = c;
     $(() => t.item);
     const e = (o) => {
       o.stopPropagation(), t.item.data.fixError();
     };
-    return (o, n) => (a(), r(T, null, [
-      v(s(c), {
+    return (o, n) => (a(), i(D, null, [
+      v(s(u), {
         is: "sv-svg-icon",
         iconName: o.item.iconName,
         size: o.item.iconSize,
-        class: m("svc-json-error__icon")
+        class: _("svc-json-error__icon")
       }, null, 8, ["iconName", "size"]),
-      d("div", Es, [
-        d("div", Ps, [
-          v(s(c), {
+      d("div", Is, [
+        d("div", Bs, [
+          v(s(u), {
             is: "survey-string",
             locString: o.item.locTitle
           }, null, 8, ["locString"])
         ]),
-        o.item.data.showFixButton ? h((a(), r("button", {
+        o.item.data.showFixButton ? h((a(), i("button", {
           key: 0,
           type: "button",
           onClick: e,
@@ -974,56 +983,56 @@ const us = {
           "aria-label": o.item.data.fixButtonTitle,
           class: "svc-json-error__fix-button"
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             iconName: o.item.data.fixButtonIcon,
             size: "auto"
           }, null, 8, ["iconName"])
-        ], 8, Rs)), [
+        ], 8, Es)), [
           [s(M)]
         ]) : p("", !0)
       ])
     ], 64));
   }
-}), As = { class: "svc-btn__text" }, te = /* @__PURE__ */ g({
+}), Rs = { class: "svc-btn__text" }, te = /* @__PURE__ */ g({
   __name: "LogicAddButton",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
+  setup(c) {
+    const t = c;
     $(() => t.model);
     const e = (o) => {
       o.stopPropagation(), t.model.action();
     };
-    return (o, n) => h((a(), r("div", {
+    return (o, n) => h((a(), i("div", {
       role: "button",
-      class: m(["svc-logic-tab__content-action svc-btn", {
+      class: _(["svc-logic-tab__content-action svc-btn", {
         "svc-logic-tab__content-action--disabled": o.model.enabled !== void 0 && !o.model.enabled
       }]),
       onClick: e
     }, [
-      d("span", As, w(o.model.title), 1)
+      d("span", Rs, T(o.model.title), 1)
     ], 2)), [
       [s(M)]
     ]);
   }
-}), zs = { class: "svc-creator-tab__content" }, Ls = {
+}), Vs = { class: "svc-creator-tab__content" }, As = {
   key: 1,
   class: "svc-logic-tab__content-empty"
-}, Fs = /* @__PURE__ */ g({
+}, Ls = /* @__PURE__ */ g({
   __name: "Logic",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", zs, [
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", Vs, [
       d("div", {
-        class: m(["svc-plugin-tab__content svc-logic-tab__content", { "svc-logic-tab--empty": !e.model.hasItems }])
+        class: _(["svc-plugin-tab__content svc-logic-tab__content", { "svc-logic-tab--empty": !e.model.hasItems }])
       }, [
-        e.model.hasItems ? (a(), r(T, { key: 0 }, [
-          v(s(O), {
+        e.model.hasItems ? (a(), i(D, { key: 0 }, [
+          v(s(G), {
             model: e.model.itemsSurvey
           }, null, 8, ["model"]),
           e.model.readOnly ? p("", !0) : (a(), b(te, {
@@ -1031,7 +1040,7 @@ const us = {
             model: e.model.addNewButton
           }, null, 8, ["model"]))
         ], 64)) : p("", !0),
-        e.model.hasItems ? p("", !0) : (a(), r("div", Ls, [
+        e.model.hasItems ? p("", !0) : (a(), i("div", As, [
           v(j, {
             name: "logic",
             placeholderTitleText: e.model.placeholderTitleText,
@@ -1045,37 +1054,37 @@ const us = {
       ], 2)
     ]));
   }
-}), Ks = ["id", "required", "tabindex", "disabled", "role", "aria-required", "aria-invalid", "aria-errormessage", "aria-expanded", "aria-label", "aria-labelledby", "aria-controls"], Us = ["id"];
-ue.Instance.registerRenderer(
+}), zs = ["id", "required", "tabindex", "disabled", "role", "aria-required", "aria-invalid", "aria-errormessage", "aria-expanded", "aria-label", "aria-labelledby", "aria-controls"], Fs = ["id"];
+ce.Instance.registerRenderer(
   "dropdown",
   "logicoperator",
   "sv-logic-operator"
 );
-const Hs = /* @__PURE__ */ g({
+const Ks = /* @__PURE__ */ g({
   __name: "LogicOperator",
   props: {
     question: {}
   },
-  setup(u) {
-    const t = u, e = P(), o = k(() => t.question.dropdownListModel ?? new Pe(t.question));
+  setup(c) {
+    const t = c, e = P(), o = f(() => t.question.dropdownListModel ?? new Pe(t.question));
     Q(t, e, (l) => {
       he(l);
     });
     const n = (l) => {
-      var _;
-      (_ = o.value) == null || _.onClick(l);
-    }, i = (l) => {
-      var _;
-      (_ = o.value) == null || _.keyHandler(l);
+      var m;
+      (m = o.value) == null || m.onClick(l);
+    }, r = (l) => {
+      var m;
+      (m = o.value) == null || m.keyHandler(l);
     };
-    return (l, _) => (a(), r("div", {
-      class: m(l.question.cssClasses.selectWrapper)
+    return (l, m) => (a(), i("div", {
+      class: _(l.question.cssClasses.selectWrapper)
     }, [
-      l.question.isReadOnly ? p("", !0) : (a(), r(T, { key: 0 }, [
+      l.question.isReadOnly ? p("", !0) : (a(), i(D, { key: 0 }, [
         d("div", {
-          class: m(l.question.getControlClass()),
+          class: _(l.question.getControlClass()),
           onClick: n,
-          onKeyup: i,
+          onKeyup: r,
           id: l.question.inputId,
           required: l.question.isRequired,
           tabindex: l.question.isInputReadOnly ? void 0 : 0,
@@ -1090,51 +1099,51 @@ const Hs = /* @__PURE__ */ g({
           "aria-controls": o.value.ariaQuestionControls
         }, [
           d("div", {
-            class: m(l.question.cssClasses.controlValue)
+            class: _(l.question.cssClasses.controlValue)
           }, [
-            l.question.locReadOnlyText ? (a(), b(s(c), {
+            l.question.locReadOnlyText ? (a(), b(s(u), {
               key: 0,
               is: "survey-string",
               locString: l.question.locReadOnlyText
             }, null, 8, ["locString"])) : p("", !0)
           ], 2)
-        ], 42, Ks),
-        v(s(c), {
+        ], 42, zs),
+        v(s(u), {
           is: "sv-popup",
           model: l.question.popupModel
         }, null, 8, ["model"])
       ], 64)),
-      l.question.isReadOnly ? (a(), r("div", {
+      l.question.isReadOnly ? (a(), i("div", {
         key: 1,
         disabled: "",
-        class: m(l.question.getControlClass()),
+        class: _(l.question.getControlClass()),
         id: l.question.inputId
       }, [
-        l.question.locReadOnlyText ? (a(), b(s(c), {
+        l.question.locReadOnlyText ? (a(), b(s(u), {
           key: 0,
           is: "survey-string",
           locString: l.question.locReadOnlyText
         }, null, 8, ["locString"])) : p("", !0)
-      ], 10, Us)) : p("", !0)
+      ], 10, Fs)) : p("", !0)
     ], 2));
   }
-}), Qs = /* @__PURE__ */ g({
+}), Hs = /* @__PURE__ */ g({
   __name: "EmbeddedSurvey",
   props: {
     question: {}
   },
-  setup(u) {
-    const t = u, e = P();
+  setup(c) {
+    const t = c, e = P();
     Q(t, e);
-    const o = k(() => t.question.embeddedSurvey);
+    const o = f(() => t.question.embeddedSurvey);
     return R(() => {
       o.value.rootElement = e.value;
-    }), (n, i) => (a(), r("div", {
+    }), (n, r) => (a(), i("div", {
       style: { display: "'contents'" },
       ref_key: "root",
       ref: e
     }, [
-      n.question && o.value && o.value.currentPage ? (a(), b(s(c), {
+      n.question && o.value && o.value.currentPage ? (a(), b(s(u), {
         key: 0,
         is: "sv-page",
         page: o.value.currentPage,
@@ -1142,16 +1151,16 @@ const Hs = /* @__PURE__ */ g({
       }, null, 8, ["page", "survey"])) : p("", !0)
     ], 512));
   }
-}), Os = /* @__PURE__ */ g({
+}), Us = /* @__PURE__ */ g({
   inheritAttrs: !1,
   __name: "LinkValue",
   props: {
     question: {}
   },
-  setup(u) {
-    const t = u, e = P(), o = ce.getString("pe.clear");
-    return Q(t, e), (n, i) => (a(), r(T, null, [
-      v(s(c), {
+  setup(c) {
+    const t = c, e = P(), o = ue.getString("pe.clear");
+    return Q(t, e), (n, r) => (a(), i(D, null, [
+      v(s(u), {
         is: "svc-action-button",
         text: n.question.linkValueText,
         click: n.question.doLinkClick.bind(n.question),
@@ -1161,7 +1170,7 @@ const Hs = /* @__PURE__ */ g({
         title: n.question.tooltip,
         iconName: n.question.iconName
       }, null, 8, ["text", "click", "selected", "disabled", "classes", "title", "iconName"]),
-      !n.question.isReadOnly && n.question.showClear ? (a(), b(s(c), {
+      !n.question.isReadOnly && n.question.showClear ? (a(), b(s(u), {
         key: 0,
         is: "svc-action-button",
         text: s(o),
@@ -1171,18 +1180,18 @@ const Hs = /* @__PURE__ */ g({
       }, null, 8, ["text", "click", "classes"])) : p("", !0)
     ], 64));
   }
-}), Gs = {
+}), Qs = {
   key: 1,
   class: "st-content"
-}, Ws = { class: "svc-flex-column st-strings-wrapper" }, js = { class: "svc-flex-row st-strings-header" }, Js = { class: "svc-flex-row svc-plugin-tab__content st-strings" }, Zs = /* @__PURE__ */ g({
+}, Os = { class: "svc-flex-column st-strings-wrapper" }, Gs = { class: "svc-flex-row st-strings-header" }, Ws = { class: "svc-flex-row svc-plugin-tab__content st-strings" }, js = /* @__PURE__ */ g({
   __name: "Translation",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", {
-      class: m(["svc-creator-tab__content svc-translation-tab", e.model.isEmpty ? "svc-translation-tab--empty" : ""])
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", {
+      class: _(["svc-creator-tab__content svc-translation-tab", e.model.isEmpty ? "svc-translation-tab--empty" : ""])
     }, [
       e.model.isEmpty ? (a(), b(j, {
         key: 0,
@@ -1190,15 +1199,15 @@ const Hs = /* @__PURE__ */ g({
         placeholderTitleText: e.model.placeholderTitleText,
         placeholderDescriptionText: e.model.placeholderDescriptionText
       }, null, 8, ["placeholderTitleText", "placeholderDescriptionText"])) : p("", !0),
-      e.model.isEmpty ? p("", !0) : (a(), r("div", Gs, [
-        d("div", Ws, [
-          d("div", js, [
-            v(s(O), {
+      e.model.isEmpty ? p("", !0) : (a(), i("div", Qs, [
+        d("div", Os, [
+          d("div", Gs, [
+            v(s(G), {
               model: e.model.stringsHeaderSurvey
             }, null, 8, ["model"])
           ]),
-          d("div", Js, [
-            v(s(O), {
+          d("div", Ws, [
+            v(s(G), {
               model: e.model.stringsSurvey
             }, null, 8, ["model"])
           ])
@@ -1206,48 +1215,48 @@ const Hs = /* @__PURE__ */ g({
       ]))
     ], 2));
   }
-}), Xs = (u, t) => {
-  const e = u.__vccOpts || u;
+}), Js = (c, t) => {
+  const e = c.__vccOpts || c;
   for (const [o, n] of t)
     e[o] = n;
   return e;
-}, Ys = {}, xs = { class: "sd-translation-line-skeleton" };
-function et(u, t) {
-  return a(), r("div", xs);
+}, Zs = {}, Xs = { class: "sd-translation-line-skeleton" };
+function Ys(c, t) {
+  return a(), i("div", Xs);
 }
-const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
+const xs = /* @__PURE__ */ Js(Zs, [["render", Ys]]), et = /* @__PURE__ */ g({
   __name: "TranslateFromAction",
   props: {
     item: {}
   },
-  setup(u) {
-    return (t, e) => (a(), r("div", {
-      class: m(t.item.data.containerCss)
+  setup(c) {
+    return (t, e) => (a(), i("div", {
+      class: _(t.item.data.containerCss)
     }, [
       d("span", {
-        class: m(t.item.data.additionalTitleCss)
-      }, w(t.item.data.additionalTitle), 3),
-      v(s(c), {
+        class: _(t.item.data.additionalTitleCss)
+      }, T(t.item.data.additionalTitle), 3),
+      v(s(u), {
         is: "sv-action-bar-item-dropdown",
         item: t.item
       }, null, 8, ["item"])
     ], 2));
   }
-}), tt = {
+}), ot = {
   key: 1,
   class: "svc-plugin-tab__content"
-}, nt = {
+}, st = {
   key: 2,
   class: "svc-plugin-tab__content-actions svc-test-tab__content-actions"
-}, at = /* @__PURE__ */ g({
+}, tt = /* @__PURE__ */ g({
   __name: "Theme",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", {
-      class: m(["svc-creator-tab__content svc-test-tab__content", {
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", {
+      class: _(["svc-creator-tab__content svc-test-tab__content", {
         "svc-creator-tab__content--with-toolbar": e.model.isPageToolbarVisible
       }])
     }, [
@@ -1257,41 +1266,41 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
         placeholderTitleText: e.model.placeholderTitleText,
         placeholderDescriptionText: e.model.placeholderDescriptionText
       }, null, 8, ["placeholderTitleText", "placeholderDescriptionText"])) : p("", !0),
-      e.model.survey.isEmpty ? p("", !0) : (a(), r("div", tt, [
-        v(s(c), {
+      e.model.survey.isEmpty ? p("", !0) : (a(), i("div", ot, [
+        v(s(u), {
           is: "survey-simulator",
           model: e.model.simulator
         }, null, 8, ["model"]),
-        e.model.showResults ? (a(), b(s(c), {
+        e.model.showResults ? (a(), b(s(u), {
           key: 0,
           is: "survey-results",
           survey: e.model.survey
         }, null, 8, ["survey"])) : p("", !0)
       ])),
-      e.model.isPageToolbarVisible ? (a(), r("div", nt, [
-        v(s(c), {
+      e.model.isPageToolbarVisible ? (a(), i("div", st, [
+        v(s(u), {
           is: "sv-action-bar",
           model: e.model.pages
         }, null, 8, ["model"])
       ])) : p("", !0)
     ], 2));
   }
-}), lt = ["disabled", "value", "aria-required", "aria-labelledby", "aria-label", "aria-invalid", "aria-describedby"], it = ["disabled", "id", "placeholder", "aria-required", "aria-labelledby", "aria-label", "aria-invalid", "aria-describedby", "value"], rt = /* @__PURE__ */ g({
+}), nt = ["disabled", "value", "aria-required", "aria-labelledby", "aria-label", "aria-invalid", "aria-describedby"], at = ["disabled", "id", "placeholder", "aria-required", "aria-labelledby", "aria-label", "aria-invalid", "aria-describedby", "value"], lt = /* @__PURE__ */ g({
   __name: "Color",
   props: {
     question: {}
   },
-  setup(u) {
-    return Q(u, P()), (e, o) => (a(), r("div", {
-      class: m(e.question.cssClasses.root),
+  setup(c) {
+    return Q(c, P()), (e, o) => (a(), i("div", {
+      class: _(e.question.cssClasses.root),
       onKeydown: o[5] || (o[5] = //@ts-ignore
       (...n) => e.question.onKeyDown && e.question.onKeyDown(...n))
     }, [
       d("label", {
-        class: m(e.question.getSwatchCss()),
-        style: F(e.question.getSwatchStyle())
+        class: _(e.question.getSwatchCss()),
+        style: A(e.question.getSwatchStyle())
       }, [
-        v(s(c), {
+        v(s(u), {
           is: "sv-svg-icon",
           iconName: e.question.cssClasses.swatchIcon,
           size: "auto"
@@ -1299,7 +1308,7 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
         d("input", {
           type: "color",
           disabled: e.question.isInputReadOnly,
-          class: m(e.question.cssClasses.colorInput),
+          class: _(e.question.cssClasses.colorInput),
           value: e.question.renderedColorValue,
           tabindex: "-1",
           onChange: o[0] || (o[0] = //@ts-ignore
@@ -1309,7 +1318,7 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
           "aria-label": e.question.a11y_input_ariaLabel,
           "aria-invalid": e.question.a11y_input_ariaInvalid,
           "aria-describedby": e.question.a11y_input_ariaDescribedBy
-        }, null, 42, lt)
+        }, null, 42, nt)
       ], 6),
       d("input", {
         autocomplete: "off",
@@ -1330,83 +1339,83 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
         onBeforeinput: o[4] || (o[4] = //@ts-ignore
         (...n) => e.question.onBeforeInput && e.question.onBeforeInput(...n)),
         value: e.question.renderedValue,
-        class: m(e.question.cssClasses.control)
-      }, null, 42, it),
-      e.question.showDropdownAction ? (a(), r(T, { key: 0 }, [
+        class: _(e.question.cssClasses.control)
+      }, null, 42, at),
+      e.question.showDropdownAction ? (a(), i(D, { key: 0 }, [
         d("div", {
           "aria-hidden": "true",
-          class: m(e.question.cssClasses.choicesButtonWrapper)
+          class: _(e.question.cssClasses.choicesButtonWrapper)
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-action-bar-item",
             item: e.question.dropdownAction
           }, null, 8, ["item"])
         ], 2),
-        v(s(c), {
+        v(s(u), {
           is: "sv-popup",
           model: e.question.dropdownAction.popupModel
         }, null, 8, ["model"])
       ], 64)) : p("", !0)
     ], 34));
   }
-}), dt = /* @__PURE__ */ g({
+}), it = /* @__PURE__ */ g({
   __name: "ColorItem",
   props: {
     model: {},
     item: {}
   },
-  setup(u) {
-    const t = u;
+  setup(c) {
+    const t = c;
     $(() => t.item);
     const e = () => ({ backgroundColor: t.item.value });
-    return (o, n) => (a(), r(T, null, [
+    return (o, n) => (a(), i(D, null, [
       d("span", {
         class: "spg-color-editor__color-swatch",
-        style: F(e())
+        style: A(e())
       }, null, 4),
-      v(s(c), {
+      v(s(u), {
         is: "survey-string",
         locString: o.item.locTitle
       }, null, 8, ["locString"])
     ], 64));
   }
-}), ct = ["disabled", "value", "placeholder"], ut = ["disabled", "id", "aria-required", "aria-label", "aria-invalid", "aria-describedby", "title", "accept"], pt = ["title", "disabled"], vt = ["for", "aria-label"], mt = /* @__PURE__ */ g({
+}), rt = ["disabled", "value", "placeholder"], dt = ["disabled", "id", "aria-required", "aria-label", "aria-invalid", "aria-describedby", "title", "accept"], ut = ["title", "disabled"], ct = ["for", "aria-label"], pt = /* @__PURE__ */ g({
   __name: "File",
   props: {
     question: {}
   },
-  setup(u) {
+  setup(c) {
     const t = P();
-    return Q(u, t), (o, n) => (a(), r("div", {
-      class: m(o.question.cssClasses.root),
+    return Q(c, t), (o, n) => (a(), i("div", {
+      class: _(o.question.cssClasses.root),
       onDragenter: n[5] || (n[5] = //@ts-ignore
-      (...i) => o.question.onDragEnter && o.question.onDragEnter(...i)),
+      (...r) => o.question.onDragEnter && o.question.onDragEnter(...r)),
       onDragover: n[6] || (n[6] = //@ts-ignore
-      (...i) => o.question.onDragOver && o.question.onDragOver(...i)),
+      (...r) => o.question.onDragOver && o.question.onDragOver(...r)),
       onDrop: n[7] || (n[7] = //@ts-ignore
-      (...i) => o.question.onDrop && o.question.onDrop(...i)),
+      (...r) => o.question.onDrop && o.question.onDrop(...r)),
       onDragleave: n[8] || (n[8] = //@ts-ignore
-      (...i) => o.question.onDragLeave && o.question.onDragLeave(...i)),
+      (...r) => o.question.onDragLeave && o.question.onDragLeave(...r)),
       onKeydown: n[9] || (n[9] = //@ts-ignore
-      (...i) => o.question.onKeyDown && o.question.onKeyDown(...i)),
+      (...r) => o.question.onKeyDown && o.question.onKeyDown(...r)),
       ref_key: "root",
       ref: t
     }, [
       d("input", {
         type: "text",
         disabled: o.question.isTextInputReadOnly,
-        class: m(o.question.cssClasses.control),
+        class: _(o.question.cssClasses.control),
         value: o.question.renderedValue || "",
         onChange: n[0] || (n[0] = //@ts-ignore
-        (...i) => o.question.onInputChange && o.question.onInputChange(...i)),
+        (...r) => o.question.onInputChange && o.question.onInputChange(...r)),
         onBlur: n[1] || (n[1] = //@ts-ignore
-        (...i) => o.question.onInputBlur && o.question.onInputBlur(...i)),
+        (...r) => o.question.onInputBlur && o.question.onInputBlur(...r)),
         placeholder: o.question.renderedPlaceholder
-      }, null, 42, ct),
+      }, null, 42, rt),
       d("input", {
         type: "file",
         disabled: o.question.isInputReadOnly,
-        class: m(o.question.cssClasses.fileInput),
+        class: _(o.question.cssClasses.fileInput),
         id: o.question.inputId,
         "aria-required": o.question.ariaRequired,
         "aria-label": o.question.ariaLabel,
@@ -1417,53 +1426,53 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
         tabindex: -1,
         accept: o.question.acceptedTypes,
         onChange: n[2] || (n[2] = //@ts-ignore
-        (...i) => o.question.onFileInputChange && o.question.onFileInputChange(...i))
-      }, null, 42, ut),
+        (...r) => o.question.onFileInputChange && o.question.onFileInputChange(...r))
+      }, null, 42, dt),
       d("div", {
-        class: m(o.question.cssClasses.buttonsContainer)
+        class: _(o.question.cssClasses.buttonsContainer)
       }, [
-        h((a(), r("button", {
+        h((a(), i("button", {
           title: o.question.clearButtonCaption,
-          class: m(o.question.cssClasses.clearButton),
+          class: _(o.question.cssClasses.clearButton),
           disabled: o.question.getIsClearButtonDisabled(),
           onClick: n[3] || (n[3] = //@ts-ignore
-          (...i) => o.question.doClean && o.question.doClean(...i))
+          (...r) => o.question.doClean && o.question.doClean(...r))
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             iconName: o.question.cssClasses.clearButtonIcon,
             size: "auto"
           }, null, 8, ["iconName"])
-        ], 10, pt)), [
+        ], 10, ut)), [
           [s(M)]
         ]),
-        h((a(), r("label", {
-          class: m(o.question.getChooseButtonCss()),
+        h((a(), i("label", {
+          class: _(o.question.getChooseButtonCss()),
           for: o.question.inputId,
           "aria-label": o.question.chooseButtonCaption,
           onClick: n[4] || (n[4] = //@ts-ignore
-          (...i) => o.question.chooseFiles && o.question.chooseFiles(...i))
+          (...r) => o.question.chooseFiles && o.question.chooseFiles(...r))
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             iconName: o.question.cssClasses.chooseButtonIcon,
             size: "auto",
             title: o.question.chooseButtonCaption
           }, null, 8, ["iconName", "title"])
-        ], 10, vt)), [
+        ], 10, ct)), [
           [s(M)]
         ])
       ], 2)
     ], 34));
   }
-}), _t = ["disabled", "id", "placeholder", "aria-required", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage", "value"], gt = ["disabled"], bt = ["disabled"], yt = /* @__PURE__ */ g({
+}), vt = ["disabled", "id", "placeholder", "aria-required", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage", "value"], mt = ["disabled"], _t = ["disabled"], gt = /* @__PURE__ */ g({
   __name: "SpinEditor",
   props: {
     question: {}
   },
-  setup(u) {
-    return Q(u, P()), (e, o) => (a(), r("div", {
-      class: m(e.question.cssClasses.root),
+  setup(c) {
+    return Q(c, P()), (e, o) => (a(), i("div", {
+      class: _(e.question.cssClasses.root),
       onKeydown: o[18] || (o[18] = //@ts-ignore
       (...n) => e.question.onKeyDown && e.question.onKeyDown(...n))
     }, [
@@ -1492,15 +1501,15 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
         onBeforeinput: o[5] || (o[5] = //@ts-ignore
         (...n) => e.question.onBeforeInput && e.question.onBeforeInput(...n)),
         value: e.question.renderedValue,
-        class: m(e.question.cssClasses.control)
-      }, null, 42, _t),
+        class: _(e.question.cssClasses.control)
+      }, null, 42, vt),
       d("span", {
-        class: m(e.question.cssClasses.buttonsContainer)
+        class: _(e.question.cssClasses.buttonsContainer)
       }, [
         d("button", {
           "aria-hidden": "true",
           disabled: e.question.isInputReadOnly,
-          class: m(e.question.cssClasses.arrowButton),
+          class: _(e.question.cssClasses.arrowButton),
           onClick: o[6] || (o[6] = //@ts-ignore
           (...n) => e.question.onDownButtonClick && e.question.onDownButtonClick(...n)),
           onMousedown: o[7] || (o[7] = //@ts-ignore
@@ -1515,16 +1524,16 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
           (...n) => e.question.onFocus && e.question.onFocus(...n)),
           tabindex: "-1"
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             iconName: e.question.cssClasses.decreaseButtonIcon,
             size: "auto"
           }, null, 8, ["iconName"])
-        ], 42, gt),
+        ], 42, mt),
         d("button", {
           "aria-hidden": "true",
           disabled: e.question.isInputReadOnly,
-          class: m(e.question.cssClasses.arrowButton),
+          class: _(e.question.cssClasses.arrowButton),
           onClick: o[12] || (o[12] = //@ts-ignore
           (...n) => e.question.onUpButtonClick && e.question.onUpButtonClick(...n)),
           onMousedown: o[13] || (o[13] = //@ts-ignore
@@ -1539,79 +1548,79 @@ const ot = /* @__PURE__ */ Xs(Ys, [["render", et]]), st = /* @__PURE__ */ g({
           (...n) => e.question.onFocus && e.question.onFocus(...n)),
           tabindex: "-1"
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             iconName: e.question.cssClasses.increaseButtonIcon,
             size: "auto"
           }, null, 8, ["iconName"])
-        ], 42, bt)
+        ], 42, _t)
       ], 2)
     ], 34));
   }
-}), ht = ["disabled", "title"], ne = /* @__PURE__ */ g({
+}), bt = ["disabled", "title"], ne = /* @__PURE__ */ g({
   __name: "TextWithReset",
   props: {
     question: {}
   },
-  setup(u) {
-    const t = u, e = () => "survey-" + t.question.wrappedQuestionTemplate;
+  setup(c) {
+    const t = c, e = () => "survey-" + t.question.wrappedQuestionTemplate;
     return Q(t, P()), $(() => {
       var o;
       return (o = t.question) == null ? void 0 : o.resetValueAdorner;
-    }), (o, n) => (a(), r("div", {
-      class: m(o.question.getRootClass())
+    }), (o, n) => (a(), i("div", {
+      class: _(o.question.getRootClass())
     }, [
-      v(s(c), {
+      v(s(u), {
         is: e(),
         question: o.question
       }, null, 8, ["is", "question"]),
       d("button", {
-        class: m(o.question.cssClasses.resetButton),
+        class: _(o.question.cssClasses.resetButton),
         disabled: o.question.resetValueAdorner.isDisabled,
         onClick: n[0] || (n[0] = //@ts-ignore
-        (...i) => o.question.resetValueAdorner.resetValue && o.question.resetValueAdorner.resetValue(...i)),
+        (...r) => o.question.resetValueAdorner.resetValue && o.question.resetValueAdorner.resetValue(...r)),
         title: o.question.resetValueAdorner.caption
       }, [
-        v(s(c), {
+        v(s(u), {
           is: "sv-svg-icon",
           iconName: o.question.cssClasses.resetButtonIcon,
           size: "auto"
         }, null, 8, ["iconName"])
-      ], 10, ht)
+      ], 10, bt)
     ], 2));
   }
-}), Ct = ["aria-checked", "aria-required", "aria-label", "aria-labelledby", "aria-invalid", "aria-errormessage"], qt = /* @__PURE__ */ d("div", { class: "spg-boolean-switch__thumb" }, [
+}), yt = ["aria-checked", "aria-required", "aria-label", "aria-labelledby", "aria-invalid", "aria-errormessage"], ht = /* @__PURE__ */ d("div", { class: "spg-boolean-switch__thumb" }, [
   /* @__PURE__ */ d("div", { class: "spg-boolean-switch__thumb-circle spg-boolean-switch__thumb--left" })
-], -1), ft = /* @__PURE__ */ d("div", { class: "spg-boolean-switch__thumb" }, [
+], -1), Ct = /* @__PURE__ */ d("div", { class: "spg-boolean-switch__thumb" }, [
   /* @__PURE__ */ d("div", { class: "spg-boolean-switch__thumb-circle spg-boolean-switch__thumb--right" })
-], -1), kt = [
-  qt,
-  ft
-], $t = { class: "spg-boolean-switch__caption" }, wt = ["id"];
-ue.Instance.registerRenderer(
+], -1), qt = [
+  ht,
+  Ct
+], ft = { class: "spg-boolean-switch__caption" }, kt = ["id"];
+ce.Instance.registerRenderer(
   "boolean",
   "switch",
   "sv-boolean-switch"
 );
-const Tt = /* @__PURE__ */ g({
+const $t = /* @__PURE__ */ g({
   inheritAttrs: !1,
   __name: "BooleanSwitch",
   props: {
     question: {}
   },
-  setup(u) {
-    const t = u, e = P(null);
+  setup(c) {
+    const t = c, e = P(null);
     Q(t, e);
-    const o = k({
+    const o = f({
       get() {
         return t.question.booleanValue;
       },
       set(n) {
-        const i = t.question;
-        i.booleanValue = n;
+        const r = t.question;
+        r.booleanValue = n;
       }
     });
-    return (n, i) => (a(), r("div", {
+    return (n, r) => (a(), i("div", {
       class: "spg-boolean-switch",
       role: "checkbox",
       "aria-checked": n.question.booleanValue || !1,
@@ -1620,37 +1629,37 @@ const Tt = /* @__PURE__ */ g({
       "aria-labelledby": n.question.a11y_input_ariaLabelledBy,
       "aria-invalid": n.question.a11y_input_ariaInvalid,
       "aria-errormessage": n.question.a11y_input_ariaErrormessage,
-      onClick: i[0] || (i[0] = (l) => o.value = !o.value)
+      onClick: r[0] || (r[0] = (l) => o.value = !o.value)
     }, [
-      h((a(), r("div", {
-        class: m(["spg-boolean-switch__button", n.question.value ? "spg-boolean-switch__button--checked" : ""]),
+      h((a(), i("div", {
+        class: _(["spg-boolean-switch__button", n.question.value ? "spg-boolean-switch__button--checked" : ""]),
         tabindex: "0"
-      }, kt, 2)), [
+      }, qt, 2)), [
         [s(M), { disableTabStop: !0 }]
       ]),
-      d("div", $t, [
+      d("div", ft, [
         d("div", {
           class: "spg-boolean-switch__title",
           id: n.question.labelRenderedAriaID
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "survey-string",
             locString: n.question.locTitle
           }, null, 8, ["locString"])
-        ], 8, wt)
+        ], 8, kt)
       ])
-    ], 8, Ct));
+    ], 8, yt));
   }
-}), Dt = { class: "svc-string-editor__content" }, Nt = /* @__PURE__ */ d("div", { class: "svc-string-editor__border svc-string-editor__border--hover" }, null, -1), Mt = /* @__PURE__ */ d("div", { class: "svc-string-editor__border svc-string-editor__border--focus" }, null, -1), St = { class: "svc-string-editor__input" }, It = ["textContent", "aria-placeholder", "aria-label", "contenteditable", "tabindex"], Bt = ["aria-placeholder", "aria-label", "contenteditable", "tabindex", "innerHTML"], Et = {
+}), wt = { class: "svc-string-editor__content" }, Tt = /* @__PURE__ */ d("div", { class: "svc-string-editor__border svc-string-editor__border--hover" }, null, -1), Dt = /* @__PURE__ */ d("div", { class: "svc-string-editor__border svc-string-editor__border--focus" }, null, -1), Nt = { class: "svc-string-editor__input" }, Mt = ["textContent", "aria-placeholder", "aria-label", "contenteditable", "tabindex"], St = ["aria-placeholder", "aria-label", "contenteditable", "tabindex", "innerHTML"], It = {
   key: 0,
   class: "svc-string-editor__error"
-}, Pt = /* @__PURE__ */ g({
+}, Bt = /* @__PURE__ */ g({
   __name: "StringEditor",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.model.locStr), o = k(() => t.model.creator), n = P(), i = P(), l = z(
+  setup(c) {
+    const t = c, e = f(() => t.model.locStr), o = f(() => t.model.creator), n = P(), r = P(), l = z(
       () => {
         const y = new Ce(
           e.value,
@@ -1664,49 +1673,49 @@ const Tt = /* @__PURE__ */ g({
       (y) => {
         y && (y.blurEditor = void 0, y.getEditorElement = void 0, y.dispose());
       }
-    ), _ = k(() => {
+    ), m = f(() => {
       var y;
       return (y = l.value) == null ? void 0 : y.errorText;
-    }), N = k(() => {
+    }), w = f(() => {
       var y;
       return (y = l.value) == null ? void 0 : y.className(e.value.renderedHtml);
-    }), f = k(() => {
+    }), k = f(() => {
       var y;
       return (y = l.value) == null ? void 0 : y.placeholder;
-    }), q = k(() => {
+    }), q = f(() => {
       var y;
       return (y = l.value) == null ? void 0 : y.contentEditable;
-    }), C = k(() => {
+    }), C = f(() => {
       var y;
       return (y = l.value) == null ? void 0 : y.characterCounter;
-    }), B = k(
+    }), B = f(
       () => {
         var y;
         return (y = l.value) == null ? void 0 : y.showCharacterCounter;
       }
-    ), L = k(
+    ), F = f(
       () => {
         var y;
         return (y = l.value) == null ? void 0 : y.getCharacterCounterClass;
       }
     ), J = (y) => {
-      var D, E;
-      return n.value && (n.value.spellcheck = !1), e.value.__isEditing = !1, (D = l.value) == null || D.onBlur(y), (E = l.value) == null ? void 0 : E.errorText;
-    }, U = (y) => {
-      var D;
-      (D = l.value) == null || D.onFocus(y);
+      var N, E;
+      return n.value && (n.value.spellcheck = !1), e.value.__isEditing = !1, (N = l.value) == null || N.onBlur(y), (E = l.value) == null ? void 0 : E.errorText;
+    }, H = (y) => {
+      var N;
+      (N = l.value) == null || N.onFocus(y);
     }, ve = (y) => {
-      var D;
-      (D = l.value) == null || D.onPaste(y);
+      var N;
+      (N = l.value) == null || N.onPaste(y);
     }, se = (y) => {
-      var D, E;
-      (D = n.value) == null || D.focus(), e.value.__isEditing = !0, (E = l.value) == null || E.onClick(y);
+      var N, E;
+      (N = n.value) == null || N.focus(), e.value.__isEditing = !0, (E = l.value) == null || E.onClick(y);
     }, Z = () => {
-      i.value = e.value.renderedHtml;
+      r.value = e.value.renderedHtml;
     }, me = W(
       () => e.value,
-      (y, D) => {
-        D && y.onStringChanged.remove(Z), y && (y.onStringChanged.add(Z), Z());
+      (y, N) => {
+        N && y.onStringChanged.remove(Z), y && (y.onStringChanged.add(Z), Z());
       },
       {
         immediate: !0
@@ -1717,181 +1726,181 @@ const Tt = /* @__PURE__ */ g({
       e.value.__isEditing && ((y = n.value) == null || y.focus());
     }), K(() => {
       me(), e.value.onStringChanged.remove(Z);
-    }), (y, D) => (a(), r("span", {
-      class: m(N.value)
+    }), (y, N) => (a(), i("span", {
+      class: _(w.value)
     }, [
-      d("span", Dt, [
-        Nt,
-        Mt,
-        d("span", St, [
-          e.value.hasHtml ? p("", !0) : (a(), r("span", {
+      d("span", wt, [
+        Tt,
+        Dt,
+        d("span", Nt, [
+          e.value.hasHtml ? p("", !0) : (a(), i("span", {
             key: 0,
             role: "textbox",
             class: "sv-string-editor",
             spellcheck: "false",
-            onFocus: U,
+            onFocus: H,
             onPaste: ve,
             onBlur: J,
-            onInput: D[0] || (D[0] = //@ts-ignore
+            onInput: N[0] || (N[0] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onInput) && ((I = s(l)) == null ? void 0 : I.onInput(...E));
             }),
-            onBeforeinput: D[1] || (D[1] = //@ts-ignore
+            onBeforeinput: N[1] || (N[1] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onBeforeInput) && ((I = s(l)) == null ? void 0 : I.onBeforeInput(...E));
             }),
-            onKeydown: D[2] || (D[2] = //@ts-ignore
+            onKeydown: N[2] || (N[2] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onKeyDown) && ((I = s(l)) == null ? void 0 : I.onKeyDown(...E));
             }),
-            onKeyup: D[3] || (D[3] = //@ts-ignore
+            onKeyup: N[3] || (N[3] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onKeyUp) && ((I = s(l)) == null ? void 0 : I.onKeyUp(...E));
             }),
-            onCompositionstart: D[4] || (D[4] = //@ts-ignore
+            onCompositionstart: N[4] || (N[4] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onCompositionStart) && ((I = s(l)) == null ? void 0 : I.onCompositionStart(...E));
             }),
-            onCompositionend: D[5] || (D[5] = //@ts-ignore
+            onCompositionend: N[5] || (N[5] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onCompositionEnd) && ((I = s(l)) == null ? void 0 : I.onCompositionEnd(...E));
             }),
-            onMouseup: D[6] || (D[6] = //@ts-ignore
+            onMouseup: N[6] || (N[6] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onMouseUp) && ((I = s(l)) == null ? void 0 : I.onMouseUp(...E));
             }),
             onClick: se,
-            textContent: i.value,
-            "aria-placeholder": f.value,
-            "aria-label": f.value || "content editable",
+            textContent: r.value,
+            "aria-placeholder": k.value,
+            "aria-label": k.value || "content editable",
             contenteditable: q.value,
             tabindex: s(l).tabIndex,
             ref_key: "root",
             ref: n
-          }, null, 40, It)),
-          e.value.hasHtml ? (a(), r("span", {
+          }, null, 40, Mt)),
+          e.value.hasHtml ? (a(), i("span", {
             key: 1,
             role: "textbox",
             class: "sv-string-editor sv-string-editor--html",
             spellcheck: "false",
-            onFocus: U,
+            onFocus: H,
             onBlur: J,
-            onKeydown: D[7] || (D[7] = //@ts-ignore
+            onKeydown: N[7] || (N[7] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onKeyDown) && ((I = s(l)) == null ? void 0 : I.onKeyDown(...E));
             }),
-            onKeyup: D[8] || (D[8] = //@ts-ignore
+            onKeyup: N[8] || (N[8] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onKeyUp) && ((I = s(l)) == null ? void 0 : I.onKeyUp(...E));
             }),
-            onCompositionstart: D[9] || (D[9] = //@ts-ignore
+            onCompositionstart: N[9] || (N[9] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onCompositionStart) && ((I = s(l)) == null ? void 0 : I.onCompositionStart(...E));
             }),
-            onCompositionend: D[10] || (D[10] = //@ts-ignore
+            onCompositionend: N[10] || (N[10] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onCompositionEnd) && ((I = s(l)) == null ? void 0 : I.onCompositionEnd(...E));
             }),
-            onMouseup: D[11] || (D[11] = //@ts-ignore
+            onMouseup: N[11] || (N[11] = //@ts-ignore
             (...E) => {
               var S, I;
               return ((S = s(l)) == null ? void 0 : S.onMouseUp) && ((I = s(l)) == null ? void 0 : I.onMouseUp(...E));
             }),
             onClick: se,
-            "aria-placeholder": f.value,
-            "aria-label": f.value || "content editable",
+            "aria-placeholder": k.value,
+            "aria-label": k.value || "content editable",
             contenteditable: q.value,
             tabindex: s(l).tabIndex,
-            innerHTML: i.value,
+            innerHTML: r.value,
             ref_key: "root",
             ref: n
-          }, null, 40, Bt)) : p("", !0),
-          B.value ? (a(), b(s(c), {
+          }, null, 40, St)) : p("", !0),
+          B.value ? (a(), b(s(u), {
             key: 2,
             is: "sv-character-counter",
             counter: C.value,
-            remainingCharacterCounter: L.value
+            remainingCharacterCounter: F.value
           }, null, 8, ["counter", "remainingCharacterCounter"])) : p("", !0)
         ])
       ]),
-      _.value ? (a(), r("span", Et, w(_.value), 1)) : p("", !0)
+      m.value ? (a(), i("span", It, T(m.value), 1)) : p("", !0)
     ], 2));
   }
-}), Rt = {
+}), Et = {
   key: 0,
   class: "svc-toolbox__search-container"
-}, Vt = /* @__PURE__ */ d("div", { class: "svc-toolbox__category-separator svc-toolbox__category-separator--search" }, null, -1), At = {
+}, Pt = /* @__PURE__ */ d("div", { class: "svc-toolbox__category-separator svc-toolbox__category-separator--search" }, null, -1), Rt = {
   key: 1,
   class: "svc-toolbox__placeholder"
-}, zt = {
+}, Vt = {
   key: 1,
   class: "svc-toolbox__category"
-}, Lt = /* @__PURE__ */ g({
+}, At = /* @__PURE__ */ g({
   __name: "AdaptiveToolbox",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.model.toolbox), o = P();
-    $(() => e.value), G(() => {
+  setup(c) {
+    const t = c, e = f(() => t.model.toolbox), o = P();
+    $(() => e.value), O(() => {
       e.value.afterRender(o.value);
     }), R(() => {
       e.value.afterRender(o.value);
     }), K(() => {
       e.value.beforeDestroy();
     });
-    const n = k(() => e.value.renderedActions);
-    return (i, l) => (a(), r("div", {
-      class: m(e.value.classNames),
+    const n = f(() => e.value.renderedActions);
+    return (r, l) => (a(), i("div", {
+      class: _(e.value.classNames),
       ref_key: "root",
       ref: o,
-      style: F(e.value.getRootStyle())
+      style: A(e.value.getRootStyle())
     }, [
       d("div", {
-        onFocusout: l[0] || (l[0] = (_) => e.value.focusOut(_)),
+        onFocusout: l[0] || (l[0] = (m) => e.value.focusOut(m)),
         class: "svc-toolbox__panel"
       }, [
-        e.value.showSearch ? (a(), r("div", Rt, [
-          e.value.isCompactRendered ? (a(), b(s(c), {
+        e.value.showSearch ? (a(), i("div", Et, [
+          e.value.isCompactRendered ? (a(), b(s(u), {
             is: "svc-toolbox-tool",
-            creator: i.model,
+            creator: r.model,
             key: "searchitem",
             item: e.value.searchItem,
             parentModel: e.value,
             isCompact: e.value.isCompactRendered
           }, null, 8, ["creator", "item", "parentModel", "isCompact"])) : p("", !0),
-          v(s(c), {
+          v(s(u), {
             is: "svc-search",
             model: e.value.searchManager
           }, null, 8, ["model"]),
-          Vt
+          Pt
         ])) : p("", !0),
-        e.value.showPlaceholder ? (a(), r("div", At, w(e.value.toolboxNoResultsFound), 1)) : p("", !0),
-        v(s(c), { is: "sv-scroll" }, {
+        e.value.showPlaceholder ? (a(), i("div", Rt, T(e.value.toolboxNoResultsFound), 1)) : p("", !0),
+        v(s(u), { is: "sv-scroll" }, {
           default: X(() => [
-            e.value.showInSingleCategory ? p("", !0) : (a(!0), r(T, { key: 0 }, A(e.value.categories, (_, N) => (a(), b(s(c), {
+            e.value.showInSingleCategory ? p("", !0) : (a(!0), i(D, { key: 0 }, L(e.value.categories, (m, w) => (a(), b(s(u), {
               is: "svc-toolbox-category",
-              key: N,
-              category: _,
+              key: w,
+              category: m,
               toolbox: e.value
             }, null, 8, ["category", "toolbox"]))), 128)),
-            e.value.showInSingleCategory ? (a(), r("div", zt, [
-              (a(!0), r(T, null, A(n.value, (_) => (a(), b(s(c), {
-                key: _.renderedId,
+            e.value.showInSingleCategory ? (a(), i("div", Vt, [
+              (a(!0), i(D, null, L(n.value, (m) => (a(), b(s(u), {
+                key: m.renderedId,
                 is: "svc-toolbox-tool",
-                creator: i.model,
-                item: _,
+                creator: r.model,
+                item: m,
                 parentModel: e.value,
                 isCompact: e.value.isCompactRendered
               }, null, 8, ["creator", "item", "parentModel", "isCompact"]))), 128))
@@ -1902,10 +1911,10 @@ const Tt = /* @__PURE__ */ g({
       ], 32)
     ], 6));
   }
-}), Ft = {
+}), Lt = {
   key: 0,
   class: "svc-toolbox__category-separator"
-}, Kt = /* @__PURE__ */ g({
+}, zt = /* @__PURE__ */ g({
   __name: "ToolboxTool",
   props: {
     creator: {},
@@ -1913,8 +1922,8 @@ const Tt = /* @__PURE__ */ g({
     parentModel: {},
     isCompact: { type: Boolean }
   },
-  setup(u) {
-    const t = u, e = z(
+  setup(c) {
+    const t = c, e = z(
       () => new qe(
         t.item,
         t.creator,
@@ -1927,29 +1936,29 @@ const Tt = /* @__PURE__ */ g({
     ), o = P();
     return R(() => {
       const n = t.item;
-      n.updateModeCallback = (i, l) => {
-        n.mode = i, re(() => l(i, o.value));
+      n.updateModeCallback = (r, l) => {
+        n.mode = r, re(() => l(r, o.value));
       }, n.afterRender();
     }), K(() => {
       const n = t.item;
       n.updateModeCallback = void 0;
-    }), $(() => t.item), (n, i) => {
+    }), $(() => t.item), (n, r) => {
       var l;
-      return a(), r("div", {
-        class: m(n.item.css),
+      return a(), i("div", {
+        class: _(n.item.css),
         ref_key: "root",
         ref: o
       }, [
-        n.item.needSeparator && !n.creator.toolbox.showCategoryTitles ? (a(), r("div", Ft)) : p("", !0),
+        n.item.needSeparator && !n.creator.toolbox.showCategoryTitles ? (a(), i("div", Lt)) : p("", !0),
         d("div", {
           class: "svc-toolbox__tool-content sv-action__content",
-          onPointerdown: i[0] || (i[0] = //@ts-ignore
-          (..._) => {
-            var N, f;
-            return ((N = s(e)) == null ? void 0 : N.onPointerDown) && ((f = s(e)) == null ? void 0 : f.onPointerDown(..._));
+          onPointerdown: r[0] || (r[0] = //@ts-ignore
+          (...m) => {
+            var w, k;
+            return ((w = s(e)) == null ? void 0 : w.onPointerDown) && ((k = s(e)) == null ? void 0 : k.onPointerDown(...m));
           })
         }, [
-          v(s(c), {
+          v(s(u), {
             viewModel: s(e),
             is: (l = s(e)) == null ? void 0 : l.itemComponent,
             item: n.item,
@@ -1960,10 +1969,10 @@ const Tt = /* @__PURE__ */ g({
       ], 2);
     };
   }
-}), Ut = ["aria-label", "title"], Ht = { class: "svc-toolbox__item-container" }, Qt = {
+}), Ft = ["aria-label", "title"], Kt = { class: "svc-toolbox__item-container" }, Ht = {
   key: 0,
   class: "svc-toolbox__item-title"
-}, Ot = /* @__PURE__ */ g({
+}, Ut = /* @__PURE__ */ g({
   __name: "ToolboxItem",
   props: {
     creator: {},
@@ -1971,17 +1980,17 @@ const Tt = /* @__PURE__ */ g({
     isCompact: { type: Boolean },
     viewModel: {}
   },
-  setup(u) {
-    return (t, e) => (a(), r(T, null, [
-      h((a(), r("div", {
-        class: m(["svc-toolbox__item", t.item.renderedCss]),
+  setup(c) {
+    return (t, e) => (a(), i(D, null, [
+      h((a(), i("div", {
+        class: _(["svc-toolbox__item", t.item.renderedCss]),
         role: "button",
         "aria-label": t.item.getTooltip(),
         title: t.item.getTooltip(),
         onClick: e[0] || (e[0] = (o) => t.viewModel.click(o))
       }, [
-        d("span", Ht, [
-          t.item.iconName ? (a(), b(s(c), {
+        d("span", Kt, [
+          t.item.iconName ? (a(), b(s(u), {
             key: 0,
             is: "sv-svg-icon",
             iconName: t.item.iconName,
@@ -1989,26 +1998,26 @@ const Tt = /* @__PURE__ */ g({
             class: "svc-toolbox__item-icon"
           }, null, 8, ["iconName"])) : p("", !0)
         ]),
-        t.isCompact ? p("", !0) : (a(), r("span", Qt, w(t.item.title), 1))
-      ], 10, Ut)), [
+        t.isCompact ? p("", !0) : (a(), i("span", Ht, T(t.item.title), 1))
+      ], 10, Ft)), [
         [s(M), { disableTabStop: !t.viewModel.toolboxItem.enabled }]
       ]),
-      t.isCompact ? (a(), r("span", {
+      t.isCompact ? (a(), i("span", {
         key: 0,
         class: "svc-toolbox__item-banner",
         onClick: e[1] || (e[1] = (o) => t.viewModel.click(o))
       }, [
-        v(s(c), {
+        v(s(u), {
           is: "sv-svg-icon",
           iconName: t.item.iconName,
           size: 24,
           class: "svc-toolbox__item-icon"
         }, null, 8, ["iconName"]),
-        d("span", null, w(t.item.title), 1)
+        d("span", null, T(t.item.title), 1)
       ])) : p("", !0)
     ], 64));
   }
-}), Gt = /* @__PURE__ */ g({
+}), Qt = /* @__PURE__ */ g({
   __name: "ToolboxItemGroup",
   props: {
     creator: {},
@@ -2016,14 +2025,14 @@ const Tt = /* @__PURE__ */ g({
     isCompact: { type: Boolean },
     viewModel: {}
   },
-  setup(u) {
-    const t = u, e = (n) => {
+  setup(c) {
+    const t = c, e = (n) => {
       t.viewModel.onMouseOver(t.item, n);
     }, o = (n) => {
       t.viewModel.onMouseLeave(t.item, n);
     };
-    return (n, i) => (a(), r(T, null, [
-      v(s(c), {
+    return (n, r) => (a(), i(D, null, [
+      v(s(u), {
         is: "svc-toolbox-item",
         viewModel: n.viewModel,
         item: n.item,
@@ -2035,53 +2044,53 @@ const Tt = /* @__PURE__ */ g({
         onMouseover: e,
         onMouseleave: o
       }, [
-        v(s(c), {
+        v(s(u), {
           is: "sv-svg-icon",
           iconName: n.item.subitemsButtonIcon,
           size: "auto"
         }, null, 8, ["iconName"]),
-        v(s(c), {
+        v(s(u), {
           is: "sv-popup",
           model: n.item.popupModel
         }, null, 8, ["model"])
       ], 32)
     ], 64));
   }
-}), Wt = { className: "svc-toolbox__category-header-wrapper" }, jt = { class: "svc-toolbox__category-title" }, Jt = {
+}), Ot = { className: "svc-toolbox__category-header-wrapper" }, Gt = { class: "svc-toolbox__category-title" }, Wt = {
   key: 0,
   class: "svc-toolbox__category-header__controls"
-}, Zt = /* @__PURE__ */ g({
+}, jt = /* @__PURE__ */ g({
   __name: "ToolboxCategory",
   props: {
     category: {},
     toolbox: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.category), (e, o) => (a(), r("div", {
-      class: m(["svc-toolbox__category", {
+  setup(c) {
+    const t = c;
+    return $(() => t.category), (e, o) => (a(), i("div", {
+      class: _(["svc-toolbox__category", {
         "svc-toolbox__category--collapsed": e.category.collapsed,
         "svc-toolbox__category--empty": e.category.empty
       }])
     }, [
-      d("div", Wt, [
-        h((a(), r("div", {
-          class: m(["svc-toolbox__category-header", {
+      d("div", Ot, [
+        h((a(), i("div", {
+          class: _(["svc-toolbox__category-header", {
             "svc-toolbox__category-header--collapsed": e.toolbox.canCollapseCategories
           }]),
           onClick: o[0] || (o[0] = (n) => e.category.toggleState())
         }, [
-          d("span", jt, [
-            v(s(c), {
+          d("span", Gt, [
+            v(s(u), {
               is: "survey-string",
               locString: e.category.locTitle
             }, null, 8, ["locString"])
           ]),
-          e.toolbox.canCollapseCategories ? (a(), r("div", Jt, [
-            v(s(c), {
+          e.toolbox.canCollapseCategories ? (a(), i("div", Wt, [
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: e.category.iconName,
-              class: m(e.category.iconClassName),
+              class: _(e.category.iconClassName),
               size: "auto"
             }, null, 8, ["iconName", "class"])
           ])) : p("", !0)
@@ -2089,7 +2098,7 @@ const Tt = /* @__PURE__ */ g({
           [s(M)]
         ])
       ]),
-      (a(!0), r(T, null, A(e.category.items, (n) => (a(), b(s(c), {
+      (a(!0), i(D, null, L(e.category.items, (n) => (a(), b(s(u), {
         is: "svc-toolbox-tool",
         item: n,
         key: n.renderedId,
@@ -2099,19 +2108,19 @@ const Tt = /* @__PURE__ */ g({
       }, null, 8, ["item", "creator", "parentModel"]))), 128))
     ], 2));
   }
-}), Xt = /* @__PURE__ */ g({
+}), Jt = /* @__PURE__ */ g({
   __name: "ToolboxList",
   props: {
     model: {},
     creator: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.model), (e, o) => (a(), r("div", {
-      class: m(e.model.cssClasses.root)
+  setup(c) {
+    const t = c;
+    return $(() => t.model), (e, o) => (a(), i("div", {
+      class: _(e.model.cssClasses.root)
     }, [
-      (a(!0), r(T, null, A(e.model.renderedActions, (n, i) => (a(), b(s(c), {
-        key: i,
+      (a(!0), i(D, null, L(e.model.renderedActions, (n, r) => (a(), b(s(u), {
+        key: r,
         is: "svc-toolbox-tool",
         creator: e.creator,
         item: n,
@@ -2120,65 +2129,65 @@ const Tt = /* @__PURE__ */ g({
       }, null, 8, ["creator", "item", "parentModel"]))), 128))
     ], 2));
   }
-}), Yt = { class: "svc-flex-column" }, xt = { class: "svc-tab-designer_content" }, en = {
+}), Zt = { class: "svc-flex-column" }, Xt = { class: "svc-tab-designer_content" }, Yt = {
   key: 0,
   class: "svc-designer-header"
-}, on = {
+}, xt = {
   class: "svc-designer__placeholder-container",
   "data-sv-drop-target-survey-element": "newGhostPage"
-}, sn = {
+}, en = {
   className: "svc-designer-placeholder-page",
   "data-sv-drop-target-survey-element": "newGhostPage"
-}, tn = {
+}, on = {
   key: 0,
   class: "svc-designer-header"
-}, nn = ["data-sv-drop-target-survey-element", "data-sv-drop-target-page"], an = ["data-sv-drop-target-survey-element", "data-sv-drop-target-page"], ln = {
+}, sn = ["data-sv-drop-target-survey-element", "data-sv-drop-target-page"], tn = ["data-sv-drop-target-survey-element", "data-sv-drop-target-page"], nn = {
   key: 0,
   class: "svc-tab-designer__tools"
-}, rn = {
+}, an = {
   key: 0,
   class: "svc-tab-designer__page-navigator"
-}, dn = {
+}, ln = {
   key: 1,
   class: "svc-tab-designer__toolbar"
-}, cn = /* @__PURE__ */ g({
+}, rn = /* @__PURE__ */ g({
   __name: "Designer",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.model.survey);
-    return $(() => t.model), $(() => e.value), $(() => t.model.pagesController), (o, n) => (a(), r(T, null, [
-      d("div", Yt, [
-        o.model.isToolboxVisible ? (a(), b(s(c), {
+  setup(c) {
+    const t = c, e = f(() => t.model.survey);
+    return $(() => t.model), $(() => e.value), $(() => t.model.pagesController), (o, n) => (a(), i(D, null, [
+      d("div", Zt, [
+        o.model.isToolboxVisible ? (a(), b(s(u), {
           key: 0,
           is: "svc-toolbox",
           model: o.model.creator
         }, null, 8, ["model"])) : p("", !0)
       ]),
       d("div", {
-        class: m(["svc-tab-designer", o.model.getRootCss()]),
+        class: _(["svc-tab-designer", o.model.getRootCss()]),
         onClick: n[0] || (n[0] = //@ts-ignore
-        (...i) => o.model.clickDesigner && o.model.clickDesigner(...i))
+        (...r) => o.model.clickDesigner && o.model.clickDesigner(...r))
       }, [
-        v(s(c), { is: "sv-scroll" }, {
+        v(s(u), { is: "sv-scroll" }, {
           default: X(() => [
-            d("div", xt, [
-              o.model.showPlaceholder ? (a(), r(T, { key: 0 }, [
-                o.model.creator.showHeaderInEmptySurvey && o.model.creator.showSurveyHeader ? (a(), r("div", en, [
-                  v(s(c), {
+            d("div", Xt, [
+              o.model.showPlaceholder ? (a(), i(D, { key: 0 }, [
+                o.model.creator.showHeaderInEmptySurvey && o.model.creator.showSurveyHeader ? (a(), i("div", Yt, [
+                  v(s(u), {
                     is: "survey-header",
                     survey: o.model.creator.survey
                   }, null, 8, ["survey"])
                 ])) : p("", !0),
-                d("div", on, [
+                d("div", xt, [
                   v(j, {
                     name: "designer",
                     placeholderTitleText: o.model.placeholderTitleText,
                     placeholderDescriptionText: o.model.placeholderDescriptionText
                   }, null, 8, ["placeholderTitleText", "placeholderDescriptionText"]),
-                  d("div", sn, [
-                    v(s(c), {
+                  d("div", en, [
+                    v(s(u), {
                       is: "svc-page",
                       survey: o.model.creator.survey,
                       creator: o.model.creator,
@@ -2188,58 +2197,58 @@ const Tt = /* @__PURE__ */ g({
                   ])
                 ])
               ], 64)) : p("", !0),
-              o.model.showPlaceholder ? p("", !0) : (a(), r(T, { key: 1 }, [
+              o.model.showPlaceholder ? p("", !0) : (a(), i(D, { key: 1 }, [
                 d("div", {
-                  class: m(o.model.designerCss),
-                  style: F([
+                  class: _(o.model.designerCss),
+                  style: A([
                     { maxWidth: o.model.survey.renderedWidth },
                     o.model.surfaceCssVariables
                   ])
                 }, [
-                  o.model.creator.showSurveyHeader ? (a(), r("div", tn, [
-                    v(s(c), {
+                  o.model.creator.showSurveyHeader ? (a(), i("div", on, [
+                    v(s(u), {
                       is: "survey-header",
                       survey: o.model.creator.survey
                     }, null, 8, ["survey"])
                   ])) : p("", !0),
-                  o.model.creator.pageEditMode !== "bypage" ? (a(!0), r(T, { key: 1 }, A(o.model.pages, (i) => (a(), r("div", {
-                    key: i.id,
+                  o.model.creator.pageEditMode !== "bypage" ? (a(!0), i(D, { key: 1 }, L(o.model.pages, (r) => (a(), i("div", {
+                    key: r.id,
                     class: "svc-page",
-                    "data-sv-drop-target-survey-element": i != o.model.newPage ? i.name : "newGhostPage",
-                    "data-sv-drop-target-page": i.name
+                    "data-sv-drop-target-survey-element": r != o.model.newPage ? r.name : "newGhostPage",
+                    "data-sv-drop-target-page": r.name
                   }, [
-                    v(s(c), {
+                    v(s(u), {
                       is: "svc-page",
                       survey: o.model.creator.survey,
                       creator: o.model.creator,
-                      page: i,
-                      isGhost: i == o.model.newPage
+                      page: r,
+                      isGhost: r == o.model.newPage
                     }, null, 8, ["survey", "creator", "page", "isGhost"])
-                  ], 8, nn))), 128)) : p("", !0),
-                  o.model.pagesController.page2Display && o.model.creator.pageEditMode === "bypage" ? (a(), r("div", {
+                  ], 8, sn))), 128)) : p("", !0),
+                  o.model.pagesController.page2Display && o.model.creator.pageEditMode === "bypage" ? (a(), i("div", {
                     key: 2,
                     class: "svc-page",
                     "data-sv-drop-target-survey-element": o.model.displayPageDropTarget,
                     "data-sv-drop-target-page": o.model.pagesController.page2Display.name
                   }, [
-                    v(s(c), {
+                    v(s(u), {
                       is: "svc-page",
                       page: o.model.pagesController.page2Display,
                       creator: o.model.creator,
                       isGhost: o.model.pagesController.page2Display == o.model.newPage
                     }, null, 8, ["page", "creator", "isGhost"])
-                  ], 8, an)) : p("", !0)
+                  ], 8, tn)) : p("", !0)
                 ], 6),
-                o.model.showSurfaceTools ? (a(), r("div", ln, [
-                  o.model.creator.showPageNavigator ? (a(), r("div", rn, [
-                    v(s(c), {
+                o.model.showSurfaceTools ? (a(), i("div", nn, [
+                  o.model.creator.showPageNavigator ? (a(), i("div", an, [
+                    v(s(u), {
                       is: "svc-page-navigator",
                       pagesController: o.model.pagesController,
                       pageEditMode: o.model.creator.pageEditMode
                     }, null, 8, ["pagesController", "pageEditMode"])
                   ])) : p("", !0),
-                  o.model.showSurfaceToolbar ? (a(), r("div", dn, [
-                    v(s(c), {
+                  o.model.showSurfaceToolbar ? (a(), i("div", ln, [
+                    v(s(u), {
                       is: "sv-action-bar",
                       model: o.model.surfaceToolbar
                     }, null, 8, ["model"])
@@ -2253,16 +2262,16 @@ const Tt = /* @__PURE__ */ g({
       ], 2)
     ], 64));
   }
-}), un = ["id", "data-sv-drop-target-survey-page"], pn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), vn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), mn = {
+}), dn = ["id", "data-sv-drop-target-survey-page"], un = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), cn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), pn = {
   key: 1,
   class: "svc-page__loading-content"
-}, _n = {
+}, vn = {
   key: 2,
   class: "svc-page__placeholder_frame"
-}, gn = { class: "svc-panel__placeholder_frame" }, bn = { class: "svc-panel__placeholder" }, yn = { class: "svc-page__content-actions" }, hn = {
+}, mn = { class: "svc-panel__placeholder_frame" }, _n = { class: "svc-panel__placeholder" }, gn = { class: "svc-page__content-actions" }, bn = {
   key: 4,
   class: "svc-page__content-actions"
-}, Cn = /* @__PURE__ */ g({
+}, yn = /* @__PURE__ */ g({
   __name: "Page",
   props: {
     creator: {},
@@ -2270,15 +2279,15 @@ const Tt = /* @__PURE__ */ g({
     page: {},
     isGhost: { type: Boolean }
   },
-  setup(u) {
-    const t = u, e = P(), o = z(
+  setup(c) {
+    const t = c, e = P(), o = z(
       () => {
-        const i = new fe(t.creator, t.page);
-        return i.isGhost = t.isGhost, i;
+        const r = new fe(t.creator, t.page);
+        return r.isGhost = t.isGhost, r;
       },
       [() => t.page],
-      (i) => {
-        i.dispose();
+      (r) => {
+        r.dispose();
       }
     );
     W(
@@ -2286,50 +2295,50 @@ const Tt = /* @__PURE__ */ g({
       () => {
         o.value && (o.value.isGhost = t.isGhost);
       }
-    ), G(() => {
+    ), O(() => {
       e.value && o.value && (o.value.rootElement = e.value);
     }), R(() => {
       e.value && o.value && o.value.setRootElement(e.value);
     });
-    const n = (i) => {
-      o.value.hover(i, i.currentTarget);
+    const n = (r) => {
+      o.value.hover(r, r.currentTarget);
     };
-    return (i, l) => s(o).page ? h((a(), r("div", {
+    return (r, l) => s(o).page ? h((a(), i("div", {
       key: s(o).page.id,
       id: s(o).page.id,
-      class: m(["svc-page__content", s(o).css]),
+      class: _(["svc-page__content", s(o).css]),
       "data-sv-drop-target-survey-page": s(o).dropTargetName,
-      onClick: l[1] || (l[1] = (_) => {
-        s(o).select(s(o), _), _.stopPropagation();
+      onClick: l[1] || (l[1] = (m) => {
+        s(o).select(s(o), m), m.stopPropagation();
       }),
       ref_key: "root",
       ref: e,
-      onDblclick: l[2] || (l[2] = (_) => s(o).dblclick(_)),
+      onDblclick: l[2] || (l[2] = (m) => s(o).dblclick(m)),
       onMouseover: n,
       onMouseleave: n
     }, [
-      pn,
-      vn,
-      s(o).needRenderContent ? (a(), b(s(c), {
+      un,
+      cn,
+      s(o).needRenderContent ? (a(), b(s(u), {
         key: 0,
         is: "sv-page",
         survey: s(o).creator.survey,
         page: s(o).page
       }, null, 8, ["survey", "page"])) : p("", !0),
-      s(o).needRenderContent ? p("", !0) : (a(), r("div", mn, [
-        v(s(c), { is: "sv-loading-indicator" })
+      s(o).needRenderContent ? p("", !0) : (a(), i("div", pn, [
+        v(s(u), { is: "sv-loading-indicator" })
       ])),
-      s(o).showPlaceholder ? (a(), r("div", _n, [
-        d("div", gn, [
-          d("div", bn, w(s(o).placeholderText), 1)
+      s(o).showPlaceholder ? (a(), i("div", vn, [
+        d("div", mn, [
+          d("div", _n, T(s(o).placeholderText), 1)
         ])
       ])) : p("", !0),
-      s(o).allowDragging && !s(o).isGhost ? (a(), r("div", {
+      s(o).allowDragging && !s(o).isGhost ? (a(), i("div", {
         key: 3,
         class: "svc-question__drag-area",
-        onPointerdown: l[0] || (l[0] = (_) => s(o).onPointerDown(_))
+        onPointerdown: l[0] || (l[0] = (m) => s(o).onPointerDown(m))
       }, [
-        v(s(c), V({
+        v(s(u), V({
           is: "sv-svg-icon",
           class: "svc-question__drag-element"
         }, {
@@ -2337,68 +2346,68 @@ const Tt = /* @__PURE__ */ g({
           iconName: "icon-drag-area-indicator_24x16",
           size: "auto"
         }), null, 16),
-        d("div", yn, [
-          v(s(c), {
+        d("div", gn, [
+          v(s(u), {
             is: "sv-action-bar",
             model: s(o).actionContainer
           }, null, 8, ["model"]),
-          s(o).topActionContainer.hasActions ? (a(), b(s(c), {
+          s(o).topActionContainer.hasActions ? (a(), b(s(u), {
             key: 0,
             is: "sv-action-bar",
             model: s(o).topActionContainer
           }, null, 8, ["model"])) : p("", !0)
         ])
       ], 32)) : p("", !0),
-      !s(o).allowDragging || s(o).isGhost ? (a(), r("div", hn, [
-        v(s(c), {
+      !s(o).allowDragging || s(o).isGhost ? (a(), i("div", bn, [
+        v(s(u), {
           is: "sv-action-bar",
           model: s(o).actionContainer
         }, null, 8, ["model"]),
-        s(o).topActionContainer.hasActions ? (a(), b(s(c), {
+        s(o).topActionContainer.hasActions ? (a(), b(s(u), {
           key: 0,
           is: "sv-action-bar",
           model: s(o).topActionContainer
         }, null, 8, ["model"])) : p("", !0)
       ])) : p("", !0),
-      v(s(c), {
+      v(s(u), {
         is: "sv-action-bar",
         model: s(o).footerActionsBar
       }, null, 8, ["model"])
-    ], 42, un)), [
+    ], 42, dn)), [
       [s(M)]
     ]) : p("", !0);
   }
-}), qn = { class: "svc-add-new-item-button__text" }, fn = /* @__PURE__ */ g({
+}), hn = { class: "svc-add-new-item-button__text" }, Cn = /* @__PURE__ */ g({
   __name: "AddQuestion",
   props: {
     item: {},
     buttonClass: {},
     renderPopup: {}
   },
-  setup(u) {
-    const t = u;
+  setup(c) {
+    const t = c;
     $(() => t.item.data);
-    const e = k(
+    const e = f(
       () => "svc-element__add-new-question " + (t.buttonClass || "svc-btn")
-    ), o = k(
+    ), o = f(
       () => t.renderPopup === void 0 || t.renderPopup !== !1
     );
-    return (n, i) => (a(), r(T, null, [
-      h((a(), r("div", {
-        class: m(e.value),
-        onClick: i[0] || (i[0] = (l) => {
+    return (n, r) => (a(), i(D, null, [
+      h((a(), i("div", {
+        class: _(e.value),
+        onClick: r[0] || (r[0] = (l) => {
           n.item.data.addNewQuestion(n.item, l), l.stopPropagation();
         }),
-        onMouseover: i[1] || (i[1] = (l) => n.item.data.hoverStopper && n.item.data.hoverStopper(l, l.currentTarget))
+        onMouseover: r[1] || (r[1] = (l) => n.item.data.hoverStopper && n.item.data.hoverStopper(l, l.currentTarget))
       }, [
-        v(s(c), {
+        v(s(u), {
           is: "sv-svg-icon",
           class: "svc-panel__add-new-question-icon",
           iconName: "icon-add_24x24",
           size: "auto"
         }),
-        d("span", qn, w(n.item.data.addNewQuestionText), 1),
-        o.value ? (a(), b(s(c), {
+        d("span", hn, T(n.item.data.addNewQuestionText), 1),
+        o.value ? (a(), b(s(u), {
           key: 0,
           is: "svc-add-question-type-selector",
           questionTypeSelectorModel: n.item.data.questionTypeSelectorModel,
@@ -2407,7 +2416,7 @@ const Tt = /* @__PURE__ */ g({
       ], 34)), [
         [s(M)]
       ]),
-      o.value ? p("", !0) : (a(), b(s(c), {
+      o.value ? p("", !0) : (a(), b(s(u), {
         key: 0,
         is: "svc-add-question-type-selector",
         questionTypeSelectorModel: n.item.data.questionTypeSelectorModel,
@@ -2415,15 +2424,15 @@ const Tt = /* @__PURE__ */ g({
       }, null, 8, ["questionTypeSelectorModel", "renderPopup"]))
     ], 64));
   }
-}), kn = ["title", "aria-label"], $n = /* @__PURE__ */ g({
+}), qn = ["title", "aria-label"], fn = /* @__PURE__ */ g({
   __name: "AddQuestionTypeSelector",
   props: {
     questionTypeSelectorModel: {},
     renderPopup: {}
   },
-  setup(u) {
-    const t = u;
-    return $(() => t.questionTypeSelectorModel), (e, o) => h((a(), r("button", {
+  setup(c) {
+    const t = c;
+    return $(() => t.questionTypeSelectorModel), (e, o) => h((a(), i("button", {
       type: "button",
       onClick: o[0] || (o[0] = (n) => {
         e.questionTypeSelectorModel.action(), n.stopPropagation();
@@ -2432,7 +2441,7 @@ const Tt = /* @__PURE__ */ g({
       "aria-label": e.questionTypeSelectorModel.title,
       class: "svc-element__question-type-selector"
     }, [
-      v(s(c), V({
+      v(s(u), V({
         is: "sv-svg-icon",
         class: "svc-element__question-type-selector-icon"
       }, {
@@ -2440,44 +2449,44 @@ const Tt = /* @__PURE__ */ g({
         size: "auto",
         title: e.questionTypeSelectorModel.title
       }), null, 16),
-      e.renderPopup ? (a(), b(s(c), {
+      e.renderPopup ? (a(), b(s(u), {
         key: 0,
         is: "sv-popup",
         model: e.questionTypeSelectorModel.popupModel
       }, null, 8, ["model"])) : p("", !0)
-    ], 8, kn)), [
+    ], 8, qn)), [
       [s(M)]
     ]);
   }
-}), wn = /* @__PURE__ */ d("div", { class: "svc-row__drop-indicator svc-row__drop-indicator--top" }, null, -1), Tn = /* @__PURE__ */ d("div", { class: "svc-row__drop-indicator svc-row__drop-indicator--bottom" }, null, -1), Dn = /* @__PURE__ */ g({
+}), kn = /* @__PURE__ */ d("div", { class: "svc-row__drop-indicator svc-row__drop-indicator--top" }, null, -1), $n = /* @__PURE__ */ d("div", { class: "svc-row__drop-indicator svc-row__drop-indicator--bottom" }, null, -1), wn = /* @__PURE__ */ g({
   __name: "Row",
   props: {
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.componentData.creator), o = k(() => t.componentData.row), n = z(
+  setup(c) {
+    const t = c, e = f(() => t.componentData.creator), o = f(() => t.componentData.row), n = z(
       () => new ke(e.value, o.value, void 0),
       [() => e.value, () => o.value],
-      (i) => {
-        i.dispose();
+      (r) => {
+        r.dispose();
       }
     );
     return R(() => {
       n.value && n.value.subscribeElementChanges();
     }), K(() => {
       n.value && n.value.unsubscribeElementChanges();
-    }), (i, l) => (a(), r("div", {
-      class: m(s(n).cssClasses)
+    }), (r, l) => (a(), i("div", {
+      class: _(s(n).cssClasses)
     }, [
-      wn,
-      Tn,
-      x(i.$slots, "default")
+      kn,
+      $n,
+      x(r.$slots, "default")
     ], 2));
   }
-}), Nn = ["data-sv-drop-target-survey-element"], Mn = { class: "svc-fake-title" }, Sn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--left" }, null, -1), In = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--right" }, null, -1), Bn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), En = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), Pn = { class: "svc-question__top-actions" }, Rn = {
+}), Tn = ["data-sv-drop-target-survey-element"], Dn = { class: "svc-fake-title" }, Nn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--left" }, null, -1), Mn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--right" }, null, -1), Sn = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), In = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), Bn = { class: "svc-question__top-actions" }, En = {
   key: 0,
   class: "svc-panel__placeholder_frame-wrapper"
-}, Vn = { class: "svc-panel__placeholder_frame" }, An = {
+}, Pn = { class: "svc-panel__placeholder_frame" }, Rn = {
   class: "svc-panel__placeholder",
   "data-bind": "text: placeholderText"
 }, oe = /* @__PURE__ */ g({
@@ -2492,67 +2501,67 @@ const Tt = /* @__PURE__ */ g({
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = P(), o = z(
+  setup(c) {
+    const t = c, e = P(), o = z(
       () => t.createModel(),
       [() => t.componentName, () => t.componentData.data, () => t.componentData.element],
       (l) => {
         l.dispose();
       }
-    ), n = k(
+    ), n = f(
       () => o.value.isBannerShowing ? o.value.createBannerParams() : null
     );
-    G(() => {
+    O(() => {
       e.value && o.value && (o.value.rootElement = e.value);
     }), R(() => {
       e.value && o.value && (o.value.rootElement = e.value);
     });
-    const i = (l) => {
+    const r = (l) => {
       o.value.select(o.value, l), l.stopPropagation();
     };
-    return (l, _) => s(o) ? (a(), r("div", {
+    return (l, m) => s(o) ? (a(), i("div", {
       key: 0,
-      class: m(["svc-question__adorner", s(o).rootCss()]),
+      class: _(["svc-question__adorner", s(o).rootCss()]),
       ref_key: "root",
       ref: e,
-      onDblclick: _[2] || (_[2] = (N) => s(o).dblclick(N)),
-      onMouseover: _[3] || (_[3] = (N) => s(o).hover(N, N.currentTarget)),
-      onMouseleave: _[4] || (_[4] = (N) => s(o).hover(N, N.currentTarget)),
+      onDblclick: m[2] || (m[2] = (w) => s(o).dblclick(w)),
+      onMouseover: m[3] || (m[3] = (w) => s(o).hover(w, w.currentTarget)),
+      onMouseleave: m[4] || (m[4] = (w) => s(o).hover(w, w.currentTarget)),
       "data-sv-drop-target-survey-element": s(o).element.name || null,
       "data-bind": "css: rootCss(), attr: { 'data-sv-drop-target-survey-element': element.name || null }, event: { mouseover: function(m, e) { hover(e, $element); }, mouseleave: function(m, e) { hover(e, $element); } }"
     }, [
-      s(o).showHiddenTitle ? (a(), r("div", {
+      s(o).showHiddenTitle ? (a(), i("div", {
         key: 0,
-        class: m(s(o).cssCollapsedHiddenHeader)
+        class: _(s(o).cssCollapsedHiddenHeader)
       }, [
-        l.element.hasTitle ? (a(), b(s(c), {
+        l.element.hasTitle ? (a(), b(s(u), {
           key: 0,
           is: "survey-element-title",
           element: l.element,
           renderActions: !1
-        }, null, 8, ["element"])) : (a(), r("div", {
+        }, null, 8, ["element"])) : (a(), i("div", {
           key: 1,
-          class: m(s(o).cssCollapsedHiddenTitle)
+          class: _(s(o).cssCollapsedHiddenTitle)
         }, [
-          d("span", Mn, w(l.element.name), 1)
+          d("span", Dn, T(l.element.name), 1)
         ], 2))
       ], 2)) : p("", !0),
-      h((a(), r("div", {
-        onClick: _[1] || (_[1] = (N) => {
-          s(o).select(s(o), N), N.stopPropagation();
+      h((a(), i("div", {
+        onClick: m[1] || (m[1] = (w) => {
+          s(o).select(s(o), w), w.stopPropagation();
         }),
-        class: m(s(o).css())
+        class: _(s(o).css())
       }, [
+        Nn,
+        Mn,
         Sn,
         In,
-        Bn,
-        En,
-        s(o).allowDragging ? (a(), r("div", {
+        s(o).allowDragging ? (a(), i("div", {
           key: 0,
           class: "svc-question__drag-area",
-          onPointerdown: _[0] || (_[0] = (N) => s(o).onPointerDown(N))
+          onPointerdown: m[0] || (m[0] = (w) => s(o).onPointerDown(w))
         }, [
-          v(s(c), V({
+          v(s(u), V({
             is: "sv-svg-icon",
             class: "svc-question__drag-element"
           }, {
@@ -2560,48 +2569,48 @@ const Tt = /* @__PURE__ */ g({
             iconName: "icon-drag-area-indicator_24x16",
             size: "auto"
           }), null, 16),
-          d("div", Pn, [
-            v(s(c), {
+          d("div", Bn, [
+            v(s(u), {
               is: "sv-action-bar",
               model: s(o).topActionContainer,
               handleClick: !1
             }, null, 8, ["model"])
           ])
         ], 32)) : p("", !0),
-        s(o).needToRenderContent ? (a(), r(T, { key: 1 }, [
-          v(s(c), {
+        s(o).needToRenderContent ? (a(), i(D, { key: 1 }, [
+          v(s(u), {
             is: "sv-template-renderer",
             componentName: l.componentName,
             componentData: l.componentData
           }, null, 8, ["componentName", "componentData"]),
-          s(o).isEmptyElement && !l.showPlaceholderComponent ? (a(), r("div", Rn, [
-            d("div", Vn, [
-              d("div", An, w(s(o).placeholderText), 1)
+          s(o).isEmptyElement && !l.showPlaceholderComponent ? (a(), i("div", En, [
+            d("div", Pn, [
+              d("div", Rn, T(s(o).placeholderText), 1)
             ])
           ])) : p("", !0),
-          s(o).isEmptyElement && l.showPlaceholderComponent ? (a(), b(s(c), V(
+          s(o).isEmptyElement && l.showPlaceholderComponent ? (a(), b(s(u), V(
             {
               key: 1,
               is: l.placeholderComponent
             },
             l.getPlaceholderComponentData && l.getPlaceholderComponentData(s(o))
           ), null, 16, ["is"])) : p("", !0),
-          l.adornerComponent ? (a(), b(s(c), {
+          l.adornerComponent ? (a(), b(s(u), {
             key: 2,
             is: l.adornerComponent,
             model: s(o),
             element: l.element
           }, null, 8, ["is", "model", "element"])) : p("", !0),
-          s(o).isBannerShowing ? (a(), b(s(c), {
+          s(o).isBannerShowing ? (a(), b(s(u), {
             key: 3,
             is: "svc-question-banner",
             model: n.value
           }, null, 8, ["model"])) : p("", !0),
           d("div", {
             class: "svc-question__content-actions",
-            onFocusin: i
+            onFocusin: r
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-action-bar",
               model: s(o).actionContainer,
               handleClick: !1
@@ -2611,7 +2620,7 @@ const Tt = /* @__PURE__ */ g({
       ], 2)), [
         [s(M), { disableTabStop: !0 }]
       ])
-    ], 42, Nn)) : p("", !0);
+    ], 42, Tn)) : p("", !0);
   }
 }), ae = /* @__PURE__ */ g({
   __name: "Question",
@@ -2619,8 +2628,8 @@ const Tt = /* @__PURE__ */ g({
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = () => new ee(
+  setup(c) {
+    const t = c, e = () => new ee(
       t.componentData.data,
       t.componentData.element,
       null
@@ -2632,21 +2641,21 @@ const Tt = /* @__PURE__ */ g({
       "component-data": o.componentData
     }, null, 8, ["element", "component-name", "component-data"]));
   }
-}), zn = /* @__PURE__ */ g({
+}), Vn = /* @__PURE__ */ g({
   __name: "QuestionImage",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = () => new $e(
+  setup(c) {
+    const t = c, e = () => new $e(
       t.componentData.data,
       t.componentData.element,
       null
     ), o = (n) => ({
       question: n == null ? void 0 : n.filePresentationModel
     });
-    return (n, i) => (a(), b(oe, {
+    return (n, r) => (a(), b(oe, {
       "create-model": e,
       element: t.componentData.element,
       "show-placeholder-component": !0,
@@ -2657,35 +2666,35 @@ const Tt = /* @__PURE__ */ g({
       "adorner-component": "svc-image-question-adorner"
     }, null, 8, ["element", "component-data", "component-name"]));
   }
-}), Ln = {
+}), An = {
   key: 0,
   class: "svc-image-question-controls"
-}, Fn = ["accept"], Kn = {
+}, Ln = ["accept"], zn = {
   class: "svc-context-button",
   title: void 0,
   "aria-label": void 0
-}, Un = {
+}, Fn = {
   key: 1,
   class: "svc-image-question__loading-placeholder"
-}, Hn = { class: "svc-image-question__loading" }, Qn = /* @__PURE__ */ g({
+}, Kn = { class: "svc-image-question__loading" }, Hn = /* @__PURE__ */ g({
   __name: "Image",
   props: {
     model: {},
     element: {}
   },
-  setup(u) {
-    return (t, e) => (a(), r(T, null, [
-      !t.model.isUploading && !t.model.isEmptyElement ? (a(), r("div", Ln, [
-        t.model.allowEdit ? (a(), r(T, { key: 0 }, [
+  setup(c) {
+    return (t, e) => (a(), i(D, null, [
+      !t.model.isUploading && !t.model.isEmptyElement ? (a(), i("div", An, [
+        t.model.allowEdit ? (a(), i(D, { key: 0 }, [
           d("input", {
             type: "file",
             "aria-hidden": "true",
             tabindex: "-1",
             accept: t.model.acceptedTypes,
             class: "svc-choose-file-input"
-          }, null, 8, Fn),
-          h((a(), r("span", Kn, [
-            v(s(c), {
+          }, null, 8, Ln),
+          h((a(), i("span", zn, [
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-choosefile",
               size: "auto",
@@ -2696,21 +2705,21 @@ const Tt = /* @__PURE__ */ g({
           ])
         ], 64)) : p("", !0)
       ])) : p("", !0),
-      t.model.isUploading && !t.model.isEmptyElement ? (a(), r("div", Un, [
-        d("div", Hn, [
-          v(s(c), { is: "sv-loading-indicator" })
+      t.model.isUploading && !t.model.isEmptyElement ? (a(), i("div", Fn, [
+        d("div", Kn, [
+          v(s(u), { is: "sv-loading-indicator" })
         ])
       ])) : p("", !0)
     ], 64));
   }
-}), On = { class: "svc-rating-question-content" }, Gn = ["aria-label"], Wn = ["aria-label"], jn = /* @__PURE__ */ g({
+}), Un = { class: "svc-rating-question-content" }, Qn = ["aria-label"], On = ["aria-label"], Gn = /* @__PURE__ */ g({
   __name: "Rating",
   props: {
     componentData: {},
     componentName: {}
   },
-  setup(u) {
-    const t = u, e = z(
+  setup(c) {
+    const t = c, e = z(
       () => new we(
         t.componentData.data,
         t.componentData.question,
@@ -2719,47 +2728,47 @@ const Tt = /* @__PURE__ */ g({
       [() => t.componentData.data, () => t.componentData.question]
     );
     return (o, n) => {
-      var i, l, _, N, f, q, C, B, L;
-      return a(), r("div", On, [
+      var r, l, m, w, k, q, C, B, F;
+      return a(), i("div", Un, [
         d("div", {
-          class: m((i = s(e)) == null ? void 0 : i.controlsClassNames)
+          class: _((r = s(e)) == null ? void 0 : r.controlsClassNames)
         }, [
-          (l = s(e)) != null && l.allowRemove ? h((a(), r("span", {
+          (l = s(e)) != null && l.allowRemove ? h((a(), i("span", {
             key: 0,
-            class: m((_ = s(e)) == null ? void 0 : _.removeClassNames),
+            class: _((m = s(e)) == null ? void 0 : m.removeClassNames),
             onClick: n[0] || (n[0] = (J) => {
-              var U;
-              return (U = s(e)) == null ? void 0 : U.removeItem(s(e));
+              var H;
+              return (H = s(e)) == null ? void 0 : H.removeItem(s(e));
             }),
             role: "button",
-            "aria-label": (N = s(e)) == null ? void 0 : N.removeTooltip
+            "aria-label": (w = s(e)) == null ? void 0 : w.removeTooltip
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-remove_16x16",
               size: "auto",
-              title: (f = s(e)) == null ? void 0 : f.removeTooltip
+              title: (k = s(e)) == null ? void 0 : k.removeTooltip
             }, null, 8, ["title"])
-          ], 10, Gn)), [
+          ], 10, Qn)), [
             [s(M)]
           ]) : p("", !0),
-          (q = s(e)) != null && q.allowAdd ? h((a(), r("span", {
+          (q = s(e)) != null && q.allowAdd ? h((a(), i("span", {
             key: 1,
-            class: m((C = s(e)) == null ? void 0 : C.addClassNames),
+            class: _((C = s(e)) == null ? void 0 : C.addClassNames),
             onClick: n[1] || (n[1] = (J) => {
-              var U;
-              return (U = s(e)) == null ? void 0 : U.addItem(s(e));
+              var H;
+              return (H = s(e)) == null ? void 0 : H.addItem(s(e));
             }),
             role: "button",
             "aria-label": (B = s(e)) == null ? void 0 : B.addTooltip
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-add_16x16",
               size: "auto",
-              title: (L = s(e)) == null ? void 0 : L.addTooltip
+              title: (F = s(e)) == null ? void 0 : F.addTooltip
             }, null, 8, ["title"])
-          ], 10, Wn)), [
+          ], 10, On)), [
             [s(M)]
           ]) : p("", !0)
         ], 2),
@@ -2767,26 +2776,26 @@ const Tt = /* @__PURE__ */ g({
       ]);
     };
   }
-}), Jn = {
+}), Wn = {
   key: 0,
   class: "svc-matrix-cell__question-controls"
-}, Zn = /* @__PURE__ */ g({
+}, jn = /* @__PURE__ */ g({
   __name: "MatrixCell",
   props: {
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.componentData.creator), o = k(() => t.componentData.row), n = k(() => t.componentData.column), i = k(() => t.componentData.element), l = k(
+  setup(c) {
+    const t = c, e = f(() => t.componentData.creator), o = f(() => t.componentData.row), n = f(() => t.componentData.column), r = f(() => t.componentData.element), l = f(
       () => t.componentData.question
-    ), _ = z(
+    ), m = z(
       () => {
-        var N;
+        var w;
         return t.componentData ? new Te(
           e.value,
-          i.value,
+          r.value,
           l.value,
           o.value,
-          n.value || ((N = i.value.cell) == null ? void 0 : N.column)
+          n.value || ((w = r.value.cell) == null ? void 0 : w.column)
         ) : void 0;
       },
       [
@@ -2796,34 +2805,34 @@ const Tt = /* @__PURE__ */ g({
         () => l.value
       ]
     );
-    return (N, f) => {
+    return (w, k) => {
       var q, C;
-      return a(), r("div", {
+      return a(), i("div", {
         tabindex: "-1",
         class: "svc-matrix-cell",
-        onClick: f[1] || (f[1] = (B) => {
-          var L;
-          return (L = s(_)) == null ? void 0 : L.selectContext(s(_), B);
+        onClick: k[1] || (k[1] = (B) => {
+          var F;
+          return (F = s(m)) == null ? void 0 : F.selectContext(s(m), B);
         }),
-        onMouseover: f[2] || (f[2] = (B) => {
-          var L;
-          return (L = s(_)) == null ? void 0 : L.hover(B, B.currentTarget);
+        onMouseover: k[2] || (k[2] = (B) => {
+          var F;
+          return (F = s(m)) == null ? void 0 : F.hover(B, B.currentTarget);
         }),
-        onMouseleave: f[3] || (f[3] = (B) => {
-          var L;
-          return (L = s(_)) == null ? void 0 : L.hover(B, B.currentTarget);
+        onMouseleave: k[3] || (k[3] = (B) => {
+          var F;
+          return (F = s(m)) == null ? void 0 : F.hover(B, B.currentTarget);
         })
       }, [
         d("div", {
-          class: m(["svc-matrix-cell--selected", { "svc-visible": (q = s(_)) == null ? void 0 : q.isSelected }])
+          class: _(["svc-matrix-cell--selected", { "svc-visible": (q = s(m)) == null ? void 0 : q.isSelected }])
         }, null, 2),
-        x(N.$slots, "default"),
-        (C = s(_)) != null && C.isSupportCellEditor ? (a(), r("div", Jn, [
-          h((a(), r("span", {
+        x(w.$slots, "default"),
+        (C = s(m)) != null && C.isSupportCellEditor ? (a(), i("div", Wn, [
+          h((a(), i("span", {
             class: "svc-matrix-cell__question-controls-button svc-context-button",
-            onClick: f[0] || (f[0] = (B) => s(_).editQuestion(s(_), B))
+            onClick: k[0] || (k[0] = (B) => s(m).editQuestion(s(m), B))
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-edit",
               size: "auto"
@@ -2835,36 +2844,36 @@ const Tt = /* @__PURE__ */ g({
       ], 32);
     };
   }
-}), Xn = { class: "svc-question__adorner" }, Yn = { class: "svc-question__content svc-question__content--in-popup" }, xn = /* @__PURE__ */ g({
+}), Jn = { class: "svc-question__adorner" }, Zn = { class: "svc-question__content svc-question__content--in-popup" }, Xn = /* @__PURE__ */ g({
   __name: "CellQuestion",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = k(
+  setup(c) {
+    const t = c, e = f(
       () => t.componentData.element
     );
-    return $(() => e.value), (o, n) => (a(), r("div", Xn, [
-      d("div", Yn, [
-        v(s(c), V({ is: o.componentName }, o.componentData), null, 16, ["is"])
+    return $(() => e.value), (o, n) => (a(), i("div", Jn, [
+      d("div", Zn, [
+        v(s(u), V({ is: o.componentName }, o.componentData), null, 16, ["is"])
       ])
     ]));
   }
-}), ea = ["data-sv-drop-target-survey-element"], oa = { class: "svc-fake-title" }, sa = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--left" }, null, -1), ta = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--right" }, null, -1), na = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), aa = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), la = { class: "svc-question__top-actions" }, ia = {
+}), Yn = ["data-sv-drop-target-survey-element"], xn = { class: "svc-fake-title" }, ea = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--left" }, null, -1), oa = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--right" }, null, -1), sa = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), ta = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), na = { class: "svc-question__top-actions" }, aa = {
   key: 0,
   class: "svc-panel__placeholder_frame-wrapper"
-}, ra = { class: "svc-panel__placeholder_frame" }, da = { class: "svc-panel__placeholder" }, ca = { class: "svc-add-new-item-button__text" }, ua = {
+}, la = { class: "svc-panel__placeholder_frame" }, ia = { class: "svc-panel__placeholder" }, ra = { class: "svc-add-new-item-button__text" }, da = {
   key: 1,
   class: "svc-panel__add-new-question-container"
-}, pa = { class: "svc-panel__question-type-selector-popup" }, va = { class: "svc-panel__add-new-question-wrapper" }, ma = /* @__PURE__ */ g({
+}, ua = { class: "svc-panel__question-type-selector-popup" }, ca = { class: "svc-panel__add-new-question-wrapper" }, pa = /* @__PURE__ */ g({
   __name: "Panel",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = z(
+  setup(c) {
+    const t = c, e = z(
       () => new ee(
         t.componentData.data,
         t.componentData.element,
@@ -2877,89 +2886,89 @@ const Tt = /* @__PURE__ */ g({
     ), o = (n) => {
       n.stopPropagation(), e.value.addNewQuestion();
     };
-    return (n, i) => s(e) && !s(e).isDisposed ? (a(), r("div", {
+    return (n, r) => s(e) && !s(e).isDisposed ? (a(), i("div", {
       key: 0,
-      class: m(["svc-question__adorner", s(e).rootCss()]),
-      onDblclick: i[3] || (i[3] = (l) => s(e).dblclick(l)),
-      onMouseover: i[4] || (i[4] = (l) => s(e).hover(l, l.currentTarget)),
-      onMouseleave: i[5] || (i[5] = (l) => s(e).hover(l, l.currentTarget)),
+      class: _(["svc-question__adorner", s(e).rootCss()]),
+      onDblclick: r[3] || (r[3] = (l) => s(e).dblclick(l)),
+      onMouseover: r[4] || (r[4] = (l) => s(e).hover(l, l.currentTarget)),
+      onMouseleave: r[5] || (r[5] = (l) => s(e).hover(l, l.currentTarget)),
       "data-sv-drop-target-survey-element": s(e).element.name || null,
       ref: "root"
     }, [
-      s(e).showHiddenTitle ? (a(), r("div", {
+      s(e).showHiddenTitle ? (a(), i("div", {
         key: 0,
-        class: m(s(e).cssCollapsedHiddenHeader)
+        class: _(s(e).cssCollapsedHiddenHeader)
       }, [
-        s(e).element.hasTitle ? (a(), b(s(c), {
+        s(e).element.hasTitle ? (a(), b(s(u), {
           key: 0,
           is: "survey-element-title",
           element: s(e).element,
           renderActions: !1
-        }, null, 8, ["element"])) : (a(), r("div", {
+        }, null, 8, ["element"])) : (a(), i("div", {
           key: 1,
-          class: m(s(e).cssCollapsedHiddenTitle)
+          class: _(s(e).cssCollapsedHiddenTitle)
         }, [
-          d("span", oa, w(s(e).element.name), 1)
+          d("span", xn, T(s(e).element.name), 1)
         ], 2))
       ], 2)) : p("", !0),
-      h((a(), r("div", {
-        class: m(s(e).css()),
-        onClick: i[2] || (i[2] = (l) => s(e).element.isInteractiveDesignElement ? s(e).select(s(e), l) : null)
+      h((a(), i("div", {
+        class: _(s(e).css()),
+        onClick: r[2] || (r[2] = (l) => s(e).element.isInteractiveDesignElement ? s(e).select(s(e), l) : null)
       }, [
+        ea,
+        oa,
         sa,
         ta,
-        na,
-        aa,
-        s(e).allowDragging && s(e).element.isInteractiveDesignElement ? (a(), r("div", {
+        s(e).allowDragging && s(e).element.isInteractiveDesignElement ? (a(), i("div", {
           key: 0,
           class: "svc-question__drag-area",
-          onPointerdown: i[0] || (i[0] = (l) => s(e).onPointerDown(l))
+          onPointerdown: r[0] || (r[0] = (l) => s(e).onPointerDown(l))
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             class: "svc-question__drag-element",
             iconName: "icon-drag-area-indicator_24x16",
             size: "auto"
           }),
-          d("div", la, [
-            v(s(c), {
+          d("div", na, [
+            v(s(u), {
               is: "sv-action-bar",
               model: s(e).topActionContainer,
               handleClick: !1
             }, null, 8, ["model"])
           ])
         ], 32)) : p("", !0),
-        s(e).needToRenderContent ? (a(), r(T, { key: 1 }, [
-          v(s(c), V({ is: n.componentName }, n.componentData), null, 16, ["is"]),
-          s(e).isEmptyElement ? (a(), r("div", ia, [
-            d("div", ra, [
-              d("div", da, w(s(e).placeholderText), 1),
-              s(e).showAddQuestionButton ? h((a(), r("div", {
+        s(e).needToRenderContent ? (a(), i(D, { key: 1 }, [
+          v(s(u), V({ is: n.componentName }, n.componentData), null, 16, ["is"]),
+          s(e).isEmptyElement ? (a(), i("div", aa, [
+            d("div", la, [
+              d("div", ia, T(s(e).placeholderText), 1),
+              s(e).showAddQuestionButton ? h((a(), i("div", {
                 key: 0,
                 class: "svc-panel__add-new-question svc-action-button",
                 onClick: o
               }, [
-                v(s(c), {
+                v(s(u), {
                   is: "sv-svg-icon",
                   class: "svc-panel__add-new-question-icon",
                   iconName: "icon-add_24x24",
                   size: "auto"
                 }),
-                d("span", ca, w(s(e).addNewQuestionText), 1)
+                d("span", ra, T(s(e).addNewQuestionText), 1)
               ])), [
                 [s(M)]
               ]) : p("", !0)
             ])
           ])) : p("", !0),
-          !s(e).isEmptyElement && s(e).showAddQuestionButton ? (a(), r("div", ua, [
-            d("div", pa, [
-              v(s(c), {
+          !s(e).isEmptyElement && s(e).showAddQuestionButton ? (a(), i("div", da, [
+            d("div", ua, [
+              v(s(u), {
                 is: "sv-popup",
                 model: s(e).questionTypeSelectorModel.popupModel
               }, null, 8, ["model"])
             ]),
-            d("div", va, [
-              v(s(c), {
+            d("div", ca, [
+              v(s(u), {
                 is: "svc-add-new-question-btn",
                 item: { data: s(e) },
                 buttonClass: "svc-action-button",
@@ -2967,12 +2976,12 @@ const Tt = /* @__PURE__ */ g({
               }, null, 8, ["item"])
             ])
           ])) : p("", !0),
-          s(e).element.isInteractiveDesignElement ? (a(), r("div", {
+          s(e).element.isInteractiveDesignElement ? (a(), i("div", {
             key: 2,
             class: "svc-question__content-actions",
-            onFocusin: i[1] || (i[1] = (l) => s(e).select(s(e), l))
+            onFocusin: r[1] || (r[1] = (l) => s(e).select(s(e), l))
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-action-bar",
               model: s(e).actionContainer,
               handleClick: !1
@@ -2982,35 +2991,35 @@ const Tt = /* @__PURE__ */ g({
       ], 2)), [
         [s(M), { disableTabStop: !0 }]
       ])
-    ], 42, ea)) : p("", !0);
+    ], 42, Yn)) : p("", !0);
   }
-}), _a = ["data-sv-drop-target-item-value"], ga = /* @__PURE__ */ d("div", { class: "svc-item-value__ghost" }, null, -1), ba = { class: "svc-item-value-controls" }, ya = {
+}), va = ["data-sv-drop-target-item-value"], ma = /* @__PURE__ */ d("div", { class: "svc-item-value__ghost" }, null, -1), _a = { class: "svc-item-value-controls" }, ga = {
   key: 0,
   class: "svc-item-value-controls__button svc-item-value-controls__drag"
-}, ha = ["aria-label"], Ca = ["aria-label"], qa = {
+}, ba = ["aria-label"], ya = ["aria-label"], ha = {
   key: 0,
   class: "svc-item-value-controls svc-choice-elements-button-container"
-}, fa = /* @__PURE__ */ g({
+}, Ca = /* @__PURE__ */ g({
   __name: "ItemValue",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = P(), e = u, o = k(() => e.componentData.data.creator), n = k(() => e.componentData.question), i = k(() => e.componentData.item), l = W(
-      () => i.value,
+  setup(c) {
+    const t = P(), e = c, o = f(() => e.componentData.data.creator), n = f(() => e.componentData.question), r = f(() => e.componentData.item), l = W(
+      () => r.value,
       (q, C) => {
         q && t.value && q.setRootElement(t.value), C && C.setRootElement(void 0);
       }
     );
     R(() => {
-      t.value && i.value && i.value.setRootElement(t.value);
+      t.value && r.value && r.value.setRootElement(t.value);
     }), K(() => {
-      i.value.setRootElement(void 0);
+      r.value.setRootElement(void 0);
     });
-    const _ = z(
-      () => new De(o.value, n.value, i.value),
-      [() => o.value, () => n.value, () => i.value],
+    const m = z(
+      () => new De(o.value, n.value, r.value),
+      [() => o.value, () => n.value, () => r.value],
       (q) => {
         q.dispose();
       }
@@ -3018,7 +3027,7 @@ const Tt = /* @__PURE__ */ g({
     Y(() => {
       l();
     });
-    const N = (q) => {
+    const w = (q) => {
       const C = o.value.survey;
       if (C) {
         const B = C.getElementWrapperComponentName(q);
@@ -3026,7 +3035,7 @@ const Tt = /* @__PURE__ */ g({
           return B;
       }
       return "panel";
-    }, f = (q) => {
+    }, k = (q) => {
       const C = o.value.survey;
       let B;
       return C && (B = C.getElementWrapperComponentData(q)), {
@@ -3037,145 +3046,145 @@ const Tt = /* @__PURE__ */ g({
         }
       };
     };
-    return (q, C) => (a(), r(T, null, [
+    return (q, C) => (a(), i(D, null, [
       d("div", {
-        class: m(["svc-item-value-wrapper", {
-          "svc-item-value--new": s(_).isNew,
-          "svc-item-value--dragging": s(_).isDragging,
-          "svc-item-value--ghost": s(_).isDragDropGhost,
-          "svc-item-value--movedown": s(_).isDragDropMoveDown,
-          "svc-item-value--moveup": s(_).isDragDropMoveUp
+        class: _(["svc-item-value-wrapper", {
+          "svc-item-value--new": s(m).isNew,
+          "svc-item-value--dragging": s(m).isDragging,
+          "svc-item-value--ghost": s(m).isDragDropGhost,
+          "svc-item-value--movedown": s(m).isDragDropMoveDown,
+          "svc-item-value--moveup": s(m).isDragDropMoveUp
         }]),
-        onPointerdown: C[5] || (C[5] = (B) => s(_).onPointerDown(B)),
-        "data-sv-drop-target-item-value": s(_).isDraggable ? i.value.value : null,
+        onPointerdown: C[5] || (C[5] = (B) => s(m).onPointerDown(B)),
+        "data-sv-drop-target-item-value": s(m).isDraggable ? r.value.value : null,
         ref_key: "root",
         ref: t
       }, [
-        ga,
-        d("div", ba, [
-          s(_).isDraggable ? (a(), r("span", ya, [
-            v(s(c), {
+        ma,
+        d("div", _a, [
+          s(m).isDraggable ? (a(), i("span", ga, [
+            v(s(u), {
               is: "sv-svg-icon",
               class: "svc-item-value-controls__drag-icon",
               iconName: "icon-drag-24x24",
               size: "auto",
-              title: s(_).dragTooltip
+              title: s(m).dragTooltip
             }, null, 8, ["title"])
           ])) : p("", !0),
-          s(_).allowAdd ? h((a(), r("span", {
+          s(m).allowAdd ? h((a(), i("span", {
             key: 1,
             class: "svc-item-value-controls__button svc-item-value-controls__add",
-            onClick: C[0] || (C[0] = (B) => s(_).add(s(_))),
+            onClick: C[0] || (C[0] = (B) => s(m).add(s(m))),
             role: "button",
-            "aria-label": s(_).tooltip
+            "aria-label": s(m).tooltip
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-add_16x16",
               size: "auto",
-              title: s(_).tooltip
+              title: s(m).tooltip
             }, null, 8, ["title"])
-          ], 8, ha)), [
+          ], 8, ba)), [
             [s(M)]
           ]) : p("", !0),
-          s(_).allowRemove ? h((a(), r("span", {
+          s(m).allowRemove ? h((a(), i("span", {
             key: 2,
             class: "svc-item-value-controls__button svc-item-value-controls__remove",
-            onClick: C[1] || (C[1] = (B) => s(_).remove(s(_))),
-            onBlur: C[2] || (C[2] = (B) => s(_).onFocusOut(B)),
+            onClick: C[1] || (C[1] = (B) => s(m).remove(s(m))),
+            onBlur: C[2] || (C[2] = (B) => s(m).onFocusOut(B)),
             role: "button",
-            "aria-label": s(_).tooltip
+            "aria-label": s(m).tooltip
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-remove_16x16",
               size: "auto",
-              title: s(_).tooltip
+              title: s(m).tooltip
             }, null, 8, ["title"])
-          ], 40, Ca)), [
+          ], 40, ya)), [
             [s(M)]
           ]) : p("", !0)
         ]),
         d("div", {
           class: "svc-item-value__item",
-          onClick: C[3] || (C[3] = (B) => s(_).select(s(_), B))
+          onClick: C[3] || (C[3] = (B) => s(m).select(s(m), B))
         }, [
-          v(s(c), V({ is: q.componentName }, q.componentData), null, 16, ["is"])
+          v(s(u), V({ is: q.componentName }, q.componentData), null, 16, ["is"])
         ]),
-        s(_).canShowPanel() ? (a(), r("div", qa, [
-          h((a(), r("span", {
+        s(m).canShowPanel() ? (a(), i("div", ha, [
+          h((a(), i("span", {
             role: "button",
             class: "svc-item-value-controls__button svc-item-value-controls__add svc-choice-elements-button",
-            onClick: C[4] || (C[4] = (B) => s(_).togglePanel())
+            onClick: C[4] || (C[4] = (B) => s(m).togglePanel())
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
-              iconName: s(_).showPanel ? "icon-collapsepanel-16x16" : "icon-expandpanel-16x16",
+              iconName: s(m).showPanel ? "icon-collapsepanel-16x16" : "icon-expandpanel-16x16",
               size: "auto"
             }, null, 8, ["iconName"])
           ])), [
             [s(M)]
           ])
         ])) : p("", !0)
-      ], 42, _a),
-      s(_).showPanel ? (a(), b(s(c), V({
+      ], 42, va),
+      s(m).showPanel ? (a(), b(s(u), V({
         key: 0,
-        is: N(i.value.panel)
-      }, f(i.value.panel)), null, 16, ["is"])) : p("", !0)
+        is: w(r.value.panel)
+      }, k(r.value.panel)), null, 16, ["is"])) : p("", !0)
     ], 64));
   }
-}), ka = ["data-sv-drop-target-item-value"], $a = { class: "svc-image-item-value-wrapper__content" }, wa = ["accept"], Ta = {
+}), qa = ["data-sv-drop-target-item-value"], fa = { class: "svc-image-item-value-wrapper__content" }, ka = ["accept"], $a = {
   key: 0,
   class: "svc-image-item-value__item"
-}, Da = {
+}, wa = {
   key: 2,
   class: "svc-context-container svc-image-item-value-controls"
-}, Na = { class: "svc-image-item-value__item" }, Ma = { class: "sd-imagepicker__item sd-imagepicker__item--inline" }, Sa = { class: "sd-imagepicker__label" }, Ia = {
+}, Ta = { class: "svc-image-item-value__item" }, Da = { class: "sd-imagepicker__item sd-imagepicker__item--inline" }, Na = { class: "sd-imagepicker__label" }, Ma = {
   key: 0,
   class: "svc-image-item-value__loading"
-}, Ba = {
+}, Sa = {
   key: 0,
   class: "svc-image-item-value__placeholder"
-}, Ea = { key: 1 }, Pa = /* @__PURE__ */ g({
+}, Ia = { key: 1 }, Ba = /* @__PURE__ */ g({
   __name: "ImageItemValue",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.componentData.data.creator), o = k(() => t.componentData.question), n = k(() => t.componentData.item), i = P(), l = z(
+  setup(c) {
+    const t = c, e = f(() => t.componentData.data.creator), o = f(() => t.componentData.question), n = f(() => t.componentData.item), r = P(), l = z(
       () => {
-        const f = new Ne(
+        const k = new Ne(
           e.value,
           o.value,
           n.value,
           null,
           null
         );
-        return i != null && i.value && (f.itemsRoot = i.value), f;
+        return r != null && r.value && (k.itemsRoot = r.value), k;
       },
       [() => e.value, () => o.value, () => n.value],
-      (f) => {
-        f.dispose();
+      (k) => {
+        k.dispose();
       }
-    ), _ = (f) => {
-      f.preventDefault();
-    }, N = k(() => {
-      const f = !l.value.getIsNewItemSingle();
+    ), m = (k) => {
+      k.preventDefault();
+    }, w = f(() => {
+      const k = !l.value.getIsNewItemSingle();
       return {
-        width: f ? o.value.renderedImageWidth + "px" : void 0,
-        height: f ? o.value.renderedImageHeight + "px" : void 0
+        width: k ? o.value.renderedImageWidth + "px" : void 0,
+        height: k ? o.value.renderedImageHeight + "px" : void 0
       };
     });
     return R(() => {
-      i.value && (l.value.itemsRoot = i.value);
-    }), (f, q) => (a(), r("div", {
+      r.value && (l.value.itemsRoot = r.value);
+    }), (k, q) => (a(), i("div", {
       onPointerdown: q[5] || (q[5] = (C) => s(l).onPointerDown(C)),
-      class: m(s(l).getRootCss()),
+      class: _(s(l).getRootCss()),
       "data-sv-drop-target-item-value": s(l).isDraggable ? n.value.value : null,
       ref_key: "root",
-      ref: i,
-      onDragstart: _,
+      ref: r,
+      onDragstart: m,
       onDragenter: q[6] || (q[6] = (C) => s(l).onDragEnter(C)),
       onDragover: q[7] || (q[7] = (C) => s(l).onDragOver(C)),
       onDragleave: q[8] || (q[8] = (C) => s(l).onDragLeave(C)),
@@ -3183,41 +3192,41 @@ const Tt = /* @__PURE__ */ g({
     }, [
       d("div", {
         class: "svc-image-item-value-wrapper__ghost",
-        style: F(N.value)
+        style: A(w.value)
       }, null, 4),
-      d("div", $a, [
+      d("div", fa, [
         d("input", {
           type: "file",
           "aria-hidden": "true",
           tabindex: "-1",
           accept: s(l).acceptedTypes,
           class: "svc-choose-file-input"
-        }, null, 8, wa),
-        !s(l).isNew && !s(l).isUploading ? (a(), r(T, { key: 0 }, [
-          s(l).isNew ? p("", !0) : (a(), r("div", Ta, [
-            v(s(c), V({ is: f.componentName }, f.componentData), null, 16, ["is"])
+        }, null, 8, ka),
+        !s(l).isNew && !s(l).isUploading ? (a(), i(D, { key: 0 }, [
+          s(l).isNew ? p("", !0) : (a(), i("div", $a, [
+            v(s(u), V({ is: k.componentName }, k.componentData), null, 16, ["is"])
           ])),
-          s(l).isDraggable && s(l).canRenderControls ? (a(), r("span", {
+          s(l).isDraggable && s(l).canRenderControls ? (a(), i("span", {
             key: 1,
             class: "svc-context-button svc-image-item-value-controls__drag-area-indicator",
             onPointerdown: q[0] || (q[0] = (C) => s(l).onPointerDown(C)),
             title: void 0,
             "aria-label": void 0
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-drag-24x24",
               size: "auto"
             })
           ], 32)) : p("", !0),
-          s(l).canRenderControls ? (a(), r("div", Da, [
-            h((a(), r("span", {
+          s(l).canRenderControls ? (a(), i("div", wa, [
+            h((a(), i("span", {
               class: "svc-context-button",
               onClick: q[1] || (q[1] = (C) => s(l).chooseFile(s(l))),
               title: void 0,
               "aria-label": void 0
             }, [
-              v(s(c), {
+              v(s(u), {
                 is: "sv-svg-icon",
                 role: "button",
                 iconName: "icon-choosefile",
@@ -3227,13 +3236,13 @@ const Tt = /* @__PURE__ */ g({
             ])), [
               [s(M)]
             ]),
-            h((a(), r("span", {
+            h((a(), i("span", {
               class: "svc-context-button svc-context-button--danger",
               onClick: q[2] || (q[2] = (C) => s(l).remove(s(l))),
               title: void 0,
               "aria-label": void 0
             }, [
-              v(s(c), {
+              v(s(u), {
                 is: "sv-svg-icon",
                 role: "button",
                 iconName: "icon-delete",
@@ -3244,68 +3253,68 @@ const Tt = /* @__PURE__ */ g({
               [s(M)]
             ])
           ])) : p("", !0)
-        ], 64)) : (a(), r(T, { key: 1 }, [
-          d("div", Na, [
-            d("div", Ma, [
-              d("label", Sa, [
+        ], 64)) : (a(), i(D, { key: 1 }, [
+          d("div", Ta, [
+            d("div", Da, [
+              d("label", Na, [
                 d("div", {
-                  style: F(N.value),
+                  style: A(w.value),
                   class: "sd-imagepicker__image"
                 }, [
-                  s(l).isUploading ? (a(), r("div", Ia, [
-                    v(s(c), { is: "sv-loading-indicator" })
+                  s(l).isUploading ? (a(), i("div", Ma, [
+                    v(s(u), { is: "sv-loading-indicator" })
                   ])) : p("", !0)
                 ], 4)
               ])
             ])
           ]),
-          s(l).allowAdd && !s(l).isUploading ? (a(), r("div", {
+          s(l).allowAdd && !s(l).isUploading ? (a(), i("div", {
             key: 0,
             class: "svc-image-item-value-controls",
             onPointerdown: q[4] || (q[4] = (C) => C.stopPropagation())
           }, [
-            s(l).showPlaceholder ? (a(), r("span", Ba, w(s(l).placeholderText), 1)) : p("", !0),
-            h((a(), r("span", {
-              class: m(s(l).addButtonCss),
+            s(l).showPlaceholder ? (a(), i("span", Sa, T(s(l).placeholderText), 1)) : p("", !0),
+            h((a(), i("span", {
+              class: _(s(l).addButtonCss),
               onClick: q[3] || (q[3] = (C) => s(l).chooseNewFile(s(l)))
             }, [
-              s(l).showChooseButtonAsIcon ? (a(), b(s(c), {
+              s(l).showChooseButtonAsIcon ? (a(), b(s(u), {
                 key: 0,
                 is: "sv-svg-icon",
                 iconName: "icon-add-lg",
                 size: "auto",
                 title: s(l).addFileTitle
-              }, null, 8, ["title"])) : (a(), r("span", Ea, w(s(l).chooseImageText), 1))
+              }, null, 8, ["title"])) : (a(), i("span", Ia, T(s(l).chooseImageText), 1))
             ], 2)), [
               [s(M)]
             ])
           ], 32)) : p("", !0)
         ], 64))
       ])
-    ], 42, ka));
+    ], 42, qa));
   }
-}), Ra = /* @__PURE__ */ g({
+}), Ea = /* @__PURE__ */ g({
   __name: "QuestionEditor",
   props: {
     survey: {},
     style: {}
   },
-  setup(u) {
-    const t = u, e = k(() => {
-      var i;
-      return (i = t.survey) == null ? void 0 : i.getAllQuestions()[0];
-    }), o = k(() => {
-      const i = t.survey;
-      if (i && e.value) {
-        const l = i.getElementWrapperComponentName(e.value);
+  setup(c) {
+    const t = c, e = f(() => {
+      var r;
+      return (r = t.survey) == null ? void 0 : r.getAllQuestions()[0];
+    }), o = f(() => {
+      const r = t.survey;
+      if (r && e.value) {
+        const l = r.getElementWrapperComponentName(e.value);
         if (l)
           return l;
       }
       return "survey-question";
-    }), n = k(() => {
-      const i = t.survey;
+    }), n = f(() => {
+      const r = t.survey;
       let l;
-      return i && e.value && (l = i.getElementWrapperComponentData(e.value)), {
+      return r && e.value && (l = r.getElementWrapperComponentData(e.value)), {
         componentName: "survey-question",
         componentData: {
           element: e.value,
@@ -3313,44 +3322,44 @@ const Tt = /* @__PURE__ */ g({
         }
       };
     });
-    return (i, l) => (a(), r("div", {
-      style: F(t.style)
+    return (r, l) => (a(), i("div", {
+      style: A(t.style)
     }, [
-      v(s(c), V({ is: o.value }, n.value), null, 16, ["is"])
+      v(s(u), V({ is: o.value }, n.value), null, 16, ["is"])
     ], 4));
   }
-}), Va = ["accept"], Aa = /* @__PURE__ */ d("svg", null, [
+}), Pa = ["accept"], Ra = /* @__PURE__ */ d("svg", null, [
   /* @__PURE__ */ d("use", { "xlink:href": "#icon-image-48x48" })
-], -1), za = [
-  Aa
-], La = { class: "svc-context-container svc-logo-image-controls" }, Fa = {
+], -1), Va = [
+  Ra
+], Aa = { class: "svc-context-container svc-logo-image-controls" }, La = {
   key: 2,
   class: "svc-logo-image__loading"
-}, Ka = /* @__PURE__ */ g({
+}, za = /* @__PURE__ */ g({
   __name: "Logo",
   props: {
     data: {}
   },
-  setup(u) {
-    const t = u, e = k(() => t.data), o = k(() => e.value.survey), n = P(), i = z(
+  setup(c) {
+    const t = c, e = f(() => t.data), o = f(() => e.value.survey), n = P(), r = z(
       () => new Me(e.value, null),
       [() => e.value]
-    ), l = P(), _ = () => {
+    ), l = P(), m = () => {
       l.value = o.value.locLogo.renderedHtml;
     };
     return W(
       () => o.value.locLogo,
-      (N, f) => {
-        _(), N && N.onStringChanged.add(_), f && N.onStringChanged.remove(_);
+      (w, k) => {
+        m(), w && w.onStringChanged.add(m), k && w.onStringChanged.remove(m);
       },
       {
         immediate: !0
       }
     ), R(() => {
-      n.value && (i.value.root = n.value);
+      n.value && (r.value.root = n.value);
     }), K(() => {
-      i.value && (i.value.root = void 0);
-    }), (N, f) => (a(), r("div", {
+      r.value && (r.value.root = void 0);
+    }), (w, k) => (a(), i("div", {
       class: "svc-logo-image",
       ref_key: "root",
       ref: n
@@ -3359,30 +3368,30 @@ const Tt = /* @__PURE__ */ g({
         type: "file",
         "aria-hidden": "true",
         tabindex: "-1",
-        accept: s(i).acceptedTypes,
+        accept: s(r).acceptedTypes,
         class: "svc-choose-file-input"
-      }, null, 8, Va),
-      l.value ? p("", !0) : (a(), r(T, { key: 0 }, [
-        s(i).allowEdit && !s(i).isUploading ? h((a(), r("div", {
+      }, null, 8, Pa),
+      l.value ? p("", !0) : (a(), i(D, { key: 0 }, [
+        s(r).allowEdit && !s(r).isUploading ? h((a(), i("div", {
           key: 0,
           class: "svc-logo-image-placeholder",
-          onClick: f[0] || (f[0] = (q) => s(i).chooseFile(s(i)))
-        }, za)), [
+          onClick: k[0] || (k[0] = (q) => s(r).chooseFile(s(r)))
+        }, Va)), [
           [s(M)]
         ]) : p("", !0)
       ], 64)),
-      l.value && !s(i).isUploading ? (a(), r("div", {
+      l.value && !s(r).isUploading ? (a(), i("div", {
         key: 1,
-        class: m(s(i).containerCss)
+        class: _(s(r).containerCss)
       }, [
-        d("div", La, [
-          h((a(), r("span", {
+        d("div", Aa, [
+          h((a(), i("span", {
             class: "svc-context-button",
-            onClick: f[1] || (f[1] = (q) => s(i).chooseFile(s(i))),
+            onClick: k[1] || (k[1] = (q) => s(r).chooseFile(s(r))),
             title: void 0,
             "aria-label": void 0
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-choosefile",
               size: "auto"
@@ -3390,13 +3399,13 @@ const Tt = /* @__PURE__ */ g({
           ])), [
             [s(M)]
           ]),
-          h((a(), r("span", {
+          h((a(), i("span", {
             class: "svc-context-button svc-context-button--danger",
-            onClick: f[2] || (f[2] = (q) => s(i).remove(s(i))),
+            onClick: k[2] || (k[2] = (q) => s(r).remove(s(r))),
             title: void 0,
             "aria-label": void 0
           }, [
-            v(s(c), {
+            v(s(u), {
               is: "sv-svg-icon",
               iconName: "icon-clear",
               size: "auto"
@@ -3405,37 +3414,37 @@ const Tt = /* @__PURE__ */ g({
             [s(M)]
           ])
         ]),
-        v(s(c), {
+        v(s(u), {
           is: "sv-logo-image",
           data: o.value
         }, null, 8, ["data"])
       ], 2)) : p("", !0),
-      s(i).isUploading ? (a(), r("div", Fa, [
-        v(s(c), { is: "sv-loading-indicator" })
+      s(r).isUploading ? (a(), i("div", La, [
+        v(s(u), { is: "sv-loading-indicator" })
       ])) : p("", !0)
     ], 512));
   }
-}), Ua = {
+}), Fa = {
   key: 0,
   class: "svc-search"
-}, Ha = { class: "svc-search__search-icon" }, Qa = ["aria-label", "placeholder", "tabindex"], Oa = { class: "svc-search__toolbar" }, Ga = { class: "svc-search__toolbar-counter" }, Wa = /* @__PURE__ */ g({
+}, Ka = { class: "svc-search__search-icon" }, Ha = ["aria-label", "placeholder", "tabindex"], Ua = { class: "svc-search__toolbar" }, Qa = { class: "svc-search__toolbar-counter" }, Oa = /* @__PURE__ */ g({
   __name: "Search",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
+  setup(c) {
+    const t = c;
     $(() => t.model);
-    const e = k({
+    const e = f({
       get: () => t.model.filterString,
       set: (o) => {
         const n = t.model;
         n.filterString = o;
       }
     });
-    return (o, n) => o.model.isVisible ? (a(), r("div", Ua, [
-      d("div", Ha, [
-        v(s(c), {
+    return (o, n) => o.model.isVisible ? (a(), i("div", Fa, [
+      d("div", Ka, [
+        v(s(u), {
           is: "sv-svg-icon",
           iconName: "icon-search",
           size: "auto"
@@ -3444,125 +3453,123 @@ const Tt = /* @__PURE__ */ g({
       h(d("input", {
         type: "text",
         class: "svc-search__input",
-        "onUpdate:modelValue": n[0] || (n[0] = (i) => e.value = i),
+        "onUpdate:modelValue": n[0] || (n[0] = (r) => e.value = r),
         "aria-label": o.model.filterStringPlaceholder,
         placeholder: o.model.filterStringPlaceholder,
         tabindex: o.model.getTabIndex()
-      }, null, 8, Qa), [
+      }, null, 8, Ha), [
         [de, e.value]
       ]),
-      d("div", Oa, [
-        d("div", Ga, w(o.model.matchCounterText), 1),
-        v(s(c), {
+      d("div", Ua, [
+        d("div", Qa, T(o.model.matchCounterText), 1),
+        v(s(u), {
           is: "sv-action-bar",
           model: o.model.searchActionBar
         }, null, 8, ["model"])
       ])
     ])) : p("", !0);
   }
-}), ja = ["title"], Ja = /* @__PURE__ */ g({
+}), Ga = ["title"], Wa = /* @__PURE__ */ g({
   __name: "PageNavigator",
   props: {
     pagesController: {},
     pageEditMode: {}
   },
-  setup(u) {
-    const t = u, e = z(
+  setup(c) {
+    const t = c, e = z(
       () => new Se(t.pagesController, t.pageEditMode),
       [() => t.pagesController, () => t.pageEditMode]
     ), o = P();
     return R(() => {
-      if (t.pageEditMode !== "bypage") {
-        const n = o.value, i = e.value;
-        n && i.attachToUI(n);
-      }
+      const n = o.value, r = e.value;
+      n && r.attachToUI(n);
     }), Y(() => {
       const n = e.value;
       n.stopItemsContainerHeightObserver(), n.setScrollableContainer(void 0);
     }), K(() => {
       e.value.dispose();
-    }), (n, i) => h((a(), r("div", {
+    }), (n, r) => h((a(), i("div", {
       class: "svc-page-navigator",
       ref_key: "root",
       ref: o
     }, [
       d("div", null, [
-        h((a(), r("div", {
+        h((a(), i("div", {
           role: "button",
-          class: m(["svc-page-navigator__selector svc-page-navigator__button", { "svc-page-navigator__button--pressed": s(e).isPopupOpened }]),
-          onClick: i[0] || (i[0] = (l) => s(e).togglePageSelector(l)),
+          class: _(["svc-page-navigator__selector svc-page-navigator__button", { "svc-page-navigator__button--pressed": s(e).isPopupOpened }]),
+          onClick: r[0] || (r[0] = (l) => s(e).togglePageSelector(l)),
           title: s(e).pageSelectorCaption
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             class: "svc-page-navigator__button-icon",
             iconName: s(e).icon,
             size: "auto"
           }, null, 8, ["iconName"])
-        ], 10, ja)), [
+        ], 10, Ga)), [
           [s(M)]
         ]),
-        v(s(c), {
+        v(s(u), {
           is: "sv-popup",
           model: s(e).popupModel
         }, null, 8, ["model"])
       ]),
       d("div", null, [
-        (a(!0), r(T, null, A(s(e).visibleItems, (l) => (a(), b(s(c), {
+        (a(!0), i(D, null, L(s(e).visibleItems, (l) => (a(), b(s(u), {
           is: "svc-page-navigator-item",
           key: l.id,
           model: l
         }, null, 8, ["model"]))), 128))
       ])
     ], 512)), [
-      [H, s(e).visible]
+      [U, s(e).visible]
     ]);
   }
-}), Za = { class: "svc-page-navigator-item" }, Xa = ["title"], Ya = /* @__PURE__ */ d("div", { class: "svc-page-navigator-item__dot-content" }, null, -1), xa = [
-  Ya
-], el = { class: "svc-page-navigator-item__banner" }, ol = { class: "svc-page-navigator-item__text" }, sl = /* @__PURE__ */ d("span", { class: "svc-page-navigator-item__dot" }, [
+}), ja = { class: "svc-page-navigator-item" }, Ja = ["title"], Za = /* @__PURE__ */ d("div", { class: "svc-page-navigator-item__dot-content" }, null, -1), Xa = [
+  Za
+], Ya = { class: "svc-page-navigator-item__banner" }, xa = { class: "svc-page-navigator-item__text" }, el = /* @__PURE__ */ d("span", { class: "svc-page-navigator-item__dot" }, [
   /* @__PURE__ */ d("span", { class: "svc-page-navigator-item__dot-content" })
-], -1), tl = /* @__PURE__ */ g({
+], -1), ol = /* @__PURE__ */ g({
   __name: "PageNavigatorItem",
   props: {
     model: {}
   },
-  setup(u) {
-    const t = u;
+  setup(c) {
+    const t = c;
     $(() => t.model);
     const e = (o) => {
       t.model.action(), o.stopPropagation(), o.preventDefault();
     };
-    return (o, n) => (a(), r("div", Za, [
-      h((a(), r("div", {
+    return (o, n) => (a(), i("div", ja, [
+      h((a(), i("div", {
         role: "button",
-        class: m(["svc-page-navigator-item-content", {
+        class: _(["svc-page-navigator-item-content", {
           "svc-page-navigator-item--selected": o.model.active,
           "svc-page-navigator-item--disabled": o.model.disabled
         }]),
-        onClick: n[0] || (n[0] = (i) => e(i))
+        onClick: n[0] || (n[0] = (r) => e(r))
       }, [
         d("div", {
           class: "svc-page-navigator-item__dot",
           title: o.model.title
-        }, xa, 8, Xa),
-        d("div", el, [
-          d("span", ol, w(o.model.title), 1),
-          sl
+        }, Xa, 8, Ja),
+        d("div", Ya, [
+          d("span", xa, T(o.model.title), 1),
+          el
         ])
       ], 2)), [
         [s(M)]
       ])
     ]));
   }
-}), nl = { class: "svc-question__dropdown-choices--wrapper" }, al = { class: "svc-question__dropdown-choices" }, ll = /* @__PURE__ */ g({
+}), sl = { class: "svc-question__dropdown-choices--wrapper" }, tl = { class: "svc-question__dropdown-choices" }, nl = /* @__PURE__ */ g({
   __name: "Dropdown",
   props: {
     model: {},
     element: {}
   },
-  setup(u) {
-    const t = u, e = (n) => t.element.getItemValueWrapperComponentName(n) || t.model.itemComponent, o = (n) => ({
+  setup(c) {
+    const t = c, e = (n) => t.element.getItemValueWrapperComponentName(n) || t.model.itemComponent, o = (n) => ({
       componentName: t.model.itemComponent,
       componentData: {
         question: t.element,
@@ -3570,19 +3577,19 @@ const Tt = /* @__PURE__ */ g({
         data: t.element.getItemValueWrapperComponentData(n)
       }
     });
-    return (n, i) => (a(), r("div", nl, [
+    return (n, r) => (a(), i("div", sl, [
       d("div", null, [
-        d("div", al, [
-          (a(!0), r(T, null, A(n.model.getRenderedItems(), (l) => (a(), r("div", {
+        d("div", tl, [
+          (a(!0), i(D, null, L(n.model.getRenderedItems(), (l) => (a(), i("div", {
             key: l.value,
-            class: m(n.model.getChoiceCss())
+            class: _(n.model.getChoiceCss())
           }, [
-            v(s(c), V({
+            v(s(u), V({
               is: e(l)
             }, o(l)), null, 16, ["is"])
           ], 2))), 128))
         ]),
-        n.model.needToCollapse ? (a(), b(s(c), {
+        n.model.needToCollapse ? (a(), b(s(u), {
           key: 0,
           is: "svc-action-button",
           text: n.model.getButtonText(),
@@ -3592,14 +3599,14 @@ const Tt = /* @__PURE__ */ g({
       ])
     ]));
   }
-}), il = /* @__PURE__ */ g({
+}), al = /* @__PURE__ */ g({
   __name: "QuestionDropdown",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = () => new Ie(
+  setup(c) {
+    const t = c, e = () => new Ie(
       t.componentData.data,
       t.componentData.element,
       null
@@ -3612,58 +3619,58 @@ const Tt = /* @__PURE__ */ g({
       "adorner-component": "svc-dropdown-question-adorner"
     }, null, 8, ["element", "component-name", "component-data"]));
   }
-}), rl = { class: "svc-question__adorner" }, dl = { class: "svc-question__content svc-question__content--in-popup" }, cl = { class: "svc-question__dropdown-choices" }, le = "survey-radiogroup-item", ul = /* @__PURE__ */ g({
+}), ll = { class: "svc-question__adorner" }, il = { class: "svc-question__content svc-question__content--in-popup" }, rl = { class: "svc-question__dropdown-choices" }, le = "survey-radiogroup-item", dl = /* @__PURE__ */ g({
   __name: "CellQuestionDropdown",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = k(
+  setup(c) {
+    const t = c, e = f(
       () => t.componentData.element
-    ), o = (i) => e.value.getItemValueWrapperComponentName(i) || le, n = (i) => ({
+    ), o = (r) => e.value.getItemValueWrapperComponentName(r) || le, n = (r) => ({
       componentName: le,
       componentData: {
         question: e.value,
-        item: i,
-        data: e.value.getItemValueWrapperComponentData(i)
+        item: r,
+        data: e.value.getItemValueWrapperComponentData(r)
       }
     });
-    return $(() => e.value), (i, l) => (a(), r("div", rl, [
-      d("div", dl, [
-        v(s(c), V({ is: i.componentName }, i.componentData), null, 16, ["is"]),
-        d("div", cl, [
-          (a(!0), r(T, null, A(e.value.visibleChoices, (_) => (a(), r("div", {
-            key: _.value,
+    return $(() => e.value), (r, l) => (a(), i("div", ll, [
+      d("div", il, [
+        v(s(u), V({ is: r.componentName }, r.componentData), null, 16, ["is"]),
+        d("div", rl, [
+          (a(!0), i(D, null, L(e.value.visibleChoices, (m) => (a(), i("div", {
+            key: m.value,
             class: "svc-question__dropdown-choice"
           }, [
-            v(s(c), V({
-              is: o(_)
-            }, n(_)), null, 16, ["is"])
+            v(s(u), V({
+              is: o(m)
+            }, n(m)), null, 16, ["is"])
           ]))), 128))
         ])
       ])
     ]));
   }
-}), pl = ["data-sv-drop-target-survey-element"], vl = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--left" }, null, -1), ml = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--right" }, null, -1), _l = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), gl = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), bl = { class: "svc-widget__content" }, yl = {
+}), ul = ["data-sv-drop-target-survey-element"], cl = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--left" }, null, -1), pl = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--right" }, null, -1), vl = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--top" }, null, -1), ml = /* @__PURE__ */ d("div", { class: "svc-question__drop-indicator svc-question__drop-indicator--bottom" }, null, -1), _l = { class: "svc-widget__content" }, gl = {
   key: 1,
   class: "svc-panel__placeholder_frame"
-}, hl = /* @__PURE__ */ d("div", {
+}, bl = /* @__PURE__ */ d("div", {
   class: "svc-panel__placeholder",
   "data-bind": "text: placeholderText"
-}, null, -1), Cl = [
-  hl
-], ql = { class: "svc-question__content-actions" }, fl = {
+}, null, -1), yl = [
+  bl
+], hl = { class: "svc-question__content-actions" }, Cl = {
   key: 0,
   class: "svc-panel__placeholder_frame"
-}, kl = { class: "svc-panel__placeholder" }, $l = /* @__PURE__ */ g({
+}, ql = { class: "svc-panel__placeholder" }, fl = /* @__PURE__ */ g({
   __name: "CustomWidget",
   props: {
     componentName: {},
     componentData: {}
   },
-  setup(u) {
-    const t = u, e = P(), o = z(
+  setup(c) {
+    const t = c, e = P(), o = z(
       () => new ee(
         t.componentData.data,
         t.componentData.element,
@@ -3674,47 +3681,47 @@ const Tt = /* @__PURE__ */ g({
         n.dispose();
       }
     );
-    return G(() => {
+    return O(() => {
       e.value && o.value && (o.value.rootElement = e.value);
     }), R(() => {
       e.value && o.value && (o.value.rootElement = e.value);
-    }), (n, i) => s(o) ? (a(), r("div", {
+    }), (n, r) => s(o) ? (a(), i("div", {
       key: 0,
-      class: m(["svc-question__adorner", s(o).rootCss()]),
-      onMouseover: i[2] || (i[2] = (l) => s(o).hover(l, l.currentTarget)),
-      onMouseleave: i[3] || (i[3] = (l) => s(o).hover(l, l.currentTarget)),
+      class: _(["svc-question__adorner", s(o).rootCss()]),
+      onMouseover: r[2] || (r[2] = (l) => s(o).hover(l, l.currentTarget)),
+      onMouseleave: r[3] || (r[3] = (l) => s(o).hover(l, l.currentTarget)),
       "data-sv-drop-target-survey-element": s(o).element.name || null,
       ref_key: "root",
       ref: e
     }, [
-      s(o).element.isInteractiveDesignElement ? h((a(), r("div", {
+      s(o).element.isInteractiveDesignElement ? h((a(), i("div", {
         key: 0,
-        class: m(["svc-question__content", s(o).css()]),
-        onClick: i[1] || (i[1] = (l) => s(o).select(s(o), l)),
+        class: _(["svc-question__content", s(o).css()]),
+        onClick: r[1] || (r[1] = (l) => s(o).select(s(o), l)),
         "data-bind": "clickBubble: false"
       }, [
+        cl,
+        pl,
         vl,
         ml,
-        _l,
-        gl,
-        s(o).allowDragging ? (a(), r("div", {
+        s(o).allowDragging ? (a(), i("div", {
           key: 0,
           class: "svc-question__drag-area",
-          onPointerdown: i[0] || (i[0] = (l) => s(o).onPointerDown(l))
+          onPointerdown: r[0] || (r[0] = (l) => s(o).onPointerDown(l))
         }, [
-          v(s(c), {
+          v(s(u), {
             is: "sv-svg-icon",
             class: "svc-question__drag-element",
             iconName: "icon-drag-area-indicator_24x16",
             size: "auto"
           })
         ], 32)) : p("", !0),
-        d("div", bl, [
-          v(s(c), V({ is: n.componentName }, n.componentData), null, 16, ["is"])
+        d("div", _l, [
+          v(s(u), V({ is: n.componentName }, n.componentData), null, 16, ["is"])
         ]),
-        s(o).isEmptyElement ? (a(), r("div", yl, Cl)) : p("", !0),
-        d("div", ql, [
-          v(s(c), {
+        s(o).isEmptyElement ? (a(), i("div", gl, yl)) : p("", !0),
+        d("div", hl, [
+          v(s(u), {
             is: "sv-action-bar",
             model: s(o).actionContainer,
             handleClick: !1
@@ -3723,25 +3730,25 @@ const Tt = /* @__PURE__ */ g({
       ], 2)), [
         [s(M)]
       ]) : p("", !0),
-      s(o).element.isInteractiveDesignElement ? p("", !0) : (a(), r(T, { key: 1 }, [
-        v(s(c), V({ is: n.componentName }, n.componentData), null, 16, ["is"]),
-        s(o).isEmptyElement ? (a(), r("div", fl, [
-          d("div", kl, w(s(o).placeholderText), 1)
+      s(o).element.isInteractiveDesignElement ? p("", !0) : (a(), i(D, { key: 1 }, [
+        v(s(u), V({ is: n.componentName }, n.componentData), null, 16, ["is"]),
+        s(o).isEmptyElement ? (a(), i("div", Cl, [
+          d("div", ql, T(s(o).placeholderText), 1)
         ])) : p("", !0)
       ], 64))
-    ], 42, pl)) : p("", !0);
+    ], 42, ul)) : p("", !0);
   }
-}), wl = { class: "svc-carry-forward-panel-wrapper" }, Tl = { class: "svc-carry-forward-panel" }, Dl = { class: "svc-carry-forward-panel__link" }, Nl = /* @__PURE__ */ g({
+}), kl = { class: "svc-carry-forward-panel-wrapper" }, $l = { class: "svc-carry-forward-panel" }, wl = { class: "svc-carry-forward-panel__link" }, Tl = /* @__PURE__ */ g({
   __name: "QuestionBanner",
   props: {
     model: {}
   },
-  setup(u) {
-    return (t, e) => (a(), r("div", wl, [
-      d("div", Tl, [
-        d("span", null, w(t.model.text) + w(" "), 1),
-        d("span", Dl, [
-          v(s(c), {
+  setup(c) {
+    return (t, e) => (a(), i("div", kl, [
+      d("div", $l, [
+        d("span", null, T(t.model.text) + T(" "), 1),
+        d("span", wl, [
+          v(s(u), {
             is: "svc-action-button",
             text: t.model.actionText,
             click: t.model.onClick.bind(t.model)
@@ -3751,27 +3758,27 @@ const Tt = /* @__PURE__ */ g({
     ]));
   }
 });
-function Ml(u, t, e) {
-  u(t, e);
+function Dl(c, t, e) {
+  c(t, e);
 }
-function pe(u) {
-  const t = Ml.bind(
+function pe(c) {
+  const t = Dl.bind(
     void 0,
-    u
+    c
   );
-  t("svc-tabbed-menu", Ge), t("svc-tabbed-menu-item-wrapper", je), t("svc-tabbed-menu-item", Ze), t("svc-side-bar", eo), t("svc-side-bar-default-header", no), t("svc-side-bar-page", ao), t("svc-tabs", ro), t("svc-tab-control", go), t("svc-tab-button", qo), t("svc-property-grid-placeholder", Do), t("svc-side-bar-header", Eo), t("svc-side-bar-property-grid-header", Fo), t("svc-property-grid", io), t("svc-object-selector", lo), t("svc-search", Wa), t("svc-switcher", Yo), t("svc-action-button", Go), t("svc-question-error", Ko), t("survey-embeddedsurvey", Qs), t("sv-logic-operator", Hs), t("survey-linkvalue", Os), t("survey-color", rt), t("color-item", dt), t("sv-boolean-switch", Tt), t("survey-fileedit", mt), t("survey-spinedit", yt), t("survey-textwithreset", ne), t("survey-commentwithreset", ne), t("survey-widget", O), t("survey-simulator", os), t("svc-tab-preview", rs), t("svc-complete-page", cs), t("survey-results", qs), t("survey-results-table-row", ks), t("json-error-item", Vs), t("svc-tab-json-editor-textarea", Bs), t("svc-tab-json-editor-ace", Ds), t("svc-tab-translation", Zs), t("sd-translation-line-skeleton", ot), t("svc-translate-from-action", st), t("svc-tab-logic", Fs), t("svc-tab-theme", at), t("svc-component-container", ss), t("svc-toolbox", Lt), t("svc-toolbox-list", Xt), t("svc-toolbox-category", Zt), t("svc-toolbox-tool", Kt), t("svc-toolbox-item", Ot), t("svc-toolbox-item-group", Gt), t(Be, Pt), t("svc-tab-designer", cn), t("svc-page-navigator", Ja), t("svc-page-navigator-item", tl), t("svc-page", Cn), t("svc-row", Dn), t("svc-add-new-question-btn", fn), t("svc-add-question-type-selector", $n), t("svc-question", ae), t("svc-rating-question", ae), t("svc-rating-question-content", jn), t("svc-image-question", zn), t("svc-image-question-adorner", Qn), t("svc-matrix-cell", Zn), t("svc-cell-question", xn), t("svc-cell-dropdown-question", ul), t("svc-question-editor-content", Ra), t("svc-logo-image", Ka), t("svc-panel", ma), t("svc-item-value", fa), t("svc-image-item-value", Pa), t("svc-dropdown-question", il), t("svc-dropdown-question-adorner", ll), t("svc-widget-question", $l), t("svc-question-banner", Nl);
+  t("svc-tabbed-menu", Ge), t("svc-tabbed-menu-item-wrapper", je), t("svc-tabbed-menu-item", Ze), t("svc-side-bar", eo), t("svc-side-bar-default-header", no), t("svc-side-bar-page", ao), t("svc-tabs", ro), t("svc-tab-control", go), t("svc-tab-button", qo), t("svc-property-grid-placeholder", Do), t("svc-side-bar-header", Eo), t("svc-side-bar-property-grid-header", Fo), t("svc-property-grid", io), t("svc-object-selector", lo), t("svc-search", Oa), t("svc-switcher", Yo), t("svc-action-button", Go), t("svc-question-error", Ko), t("survey-embeddedsurvey", Hs), t("sv-logic-operator", Ks), t("survey-linkvalue", Us), t("survey-color", lt), t("color-item", it), t("sv-boolean-switch", $t), t("survey-fileedit", pt), t("survey-spinedit", gt), t("survey-textwithreset", ne), t("survey-commentwithreset", ne), t("survey-widget", G), t("survey-simulator", xo), t("svc-tab-preview", ls), t("svc-complete-page", rs), t("survey-results", hs), t("survey-results-table-row", qs), t("json-error-item", Ps), t("svc-tab-json-editor-textarea", Ss), t("svc-tab-json-editor-ace", ws), t("svc-tab-translation", js), t("sd-translation-line-skeleton", xs), t("svc-translate-from-action", et), t("svc-tab-logic", Ls), t("svc-tab-theme", tt), t("svc-component-container", es), t("svc-toolbox", At), t("svc-toolbox-list", Jt), t("svc-toolbox-category", jt), t("svc-toolbox-tool", zt), t("svc-toolbox-item", Ut), t("svc-toolbox-item-group", Qt), t(Be, Bt), t("svc-tab-designer", rn), t("svc-page-navigator", Wa), t("svc-page-navigator-item", ol), t("svc-page", yn), t("svc-row", wn), t("svc-add-new-question-btn", Cn), t("svc-add-question-type-selector", fn), t("svc-question", ae), t("svc-rating-question", ae), t("svc-rating-question-content", Gn), t("svc-image-question", Vn), t("svc-image-question-adorner", Hn), t("svc-matrix-cell", jn), t("svc-cell-question", Xn), t("svc-cell-dropdown-question", dl), t("svc-question-editor-content", Ea), t("svc-logo-image", za), t("svc-panel", pa), t("svc-item-value", Ca), t("svc-image-item-value", Ba), t("svc-dropdown-question", al), t("svc-dropdown-question-adorner", nl), t("svc-widget-question", fl), t("svc-question-banner", Tl);
 }
 pe(
-  (u, t) => ie.Instance.registerComponent(u, t)
+  (c, t) => ie.Instance.registerComponent(c, t)
 );
-const Pl = {
-  install(u) {
-    u.component("SurveyCreatorComponent", Oe), pe((t, e) => {
-      u.component(t, e), ie.Instance.registerComponent(t, t);
+const Bl = {
+  install(c) {
+    c.component("SurveyCreatorComponent", Oe), pe((t, e) => {
+      c.component(t, e), ie.Instance.registerComponent(t, t);
     });
   }
 };
 export {
   Oe as SurveyCreatorComponent,
-  Pl as surveyCreatorPlugin
+  Bl as surveyCreatorPlugin
 };