survey-vue3-ui 1.10.1 → 1.10.2

package/survey-vue3-ui.es.js

@@ -1,7 +1,7 @@
-import { shallowReactive as Ce, watch as K, onBeforeUnmount as G, onMounted as M, ref as T, shallowRef as U, watchEffect as be, triggerRef as se, unref as w, isRef as ke, defineComponent as h, computed as I, resolveComponent as y, openBlock as i, createElementBlock as u, normalizeClass as a, createVNode as C, createCommentVNode as d, Fragment as _, renderList as D, createBlock as g, resolveDynamicComponent as $, normalizeProps as z, mergeProps as E, withCtx as F, normalizeStyle as S, createElementVNode as p, onUnmounted as O, guardReactiveProps as ne, withDirectives as P, vShow as H, toDisplayString as R, vModelRadio as x, vModelCheckbox as oe, vModelSelect as fe, onUpdated as te, vModelText as we, getCurrentInstance as ie, createStaticVNode as Ie, resolveDirective as X, toRaw as Se, Teleport as Re, useSlots as Te, renderSlot as $e } from "vue";
-import { Base as _e, RendererFactory as ee, DropdownListModel as De, Helpers as Be, DropdownMultiSelectListModel as Le, doKey2ClickUp as ye, createSvg as Ne, ActionDropdownViewModel as Pe, getActionDropdownButtonTarget as Ae, createPopupViewModel as Me, SurveyProgressModel as de, ProgressButtonsResponsivityManager as He, PopupSurveyModel as Ee, settings as Q, createDialogOptions as We, createPopupModalViewModel as Ve, ButtonGroupItemModel as Fe, SvgRegistry as Oe, SurveyModel as ze, doKey2ClickDown as Ue, doKey2ClickBlur as Ke } from "survey-core";
+import { shallowReactive as Ce, watch as K, onBeforeUnmount as G, onMounted as M, ref as $, shallowRef as U, watchEffect as be, triggerRef as se, unref as w, isRef as ke, defineComponent as h, computed as I, resolveComponent as y, openBlock as i, createElementBlock as u, normalizeClass as a, createVNode as C, createCommentVNode as d, Fragment as _, renderList as D, createBlock as g, resolveDynamicComponent as T, normalizeProps as z, mergeProps as H, withCtx as F, normalizeStyle as S, createElementVNode as p, onUnmounted as O, guardReactiveProps as ne, withDirectives as P, vShow as E, toDisplayString as R, vModelRadio as x, vModelCheckbox as oe, vModelSelect as fe, onUpdated as te, vModelText as we, getCurrentInstance as ie, createStaticVNode as Ie, resolveDirective as X, toRaw as Se, Teleport as Re, useSlots as Te, renderSlot as $e } from "vue";
+import { Base as _e, RendererFactory as ee, DropdownListModel as De, Helpers as Be, DropdownMultiSelectListModel as Le, doKey2ClickUp as ye, createSvg as Ne, ActionDropdownViewModel as Pe, getActionDropdownButtonTarget as Ae, createPopupViewModel as Me, SurveyProgressModel as de, ProgressButtonsResponsivityManager as Ee, PopupSurveyModel as He, settings as j, createDialogOptions as We, createPopupModalViewModel as Ve, ButtonGroupItemModel as Fe, SvgRegistry as Oe, SurveyModel as ze, doKey2ClickDown as Ue, doKey2ClickBlur as Ke } from "survey-core";
 _e.createPropertiesHash = () => Ce({});
