survey-vue3-ui 1.9.108 → 1.9.109

package/survey-vue3-ui.es.js

@@ -1,5 +1,5 @@
-import { shallowReactive as ce, watch as Q, onBeforeUnmount as U, onMounted as A, ref as S, shallowRef as F, triggerRef as oe, unref as f, isRef as pe, defineComponent as C, computed as R, onUpdated as Z, resolveComponent as v, openBlock as t, createElementBlock as u, normalizeClass as l, createVNode as b, createCommentVNode as m, Fragment as w, renderList as T, createBlock as q, createElementVNode as p, normalizeStyle as $, onUnmounted as V, withDirectives as L, resolveDynamicComponent as N, vShow as H, toDisplayString as I, vModelCheckbox as z, vModelRadio as J, resolveDirective as Y, vModelSelect as ve, vModelText as qe, getCurrentInstance as x, withCtx as ye, createStaticVNode as ge, normalizeProps as Ce, guardReactiveProps as he, toRaw as be, Teleport as ke } from "vue";
-import { Base as fe, RendererFactory as G, DropdownListModel as Ie, Helpers as we, DropdownMultiSelectListModel as Se, doKey2ClickUp as de, createSvg as Re, ActionDropdownViewModel as Te, getActionDropdownButtonTarget as $e, createPopupViewModel as te, SurveyProgressModel as ie, SurveyProgressButtonsModel as Be, TOCModel as Le, SvgRegistry as De, PopupSurveyModel as Pe, settings as O, createDialogOptions as Me, createPopupModalViewModel as Ne, SurveyModel as He, doKey2ClickDown as Ae, doKey2ClickBlur as Ee } from "survey-core";
+import { shallowReactive as ce, watch as Q, onBeforeUnmount as U, onMounted as A, ref as R, shallowRef as F, triggerRef as oe, unref as f, isRef as pe, defineComponent as C, computed as S, onUpdated as Z, resolveComponent as v, openBlock as t, createElementBlock as u, normalizeClass as l, createVNode as b, createCommentVNode as m, Fragment as w, renderList as T, createBlock as q, createElementVNode as p, normalizeStyle as $, onUnmounted as V, withDirectives as L, resolveDynamicComponent as M, vShow as H, toDisplayString as I, vModelCheckbox as z, vModelRadio as J, resolveDirective as Y, vModelSelect as ve, vModelText as qe, getCurrentInstance as x, withCtx as ye, createStaticVNode as ge, normalizeProps as Ce, guardReactiveProps as he, toRaw as be, Teleport as ke } from "vue";
+import { Base as fe, RendererFactory as G, DropdownListModel as Ie, Helpers as we, DropdownMultiSelectListModel as Re, doKey2ClickUp as de, createSvg as Se, ActionDropdownViewModel as Te, getActionDropdownButtonTarget as $e, createPopupViewModel as te, SurveyProgressModel as ie, SurveyProgressButtonsModel as Be, TOCModel as Le, SvgRegistry as De, PopupSurveyModel as Pe, settings as O, createDialogOptions as Me, createPopupModalViewModel as Ne, SurveyModel as He, doKey2ClickDown as Ae, doKey2ClickBlur as Ee } from "survey-core";
 fe.createPropertiesHash = () => ce({});
 function Ve(r) {
   return !r || r.__vueImplemented ? !1 : (r.createArrayCoreHandler = (o, n) => {
@@ -39,7 +39,7 @@ function B(r, o, n) {
     i && (n && n(r()), le(i, s), e());
   });
 }
-function M(r, o, n, s) {
+function N(r, o, n, s) {
   B(() => r.question, n, s), A(() => {
     r.question && r.question.afterRenderQuestionElement(o.value);
   }), U(() => {
@@ -47,7 +47,7 @@ function M(r, o, n, s) {
   });
 }
 function W(r) {
-  const o = S(), n = (e) => {
+  const o = R(), n = (e) => {
     o.value = e.renderedHtml, e.onChanged = () => {
       o.value = e.renderedHtml;
     };
@@ -74,9 +74,9 @@ const Oe = /* @__PURE__ */ C({
     css: {}
   },
   setup(r) {
-    const o = r, n = S(null);
+    const o = r, n = R(null);
     B(() => o.page);
-    const s = R(() => o.page._showDescription), e = R(() => o.page.rows);
+    const s = S(() => o.page._showDescription), e = S(() => o.page.rows);
     return A(() => {
       o.survey && o.survey.afterRenderPage(n.value);
     }), Z(() => {
@@ -117,7 +117,7 @@ const Oe = /* @__PURE__ */ C({
     survey: {}
   },
   setup(r) {
-    const o = r, n = S(), s = W(() => o.survey.locLogo);
+    const o = r, n = R(), s = W(() => o.survey.locLogo);
     return A(() => {
       var e = n.value;
       e && o.survey && o.survey.afterRenderHeader(e);
@@ -195,9 +195,9 @@ const Oe = /* @__PURE__ */ C({
     survey: {}
   },
   setup(r) {
-    const o = r, n = R(
+    const o = r, n = S(
       () => o.row.visibleElements
-    ), s = S();
+    ), s = R();
     return B(() => o.row), A(() => {
       if (o.row && !o.row.isNeedRender) {
         const e = s.value;
@@ -244,7 +244,7 @@ const Oe = /* @__PURE__ */ C({
     css: {}
   },
   setup(r) {
-    const o = r, n = S(null), s = R(() => !o.element.isPanel && o.element.showErrorOnTop), e = R(() => !o.element.isPanel && o.element.showErrorOnBottom), i = (d) => d.customWidget ? "survey-customwidget" : d.getType() === "panel" || d.isDefaultRendering() ? "survey-" + d.getTemplate() : d.getComponentName(), a = (d) => d.cssContent;
+    const o = r, n = R(null), s = S(() => !o.element.isPanel && o.element.showErrorOnTop), e = S(() => !o.element.isPanel && o.element.showErrorOnBottom), i = (d) => d.customWidget ? "survey-customwidget" : d.getType() === "panel" || d.isDefaultRendering() ? "survey-" + d.getTemplate() : d.getComponentName(), a = (d) => d.cssContent;
     return B(() => o.element), A(() => {
       o.element.isPanel || o.element.afterRender(n.value);
     }), (d, c) => {
@@ -281,7 +281,7 @@ const Oe = /* @__PURE__ */ C({
             element: d.element,
             location: "top"
           }, null, 8, ["element"])) : m("", !0),
-          d.element.isPanel || !d.element.isCollapsed ? (t(), q(N(i(d.element)), {
+          d.element.isPanel || !d.element.isCollapsed ? (t(), q(M(i(d.element)), {
             key: 1,
             question: d.element
           }, null, 8, ["question"])) : m("", !0),
@@ -325,7 +325,7 @@ const Oe = /* @__PURE__ */ C({
           element: d.element,
           location: "bottom"
         }, null, 8, ["element"])) : m("", !0)
-      ], 42, Ke)) : d.element.skeletonComponentName ? (t(), q(N(d.element.skeletonComponentName), {
+      ], 42, Ke)) : d.element.skeletonComponentName ? (t(), q(M(d.element.skeletonComponentName), {
         key: 1,
         element: d.element,
         css: d.css
@@ -340,7 +340,7 @@ const Oe = /* @__PURE__ */ C({
     css: {}
   },
   setup(r) {
-    const o = r, n = S(!1), s = S(null), e = R(() => o.question.rows), i = R(() => o.question.survey), a = R(() => n.value);
+    const o = r, n = R(!1), s = R(null), e = S(() => o.question.rows), i = S(() => o.question.survey), a = S(() => n.value);
     return B(() => o.question), A(() => {
       o.question.survey && o.question.survey.afterRenderPanel(o.question, s.value), n.value = o.question.isCollapsed;
       const d = o.question;
@@ -436,7 +436,7 @@ const Oe = /* @__PURE__ */ C({
     locString: {}
   },
   setup(r) {
-    return (o, n) => (t(), q(N(o.locString.renderAs), {
+    return (o, n) => (t(), q(M(o.locString.renderAs), {
       locString: o.locString.renderAsData
     }, null, 8, ["locString"]));
   }
@@ -501,8 +501,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("survey-text-input");
       return s.question.isReadOnlyRenderDiv() ? (t(), u("div", {
         key: 0,
@@ -535,7 +535,7 @@ const Oe = /* @__PURE__ */ C({
   setup(r) {
     const o = r;
     B(() => o.question);
-    const n = R(() => o.question.inputStyle);
+    const n = S(() => o.question.inputStyle);
     return (s, e) => {
       const i = v("sv-character-counter");
       return s.question.getMaxLength() ? (t(), u("div", as, [
@@ -608,8 +608,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("survey-checkbox-item"), a = v("survey-other-choice");
       return t(), u("fieldset", {
         class: l(s.question.getSelectBaseRootCss()),
@@ -688,7 +688,7 @@ const Oe = /* @__PURE__ */ C({
     hideLabel: { type: Boolean }
   },
   setup(r) {
-    const o = r, n = R({
+    const o = r, n = S({
       get() {
         return o.question.isAllSelected || "";
       },
@@ -758,8 +758,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("survey-radiogroup-item"), a = v("survey-other-choice");
       return t(), u("fieldset", {
         class: l(s.question.getSelectBaseRootCss()),
@@ -832,7 +832,7 @@ const Oe = /* @__PURE__ */ C({
       ], 10, hs);
     };
   }
-}), Is = { role: "presentation" }, ws = ["name", "value", "id", "aria-describedby", "disabled"], Ss = ["xlink:href"], Rs = /* @__PURE__ */ C({
+}), Is = { role: "presentation" }, ws = ["name", "value", "id", "aria-describedby", "disabled"], Rs = ["xlink:href"], Ss = /* @__PURE__ */ C({
   __name: "RadiogroupItem",
   props: {
     question: {},
@@ -871,7 +871,7 @@ const Oe = /* @__PURE__ */ C({
             }, [
               p("use", {
                 "xlink:href": e.question.itemSvgIcon
-              }, null, 8, Ss)
+              }, null, 8, Rs)
             ], 2)) : m("", !0)
           ], 2)) : m("", !0),
           e.hideLabel ? m("", !0) : (t(), u("span", {
@@ -892,8 +892,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("sv-svg-icon");
       return t(), u("div", {
         class: l(s.question.cssClasses.root),
@@ -951,8 +951,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = W(() => o.question.locHtml);
     return (e, i) => (t(), u("div", {
       ref_key: "root",
@@ -967,8 +967,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = W(() => o.question.locImageLink);
     return (e, i) => {
       const a = v("sv-svg-icon");
@@ -1049,8 +1049,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => (t(), u("div", {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => (t(), u("div", {
       class: l(s.question.cssClasses.text),
       ref_key: "root",
       ref: n
@@ -1062,8 +1062,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = (e) => o.question.isPreviewVisible(e);
     return (e, i) => {
       const a = v("sv-loading-indicator"), d = v("sv-svg-icon"), c = v("sv-action-bar"), y = Y("key2click");
@@ -1252,8 +1252,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("survey-imagepicker-item");
       return t(), u("fieldset", {
         class: l(s.question.getSelectBaseRootCss()),
@@ -1415,8 +1415,8 @@ const Oe = /* @__PURE__ */ C({
     css: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = (e) => {
       const i = o.question;
       i.value = e.target.value;
@@ -1495,8 +1495,8 @@ const Oe = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("sv-dropdown"), a = v("survey-other-choice");
       return t(), u("div", {
         class: l(s.question.renderCssRoot),
@@ -1526,13 +1526,13 @@ const rn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = (a) => {
       o.question.onClick(a);
     }, e = (a) => {
       o.question.onKeyUp(a);
-    }, i = R({
+    }, i = S({
       get() {
         var a;
         return (a = o.question.value) != null ? a : "";
@@ -1613,7 +1613,7 @@ const rn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null), s = R(() => {
+    const o = r, n = R(null), s = S(() => {
       const g = o.question;
       return g.dropdownListModel || (g.dropdownListModel = new Ie(g)), o.question.dropdownListModel;
     }), e = (g) => {
@@ -1683,7 +1683,7 @@ const rn = /* @__PURE__ */ C({
               p("span", mn, I(s.value.inputStringRendered), 1),
               p("span", null, I(s.value.hintStringSuffix), 1)
             ], 2)) : m("", !0),
-            g.question.showInputFieldComponent ? (t(), q(N(g.question.inputFieldComponentName), {
+            g.question.showInputFieldComponent ? (t(), q(M(g.question.inputFieldComponentName), {
               key: 2,
               item: s.value.getSelectedAction(),
               question: g.question
@@ -1759,8 +1759,8 @@ const rn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("sv-tagbox"), a = v("survey-other-choice");
       return t(), u("div", {
         class: l(s.question.renderCssRoot),
@@ -1781,9 +1781,9 @@ const rn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = R(() => {
+    const o = r, n = S(() => {
       const d = o.question;
-      return d.dropdownListModel || (d.dropdownListModel = new Se(d)), o.question.dropdownListModel;
+      return d.dropdownListModel || (d.dropdownListModel = new Re(d)), o.question.dropdownListModel;
     }), s = (d) => {
       var c;
       (c = n.value) == null || c.onClick(d);
@@ -1982,8 +1982,8 @@ const rn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = (e) => o.question.getNumberByIndex(e);
     return (e, i) => {
       const a = v("survey-ranking-item");
@@ -2050,7 +2050,7 @@ const rn = /* @__PURE__ */ C({
       ], 2);
     };
   }
-}), Sn = ["tabindex", "data-sv-drop-target-ranking-item"], Rn = {
+}), Rn = ["tabindex", "data-sv-drop-target-ranking-item"], Sn = {
   tabindex: "-1",
   style: { outline: "none" }
 }, Tn = /* @__PURE__ */ p("path", { d: "M6 2C6 0.9 6.9 0 8 0C9.1 0 10 0.9 10 2C10 3.1 9.1 4 8 4C6.9 4 6 3.1 6 2ZM2 0C0.9 0 0 0.9 0 2C0 3.1 0.9 4 2 4C3.1 4 4 3.1 4 2C4 0.9 3.1 0 2 0ZM8 6C6.9 6 6 6.9 6 8C6 9.1 6.9 10 8 10C9.1 10 10 9.1 10 8C10 6.9 9.1 6 8 6ZM2 6C0.9 6 0 6.9 0 8C0 9.1 0.9 10 2 10C3.1 10 4 9.1 4 8C4 6.9 3.1 6 2 6ZM8 12C6.9 12 6 12.9 6 14C6 15.1 6.9 16 8 16C9.1 16 10 15.1 10 14C10 12.9 9.1 12 8 12ZM2 12C0.9 12 0 12.9 0 14C0 15.1 0.9 16 2 16C3.1 16 4 15.1 4 14C4 12.9 3.1 12 2 12Z" }, null, -1), $n = [
@@ -2090,7 +2090,7 @@ const rn = /* @__PURE__ */ C({
           );
         })
       }, [
-        p("div", Rn, [
+        p("div", Sn, [
           p("div", {
             class: l(n.cssClasses.itemGhostNode)
           }, null, 2),
@@ -2125,7 +2125,7 @@ const rn = /* @__PURE__ */ C({
             ], 2)
           ], 2)
         ])
-      ], 42, Sn);
+      ], 42, Rn);
     };
   }
 }), Mn = { role: "radiogroup" }, Nn = /* @__PURE__ */ p("legend", {
@@ -2137,8 +2137,8 @@ const rn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = (e) => o.question.getInputId(e);
     return (e, i) => {
       const a = v("survey-string");
@@ -2157,7 +2157,7 @@ const rn = /* @__PURE__ */ C({
               locString: e.question.locMinRateDescription
             }, null, 8, ["locString"])
           ], 2)) : m("", !0),
-          (t(!0), u(w, null, T(e.question.renderedRateItems, (d, c) => (t(), q(N(e.question.itemComponentName), {
+          (t(!0), u(w, null, T(e.question.renderedRateItems, (d, c) => (t(), q(M(e.question.itemComponentName), {
             key: s(c),
             item: d,
             index: c,
@@ -2312,8 +2312,8 @@ const zn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("sv-dropdown");
       return t(), u("div", {
         class: l(s.question.cssClasses.rootDropdown),
@@ -2330,8 +2330,8 @@ const zn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = (i, a) => {
       o.question.onLabelClick(i, a);
     }, e = (i) => {
@@ -2420,8 +2420,8 @@ const _n = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("sv-boolean-radio-item");
       return t(), u("div", {
         class: l(s.question.cssClasses.rootRadio),
@@ -2514,8 +2514,8 @@ const xn = /* @__PURE__ */ C({
     css: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       var c;
       const i = v("survey-element-title-content"), a = v("sv-title-actions"), d = v("survey-string");
       return t(), u("div", {
@@ -2593,8 +2593,8 @@ const xn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("survey-multipletext-item");
       return t(), u("table", {
         class: l(s.question.getQuestionRootCss()),
@@ -2633,7 +2633,7 @@ const xn = /* @__PURE__ */ C({
   setup(r) {
     const o = r, n = (e) => ee(e);
     B(() => o.cell.item.editor);
-    const s = R(() => o.cell.item);
+    const s = S(() => o.cell.item);
     return (e, i) => {
       const a = v("survey-string"), d = v("survey-errors");
       return e.cell.isErrorsCell ? (t(), q(d, {
@@ -2665,7 +2665,7 @@ const xn = /* @__PURE__ */ C({
           class: l(e.question.getItemCss()),
           onFocusin: i[0] || (i[0] = (c) => s.value.focusIn())
         }, [
-          (t(), q(N(n(s.value.editor)), {
+          (t(), q(M(n(s.value.editor)), {
             question: s.value.editor
           }, null, 8, ["question"]))
         ], 34))
@@ -2678,8 +2678,8 @@ const xn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null), s = F();
-    M(
+    const o = r, n = R(null), s = F();
+    N(
       o,
       n,
       (i) => {
@@ -2814,8 +2814,8 @@ const xn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    return M(o, n), (s, e) => {
+    const o = r, n = R(null);
+    return N(o, n), (s, e) => {
       const i = v("survey-matrixtable");
       return t(), q(i, {
         question: s.question,
@@ -2830,7 +2830,7 @@ const xn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = R(() => o.question.renderedTable);
+    const o = r, n = S(() => o.question.renderedTable);
     return B(
       () => n.value,
       (s) => {
@@ -2931,7 +2931,7 @@ const xn = /* @__PURE__ */ C({
     cell: {}
   },
   setup(r) {
-    const o = r, n = S(!1), s = S(), e = () => o.cell.headers, i = () => !!o.cell.width || !!o.cell.minWidth ? { width: o.cell.width, minWidth: o.cell.minWidth } : null, a = () => o.cell.index || "", d = () => n.value = o.cell.question.isVisible, c = (y) => ee(y);
+    const o = r, n = R(!1), s = R(), e = () => o.cell.headers, i = () => !!o.cell.width || !!o.cell.minWidth ? { width: o.cell.width, minWidth: o.cell.minWidth } : null, a = () => o.cell.index || "", d = () => n.value = o.cell.question.isVisible, c = (y) => ee(y);
     return A(() => {
       if (!(!o.cell.hasQuestion || !o.question || !o.question.survey)) {
         d(), o.cell.question.registerPropertyChangedHandlers(["isVisible"], () => {
@@ -2971,7 +2971,7 @@ const xn = /* @__PURE__ */ C({
           model: y.cell.item.getData(),
           handleClick: !1
         }, null, 8, ["model"])) : m("", !0),
-        y.cell.hasPanel ? (t(), q(N(c(y.cell.panel)), {
+        y.cell.hasPanel ? (t(), q(M(c(y.cell.panel)), {
           key: 3,
           question: y.cell.panel,
           css: y.question.cssClasses
@@ -2980,13 +2980,13 @@ const xn = /* @__PURE__ */ C({
           key: 4,
           class: l(y.question.cssClasses.cellQuestionWrapper)
         }, [
-          !y.cell.isChoice && y.cell.question.isDefaultRendering() ? L((t(), q(N(c(y.cell.question)), {
+          !y.cell.isChoice && y.cell.question.isDefaultRendering() ? L((t(), q(M(c(y.cell.question)), {
             key: 0,
             question: y.cell.question
           }, null, 8, ["question"])), [
             [H, n.value]
           ]) : m("", !0),
-          !y.cell.isChoice && !y.cell.question.isDefaultRendering() ? L((t(), q(N(y.cell.question.getComponentName()), {
+          !y.cell.isChoice && !y.cell.question.isDefaultRendering() ? L((t(), q(M(y.cell.question.getComponentName()), {
             key: 1,
             question: y.cell.question
           }, null, 8, ["question"])), [
@@ -3030,8 +3030,8 @@ const xn = /* @__PURE__ */ C({
     question: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
+    const o = r, n = R(null);
+    N(o, n);
     const s = () => {
       o.question.addRowUI();
     };
@@ -3109,8 +3109,8 @@ const xn = /* @__PURE__ */ C({
 });
 function se(r, o = !0) {
   return {
-    question: R(() => r.item.data.question),
-    row: o ? R(() => r.item.data.row) : void 0
+    question: S(() => r.item.data.question),
+    row: o ? S(() => r.item.data.row) : void 0
   };
 }
 const fo = ["disabled"], Io = /* @__PURE__ */ C({
@@ -3137,7 +3137,7 @@ const fo = ["disabled"], Io = /* @__PURE__ */ C({
       ], 10, fo);
     };
   }
-}), wo = ["xlink:href"], So = /* @__PURE__ */ C({
+}), wo = ["xlink:href"], Ro = /* @__PURE__ */ C({
   __name: "DragDropIcon",
   props: {
     item: {}
@@ -3156,7 +3156,7 @@ const fo = ["disabled"], Io = /* @__PURE__ */ C({
       class: l(f(n).cssClasses.iconDrag)
     }, null, 2));
   }
-}), Ro = ["aria-expanded", "aria-controls"], To = /* @__PURE__ */ C({
+}), So = ["aria-expanded", "aria-controls"], To = /* @__PURE__ */ C({
   __name: "DetailButton",
   props: {
     item: {}
@@ -3177,7 +3177,7 @@ const fo = ["disabled"], Io = /* @__PURE__ */ C({
           iconName: f(n).getDetailPanelIconId(f(s)),
           size: "auto"
         }, null, 8, ["class", "iconName"])
-      ], 10, Ro);
+      ], 10, So);
     };
   }
 }), $o = /* @__PURE__ */ C({
@@ -3187,8 +3187,8 @@ const fo = ["disabled"], Io = /* @__PURE__ */ C({
     css: {}
   },
   setup(r) {
-    const o = r, n = S(null), s = x();
-    M(
+    const o = r, n = R(null), s = x();
+    N(
       o,
       n,
       (a) => {
@@ -3210,7 +3210,7 @@ const fo = ["disabled"], Io = /* @__PURE__ */ C({
         };
       }
     );
-    const e = R(() => {
+    const e = S(() => {
       if (o.question.isRenderModeList)
         return o.question.panels;
       const a = [];
@@ -3369,7 +3369,7 @@ const fo = ["disabled"], Io = /* @__PURE__ */ C({
   }
 });
 function K(r) {
-  return R(
+  return S(
     () => r.item && r.item.data.question || r.data.question
   );
 }
@@ -3449,7 +3449,7 @@ const Do = /* @__PURE__ */ C({
     data: {}
   },
   setup(r) {
-    const o = r, n = K(o), s = R(
+    const o = r, n = K(o), s = S(
       () => o.item && o.item.data.panel || o.data.panel
     ), e = (i) => {
       n.value.isInputReadOnly || n.value.removePanelUI(i);
@@ -3486,7 +3486,7 @@ const Do = /* @__PURE__ */ C({
     location: {}
   },
   setup(r) {
-    const o = S();
+    const o = R();
     return (n, s) => {
       const e = v("survey-string");
       return n.element.hasVisibleErrors ? (t(), u("div", {
@@ -3559,7 +3559,7 @@ const Do = /* @__PURE__ */ C({
     };
     return (n, s) => {
       const e = v("survey-element-title-content"), i = v("sv-title-actions");
-      return n.element.hasTitle ? (t(), q(N(n.element.titleTagName), {
+      return n.element.hasTitle ? (t(), q(M(n.element.titleTagName), {
         key: 0,
         class: l(n.element.cssTitle),
         "aria-label": n.element.titleAriaLabel,
@@ -3639,7 +3639,7 @@ const Do = /* @__PURE__ */ C({
     css: {}
   },
   setup(r) {
-    const o = r, n = R(() => o.element.getTitleToolbar());
+    const o = r, n = S(() => o.element.getTitleToolbar());
     return (s, e) => {
       const i = v("survey-string"), a = v("survey-element-title-content"), d = v("sv-action-bar");
       return t(), u("div", Go, [
@@ -3681,8 +3681,8 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     title: {}
   },
   setup(r) {
-    const o = r, n = S(), s = () => {
-      Re(
+    const o = r, n = R(), s = () => {
+      Se(
         o.size,
         o.width,
         o.height,
@@ -3711,7 +3711,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     handleClick: { type: Boolean }
   },
   setup(r) {
-    const o = r, n = S(null);
+    const o = r, n = R(null);
     return B(() => o.model), A(() => {
       !o.model.hasActions || o.model.initResponsivityManager(n.value);
     }), V(() => {
@@ -3740,7 +3740,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     item: {}
   },
   setup(r) {
-    const o = r, n = R(
+    const o = r, n = S(
       () => o.item.component || "sv-action-bar-item"
     );
     return B(() => o.item), (s, e) => {
@@ -3751,7 +3751,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
       }, [
         p("div", dt, [
           s.item.needSeparator ? (t(), q(i, { key: 0 })) : m("", !0),
-          (t(), q(N(n.value), { item: s.item }, null, 8, ["item"]))
+          (t(), q(M(n.value), { item: s.item }, null, 8, ["item"]))
         ])
       ], 10, ut);
     };
@@ -3853,7 +3853,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     item: {}
   },
   setup(r) {
-    const o = r, n = R(() => o.item && o.item.innerCss);
+    const o = r, n = S(() => o.item && o.item.innerCss);
     return (s, e) => (t(), u("div", {
       class: l(["sv-action-bar-separator", n.value])
     }, null, 2));
@@ -3864,7 +3864,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     model: {}
   },
   setup(r) {
-    const o = r, n = S(null), s = (a) => {
+    const o = r, n = R(null), s = (a) => {
       const d = o.model;
       d.filterString = a.target.value;
     }, e = (a) => {
@@ -3957,7 +3957,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     item: {}
   },
   setup(r) {
-    const o = r, n = R(() => o.item.elementId), s = (e) => {
+    const o = r, n = S(() => o.item.elementId), s = (e) => {
       o.model.onItemClick(o.item), e.stopPropagation();
     };
     return B(() => o.item), A(() => {
@@ -3993,7 +3993,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
             key: 1,
             locString: e.item.locTitle
           }, null, 8, ["locString"])),
-          e.item.component ? (t(), q(N(e.item.component), {
+          e.item.component ? (t(), q(M(e.item.component), {
             key: 2,
             item: e.item
           }, null, 8, ["item"])) : m("", !0)
@@ -4013,7 +4013,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
   setup(r) {
     const o = r, n = F(
       te(o.model, void 0)
-    ), s = S(null);
+    ), s = R(null);
     return Q(
       () => o.model,
       (e) => {
@@ -4038,7 +4038,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
       ], 512);
     };
   }
-}), wt = { class: "sv-popup__shadow" }, St = { class: "sv-popup__body-content" }, Rt = {
+}), wt = { class: "sv-popup__shadow" }, Rt = { class: "sv-popup__body-content" }, St = {
   key: 0,
   class: "sv-popup__body-header"
 }, Tt = { class: "sv-popup__scrolling-content" }, $t = { class: "sv-popup__content" }, Bt = {
@@ -4082,15 +4082,15 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
           onClick: s
         }, [
           p("div", wt, [
-            e.model.showHeader ? (t(), q(N(e.model.popupHeaderTemplate), {
+            e.model.showHeader ? (t(), q(M(e.model.popupHeaderTemplate), {
               key: 0,
               model: e.model
             }, null, 8, ["model"])) : m("", !0),
-            p("div", St, [
-              e.model.title ? (t(), u("div", Rt, I(e.model.title), 1)) : m("", !0),
+            p("div", Rt, [
+              e.model.title ? (t(), u("div", St, I(e.model.title), 1)) : m("", !0),
               p("div", Tt, [
                 p("div", $t, [
-                  (t(), q(N(e.model.contentComponentName), Ce(he(e.model.contentComponentData)), null, 16))
+                  (t(), q(M(e.model.contentComponentName), Ce(he(e.model.contentComponentData)), null, 16))
                 ])
               ]),
               e.model.showFooter ? (t(), u("div", Bt, [
@@ -4131,17 +4131,17 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     needRenderWrapper: {}
   },
   setup(r) {
-    const o = r, n = R(
+    const o = r, n = S(
       () => o.survey.getContainerContent(o.container)
     );
     return (s, e) => n.value.length > 0 ? (t(), u(w, { key: 0 }, [
       s.needRenderWrapper ? (t(), u("div", Pt, [
-        (t(!0), u(w, null, T(n.value, (i, a) => (t(), q(N(i.component), {
+        (t(!0), u(w, null, T(n.value, (i, a) => (t(), q(M(i.component), {
           survey: s.survey,
           container: s.container,
           model: i.data
         }, null, 8, ["survey", "container", "model"]))), 256))
-      ])) : (t(!0), u(w, { key: 1 }, T(n.value, (i, a) => (t(), q(N(i.component), {
+      ])) : (t(!0), u(w, { key: 1 }, T(n.value, (i, a) => (t(), q(M(i.component), {
         survey: s.survey,
         model: i.data
       }, null, 8, ["survey", "model"]))), 256))
@@ -4155,7 +4155,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     css: {}
   },
   setup(r) {
-    const o = r, n = R(() => o.survey.progressValue + "%"), s = (i) => ie.getProgressTextInBarCss(i), e = (i) => ie.getProgressTextUnderBarCss(i);
+    const o = r, n = S(() => o.survey.progressValue + "%"), s = (i) => ie.getProgressTextInBarCss(i), e = (i) => ie.getProgressTextUnderBarCss(i);
     return (i, a) => (t(), u("div", {
       class: l(i.survey.getProgressCssClasses(i.container))
     }, [
@@ -4181,7 +4181,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     survey: {}
   },
   setup(r) {
-    const o = r, n = new Be(o.survey), s = S(!1), e = S(), i = R(() => o.survey.css);
+    const o = r, n = new Be(o.survey), s = R(!1), e = R(), i = S(() => o.survey.css);
     let a;
     const d = (k) => n.isListElementClickable(k), c = (k) => n.getListElementCss(k), y = (k) => {
       n.clickListElement(k);
@@ -4281,15 +4281,15 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     survey: {}
   },
   setup(r) {
-    const o = r, n = S(), s = S(""), e = S(1), i = R(() => {
+    const o = r, n = R(), s = R(""), e = R(1), i = S(() => {
       const k = o.survey ? o.survey : o.model;
       return be(k);
-    }), a = R(() => i.value.activePage ? i.value.activePage.id : ""), d = () => {
+    }), a = S(() => i.value.activePage ? i.value.activePage.id : ""), d = () => {
       const k = a.value;
       return !!i.value && k + e.value.toString();
-    }, c = R(
+    }, c = S(
       () => i.value.showCompletedPage && i.value.state === "completed"
-    ), y = R(() => i.value.css), h = R(() => "page" + d()), g = () => c.value ? (s.value || (s.value = i.value.processedCompletedHtml), s.value) : "";
+    ), y = S(() => i.value.css), h = S(() => "page" + d()), g = () => c.value ? (s.value || (s.value = i.value.processedCompletedHtml), s.value) : "";
     return B(() => i.value), A(() => {
       if (!!i.value) {
         i.value.needRenderIcons && De.renderIcons();
@@ -4321,7 +4321,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
             class: l(y.value.container)
           }, [
             b(E, { survey: i.value }, null, 8, ["survey"]),
-            (t(), q(N("sv-components-container"), {
+            (t(), q(M("sv-components-container"), {
               survey: i.value,
               container: "header",
               needRenderWrapper: !1
@@ -4330,7 +4330,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
               key: 0,
               class: l(i.value.bodyContainerCss)
             }, [
-              (t(), q(N("sv-components-container"), {
+              (t(), q(M("sv-components-container"), {
                 survey: i.value,
                 container: "left",
                 needRenderWrapper: !0
@@ -4340,7 +4340,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
                 style: $({ maxWidth: i.value.renderedWidth }),
                 id: a.value
               }, [
-                (t(), q(N("sv-components-container"), {
+                (t(), q(M("sv-components-container"), {
                   survey: i.value,
                   container: "contentTop",
                   needRenderWrapper: !0
@@ -4351,19 +4351,19 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
                   page: i.value.activePage,
                   css: y.value
                 }, null, 8, ["survey", "page", "css"])),
-                (t(), q(N("sv-components-container"), {
+                (t(), q(M("sv-components-container"), {
                   survey: i.value,
                   container: "contentBottom",
                   needRenderWrapper: !0
                 }, null, 8, ["survey"]))
               ], 14, Wt),
-              (t(), q(N("sv-components-container"), {
+              (t(), q(M("sv-components-container"), {
                 survey: i.value,
                 container: "right",
                 needRenderWrapper: !0
               }, null, 8, ["survey"]))
             ], 2)) : m("", !0),
-            (t(), q(N("sv-components-container"), {
+            (t(), q(M("sv-components-container"), {
               survey: i.value,
               container: "footer",
               needRenderWrapper: !1
@@ -4372,7 +4372,12 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
               p("div", {
                 innerHTML: g(),
                 class: l(i.value.completedCss)
-              }, null, 10, Ut)
+              }, null, 10, Ut),
+              (t(), q(M("sv-components-container"), {
+                survey: i.value,
+                container: "completePage",
+                needRenderWrapper: !0
+              }, null, 8, ["survey"]))
             ])) : m("", !0),
             i.value.state === "completedbefore" ? (t(), u("div", {
               key: 2,
@@ -4479,10 +4484,10 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     closeOnCompleteTimeout: {}
   },
   setup(r) {
-    const o = r, n = F(), s = R(() => o.survey ? o.survey.getCss() : {}), e = R(() => {
+    const o = r, n = F(), s = S(() => o.survey ? o.survey.getCss() : {}), e = S(() => {
       var g;
       return (g = n.value) != null && g.isExpanded ? s.value.window.header.buttonCollapsed : s.value.window.header.buttonExpanded;
-    }), i = R(() => {
+    }), i = S(() => {
       var g;
       return (g = n.value) == null ? void 0 : g.isExpanded;
     }), a = () => {
@@ -4563,7 +4568,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
           class: l(n.value.cssBody),
           onScroll: y
         }, [
-          (t(), q(N(c()), { survey: g.survey }, null, 8, ["survey"]))
+          (t(), q(M(c()), { survey: g.survey }, null, 8, ["survey"]))
         ], 34)) : m("", !0)
       ], 6)) : m("", !0);
     };
@@ -4575,11 +4580,11 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     css: {}
   },
   setup(r) {
-    const o = r, n = S(), s = R(
+    const o = r, n = R(), s = S(
       () => o.question.customWidget.isDefaultRender
-    ), e = R(
+    ), e = S(
       () => !!o.question.customWidget.htmlTemplate
-    ), i = R(() => o.question.customWidget.htmlTemplate), a = R(() => "survey-" + o.question.getTemplate());
+    ), i = S(() => o.question.customWidget.htmlTemplate), a = S(() => "survey-" + o.question.getTemplate());
     return A(() => {
       o.question.customWidget.afterRender(o.question, n.value);
     }), U(() => {
@@ -4592,7 +4597,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
         key: 0,
         innerHTML: i.value
       }, null, 8, Yt)) : m("", !0),
-      s.value ? (t(), q(N(a.value), {
+      s.value ? (t(), q(M(a.value), {
         key: 1,
         question: d.question,
         css: d.css
@@ -4660,9 +4665,9 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     css: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
-    const s = R(() => o.question.contentPanel);
+    const o = r, n = R(null);
+    N(o, n);
+    const s = S(() => o.question.contentPanel);
     return (e, i) => {
       const a = v("survey-panel");
       return t(), q(a, {
@@ -4680,10 +4685,10 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     css: {}
   },
   setup(r) {
-    const o = r, n = S(null);
-    M(o, n);
-    const s = R(() => o.question.contentQuestion), e = (i) => ee(i);
-    return (i, a) => (t(), q(N(e(s.value)), {
+    const o = r, n = R(null);
+    N(o, n);
+    const s = S(() => o.question.contentQuestion), e = (i) => ee(i);
+    return (i, a) => (t(), q(M(e(s.value)), {
       ref: n.value,
       question: s.value,
       css: i.css
@@ -4698,7 +4703,7 @@ const ot = /* @__PURE__ */ me(Yo, [["render", nt]]), tt = ["aria-label"], it = /
     css: {}
   },
   setup(r) {
-    const o = r, n = R(() => ue * o.model.progress), s = R(() => o.model.text);
+    const o = r, n = S(() => ue * o.model.progress), s = S(() => o.model.text);
     return B(() => o.model), (e, i) => e.model.isRunning && e.model.showTimerAsClock ? (t(), u("div", {
       key: 0,
       class: l(e.model.rootCss)
@@ -4739,7 +4744,7 @@ function ui(r, o) {
 const di = /* @__PURE__ */ me(ri, [["render", ui]]);
 He.platform = "vue3";
 function mi(r) {
-  r.component("SurveyComponent", re), r.component("PopupSurveyComponent", ae), r.component("survey", re), r.component("popup-survey", ae), r.component("survey-header", ze), r.component("survey-page", Oe), r.component("survey-row", Ue), r.component("survey-element", _e), r.component("survey-panel", Ze), r.component("survey-element-header", Ge), r.component("survey-string", Xe), r.component("sv-string-viewer", xe), r.component("sv-string-editor", ss), r.component("sv-skeleton", os), r.component("survey-text", ls), r.component("survey-text-input", ds), r.component("survey-checkbox", ps), r.component("survey-checkbox-item", Cs), r.component("survey-radiogroup", fs), r.component("survey-radiogroup-item", Rs), r.component("survey-signaturepad", Ls), r.component("survey-html", Ps), r.component("survey-image", As), r.component("survey-expression", Es), r.component("survey-file", _s), r.component("survey-imagepicker", Qs), r.component("survey-imagepicker-item", Ys), r.component("survey-comment", sn), r.component("survey-dropdown", nn), r.component("sv-dropdown-select", rn), r.component("sv-dropdown-option-item", un), r.component("sv-dropdown", vn), r.component("survey-tagbox", qn), r.component("sv-tagbox", Cn), r.component("sv-tagbox-item", In), r.component("sv-tagbox-filter", kn), r.component("survey-ranking", wn), r.component("survey-ranking-item", Pn), r.component("survey-rating", Hn), r.component("sv-rating-item", En), r.component("sv-rating-item-smiley", On), r.component("sv-rating-item-star", Wn), r.component("sv-rating-dropdown", zn), r.component("survey-boolean", Kn), r.component("sv-boolean-radio", _n), r.component("sv-boolean-radio-item", Zn), r.component("sv-boolean-checkbox", xn), r.component("survey-multipletext", eo), r.component("survey-multipletext-item", no), r.component("survey-matrix", mo), r.component("survey-matrixdropdown", co), r.component("survey-matrixtable", yo), r.component("survey-matrixheaderrequired", Co), r.component("survey-matrixcell", bo), r.component("survey-matrixdynamic", ko), r.component("sv-matrix-remove-button", Io), r.component("sv-matrix-drag-drop-icon", So), r.component("sv-matrix-detail-button", To), r.component("survey-paneldynamic", $o), r.component("survey-paneldynamicprogress", Bo), r.component("survey-paneldynamicprogress-v2", Lo), r.component("sv-paneldynamic-add-btn", Do), r.component("sv-paneldynamic-next-btn", Mo), r.component("sv-paneldynamic-prev-btn", Ho), r.component("sv-paneldynamic-remove-btn", Ao), r.component("sv-paneldynamic-progress-text", Eo), r.component("sv-components-container", Mt), r.component("sv-progress-buttons", Et), r.component("sv-progress-toc", Vt), r.component("sv-progress-pages", j), r.component("sv-progress-questions", j), r.component("sv-progress-correctquestions", j), r.component("sv-progress-requiredquestions", j), r.component("survey-errors", Oo), r.component("survey-question-comment", zo), r.component("survey-element-title", Uo), r.component("survey-element-title-content", Zo), r.component("sv-title-actions", Jo), r.component("sv-brand-info", ot), r.component("sv-svg-icon", rt), r.component("sv-action-bar", at), r.component("sv-action", mt), r.component("sv-action-bar-item", pt), r.component("sv-action-bar-item-dropdown", qt), r.component("sv-action-bar-separator", yt), r.component("sv-list", bt), r.component("sv-list-item", ft), r.component("sv-popup", It), r.component("sv-popup-container", Lt), r.component("popup-pointer", Dt), r.component("sv-notifier", jt), r.component("survey-other-choice", Gt), r.component("sv-nav-btn", Jt), r.component("survey-customwidget", xt), r.component("survey-popup-modal", ei), r.component("sv-character-counter", si), r.component("survey-composite", ni), r.component("survey-custom", oi), r.component("sv-timerpanel", li), r.component("sv-loading-indicator", di), r.directive("key2click", {
+  r.component("SurveyComponent", re), r.component("PopupSurveyComponent", ae), r.component("survey", re), r.component("popup-survey", ae), r.component("survey-header", ze), r.component("survey-page", Oe), r.component("survey-row", Ue), r.component("survey-element", _e), r.component("survey-panel", Ze), r.component("survey-element-header", Ge), r.component("survey-string", Xe), r.component("sv-string-viewer", xe), r.component("sv-string-editor", ss), r.component("sv-skeleton", os), r.component("survey-text", ls), r.component("survey-text-input", ds), r.component("survey-checkbox", ps), r.component("survey-checkbox-item", Cs), r.component("survey-radiogroup", fs), r.component("survey-radiogroup-item", Ss), r.component("survey-signaturepad", Ls), r.component("survey-html", Ps), r.component("survey-image", As), r.component("survey-expression", Es), r.component("survey-file", _s), r.component("survey-imagepicker", Qs), r.component("survey-imagepicker-item", Ys), r.component("survey-comment", sn), r.component("survey-dropdown", nn), r.component("sv-dropdown-select", rn), r.component("sv-dropdown-option-item", un), r.component("sv-dropdown", vn), r.component("survey-tagbox", qn), r.component("sv-tagbox", Cn), r.component("sv-tagbox-item", In), r.component("sv-tagbox-filter", kn), r.component("survey-ranking", wn), r.component("survey-ranking-item", Pn), r.component("survey-rating", Hn), r.component("sv-rating-item", En), r.component("sv-rating-item-smiley", On), r.component("sv-rating-item-star", Wn), r.component("sv-rating-dropdown", zn), r.component("survey-boolean", Kn), r.component("sv-boolean-radio", _n), r.component("sv-boolean-radio-item", Zn), r.component("sv-boolean-checkbox", xn), r.component("survey-multipletext", eo), r.component("survey-multipletext-item", no), r.component("survey-matrix", mo), r.component("survey-matrixdropdown", co), r.component("survey-matrixtable", yo), r.component("survey-matrixheaderrequired", Co), r.component("survey-matrixcell", bo), r.component("survey-matrixdynamic", ko), r.component("sv-matrix-remove-button", Io), r.component("sv-matrix-drag-drop-icon", Ro), r.component("sv-matrix-detail-button", To), r.component("survey-paneldynamic", $o), r.component("survey-paneldynamicprogress", Bo), r.component("survey-paneldynamicprogress-v2", Lo), r.component("sv-paneldynamic-add-btn", Do), r.component("sv-paneldynamic-next-btn", Mo), r.component("sv-paneldynamic-prev-btn", Ho), r.component("sv-paneldynamic-remove-btn", Ao), r.component("sv-paneldynamic-progress-text", Eo), r.component("sv-components-container", Mt), r.component("sv-progress-buttons", Et), r.component("sv-progress-toc", Vt), r.component("sv-progress-pages", j), r.component("sv-progress-questions", j), r.component("sv-progress-correctquestions", j), r.component("sv-progress-requiredquestions", j), r.component("survey-errors", Oo), r.component("survey-question-comment", zo), r.component("survey-element-title", Uo), r.component("survey-element-title-content", Zo), r.component("sv-title-actions", Jo), r.component("sv-brand-info", ot), r.component("sv-svg-icon", rt), r.component("sv-action-bar", at), r.component("sv-action", mt), r.component("sv-action-bar-item", pt), r.component("sv-action-bar-item-dropdown", qt), r.component("sv-action-bar-separator", yt), r.component("sv-list", bt), r.component("sv-list-item", ft), r.component("sv-popup", It), r.component("sv-popup-container", Lt), r.component("popup-pointer", Dt), r.component("sv-notifier", jt), r.component("survey-other-choice", Gt), r.component("sv-nav-btn", Jt), r.component("survey-customwidget", xt), r.component("survey-popup-modal", ei), r.component("sv-character-counter", si), r.component("survey-composite", ni), r.component("survey-custom", oi), r.component("sv-timerpanel", li), r.component("sv-loading-indicator", di), r.directive("key2click", {
     mounted: function(o, n) {
       const s = { ...n.value };
       s.disableTabStop || (o.tabIndex = 0), o.addEventListener("keyup", (e) => (e.preventDefault(), e.stopPropagation(), de(e, s), !1)), o.addEventListener("keydown", (e) => {
@@ -4759,5 +4764,5 @@ export {
   vi as surveyPlugin,
   B as useBase,
   W as useLocString,
-  M as useQuestion
+  N as useQuestion
 };