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