survey-vue3-ui 2.3.4 → 2.3.6

package/survey-vue3-ui.es.js

@@ -1,7 +1,7 @@
 var Me = Object.defineProperty;
 var Ie = (u, e, n) => e in u ? Me(u, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : u[e] = n;
 var J = (u, e, n) => (Ie(u, typeof e != "symbol" ? e + "" : e, n), n);
-import { defineComponent as y, computed as M, openBlock as i, createBlock as g, resolveDynamicComponent as ce, normalizeProps as ue, guardReactiveProps as de, createSlots as Ve, renderList as V, withCtx as D, renderSlot as x, shallowReactive as Se, watch as W, onBeforeUnmount as O, onMounted as B, ref as f, shallowRef as E, watchEffect as Re, triggerRef as te, unref as w, isRef as Te, nextTick as ge, createElementBlock as a, normalizeClass as r, createVNode as c, createCommentVNode as p, Fragment as H, mergeProps as $, normalizeStyle as k, createElementVNode as v, onUnmounted as P, withDirectives as Z, vShow as A, toDisplayString as I, vModelCheckbox as oe, vModelRadio as ye, vModelSelect as Be, onUpdated as z, vModelText as Ze, getCurrentInstance as he, createStaticVNode as $e, toRaw as De, Teleport as Ae, useSlots as Pe } from "vue";
+import { defineComponent as y, computed as H, openBlock as i, createBlock as g, resolveDynamicComponent as ce, normalizeProps as ue, guardReactiveProps as de, createSlots as Ve, renderList as V, withCtx as D, renderSlot as x, shallowReactive as Se, watch as W, onBeforeUnmount as O, onMounted as B, ref as f, shallowRef as E, watchEffect as Re, triggerRef as te, unref as w, isRef as Te, nextTick as ge, createElementBlock as a, normalizeClass as r, createVNode as c, createCommentVNode as p, Fragment as M, mergeProps as $, normalizeStyle as k, createElementVNode as v, onUnmounted as P, withDirectives as Z, vShow as A, toDisplayString as I, vModelCheckbox as oe, vModelRadio as ye, vModelSelect as Be, onUpdated as z, vModelText as Ze, getCurrentInstance as he, createStaticVNode as $e, toRaw as De, Teleport as Ae, useSlots as Pe } from "vue";
 import { Base as Ne, ScrollViewModel as Ee, RendererFactory as G, Helpers as We, DropdownMultiSelectListModel as Fe, doKey2ClickUp as qe, createSvg as Oe, doKey2ClickDown as ze, doKey2ClickBlur as Ue, ActionDropdownViewModel as Qe, createPopupViewModel as Ke, SurveyProgressModel as me, ProgressButtonsResponsivityManager as je, addIconsToThemeSet as we, SvgRegistry as _, PopupSurveyModel as Ge, settings as ne, createPopupModalViewModel as Xe, ButtonGroupItemModel as Je, SurveyModel as Ye } from "survey-core";
 const ee = class ee {
   constructor() {
@@ -32,7 +32,7 @@ const m = /* @__PURE__ */ y({
     is: {}
   },
   setup(u) {
-    const e = u, n = M(
+    const e = u, n = H(
       () => F.Instance.getComponent(e.is)
     );
     return (s, o) => (i(), g(ce(n.value), ue(de(s.$attrs)), Ve({ _: 2 }, [
@@ -150,7 +150,7 @@ const ss = /* @__PURE__ */ y({
   setup(u) {
     const e = u, n = f(null), s = () => {
       e.survey && n.value && e.survey.afterRenderPage(n.value);
-    }, o = M(() => e.page._showDescription);
+    }, o = H(() => e.page._showDescription);
     return S(
       () => e.page,
       () => {
@@ -181,7 +181,7 @@ const ss = /* @__PURE__ */ y({
         is: "survey-errors",
         element: t.page
       }, null, 8, ["element"]),
-      (i(!0), a(H, null, V(t.page.visibleRows, (d) => (i(), g(m, $({
+      (i(!0), a(M, null, V(t.page.visibleRows, (d) => (i(), g(m, $({
         key: d.id,
         is: t.page.getSurvey().getRowWrapperComponentName(d)
       }, {
@@ -280,7 +280,7 @@ const ss = /* @__PURE__ */ y({
       ref_key: "root",
       ref: n
     }, [
-      (i(!0), a(H, null, V(o.row.visibleElements, (l) => (i(), g(m, {
+      (i(!0), a(M, null, V(o.row.visibleElements, (l) => (i(), g(m, {
         is: "survey-element",
         row: o.row,
         css: o.css,
@@ -300,7 +300,7 @@ const ss = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    const e = u, n = f(null), s = (q) => q.cssContent, o = () => e.element.getRootStyle(), t = M(() => e.element.singleInputQuestion);
+    const e = u, n = f(null), s = (q) => q.cssContent, o = () => e.element.getRootStyle(), t = H(() => e.element.singleInputQuestion);
     S(() => e.element);
     const l = () => {
       n.value && e.element.afterRender(n.value);
@@ -309,7 +309,7 @@ const ss = /* @__PURE__ */ y({
       () => {
         l();
       }
-    ), C = M(() => e.element.customWidget ? "survey-customwidget" : e.element.isDefaultRendering() ? "survey-" + e.element.getTemplate() : e.element.getComponentName()), L = M(() => e.element.survey.getQuestionContentWrapperComponentName(e.element)), h = M(() => ({
+    ), C = H(() => e.element.customWidget ? "survey-customwidget" : e.element.isDefaultRendering() ? "survey-" + e.element.getTemplate() : e.element.getComponentName()), L = H(() => e.element.survey.getQuestionContentWrapperComponentName(e.element)), h = H(() => ({
       componentData: {
         question: e.element,
         data: e.element.survey.getElementWrapperComponentData(e.element)
@@ -432,7 +432,7 @@ const ss = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    const e = u, n = f(null), s = M(() => e.element.survey);
+    const e = u, n = f(null), s = H(() => e.element.survey);
     return S(() => e.element), B(() => {
       e.element.survey && e.element.afterRender(n.value);
     }), (o, t) => o.element.getIsContentVisible() ? (i(), a("div", {
@@ -468,7 +468,7 @@ const ss = /* @__PURE__ */ y({
         "aria-labelledby": o.element.ariaLabelledBy,
         "aria-label": o.element.ariaLabel
       }, [
-        (i(!0), a(H, null, V(o.element.visibleRows, (l) => (i(), g(m, $({
+        (i(!0), a(M, null, V(o.element.visibleRows, (l) => (i(), g(m, $({
           key: l.id,
           is: o.element.getSurvey().getRowWrapperComponentName(l)
         }, {
@@ -662,7 +662,7 @@ const ss = /* @__PURE__ */ y({
       v("datalist", {
         id: s.question.dataListId
       }, [
-        (i(!0), a(H, null, V(s.question.dataList, (t, l) => (i(), a("option", {
+        (i(!0), a(M, null, V(s.question.dataList, (t, l) => (i(), a("option", {
           key: l,
           value: t
         }, null, 8, Is))), 128))
@@ -687,7 +687,7 @@ const ss = /* @__PURE__ */ y({
       n.getRef && n.getRef(l);
     }, o = f(null);
     e({ root: o }), S(() => n.question);
-    const t = M(() => n.question.inputStyle);
+    const t = H(() => n.question.inputStyle);
     return (l, d) => l.question.getMaxLength() ? (i(), a("div", {
       key: 1,
       ref: (C) => s(C)
@@ -812,11 +812,11 @@ const ss = /* @__PURE__ */ y({
       "aria-errormessage": t.question.a11y_input_ariaErrormessage
     }, [
       t.showLegend ? (i(), a("legend", Zs, I(t.question.locTitle.renderedHtml), 1)) : p("", !0),
-      t.question.hasHeadItems ? (i(!0), a(H, { key: 1 }, V(t.question.headItems, (d) => (i(), g(m, $({
+      t.question.hasHeadItems ? (i(!0), a(M, { key: 1 }, V(t.question.headItems, (d) => (i(), g(m, $({
         key: d.value,
         is: s(d)
       }, o(d)), null, 16, ["is"]))), 128)) : p("", !0),
-      !t.question.hasColumns && !t.question.blockedRow ? (i(!0), a(H, { key: 2 }, V(t.question.bodyItems, (d) => (i(), g(m, $({
+      !t.question.hasColumns && !t.question.blockedRow ? (i(!0), a(M, { key: 2 }, V(t.question.bodyItems, (d) => (i(), g(m, $({
         key: d.value,
         is: s(d)
       }, o(d)), null, 16, ["is"]))), 128)) : p("", !0),
@@ -824,7 +824,7 @@ const ss = /* @__PURE__ */ y({
         key: 3,
         class: r(t.question.cssClasses.rootRow)
       }, [
-        !t.question.hasColumns && t.question.blockedRow ? (i(!0), a(H, { key: 0 }, V(t.question.dataChoices, (d) => (i(), g(m, $({
+        !t.question.hasColumns && t.question.blockedRow ? (i(!0), a(M, { key: 0 }, V(t.question.dataChoices, (d) => (i(), g(m, $({
           key: d.value,
           is: s(d)
         }, o(d)), null, 16, ["is"]))), 128)) : p("", !0)
@@ -833,18 +833,18 @@ const ss = /* @__PURE__ */ y({
         key: 4,
         class: r(t.question.cssClasses.rootMultiColumn)
       }, [
-        t.question.hasColumns ? (i(!0), a(H, { key: 0 }, V(t.question.columns, (d, C) => (i(), a("div", {
+        t.question.hasColumns ? (i(!0), a(M, { key: 0 }, V(t.question.columns, (d, C) => (i(), a("div", {
           key: C,
           class: r(t.question.getColumnClass()),
           role: "presentation"
         }, [
-          (i(!0), a(H, null, V(d, (L) => (i(), g(m, $({
+          (i(!0), a(M, null, V(d, (L) => (i(), g(m, $({
             key: L.value,
             is: s(L)
           }, o(L)), null, 16, ["is"]))), 128))
         ], 2))), 128)) : p("", !0)
       ], 2)) : p("", !0),
-      t.question.hasFootItems ? (i(!0), a(H, { key: 5 }, V(t.question.footItems, (d) => (i(), g(m, $({
+      t.question.hasFootItems ? (i(!0), a(M, { key: 5 }, V(t.question.footItems, (d) => (i(), g(m, $({
         key: d.value,
         is: s(d)
       }, o(d)), null, 16, ["is"]))), 128)) : p("", !0),
@@ -901,7 +901,7 @@ const Ps = ["name", "checked", "value", "id", "disabled", "readonly", "required"
     const s = (o) => {
       n.question.clickItemHandler(n.item, o.target.checked);
     };
-    return (o, t) => (i(), a(H, null, [
+    return (o, t) => (i(), a(M, null, [
       v("div", {
         role: "presentation",
         class: r(o.question.getItemClass(o.item)),
@@ -984,7 +984,7 @@ const Ps = ["name", "checked", "value", "id", "disabled", "readonly", "required"
       () => n.item,
       () => n.question,
       e
-    ), (l, d) => (i(), a(H, null, [
+    ), (l, d) => (i(), a(M, null, [
       v("div", {
         role: "presentation",
         class: r(l.question.getItemClass(l.item)),
@@ -1359,16 +1359,16 @@ const Ps = ["name", "checked", "value", "id", "disabled", "readonly", "required"
       ref: n
     }, [
       v("legend", r1, I(t.question.locTitle.renderedHtml), 1),
-      t.question.hasColumns ? p("", !0) : (i(!0), a(H, { key: 0 }, V(t.question.visibleChoices, (d) => (i(), g(m, $({
+      t.question.hasColumns ? p("", !0) : (i(!0), a(M, { key: 0 }, V(t.question.visibleChoices, (d) => (i(), g(m, $({
         key: d.value,
         is: s(d)
       }, o(d)), null, 16, ["is"]))), 128)),
-      t.question.hasColumns ? (i(!0), a(H, { key: 1 }, V(t.question.columns, (d, C) => (i(), a("div", {
+      t.question.hasColumns ? (i(!0), a(M, { key: 1 }, V(t.question.columns, (d, C) => (i(), a("div", {
         class: r(t.question.getColumnClass()),
         key: C,
         role: "presentation"
       }, [
-        (i(!0), a(H, null, V(d, (L) => (i(), g(m, $({
+        (i(!0), a(M, null, V(d, (L) => (i(), g(m, $({
           key: L.value,
           is: s(L)
         }, o(L)), null, 16, ["is"]))), 128))
@@ -1383,7 +1383,7 @@ const Ps = ["name", "checked", "value", "id", "disabled", "readonly", "required"
     item: {}
   },
   setup(u) {
-    const e = u, n = (t) => e.question.getItemClass(t), s = M({
+    const e = u, n = (t) => e.question.getItemClass(t), s = H({
       get() {
         return e.question.value;
       },
@@ -1556,20 +1556,22 @@ const Ps = ["name", "checked", "value", "id", "disabled", "readonly", "required"
   },
   setup(u) {
     const e = u, n = f(null);
-    return T(e, n), (s, o) => (i(), a("div", {
-      class: r(s.question.renderCssRoot),
+    T(e, n);
+    const s = H(() => e.question.selectedItem), o = H(() => e.question.isShowingChoiceComment);
+    return (t, l) => (i(), a("div", {
+      class: r(t.question.renderCssRoot),
       ref_key: "root",
       ref: n
     }, [
       c(m, {
         is: "sv-dropdown",
-        question: s.question
+        question: t.question
       }, null, 8, ["question"]),
-      s.question.isShowingChoiceComment ? (i(), g(m, {
+      o.value ? (i(), g(m, {
         key: 0,
         is: "survey-other-choice",
-        question: s.question,
-        item: s.question.selectedItem
+        question: t.question,
+        item: s.value
       }, null, 8, ["question", "item"])) : p("", !0)
     ], 2));
   }
@@ -1595,7 +1597,7 @@ const h1 = /* @__PURE__ */ y({
       e.question.onClick(l);
     }, o = (l) => {
       e.question.onKeyUp(l);
-    }, t = M({
+    }, t = H({
       get() {
         return e.question.value ?? "";
       },
@@ -1632,7 +1634,7 @@ const h1 = /* @__PURE__ */ y({
           required: l.question.isRequired
         }, [
           l.question.allowClear ? (i(), a("option", g1, I(l.question.placeholder), 1)) : p("", !0),
-          (i(!0), a(H, null, V(l.question.visibleChoices, (C) => (i(), g(m, {
+          (i(!0), a(M, null, V(l.question.visibleChoices, (C) => (i(), g(m, {
             is: "sv-dropdown-option-item",
             item: C,
             key: C.id
@@ -1679,7 +1681,7 @@ const h1 = /* @__PURE__ */ y({
     question: {}
   },
   setup(u) {
-    const e = u, n = f(null), s = M(() => e.question.dropdownListModel), o = (b) => {
+    const e = u, n = f(null), s = H(() => e.question.dropdownListModel), o = (b) => {
       var R;
       (R = s.value) == null || R.onClick(b);
     }, t = (b) => {
@@ -1696,9 +1698,9 @@ const h1 = /* @__PURE__ */ y({
       e.question.onFocus(b);
     }, L = (b) => {
       s.value.inputStringRendered = b.target.value;
-    }, h = M(
+    }, h = H(
       () => e.question.showSelectedItemLocText
-    ), q = M(() => e.question.selectedItemLocText);
+    ), q = H(() => e.question.selectedItemLocText);
     return S(() => s.value), z(l), B(l), (b, R) => {
       var N, K, j, ae;
       return i(), a("div", {
@@ -1851,7 +1853,7 @@ const h1 = /* @__PURE__ */ y({
     question: {}
   },
   setup(u) {
-    const e = u, n = M(() => {
+    const e = u, n = H(() => {
       const d = e.question;
       return d.dropdownListModel || (d.dropdownListModel = new Fe(d)), e.question.dropdownListModel;
     }), s = (d) => {
@@ -1893,7 +1895,7 @@ const h1 = /* @__PURE__ */ y({
           v("div", {
             class: r(d.question.cssClasses.controlValue)
           }, [
-            (i(!0), a(H, null, V(w(l), (R, N) => (i(), g(m, {
+            (i(!0), a(M, null, V(w(l), (R, N) => (i(), g(m, {
               is: "sv-tagbox-item",
               item: R,
               question: d.question,
@@ -1962,7 +1964,7 @@ const h1 = /* @__PURE__ */ y({
       e.question.onBlur(d);
     }, t = (d) => {
       e.question.onFocus(d);
-    }, l = M({
+    }, l = H({
       get() {
         return e.model.inputStringRendered ?? "";
       },
@@ -2083,7 +2085,7 @@ const h1 = /* @__PURE__ */ y({
       ref_key: "root",
       ref: n
     }, [
-      t.question.selectToRankEnabled ? p("", !0) : (i(!0), a(H, { key: 0 }, V(t.question.renderedRankingChoices, (d, C) => (i(), g(m, $({
+      t.question.selectToRankEnabled ? p("", !0) : (i(!0), a(M, { key: 0 }, V(t.question.renderedRankingChoices, (d, C) => (i(), g(m, $({
         key: d.value + "-" + C + "-item",
         is: s(d)
       }, o(d, C)), null, 16, ["is"]))), 128)),
@@ -2092,7 +2094,7 @@ const h1 = /* @__PURE__ */ y({
         class: r(t.question.getContainerClasses("from")),
         "data-ranking": "from-container"
       }, [
-        (i(!0), a(H, null, V(t.question.renderedUnRankingChoices, (d, C) => (i(), g(m, $({
+        (i(!0), a(M, null, V(t.question.renderedUnRankingChoices, (d, C) => (i(), g(m, $({
           key: d.value + "-" + C + "-item",
           is: s(d)
         }, o(d, C, !0)), null, 16, ["is"]))), 128)),
@@ -2115,7 +2117,7 @@ const h1 = /* @__PURE__ */ y({
         class: r(t.question.getContainerClasses("to")),
         "data-ranking": "to-container"
       }, [
-        (i(!0), a(H, null, V(t.question.renderedRankingChoices, (d, C) => (i(), g(m, $({
+        (i(!0), a(M, null, V(t.question.renderedRankingChoices, (d, C) => (i(), g(m, $({
           key: d.value + "-" + C + "-item",
           is: s(d)
         }, o(d, C)), null, 16, ["is"]))), 128)),
@@ -2144,7 +2146,7 @@ const h1 = /* @__PURE__ */ y({
     unrankedItem: { type: Boolean }
   },
   setup(u) {
-    const e = u, n = M(() => e.question.getNumberByIndex(e.index));
+    const e = u, n = H(() => e.question.getNumberByIndex(e.index));
     return S(() => e.item), (s, o) => (i(), a("div", {
       id: s.question.getItemId(s.item),
       tabindex: s.question.getItemTabIndex(s.item),
@@ -2271,7 +2273,7 @@ const h1 = /* @__PURE__ */ y({
             locString: o.question.locMinRateDescription
           }, null, 8, ["locString"])
         ], 2)) : p("", !0),
-        (i(!0), a(H, null, V(o.question.renderedRateItems, (l, d) => (i(), g(m, {
+        (i(!0), a(M, null, V(o.question.renderedRateItems, (l, d) => (i(), g(m, {
           key: s(d),
           is: o.question.itemComponent,
           item: l,
@@ -2745,14 +2747,14 @@ const hn = /* @__PURE__ */ y({
       ref: n
     }, [
       v("tbody", null, [
-        (i(!0), a(H, null, V(w(s), (l, d) => (i(), a(H, {
+        (i(!0), a(M, null, V(w(s), (l, d) => (i(), a(M, {
           key: o.question.inputId + "rowkey" + d
         }, [
           l.isVisible ? (i(), a("tr", {
             key: 0,
             class: r(o.question.cssClasses.row)
           }, [
-            (i(!0), a(H, null, V(l.cells, (C) => (i(), a("td", {
+            (i(!0), a(M, null, V(l.cells, (C) => (i(), a("td", {
               key: "item" + C.item.editor.id,
               class: r(C.className)
             }, [
@@ -2776,7 +2778,7 @@ const hn = /* @__PURE__ */ y({
   setup(u) {
     const e = u, n = (o) => ie(o);
     S(() => e.cell.item.editor);
-    const s = M(() => e.cell.item);
+    const s = H(() => e.cell.item);
     return (o, t) => o.cell.isErrorsCell ? (i(), g(m, {
       key: 1,
       is: "survey-errors",
@@ -2833,7 +2835,7 @@ const hn = /* @__PURE__ */ y({
       key: 0,
       class: r(n.css.breadcrumbsRoot)
     }, [
-      (i(!0), a(H, null, V(n.model.actions, (o, t) => (i(), a(H, {
+      (i(!0), a(M, null, V(n.model.actions, (o, t) => (i(), a(M, {
         key: o.renderedId
       }, [
         t ? (i(), g(m, {
@@ -2857,7 +2859,7 @@ const hn = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    const e = u, n = M(() => "survey-placeholder-" + e.summary.question.getTemplate()), s = M(() => F.Instance.isComponentRegistered(n.value));
+    const e = u, n = H(() => "survey-placeholder-" + e.summary.question.getTemplate()), s = H(() => F.Instance.isComponentRegistered(n.value));
     return (o, t) => o.summary.isEmpty() ? (i(), a("div", Mn, [
       s.value ? (i(), g(m, {
         key: 0,
@@ -2874,7 +2876,7 @@ const hn = /* @__PURE__ */ y({
       key: 0,
       class: r(o.css.summary)
     }, [
-      (i(!0), a(H, null, V(o.summary.items, (l, d) => (i(), a("div", {
+      (i(!0), a(M, null, V(o.summary.items, (l, d) => (i(), a("div", {
         key: d,
         class: r(o.css.summaryRow)
       }, [
@@ -2976,7 +2978,7 @@ const hn = /* @__PURE__ */ y({
             class: r(o.question.cssClasses.rangeTrack),
             style: k({ left: o.question.getTrackPercentLeft() + "%", right: o.question.getTrackPercentRight() + "%" })
           }, null, 6),
-          (i(!0), a(H, null, V(o.question.renderedValue, (l, d) => (i(), a(H, { key: d }, [
+          (i(!0), a(M, null, V(o.question.renderedValue, (l, d) => (i(), a(M, { key: d }, [
             v("input", {
               class: r(o.question.cssClasses.input),
               id: "sjs-slider-input-" + d,
@@ -3046,7 +3048,7 @@ const hn = /* @__PURE__ */ y({
         class: r(o.question.cssClasses.labelsContainer)
       }, [
         v("div", null, [
-          (i(!0), a(H, null, V(o.question.renderedLabels, (l) => (i(), g(m, {
+          (i(!0), a(M, null, V(o.question.renderedLabels, (l) => (i(), g(m, {
             key: l.id,
             is: "sv-slider-label-item",
             item: l,
@@ -3125,7 +3127,7 @@ const hn = /* @__PURE__ */ y({
           t.question.showHeader ? (i(), a("thead", Dn, [
             v("tr", null, [
               t.question.hasRows ? (i(), a("td", An)) : p("", !0),
-              (i(!0), a(H, null, V(t.question.visibleColumns, (d, C) => (i(), a("th", {
+              (i(!0), a(M, null, V(t.question.visibleColumns, (d, C) => (i(), a("th", {
                 key: C,
                 class: r(t.question.cssClasses.headerCell),
                 style: k({
@@ -3149,7 +3151,7 @@ const hn = /* @__PURE__ */ y({
             ])
           ])) : p("", !0),
           v("tbody", null, [
-            (i(!0), a(H, null, V(s.value, (d, C) => (i(), a("tr", {
+            (i(!0), a(M, null, V(s.value, (d, C) => (i(), a("tr", {
               key: "row_" + d.name + "_" + C,
               class: r(d.rowClasses || void 0)
             }, [
@@ -3175,7 +3177,7 @@ const hn = /* @__PURE__ */ y({
               ], 6), [
                 [A, t.question.hasRows]
               ]),
-              t.question.hasCellText ? (i(!0), a(H, { key: 0 }, V(t.question.visibleColumns, (L, h) => (i(), a("td", {
+              t.question.hasCellText ? (i(!0), a(M, { key: 0 }, V(t.question.visibleColumns, (L, h) => (i(), a("td", {
                 key: h,
                 class: r(t.question.getItemClass(d, L)),
                 onClick: (q) => o(d, L)
@@ -3185,7 +3187,7 @@ const hn = /* @__PURE__ */ y({
                   locString: t.question.getCellDisplayLocText(d.name, L)
                 }, null, 8, ["locString"])
               ], 10, Pn))), 128)) : p("", !0),
-              t.question.hasCellText ? p("", !0) : (i(!0), a(H, { key: 1 }, V(t.question.visibleColumns, (L, h) => (i(), a("td", {
+              t.question.hasCellText ? p("", !0) : (i(!0), a(M, { key: 1 }, V(t.question.visibleColumns, (L, h) => (i(), a("td", {
                 key: h,
                 "data-responsive-title": L.locText.renderedHtml,
                 class: r(t.question.cssClasses.cell)
@@ -3231,7 +3233,7 @@ const hn = /* @__PURE__ */ y({
       ref_key: "root",
       ref: n
     }, [
-      (i(!0), a(H, null, V(o.row.cells, (l) => (i(), g(m, {
+      (i(!0), a(M, null, V(o.row.cells, (l) => (i(), g(m, {
         is: "survey-matrixdropdown-cell",
         cell: l,
         question: o.question,
@@ -3252,7 +3254,7 @@ const hn = /* @__PURE__ */ y({
     const e = u, n = () => {
       const o = e.row, t = e.column;
       o.cellClick(t);
-    }, s = M(() => e.question.getItemSvgIcon(e.row, e.column));
+    }, s = H(() => e.question.getItemSvgIcon(e.row, e.column));
     return (o, t) => (i(), a("label", {
       onMousedown: t[0] || (t[0] = (l) => o.question.onMouseDown()),
       class: r(o.question.getItemClass(o.row, o.column))
@@ -3314,7 +3316,7 @@ const hn = /* @__PURE__ */ y({
     question: {}
   },
   setup(u) {
-    const e = u, n = M(() => e.question.renderedTable);
+    const e = u, n = H(() => e.question.renderedTable);
     return S(() => n.value), (s, o) => (i(), a("div", {
       style: k({ overflowX: s.question.showHorizontalScroll ? "scroll" : "" }),
       class: r(s.question.cssClasses.tableWrapper)
@@ -3324,7 +3326,7 @@ const hn = /* @__PURE__ */ y({
       }, [
         n.value.showHeader ? (i(), a("thead", Kn, [
           v("tr", null, [
-            (i(!0), a(H, null, V(n.value.headerRow.cells, (t) => (i(), a(H, null, [
+            (i(!0), a(M, null, V(n.value.headerRow.cells, (t) => (i(), a(M, null, [
               t.hasTitle ? (i(), a("th", {
                 key: "header_" + t.id,
                 class: r(t.className),
@@ -3358,7 +3360,7 @@ const hn = /* @__PURE__ */ y({
           ])
         ])) : p("", !0),
         v("tbody", null, [
-          (i(!0), a(H, null, V(n.value.renderedRows, (t) => (i(), g(m, {
+          (i(!0), a(M, null, V(n.value.renderedRows, (t) => (i(), g(m, {
             key: s.question.inputId + "_" + t.id,
             is: "survey-matrix-row",
             row: t,
@@ -3367,7 +3369,7 @@ const hn = /* @__PURE__ */ y({
         ]),
         n.value.showFooter ? (i(), a("tfoot", jn, [
           v("tr", null, [
-            (i(!0), a(H, null, V(n.value.footerRow.cells, (t, l) => (i(), g(m, {
+            (i(!0), a(M, null, V(n.value.footerRow.cells, (t, l) => (i(), g(m, {
               is: "survey-matrixdropdown-cell",
               cell: t,
               question: s.question,
@@ -3386,7 +3388,7 @@ const hn = /* @__PURE__ */ y({
   },
   setup(u) {
     const e = u;
-    return S(() => e.column), (n, s) => n.column.isRenderedRequired ? (i(), a(H, { key: 0 }, [
+    return S(() => e.column), (n, s) => n.column.isRenderedRequired ? (i(), a(M, { key: 0 }, [
       Xn,
       n.column.isRenderedRequired ? (i(), a("span", {
         key: 0,
@@ -3419,7 +3421,7 @@ const hn = /* @__PURE__ */ y({
       };
       e.question.survey.matrixAfterCellRender(b), q && q.afterRenderCore(h);
     });
-    const C = M(() => {
+    const C = H(() => {
       const h = e.cell;
       if (h.hasPanel) {
         const q = h.panel, b = q.survey;
@@ -3430,7 +3432,7 @@ const hn = /* @__PURE__ */ y({
         }
         return "survey-panel";
       }
-    }), L = M(() => {
+    }), L = H(() => {
       if (e.cell.hasPanel) {
         const q = e.cell.panel, b = q.survey;
         let R;
@@ -3666,8 +3668,8 @@ const hn = /* @__PURE__ */ y({
 });
 function re(u, e = !0) {
   return {
-    question: M(() => u.item.data.question),
-    row: e ? M(() => u.item.data.row) : void 0
+    question: H(() => u.item.data.question),
+    row: e ? H(() => u.item.data.row) : void 0
   };
 }
 const st = ["disabled"], nt = /* @__PURE__ */ y({
@@ -3816,7 +3818,7 @@ const st = ["disabled"], nt = /* @__PURE__ */ y({
       v("div", {
         class: r(l.question.cssClasses.panelsContainer)
       }, [
-        (i(!0), a(H, null, V(l.question.renderedPanels, (C, L) => (i(), a(H, {
+        (i(!0), a(M, null, V(l.question.renderedPanels, (C, L) => (i(), a(M, {
           key: C.id
         }, [
           v("div", {
@@ -3950,7 +3952,7 @@ const st = ["disabled"], nt = /* @__PURE__ */ y({
   }
 });
 function X(u) {
-  return M(
+  return H(
     () => u.item && u.item.data.question || u.data.question
   );
 }
@@ -4032,7 +4034,7 @@ const Ct = ["id"], ct = /* @__PURE__ */ y({
     data: {}
   },
   setup(u) {
-    const e = u, n = X(e), s = M(
+    const e = u, n = X(e), s = H(
       () => e.item && e.item.data.panel || e.data.panel
     ), o = (l) => n.value.getPanelRemoveButtonId(l), t = (l) => {
       n.value.isInputReadOnly || n.value.removePanelUI(l);
@@ -4083,7 +4085,7 @@ const Ct = ["id"], ct = /* @__PURE__ */ y({
       ref_key: "root",
       ref: e
     }, [
-      (i(!0), a(H, null, V(n.element.errors, (o, t) => (i(), g(m, {
+      (i(!0), a(M, null, V(n.element.errors, (o, t) => (i(), g(m, {
         is: n.element.survey.questionErrorComponent,
         element: n.element,
         key: "error_" + t,
@@ -4166,7 +4168,7 @@ const Ct = ["id"], ct = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    return (e, n) => (i(), a(H, null, [
+    return (e, n) => (i(), a(M, null, [
       e.element.isTitleRenderedAsString ? (i(), g(m, {
         key: 0,
         is: "survey-string",
@@ -4211,7 +4213,7 @@ const Ct = ["id"], ct = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    const e = u, n = M(() => e.element.getTitleToolbar());
+    const e = u, n = H(() => e.element.getTitleToolbar());
     return (s, o) => (i(), a("div", Zt, [
       v("span", $t, [
         s.element.isPage ? (i(), g(m, {
@@ -4334,7 +4336,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
       class: r(l.model.getRootCss()),
       onClick: s
     }, [
-      (i(!0), a(H, null, V(w(o), (C) => (i(), g(m, {
+      (i(!0), a(M, null, V(w(o), (C) => (i(), g(m, {
         is: "sv-action",
         key: C.renderedId,
         item: C
@@ -4347,7 +4349,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
     item: {}
   },
   setup(u) {
-    const e = f(), n = u, s = M(
+    const e = f(), n = u, s = H(
       () => n.item.component || "sv-action-bar-item"
     );
     return S(() => n.item), B(() => {
@@ -4462,7 +4464,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
       () => {
         n.dispose();
       }
-    ), (s, o) => (i(), a(H, null, [
+    ), (s, o) => (i(), a(M, null, [
       Z((i(), a("button", {
         type: "button",
         class: r(s.item.getActionBarItemCss()),
@@ -4503,7 +4505,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
     item: {}
   },
   setup(u) {
-    const e = u, n = M(() => e.item && e.item.innerCss);
+    const e = u, n = H(() => e.item && e.item.innerCss);
     return (s, o) => (i(), a("div", {
       class: r(["sv-action-bar-separator", n.value])
     }, null, 2));
@@ -4592,7 +4594,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
           d.model.onKeyDown(L);
         })
       }, [
-        (i(!0), a(H, null, V(w(l), (L) => (i(), g(m, {
+        (i(!0), a(M, null, V(w(l), (L) => (i(), g(m, {
           is: "sv-list-item",
           item: L,
           model: d.model,
@@ -4610,11 +4612,11 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
     item: {}
   },
   setup(u) {
-    const e = u, n = M(() => e.item.elementId), s = (t) => {
+    const e = u, n = H(() => e.item.elementId), s = (t) => {
       e.model.onItemClick(e.item), t.stopPropagation();
     };
     S(() => e.item);
-    const o = M(
+    const o = H(
       () => e.item.component || e.model.itemComponent
     );
     return B(() => {
@@ -4662,7 +4664,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
   },
   setup(u) {
     const e = u;
-    return S(() => e.item), (n, s) => (i(), a(H, null, [
+    return S(() => e.item), (n, s) => (i(), a(M, null, [
       n.item.iconName ? (i(), g(m, {
         key: 0,
         is: "sv-svg-icon",
@@ -4691,7 +4693,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
   },
   setup(u) {
     const e = u;
-    return S(() => e.item), (n, s) => (i(), a(H, null, [
+    return S(() => e.item), (n, s) => (i(), a(M, null, [
       c(m, {
         is: "sv-list-item-content",
         item: n.item,
@@ -4759,7 +4761,10 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
       onKeydown: o[0] || (o[0] = (t) => {
         s.model.onKeyDown(t);
       }),
-      onClick: o[1] || (o[1] = (t) => {
+      onFocusout: o[1] || (o[1] = (t) => {
+        s.model.blur(t);
+      }),
+      onClick: o[2] || (o[2] = (t) => {
         s.model.clickOutside(t);
       })
     }, [
@@ -4822,22 +4827,22 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
     needRenderWrapper: {}
   },
   setup(u) {
-    const e = u, n = M(
+    const e = u, n = H(
       () => e.survey.getContainerContent(e.container)
     );
-    return (s, o) => n.value.length > 0 ? (i(), a(H, { key: 0 }, [
+    return (s, o) => n.value.length > 0 ? (i(), a(M, { key: 0 }, [
       s.needRenderWrapper ? (i(), a("div", {
         key: 0,
         class: r(["sv-components-column", "sv-components-container-" + s.container])
       }, [
-        (i(!0), a(H, null, V(n.value, (t) => (i(), g(m, {
+        (i(!0), a(M, null, V(n.value, (t) => (i(), g(m, {
           key: t.id,
           is: t.component,
           survey: s.survey,
           container: s.container,
           model: t.data
         }, null, 8, ["is", "survey", "container", "model"]))), 128))
-      ], 2)) : (i(!0), a(H, { key: 1 }, V(n.value, (t) => (i(), g(m, {
+      ], 2)) : (i(!0), a(M, { key: 1 }, V(n.value, (t) => (i(), g(m, {
         key: t.id,
         is: t.component,
         survey: s.survey,
@@ -4854,7 +4859,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
     css: {}
   },
   setup(u) {
-    const e = u, n = M(() => e.survey.progressValue + "%"), s = (t) => me.getProgressTextInBarCss(t), o = (t) => me.getProgressTextUnderBarCss(t);
+    const e = u, n = H(() => e.survey.progressValue + "%"), s = (t) => me.getProgressTextInBarCss(t), o = (t) => me.getProgressTextUnderBarCss(t);
     return (t, l) => (i(), a("div", {
       class: r(t.survey.getProgressCssClasses(t.container))
     }, [
@@ -4883,7 +4888,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
     container: {}
   },
   setup(u) {
-    const e = u, n = f(!1), s = f(!1), o = f(!1), t = f(!0), l = f(), d = M(() => e.survey.css);
+    const e = u, n = f(!1), s = f(!1), o = f(!1), t = f(!0), l = f(), d = H(() => e.survey.css);
     let C = null;
     const L = (h) => {
       let q = l.value;
@@ -4901,7 +4906,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
         onUpdateSettings: () => {
           t.value = e.model.showItemTitles, o.value = !e.model.showItemTitles;
         },
-        container: M(() => e.container)
+        container: H(() => e.container)
       });
     }), O(() => {
       C.dispose();
@@ -4938,7 +4943,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
           v("ul", {
             class: r(d.value.progressButtonsList)
           }, [
-            (i(!0), a(H, null, V(h.survey.visiblePages, (b, R) => (i(), a("li", {
+            (i(!0), a(M, null, V(h.survey.visiblePages, (b, R) => (i(), a("li", {
               key: "listelement" + R,
               class: r(h.model.getListElementCss(R)),
               onClick: (N) => h.model.isListElementClickable(R) ? h.model.clickListElement(b) : null,
@@ -5031,7 +5036,7 @@ const Ot = /* @__PURE__ */ At(Pt, [["render", Ft]]), zt = /* @__PURE__ */ v("use
   }
 });
 /*!
- * surveyjs - Survey JavaScript library v2.3.4
+ * surveyjs - Survey JavaScript library v2.3.6
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -5099,7 +5104,7 @@ var Bo = {
   "smiley-rate9-24x24": '<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path d="M12.01 24C6.85767 24 1.15509 20.96 0.0145752 14.16C-0.0354475 13.87 0.0445888 13.57 0.234675 13.35C0.424761 13.13 0.704888 13 0.995019 13H23.005C23.2951 13 23.5752 13.13 23.7653 13.35C23.9554 13.57 24.0354 13.87 23.9854 14.16C22.8549 20.95 17.1423 24 11.99 24H12.01ZM2.25559 15C3.61621 19.82 8.0182 22 12.01 22C16.0018 22 20.4038 19.82 21.7644 15H2.25559ZM8.00819 6V2C8.00819 1.45 7.55799 1 7.00774 1C6.45749 1 6.00729 1.45 6.00729 2V6C6.00729 6.55 6.45749 7 7.00774 7C7.55799 7 8.00819 6.55 8.00819 6ZM18.0127 6V2C18.0127 1.45 17.5625 1 17.0123 1C16.462 1 16.0118 1.45 16.0118 2V6C16.0118 6.55 16.462 7 17.0123 7C17.5625 7 18.0127 6.55 18.0127 6Z"></path></svg>'
 };
 /*!
- * surveyjs - Survey JavaScript library v2.3.4
+ * surveyjs - Survey JavaScript library v2.3.6
  * Copyright (c) 2015-2025 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -5180,15 +5185,15 @@ const le = /* @__PURE__ */ y({
     survey: {}
   },
   setup(u) {
-    const e = u, n = f(), s = f(""), o = f(1), t = M(() => {
+    const e = u, n = f(), s = f(""), o = f(1), t = H(() => {
       const R = e.survey ? e.survey : e.model;
       return De(R);
-    }), l = M(() => t.value.activePage ? t.value.activePage.id : ""), d = () => {
+    }), l = H(() => t.value.activePage ? t.value.activePage.id : ""), d = () => {
       const R = l.value;
       return !!t.value && R + o.value.toString();
-    }, C = M(
+    }, C = H(
       () => t.value.showCompletedPage && t.value.state === "completed"
-    ), L = M(() => t.value.css), h = M(() => "page" + d()), q = () => C.value ? (s.value || (s.value = t.value.processedCompletedHtml), s.value) : "", b = (R) => {
+    ), L = H(() => t.value.css), h = H(() => "page" + d()), q = () => C.value ? (s.value || (s.value = t.value.processedCompletedHtml), s.value) : "", b = (R) => {
       if (R) {
         var N = n.value;
         N && R.afterRenderSurvey(N), R.renderCallback = () => {
@@ -5535,11 +5540,11 @@ const le = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    const e = u, n = f(), s = M(
+    const e = u, n = f(), s = H(
       () => e.question.customWidget.isDefaultRender
-    ), o = M(
+    ), o = H(
       () => !!e.question.customWidget.htmlTemplate
-    ), t = M(() => e.question.customWidget.htmlTemplate), l = M(() => "survey-" + e.question.getTemplate());
+    ), t = H(() => e.question.customWidget.htmlTemplate), l = H(() => "survey-" + e.question.getTemplate());
     return B(() => {
       e.question.customWidget.afterRender(e.question, n.value);
     }), O(() => {
@@ -5596,7 +5601,7 @@ const le = /* @__PURE__ */ y({
       null
     ), s = function(t) {
       n.value = t, e.getRef && e.getRef(t);
-    }, o = M(() => e.model.getTextValue() || "");
+    }, o = H(() => e.model.getTextValue() || "");
     return B(() => {
       e.model.setElement(n.value);
     }), z(() => {
@@ -5660,7 +5665,7 @@ const le = /* @__PURE__ */ y({
   setup(u) {
     const e = u, n = f(null);
     T(e, n);
-    const s = M(() => e.question.contentPanel);
+    const s = H(() => e.question.contentPanel);
     return (o, t) => (i(), g(m, {
       is: "survey-panel",
       ref_key: "root",
@@ -5679,7 +5684,7 @@ const le = /* @__PURE__ */ y({
   setup(u) {
     const e = u, n = f(null);
     T(e, n);
-    const s = M(() => e.question.contentQuestion), o = (t) => ie(t);
+    const s = H(() => e.question.contentQuestion), o = (t) => ie(t);
     return (t, l) => (i(), g(m, {
       ref: n.value,
       is: o(s.value),
@@ -5696,7 +5701,7 @@ const le = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    const e = u, n = M(() => Ce * e.model.progress), s = M(() => e.model.text);
+    const e = u, n = H(() => Ce * e.model.progress), s = H(() => e.model.text);
     return S(() => e.model), (o, t) => o.model.isRunning && o.model.showTimerAsClock ? (i(), a("div", {
       key: 0,
       class: r(o.model.rootCss)
@@ -5765,7 +5770,7 @@ const le = /* @__PURE__ */ y({
         class: r(n.model.contentClasses),
         style: k({ maxWidth: n.model.maxWidth })
       }, [
-        (i(!0), a(H, null, V(n.model.cells, (o, t) => (i(), g(m, {
+        (i(!0), a(M, null, V(n.model.cells, (o, t) => (i(), g(m, {
           is: "sv-header-cell",
           model: o,
           key: t
@@ -5899,7 +5904,7 @@ const le = /* @__PURE__ */ y({
     css: {}
   },
   setup(u) {
-    const e = u, n = f(), s = (C) => C.isPanel ? "survey-panel" : "survey-question", o = M(() => {
+    const e = u, n = f(), s = (C) => C.isPanel ? "survey-panel" : "survey-question", o = H(() => {
       const C = e.element.survey;
       if (C) {
         const L = C.getElementWrapperComponentName(e.element);
@@ -5907,7 +5912,7 @@ const le = /* @__PURE__ */ y({
           return L;
       }
       return s(e.element);
-    }), t = (C) => C.cssClasses ? C.rootStyle : {}, l = M(() => {
+    }), t = (C) => C.cssClasses ? C.rootStyle : {}, l = H(() => {
       const C = e.element, L = C.survey;
       let h;
       return L && (h = L.getElementWrapperComponentData(C)), {
@@ -5954,7 +5959,7 @@ const le = /* @__PURE__ */ y({
     componentData: {}
   },
   setup(u) {
-    const e = Pe(), n = M(() => !!e.default);
+    const e = Pe(), n = H(() => !!e.default);
     return (s, o) => n.value && !s.componentName ? x(s.$slots, "default", { key: 0 }) : (i(), g(m, $({
       key: 1,
       is: s.componentName
@@ -6019,7 +6024,7 @@ const le = /* @__PURE__ */ y({
     item: {}
   },
   setup(u) {
-    const e = u, n = M(
+    const e = u, n = H(
       () => {
         var s, o;
         return ((s = e.data) == null ? void 0 : s.question) || ((o = e.item) == null ? void 0 : o.data.question);
@@ -6054,7 +6059,7 @@ const le = /* @__PURE__ */ y({
       key: 0,
       class: r(e.question.cssClasses.fileList || void 0)
     }, [
-      (i(!0), a(H, null, V(e.question.renderedPages, (s) => (i(), g(m, {
+      (i(!0), a(M, null, V(e.question.renderedPages, (s) => (i(), g(m, {
         is: "sv-file-page",
         key: s.id,
         page: s,
@@ -6075,7 +6080,7 @@ const le = /* @__PURE__ */ y({
       ref_key: "root",
       ref: n
     }, [
-      (i(!0), a(H, null, V(s.question.visibleChoices, (t, l) => (i(), g(m, {
+      (i(!0), a(M, null, V(s.question.visibleChoices, (t, l) => (i(), g(m, {
         is: "sv-button-group-item",
         question: s.question,
         key: l,
@@ -6092,9 +6097,9 @@ const le = /* @__PURE__ */ y({
     index: {}
   },
   setup(u) {
-    const e = u, n = M(
+    const e = u, n = H(
       () => new Je(e.question, e.item, e.index)
-    ), s = M({
+    ), s = H({
       get: () => e.question.renderedValue,
       set: (o) => {
         const t = e.question;
@@ -6175,7 +6180,7 @@ const Vi = /* @__PURE__ */ y({
     data: {}
   },
   setup(u) {
-    const e = u, n = M(() => e.data), s = U(() => n.value.locLogo);
+    const e = u, n = H(() => e.data), s = U(() => n.value.locLogo);
     return (o, t) => (i(), a("div", {
       class: r(n.value.logoClassNames)
     }, [
@@ -6223,7 +6228,7 @@ const Vi = /* @__PURE__ */ y({
       class: r(n.page.css),
       id: n.page.id
     }, [
-      (i(!0), a(H, null, V(n.page.items, (o) => (i(), g(m, {
+      (i(!0), a(M, null, V(n.page.items, (o) => (i(), g(m, {
         is: "sv-file-item",
         key: o,
         item: o,