-function je(r) {
+function Qe(r) {
   var s;
   !r || (r.__vueImplemented = (s = r.__vueImplemented) != null ? s : 0, r.__vueImplemented <= 0 && (r.createArrayCoreHandler = (n, e) => {
     const o = [], t = U(o);
@@ -29,7 +29,7 @@ function B(r, s, n) {
   const e = K(
     r,
     (o, t) => {
-      o && s && s(o, t), t && (me(t), n && n(t)), je(o);
+      o && s && s(o, t), t && (me(t), n && n(t)), Qe(o);
     },
     {
       immediate: !0
@@ -48,7 +48,7 @@ function A(r, s, n, e) {
   });
 }
 function J(r) {
-  const s = T(), n = (o) => {
+  const s = $(), n = (o) => {
     s.value = o.renderedHtml, o.onChanged = () => {
       s.value = o.renderedHtml;
     };
@@ -75,7 +75,7 @@ function le(r) {
     n();
   }), s;
 }
-const Qe = /* @__PURE__ */ h({
+const je = /* @__PURE__ */ h({
   __name: "Page",
   props: {
     survey: {},
@@ -83,7 +83,7 @@ const Qe = /* @__PURE__ */ h({
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = () => {
+    const s = r, n = $(null), e = () => {
       s.survey && n.value && s.survey.afterRenderPage(n.value);
     }, o = I(() => s.page._showDescription);
     return B(
@@ -113,7 +113,7 @@ const Qe = /* @__PURE__ */ h({
           }, null, 8, ["locString"])
         ], 2)) : d("", !0),
         C(c, { element: t.page }, null, 8, ["element"]),
-        (i(!0), u(_, null, D(t.page.visibleRows, (f) => (i(), g($(t.page.getSurvey().getRowWrapperComponentName(f)), z(E({
+        (i(!0), u(_, null, D(t.page.visibleRows, (f) => (i(), g(T(t.page.getSurvey().getRowWrapperComponentName(f)), z(H({
           key: f.id
         }, {
           componentData: t.page.getSurvey().getRowWrapperComponentData(f)
@@ -136,7 +136,7 @@ const Qe = /* @__PURE__ */ h({
     survey: {}
   },
   setup(r) {
-    const s = r, n = T();
+    const s = r, n = $();
     return M(() => {
       var e = n.value;
       e && s.survey && s.survey.afterRenderHeader(e);
@@ -148,7 +148,7 @@ const Qe = /* @__PURE__ */ h({
         ref_key: "root",
         ref: n
       }, [
-        e.survey.isLogoBefore ? (i(), g($(e.survey.getElementWrapperComponentName(e.survey, "logo-image")), {
+        e.survey.isLogoBefore ? (i(), g(T(e.survey.getElementWrapperComponentName(e.survey, "logo-image")), {
           key: 0,
           data: e.survey.getElementWrapperComponentData(e.survey, "logo-image")
         }, null, 8, ["data"])) : d("", !0),
@@ -170,7 +170,7 @@ const Qe = /* @__PURE__ */ h({
             }, null, 8, ["locString"])
           ], 2)) : d("", !0)
         ], 6)) : d("", !0),
-        e.survey.isLogoAfter ? (i(), g($(e.survey.getElementWrapperComponentName(e.survey, "logo-image")), {
+        e.survey.isLogoAfter ? (i(), g(T(e.survey.getElementWrapperComponentName(e.survey, "logo-image")), {
           key: 2,
           data: e.survey.getElementWrapperComponentData(e.survey, "logo-image")
         }, null, 8, ["data"])) : d("", !0),
@@ -188,7 +188,7 @@ const Qe = /* @__PURE__ */ h({
     survey: {}
   },
   setup(r) {
-    const s = r, n = T();
+    const s = r, n = $();
     return B(
       () => s.row,
       (e, o) => {
@@ -231,7 +231,7 @@ const Qe = /* @__PURE__ */ h({
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = I(() => s.element.showErrorOnTop), o = I(() => s.element.showErrorOnBottom), t = (k) => k.cssContent, l = () => s.element.getRootStyle();
+    const s = r, n = $(null), e = I(() => s.element.showErrorOnTop), o = I(() => s.element.showErrorOnBottom), t = (k) => k.cssContent, l = () => s.element.getRootStyle();
     B(() => s.element);
     const m = () => {
       n.value && s.element.afterRender(n.value);
@@ -255,7 +255,7 @@ const Qe = /* @__PURE__ */ h({
         style: S(l()),
         ref_key: "root",
         ref: n,
-        onFocusin: L[0] || (L[0] = (j) => k.element.focusIn()),
+        onFocusin: L[0] || (L[0] = (Q) => k.element.focusIn()),
         id: k.element.id,
         role: k.element.ariaRole,
         "aria-required": k.element.ariaRequired,
@@ -275,7 +275,7 @@ const Qe = /* @__PURE__ */ h({
           element: k.element,
           css: k.css
         }, null, 8, ["element", "css"])) : d("", !0),
-        (i(), g($(q.value), z(ne(f.value)), {
+        (i(), g(T(q.value), z(ne(f.value)), {
           default: F(() => [
             P(p("div", {
               class: a(t(k.element) || void 0),
@@ -286,7 +286,7 @@ const Qe = /* @__PURE__ */ h({
                 element: k.element,
                 location: "top"
               }, null, 8, ["element"])) : d("", !0),
-              (i(), g($(c.value), { question: k.element }, null, 8, ["question"])),
+              (i(), g(T(c.value), { question: k.element }, null, 8, ["question"])),
               k.element.hasComment ? (i(), u("div", {
                 key: 1,
                 class: a(k.element.getCommentAreaCss())
@@ -313,7 +313,7 @@ const Qe = /* @__PURE__ */ h({
                 }, null, 8, ["locString"])
               ], 10, Ye)) : d("", !0)
             ], 2), [
-              [H, k.element.renderedIsExpanded]
+              [E, k.element.renderedIsExpanded]
             ])
           ]),
           _: 1
@@ -343,7 +343,7 @@ const Qe = /* @__PURE__ */ h({
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = I(() => s.element.survey);
+    const s = r, n = $(null), e = I(() => s.element.survey);
     return B(() => s.element), M(() => {
       s.element.survey && s.element.survey.afterRenderPanel(s.element, n.value);
     }), (o, t) => {
@@ -375,7 +375,7 @@ const Qe = /* @__PURE__ */ h({
           style: S({ paddingLeft: o.element.innerPaddingLeft }),
           class: a(o.element.cssClasses.panel.content)
         }, [
-          (i(!0), u(_, null, D(o.element.visibleRows, (q) => (i(), g($(o.element.getSurvey().getRowWrapperComponentName(q)), z(E({
+          (i(!0), u(_, null, D(o.element.visibleRows, (q) => (i(), g(T(o.element.getSurvey().getRowWrapperComponentName(q)), z(H({
             key: q.id
           }, {
             componentData: o.element.getSurvey().getRowWrapperComponentData(q)
@@ -425,7 +425,7 @@ const Qe = /* @__PURE__ */ h({
             locString: e.element.locDescription
           }, null, 8, ["locString"])
         ], 10, ts)), [
-          [H, e.element.hasDescription]
+          [E, e.element.hasDescription]
         ]) : d("", !0),
         e.element.hasAdditionalTitleToolbar ? (i(), g(m, {
           key: 1,
@@ -440,7 +440,7 @@ const Qe = /* @__PURE__ */ h({
     locString: {}
   },
   setup(r) {
-    return (s, n) => (i(), g($(s.locString.renderAs), {
+    return (s, n) => (i(), g(T(s.locString.renderAs), {
       locString: s.locString.renderAsData
     }, null, 8, ["locString"]));
   }
@@ -506,7 +506,7 @@ const Qe = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       const t = y("survey-text-input");
       return e.question.isReadOnlyRenderDiv() ? (i(), u("div", {
@@ -542,7 +542,7 @@ const Qe = /* @__PURE__ */ h({
   setup(r, { expose: s }) {
     const n = r, e = function(l) {
       n.getRef && n.getRef(l);
-    }, o = T(null);
+    }, o = $(null);
     s({ root: o }), B(() => n.question);
     const t = I(() => n.question.inputStyle);
     return (l, m) => {
@@ -626,7 +626,7 @@ const Qe = /* @__PURE__ */ h({
     showLegend: { type: Boolean }
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = (t) => s.question.getItemValueWrapperComponentName(t) || s.question.itemComponent, o = (t) => ({
       componentName: s.question.itemComponent,
@@ -651,17 +651,17 @@ const Qe = /* @__PURE__ */ h({
         "aria-errormessage": t.question.a11y_input_ariaErrormessage
       }, [
         t.showLegend ? (i(), u("legend", bs, R(t.question.locTitle.renderedHtml), 1)) : d("", !0),
-        t.question.hasHeadItems ? (i(!0), u(_, { key: 1 }, D(t.question.headItems, (v) => (i(), g($(e(v)), E({
+        t.question.hasHeadItems ? (i(!0), u(_, { key: 1 }, D(t.question.headItems, (v) => (i(), g(T(e(v)), H({
           key: v.value
         }, o(v)), null, 16))), 128)) : d("", !0),
-        !t.question.hasColumns && !t.question.blockedRow ? (i(!0), u(_, { key: 2 }, D(t.question.bodyItems, (v) => (i(), g($(e(v)), E({
+        !t.question.hasColumns && !t.question.blockedRow ? (i(!0), u(_, { key: 2 }, D(t.question.bodyItems, (v) => (i(), g(T(e(v)), H({
           key: v.value
         }, o(v)), null, 16))), 128)) : d("", !0),
         t.question.blockedRow ? (i(), u("div", {
           key: 3,
           class: a(t.question.cssClasses.rootRow)
         }, [
-          !t.question.hasColumns && t.question.blockedRow ? (i(!0), u(_, { key: 0 }, D(t.question.dataChoices, (v) => (i(), g($(e(v)), E({
+          !t.question.hasColumns && t.question.blockedRow ? (i(!0), u(_, { key: 0 }, D(t.question.dataChoices, (v) => (i(), g(T(e(v)), H({
             key: v.value
           }, o(v)), null, 16))), 128)) : d("", !0)
         ], 2)) : d("", !0),
@@ -674,12 +674,12 @@ const Qe = /* @__PURE__ */ h({
             class: a(t.question.getColumnClass()),
             role: "presentation"
           }, [
-            (i(!0), u(_, null, D(v, (q) => (i(), g($(e(q)), E({
+            (i(!0), u(_, null, D(v, (q) => (i(), g(T(e(q)), H({
               key: q.value
             }, o(q)), null, 16))), 128))
           ], 2))), 128)) : d("", !0)
         ], 2)) : d("", !0),
-        t.question.hasFootItems ? (i(!0), u(_, { key: 5 }, D(t.question.footItems, (v) => (i(), g($(e(v)), E({
+        t.question.hasFootItems ? (i(!0), u(_, { key: 5 }, D(t.question.footItems, (v) => (i(), g(T(e(v)), H({
           key: v.value
         }, o(v)), null, 16))), 128)) : d("", !0),
         t.question.renderedValue && t.question.isOtherSelected ? (i(), g(m, {
@@ -851,7 +851,7 @@ const Qe = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       const t = y("survey-string"), l = y("sv-svg-icon"), m = y("sv-loading-indicator");
       return i(), u("div", {
@@ -869,7 +869,7 @@ const Qe = /* @__PURE__ */ h({
             locString: e.question.locRenderedPlaceholder
           }, null, 8, ["locString"])
         ], 2), [
-          [H, e.question.needShowPlaceholder()]
+          [E, e.question.needShowPlaceholder()]
         ]),
         p("div", null, [
           e.question.backgroundImage ? (i(), u("img", {
@@ -922,7 +922,7 @@ const Qe = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = J(() => s.question.locHtml);
     return (o, t) => (i(), u("div", {
@@ -932,14 +932,14 @@ const Qe = /* @__PURE__ */ h({
       innerHTML: w(e)
     }, null, 10, As));
   }
-}), Hs = ["src", "alt", "width", "height"], Es = ["src", "width", "height"], Ws = ["src", "width", "height"], Vs = /* @__PURE__ */ h({
+}), Es = ["src", "alt", "width", "height"], Hs = ["src", "width", "height"], Ws = ["src", "width", "height"], Vs = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "Image",
   props: {
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = J(() => s.question.locImageLink);
     return (o, t) => {
@@ -967,8 +967,8 @@ const Qe = /* @__PURE__ */ h({
           onError: t[1] || (t[1] = (m) => {
             o.question.onErrorHandler();
           })
-        }, null, 46, Hs)), [
-          [H, w(e) && !o.question.contentNotLoaded]
+        }, null, 46, Es)), [
+          [E, w(e) && !o.question.contentNotLoaded]
         ]) : d("", !0),
         o.question.renderedMode === "video" ? P((i(), u("video", {
           key: 1,
@@ -988,8 +988,8 @@ const Qe = /* @__PURE__ */ h({
           onError: t[3] || (t[3] = (m) => {
             o.question.onErrorHandler();
           })
-        }, null, 46, Es)), [
-          [H, w(e) && !o.question.contentNotLoaded]
+        }, null, 46, Hs)), [
+          [E, w(e) && !o.question.contentNotLoaded]
         ]) : d("", !0),
         o.question.renderedMode === "youtube" ? (i(), u("iframe", {
           key: 2,
@@ -1022,7 +1022,7 @@ const Qe = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => (i(), u("div", {
       class: a(e.question.cssClasses.root),
       ref_key: "root",
@@ -1036,7 +1036,7 @@ const Qe = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       const t = y("survey-string"), l = y("sv-file-choose-btn"), m = y("sv-action-bar"), v = y("sv-file-clean-btn"), c = y("sv-loading-indicator"), q = y("sv-file-video"), f = y("sv-file-preview");
       return i(), u("div", {
@@ -1136,14 +1136,14 @@ const Qe = /* @__PURE__ */ h({
       ], 2);
     };
   }
-}), Ks = { class: "sv-hidden" }, ce = "survey-imagepicker-item", js = /* @__PURE__ */ h({
+}), Ks = { class: "sv-hidden" }, ce = "survey-imagepicker-item", Qs = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "Imagepicker",
   props: {
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = (t) => s.question.getItemValueWrapperComponentName(t) || ce, o = (t) => ({
       componentName: ce,
@@ -1159,7 +1159,7 @@ const Qe = /* @__PURE__ */ h({
       ref: n
     }, [
       p("legend", Ks, R(t.question.locTitle.renderedHtml), 1),
-      t.question.hasColumns ? d("", !0) : (i(!0), u(_, { key: 0 }, D(t.question.visibleChoices, (m) => (i(), g($(e(m)), E({
+      t.question.hasColumns ? d("", !0) : (i(!0), u(_, { key: 0 }, D(t.question.visibleChoices, (m) => (i(), g(T(e(m)), H({
         key: m.value
       }, o(m)), null, 16))), 128)),
       t.question.hasColumns ? (i(!0), u(_, { key: 1 }, D(t.question.columns, (m, v) => (i(), u("div", {
@@ -1167,13 +1167,13 @@ const Qe = /* @__PURE__ */ h({
         key: v,
         role: "presentation"
       }, [
-        (i(!0), u(_, null, D(m, (c) => (i(), g($(e(c)), E({
+        (i(!0), u(_, null, D(m, (c) => (i(), g(T(e(c)), H({
           key: c.value
         }, o(c)), null, 16))), 128))
       ], 2))), 128)) : d("", !0)
     ], 2));
   }
-}), Qs = ["name", "value", "id", "disabled", "aria-required", "aria-label", "aria-invalid", "aria-errormessage"], Gs = ["name", "value", "id", "disabled", "aria-required", "aria-label", "aria-invalid", "aria-errormessage"], Js = ["src", "width", "height", "alt"], Xs = ["src", "width", "height"], Ys = /* @__PURE__ */ h({
+}), js = ["name", "value", "id", "disabled", "aria-required", "aria-label", "aria-invalid", "aria-errormessage"], Gs = ["name", "value", "id", "disabled", "aria-required", "aria-label", "aria-invalid", "aria-errormessage"], Js = ["src", "width", "height", "alt"], Xs = ["src", "width", "height"], Ys = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "ImagepickerItem",
   props: {
@@ -1205,7 +1205,7 @@ const Qe = /* @__PURE__ */ h({
             "aria-invalid": o.question.ariaInvalid,
             "aria-errormessage": o.question.ariaErrormessage,
             class: a(o.question.cssClasses.itemControl)
-          }, null, 10, Qs)), [
+          }, null, 10, js)), [
             [oe, o.question.value]
           ]) : P((i(), u("input", {
             key: 1,
@@ -1307,7 +1307,7 @@ const Qe = /* @__PURE__ */ h({
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = (o) => {
       const t = s.question;
@@ -1390,7 +1390,7 @@ const Qe = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       const t = y("sv-dropdown"), l = y("survey-other-choice");
       return i(), u("div", {
@@ -1422,7 +1422,7 @@ const rn = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = (l) => {
       s.question.onClick(l);
@@ -1511,7 +1511,7 @@ const rn = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = I(() => {
+    const s = r, n = $(null), e = I(() => {
       const b = s.question;
       return b.dropdownListModel || (b.dropdownListModel = new De(b)), s.question.dropdownListModel;
     }), o = (b) => {
@@ -1543,7 +1543,7 @@ const rn = /* @__PURE__ */ h({
       () => s.question.showSelectedItemLocText
     ), L = I(() => s.question.selectedItemLocText);
     return B(() => e.value), te(v), M(v), (b, N) => {
-      const W = y("survey-string"), V = y("sv-svg-icon"), j = y("sv-popup");
+      const W = y("survey-string"), V = y("sv-svg-icon"), Q = y("sv-popup");
       return i(), u("div", {
         class: a(b.question.cssClasses.selectWrapper),
         onClick: o
@@ -1586,7 +1586,7 @@ const rn = /* @__PURE__ */ h({
               p("span", dn, R(e.value.inputStringRendered), 1),
               p("span", null, R(e.value.hintStringSuffix), 1)
             ], 2)) : d("", !0),
-            b.question.showInputFieldComponent ? (i(), g($(b.question.inputFieldComponentName), {
+            b.question.showInputFieldComponent ? (i(), g(T(b.question.inputFieldComponentName), {
               key: 2,
               item: e.value.getSelectedAction(),
               question: b.question
@@ -1628,7 +1628,7 @@ const rn = /* @__PURE__ */ h({
               size: "auto"
             }, null, 8, ["class", "iconName", "title"])
           ], 2)), [
-            [H, b.question.showClearButton]
+            [E, b.question.showClearButton]
           ]) : d("", !0)
         ], 42, un)),
         b.question.isReadOnly ? (i(), u("div", {
@@ -1642,7 +1642,7 @@ const rn = /* @__PURE__ */ h({
             locString: b.question.selectedItemLocText
           }, null, 8, ["locString"])) : d("", !0),
           p("div", null, R(b.question.readOnlyText), 1)
-        ], 10, cn)) : (i(), g(j, {
+        ], 10, cn)) : (i(), g(Q, {
           key: 1,
           model: b.question.dropdownListModel.popupModel
         }, null, 8, ["model"])),
@@ -1668,7 +1668,7 @@ const rn = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       const t = y("sv-tagbox"), l = y("survey-other-choice");
       return i(), u("div", {
@@ -1759,7 +1759,7 @@ const rn = /* @__PURE__ */ h({
               size: "auto"
             }, null, 8, ["class", "iconName", "title"])
           ], 2)), [
-            [H, c.question.showClearButton]
+            [E, c.question.showClearButton]
           ]) : d("", !0)
         ], 42, qn)),
         c.question.isReadOnly ? (i(), u("div", {
@@ -1903,7 +1903,7 @@ const rn = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = (t) => s.question.getItemValueWrapperComponentName(t) || "survey-ranking-item", o = (t, l, m) => ({
       componentName: s.question.getPropertyByName("itemComponent").isDefaultValue(
@@ -1924,7 +1924,7 @@ const rn = /* @__PURE__ */ h({
         ref_key: "root",
         ref: n
       }, [
-        t.question.selectToRankEnabled ? d("", !0) : (i(!0), u(_, { key: 0 }, D(t.question.rankingChoices, (v, c) => (i(), g($(e(v)), E({
+        t.question.selectToRankEnabled ? d("", !0) : (i(!0), u(_, { key: 0 }, D(t.question.rankingChoices, (v, c) => (i(), g(T(e(v)), H({
           key: v.value + "-" + c + "-item"
         }, o(v, c)), null, 16))), 128)),
         t.question.selectToRankEnabled ? (i(), u("div", {
@@ -1932,7 +1932,7 @@ const rn = /* @__PURE__ */ h({
           class: a(t.question.getContainerClasses("from")),
           "data-ranking": "from-container"
         }, [
-          (i(!0), u(_, null, D(t.question.unRankingChoices, (v, c) => (i(), g($(e(v)), E({
+          (i(!0), u(_, null, D(t.question.unRankingChoices, (v, c) => (i(), g(T(e(v)), H({
             key: v.value + "-" + c + "-item"
           }, o(v, c, !0)), null, 16))), 128)),
           t.question.unRankingChoices.length === 0 ? (i(), u("div", {
@@ -1953,7 +1953,7 @@ const rn = /* @__PURE__ */ h({
           class: a(t.question.getContainerClasses("to")),
           "data-ranking": "to-container"
         }, [
-          (i(!0), u(_, null, D(t.question.rankingChoices, (v, c) => (i(), g($(e(v)), E({
+          (i(!0), u(_, null, D(t.question.rankingChoices, (v, c) => (i(), g(T(e(v)), H({
             key: v.value + "-" + c + "-item"
           }, o(v, c)), null, 16))), 128)),
           t.question.rankingChoices.length === 0 ? (i(), u("div", {
@@ -2068,7 +2068,7 @@ const rn = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = (o) => s.question.getInputId(o);
     return (o, t) => {
@@ -2088,7 +2088,7 @@ const rn = /* @__PURE__ */ h({
               locString: o.question.locMinRateDescription
             }, null, 8, ["locString"])
           ], 2)) : d("", !0),
-          (i(!0), u(_, null, D(o.question.renderedRateItems, (m, v) => (i(), g($(o.question.itemComponent), {
+          (i(!0), u(_, null, D(o.question.renderedRateItems, (m, v) => (i(), g(T(o.question.itemComponent), {
             key: e(v),
             item: m,
             index: v,
@@ -2185,7 +2185,7 @@ const rn = /* @__PURE__ */ h({
       ], 38);
     };
   }
-}), Hn = ["name", "id", "value", "disabled", "aria-required", "aria-label", "aria-invalid", "aria-errormessage"], En = /* @__PURE__ */ h({
+}), En = ["name", "id", "value", "disabled", "aria-required", "aria-label", "aria-invalid", "aria-errormessage"], Hn = /* @__PURE__ */ h({
   __name: "RatingItemStar",
   props: {
     question: {},
@@ -2215,7 +2215,7 @@ const rn = /* @__PURE__ */ h({
           "aria-label": n.question.ariaLabel,
           "aria-invalid": n.question.ariaInvalid,
           "aria-errormessage": n.question.ariaErrormessage
-        }, null, 8, Hn),
+        }, null, 8, En),
         C(o, {
           class: a("sv-star"),
           iconName: n.question.itemStarIcon,
@@ -2266,7 +2266,7 @@ const zn = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       const t = y("sv-dropdown");
       return i(), u("div", {
@@ -2285,7 +2285,7 @@ const zn = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = (t, l) => {
       s.question.onLabelClick(t, l);
@@ -2374,14 +2374,14 @@ ee.Instance.registerRenderer(
   "radio",
   "sv-boolean-radio"
 );
-const jn = /* @__PURE__ */ h({
+const Qn = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "BooleanRadio",
   props: {
     question: {}
   },
   setup(r) {
-    const s = T(null);
+    const s = $(null);
     return A(r, s), (e, o) => {
       const t = y("sv-boolean-radio-item");
       return i(), u("div", {
@@ -2415,7 +2415,7 @@ const jn = /* @__PURE__ */ h({
       ], 2);
     };
   }
-}), Qn = ["name", "value", "checked", "aria-errormessage", "disabled"], Gn = ["xlink:href"], Jn = /* @__PURE__ */ h({
+}), jn = ["name", "value", "checked", "aria-errormessage", "disabled"], Gn = ["xlink:href"], Jn = /* @__PURE__ */ h({
   __name: "BooleanRadioItem",
   props: {
     question: {},
@@ -2445,7 +2445,7 @@ const jn = /* @__PURE__ */ h({
             disabled: e.question.isInputReadOnly,
             class: a(e.question.cssClasses.itemRadioControl),
             onChange: n
-          }, null, 42, Qn),
+          }, null, 42, jn),
           e.question.cssClasses.materialRadioDecorator ? (i(), u("span", {
             key: 0,
             class: a(e.question.cssClasses.materialRadioDecorator)
@@ -2482,7 +2482,7 @@ const so = /* @__PURE__ */ h({
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       var v;
       const t = y("survey-element-title-content"), l = y("sv-title-actions"), m = y("survey-string");
@@ -2563,7 +2563,7 @@ const so = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = le(() => s.question.getRows());
+    const s = r, n = $(null), e = le(() => s.question.getRows());
     return A(s, n), (o, t) => {
       const l = y("survey-multipletext-item");
       return i(), u("table", {
@@ -2636,7 +2636,7 @@ const so = /* @__PURE__ */ h({
           class: a(o.question.getItemCss()),
           onFocusin: t[0] || (t[0] = (v) => e.value.focusIn())
         }, [
-          (i(), g($(n(e.value.editor)), {
+          (i(), g(T(n(e.value.editor)), {
             question: e.value.editor
           }, null, 8, ["question"]))
         ], 34))
@@ -2650,7 +2650,7 @@ const so = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = U();
+    const s = r, n = $(null), e = U();
     A(
       s,
       n,
@@ -2690,7 +2690,7 @@ const so = /* @__PURE__ */ h({
                     width: t.question.columnMinWidth
                   })
                 }, [
-                  (i(), g($(t.question.getColumnHeaderWrapperComponentName(v)), {
+                  (i(), g(T(t.question.getColumnHeaderWrapperComponentName(v)), {
                     componentData: t.question.getColumnHeaderWrapperComponentData(v)
                   }, {
                     default: F(() => [
@@ -2715,7 +2715,7 @@ const so = /* @__PURE__ */ h({
                     width: t.question.rowTitleWidth
                   })
                 }, [
-                  (i(), g($(t.question.getRowHeaderWrapperComponentName(v)), {
+                  (i(), g(T(t.question.getRowHeaderWrapperComponentName(v)), {
                     componentData: t.question.getRowHeaderWrapperComponentData(v)
                   }, {
                     default: F(() => [
@@ -2726,7 +2726,7 @@ const so = /* @__PURE__ */ h({
                     _: 2
                   }, 1032, ["componentData"]))
                 ], 6), [
-                  [H, t.question.hasRows]
+                  [E, t.question.hasRows]
                 ]),
                 t.question.hasCellText ? (i(!0), u(_, { key: 0 }, D(t.question.visibleColumns, (q, f) => (i(), u("td", {
                   key: f,
@@ -2743,7 +2743,7 @@ const so = /* @__PURE__ */ h({
                   class: a(t.question.cssClasses.cell),
                   onClick: (k) => o(v, q)
                 }, [
-                  (i(), g($(t.question.cellComponent), {
+                  (i(), g(T(t.question.cellComponent), {
                     question: t.question,
                     row: v,
                     column: q,
@@ -2764,7 +2764,7 @@ const so = /* @__PURE__ */ h({
     row: {}
   },
   setup(r) {
-    const s = r, n = T();
+    const s = r, n = $();
     B(() => s.row);
     const e = K(
       () => s.row,
@@ -2858,7 +2858,7 @@ const so = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     return A(s, n), (e, o) => {
       const t = y("survey-matrixtable");
       return i(), g(t, {
@@ -2905,7 +2905,7 @@ const so = /* @__PURE__ */ h({
                   class: a(c.className),
                   style: S({ minWidth: c.minWidth, width: c.width })
                 }, [
-                  (i(), g($(e.question.getColumnHeaderWrapperComponentName(c)), {
+                  (i(), g(T(e.question.getColumnHeaderWrapperComponentName(c)), {
                     componentData: e.question.getColumnHeaderWrapperComponentData(c)
                   }, {
                     default: F(() => [
@@ -2972,7 +2972,7 @@ const so = /* @__PURE__ */ h({
     cell: {}
   },
   setup(r) {
-    const s = r, n = T(!1), e = T(), o = () => s.cell.headers, t = () => !!s.cell.width || !!s.cell.minWidth ? { width: s.cell.width, minWidth: s.cell.minWidth } : null, l = () => n.value = s.cell.question.isVisible, m = (q) => re(q);
+    const s = r, n = $(!1), e = $(), o = () => s.cell.headers, t = () => !!s.cell.width || !!s.cell.minWidth ? { width: s.cell.width, minWidth: s.cell.minWidth } : null, l = () => n.value = s.cell.question.isVisible, m = (q) => re(q);
     M(() => {
       if (!s.cell.hasQuestion || !s.question || !s.question.survey)
         return;
@@ -3014,7 +3014,7 @@ const so = /* @__PURE__ */ h({
       }
     });
     return (q, f) => {
-      const k = y("survey-errors"), L = y("sv-matrix-drag-drop-icon"), b = y("sv-action-bar"), N = y("survey-radiogroup-item"), W = y("survey-checkbox-item"), V = y("survey-other-choice"), j = y("survey-string");
+      const k = y("survey-errors"), L = y("sv-matrix-drag-drop-icon"), b = y("sv-action-bar"), N = y("survey-radiogroup-item"), W = y("survey-checkbox-item"), V = y("survey-other-choice"), Q = y("survey-string");
       return i(), u("td", {
         class: a(q.cell.className),
         "data-responsive-title": o(),
@@ -3038,27 +3038,27 @@ const so = /* @__PURE__ */ h({
           model: q.cell.item.getData(),
           handleClick: !1
         }, null, 8, ["model"])) : d("", !0),
-        q.cell.hasPanel ? (i(), g($(v.value), z(E({ key: 3 }, c.value)), null, 16)) : d("", !0),
+        q.cell.hasPanel ? (i(), g(T(v.value), z(H({ key: 3 }, c.value)), null, 16)) : d("", !0),
         q.cell.hasQuestion ? P((i(), u("div", {
           key: 4,
           class: a(q.cell.cellQuestionWrapperClassName)
         }, [
-          !q.cell.isChoice && q.cell.question.isDefaultRendering() ? (i(), g($(q.question.getCellWrapperComponentName(q.cell.cell)), {
+          !q.cell.isChoice && q.cell.question.isDefaultRendering() ? (i(), g(T(q.question.getCellWrapperComponentName(q.cell.cell)), {
             key: 0,
             componentData: q.question.getCellWrapperComponentData(q.cell.cell)
           }, {
             default: F(() => [
-              (i(), g($(m(q.cell.question)), {
+              (i(), g(T(m(q.cell.question)), {
                 question: q.cell.question
               }, null, 8, ["question"]))
             ]),
             _: 1
           }, 8, ["componentData"])) : d("", !0),
-          !q.cell.isChoice && !q.cell.question.isDefaultRendering() ? (i(), g($(q.cell.question.getComponentName()), {
+          !q.cell.isChoice && !q.cell.question.isDefaultRendering() ? (i(), g(T(q.cell.question.getComponentName()), {
             key: 1,
             question: q.cell.question
           }, null, 8, ["question"])) : d("", !0),
-          q.cell.isItemChoice ? (i(), g($(q.question.getCellWrapperComponentName(q.cell.cell)), {
+          q.cell.isItemChoice ? (i(), g(T(q.question.getCellWrapperComponentName(q.cell.cell)), {
             key: 2,
             componentData: q.question.getCellWrapperComponentData(q.cell.cell)
           }, {
@@ -3083,14 +3083,14 @@ const so = /* @__PURE__ */ h({
             question: q.cell.question
           }, null, 8, ["question"])) : d("", !0)
         ], 2)), [
-          [H, n.value]
+          [E, n.value]
         ]) : d("", !0),
-        q.cell.hasTitle ? (i(), g($(q.question.getCellWrapperComponentName(q.cell)), {
+        q.cell.hasTitle ? (i(), g(T(q.question.getCellWrapperComponentName(q.cell)), {
           key: 5,
           componentData: q.question.getCellWrapperComponentData(q.cell)
         }, {
           default: F(() => [
-            q.cell.hasTitle ? (i(), g(j, {
+            q.cell.hasTitle ? (i(), g(Q, {
               key: 0,
               locString: q.cell.locTitle
             }, null, 8, ["locString"])) : d("", !0),
@@ -3111,7 +3111,7 @@ const so = /* @__PURE__ */ h({
     question: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = () => {
       s.question.addRowUI();
@@ -3270,7 +3270,7 @@ const Ro = ["disabled"], To = /* @__PURE__ */ h({
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = ie();
+    const s = r, n = $(null), e = ie();
     A(
       s,
       n,
@@ -3355,7 +3355,7 @@ const Ro = ["disabled"], To = /* @__PURE__ */ h({
             p("div", {
               class: a(m.question.getPanelWrapperCss(b))
             }, [
-              (i(), g($(t(b)), z(ne(l(b))), null, 16)),
+              (i(), g(T(t(b)), z(ne(l(b))), null, 16)),
               m.question.panelRemoveButtonLocation === "right" && m.question.canRemovePanel && b.state !== "collapsed" ? (i(), g(k, {
                 key: 0,
                 data: { question: m.question, panel: b }
@@ -3498,7 +3498,7 @@ const Ao = /* @__PURE__ */ h({
       ], 2)) : d("", !0);
     };
   }
-}), Mo = ["title"], Ho = /* @__PURE__ */ h({
+}), Mo = ["title"], Eo = /* @__PURE__ */ h({
   __name: "PaneldynamicNextBtn",
   props: {
     item: {},
@@ -3522,7 +3522,7 @@ const Ao = /* @__PURE__ */ h({
       ], 10, Mo);
     };
   }
-}), Eo = ["title"], Wo = /* @__PURE__ */ h({
+}), Ho = ["title"], Wo = /* @__PURE__ */ h({
   __name: "PaneldynamicPrevBtn",
   props: {
     item: {},
@@ -3543,7 +3543,7 @@ const Ao = /* @__PURE__ */ h({
           iconName: w(n).cssClasses.progressBtnIcon,
           size: "auto"
         }, null, 8, ["iconName"])
-      ], 10, Eo);
+      ], 10, Ho);
     };
   }
 }), Vo = /* @__PURE__ */ h({
@@ -3597,41 +3597,26 @@ const Ao = /* @__PURE__ */ h({
     location: {}
   },
   setup(r) {
-    const s = T();
-    return (n, e) => {
-      const o = y("survey-string");
-      return n.element.hasVisibleErrors ? (i(), u("div", {
-        key: 0,
-        role: "alert",
-        "aria-live": "polite",
-        class: a(n.element.cssError),
-        id: n.element.id + "_errors",
-        ref_key: "root",
-        ref: s
-      }, [
-        (i(!0), u(_, null, D(n.element.errors, (t, l) => (i(), u("div", {
-          key: "error_" + l
-        }, [
-          p("span", {
-            class: a(
-              n.element.cssClasses ? n.element.cssClasses.error.icon || void 0 : "panel-error-icon"
-            ),
-            "aria-hidden": "true"
-          }, null, 2),
-          p("span", {
-            class: a(
-              n.element.cssClasses ? n.element.cssClasses.error.item || void 0 : "panel-error-item"
-            )
-          }, [
-            C(o, {
-              locString: t.locText
-            }, null, 8, ["locString"])
-          ], 2)
-        ]))), 128))
-      ], 10, Oo)) : d("", !0);
-    };
+    const s = $();
+    return (n, e) => n.element.hasVisibleErrors ? (i(), u("div", {
+      key: 0,
+      role: "alert",
+      "aria-live": "polite",
+      class: a(n.element.cssError),
+      id: n.element.id + "_errors",
+      ref_key: "root",
+      ref: s
+    }, [
+      (i(!0), u(_, null, D(n.element.errors, (o, t) => (i(), g(T(n.element.survey.questionErrorComponent), {
+        element: n.element,
+        key: "error_" + t,
+        errorKey: "error_" + t,
+        error: o,
+        cssClasses: n.element.cssClasses
+      }, null, 8, ["element", "errorKey", "error", "cssClasses"]))), 128))
+    ], 10, Oo)) : d("", !0);
   }
-}), Uo = { key: 0 }, Ko = ["id", "readonly", "disabled", "value", "maxlength", "placeholder", "aria-label", "aria-required"], jo = /* @__PURE__ */ h({
+}), Uo = { key: 0 }, Ko = ["id", "readonly", "disabled", "value", "maxlength", "placeholder", "aria-label", "aria-required"], Qo = /* @__PURE__ */ h({
   __name: "QuestionComment",
   props: {
     question: {}
@@ -3657,7 +3642,7 @@ const Ao = /* @__PURE__ */ h({
       })
     }, null, 46, Ko));
   }
-}), Qo = /* @__PURE__ */ h({
+}), jo = /* @__PURE__ */ h({
   __name: "TitleElement",
   props: {
     element: {},
@@ -3669,7 +3654,7 @@ const Ao = /* @__PURE__ */ h({
     };
     return (n, e) => {
       const o = y("survey-element-title-content"), t = y("sv-title-actions");
-      return n.element.hasTitle ? (i(), g($(n.element.titleTagName), {
+      return n.element.hasTitle ? (i(), g(T(n.element.titleTagName), {
         key: 0,
         class: a(n.element.cssTitle),
         "aria-label": n.element.titleAriaLabel,
@@ -3795,7 +3780,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     title: {}
   },
   setup(r) {
-    const s = r, n = T(), e = () => {
+    const s = r, n = $(), e = () => {
       Ne(
         s.size,
         s.width,
@@ -3817,6 +3802,36 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     }, at, 512));
   }
 }), dt = /* @__PURE__ */ h({
+  __name: "QuestionError",
+  props: {
+    errorKey: {},
+    error: {},
+    cssClasses: {},
+    element: {}
+  },
+  setup(r) {
+    return (s, n) => {
+      const e = y("survey-string");
+      return i(), u("div", { key: s.errorKey }, [
+        p("span", {
+          class: a(
+            s.cssClasses ? s.cssClasses.error.icon || void 0 : "panel-error-icon"
+          ),
+          "aria-hidden": "true"
+        }, null, 2),
+        p("span", {
+          class: a(
+            s.cssClasses ? s.cssClasses.error.item || void 0 : "panel-error-item"
+          )
+        }, [
+          C(e, {
+            locString: s.error.locText
+          }, null, 8, ["locString"])
+        ], 2)
+      ]);
+    };
+  }
+}), mt = /* @__PURE__ */ h({
   __name: "ActionBar",
   props: {
     model: {},
@@ -3824,7 +3839,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     handleClick: { type: Boolean, default: !0 }
   },
   setup(r) {
-    const s = r, n = T(null), e = (t) => {
+    const s = r, n = $(null), e = (t) => {
       s.handleClick && t.stopPropagation();
     };
     B(() => s.model);
@@ -3849,7 +3864,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       ], 2)) : d("", !0);
     };
   }
-}), mt = ["id"], ct = { class: "sv-action__content" }, pt = /* @__PURE__ */ h({
+}), ct = ["id"], pt = { class: "sv-action__content" }, vt = /* @__PURE__ */ h({
   __name: "Action",
   props: {
     item: {}
@@ -3864,17 +3879,17 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
         class: a(e.item.getActionRootCss()),
         id: e.item.id
       }, [
-        p("div", ct, [
+        p("div", pt, [
           e.item.needSeparator ? (i(), g(t, { key: 0 })) : d("", !0),
-          (i(), g($(n.value), { item: e.item }, null, 8, ["item"]))
+          (i(), g(T(n.value), { item: e.item }, null, 8, ["item"]))
         ])
-      ], 10, mt);
+      ], 10, ct);
     };
   }
-}), vt = ["disabled", "title", "aria-checked", "aria-expanded", "role"], qt = {
+}), qt = ["disabled", "title", "aria-checked", "aria-expanded", "role"], yt = {
   inheritAttrs: !1
-}, yt = /* @__PURE__ */ h({
-  ...qt,
+}, gt = /* @__PURE__ */ h({
+  ...yt,
   __name: "ActionBarItem",
   props: {
     item: {}
@@ -3909,15 +3924,15 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
           key: 1,
           class: a(n.item.getActionBarItemTitleCss())
         }, R(n.item.title), 3)) : d("", !0)
-      ], 42, vt)), [
+      ], 42, qt)), [
         [t, { processEsc: !1, disableTabStop: n.item.disableTabStop }]
       ]);
     };
   }
-}), gt = ["disabled", "title", "role"], ht = {
+}), ht = ["disabled", "title", "role"], Ct = {
   inheritAttrs: !1
-}, Ct = /* @__PURE__ */ h({
-  ...ht,
+}, bt = /* @__PURE__ */ h({
+  ...Ct,
   __name: "ActionBarItemDropdown",
   props: {
     item: {}
@@ -3960,7 +3975,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
             key: 1,
             class: a(o.item.getActionBarItemTitleCss())
           }, R(o.item.title), 3)) : d("", !0)
-        ], 42, gt)), [
+        ], 42, ht)), [
           [v, { processEsc: !1, disableTabStop: o.item.disableTabStop }]
         ]),
         C(m, {
@@ -3970,7 +3985,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       ], 64);
     };
   }
-}), bt = /* @__PURE__ */ h({
+}), kt = /* @__PURE__ */ h({
   __name: "ActionBarSeparator",
   props: {
     item: {}
@@ -3981,13 +3996,13 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       class: a(["sv-action-bar-separator", n.value])
     }, null, 2));
   }
-}), kt = ["aria-label", "placeholder", "value"], ft = ["aria-label"], wt = ["id"], It = /* @__PURE__ */ h({
+}), ft = ["aria-label", "placeholder", "value"], wt = ["aria-label"], It = ["id"], St = /* @__PURE__ */ h({
   __name: "List",
   props: {
     model: {}
   },
   setup(r) {
-    const s = r, n = T(null), e = (l) => {
+    const s = r, n = $(null), e = (l) => {
       const m = s.model;
       m.filterString = l.target.value;
     }, o = (l) => {
@@ -4025,7 +4040,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
             value: l.model.filterString,
             onChange: e,
             onKeyup: o
-          }, null, 42, kt),
+          }, null, 42, ft),
           l.model.showSearchClearButton && !!l.model.filterString ? (i(), u("button", {
             key: 0,
             onClick: m[0] || (m[0] = (q) => {
@@ -4045,9 +4060,9 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
           p("div", {
             class: a(l.model.cssClasses.emptyText),
             "aria-label": l.model.emptyMessage
-          }, R(l.model.emptyMessage), 11, ft)
+          }, R(l.model.emptyMessage), 11, wt)
         ], 2), [
-          [H, l.model.isEmpty]
+          [E, l.model.isEmpty]
         ]),
         l.model.renderElements ? P((i(), u("ul", {
           key: 1,
@@ -4067,13 +4082,13 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
             model: l.model,
             key: q.id
           }, null, 8, ["item", "model"]))), 128))
-        ], 42, wt)), [
-          [H, !l.model.isEmpty]
+        ], 42, It)), [
+          [E, !l.model.isEmpty]
         ]) : d("", !0)
       ], 2);
     };
   }
-}), St = ["aria-selected", "id", "tabindex"], Rt = ["title"], Tt = /* @__PURE__ */ h({
+}), Rt = ["aria-selected", "id", "tabindex"], Tt = ["title"], $t = /* @__PURE__ */ h({
   __name: "ListItem",
   props: {
     model: {},
@@ -4118,25 +4133,25 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
             key: 1,
             locString: o.item.locTitle
           }, null, 8, ["locString"])),
-          o.item.component ? (i(), g($(o.item.component), {
+          o.item.component ? (i(), g(T(o.item.component), {
             key: 2,
             item: o.item
           }, null, 8, ["item"])) : d("", !0)
-        ], 14, Rt)
-      ], 42, St)), [
-        [H, o.model.isItemVisible(o.item)],
+        ], 14, Tt)
+      ], 42, Rt)), [
+        [E, o.model.isItemVisible(o.item)],
         [v, { processEsc: !1, disableTabStop: o.item.disableTabStop }]
       ]);
     };
   }
-}), $t = /* @__PURE__ */ h({
+}), _t = /* @__PURE__ */ h({
   __name: "Popup",
   props: {
     getTarget: { type: Function },
     model: {}
   },
   setup(r) {
-    const s = r, n = U(), e = T(null);
+    const s = r, n = U(), e = $(null);
     return K(
       () => s.model,
       (o) => {
@@ -4161,13 +4176,13 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       ], 512);
     };
   }
-}), _t = { class: "sv-popup__shadow" }, Dt = { class: "sv-popup__body-content" }, Bt = {
+}), Dt = { class: "sv-popup__shadow" }, Bt = { class: "sv-popup__body-content" }, Lt = {
   key: 0,
   class: "sv-popup__body-header"
-}, Lt = { class: "sv-popup__scrolling-content" }, Nt = { class: "sv-popup__content" }, Pt = {
+}, Nt = { class: "sv-popup__scrolling-content" }, Pt = { class: "sv-popup__content" }, At = {
   key: 1,
   class: "sv-popup__body-footer"
-}, At = /* @__PURE__ */ h({
+}, Mt = /* @__PURE__ */ h({
   __name: "PopupContainer",
   props: {
     model: {}
@@ -4204,19 +4219,19 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
           }),
           onClick: n
         }, [
-          p("div", _t, [
-            e.model.showHeader ? (i(), g($(e.model.popupHeaderTemplate), {
+          p("div", Dt, [
+            e.model.showHeader ? (i(), g(T(e.model.popupHeaderTemplate), {
               key: 0,
               model: e.model
             }, null, 8, ["model"])) : d("", !0),
-            p("div", Dt, [
-              e.model.title ? (i(), u("div", Bt, R(e.model.title), 1)) : d("", !0),
-              p("div", Lt, [
-                p("div", Nt, [
-                  (i(), g($(e.model.contentComponentName), z(ne(e.model.contentComponentData)), null, 16))
+            p("div", Bt, [
+              e.model.title ? (i(), u("div", Lt, R(e.model.title), 1)) : d("", !0),
+              p("div", Nt, [
+                p("div", Pt, [
+                  (i(), g(T(e.model.contentComponentName), z(ne(e.model.contentComponentData)), null, 16))
                 ])
               ]),
-              e.model.showFooter ? (i(), u("div", Pt, [
+              e.model.showFooter ? (i(), u("div", At, [
                 C(t, {
                   model: e.model.footerToolbar
                 }, null, 8, ["model"])
@@ -4225,11 +4240,11 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
           ])
         ], 4)
       ], 34)), [
-        [H, e.model.isVisible]
+        [E, e.model.isVisible]
       ]);
     };
   }
-}), Mt = /* @__PURE__ */ h({
+}), Et = /* @__PURE__ */ h({
   __name: "PopupPointer",
   props: {
     model: {}
@@ -4246,7 +4261,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
 }), Ht = {
   key: 0,
   class: "sv-components-column"
-}, Et = /* @__PURE__ */ h({
+}, Wt = /* @__PURE__ */ h({
   __name: "Container",
   props: {
     survey: {},
@@ -4259,12 +4274,12 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     );
     return (e, o) => n.value.length > 0 ? (i(), u(_, { key: 0 }, [
       e.needRenderWrapper ? (i(), u("div", Ht, [
-        (i(!0), u(_, null, D(n.value, (t, l) => (i(), g($(t.component), {
+        (i(!0), u(_, null, D(n.value, (t, l) => (i(), g(T(t.component), {
           survey: e.survey,
           container: e.container,
           model: t.data
         }, null, 8, ["survey", "container", "model"]))), 256))
-      ])) : (i(!0), u(_, { key: 1 }, D(n.value, (t, l) => (i(), g($(t.component), {
+      ])) : (i(!0), u(_, { key: 1 }, D(n.value, (t, l) => (i(), g(T(t.component), {
         survey: e.survey,
         container: e.container,
         model: t.data
@@ -4300,7 +4315,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       }, R(t.survey.progressText), 3)
     ], 2));
   }
-}), Wt = ["title"], Vt = ["onClick", "data-page-number"], Ft = ["title"], Ot = ["title"], zt = ["title"], Ut = /* @__PURE__ */ h({
+}), Vt = ["title"], Ft = ["onClick", "data-page-number"], Ot = ["title"], zt = ["title"], Ut = ["title"], Kt = /* @__PURE__ */ h({
   __name: "ProgressButtons",
   props: {
     survey: {},
@@ -4308,7 +4323,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     container: {}
   },
   setup(r) {
-    const s = r, n = T(!1), e = T(!1), o = T(!1), t = T(!0), l = T(), m = I(() => s.survey.css);
+    const s = r, n = $(!1), e = $(!1), o = $(!1), t = $(!0), l = $(), m = I(() => s.survey.css);
     let v = null;
     const c = (q) => {
       let f = l.value;
@@ -4316,7 +4331,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     };
     return M(() => {
       const q = l.value;
-      v = new He(s.model, q, {
+      v = new Ee(s.model, q, {
         onResize: (f) => {
           t.value = f, e.value = !f;
         },
@@ -4330,90 +4345,97 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       });
     }), G(() => {
       v.dispose();
-    }), (q, f) => (i(), u("div", {
-      class: a(q.model.getRootCss(q.container)),
-      style: S({ maxWidth: q.model.progressWidth }),
-      role: "progressbar",
-      "aria-valuemin": "0",
-      "aria-valuemax": "100",
-      "aria-label": "progress"
-    }, [
-      e.value ? (i(), u("div", {
-        key: 0,
-        class: a(q.survey.css.progressButtonsHeader)
-      }, [
-        p("div", {
-          class: a(q.survey.css.progressButtonsPageTitle),
-          title: q.model.headerText
-        }, R(q.model.headerText), 11, Wt)
-      ], 2)) : d("", !0),
-      p("div", {
-        class: a(m.value.progressButtonsContainer)
+    }), (q, f) => {
+      const k = y("survey-string");
+      return i(), u("div", {
+        class: a(q.model.getRootCss(q.container)),
+        style: S({ maxWidth: q.model.progressWidth }),
+        role: "progressbar",
+        "aria-valuemin": "0",
+        "aria-valuemax": "100",
+        "aria-label": "progress"
       }, [
+        e.value ? (i(), u("div", {
+          key: 0,
+          class: a(q.survey.css.progressButtonsHeader)
+        }, [
+          p("div", {
+            class: a(q.survey.css.progressButtonsPageTitle),
+            title: q.model.headerText
+          }, R(q.model.headerText), 11, Vt)
+        ], 2)) : d("", !0),
         p("div", {
-          class: a(q.model.getScrollButtonCss(n.value, !0)),
-          onClick: f[0] || (f[0] = (k) => c(!0)),
-          role: "button"
-        }, null, 2),
-        p("div", {
-          class: a(m.value.progressButtonsListContainer),
-          ref_key: "progressButtonsListContainer",
-          ref: l
+          class: a(m.value.progressButtonsContainer)
         }, [
-          p("ul", {
-            class: a(m.value.progressButtonsList)
+          p("div", {
+            class: a(q.model.getScrollButtonCss(n.value, !0)),
+            onClick: f[0] || (f[0] = (L) => c(!0)),
+            role: "button"
+          }, null, 2),
+          p("div", {
+            class: a(m.value.progressButtonsListContainer),
+            ref_key: "progressButtonsListContainer",
+            ref: l
           }, [
-            (i(!0), u(_, null, D(q.survey.visiblePages, (k, L) => (i(), u("li", {
-              key: "listelement" + L,
-              class: a(q.model.getListElementCss(L)),
-              onClick: (b) => q.model.isListElementClickable(L) ? q.model.clickListElement(k) : null,
-              "data-page-number": q.model.getItemNumber(k)
+            p("ul", {
+              class: a(m.value.progressButtonsList)
             }, [
-              p("div", {
-                class: a(m.value.progressButtonsConnector)
-              }, null, 2),
-              t.value ? (i(), u("div", {
-                key: 0,
-                class: a(m.value.progressButtonsPageTitle),
-                title: k.renderedNavigationTitle
-              }, R(k.renderedNavigationTitle), 11, Ft)) : d("", !0),
-              t.value ? (i(), u("div", {
-                key: 1,
-                class: a(m.value.progressButtonsPageDescription),
-                title: k.locNavigationDescription.renderedHtml
-              }, R(k.locNavigationDescription.renderedHtml), 11, Ot)) : d("", !0),
-              p("div", {
-                class: a(m.value.progressButtonsButton)
+              (i(!0), u(_, null, D(q.survey.visiblePages, (L, b) => (i(), u("li", {
+                key: "listelement" + b,
+                class: a(q.model.getListElementCss(b)),
+                onClick: (N) => q.model.isListElementClickable(b) ? q.model.clickListElement(L) : null,
+                "data-page-number": q.model.getItemNumber(L)
               }, [
                 p("div", {
-                  class: a(m.value.progressButtonsButtonBackground)
+                  class: a(m.value.progressButtonsConnector)
                 }, null, 2),
+                t.value ? (i(), u("div", {
+                  key: 0,
+                  class: a(m.value.progressButtonsPageTitle),
+                  title: L.renderedNavigationTitle
+                }, [
+                  C(k, {
+                    locString: L.locNavigationTitle
+                  }, null, 8, ["locString"])
+                ], 10, Ot)) : d("", !0),
+                t.value ? (i(), u("div", {
+                  key: 1,
+                  class: a(m.value.progressButtonsPageDescription),
+                  title: L.locNavigationDescription.renderedHtml
+                }, R(L.locNavigationDescription.renderedHtml), 11, zt)) : d("", !0),
                 p("div", {
-                  class: a(m.value.progressButtonsButtonContent)
-                }, null, 2),
-                p("span", null, R(q.model.getItemNumber(k)), 1)
-              ], 2)
-            ], 10, Vt))), 128))
-          ], 2)
+                  class: a(m.value.progressButtonsButton)
+                }, [
+                  p("div", {
+                    class: a(m.value.progressButtonsButtonBackground)
+                  }, null, 2),
+                  p("div", {
+                    class: a(m.value.progressButtonsButtonContent)
+                  }, null, 2),
+                  p("span", null, R(q.model.getItemNumber(L)), 1)
+                ], 2)
+              ], 10, Ft))), 128))
+            ], 2)
+          ], 2),
+          p("div", {
+            class: a(q.model.getScrollButtonCss(n.value, !1)),
+            onClick: f[1] || (f[1] = (L) => c(!1)),
+            role: "button"
+          }, null, 2)
         ], 2),
-        p("div", {
-          class: a(q.model.getScrollButtonCss(n.value, !1)),
-          onClick: f[1] || (f[1] = (k) => c(!1)),
-          role: "button"
-        }, null, 2)
-      ], 2),
-      o.value ? (i(), u("div", {
-        key: 1,
-        class: a(q.survey.css.progressButtonsFooter)
-      }, [
-        p("div", {
-          class: a(q.survey.css.progressButtonsPageTitle),
-          title: q.model.footerText
-        }, R(q.model.footerText), 11, zt)
-      ], 2)) : d("", !0)
-    ], 6));
+        o.value ? (i(), u("div", {
+          key: 1,
+          class: a(q.survey.css.progressButtonsFooter)
+        }, [
+          p("div", {
+            class: a(q.survey.css.progressButtonsPageTitle),
+            title: q.model.footerText
+          }, R(q.model.footerText), 11, Ut)
+        ], 2)) : d("", !0)
+      ], 6);
+    };
   }
-}), Kt = /* @__PURE__ */ h({
+}), Qt = /* @__PURE__ */ h({
   __name: "ProgressToc",
   props: {
     survey: {},
@@ -4445,17 +4467,17 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       ], 2);
     };
   }
-}), jt = { onsubmit: "return false;" }, Qt = {
+}), jt = { onsubmit: "return false;" }, Gt = {
   key: 0,
   class: "sv_custom_header"
-}, Gt = { class: "sv-components-column sv-components-column--expandable" }, Jt = ["id"], Xt = { key: 2 }, Yt = ["innerHTML"], Zt = ["innerHTML"], xt = ["innerHTML"], pe = /* @__PURE__ */ h({
+}, Jt = { class: "sv-components-column sv-components-column--expandable" }, Xt = ["id"], Yt = { key: 2 }, Zt = ["innerHTML"], xt = ["innerHTML"], ei = ["innerHTML"], pe = /* @__PURE__ */ h({
   __name: "Survey",
   props: {
     model: {},
     survey: {}
   },
   setup(r) {
-    const s = r, n = T(), e = T(""), o = T(1), t = I(() => {
+    const s = r, n = $(), e = $(""), o = $(1), t = I(() => {
       const k = s.survey ? s.survey : s.model;
       return Se(k);
     }), l = I(() => t.value.activePage ? t.value.activePage.id : ""), m = () => {
@@ -4475,7 +4497,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     }), O(() => {
       t.value.stopTimer(), t.value.renderCallback = void 0;
     }), (k, L) => {
-      const b = y("sv-svg-bundle"), N = y("survey-popup-modal"), W = y("survey-header"), V = y("survey-page"), j = y("sv-brand-info"), ue = y("sv-notifier");
+      const b = y("sv-svg-bundle"), N = y("survey-popup-modal"), W = y("survey-header"), V = y("survey-page"), Q = y("sv-brand-info"), ue = y("sv-notifier");
       return i(), u("div", {
         class: a(t.value.getRootCss()),
         style: S(t.value.themeVariables),
@@ -4493,7 +4515,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
             style: S(t.value.backgroundImageStyle)
           }, null, 6)) : d("", !0),
           p("form", jt, [
-            t.value.hasLogo ? d("", !0) : (i(), u("div", Qt)),
+            t.value.hasLogo ? d("", !0) : (i(), u("div", Gt)),
             p("div", {
               class: a(c.value.container)
             }, [
@@ -4501,7 +4523,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
                 key: 0,
                 survey: t.value
               }, null, 8, ["survey"])) : d("", !0),
-              (i(), g($("sv-components-container"), {
+              (i(), g(T("sv-components-container"), {
                 survey: t.value,
                 container: "header",
                 needRenderWrapper: !1
@@ -4510,13 +4532,13 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
                 key: 1,
                 class: a(t.value.bodyContainerCss)
               }, [
-                (i(), g($("sv-components-container"), {
+                (i(), g(T("sv-components-container"), {
                   survey: t.value,
                   container: "left",
                   needRenderWrapper: !0
                 }, null, 8, ["survey"])),
-                p("div", Gt, [
-                  (i(), g($("sv-components-container"), {
+                p("div", Jt, [
+                  (i(), g(T("sv-components-container"), {
                     survey: t.value,
                     container: "center",
                     needRenderWrapper: !0
@@ -4526,7 +4548,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
                     style: S({ maxWidth: t.value.renderedWidth }),
                     id: l.value
                   }, [
-                    (i(), g($("sv-components-container"), {
+                    (i(), g(T("sv-components-container"), {
                       survey: t.value,
                       container: "contentTop",
                       needRenderWrapper: !0
@@ -4537,30 +4559,30 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
                       page: t.value.activePage,
                       css: c.value
                     }, null, 8, ["survey", "page", "css"])),
-                    (i(), g($("sv-components-container"), {
+                    (i(), g(T("sv-components-container"), {
                       survey: t.value,
                       container: "contentBottom",
                       needRenderWrapper: !0
                     }, null, 8, ["survey"]))
-                  ], 14, Jt)
+                  ], 14, Xt)
                 ]),
-                (i(), g($("sv-components-container"), {
+                (i(), g(T("sv-components-container"), {
                   survey: t.value,
                   container: "right",
                   needRenderWrapper: !0
                 }, null, 8, ["survey"]))
               ], 2)) : d("", !0),
-              (i(), g($("sv-components-container"), {
+              (i(), g(T("sv-components-container"), {
                 survey: t.value,
                 container: "footer",
                 needRenderWrapper: !1
               }, null, 8, ["survey"])),
-              v.value ? (i(), u("div", Xt, [
+              v.value ? (i(), u("div", Yt, [
                 p("div", {
                   innerHTML: f(),
                   class: a(t.value.completedCss)
-                }, null, 10, Yt),
-                (i(), g($("sv-components-container"), {
+                }, null, 10, Zt),
+                (i(), g(T("sv-components-container"), {
                   survey: t.value,
                   container: "completePage",
                   needRenderWrapper: !0
@@ -4570,19 +4592,19 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
                 key: 3,
                 class: a(t.value.completedBeforeCss),
                 innerHTML: t.value.processedCompletedBeforeHtml
-              }, null, 10, Zt)) : d("", !0),
+              }, null, 10, xt)) : d("", !0),
               t.value.state === "loading" ? (i(), u("div", {
                 key: 4,
                 class: a(t.value.loadingBodyCss),
                 innerHTML: t.value.processedLoadingHtml
-              }, null, 10, xt)) : d("", !0),
+              }, null, 10, ei)) : d("", !0),
               t.value.state === "empty" ? (i(), u("div", {
                 key: 5,
                 class: a(c.value.bodyEmpty)
               }, R(t.value.emptySurveyText), 3)) : d("", !0)
             ], 2)
           ]),
-          t.value.showBrandInfo ? (i(), g(j, { key: 1 })) : d("", !0),
+          t.value.showBrandInfo ? (i(), g(Q, { key: 1 })) : d("", !0),
           C(ue, {
             model: t.value.notifier
           }, null, 8, ["model"])
@@ -4590,7 +4612,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       ], 6);
     };
   }
-}), ei = /* @__PURE__ */ h({
+}), si = /* @__PURE__ */ h({
   __name: "Notifier",
   props: {
     model: {}
@@ -4613,7 +4635,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       ], 6)) : d("", !0);
     };
   }
-}), si = ["id", "readonly", "disabled", "value", "maxlength", "placeholder", "aria-label", "aria-required"], ni = { key: 1 }, oi = /* @__PURE__ */ h({
+}), ni = ["id", "readonly", "disabled", "value", "maxlength", "placeholder", "aria-label", "aria-required"], oi = { key: 1 }, ti = /* @__PURE__ */ h({
   __name: "QuestionOther",
   props: {
     question: {},
@@ -4641,11 +4663,11 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
         onInput: n[1] || (n[1] = (e) => {
           s.question.onOtherValueInput(e);
         })
-      }, null, 46, si)),
-      s.question.isReadOnlyRenderDiv() ? (i(), u("div", ni, R(s.question.otherValue), 1)) : d("", !0)
+      }, null, 46, ni)),
+      s.question.isReadOnlyRenderDiv() ? (i(), u("div", oi, R(s.question.otherValue), 1)) : d("", !0)
     ], 2));
   }
-}), ti = ["disabled", "value", "title"], ii = /* @__PURE__ */ h({
+}), ii = ["disabled", "value", "title"], ri = /* @__PURE__ */ h({
   __name: "SurveyNavigationButton",
   props: {
     item: {}
@@ -4661,7 +4683,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       title: e.item.getTooltip(),
       onMousedown: n,
       onClick: o[0] || (o[0] = (...t) => e.item.action && e.item.action(...t))
-    }, null, 42, ti)) : d("", !0);
+    }, null, 42, ii)) : d("", !0);
   }
 }), ve = /* @__PURE__ */ h({
   __name: "PopupSurvey",
@@ -4697,7 +4719,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     const q = K(
       () => s.survey,
       (f) => {
-        const k = new Ee(null, f);
+        const k = new He(null, f);
         s.isExpanded !== void 0 && (k.isExpanded = s.isExpanded), s.closeOnCompleteTimeout !== void 0 && (k.closeOnCompleteTimeout = s.closeOnCompleteTimeout), s.allowClose !== void 0 && (k.allowClose = s.allowClose), s.allowFullScreen !== void 0 && (k.allowFullScreen = s.allowFullScreen), k.isShowing = !0, n.value = k;
       },
       {
@@ -4773,20 +4795,20 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
           p("div", {
             class: a(n.value.cssBody)
           }, [
-            (i(), g($(m()), { survey: f.survey }, null, 8, ["survey"]))
+            (i(), g(T(m()), { survey: f.survey }, null, 8, ["survey"]))
           ], 2)
         ], 2)
       ], 38)) : d("", !0);
     };
   }
-}), ri = ["innerHTML"], li = /* @__PURE__ */ h({
+}), li = ["innerHTML"], ai = /* @__PURE__ */ h({
   __name: "CustomWidget",
   props: {
     question: {},
     css: {}
   },
   setup(r) {
-    const s = r, n = T(), e = I(
+    const s = r, n = $(), e = I(
       () => s.question.customWidget.isDefaultRender
     ), o = I(
       () => !!s.question.customWidget.htmlTemplate
@@ -4802,15 +4824,15 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       o.value ? (i(), u("div", {
         key: 0,
         innerHTML: t.value
-      }, null, 8, ri)) : d("", !0),
-      e.value ? (i(), g($(l.value), {
+      }, null, 8, li)) : d("", !0),
+      e.value ? (i(), g(T(l.value), {
         key: 1,
         question: m.question,
         css: m.css
       }, null, 8, ["question", "css"])) : d("", !0)
     ], 512));
   }
-}), ai = /* @__PURE__ */ h({
+}), ui = /* @__PURE__ */ h({
   __name: "PopupModal",
   setup(r) {
     const s = U();
@@ -4837,10 +4859,10 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       };
       return l.onVisibilityChanged.add(m), l.model.isVisible = !0, s.value = l, l;
     }
-    return Q.showModal || (Q.showModal = n, O(() => {
-      Q.showModal = void 0;
-    })), Q.showDialog || (Q.showDialog = e, O(() => {
-      Q.showDialog = void 0;
+    return j.showModal || (j.showModal = n, O(() => {
+      j.showModal = void 0;
+    })), j.showDialog || (j.showDialog = e, O(() => {
+      j.showDialog = void 0;
     })), (o, t) => {
       const l = y("sv-popup-container");
       return s.value ? (i(), g(Re, {
@@ -4851,7 +4873,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       ], 8, ["to"])) : d("", !0);
     };
   }
-}), ui = /* @__PURE__ */ h({
+}), di = /* @__PURE__ */ h({
   __name: "CharacterCounter",
   props: {
     counter: {},
@@ -4863,7 +4885,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       class: a(n.remainingCharacterCounter)
     }, R(n.counter.remainingCharacterCounter), 3));
   }
-}), di = /* @__PURE__ */ h({
+}), mi = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "Composite",
   props: {
@@ -4871,7 +4893,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = I(() => s.question.contentPanel);
     return (o, t) => {
@@ -4884,7 +4906,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       }, null, 8, ["element", "css"]);
     };
   }
-}), mi = /* @__PURE__ */ h({
+}), ci = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "Custom",
   props: {
@@ -4892,18 +4914,18 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
     css: {}
   },
   setup(r) {
-    const s = r, n = T(null);
+    const s = r, n = $(null);
     A(s, n);
     const e = I(() => s.question.contentQuestion), o = (t) => re(t);
-    return (t, l) => (i(), g($(o(e.value)), {
+    return (t, l) => (i(), g(T(o(e.value)), {
       ref: n.value,
       question: e.value,
       css: t.css
     }, null, 8, ["question", "css"]));
   }
-}), ci = /* @__PURE__ */ p("use", { "xlink:href": "#icon-timercircle" }, null, -1), pi = [
-  ci
-], qe = 440, vi = /* @__PURE__ */ h({
+}), pi = /* @__PURE__ */ p("use", { "xlink:href": "#icon-timercircle" }, null, -1), vi = [
+  pi
+], qe = 440, qi = /* @__PURE__ */ h({
   __name: "TimerPanel",
   props: {
     model: {},
@@ -4919,7 +4941,7 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
         key: 0,
         class: a(o.model.getProgressCss()),
         style: S({ strokeDasharray: qe, strokeDashoffset: n.value })
-      }, pi, 6)) : d("", !0),
+      }, vi, 6)) : d("", !0),
       p("div", {
         class: a(o.model.textContainerCss)
       }, [
@@ -4935,20 +4957,20 @@ const rt = /* @__PURE__ */ he(st, [["render", it]]), lt = /* @__PURE__ */ p("use
       key: 1,
       class: a(o.model.survey.getCss().timerRoot)
     }, R(e.value), 3)), [
-      [H, o.model.isRunning && !o.model.showTimerAsClock]
+      [E, o.model.isRunning && !o.model.showTimerAsClock]
     ]);
   }
-}), qi = {}, yi = { class: "sd-loading-indicator" };
-function gi(r, s) {
+}), yi = {}, gi = { class: "sd-loading-indicator" };
+function hi(r, s) {
   const n = y("sv-svg-icon");
-  return i(), u("div", yi, [
+  return i(), u("div", gi, [
     C(n, {
       iconName: "icon-loading",
       size: "'auto'"
     })
   ]);
 }
-const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @__PURE__ */ h({
+const Ci = /* @__PURE__ */ he(yi, [["render", hi]]), bi = { key: 2 }, ki = /* @__PURE__ */ h({
   __name: "Header",
   props: {
     model: {},
@@ -4980,16 +5002,16 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
             key: m
           }, null, 8, ["model"]))), 128))
         ], 6)),
-        n.survey.isMobile ? (i(), u("div", Ci, [
+        n.survey.isMobile ? (i(), u("div", bi, [
           C(t, { model: n.model }, null, 8, ["model"])
         ])) : d("", !0)
       ], 6);
     };
   }
-}), ki = {
+}), fi = {
   key: 0,
   class: "sv-header__logo"
-}, fi = ["src", "width", "height", "alt"], wi = /* @__PURE__ */ h({
+}, wi = ["src", "width", "height", "alt"], Ii = /* @__PURE__ */ h({
   __name: "HeaderCell",
   props: {
     model: {}
@@ -5005,7 +5027,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
           class: "sv-header__cell-content",
           style: S(s.model.contentStyle)
         }, [
-          s.model.showLogo ? (i(), u("div", ki, [
+          s.model.showLogo ? (i(), u("div", fi, [
             p("div", {
               class: a(s.model.survey.logoClassNames)
             }, [
@@ -5016,7 +5038,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
                 height: s.model.survey.renderedLogoHeight,
                 alt: s.model.survey.locTitle.renderedHtml,
                 style: S({ objectFit: s.model.survey.logoFit, width: s.model.survey.renderedStyleLogoWidth, height: s.model.survey.renderedStyleLogoHeight })
-              }, null, 14, fi)
+              }, null, 14, wi)
             ], 2)
           ])) : d("", !0),
           s.model.showTitle ? (i(), u("div", {
@@ -5047,10 +5069,10 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
       ], 6);
     };
   }
-}), Ii = { class: "sv-header--mobile" }, Si = {
+}), Si = { class: "sv-header--mobile" }, Ri = {
   key: 0,
   class: "sv-header__logo"
-}, Ri = ["src", "width", "height", "alt"], Ti = /* @__PURE__ */ h({
+}, Ti = ["src", "width", "height", "alt"], $i = /* @__PURE__ */ h({
   __name: "HeaderMobile",
   props: {
     model: {}
@@ -5058,8 +5080,8 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
   setup(r) {
     return (s, n) => {
       const e = y("survey-element-title"), o = y("survey-string");
-      return i(), u("div", Ii, [
-        s.model.survey.hasLogo ? (i(), u("div", Si, [
+      return i(), u("div", Si, [
+        s.model.survey.hasLogo ? (i(), u("div", Ri, [
           p("div", {
             class: a(s.model.survey.logoClassNames)
           }, [
@@ -5070,7 +5092,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
               height: s.model.survey.renderedLogoHeight,
               alt: s.model.survey.locTitle.renderedHtml,
               style: S({ objectFit: s.model.survey.logoFit, width: s.model.survey.renderedStyleLogoWidth, height: s.model.survey.renderedStyleLogoHeight })
-            }, null, 14, Ri)
+            }, null, 14, Ti)
           ], 2)
         ])) : d("", !0),
         s.model.survey.hasTitle ? (i(), u("div", {
@@ -5100,7 +5122,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
       ]);
     };
   }
-}), $i = /* @__PURE__ */ h({
+}), _i = /* @__PURE__ */ h({
   __name: "Element",
   props: {
     element: {},
@@ -5108,7 +5130,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
     css: {}
   },
   setup(r) {
-    const s = r, n = T(), e = (v) => v.isPanel ? "survey-panel" : "survey-question", o = I(() => {
+    const s = r, n = $(), e = (v) => v.isPanel ? "survey-panel" : "survey-question", o = I(() => {
       const v = s.element.survey;
       if (v) {
         const c = v.getElementWrapperComponentName(s.element);
@@ -5145,14 +5167,14 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
       style: S(t(v.element)),
       class: a(v.element.cssClasses.questionWrapper)
     }, [
-      v.row.isNeedRender ? (i(), g($(o.value), z(E({ key: 0 }, l.value)), null, 16)) : v.element.skeletonComponentName ? (i(), g($(v.element.skeletonComponentName), {
+      v.row.isNeedRender ? (i(), g(T(o.value), z(H({ key: 0 }, l.value)), null, 16)) : v.element.skeletonComponentName ? (i(), g(T(v.element.skeletonComponentName), {
         key: 1,
         element: v.element,
         css: v.css
       }, null, 8, ["element", "css"])) : d("", !0)
     ], 6));
   }
-}), _i = /* @__PURE__ */ h({
+}), Di = /* @__PURE__ */ h({
   __name: "TemplateRenderer",
   props: {
     componentName: {},
@@ -5160,9 +5182,9 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
   },
   setup(r) {
     const s = Te(), n = I(() => !!s.default);
-    return (e, o) => n.value && !e.componentName ? $e(e.$slots, "default", { key: 0 }) : (i(), g($(e.componentName), z(E({ key: 1 }, e.componentData)), null, 16));
+    return (e, o) => n.value && !e.componentName ? $e(e.$slots, "default", { key: 0 }) : (i(), g(T(e.componentName), z(H({ key: 1 }, e.componentData)), null, 16));
   }
-}), Di = /* @__PURE__ */ h({
+}), Bi = /* @__PURE__ */ h({
   __name: "FileCleanButton",
   props: {
     question: {},
@@ -5186,7 +5208,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
       ], 2);
     };
   }
-}), Bi = ["id"], Li = /* @__PURE__ */ h({
+}), Li = ["id"], Ni = /* @__PURE__ */ h({
   __name: "FileVideo",
   props: {
     question: {}
@@ -5208,14 +5230,14 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
           playsinline: "",
           id: s.question.videoId,
           class: a(s.question.cssClasses.video)
-        }, null, 10, Bi),
+        }, null, 10, Li),
         C(e, {
           item: s.question.takePictureAction
         }, null, 8, ["item"])
       ], 2);
     };
   }
-}), Ni = ["for", "aria-label"], Pi = /* @__PURE__ */ h({
+}), Pi = ["for", "aria-label"], Ai = /* @__PURE__ */ h({
   __name: "FileChooseButton",
   props: {
     data: {},
@@ -5244,12 +5266,12 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
           size: "auto"
         }, null, 8, ["title", "iconName"])) : d("", !0),
         p("span", null, R(n.value.chooseButtonText), 1)
-      ], 10, Ni)), [
+      ], 10, Pi)), [
         [l]
       ]);
     };
   }
-}), Ai = ["onClick", "href", "title", "download"], Mi = ["src"], Hi = ["onClick"], Ei = ["onClick", "href", "title", "download"], Wi = /* @__PURE__ */ h({
+}), Mi = ["onClick", "href", "title", "download"], Ei = ["src"], Hi = ["onClick"], Wi = ["onClick", "href", "title", "download"], Vi = /* @__PURE__ */ h({
   __name: "FilePreview",
   props: {
     question: {}
@@ -5275,7 +5297,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
               title: o.name,
               download: o.name,
               style: S({ width: s.question.imageWidth })
-            }, R(o.name), 13, Ai)
+            }, R(o.name), 13, Mi)
           ], 2)) : d("", !0),
           p("div", {
             class: a(s.question.getImageWrapperCss(o))
@@ -5288,7 +5310,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
                 width: s.question.imageWidth
               }),
               alt: "File preview"
-            }, null, 12, Mi)) : d("", !0),
+            }, null, 12, Ei)) : d("", !0),
             s.question.defaultImage(o) ? (i(), g(e, {
               key: 1,
               iconName: s.question.cssClasses.defaultImageIconId,
@@ -5322,21 +5344,21 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
               title: o.name,
               download: o.name,
               style: S({ width: s.question.imageWidth })
-            }, R(o.name), 13, Ei)
+            }, R(o.name), 13, Wi)
           ], 2)) : d("", !0)
         ], 2)), [
-          [H, o && s.question.isPreviewVisible(t)]
+          [E, o && s.question.isPreviewVisible(t)]
         ])), 128))
       ], 2)) : d("", !0);
     };
   }
-}), Vi = /* @__PURE__ */ h({
+}), Fi = /* @__PURE__ */ h({
   __name: "ButtonGroup",
   props: {
     question: {}
   },
   setup(r) {
-    const s = r, n = T();
+    const s = r, n = $();
     return A(s, n), (e, o) => {
       const t = y("sv-button-group-item");
       return i(), u("div", {
@@ -5354,7 +5376,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
       ], 2);
     };
   }
-}), Fi = ["title"], Oi = ["name", "id", "aria-required", "aria-label", "aria-invalid", "aria-errormessage", "disabled", "value"], zi = ["title"], Ui = /* @__PURE__ */ h({
+}), Oi = ["title"], zi = ["name", "id", "aria-required", "aria-label", "aria-invalid", "aria-errormessage", "disabled", "value"], Ui = ["title"], Ki = /* @__PURE__ */ h({
   __name: "ButtonGroupItem",
   props: {
     item: {},
@@ -5391,7 +5413,7 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
           class: a(n.value.css.control),
           "onUpdate:modelValue": t[0] || (t[0] = (v) => e.value = v),
           value: n.value.value
-        }, null, 10, Oi), [
+        }, null, 10, zi), [
           [x, e.value]
         ]),
         p("div", {
@@ -5411,12 +5433,12 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
             C(m, {
               locString: n.value.caption
             }, null, 8, ["locString"])
-          ], 10, zi)) : d("", !0)
+          ], 10, Ui)) : d("", !0)
         ], 2)
-      ], 10, Fi);
+      ], 10, Oi);
     };
   }
-}), Ki = ["src", "width", "height", "alt"], ji = /* @__PURE__ */ h({
+}), Qi = ["src", "width", "height", "alt"], ji = /* @__PURE__ */ h({
   inheritAttrs: !1,
   __name: "Logo",
   props: {
@@ -5438,13 +5460,13 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
           width: n.value.renderedStyleLogoWidth,
           height: n.value.renderedStyleLogoHeight
         })
-      }, null, 14, Ki)
+      }, null, 14, Qi)
     ], 2));
   }
-}), Qi = /* @__PURE__ */ h({
+}), Gi = /* @__PURE__ */ h({
   __name: "SvgBundle",
   setup(r) {
-    const s = T();
+    const s = $();
     return M(() => {
       s.value.innerHTML = Oe.iconsRenderedHtml();
     }), (n, e) => P((i(), u("svg", {
@@ -5452,13 +5474,13 @@ const hi = /* @__PURE__ */ he(qi, [["render", gi]]), Ci = { key: 2 }, bi = /* @_
       ref_key: "root",
       ref: s
     }, null, 512)), [
-      [H, !1]
+      [E, !1]
     ]);
   }
 });
 ze.platform = "vue3";
-function Gi(r) {
-  r.component("SurveyComponent", pe), r.component("sv-svg-bundle", Qi), r.component("PopupSurveyComponent", ve), r.component("survey", pe), r.component("popup-survey", ve), r.component("survey-header", Ge), r.component("sv-logo-image", ji), r.component("survey-page", Qe), r.component("survey-row", Je), r.component("survey-question", xe), r.component("survey-panel", os), r.component("survey-element-header", is), r.component("survey-string", rs), r.component("sv-string-viewer", as), r.component("sv-string-editor", ds), r.component("sv-skeleton", cs), r.component("survey-text", qs), r.component("survey-text-input", hs), r.component("survey-checkbox", ws), r.component("survey-checkbox-item", Rs), r.component("survey-radiogroup", Ts), r.component("survey-radiogroup-item", Ds), r.component("survey-signaturepad", Ps), r.component("survey-html", Ms), r.component("survey-image", Vs), r.component("survey-expression", Fs), r.component("survey-file", Us), r.component("sv-file-choose-btn", Pi), r.component("sv-file-clean-btn", Di), r.component("sv-file-preview", Wi), r.component("sv-file-video", Li), r.component("survey-imagepicker", js), r.component("survey-imagepicker-item", Ys), r.component("survey-comment", en), r.component("survey-dropdown", sn), r.component("sv-dropdown-select", rn), r.component("sv-dropdown-option-item", an), r.component("sv-dropdown", pn), r.component("survey-tagbox", vn), r.component("sv-tagbox", gn), r.component("sv-tagbox-item", fn), r.component("sv-tagbox-filter", bn), r.component("survey-ranking", wn), r.component("survey-ranking-item", _n), r.component("survey-rating", Ln), r.component("sv-rating-item", Pn), r.component("sv-rating-item-smiley", Mn), r.component("sv-rating-item-star", En), r.component("sv-rating-dropdown", zn), r.component("sv-rating-dropdown-item", On), r.component("survey-boolean", Kn), r.component("sv-boolean-radio", jn), r.component("sv-boolean-radio-item", Jn), r.component("sv-boolean-checkbox", so), r.component("survey-multipletext", no), r.component("survey-multipletext-item", to), r.component("survey-matrix", mo), r.component("survey-matrix-row", po), r.component("survey-matrix-cell", yo), r.component("survey-matrixdropdown", go), r.component("survey-matrixtable", bo), r.component("survey-matrixheaderrequired", fo), r.component("survey-matrixdropdown-cell", Io), r.component("survey-matrixdynamic", So), r.component("sv-matrix-remove-button", To), r.component("sv-matrix-drag-drop-icon", _o), r.component("sv-matrix-detail-button", Bo), r.component("survey-paneldynamic", Lo), r.component("survey-paneldynamicprogress", No), r.component("survey-paneldynamicprogress-v2", Po), r.component("sv-paneldynamic-add-btn", Ao), r.component("sv-paneldynamic-next-btn", Ho), r.component("sv-paneldynamic-prev-btn", Wo), r.component("sv-paneldynamic-remove-btn", Vo), r.component("sv-paneldynamic-progress-text", Fo), r.component("sv-components-container", Et), r.component("sv-progress-buttons", Ut), r.component("sv-navigation-toc", Kt), r.component("sv-progress-pages", Z), r.component("sv-progress-questions", Z), r.component("sv-progress-correctquestions", Z), r.component("sv-progress-requiredquestions", Z), r.component("survey-errors", zo), r.component("survey-question-comment", jo), r.component("survey-element-title", Qo), r.component("survey-element-title-content", Yo), r.component("sv-title-actions", et), r.component("sv-brand-info", rt), r.component("sv-svg-icon", ut), r.component("sv-action-bar", dt), r.component("sv-action", pt), r.component("sv-action-bar-item", yt), r.component("sv-action-bar-item-dropdown", Ct), r.component("sv-action-bar-separator", bt), r.component("sv-list", It), r.component("sv-list-item", Tt), r.component("sv-popup", $t), r.component("sv-popup-container", At), r.component("popup-pointer", Mt), r.component("sv-notifier", ei), r.component("survey-other-choice", oi), r.component("sv-nav-btn", ii), r.component("survey-customwidget", li), r.component("survey-popup-modal", ai), r.component("sv-character-counter", ui), r.component("survey-composite", di), r.component("survey-custom", mi), r.component("sv-timerpanel", vi), r.component("sv-loading-indicator", hi), r.component("sv-header", bi), r.component("sv-header-cell", wi), r.component("sv-header-mobile", Ti), r.component("sv-template-renderer", _i), r.component("survey-element", $i), r.component("survey-buttongroup", Vi), r.component("sv-button-group-item", Ui), r.directive("key2click", {
+function Ji(r) {
+  r.component("SurveyComponent", pe), r.component("sv-svg-bundle", Gi), r.component("PopupSurveyComponent", ve), r.component("survey", pe), r.component("popup-survey", ve), r.component("survey-header", Ge), r.component("sv-logo-image", ji), r.component("survey-page", je), r.component("survey-row", Je), r.component("survey-question", xe), r.component("survey-panel", os), r.component("survey-element-header", is), r.component("survey-string", rs), r.component("sv-string-viewer", as), r.component("sv-string-editor", ds), r.component("sv-skeleton", cs), r.component("survey-text", qs), r.component("survey-text-input", hs), r.component("survey-checkbox", ws), r.component("survey-checkbox-item", Rs), r.component("survey-radiogroup", Ts), r.component("survey-radiogroup-item", Ds), r.component("survey-signaturepad", Ps), r.component("survey-html", Ms), r.component("survey-image", Vs), r.component("survey-expression", Fs), r.component("survey-file", Us), r.component("sv-file-choose-btn", Ai), r.component("sv-file-clean-btn", Bi), r.component("sv-file-preview", Vi), r.component("sv-file-video", Ni), r.component("survey-imagepicker", Qs), r.component("survey-imagepicker-item", Ys), r.component("survey-comment", en), r.component("survey-dropdown", sn), r.component("sv-dropdown-select", rn), r.component("sv-dropdown-option-item", an), r.component("sv-dropdown", pn), r.component("survey-tagbox", vn), r.component("sv-tagbox", gn), r.component("sv-tagbox-item", fn), r.component("sv-tagbox-filter", bn), r.component("survey-ranking", wn), r.component("survey-ranking-item", _n), r.component("survey-rating", Ln), r.component("sv-rating-item", Pn), r.component("sv-rating-item-smiley", Mn), r.component("sv-rating-item-star", Hn), r.component("sv-rating-dropdown", zn), r.component("sv-rating-dropdown-item", On), r.component("survey-boolean", Kn), r.component("sv-boolean-radio", Qn), r.component("sv-boolean-radio-item", Jn), r.component("sv-boolean-checkbox", so), r.component("survey-multipletext", no), r.component("survey-multipletext-item", to), r.component("survey-matrix", mo), r.component("survey-matrix-row", po), r.component("survey-matrix-cell", yo), r.component("survey-matrixdropdown", go), r.component("survey-matrixtable", bo), r.component("survey-matrixheaderrequired", fo), r.component("survey-matrixdropdown-cell", Io), r.component("survey-matrixdynamic", So), r.component("sv-matrix-remove-button", To), r.component("sv-matrix-drag-drop-icon", _o), r.component("sv-matrix-detail-button", Bo), r.component("survey-paneldynamic", Lo), r.component("survey-paneldynamicprogress", No), r.component("survey-paneldynamicprogress-v2", Po), r.component("sv-paneldynamic-add-btn", Ao), r.component("sv-paneldynamic-next-btn", Eo), r.component("sv-paneldynamic-prev-btn", Wo), r.component("sv-paneldynamic-remove-btn", Vo), r.component("sv-paneldynamic-progress-text", Fo), r.component("sv-components-container", Wt), r.component("sv-progress-buttons", Kt), r.component("sv-navigation-toc", Qt), r.component("sv-progress-pages", Z), r.component("sv-progress-questions", Z), r.component("sv-progress-correctquestions", Z), r.component("sv-progress-requiredquestions", Z), r.component("survey-errors", zo), r.component("survey-question-comment", Qo), r.component("survey-element-title", jo), r.component("survey-element-title-content", Yo), r.component("sv-title-actions", et), r.component("sv-brand-info", rt), r.component("sv-question-error", dt), r.component("sv-svg-icon", ut), r.component("sv-action-bar", mt), r.component("sv-action", vt), r.component("sv-action-bar-item", gt), r.component("sv-action-bar-item-dropdown", bt), r.component("sv-action-bar-separator", kt), r.component("sv-list", St), r.component("sv-list-item", $t), r.component("sv-popup", _t), r.component("sv-popup-container", Mt), r.component("popup-pointer", Et), r.component("sv-notifier", si), r.component("survey-other-choice", ti), r.component("sv-nav-btn", ri), r.component("survey-customwidget", ai), r.component("survey-popup-modal", ui), r.component("sv-character-counter", di), r.component("survey-composite", mi), r.component("survey-custom", ci), r.component("sv-timerpanel", qi), r.component("sv-loading-indicator", Ci), r.component("sv-header", ki), r.component("sv-header-cell", Ii), r.component("sv-header-mobile", $i), r.component("sv-template-renderer", Di), r.component("survey-element", _i), r.component("survey-buttongroup", Fi), r.component("sv-button-group-item", Ki), r.directive("key2click", {
     mounted: function(s, n) {
       const e = { ...n.value };
       if (e.disableTabStop) {
@@ -5473,13 +5495,13 @@ function Gi(r) {
     }
   });
 }
-const Yi = {
+const Zi = {
   install(r) {
-    Gi(r);
+    Ji(r);
   }
 };
 export {
-  Yi as surveyPlugin,
+  Zi as surveyPlugin,
   B as useBase,
   le as useComputedArray,
   J as useLocString,