survey-vue3-ui
Version:
survey.js is a JavaScript Survey Library. It is a modern way to add a survey to your website. It uses JSON for survey metadata and results.
1,463 lines • 286 kB
JavaScript
var Ie = Object.defineProperty;
var Ve = (u, e, n) => e in u ? Ie(u, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : u[e] = n;
var K = (u, e, n) => (Ve(u, typeof e != "symbol" ? e + "" : e, n), n);
import { defineComponent as y, computed as f, openBlock as i, createBlock as C, resolveDynamicComponent as ge, normalizeProps as ae, guardReactiveProps as ue, createSlots as Se, renderList as V, withCtx as D, renderSlot as J, watch as N, onBeforeUpdate as Re, onUpdated as E, onBeforeMount as Te, onMounted as T, onBeforeUnmount as z, ref as k, unref as w, isRef as x, triggerRef as ye, nextTick as he, customRef as Be, createElementBlock as a, normalizeClass as l, createVNode as c, createCommentVNode as p, Fragment as M, mergeProps as $, normalizeStyle as L, createElementVNode as v, onUnmounted as P, withDirectives as B, vShow as A, toDisplayString as H, vModelCheckbox as se, vModelRadio as qe, vModelSelect as Ze, vModelText as $e, shallowRef as Y, createStaticVNode as De, toRaw as Ae, Teleport as Pe, useSlots as Ne } from "vue";
import { ScrollViewModel as Ee, RendererFactory as U, Helpers as We, DropdownMultiSelectListModel as Fe, doKey2ClickUp as we, createSvg as Oe, doKey2ClickDown as ze, doKey2ClickBlur as Ue, ActionDropdownViewModel as Qe, createPopupViewModel as Ke, SurveyProgressModel as de, ProgressButtonsResponsivityManager as je, addIconsToThemeSet as be, SvgRegistry as G, PopupSurveyModel as Ge, settings as ee, createPopupModalViewModel as Je, ButtonGroupItemModel as Xe, SurveyModel as Ye } from "survey-core";
const X = class X {
constructor() {
K(this, "creatorHash", {});
}
registerComponent(e, n) {
this.creatorHash[e] = n;
}
getComponent(e) {
return this.creatorHash[e] || e;
}
getAllTypes() {
const e = new Array();
for (const n in this.creatorHash)
e.push(n);
return e.sort();
}
isComponentRegistered(e) {
return !!this.creatorHash[e];
}
};
K(X, "Instance", new X());
let W = X;
const d = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "SvComponent",
props: {
is: {}
},
setup(u) {
const e = u, n = f(
() => W.Instance.getComponent(e.is)
);
return (s, t) => (i(), C(ge(n.value), ae(ue(s.$attrs)), Se({ _: 2 }, [
V(s.$slots, (o, r) => ({
name: r,
fn: D((m) => [
J(s.$slots, r, ae(ue(m)))
])
}))
]), 1040));
}
});
class _e {
constructor(e) {
K(this, "currentNextTickPromise");
this.element = e;
}
async add() {
const e = he();
this.currentNextTickPromise !== e && (this.currentNextTickPromise = e, await e, e == this.currentNextTickPromise && this.element.afterRerender());
}
}
function xe(u) {
let e = u.initialValue;
return Be((n, s) => {
const t = () => {
u.isUpdateAllowed() && (s(), u.nextRenderManager.add());
};
return {
get() {
return n(), e;
},
set(o) {
const r = e !== o;
e = o, r && t();
}
};
});
}
function es(u) {
if (u) {
if (u.__vueUpdatesLock = u.__vueUpdatesLock ?? 0, u.__vueImplemented = u.__vueImplemented ?? 0, u.__vueImplemented <= 0) {
const e = () => u.__vueUpdatesLock <= 0, n = new _e(u), s = (o, r) => {
const m = r.valueFromHash;
e() && x(m) && (ye(m), n.add());
}, t = (o, r, m) => {
o[r] = xe({
initialValue: m === void 0 ? o[r] : m,
surveyElement: u,
isUpdateAllowed: e,
nextRenderManager: n
});
};
u.addOnArrayChangedCallback(s), u.createArrayCoreHandler = (o, r) => (t(o, r, []), w(o[r])), u.iteratePropertiesHash((o, r) => {
t(o, r);
}), u.getPropertyValueCoreHandler = (o, r) => (x(o[r]) || t(o, r), w(o[r])), u.setPropertyValueCoreHandler = (o, r, m) => {
x(o[r]) ? o[r].value = m : t(o, r, m), n.add();
}, u.__vueClear = () => {
u.iteratePropertiesHash((o, r) => {
o[r] = w(o[r]);
}), delete u.__vueClear, delete u.__vueUpdatesLock, delete u.__vueImplemented, u.removeOnArrayChangedCallback(s), u.createArrayCoreHandler = void 0, u.getPropertyValueCoreHandler = void 0, u.setPropertyValueCoreHandler = void 0, u.disableOnElementRerenderedEvent();
}, u.enableOnElementRerenderedEvent();
}
u.__vueImplemented++;
}
}
function ss(u) {
return !!u.__vueImplemented;
}
function me(u) {
u && (u.__vueImplemented = u.__vueImplemented ?? 0, u.__vueImplemented--, u.__vueImplemented <= 0 && typeof u.__vueClear == "function" && u.__vueClear());
}
function pe(u) {
u && u.__vueUpdatesLock !== void 0 && u.__vueUpdatesLock++;
}
function ve(u) {
u && u.__vueUpdatesLock !== void 0 && u.__vueUpdatesLock--;
}
function I(u, e, n) {
let s;
const t = N(
u,
(r, m) => {
r && e && e(r, m), m && (me(m), n && n(m)), s = r, es(r);
},
{
immediate: !0
}
);
let o = !1;
Re(() => {
pe(s);
}), E(() => {
ve(s);
}), Te(() => pe(s)), T(() => ve(s)), z(() => {
if (!o) {
const r = u();
r && (me(r), t(), n && n(r)), o = !0;
}
});
}
function R(u, e, n, s) {
I(() => u.question, n, s), T(() => {
u.question && u.question.afterRenderQuestionElement(e.value);
}), z(() => {
u.question.beforeDestroyQuestionElement(e.value);
});
}
function F(u) {
const e = k(), n = (o) => {
e.value = o.renderedHtml;
}, s = (o) => {
e.value = o.renderedHtml, o.onStringChanged.add(n);
}, t = N(
u,
(o, r) => {
r && r.onStringChanged.remove(n), s(o);
},
{ immediate: !0 }
);
return z(() => {
const o = u();
o && o.onStringChanged.remove(n), t();
}), e;
}
function ne(u) {
return u.customWidget ? "survey-customwidget" : u.isDefaultRendering && u.isDefaultRendering() || u.isPanel ? "survey-" + u.getTemplate() : u.getComponentName();
}
const ns = /* @__PURE__ */ y({
__name: "Page",
props: {
survey: {},
page: {},
css: {}
},
setup(u) {
const e = u, n = k(null), s = () => {
e.survey && n.value && e.survey.afterRenderPage(n.value);
}, t = f(() => e.page._showDescription);
return I(
() => e.page,
() => {
s();
}
), T(() => {
s();
}), (o, r) => (i(), a("div", {
class: l(o.page.cssRoot),
ref_key: "root",
ref: n
}, [
c(d, {
is: "survey-element-title",
element: o.page,
css: o.css
}, null, 8, ["element", "css"]),
t.value ? (i(), a("div", {
key: 0,
class: l(o.page.cssClasses.page.description)
}, [
c(d, {
is: "survey-string",
locString: o.page.locDescription
}, null, 8, ["locString"])
], 2)) : p("", !0),
c(d, {
is: "survey-errors",
element: o.page
}, null, 8, ["element"]),
(i(!0), a(M, null, V(o.page.visibleRows, (m) => (i(), C(d, $({
key: m.id,
is: o.page.getSurvey().getRowWrapperComponentName(m)
}, {
componentData: o.page.getSurvey().getRowWrapperComponentData(m)
}), {
default: D(() => [
c(d, {
is: "survey-row",
row: m,
survey: o.survey,
css: o.css
}, null, 8, ["row", "survey", "css"])
]),
_: 2
}, 1040, ["is"]))), 128))
], 2));
}
}), ts = /* @__PURE__ */ y({
__name: "Header",
props: {
survey: {}
},
setup(u) {
const e = u, n = k();
return T(() => {
var s = n.value;
s && e.survey && e.survey.afterRenderHeader(s);
}), (s, t) => s.survey.renderedHasHeader ? (i(), a("div", {
key: 0,
class: l(s.survey.css.header),
ref_key: "root",
ref: n
}, [
s.survey.isLogoBefore ? (i(), C(d, {
key: 0,
is: s.survey.getElementWrapperComponentName(s.survey, "logo-image"),
data: s.survey.getElementWrapperComponentData(s.survey, "logo-image")
}, null, 8, ["is", "data"])) : p("", !0),
s.survey.renderedHasTitle ? (i(), a("div", {
key: 1,
class: l(s.survey.css.headerText),
style: L({ maxWidth: s.survey.titleMaxWidth })
}, [
c(d, {
is: "survey-element-title",
element: s.survey,
css: s.survey.css
}, null, 8, ["element", "css"]),
s.survey.renderedHasDescription ? (i(), a("div", {
key: 0,
class: l(s.survey.css.description)
}, [
c(d, {
is: "survey-string",
locString: s.survey.locDescription
}, null, 8, ["locString"])
], 2)) : p("", !0)
], 6)) : p("", !0),
s.survey.isLogoAfter ? (i(), C(d, {
key: 2,
is: s.survey.getElementWrapperComponentName(s.survey, "logo-image"),
data: s.survey.getElementWrapperComponentData(s.survey, "logo-image")
}, null, 8, ["is", "data"])) : p("", !0),
v("div", {
class: l(s.survey.css.headerClose)
}, null, 2)
], 2)) : p("", !0);
}
}), os = /* @__PURE__ */ y({
__name: "Row",
props: {
row: {},
css: {},
survey: {}
},
setup(u) {
const e = u, n = k();
let s;
return I(
() => e.row,
(t, o) => {
t.setRootElement(n.value), o && (t.isNeedRender = o.isNeedRender);
},
(t) => {
ss(t) || (clearTimeout(s), t.setRootElement(void 0), t.stopLazyRendering(), t.isNeedRender = !t.isLazyRendering());
}
), T(() => {
if (e.row && (e.row.setRootElement(n.value), !e.row.isNeedRender)) {
const t = n.value;
setTimeout(() => {
e.row.startLazyRendering(t);
}, 10);
}
}), (t, o) => (i(), a("div", {
class: l(t.row.getRowCss()),
ref_key: "root",
ref: n
}, [
(i(!0), a(M, null, V(t.row.visibleElements, (r) => (i(), C(d, {
is: "survey-element",
row: t.row,
css: t.css,
element: r,
key: r.id
}, null, 8, ["row", "css", "element"]))), 128))
], 2));
}
}), is = ["id", "role", "aria-required", "aria-invalid", "aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "data-name"], rs = ["aria-hidden", "data-sv-drop-target-matrix", "data-sv-drop-target-matrix-row"], ls = ["id"], as = {
inheritAttrs: !1
}, us = /* @__PURE__ */ y({
...as,
__name: "Question",
props: {
survey: {},
element: {},
css: {}
},
setup(u) {
const e = u, n = k(null);
I(() => e.element);
const s = (q) => q.cssContent, t = () => e.element.getRootStyle(), o = f(() => e.element.singleInputQuestion), r = () => {
n.value && e.element.afterRender(n.value);
}, m = N(
() => n.value,
() => {
r();
}
), g = f(() => e.element.customWidget ? "survey-customwidget" : e.element.isDefaultRendering() ? "survey-" + e.element.getTemplate() : e.element.getComponentName()), S = f(() => e.element.survey.getQuestionContentWrapperComponentName(e.element)), h = f(() => ({
componentData: {
question: e.element,
data: e.element.survey.getElementWrapperComponentData(e.element)
}
}));
return P(() => {
m();
}), (q, b) => (i(), a("div", {
class: l(q.element.getRootCss()),
style: L(t()),
ref_key: "root",
ref: n,
onFocusin: b[0] || (b[0] = (Z) => q.element.focusIn()),
id: q.element.id,
role: q.element.ariaRole,
"aria-required": q.element.ariaRequired,
"aria-invalid": q.element.ariaInvalid,
"aria-label": q.element.ariaLabel,
"aria-labelledby": q.element.ariaLabelledBy,
"aria-describedby": q.element.ariaDescribedBy,
"aria-expanded": q.element.ariaExpanded,
"data-name": q.element.name
}, [
q.element.singleInputHasActions ? (i(), C(d, {
key: 0,
is: "sv-breadcrumbs",
model: q.element.singleInputActions,
css: q.element.cssClasses
}, null, 8, ["model", "css"])) : p("", !0),
q.element.showErrorsAboveQuestion ? (i(), C(d, {
key: 1,
is: "survey-errors",
element: q.element,
location: "top"
}, null, 8, ["element"])) : p("", !0),
!q.element.singleInputHideHeader && q.element.hasTitleOnLeftTop ? (i(), C(d, {
key: 2,
is: "survey-element-header",
element: q.element,
css: q.element.cssClasses
}, null, 8, ["element", "css"])) : p("", !0),
q.element.singleInputSummary ? (i(), C(d, {
key: 3,
is: "sv-single-input-summary",
css: q.element.cssClasses,
summary: q.element.singleInputSummary
}, null, 8, ["css", "summary"])) : o.value ? (i(), C(d, {
is: "survey-question",
css: q.css,
element: o.value,
survey: q.survey,
key: o.value.id
}, null, 8, ["css", "element", "survey"])) : (i(), C(d, $({
key: 5,
is: S.value
}, h.value), {
default: D(() => [
v("div", {
class: l(s(q.element) || void 0),
"aria-hidden": q.element.contentAriaHidden,
style: L({ display: q.element.renderedIsExpanded ? void 0 : "none" }),
role: "presentation",
"data-sv-drop-target-matrix": q.element.dragDropMatrixAttribute,
"data-sv-drop-target-matrix-row": q.element.dragDropMatrixAttribute
}, [
c(d, {
is: g.value,
question: q.element
}, null, 8, ["is", "question"]),
q.element.hasComment ? (i(), a("div", {
key: 0,
class: l(q.element.getCommentAreaCss())
}, [
v("div", null, [
c(d, {
is: "survey-string",
locString: q.element.locCommentText
}, null, 8, ["locString"])
]),
c(d, {
is: "survey-question-comment",
question: q.element
}, null, 8, ["question"])
], 2)) : p("", !0),
q.element.hasDescriptionUnderInput ? (i(), a("div", {
key: 1,
class: l(q.element.cssDescription),
id: q.element.ariaDescriptionId
}, [
c(d, {
is: "survey-string",
locString: q.element.locDescription
}, null, 8, ["locString"])
], 10, ls)) : p("", !0)
], 14, rs)
]),
_: 1
}, 16, ["is"])),
q.element.hasTitleOnBottom ? (i(), C(d, {
key: 6,
is: "survey-element-header",
element: q.element,
css: q.css
}, null, 8, ["element", "css"])) : p("", !0),
q.element.showErrorsBelowQuestion ? (i(), C(d, {
key: 7,
is: "survey-errors",
element: q.element,
location: "bottom"
}, null, 8, ["element"])) : p("", !0)
], 46, is));
}
}), ds = ["id"], ms = ["id", "role", "aria-labelledby", "aria-label"], ps = {
inheritAttrs: !1
}, vs = /* @__PURE__ */ y({
...ps,
inheritAttrs: !1,
__name: "Panel",
props: {
element: {},
isEditMode: { type: Boolean },
css: {}
},
setup(u) {
const e = u, n = k(null), s = f(() => e.element.survey);
return I(() => e.element), T(() => {
e.element.survey && e.element.afterRender(n.value);
}), (t, o) => t.element.getIsContentVisible() ? (i(), a("div", {
key: 0,
class: l(t.element.getContainerCss()),
id: t.element.id,
onFocusin: o[0] || (o[0] = (r) => t.element.focusIn()),
ref_key: "root",
ref: n
}, [
t.element.showErrorsAbovePanel ? (i(), C(d, {
key: 0,
is: "survey-errors",
element: t.element
}, null, 8, ["element"])) : p("", !0),
t.element.hasTitle || t.element.hasDescription ? (i(), C(d, {
key: 1,
is: "survey-element-header",
element: t.element,
css: t.css
}, null, 8, ["element", "css"])) : p("", !0),
t.element.showErrorsAbovePanel ? p("", !0) : (i(), C(d, {
key: 2,
is: "survey-errors",
element: t.element
}, null, 8, ["element"])),
t.element.renderedIsExpanded ? (i(), a("div", {
key: 3,
id: t.element.contentId,
style: L({ paddingLeft: t.element.innerPaddingLeft }),
class: l(t.element.cssClasses.panel.content),
role: t.element.ariaRole,
"aria-labelledby": t.element.ariaLabelledBy,
"aria-label": t.element.ariaLabel
}, [
(i(!0), a(M, null, V(t.element.visibleRows, (r) => (i(), C(d, $({
key: r.id,
is: t.element.getSurvey().getRowWrapperComponentName(r)
}, {
componentData: t.element.getSurvey().getRowWrapperComponentData(r)
}), {
default: D(() => [
c(d, {
is: "survey-row",
row: r,
survey: s.value,
css: t.css
}, null, 8, ["row", "survey", "css"])
]),
_: 2
}, 1040, ["is"]))), 128)),
c(d, {
is: "sv-action-bar",
model: t.element.getFooterToolbar()
}, null, 8, ["model"])
], 14, ms)) : p("", !0)
], 42, ds)) : p("", !0);
}
}), Cs = ["id"], cs = /* @__PURE__ */ y({
__name: "ElementHeader",
props: {
element: {},
css: {}
},
setup(u) {
const e = u, n = (t) => {
typeof e.element.clickTitleFunction == "function" && e.element.clickTitleFunction(t);
}, s = () => {
const t = { width: void 0 };
return "titleWidth" in e.element && (t.width = e.element.titleWidth), t;
};
return (t, o) => (i(), a("div", {
class: l(t.element.cssHeader),
onClick: n,
style: L(s())
}, [
c(d, {
is: "survey-element-title",
element: t.element,
css: t.css
}, null, 8, ["element", "css"]),
t.element.hasDescriptionUnderTitle ? B((i(), a("div", {
key: 0,
class: l(t.element.cssDescription),
id: t.element.ariaDescriptionId
}, [
c(d, {
is: "survey-string",
locString: t.element.locDescription
}, null, 8, ["locString"])
], 10, Cs)), [
[A, t.element.hasDescription]
]) : p("", !0),
t.element.hasAdditionalTitleToolbar ? (i(), C(d, {
key: 1,
is: "sv-action-bar",
model: t.element.additionalTitleToolbar
}, null, 8, ["model"])) : p("", !0)
], 6));
}
}), gs = /* @__PURE__ */ y({
__name: "String",
props: {
locString: {}
},
setup(u) {
return (e, n) => (i(), C(d, {
is: e.locString.renderAs,
locString: e.locString.renderAsData
}, null, 8, ["is", "locString"]));
}
}), ys = ["innerHTML"], hs = /* @__PURE__ */ y({
__name: "StringViewer",
props: {
locString: {}
},
setup(u) {
const e = u, n = F(() => e.locString), s = e.locString.allowLineBreaks ? "sv-string-viewer sv-string-viewer--multiline" : "sv-string-viewer";
return (t, o) => t.locString.hasHtml ? (i(), a("span", {
key: 0,
class: l(w(s)),
innerHTML: w(n)
}, null, 10, ys)) : (i(), a("span", {
key: 1,
class: l(w(s))
}, H(w(n)), 3));
}
}), qs = ["innerHTML"], ws = /* @__PURE__ */ y({
__name: "StringEditor",
props: {
locString: {}
},
setup(u) {
const e = u, n = (t) => {
const o = e.locString;
o.text = t.target.innerText;
}, s = (t) => {
t.preventDefault(), t.stopPropagation();
};
return (t, o) => t.locString.hasHtml ? (i(), a("span", {
key: 0,
class: "sv-string-editor",
contenteditable: "true",
innerHTML: t.locString.renderedHtml,
onBlur: n,
onClick: s
}, null, 40, qs)) : (i(), a("span", {
key: 1,
class: "sv-string-editor",
contenteditable: "true",
onBlur: n,
onClick: s
}, H(t.locString.renderedHtml), 33));
}
}), bs = ["id"], Ls = /* @__PURE__ */ y({
__name: "Skeleton",
props: {
element: {}
},
setup(u) {
const e = u;
return I(() => e.element), (n, s) => (i(), a("div", {
class: "sv-skeleton-element",
id: n.element.id,
style: L({ height: n.element.skeletonHeight })
}, null, 12, bs));
}
}), ks = { class: "sv-scroll__container" }, fs = /* @__PURE__ */ v("div", { class: "sv-scroll__scrollbar-sizer" }, null, -1), Ms = [
fs
], Hs = /* @__PURE__ */ y({
__name: "Scroll",
props: {
disabled: {},
onInnerHeightChanged: { type: Function }
},
setup(u) {
const e = u, n = new Ee();
n.onInnerHeightChanged = (t) => {
e.onInnerHeightChanged && e.onInnerHeightChanged(t);
};
const s = k();
return T(() => {
n.setRootElement(s.value);
}), P(() => {
n.setRootElement(void 0), n.unsubscribeRootElement();
}), (t, o) => e.disabled ? J(t.$slots, "default", { key: 0 }) : (i(), a("div", {
key: 1,
ref_key: "root",
ref: s,
class: "sv-scroll__wrapper"
}, [
v("div", {
class: "sv-scroll__scroller sv-drag-target-skipped",
onScroll: o[0] || (o[0] = () => w(n).onScrollContainer())
}, [
v("div", ks, [
J(t.$slots, "default")
])
], 32),
v("div", {
class: "sv-scroll__scrollbar",
onScroll: o[1] || (o[1] = () => w(n).onScrollScrollbar())
}, Ms, 32)
], 512));
}
}), Is = ["id"], Vs = ["value"], Ss = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Text",
props: {
question: {}
},
setup(u) {
const e = u, n = k(null);
return R(e, n), (s, t) => s.question.isReadOnlyRenderDiv() ? (i(), a("div", {
key: 0,
ref_key: "root",
ref: n
}, H(s.question.value), 513)) : s.question.dataListId ? (i(), a("div", {
key: 1,
ref_key: "root",
ref: n
}, [
c(d, {
is: "survey-text-input",
question: s.question
}, null, 8, ["question"]),
v("datalist", {
id: s.question.dataListId
}, [
(i(!0), a(M, null, V(s.question.dataList, (o, r) => (i(), a("option", {
key: r,
value: o
}, null, 8, Vs))), 128))
], 8, Is)
], 512)) : (i(), C(d, {
key: 2,
is: "survey-text-input",
question: s.question,
"get-ref": (o) => {
n.value = o;
}
}, null, 8, ["question", "get-ref"]));
}
}), Rs = ["disabled", "readonly", "type", "maxlength", "min", "max", "step", "size", "id", "list", "placeholder", "autocomplete", "value", "aria-required", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage"], Ts = ["disabled", "readonly", "type", "maxlength", "min", "max", "step", "size", "id", "list", "placeholder", "autocomplete", "value", "aria-required", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage"], Bs = /* @__PURE__ */ y({
__name: "TextInput",
props: {
question: {},
getRef: { type: Function }
},
setup(u, { expose: e }) {
const n = u, s = function(r) {
n.getRef && n.getRef(r);
}, t = k(null);
e({ root: t }), I(() => n.question);
const o = f(() => n.question.inputStyle);
return (r, m) => r.question.getMaxLength() ? (i(), a("div", {
key: 1,
ref: (g) => s(g)
}, [
v("input", {
disabled: r.question.isDisabledAttr,
readonly: r.question.isReadOnlyAttr,
class: l(r.question.getControlClass()),
type: r.question.inputType,
maxlength: r.question.getMaxLength(),
min: r.question.renderedMin,
max: r.question.renderedMax,
step: r.question.renderedStep,
size: r.question.renderedInputSize,
style: L(o.value),
id: r.question.inputId,
list: r.question.dataListId,
placeholder: r.question.renderedPlaceholder,
autocomplete: r.question.autocomplete,
value: r.question.inputValue,
onChange: m[8] || (m[8] = //@ts-ignore
(...g) => r.question.onChange && r.question.onChange(...g)),
onClick: m[9] || (m[9] = //@ts-ignore
(...g) => r.question.readOnlyBlocker && r.question.readOnlyBlocker(...g)),
onPointerdown: m[10] || (m[10] = //@ts-ignore
(...g) => r.question.readOnlyBlocker && r.question.readOnlyBlocker(...g)),
onKeyup: m[11] || (m[11] = //@ts-ignore
(...g) => r.question.onKeyUp && r.question.onKeyUp(...g)),
onKeydown: m[12] || (m[12] = //@ts-ignore
(...g) => r.question.onKeyDown && r.question.onKeyDown(...g)),
onCompositionUpdate: m[13] || (m[13] = //@ts-ignore
(...g) => r.question.onCompositionUpdate && r.question.onCompositionUpdate(...g)),
onBlur: m[14] || (m[14] = //@ts-ignore
(...g) => r.question.onBlur && r.question.onBlur(...g)),
onFocus: m[15] || (m[15] = //@ts-ignore
(...g) => r.question.onFocus && r.question.onFocus(...g)),
"aria-required": r.question.a11y_input_ariaRequired,
"aria-label": r.question.a11y_input_ariaLabel,
"aria-labelledby": r.question.a11y_input_ariaLabelledBy,
"aria-describedby": r.question.a11y_input_ariaDescribedBy,
"aria-invalid": r.question.a11y_input_ariaInvalid,
"aria-errormessage": r.question.a11y_input_ariaErrormessage
}, null, 46, Ts),
c(d, {
is: "sv-character-counter",
counter: r.question.characterCounter,
remainingCharacterCounter: r.question.cssClasses.remainingCharacterCounter
}, null, 8, ["counter", "remainingCharacterCounter"])
], 512)) : (i(), a("input", {
key: 0,
ref: (g) => s(g),
disabled: r.question.isDisabledAttr,
readonly: r.question.isReadOnlyAttr,
class: l(r.question.getControlClass()),
type: r.question.inputType,
maxlength: r.question.getMaxLength(),
min: r.question.renderedMin,
max: r.question.renderedMax,
step: r.question.renderedStep,
size: r.question.renderedInputSize,
style: L(o.value),
id: r.question.inputId,
list: r.question.dataListId,
placeholder: r.question.renderedPlaceholder,
autocomplete: r.question.autocomplete,
value: r.question.inputValue,
onChange: m[0] || (m[0] = //@ts-ignore
(...g) => r.question.onChange && r.question.onChange(...g)),
onClick: m[1] || (m[1] = //@ts-ignore
(...g) => r.question.readOnlyBlocker && r.question.readOnlyBlocker(...g)),
onPointerdown: m[2] || (m[2] = //@ts-ignore
(...g) => r.question.readOnlyBlocker && r.question.readOnlyBlocker(...g)),
onKeyup: m[3] || (m[3] = //@ts-ignore
(...g) => r.question.onKeyUp && r.question.onKeyUp(...g)),
onKeydown: m[4] || (m[4] = //@ts-ignore
(...g) => r.question.onKeyDown && r.question.onKeyDown(...g)),
onCompositionUpdate: m[5] || (m[5] = //@ts-ignore
(...g) => r.question.onCompositionUpdate && r.question.onCompositionUpdate(...g)),
onBlur: m[6] || (m[6] = //@ts-ignore
(...g) => r.question.onBlur && r.question.onBlur(...g)),
onFocus: m[7] || (m[7] = //@ts-ignore
(...g) => r.question.onFocus && r.question.onFocus(...g)),
"aria-required": r.question.a11y_input_ariaRequired,
"aria-label": r.question.a11y_input_ariaLabel,
"aria-labelledby": r.question.a11y_input_ariaLabelledBy,
"aria-describedby": r.question.a11y_input_ariaDescribedBy,
"aria-invalid": r.question.a11y_input_ariaInvalid,
"aria-errormessage": r.question.a11y_input_ariaErrormessage
}, null, 46, Rs));
}
}), Zs = ["role", "aria-required", "aria-label", "aria-labelledby", "aria-describedby", "aria-invalid", "aria-errormessage"], $s = {
key: 0,
class: "sv-hidden"
}, Ds = { key: 6 }, As = ["value"], Le = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "SelectBase",
props: {
question: {},
showLegend: { type: Boolean }
},
setup(u) {
const e = u, n = k(null);
R(e, n);
const s = (o) => e.question.getItemValueWrapperComponentName(o) || e.question.itemComponent, t = (o) => ({
componentName: e.question.itemComponent,
componentData: {
question: e.question,
item: o,
data: e.question.getItemValueWrapperComponentData(o)
}
});
return (o, r) => (i(), a("fieldset", {
class: l(o.question.getSelectBaseRootCss()),
ref_key: "root",
ref: n,
role: o.question.a11y_input_ariaRole,
"aria-required": o.question.a11y_input_ariaRequired,
"aria-label": o.question.a11y_input_ariaLabel,
"aria-labelledby": o.question.a11y_input_ariaLabelledBy,
"aria-describedby": o.question.a11y_input_ariaDescribedBy,
"aria-invalid": o.question.a11y_input_ariaInvalid,
"aria-errormessage": o.question.a11y_input_ariaErrormessage
}, [
o.showLegend ? (i(), a("legend", $s, H(o.question.locTitle.renderedHtml), 1)) : p("", !0),
o.question.hasHeadItems ? (i(!0), a(M, { key: 1 }, V(o.question.headItems, (m) => (i(), C(d, $({
key: m.uniqueId,
is: s(m)
}, t(m)), null, 16, ["is"]))), 128)) : p("", !0),
!o.question.hasColumns && !o.question.blockedRow ? (i(!0), a(M, { key: 2 }, V(o.question.bodyItems, (m) => (i(), C(d, $({
key: m.uniqueId,
is: s(m)
}, t(m)), null, 16, ["is"]))), 128)) : p("", !0),
o.question.blockedRow ? (i(), a("div", {
key: 3,
class: l(o.question.cssClasses.rootRow)
}, [
!o.question.hasColumns && o.question.blockedRow ? (i(!0), a(M, { key: 0 }, V(o.question.dataChoices, (m) => (i(), C(d, $({
key: m.uniqueId,
is: s(m)
}, t(m)), null, 16, ["is"]))), 128)) : p("", !0)
], 2)) : p("", !0),
o.question.hasColumns ? (i(), a("div", {
key: 4,
class: l(o.question.cssClasses.rootMultiColumn)
}, [
o.question.hasColumns ? (i(!0), a(M, { key: 0 }, V(o.question.columns, (m, g) => (i(), a("div", {
key: g,
class: l(o.question.getColumnClass()),
role: "presentation"
}, [
(i(!0), a(M, null, V(m, (S) => (i(), C(d, $({
key: S.uniqueId,
is: s(S)
}, t(S)), null, 16, ["is"]))), 128))
], 2))), 128)) : p("", !0)
], 2)) : p("", !0),
o.question.hasFootItems ? (i(!0), a(M, { key: 5 }, V(o.question.footItems, (m) => (i(), C(d, $({
key: m.uniqueId,
is: s(m)
}, t(m)), null, 16, ["is"]))), 128)) : p("", !0),
o.question.showClearButtonInContent ? (i(), a("div", Ds, [
v("input", {
type: "button",
class: l(o.question.cssClasses.clearButton),
onClick: r[0] || (r[0] = () => {
o.question.clearValueFromUI();
}),
value: o.question.clearButtonCaption
}, null, 10, As)
])) : p("", !0)
], 10, Zs));
}
}), Ps = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Checkbox",
props: {
question: {}
},
setup(u) {
return (e, n) => (i(), C(Le, {
question: e.question,
"show-legend": !0
}, null, 8, ["question"]));
}
});
function ke(u, e, n) {
T(() => {
n.value && (e().isDesignMode || u().setRootElement(n.value));
}), P(() => {
e().isDesignMode || u().setRootElement(void 0);
}), I(u, (s, t) => {
e().isDesignMode || (s && n.value && s.setRootElement(n.value), t && t.setRootElement(void 0));
});
}
const Ns = ["name", "checked", "value", "id", "disabled", "readonly", "required", "aria-label"], Es = ["xlink:href"], Ws = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "CheckboxItem",
props: {
question: {},
item: {},
hideLabel: { type: Boolean },
ariaLabel: {}
},
setup(u) {
const e = k(), n = u;
ke(
() => n.item,
() => n.question,
e
);
const s = (t) => {
n.question.clickItemHandler(n.item, t.target.checked);
};
return (t, o) => (i(), a(M, null, [
v("div", {
role: "presentation",
class: l(t.question.getItemClass(t.item)),
ref_key: "root",
ref: e
}, [
v("label", {
class: l(t.question.getLabelClass(t.item))
}, [
v("input", {
type: "checkbox",
name: t.question.name + t.item.id,
checked: t.question.isItemSelected(t.item),
onInput: o[0] || (o[0] = (r) => {
s(r);
}),
value: t.item.value,
id: t.question.getItemId(t.item),
disabled: !t.question.getItemEnabled(t.item),
readonly: t.question.isReadOnlyAttr,
class: l(t.question.cssClasses.itemControl),
required: t.question.hasRequiredError(),
"aria-label": t.ariaLabel
}, null, 42, Ns),
t.question.cssClasses.materialDecorator ? (i(), a("span", {
key: 0,
class: l(t.question.cssClasses.materialDecorator)
}, [
t.question.itemSvgIcon ? (i(), a("svg", {
key: 0,
class: l(t.question.cssClasses.itemDecorator)
}, [
v("use", {
"xlink:href": t.question.itemSvgIcon
}, null, 8, Es)
], 2)) : p("", !0)
], 2)) : p("", !0),
t.hideLabel ? p("", !0) : (i(), a("span", {
key: 1,
class: l(t.question.cssClasses.controlLabel)
}, [
c(d, {
is: "survey-string",
locString: t.item.locText
}, null, 8, ["locString"])
], 2))
], 2)
], 2),
t.item.isPanelShowing ? (i(), C(d, {
key: 0,
is: "survey-panel",
element: t.item.panel,
cssClasses: t.question.cssClasses
}, null, 8, ["element", "cssClasses"])) : p("", !0),
t.item.isCommentShowing ? (i(), C(d, {
key: 1,
is: "survey-other-choice",
question: t.question,
item: t.item
}, null, 8, ["question", "item"])) : p("", !0)
], 64));
}
}), Fs = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Radiogroup",
props: {
question: {}
},
setup(u) {
return (e, n) => (i(), C(Le, { question: e.question }, null, 8, ["question"]));
}
}), Os = ["name", "value", "id", "aria-errormessage", "checked", "disabled", "readonly", "aria-label"], zs = ["xlink:href"], Us = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "RadiogroupItem",
props: {
question: {},
item: {},
hideLabel: { type: Boolean },
ariaLabel: {}
},
setup(u) {
const e = k(), n = u, s = (r) => n.question.getLabelClass(r), t = (r) => n.question.getControlLabelClass(r), o = () => {
n.question.clickItemHandler(n.item);
};
return ke(
() => n.item,
() => n.question,
e
), (r, m) => (i(), a(M, null, [
v("div", {
role: "presentation",
class: l(r.question.getItemClass(r.item)),
ref_key: "root",
ref: e
}, [
v("label", {
onMousedown: m[1] || (m[1] = (g) => r.question.onMouseDown()),
class: l(s(r.item))
}, [
v("input", {
type: "radio",
name: r.question.questionName,
value: r.item.value,
id: r.question.getItemId(r.item),
"aria-errormessage": r.question.ariaErrormessage,
checked: r.question.isItemSelected(r.item),
onInput: m[0] || (m[0] = (g) => {
o();
}),
disabled: !r.question.getItemEnabled(r.item),
readonly: r.question.isReadOnlyAttr,
class: l(r.question.cssClasses.itemControl),
"aria-label": r.ariaLabel
}, null, 42, Os),
r.question.cssClasses.materialDecorator ? (i(), a("span", {
key: 0,
class: l(r.question.cssClasses.materialDecorator)
}, [
r.question.itemSvgIcon ? (i(), a("svg", {
key: 0,
class: l(r.question.cssClasses.itemDecorator)
}, [
v("use", {
"xlink:href": r.question.itemSvgIcon
}, null, 8, zs)
], 2)) : p("", !0)
], 2)) : p("", !0),
r.hideLabel ? p("", !0) : (i(), a("span", {
key: 1,
class: l(t(r.item))
}, [
c(d, {
is: "survey-string",
locString: r.item.locText
}, null, 8, ["locString"])
], 2))
], 34)
], 2),
r.item.isPanelShowing ? (i(), C(d, {
key: 0,
is: "survey-panel",
element: r.item.panel,
cssClasses: r.question.cssClasses
}, null, 8, ["element", "cssClasses"])) : p("", !0),
r.item.isCommentShowing ? (i(), C(d, {
key: 1,
is: "survey-other-choice",
question: r.question,
item: r.item
}, null, 8, ["question", "item"])) : p("", !0)
], 64));
}
}), Qs = ["src"], Ks = ["title"], js = { key: 0 }, Gs = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Signaturepad",
props: {
question: {}
},
setup(u) {
const e = u, n = k(null);
return R(e, n), (s, t) => (i(), a("div", {
class: l(s.question.cssClasses.root),
ref_key: "root",
ref: n,
style: L({
width: s.question.renderedCanvasWidth
})
}, [
B(v("div", {
class: l(s.question.cssClasses.placeholder)
}, [
c(d, {
is: "survey-string",
locString: s.question.locRenderedPlaceholder
}, null, 8, ["locString"])
], 2), [
[A, s.question.needShowPlaceholder()]
]),
v("div", null, [
s.question.backgroundImage ? (i(), a("img", {
key: 0,
role: "presentation",
class: l(s.question.cssClasses.backgroundImage),
src: s.question.backgroundImage,
style: L({
width: s.question.renderedCanvasWidth
})
}, null, 14, Qs)) : p("", !0),
v("canvas", {
tabindex: "-1",
class: l(s.question.cssClasses.canvas),
onBlur: t[0] || (t[0] = //@ts-ignore
(...o) => s.question.onBlur && s.question.onBlur(...o))
}, null, 34)
]),
s.question.canShowClearButton ? (i(), a("div", {
key: 0,
class: l(s.question.cssClasses.controls)
}, [
v("button", {
type: "button",
class: l(s.question.cssClasses.clearButton),
title: s.question.clearButtonCaption,
onClick: t[1] || (t[1] = () => {
s.question.clearValueFromUI();
})
}, [
s.question.cssClasses.clearButtonIconId ? p("", !0) : (i(), a("span", js, "✖")),
s.question.cssClasses.clearButtonIconId ? (i(), C(d, {
key: 1,
is: "sv-svg-icon",
iconName: s.question.cssClasses.clearButtonIconId,
size: "auto"
}, null, 8, ["iconName"])) : p("", !0)
], 10, Ks)
], 2)) : p("", !0),
s.question.showLoadingIndicator ? (i(), a("div", {
key: 1,
class: l(s.question.cssClasses.loadingIndicator)
}, [
c(d, { is: "sv-loading-indicator" })
], 2)) : p("", !0)
], 6));
}
}), Js = ["innerHTML"], Xs = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Html",
props: {
question: {}
},
setup(u) {
const e = u, n = k(null);
R(e, n);
const s = F(() => e.question.locHtml);
return (t, o) => (i(), a("div", {
ref_key: "root",
ref: n,
class: l(t.question.renderCssRoot),
innerHTML: w(s)
}, null, 10, Js));
}
}), Ys = ["src", "alt", "width", "height"], _s = ["src", "width", "height"], xs = ["src", "title", "width", "height"], e1 = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Image",
props: {
question: {}
},
setup(u) {
const e = u, n = k(null);
R(e, n);
const s = F(() => e.question.locImageLink);
return (t, o) => (i(), a("div", {
class: l(t.question.cssClasses.root),
ref_key: "root",
ref: n
}, [
t.question.renderedMode === "image" ? B((i(), a("img", {
key: 0,
class: l(t.question.getImageCss()),
src: w(s),
alt: t.question.altText || t.question.title,
width: t.question.renderedWidth,
height: t.question.renderedHeight,
style: L({
objectFit: t.question.imageFit,
width: t.question.renderedStyleWidth,
height: t.question.renderedStyleHeight
}),
onLoad: o[0] || (o[0] = (r) => {
t.question.onLoadHandler();
}),
onError: o[1] || (o[1] = (r) => {
t.question.onErrorHandler();
})
}, null, 46, Ys)), [
[A, w(s) && !t.question.contentNotLoaded]
]) : p("", !0),
t.question.renderedMode === "video" ? B((i(), a("video", {
key: 1,
controls: "",
class: l(t.question.getImageCss()),
src: w(s),
width: t.question.renderedWidth,
height: t.question.renderedHeight,
style: L({
objectFit: t.question.imageFit,
width: t.question.renderedStyleWidth,
height: t.question.renderedStyleHeight
}),
onLoadedmetadata: o[2] || (o[2] = (r) => {
t.question.onLoadHandler();
}),
onError: o[3] || (o[3] = (r) => {
t.question.onErrorHandler();
})
}, null, 46, _s)), [
[A, w(s) && !t.question.contentNotLoaded]
]) : p("", !0),
t.question.renderedMode === "youtube" ? (i(), a("iframe", {
key: 2,
class: l(t.question.getImageCss()),
src: w(s),
title: t.question.renderedAltText,
width: t.question.renderedWidth,
height: t.question.renderedHeight,
style: L({
objectFit: t.question.imageFit,
width: t.question.renderedStyleWidth,
height: t.question.renderedStyleHeight
})
}, null, 14, xs)) : p("", !0),
!w(s) || t.question.contentNotLoaded ? (i(), a("div", {
key: 3,
class: l(t.question.cssClasses.noImage)
}, [
c(d, {
is: "sv-svg-icon",
iconName: t.question.cssClasses.noImageSvgIconId,
size: 48
}, null, 8, ["iconName"])
], 2)) : p("", !0)
], 2));
}
}), s1 = ["aria-label"], n1 = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Expression",
props: {
question: {}
},
setup(u) {
const e = u, n = k(null);
return R(e, n), (s, t) => (i(), a("div", {
class: l(s.question.cssClasses.root),
ref_key: "root",
ref: n,
"aria-live": "polite",
"aria-label": s.question.formatedValue
}, H(s.question.formatedValue), 11, s1));
}
}), t1 = ["id", "aria-required", "aria-label", "aria-invalid", "aria-errormessage", "multiple", "title", "accept", "capture"], o1 = ["id", "multiple", "placeholder"], i1 = ["id", "multiple", "placeholder"], r1 = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "File",
props: {
question: {}
},
setup(u) {
const e = u, n = k(null);
return R(e, n), (s, t) => (i(), a("div", {
class: l(s.question.fileRootCss),
ref_key: "root",
ref: n
}, [
!s.question.isReadOnlyAttr && !s.question.isDisabledAttr && s.question.hasFileUI ? (i(), a("input", {
key: 0,
class: l(s.question.cssClasses.fileInput),
tabindex: "-1",
type: "file",
id: s.question.inputId,
"aria-required": s.question.ariaRequired,
"aria-label": s.question.ariaLabel,
"aria-invalid": s.question.ariaInvalid,
"aria-errormessage": s.question.ariaErrormessage,
multiple: s.question.allowMultiple,
title: s.question.inputTitle,
accept: s.question.acceptedTypes,
capture: s.question.renderCapture
}, null, 10, t1)) : p("", !0),
s.question.isReadOnlyAttr ? (i(), a("input", {
key: 1,
type: "file",
readonly: "",
id: s.question.inputId,
class: l(s.question.getReadOnlyFileCss()),
multiple: s.question.allowMultiple,
placeholder: s.question.title,
style: { color: "transparent" }
}, null, 10, o1)) : p("", !0),
s.question.isDisabledAttr ? (i(), a("input", {
key: 2,
type: "file",
disabled: "",
id: s.question.inputId,
class: l(s.question.getReadOnlyFileCss()),
multiple: s.question.allowMultiple,
placeholder: s.question.title,
style: { color: "transparent" }
}, null, 10, i1)) : p("", !0),
v("div", {
class: l(s.question.cssClasses.dragArea),
onDrop: t[0] || (t[0] = //@ts-ignore
(...o) => s.question.onDrop && s.question.onDrop(...o)),
onDragover: t[1] || (t[1] = //@ts-ignore
(...o) => s.question.onDragOver && s.question.onDragOver(...o)),
onDragleave: t[2] || (t[2] = //@ts-ignore
(...o) => s.question.onDragLeave && s.question.onDragLeave(...o)),
onDragenter: t[3] || (t[3] = //@ts-ignore
(...o) => s.question.onDragEnter && s.question.onDragEnter(...o))
}, [
s.question.showFileDecorator ? (i(), a("div", {
key: 0,
class: l(s.question.getFileDecoratorCss())
}, [
s.question.showDragAreaPlaceholder ? (i(), a("span", {
key: 0,
class: l(s.question.cssClasses.dragAreaPlaceholder)
}, [
c(d, {
is: "survey-string",
locString: s.question.locRenderedPlaceholder
}, null, 8, ["locString"])
], 2)) : p("", !0),
v("div", {
class: l(s.question.cssClasses.wrapper)
}, [
s.question.actionsContainerVisible ? (i(), C(d, {
key: 0,
is: "sv-action-bar",
model: s.question.actionsContainer
}, null, 8, ["model"])) : p("", !0)
], 2)
], 2)) : p("", !0),
s.question.showLoadingIndicator ? (i(), a("div", {
key: 1,
class: l(s.question.cssClasses.loadingIndicator)
}, [
c(d, { is: "sv-loading-indicator" })
], 2)) : p("", !0),
s.question.isPlayingVideo ? (i(), C(d, {
key: 2,
is: "sv-file-video",
question: s.question
}, null, 8, ["question"])) : p("", !0),
s.question.allowShowPreview ? (i(), C(d, {
key: 3,
is: "sv-file-preview",
question: s.question
}, null, 8, ["question"])) : p("", !0),
s.question.fileNavigatorVisible ? (i(), C(d, {
key: 4,
is: "sv-action-bar",
model: s.question.fileNavigator
}, null, 8, ["model"])) : p("", !0)
], 34)
], 2));
}
}), l1 = { class: "sv-hidden" }, Ce = "survey-imagepicker-item", a1 = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "Imagepicker",
props: {
question: {}
},
setup(u) {
const e = u, n = k(null);
R(e, n);
const s = (o) => e.question.getItemValueWrapperComponentName(o) || Ce, t = (o) => ({
componentName: Ce,
componentData: {
question: e.question,
item: o,
data: e.question.getItemValueWrapperComponentData(o)
}
});
return (o, r) => (i(), a("fieldset", {
class: l(o.question.getSelectBaseRootCss()),
style: L(o.question.getContainerStyle()),
ref_key: "root",
ref: n
}, [
v("legend", l1, H(o.question.locTitle.renderedHtml), 1),
o.question.hasColumns ? p("", !0) : (i(!0), a(M, { key: 0 }, V(o.question.visibleChoices, (m) => (i(), C(d, $({
key: m.uniqueId,
is: s(m)
}, t(m)), null, 16, ["is"]))), 128)),
o.question.hasColumns ? (i(!0), a(M, { key: 1 }, V(o.question.columns, (m, g) => (i(), a("div", {
class: l(o.question.getColumnClass()),
key: g,
role: "presentation"
}, [
(i(!0), a(M, null, V(m, (S) => (i(), C(d, $({
key: S.value,
is: s(S)
}, t(S)), null, 16, ["is"]))), 128))
], 2))), 128)) : p("", !0)
], 6));
}
}), u1 = ["name", "value", "id", "disabled", "readonly", "required", "aria-label", "aria-invalid", "aria-errormessage"], d1 = ["name", "value", "id", "disabled", "readonly", "required", "aria-label", "aria-invalid", "aria-errormessage"], m1 = ["src", "width", "height", "alt"], p1 = ["src", "width", "height"], v1 = /* @__PURE__ */ y({
inheritAttrs: !1,
__name: "ImagepickerItem",
props: {
question: {},
item: {}
},
setup(u) {
const e = u, n = (o) => e.question.getItemClass(o), s = f({
get() {
return e.question.value;
},
set(o) {
const r = e.question;
r.isReadOnlyAttr || (r.value = o);
}
});
I(() => e.item);
const t = F(() => e.item.locImageLink);
return (o, r) => (i(), a("div", {
class: l(n(o.item))
}, [
v("label", {
class: l(o.question.cssClasses.label)
}, [
o.question.multiSelect ? B((i(), a("input", {
key: 0,
type: "checkbox",
name: o.question.questionName,
value: o.item.value,
id: o.question.getItemId(o.item),
"onUpdate:modelValue": r[0] || (r[0] = (m) => s.value = m),
disabled: !o.question.getItemEnabled(o.item),
readonly: o.question.isReadOnlyAttr,
required: o.question.inputRequiredAttribute,
"aria-label": o.item.locText.renderedHtml,
"aria-invalid": o.question.ariaInvalid,
"aria-errormessage": o.question.ariaErrormessage,
class: l(o.question.cssClasses.itemControl)
}, null, 10, u1)), [
[se, s.value]
]) : B((i(), a("input", {
key: 1,
type: "radio",
name: o.question.questionName,
value: o.item.value,
id: o.question.getItemId(o.item),
"onUpdate:modelValue": r[1] || (r[1] = (m) => s.value = m),
disabled: !o.question.getItemEnabled(o.item),
readonly: o.question.isReadOnlyAttr,
required: o.question.