@sprig-technologies/sprig-bundled 2.46.1 → 2.47.0

package/dist/index-B-aCET7A.js

@@ -0,0 +1,737 @@
+import { u as X, h as re, a as e, c as j, g as je, b as se, F as be, p as te, d as Se, e as ve, _ as ie, T as _e, A as sr, s as ir, f as ar, M as Ie, D as Me, i as lr, P as or, j as dr, q as cr, k as ue, l as ze, m as ur, S as pr, n as mr, o as gr, r as hr, t as br, v as vr, w as yr, x as Le, y as Ae } from "./view-eRBVyC0l.js";
+import { f as le, E as Pe, j as We, k as Ze, l as fr, A as xr } from "./index-BNI3IK7K.js";
+import { H as oe, Q as ce, a as we, M as he, b as ge, O as xe, B as ne, L as Te, S as Sr, u as kr, g as Tr, c as wr } from "./getAttributedUrl-D-vLs0_x.js";
+const Ir = ({ className: n, message: s, next: c, properties: t, questionId: r, type: a }) => {
+  const { useMobileStyling: p, border: h, isLongFormSurvey: u, focusedQuestionId: b } = X((f) => ({ useMobileStyling: f.useMobileStyling, border: f.border, isLongFormSurvey: le(f.studyType), focusedQuestionId: f.focusedQuestionId })), [i, g] = re(!1), [d, _] = re(""), [l, v] = re(!1), m = u && b === r, S = t == null ? void 0 : t.collectName, y = (t == null ? void 0 : t.nameLabelText) || "Full Name", N = (t == null ? void 0 : t.consentText) || "I agree to the stated conditions", F = (t == null ? void 0 : t.submitButtonText) || "Submit", R = !!d.trim(), P = i && (!S || R), U = (f, k = !1) => {
+    f.preventDefault(), f.stopPropagation();
+    let q = null;
+    if (!k) {
+      if (!P) return void v(!0);
+      q = { submitted: !0 }, S && (q.name = d);
+    }
+    c({ value: q, questionId: r, type: a }, P);
+  };
+  return e("div", { className: j(n, u && !m && "ul-card--unfocused", "ul-card__consent-legal", "fade-in-transition"), children: [e(oe, { isRequired: u && (t == null ? void 0 : t.required), message: s, properties: { image: t.image, questionHtml: t.questionHtml } }), t != null && t.richTextBody ? e(ce, { children: e(we, { className: "ul-rich-text-body", html: t.richTextBody, id: "ul-card__consent-legal-body-container" }) }) : null, e(he, { embeddedType: "pdf", properties: t, children: e(ge, { children: [e("div", { className: "sprig-stretch", children: [e(xe, { allowTextEntry: !1, border: h, error: l && !i, id: "consent", isRadio: !1, isSelected: i, label: N, onUserInputChanged: ({ selected: f }) => {
+    f !== i && g(!i);
+  }, useMobileStyling: p }), S && e("input", { "aria-label": y, "aria-placeholder": y, className: j(se("ul-consent-legal__name-input", p)), "data-gramm": "false", maxLength: 250, name: "name", onBlur: (f) => {
+    f.currentTarget.style.borderColor = l && !R ? Pe : We;
+  }, onFocus: (f) => {
+    f.currentTarget.style.borderColor = l && !R ? Pe : h;
+  }, onInput: (f) => {
+    f.preventDefault(), f.stopPropagation(), _(f.currentTarget.value);
+  }, placeholder: y, style: l && !R ? { borderColor: Pe } : {}, tabIndex: 0, value: d })] }), e("div", { className: "ul-card__button-wrapper ul-card-vertical__button-wrapper", children: [e(ne, { className: P ? "" : "sprig-button-disabled", onClick: U, children: F }), t.required === !1 && !u && e("button", { className: "ul-card-skip__button", onClick: (f) => U(f, !0), children: je(t) })] })] }) })] }, r);
+}, ke = (n) => (s) => {
+  s.pointerType !== "touch" && n();
+}, _r = ({ activeValue: n, border: s, icon: c, isPressed: t, onSubmit: r, range: a, scaleLabelType: p, selectedValue: h, setSelectedValue: u, setActiveValue: b, setIsPressed: i, useMobileStyling: g, value: d, viewDocument: _ }) => {
+  const { isLongFormSurvey: l, enableCspTrustedTypes: v } = X((k) => ({ isLongFormSurvey: le(k.studyType), enableCspTrustedTypes: k.enableCspTrustedTypes })), m = `option-${d}`, S = p === "number", y = p === "star", N = p === "smiley", F = S && d === n || d === h, [R, P] = (() => {
+    const k = y && h !== null && d <= h;
+    return y && d <= n || N && d === n || k || d === n || d === h ? [s, t || k || d === h ? 1 : 0.3] : ["", 1];
+  })(), U = be(() => {
+    const k = h === d, q = { borderColor: F && !g || k ? R : "", fillOpacity: F ? "" : P, zIndex: F ? 3 : "auto", color: k ? "#fff" : "" };
+    return S ? { ...q, backgroundColor: k ? R : "" } : { ...q, color: y || N || k ? R : "" };
+  }, [F, R, P, h, d, S, y, N, g]), f = be(() => Ze((({ icon: k, scaleLabelType: q, value: M, selectedValue: $ }) => {
+    if (q === "smiley" && M === $) {
+      let I = 0;
+      return k.replace(/black/g, () => ++I == 1 ? "black" : "white");
+    }
+    return k;
+  })({ icon: c, scaleLabelType: p, value: d, selectedValue: h }), v), [v, c, p, h, d]);
+  return e("button", { "aria-label": S ? void 0 : String(d), className: (() => {
+    switch (p) {
+      case "star":
+        return j(se("likert-star", g), se(`likert-star-${d}`, g));
+      case "smiley":
+        return j(se("likert-smiley", g), se(`likert-smiley-${d}`, g));
+      default:
+        return d === a ? j(se("likert-number", g), se(`likert-number-${d}`, g), se("likert-last-option", g)) : j(se("likert-number", g), se(`likert-number-${d}`, g));
+    }
+  })(), dangerouslySetInnerHTML: { __html: f }, id: m, onClick: (k) => {
+    l && (k.preventDefault(), k.stopPropagation(), u(d)), r();
+  }, onKeyDown: (k) => {
+    var $, I;
+    const q = _.querySelectorAll(`.likert-${p ?? "number"}`), M = d - 1;
+    k.key === "ArrowRight" ? ($ = q[M + 1]) == null || $.focus() : k.key === "ArrowLeft" ? (I = q[M - 1]) == null || I.focus() : k.key !== "Enter" && k.key !== " " || (l && (k.preventDefault(), k.stopPropagation(), u(d)), r());
+  }, onPointerCancel: ke(() => i(!1)), onPointerDown: ke(() => {
+    i(!0), b(d);
+  }), onPointerEnter: ke(() => b(d)), onPointerLeave: ke(() => {
+    b(-1), i(!1);
+  }), onPointerUp: ke(() => i(!1)), style: U, tabIndex: 0 });
+}, Cr = ({ className: n, labels: s, message: c, next: t, properties: r, questionId: a, type: p }) => {
+  const { border: h, useMobileStyling: u, viewDocument: b, isLongFormSurvey: i, focusedQuestionId: g } = X((M) => ({ border: M.border, useMobileStyling: M.useMobileStyling, viewDocument: M.viewDocument, isLongFormSurvey: le(M.studyType), focusedQuestionId: M.focusedQuestionId })), [d, _] = re(-1), [l, v] = re(!1), [m, S] = re(null);
+  te(() => {
+    _(-1), v(!1), S(null);
+  }, [a]);
+  const y = i && g === a, N = s && s.left, F = s && s.right;
+  let R;
+  const { range: P, scaleLabelType: U, ratingIcons: f } = r;
+  P && (R = Number(P));
+  const k = R || 5, q = (M) => {
+    var $, I;
+    switch (U) {
+      case "star":
+        return ($ = f[0]) == null ? void 0 : $.svg;
+      case "smiley":
+        return (I = f[M]) == null ? void 0 : I.svg;
+      default:
+        return String(M + 1);
+    }
+  };
+  return e("form", { className: j(n, "ul-card--likert", "fade-in-transition", i && !y && "ul-card--unfocused"), children: [e(oe, { isRequired: i && (r == null ? void 0 : r.required), message: c, properties: r }), e(he, { properties: r, children: e(Se, { children: [e(ce, { children: [e("div", { "aria-label": `Rating (1 - ${k})`, className: "ul-card--likert__numbers", role: "radiogroup", children: [...Array(k)].map((M, $) => {
+    const I = $ + 1;
+    return e(_r, { activeValue: d, border: h, icon: q($), isPressed: l, onSubmit: () => t({ value: I, questionId: a, type: p }, !0), range: k, scaleLabelType: U, selectedValue: m, setActiveValue: _, setIsPressed: v, setSelectedValue: S, useMobileStyling: u, value: I, viewDocument: b }, $);
+  }) }), e("div", { className: "ul-card--likert__labels", children: [e("span", { children: N }), e("span", { children: F })] })] }), !r.required && !i && e(ge, { children: e("div", { className: "ul-vertical-centered-container", children: e(ne, { onClick: (M) => {
+    M.preventDefault(), M.stopPropagation(), t({ value: null, questionId: a, type: p }, !0);
+  }, children: ve(r) }) }) })] }) })] }, a);
+}, Nr = ({ columns: n, onSelect: s, options: c, selectedOptions: t }) => {
+  const r = ie([]), { border: a, useMobileStyling: p, cards: h, index: u } = X((l) => ({ border: l.border, useMobileStyling: l.useMobileStyling, cards: l.cards, index: l.index })), b = c.findIndex((l) => t[l.id] === null), [i, g] = re(b), d = _e((l, v) => {
+    var y;
+    s(l, v);
+    const m = i + 1, S = c[m];
+    if (S && t[S.id] === null) {
+      g(m);
+      const N = h[u];
+      (N == null ? void 0 : N.groupId) != null || ((y = r.current[m]) == null || y.scrollIntoView({ block: "nearest", behavior: "smooth" }));
+    }
+  }, [s, c, t, i, h, u]), _ = _e((l, v) => {
+    const m = i === l;
+    return e(sr, { animate: !0, header: v.label, isOpen: m, onClick: () => {
+      var S;
+      return g(m && !((S = window.UserLeap) != null && S.isMobileSDK) ? -1 : l);
+    }, ref: (S) => {
+      S && (r.current[l] = S);
+    }, showHeaderCheck: t[v.id] !== null, children: e("div", { style: { paddingTop: "12px" }, children: n.map((S) => e(xe, { allowTextEntry: !1, ariaLabel: `${v.label}-${S.label}`, border: a, error: !1, id: `${v.id}-${S.value}`, isRadio: !0, isSelected: t[v.id] === S.value, label: S.label, onUserInputChanged: () => d(v.id, S.value), useMobileStyling: p }, S.label)) }) }, v.id);
+  }, [a, n, i, d, t, p]);
+  return e("div", { children: c.map((l, v) => _(v, l)) });
+}, qr = ({ columns: n, onSelect: s, options: c, selectedOptions: t }) => {
+  const { border: r, useMobileStyling: a, isLongFormSurvey: p } = X((l) => ({ border: l.border, useMobileStyling: l.useMobileStyling, isLongFormSurvey: le(l.studyType) })), h = c.length, u = n.length, b = ie(null), [i, g] = re(!1), [d, _] = re(!1);
+  return te(() => {
+    if (p) return;
+    const l = b.current, v = new ResizeObserver((m) => {
+      window.requestAnimationFrame(() => {
+        l && (g(Math.round(m[0].contentRect.width) < l.scrollWidth), _(Math.round(m[0].contentRect.width) < l.scrollWidth));
+      });
+    });
+    return l && v.observe(l), () => {
+      l && v.unobserve(l);
+    };
+  }, [p]), e("div", { className: "ul-card--matrix_question_container", children: [e("div", { className: j("ul-card--matrix_container", !p && i && "ul-matrix-scroll-gradient"), onScroll: p ? void 0 : () => {
+    const l = b.current;
+    l && g(l.clientWidth + Math.abs(l.scrollLeft) < l.scrollWidth);
+  }, ref: b, children: e("div", { className: j(p && "ul-card--matrix_grid_longform", "ul-card--matrix_grid"), style: `--numColumns: ${u}; --numRows: ${h + 1};`, children: [e("div", { className: "ul-matrix-header-row", children: [e("div", {}), " ", n.map((l) => e("div", { className: "ul-matrix-column-label", children: l.label }, l.label))] }), c.map((l) => e("div", { className: "ul-matrix-row", children: [e("div", { "aria-label": l.label, className: "ul-matrix-row-label", children: l.label }), e("div", { className: "ul-matrix-row-options", role: "radiogroup", children: n.map((v, m) => e("div", { className: j("ul-matrix-option-wrapper", m === u - 1 && "ul-matrix-last-option"), children: e(xe, { allowTextEntry: !1, ariaLabel: `${l.label}-${v.label}`, border: r, choiceStyle: { background: "transparent", border: "none", marginBottom: "0", padding: "0" }, error: !1, id: `${l.id}-${v.value}`, isRadio: !0, isSelected: t[l.id] === v.value, onUserInputChanged: () => s(l.id, v.value), useMobileStyling: a }) }, v.value)) })] }, l.label))] }) }), !p && (i || d) && e("button", { className: d && !i ? "ul-matrix-scroll-arrow left" : "ul-matrix-scroll-arrow", onClick: d && !i ? (l) => {
+    l.preventDefault();
+    const v = b.current;
+    if (v) {
+      const m = getComputedStyle(v).direction === "rtl";
+      v.scrollTo({ left: m ? v.scrollWidth - v.clientWidth : 0, behavior: "smooth" });
+    }
+  } : (l) => {
+    l.preventDefault();
+    const v = b.current;
+    if (v) {
+      const m = getComputedStyle(v).direction === "rtl";
+      v.scrollTo({ left: m ? v.clientWidth - v.scrollWidth : v.scrollWidth, behavior: "smooth" });
+    }
+  }, children: e(d && !i ? Lr : Pr, {}) })] });
+}, Lr = () => e("svg", { fill: "currentColor", height: "32", transform: "matrix(-1,0,0,1,0,0)", version: "1.1", viewBox: "0 0 256 256", width: "32", xmlns: "http://www.w3.org/2000/svg", children: e("path", { d: "M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66Z" }) }), Pr = () => e("svg", { fill: "currentColor", height: "32", viewBox: "0 0 256 256", width: "32", xmlns: "http://www.w3.org/2000/svg", children: e("path", { d: "M221.66,133.66l-72,72a8,8,0,0,1-11.32-11.32L196.69,136H40a8,8,0,0,1,0-16H196.69L138.34,61.66a8,8,0,0,1,11.32-11.32l72,72A8,8,0,0,1,221.66,133.66Z" }) }), Mr = ({ className: n, message: s, next: c, options: t, properties: r, questionId: a, type: p, showIndividualSubmit: h = !1, onSubmitButtonClick: u }) => {
+  const { useMobileStyling: b, isLongFormSurvey: i, focusedQuestionId: g, setFocusedQuestionId: d, update: _ } = X((L) => ({ useMobileStyling: L.useMobileStyling, isLongFormSurvey: le(L.studyType), focusedQuestionId: L.focusedQuestionId, setFocusedQuestionId: L.setFocusedQuestionId, update: L.update })), l = r.matrixColumn, v = r.required, m = i && g === a, S = (L) => Object.values(L).every((V) => V == null), y = (L) => v && S(L), N = (L) => {
+    if (L.preventDefault(), L.stopPropagation(), c({ value: R, questionId: a, type: p }, !0), u) {
+      const V = !S(R);
+      u(V);
+    }
+  }, F = t.reduce((L, V) => (L[V.id] = null, L), {}), [R, P] = re(F), [U, f] = re(window.innerWidth), k = (L, V) => {
+    i && c({ value: { ...R, [L]: V }, questionId: a, type: p }, !y({ ...R, [L]: V })), P((x) => ({ ...x, [L]: V }));
+  }, q = r.displayMatrixAsAccordion || b, M = i && !q && ir(l.length, U), $ = q || M, I = i && !$, B = I && ar(l.length, U);
+  return te(() => {
+    if (!i) return;
+    const L = fr(() => f(window.innerWidth), 100);
+    return window.addEventListener("resize", L), _(), () => window.removeEventListener("resize", L);
+  }, [i, B, M, U, _]), e("form", { className: j(n, !i && "ul-card__matrix", I && "ul-card--matrix-expandable", B && "ul-card--matrix-expandable-fill", "fade-in-transition", i && !m && "ul-card--unfocused"), id: "text-form", onClick: () => {
+    m && d(a);
+  }, onSubmit: N, children: [e(oe, { isRequired: i && (r == null ? void 0 : r.required), message: s, properties: r }), e(he, { properties: r, children: [e(ce, { children: [e($ ? Nr : qr, { columns: l, onSelect: k, options: t, selectedOptions: R }), h && e(Te, { handleSubmit: N, isSubmitDisabled: y(R) })] }), !i && e(ge, { children: e("div", { className: "ul-card__button-wrapper", children: e(ne, { disabled: y(R), children: ve(r) }) }) })] })] }, a);
+}, Ge = ({ className: n, message: s, onSubmit: c, options: t = [], properties: r, questionId: a, type: p, showIndividualSubmit: h = !1, onSubmitButtonClick: u }) => {
+  const { border: b, useMobileStyling: i, isLongFormSurvey: g, focusedQuestionId: d, setFocusedQuestionId: _ } = X((x) => ({ border: x.border, useMobileStyling: x.useMobileStyling, isLongFormSurvey: le(x.studyType), focusedQuestionId: x.focusedQuestionId, setFocusedQuestionId: x.setFocusedQuestionId })), l = g && d === a, v = t.reduce((x, A) => (x[A.id] = { isSelected: !1 }, x), {}), [m, S] = re(v), y = p === "multiplechoice", N = r.required, F = t.find((x) => {
+    var A;
+    return (A = x.optionProperties) == null ? void 0 : A.noneOfTheAbove;
+  }), R = (x) => Object.entries(x).some(([A, z]) => {
+    var de;
+    const ee = t.find((o) => `${o.id}` === A), G = z.userText === void 0 || z.userText.trim() === "";
+    return ((de = ee == null ? void 0 : ee.optionProperties) == null ? void 0 : de.allowsTextEntry) && G && z.isSelected;
+  }), P = (x) => Object.values(x).filter((A) => A.isSelected).length, U = (x) => {
+    const { minSelect: A = 0, maxSelect: z = 1 / 0, maxSelectMode: ee } = r, G = P(x);
+    switch (ee) {
+      case Ie.Maximum:
+        return G <= z;
+      case Ie.Range:
+        return G === 0 || G >= A;
+      default:
+        return !0;
+    }
+  }, f = r.minSelect && r.minSelect > 0 && r.maxSelectMode === Ie.Range && P(m) < r.minSelect && (N || P(m) > 0), k = (x) => R(x) || N && !P(x) || !U(x), q = (x) => U(x) && !R(x) && P(x) > 0, M = Object.entries(m).some(([x, A]) => {
+    var z, ee;
+    return A.isSelected && ((ee = (z = t.find((G) => `${G.id}` === x)) == null ? void 0 : z.optionProperties) == null ? void 0 : ee.allowsTextEntry);
+  }), $ = h && (!y || M), I = (x) => {
+    V(x.id, x.selected, x.userText, x.noneOfTheAbove), x.selected && g && !y && !l && _(a);
+  }, B = (x) => {
+    var A;
+    return (r == null ? void 0 : r.maxSelectMode) !== Ie.Unlimited && P(m) === (r == null ? void 0 : r.maxSelect) && !((A = m[x]) != null && A.isSelected);
+  }, L = (x) => {
+    if (x.preventDefault(), x.stopPropagation(), c(m, !0), u) {
+      const A = q(m);
+      u(A);
+    }
+  }, V = (x, A, z, ee) => {
+    const G = Object.assign({}, m);
+    if ((y || ee) && A) for (const T of Object.values(G)) T.isSelected = !1, delete T.userText;
+    else F && !ee && m[F.id].isSelected && (G[F.id].isSelected = !1);
+    G[x] = { isSelected: A, userText: z };
+    const de = y && Object.entries(G).some(([T, C]) => {
+      var E, Q;
+      return C.isSelected && ((Q = (E = t.find((Z) => `${Z.id}` === T)) == null ? void 0 : E.optionProperties) == null ? void 0 : Q.allowsTextEntry);
+    }), o = !k(G);
+    if (g && (c(G, o), y && !de && o && u)) {
+      const T = q(G);
+      u(T);
+    }
+    S(G);
+  };
+  return e("form", { className: j(n, "ul-card--multiple", "fade-in-transition", g && !l && "ul-card--unfocused"), id: "text-form", onClick: p === "multipleselect" ? () => {
+    g && d !== a && p === "multipleselect" && _(a);
+  } : void 0, onSubmit: L, children: [e(oe, { isRequired: g && (r == null ? void 0 : r.required), message: s, properties: r }), e(he, { properties: r, children: e(Se, { children: [e(ce, { children: [r.isDropdown ? e(Sr, { disabledOptions: t.filter((x) => B(x.id)), dropdownFooter: f ? e("div", { className: "ul-card__min-select-counter", style: { marginLeft: "16px" }, children: [P(m), "/", r.minSelect] }) : void 0, isMultiSelect: !y, multiselectText: r.dropdownMultiselectedText ?? "choices selected", onChange: (x) => {
+    const A = { ...m };
+    for (const z of t) x.includes(z) ? A[z.id].isSelected = !0 : A[z.id].isSelected = !1;
+    g && c(A, !k(A)), S(A);
+  }, options: t, placeholderText: r.dropdownPlaceholderText ?? (y ? "Select choice" : "Select choice(s)"), value: t.filter((x) => m[x.id].isSelected) }) : e("div", { className: j(se("ul-card__choices", i)), role: y ? "radiogroup" : "group", children: [t.map(({ id: x, label: A, value: z, optionProperties: ee }) => {
+    var T, C;
+    const G = `${x}`, { allowsTextEntry: de, noneOfTheAbove: o } = { allowsTextEntry: !1, noneOfTheAbove: !1, ...ee };
+    return e(xe, { allowTextEntry: de, border: b, disabled: B(G), error: R(m), id: G, isRadio: y, isSelected: !!((T = m[G]) != null && T.isSelected), label: A, noneOfTheAbove: o, onUserInputChanged: I, promptText: (ee == null ? void 0 : ee.otherOptionPlaceholder) || "Please specify", text: (C = m[x]) == null ? void 0 : C.userText, useMobileStyling: i, value: z }, G);
+  }), !!f && e("div", { className: "ul-card__min-select-counter", children: [P(m), "/", r.minSelect] })] }), $ && e(Te, { handleSubmit: L, isSubmitDisabled: k(m) })] }), !g && e(ge, { children: e("div", { className: "ul-card__button-wrapper", children: e(ne, { disabled: k(m), onClick: L, children: ve(r) }) }) })] }) })] }, a);
+}, Rr = (n) => {
+  const { questionId: s, type: c, next: t, options: r } = n, { setFocusedQuestionId: a } = X((p) => ({ setFocusedQuestionId: p.setFocusedQuestionId }));
+  return e(Ge, { ...n, onSubmit: (p, h) => {
+    var _;
+    const u = Object.entries(p).find(([, l]) => l.isSelected) || [void 0, void 0], [b, i] = u, g = r.find((l) => `${l.id}` === b);
+    !((_ = g == null ? void 0 : g.optionProperties) != null && _.allowsTextEntry) || i != null && i.userText && i.userText.trim() !== "" || a(s);
+    const d = i != null && i.userText ? { [b]: { userText: i.userText } } : null;
+    t({ value: g && b ? { [b]: g.value } : {}, secondaryValue: d, questionId: s, type: c }, h);
+  } });
+}, Dr = (n) => {
+  const { questionId: s, type: c, next: t } = n;
+  return e(Ge, { ...n, onSubmit: (r, a) => {
+    const p = Object.entries(r).reduce((u, [b, i]) => (u[b] = i.isSelected, u), {}), h = Object.entries(r).reduce((u, [b, i]) => {
+      if (!i.userText) return u;
+      const g = u || {};
+      return g[b] = { userText: i.userText }, g;
+    }, null);
+    t({ value: p, secondaryValue: h, questionId: s, type: c }, a);
+  } });
+}, Fr = ({ className: n, labels: s, message: c, properties: t, next: r, questionId: a, type: p }) => {
+  const [h, u] = re(null), { border: b, useMobileStyling: i, viewDocument: g, isLongFormSurvey: d, focusedQuestionId: _ } = X((S) => ({ border: S.border, useMobileStyling: S.useMobileStyling, viewDocument: S.viewDocument, isLongFormSurvey: le(S.studyType), focusedQuestionId: S.focusedQuestionId })), l = d && _ === a, v = s && s.left, m = s && s.right;
+  return e("form", { className: j(n, "ul-card--nps", "fade-in-transition", d && !l && "ul-card--unfocused"), children: [e(oe, { isRequired: d && (t == null ? void 0 : t.required), message: c, properties: t }), e(he, { properties: t, children: [e(ce, { children: [e("div", { className: "ul-card--nps__numbers", children: [...Array(11)].map((S, y) => e("button", { className: j(se("nps-number", i), se(`nps-number-${y}`, i)), id: `option-${y}`, onClick: (N) => {
+    d && (N.preventDefault(), N.stopPropagation(), u(y)), r({ value: y, questionId: a, type: p }, !0);
+  }, onKeyDown: (N) => {
+    var R, P;
+    const F = g.querySelectorAll("button.nps-number");
+    N.key === "ArrowRight" ? (R = F[y + 1]) == null || R.focus() : N.key === "ArrowLeft" ? (P = F[y - 1]) == null || P.focus() : N.key !== "Enter" && N.key !== " " || (d && (N.preventDefault(), N.stopPropagation(), u(y)), r({ value: y, questionId: a, type: p }, !0));
+  }, onPointerDown: (N) => {
+    N.currentTarget.style.zIndex = "2", N.currentTarget.style.borderColor = b;
+  }, onPointerLeave: (N) => {
+    N.currentTarget.style.zIndex = "auto";
+  }, style: h === y ? { backgroundColor: b, color: "#fff" } : void 0, tabIndex: 0, children: y }, y)) }), e("div", { className: "ul-card--nps__labels", children: [e("span", { children: v }), e("span", { children: m })] })] }), !t.required && !d && e(ge, { children: e("div", { className: "ul-vertical-centered-container", children: e(ne, { onClick: (S) => {
+    S.preventDefault(), S.stopPropagation(), r({ value: null, questionId: a, type: p }, !0);
+  }, children: ve(t) }) }) })] })] }, a);
+}, Qr = (n) => {
+  const { className: s, message: c, next: t, properties: r, questionId: a, type: p, showIndividualSubmit: h = !1, onSubmitButtonClick: u } = n, b = p === "aidynamicfollowup" || p === "aidynamicstandalone", i = b ? n.loading : void 0, { border: g, useMobileStyling: d, update: _, isLongFormSurvey: l, focusedQuestionId: v, setFocusedQuestionId: m, isPreview: S } = X((I) => ({ border: I.border, useMobileStyling: I.useMobileStyling, update: I.update, isLongFormSurvey: le(I.studyType), focusedQuestionId: I.focusedQuestionId, setFocusedQuestionId: I.setFocusedQuestionId, isPreview: I.isPreview })), [y, N] = re(""), F = ie(null), R = l && v === a;
+  te(() => {
+    var I, B;
+    l && !S && (R ? (I = F.current) == null || I.focus() : (B = F.current) == null || B.blur());
+  }, [l, R, S]);
+  const P = y.trim(), U = r.required === !0 && !P, f = kr(F, () => _()), k = (I) => {
+    I.preventDefault(), I.stopPropagation();
+    const B = P.length > 0, L = !r.required || B;
+    t({ value: y, questionId: a, type: p }, L), u && u(B);
+  }, q = r && r.openTextPlaceholder ? r.openTextPlaceholder : "";
+  if ((i === Me.failure || i === void 0) && b) return e(Se, {});
+  const M = i === Me.inFlight, $ = M ? "Preparing your next question" : c;
+  return e("form", { className: j(s, "ul-card-text", "fade-in-transition", l && !R && "ul-card--unfocused"), id: "text-form", onClick: () => {
+    l && v !== a && m(a);
+  }, children: [e(oe, { isRequired: l && (r == null ? void 0 : r.required), message: $, properties: r }), e(he, { properties: r, children: e("div", { className: "ul-card-text", children: e(ce, { children: [e("div", { className: "ul-card-text__container", children: e("textarea", { "aria-describedby": "ul-caption", "aria-labelledby": "ul-question", "aria-multiline": "true", "aria-placeholder": q, className: j(M && "ul-card-text__input__loading", se("ul-card-text__input", d)), "data-gramm": "false", disabled: M, maxLength: 5e3, name: "text", onBlur: (I) => {
+    I.currentTarget.style.borderColor = We;
+  }, onChange: (I) => {
+    const { value: B } = I.currentTarget;
+    if (f(), I.preventDefault(), I.stopPropagation(), N(B), l) {
+      const L = B.trim().length > 0;
+      t({ value: B, questionId: a, type: p }, L);
+    }
+  }, onFocus: (I) => {
+    I.currentTarget.style.borderColor = g, m(a);
+  }, placeholder: q, ref: F, role: "textbox", tabIndex: 0 }) }), r.footerHtml && e(we, { className: "footer", html: r.footerHtml }), h && e(Te, { handleSubmit: k, isSubmitDisabled: U }), e(ge, { children: !l && e(ne, { disabled: U || M, onClick: k, children: ve(r) }) })] }) }) })] }, a);
+}, Re = 1, Ye = 2, Ke = 3, Ce = (n) => n.type === "av_permission", $e = (n) => n.type === "screen_permission", Xe = (n, s) => n === void 0 ? Re : n ? ((c, t) => !(Ce(t) ? t.permissionDescriptors : []).includes("camera") || c.getVideoTracks().length > 0)(n, s) ? Ke : Re : Ye, Oe = { avStream: null, currentPage: null, mediaRecordingUids: null, nextQuestion: () => {
+}, passthroughData: void 0, recordingMediaTypes: void 0, screenPermissionRequested: !1, type: void 0 }, pe = lr((n) => ({ ...Oe, reset: () => {
+  n(Oe);
+}, updatePage: (s) => {
+  n(s);
+} }));
+function De({ currentPage: n, pages: s }) {
+  const { avStream: c, recordingMediaTypes: t, updatePage: r } = pe.getState(), { recorderEventEmitter: a } = X.getState();
+  a.emit("av.permission", { "permission.descriptors": n.permissionDescriptors, "stream.ready": (p, h) => {
+    if (c === p) return;
+    let u = n;
+    if (p && !n.permissionDescriptors.includes("camera")) {
+      const b = s.indexOf(n), i = h != null && h.active ? b + 2 : b + 1;
+      h != null && h.active && t && a.emit("begin.recording", { "recording.media.types": t, "start.recording.callback": (g) => r({ mediaRecordingUids: g }) }), u = s[i];
+    }
+    r({ currentPage: u, avStream: p });
+  } });
+}
+function Fe({ status: n }) {
+  const { nextQuestion: s, passthroughData: c, mediaRecordingUids: t, reset: r } = pe.getState(), { recorderEventEmitter: a, handleUploadUpdate: p, index: h } = X.getState(), u = { value: { taskStatus: n }, type: "recordedtask", questionId: (c == null ? void 0 : c.questionId) || 1 };
+  c && a.emit("finish.task", { "begin.callback": (b) => {
+    p({ mediaRecordingUid: b, isSubmitted: !0, progressPct: 0, isComplete: !1 });
+  }, "progress.callback": (b, i) => {
+    p({ mediaRecordingUid: b, progressPct: i.detail, isSubmitted: !1, isComplete: !1 });
+  }, "upload.callback": (b) => {
+    b && p({ mediaRecordingUid: b, isComplete: !0, isSubmitted: !0, progressPct: 100 });
+  }, "passthrough.data": c, "current.index": h, "task.response": u, "task.complete.callback": (b) => {
+    u.value.taskDurationMillisecond = b, t && (u.value.mediaRecordingUids = t), r(), s(u);
+  } });
+}
+function Qe({ pages: n, setIsRequestingPermission: s }) {
+  const { recorderEventEmitter: c, eventEmitFn: t } = X.getState(), { updatePage: r, currentPage: a, recordingMediaTypes: p, screenPermissionRequested: h } = pe.getState();
+  if (!a) return;
+  const u = n.indexOf(a);
+  switch (a.type) {
+    case "av_permission": {
+      const b = h ? u + 2 : u + 1;
+      return h && p && c.emit("begin.recording", { "recording.media.types": p, "start.recording.callback": (i) => {
+        r({ mediaRecordingUids: i });
+      } }), void r({ currentPage: n[b] });
+    }
+    case "screen_permission":
+      return void c.emit("screen.permission", { "screen.permission.requested": s, "stream.ready.callback": (b, i) => {
+        const g = i ? n[u + 1] : a;
+        i && p && c.emit("begin.recording", { "recording.media.types": p, "start.recording.callback": (d) => {
+          r({ captureStream: i, mediaRecordingUids: d });
+        } }), r({ currentPage: g, screenPermissionRequested: !0, captureStream: i });
+      } });
+    case "start_task":
+      return t("recorded.task.start"), c.emit("recorded.task.start"), c.emit("start.task"), void r({ currentPage: n[u + 1], screenPermissionRequested: !0 });
+    case "complete_task":
+      return;
+  }
+}
+const Je = "ul-permission-graphics-container", er = "ul-permission-body", rr = j(Je, "ul_recorded-task-inset-spacing"), Ne = j("ul-horizontal-button-container", "ul-horizontal-button-container-left"), tr = ({ richTextBody: n }) => e(we, { className: "ul-rich-text-body", html: n, id: "ul-task-detail-container" }), qe = ({ required: n, skipButtonText: s, bottom: c = !1 }) => n ? null : e(ne, { className: j(c && "ul-skip-button-below", "ul-button-inactive"), onClick: Fe.bind(null, { status: "abandoned" }), children: s || "Skip" }), Be = (n) => {
+  const { avStream: s, captureStream: c, recordingMediaTypes: t, updatePage: r } = pe.getState(), a = (t == null ? void 0 : t.includes("audio")) || (t == null ? void 0 : t.includes("video"));
+  te(() => {
+    const p = setInterval(() => {
+      a && s && !s.active ? r({ avStream: null, currentPage: n[0] }) : c && c.active || r({ captureStream: void 0, currentPage: n[a ? 1 : 0] });
+    }, 1e3);
+    return () => clearInterval(p);
+  }, [s, c, a, n, t, r]);
+}, Br = ({ content: n, pages: s, required: c }) => {
+  const { buttonText: t, skipButtonText: r, taskDetail: a } = n;
+  return Be(s), e("div", { className: "ul-task-page", children: [a && e(tr, { richTextBody: a }), e("div", { className: Ne, children: [e(ne, { onClick: Qe.bind(null, { pages: s }), children: t }), e(qe, { required: c, skipButtonText: r })] })] }, "start-task");
+}, Er = ({ content: n, pages: s, properties: c }) => {
+  const { buttonText: t, skipButtonText: r } = n;
+  return Be(s), e("div", { className: "ul-task-page", children: [n.taskDetail && e(tr, { richTextBody: n.taskDetail }), e(he, { properties: c, children: e("div", { className: Ne, children: [e(ne, { className: "ul-complete-task-button", onClick: Fe.bind(null, { status: "completed" }), children: t }), e(ne, { className: j("ul-button-inactive"), onClick: Fe.bind(null, { status: "given.up" }), children: r })] }) })] }, "complete-task");
+}, Ar = ({ content: n, pages: s, required: c }) => {
+  const { buttonText: t, skipButtonText: r } = n, [a] = X((u) => [u.tabTitle]), [p, h] = re(!1);
+  return e("div", { children: [e("div", { className: rr, children: [e("p", { style: { marginTop: "auto" }, children: n.selectTabText }), e("div", { className: "ul-select-tab-container", children: e("p", { className: er, children: a }) })] }), e("div", { className: c ? "" : Ne, children: [e(ne, { disabled: p, onClick: Qe.bind(null, { pages: s, setIsRequestingPermission: h }), children: t }), e(qe, { required: c, skipButtonText: r })] })] });
+}, $r = ({ content: n }) => e(we, { className: j(Je, "ul_permission_svg_container", "ul_recorded-task-inset-spacing", "ul-center-horizontally"), html: n.svg }, "ul-permission-request-graphic"), Or = ({ content: n, pages: s, required: c }) => {
+  const { permissionDeniedHeadline: t, permissionDeniedBody: r, skipButtonText: a, tryAgainButtonText: p } = n, h = Ce(s[0]) ? s[0] : null;
+  return te(() => {
+    const u = setInterval(() => {
+      h !== null && De({ currentPage: h, pages: s });
+    }, 1e3);
+    return () => clearInterval(u);
+  }, [h, s]), h ? e("div", { children: [e("div", { className: rr, children: e("p", { className: "ul-av-permission-denied-paragraph", children: [e("span", { className: "ul-av-permission-denied-headline", children: t }), e("span", { className: er, children: r })] }) }), e("div", { className: Ne, children: [e(ne, { onClick: De.bind(null, { currentPage: h, pages: s }), children: p }), e(qe, { required: c, skipButtonText: a })] })] }) : null;
+}, Ur = ({ stream: n }) => e("video", { autoPlay: !0, className: j("ul_recorded-task-inset-spacing"), id: "ul-record-task-video-preview", muted: !0, ref: (s) => {
+  s && (s.srcObject = n || null);
+} }), Vr = ({ content: n, pages: s, required: c }) => {
+  const { skipButtonText: t } = n, { avStream: r } = pe.getState();
+  return Be(s), e("div", { children: [e(Ur, { stream: r }), e("div", { className: "ul-vertical-button-container-center", children: [e(ne, { onClick: Qe.bind(null, { pages: s }), children: n.buttonText }), e(qe, { bottom: !0, required: c, skipButtonText: t })] })] });
+}, Hr = ({ properties: n }) => {
+  const { pages: s, required: c } = n, { avStream: t, currentPage: r } = pe.getState();
+  if (r === void 0) return null;
+  switch (r == null ? void 0 : r.type) {
+    case "av_permission": {
+      const a = Xe(t, r);
+      return a === Re ? e($r, { content: r }) : e(a === Ye ? Or : Vr, { content: r, pages: s, required: c });
+    }
+    case "screen_permission":
+      return e(Ar, { content: r, pages: s, required: c });
+    case "start_task":
+      return e(Br, { content: r, pages: s, required: c });
+    case "complete_task":
+      return e(Er, { content: r, pages: s, properties: n });
+    default:
+      return null;
+  }
+}, jr = ({ className: n, properties: s, next: c, questionId: t }) => {
+  const r = X(), { surveyId: a, responseGroupUid: p, userId: h, update: u } = r, b = pe(), { screenPermissionRequested: i } = b, g = pe((m) => m.avStream);
+  let d = pe((m) => m.currentPage);
+  d || (d = function({ pages: m, userId: S, responseGroupUid: y, surveyId: N, questionId: F, next: R }) {
+    const { updatePage: P } = pe.getState(), { eventEmitFn: U, recorderEventEmitter: f } = X.getState(), k = { questionId: F, surveyId: N, visitorId: S, responseGroupUid: y };
+    let q = 0;
+    f.emit("recorded.task.permission.screen"), U("recorded.task.permission.screen"), f.emit("permission.status", { "permission.status.callback": ($, I, B, L) => {
+      const V = m[q], { type: x } = V, A = ["screen"];
+      if (Ce(V)) {
+        const { permissionDescriptors: z } = V, ee = z == null ? void 0 : z.includes("microphone"), G = z == null ? void 0 : z.includes("camera");
+        ee && A.push("audio"), G && A.push("video"), ($ != null && $.active && !G || $ != null && $.active && I) && q++;
+      }
+      $e(m[q]) && B && (q++, f.emit("begin.recording", { "recording.media.types": A, "start.recording.callback": (z) => P({ mediaRecordingUids: z }) })), P({ currentPage: m[q], avStream: $, screenPermissionRequested: B, nextQuestion: R, type: x, passthroughData: k, recordingMediaTypes: A, captureStream: L });
+    } });
+    const M = m[q];
+    return M.type === "av_permission" && De({ currentPage: M, pages: m }), M;
+  }({ questionId: t, surveyId: a, next: (m) => {
+    c(m, !0);
+  }, pages: s.pages, responseGroupUid: p, userId: h }));
+  let _ = d.headline, l = d.captionText;
+  const v = Xe(g, d);
+  return $e(d) && i && (_ = d.permissionDeniedHeadline, l = d.permissionDeniedCaptionText), Ce(d) && v === Ke && (_ = d.permissionGrantedHeadline, l = d.permissionGrantedCaptionText), te(() => {
+    u();
+  }, [u]), e("div", { className: j(n, "ul-center-horizontally", "fade-in-transition"), children: [e(oe, { isRequired: s == null ? void 0 : s.required, message: _, properties: { captionText: l } }), e(ce, { children: e(Hr, { properties: s }) })] });
+}, zr = ({ richTextBody: n, plaintextBody: s }) => n ? e(we, { className: "ul-rich-text-body", html: n, id: "ul-card__text-url-body-container" }) : s ? e("div", { className: "ul-rich-text-body", id: "ul-card__text-url-body-container", children: (s ? s.split(/\n\s*\n/g) : []).map((c, t) => e("p", { children: c }, t)) }) : null, Wr = ({ className: n, message: s, next: c, properties: t, questionId: r, type: a }) => {
+  const { visitorAttributes: p, isLongFormSurvey: h } = X((g) => ({ visitorAttributes: g.visitorAttributes, isLongFormSurvey: le(g.studyType) })), u = (g, d = !1) => {
+    c({ value: d ? { skipped: !0 } : void 0, questionId: r, type: a }, !0);
+  }, b = Tr(t && t.buttonUrl, p), i = h && t.promptActionType === or.NO_BUTTON;
+  return e("div", { className: j(n, "ul-card__text-url-prompt", "fade-in-transition"), children: [e(oe, { isRequired: h && (t == null ? void 0 : t.required), message: s, properties: { image: t.image, questionHtml: t.questionHtml } }), e(ce, { children: e(zr, { plaintextBody: t == null ? void 0 : t.body, richTextBody: t == null ? void 0 : t.richTextBody }) }), e(he, { properties: t, children: !i && e(ge, { children: e("div", { className: "ul-card-button-group", children: [e("a", { className: "ul-card-text__button ul-card__text-url-prompt-button", href: b, id: "ul-card-text__button", onClick: u, onKeyPress: (g) => {
+    g.key !== "Enter" && g.key !== " " || c({ value: void 0, questionId: r, type: a }, !0);
+  }, rel: "noreferrer", role: b ? "link" : "button", tabIndex: 0, target: "_blank", children: ve(t) }), t.required === !1 && e("button", { className: "ul-card-skip__button", onClick: (g) => u(0, !0), children: je(t) })] }) }) })] }, r);
+}, Zr = ({ className: n, questionId: s }) => {
+  const { border: c, destroy: t, endCard: r, forceBrandedLogo: a, quotaEndcardText: p, update: h } = X((g) => ({ border: g.border, destroy: g.destroy, endCard: g.endCard, forceBrandedLogo: g.forceBrandedLogo, quotaEndcardText: g.quotaEndcardText, update: g.update }));
+  te(() => {
+    setTimeout(() => {
+      t(xr);
+    }, a ? 4e3 : 2e3);
+  }, [t, a]);
+  const u = (p == null ? void 0 : p.subheader) ?? (r == null ? void 0 : r.subheader), b = u ? e("p", { className: "ul-caption", children: u }) : null, i = (p == null ? void 0 : p.headline) ?? (r == null ? void 0 : r.headline) ?? "";
+  return te(() => {
+    h();
+  }, [h]), e("div", { className: j(n, "ul-card--thanks", "fade-in-transition"), children: e("div", { children: e("div", { className: "ul-card--thanks-content", children: [e("div", { className: "ul-thanks-check", children: e("svg", { "aria-labelledby": "title", fill: "none", height: "99", viewBox: "0 0 81 99", width: "81", xmlns: "http://www.w3.org/2000/svg", children: [e("path", { clipRule: "evenodd", d: "M40.5 77C60.9345 77 77.5 60.4345 77.5 40C77.5 19.5655 60.9345 3 40.5 3C20.0655 3 3.5 19.5655 3.5 40C3.5 60.4345 20.0655 77 40.5 77ZM80.5 40C80.5 62.0914 62.5914 80 40.5 80C18.4086 80 0.5 62.0914 0.5 40C0.5 17.9086 18.4086 0 40.5 0C62.5914 0 80.5 17.9086 80.5 40Z", fill: c, fillRule: "evenodd" }), e("path", { clipRule: "evenodd", d: "M55.025 22.9046C55.6299 23.4705 55.6616 24.4198 55.0956 25.0247C54.8724 25.2634 54.6109 25.5285 54.3157 25.8277C52.2547 27.9168 48.5549 31.667 44.8135 39.6658C43.2818 42.9406 42.0864 45.8386 41.0823 48.2729C40.6539 49.3116 40.2603 50.2659 39.8902 51.129C39.287 52.5359 38.7248 53.7508 38.1744 54.625C37.8997 55.0613 37.5806 55.4905 37.2017 55.8245C36.8201 56.1607 36.2613 56.5 35.5457 56.5C34.6742 56.5 34.0892 55.9692 33.7774 55.6083C33.4502 55.2296 33.1752 54.7511 32.9396 54.301C32.7305 53.9013 32.5088 53.4367 32.2797 52.9565C32.2429 52.8794 32.2059 52.8019 32.1688 52.7243C31.8942 52.1499 31.5959 51.534 31.2537 50.8868C29.8886 48.305 27.8539 45.2878 24.2343 43.1382C23.522 42.7152 23.2875 41.7949 23.7105 41.0826C24.1335 40.3703 25.0539 40.1358 25.7662 40.5588C30.0556 43.1062 32.4149 46.6647 33.9058 49.4845C34.2776 50.1876 34.5973 50.8487 34.8753 51.4302C34.9147 51.5124 34.9529 51.5926 34.9902 51.6707C35.2222 52.1567 35.4164 52.5637 35.5978 52.9102C35.6151 52.9434 35.6321 52.9754 35.6485 53.0061C36.0565 52.3531 36.5341 51.3434 37.133 49.9468C37.4781 49.1418 37.8572 48.2229 38.2761 47.2074C39.2886 44.7532 40.5339 41.7347 42.0961 38.3948C46.0591 29.9221 50.0641 25.8648 52.1535 23.7482C52.4423 23.4556 52.6944 23.2002 52.9048 22.9753C53.4708 22.3703 54.42 22.3387 55.025 22.9046ZM35.1994 53.5892C35.1994 53.5892 35.2 53.5888 35.2012 53.5879C35.2 53.5889 35.1994 53.5893 35.1994 53.5892ZM36.0666 53.6682C36.0732 53.674 36.0765 53.6775 36.0765 53.6777C36.0765 53.678 36.0732 53.6751 36.0666 53.6682Z", fill: c, fillRule: "evenodd" }), e("path", { d: "M69.5 97C69.5 98.1046 56.2924 99 40 99C23.7076 99 10.5 98.1046 10.5 97C10.5 95.8954 23.7076 95 40 95C56.2924 95 69.5 95.8954 69.5 97Z", fill: "black", fillOpacity: "0.2" })] }) }), e(oe, { message: i }), b] }) }) }, s);
+}, Gr = ({ className: n }) => {
+  const { uploadProgress: s } = X((a) => ({ uploadProgress: a.uploadProgress }));
+  let c, t;
+  Object.values(s).filter((a) => a.isSubmitted).length > 1 ? (c = "Your responses are processing", t = "Please keep this tab open until your responses are fully processed.") : (c = "Your response is processing", t = "Please keep this tab open until your response is fully processed.");
+  const r = Math.round(Math.min(99, ...Object.values(s).filter((a) => a.isSubmitted).map((a) => a.progressPct || 0)));
+  return e("div", { className: j(n, "ul-card--uploading", "fade-in-transition"), children: [e("div", { "aria-busy": "true", "aria-label": "Processing...", "aria-live": "polite", className: "ul-loading-spinner-container", role: "progressbar", children: e("div", { className: "ul-loading-spinner", children: [e("div", { className: "first" }), e("div", { className: "second" }), e("div", { className: "third" }), e("div", { className: "fourth" })] }) }), e(oe, { message: `${c} (${r}% complete)` }), e("p", { className: "ul-caption", children: t })] });
+}, nr = dr(void 0), Yr = ({ value: n, children: s }) => e(nr.Provider, { value: n, children: s }), Kr = ({ isRightLabel: n, isLeftLabel: s }) => n ? ue.RIGHT : s ? ue.LEFT : null, Xr = "Best", Jr = "Worst", et = ({ className: n, labels: s, message: c, properties: t, options: r, questionId: a, type: p, next: h }) => {
+  var F, R, P, U;
+  const [u, b] = re(r.map((f, k) => ({ ...f, label: f.label === "" ? `Item ${k + 1}` : f.label, isRightLabel: !1, isLeftLabel: !1 }))), i = (() => {
+    const f = cr(nr);
+    if (f === void 0) throw new Error("usePreviousResponses must be used within a PreviousResponsesProvider");
+    return f;
+  })(), g = { padding: "24px", display: "flex", cursor: "pointer", width: "auto" }, [d, _] = re(!1);
+  te(() => {
+    const f = u.findIndex((V) => V.isRightLabel), k = u.findIndex((V) => V.isLeftLabel), q = f !== -1 && k !== -1;
+    _(q);
+    const M = !t.required || t.required && q, $ = u.map((V) => ({ id: V.id, option: V.label, selected: Kr(V) })), I = Math.floor(a), B = Object.keys(i).filter((V) => V.startsWith(I.toString())).map(Number).sort((V, x) => V - x).at(-1), L = [];
+    if (typeof B == "number") {
+      const V = i[B], x = JSON.parse(V);
+      L.push(...x);
+    }
+    L.push($), setTimeout(() => {
+      h({ value: L, questionId: a, type: p }, M, q), _(!1);
+    }, q ? 500 : 0);
+  }, [u]);
+  const { border: l, useMobileStyling: v, enableCspTrustedTypes: m } = X((f) => ({ border: f.border, useMobileStyling: f.useMobileStyling, enableCspTrustedTypes: f.enableCspTrustedTypes })), S = (f, k) => () => {
+    d || b((q) => ((M, $, I) => M.map((B) => B.id === $ ? { ...B, isRightLabel: I === ue.RIGHT, isLeftLabel: I === ue.LEFT } : I === ue.RIGHT && B.isRightLabel || I === ue.LEFT && B.isLeftLabel ? { ...B, isRightLabel: !1, isLeftLabel: !1 } : B))(q, f, k));
+  }, y = (F = t.ratingIcons) == null ? void 0 : F[0].svg, N = (R = t.ratingIcons) == null ? void 0 : R[1].svg;
+  return e("form", { className: j(n, "ul-card-maxdiff", "fade-in-transition"), children: [e(oe, { isRequired: t == null ? void 0 : t.required, message: c, properties: t }), e(ce, { children: e("div", { className: "ul-card--maxdiff__question-inner-container", children: [e("div", { className: "ul-card-maxdiff__label", children: (s == null ? void 0 : s.left) || ((P = t == null ? void 0 : t.labels) == null ? void 0 : P.left) || Xr }), e("div", { children: " " }), e("div", { className: "ul-card-maxdiff__label", children: (s == null ? void 0 : s.right) || ((U = t == null ? void 0 : t.labels) == null ? void 0 : U.right) || Jr }), u.map(({ id: f, label: k, isLeftLabel: q, isRightLabel: M }) => e(Se, { children: [e("div", { className: "ul-card-maxdiff__option-control " + (N ? "smiley" : ""), children: N ? e(Ue, { ariaPressed: q, className: q ? "ul-card-maxdiff__option-btn ul-card-maxdiff__option-selected good" : "ul-card-maxdiff__option-btn", enableCspTrustedTypes: m, html: N, id: `smiley-good-${f}`, onClick: S(f, ue.LEFT) }) : e(xe, { allowTextEntry: !1, ariaLabel: `bestLabel-${k}`, border: l, choiceStyle: g, error: !1, id: `${f}`, isRadio: !0, isSelected: q, onUserInputChanged: S(f, ue.LEFT), useMobileStyling: v }) }), e("div", { className: "ul-card-maxdiff__option-label", children: k }), e("div", { className: "ul-card-maxdiff__option-control " + (y ? "smiley" : ""), children: y ? e(Ue, { ariaPressed: M, className: M ? "ul-card-maxdiff__option-btn ul-card-maxdiff__option-selected bad" : "ul-card-maxdiff__option-btn", enableCspTrustedTypes: m, html: y, id: `smiley-bad-${f}`, onClick: S(f, ue.RIGHT) }) : e(xe, { allowTextEntry: !1, ariaLabel: `worstLabel-${k}`, border: l, choiceStyle: g, error: !1, id: `${f}`, isRadio: !0, isSelected: M, onUserInputChanged: S(f, ue.RIGHT), useMobileStyling: v }) })] }))] }) })] }, a);
+}, Ue = ({ enableCspTrustedTypes: n, ariaPressed: s, className: c, html: t, id: r, onClick: a }) => {
+  const p = be(() => Ze(t, n), [n, t]);
+  return e("span", { "aria-pressed": s, className: c, dangerouslySetInnerHTML: { __html: p }, id: r, onClick: a, tabIndex: 0, type: "button" });
+}, rt = ({ className: n, labels: s, message: c, next: t, properties: r, questionId: a, type: p, onSubmitButtonClick: h, options: u, showIndividualSubmit: b = !1 }) => {
+  const i = ie(null), g = ie(0), d = ie(0), _ = ie(null), l = ie(!1), v = ie([]), [m, S] = re(() => (r == null ? void 0 : r.required) === !0), [y, N] = re(!1), [F, R] = re(() => u.map((w) => ({ ...w, rank: null }))), P = be(() => Array.from({ length: u.length }, (w, H) => H + 1), [u.length]), { isLongFormSurvey: U, focusedQuestionId: f, setFocusedQuestionId: k, useMobileStyling: q, isPreview: M, headers: $ } = X((w) => ({ useMobileStyling: w.useMobileStyling, isLongFormSurvey: le(w.studyType), focusedQuestionId: w.focusedQuestionId, setFocusedQuestionId: w.setFocusedQuestionId, isPreview: w.isPreview, headers: w.headers })), I = ($ == null ? void 0 : $["userleap-platform"]) === "android", B = q && !M && !I, L = !B && !I, V = U && f === a, x = (w) => {
+    w.preventDefault(), T(F), h && h(y);
+  }, A = (w, H) => {
+    R((O) => {
+      const D = parseInt(H), W = O.map((Y) => ({ ...Y }));
+      W.some((Y) => Y.rank == null) && W.forEach((Y, fe) => Y.rank = fe + 1);
+      const ae = W.findIndex((Y) => Y.id === w);
+      if (ae === -1) return O;
+      const J = W[ae].rank;
+      return D < J ? W.forEach((Y) => {
+        Y.id !== w && Y.rank >= D && Y.rank < J && (Y.rank = Y.rank + 1);
+      }) : D > J && W.forEach((Y) => {
+        Y.id !== w && Y.rank > J && Y.rank <= D && (Y.rank = Y.rank - 1);
+      }), W[ae].rank = D, W.sort((Y, fe) => Y.rank - fe.rank), C(W), W;
+    });
+  }, z = (w, H) => {
+    for (let O = 0; O < v.current.length; O++) {
+      const D = v.current[O];
+      if (!D || D === _.current) continue;
+      const W = D.getBoundingClientRect();
+      if (w >= W.left && w <= W.right && H >= W.top && H <= W.bottom) return { element: D, index: O };
+    }
+    return null;
+  }, ee = (w) => (H) => {
+    if (!B) return;
+    H.preventDefault(), H.stopPropagation(), l.current = !0, i.current = w;
+    const O = H.touches[0];
+    g.current = O.clientY, d.current = O.clientY;
+    const D = H.currentTarget.closest(".ul-card-rank__option");
+    D && (_.current = D, D.classList.add("is-dragging"));
+  }, G = (w) => {
+    if (!B || !l.current || i.current === null) return;
+    w.preventDefault(), w.stopPropagation();
+    const H = w.touches[0];
+    d.current = H.clientY;
+    const O = d.current - g.current;
+    _.current && (_.current.style.transform = `translateY(${O}px)`, _.current.style.zIndex = "1000"), v.current.forEach((W) => {
+      W && W !== _.current && W.classList.remove("is-drop-target");
+    });
+    const D = z(H.clientX, H.clientY);
+    D && D.element.classList.add("is-drop-target");
+  }, de = (w) => {
+    if (!B || !l.current || i.current === null) return;
+    w.preventDefault(), w.stopPropagation();
+    const H = w.changedTouches[0], O = z(H.clientX, H.clientY);
+    _.current && (_.current.style.transform = "", _.current.style.zIndex = "", _.current.classList.remove("is-dragging")), v.current.forEach((D) => {
+      D && D.classList.remove("is-drop-target");
+    }), O && O.index !== i.current && o(i.current, O.index), i.current = null, _.current = null, l.current = !1;
+  }, o = (w, H) => {
+    R((O) => {
+      const D = O.map((ae) => ({ ...ae })), [W] = D.splice(w, 1);
+      return D.splice(H, 0, W), D.forEach((ae, J) => {
+        ae.rank = J + 1;
+      }), C(D), D;
+    });
+  }, T = (w) => {
+    const H = {};
+    w.reduce((O, D) => (O[D.id] = D.rank, O), H), t({ value: H, questionId: a, type: p }, !0);
+  }, C = (w) => {
+    S(!1), N(!0), U && T(w);
+  }, { left: E, right: Q } = s, Z = u.length, K = (w) => {
+    w.preventDefault(), w.currentTarget.classList.add("is-drop-target");
+  }, me = (w) => {
+    w.currentTarget.classList.remove("is-drop-target");
+  }, ye = (w) => {
+    i.current = null, w.currentTarget.classList.remove("is-dragging");
+  };
+  return e("form", { className: j(n, "ul-card-rank", "fade-in-transition", U && !V && "ul-card--unfocused"), onClick: U && !V ? () => {
+    k(a);
+  } : void 0, onSubmit: x, children: [e(oe, { isRequired: r == null ? void 0 : r.required, message: c, properties: r }), e(he, { properties: r, children: e(Se, I ? { children: [e(ce, { children: [e("div", { className: "ul-card--rank__question-inner-container", children: [e("div", { className: "ul-card-rank__labels", children: e("span", { children: ["1 - ", E] }) }), e("ol", { className: "ul-card-rank__list", children: F.map(({ id: w, label: H, rank: O }) => e("li", { className: "ul-card-rank__option", children: [e("select", { "aria-label": `Rank for ${H}`, className: j("ul-card-rank__select", O == null && "ul-card-rank__select--placeholder"), name: `rank[${w}]`, onChange: (D) => A(w, D.currentTarget.value), value: O ?? "", children: [O == null && e("option", { className: "ul-card-rank__select-option", disabled: !0, value: "", children: "-" }), P.map((D) => e("option", { className: "ul-card-rank__select-option", value: D, children: D }, `${D}-${a}`))] }), e("span", { children: H })] }, w)) }), e("div", { className: "ul-card-rank__labels", children: e("span", { children: [Z, " - ", Q] }) })] }), b && e(Te, { handleSubmit: x, isSubmitDisabled: m })] }), !U && e(ge, { children: e("div", { className: "ul-card__button-wrapper", children: e(ne, { disabled: m, children: ve(r) }) }) })] } : { children: [e(ce, { children: [e("div", { className: "ul-card--rank__question-inner-container", children: [e("div", { className: "ul-card-rank__labels", children: e("span", { children: ["1 - ", E] }) }), e("ol", { className: "ul-card-rank__list", onDragOver: I ? void 0 : (w) => {
+    w.preventDefault(), w.dataTransfer && (w.dataTransfer.dropEffect = "move");
+  }, children: F.map(({ id: w, label: H, rank: O }, D) => {
+    return e("li", { className: "ul-card-rank__option", draggable: !!L || void 0, onDragEnd: L ? ye : void 0, onDragEnter: L ? K : void 0, onDragLeave: L ? me : void 0, onDragStart: L ? (ae = D, (J) => {
+      i.current = ae, J.dataTransfer && (J.dataTransfer.effectAllowed = "move", J.dataTransfer.setData("text/plain", String(ae)), J.currentTarget.classList.add("is-dragging"));
+    }) : void 0, onDrop: L ? (W = D, (J) => {
+      var fe, Ee;
+      J.preventDefault(), J.currentTarget.classList.remove("is-drop-target");
+      const Y = i.current;
+      i.current = null, (Ee = (fe = J.currentTarget.closest(".ul-card-rank__list")) == null ? void 0 : fe.querySelector(".is-dragging")) == null || Ee.classList.remove("is-dragging"), Y != null && Y !== W && o(Y, W);
+    }) : void 0, ref: (J) => v.current[D] = J, children: [e("select", { "aria-label": `Rank for ${H}`, className: j("ul-card-rank__select", O == null && "ul-card-rank__select--placeholder"), name: `rank[${w}]`, onChange: (J) => A(w, J.currentTarget.value), value: O ?? "", children: [O == null && e("option", { className: "ul-card-rank__select-option", disabled: !0, value: "", children: "-" }), P.map((J) => e("option", { className: "ul-card-rank__select-option", value: J, children: J }, `${J}-${a}`))] }), e("span", { children: H }), !I && e("button", { "aria-label": `Drag ${H} to reorder`, className: "ul-card-rank__drag-btn", onTouchEnd: B ? de : void 0, onTouchMove: B ? G : void 0, onTouchStart: B ? ee(D) : void 0, title: "Drag to reorder", type: "button", children: e("svg", { fill: "none", height: "17", viewBox: "0 0 16 17", width: "16", xmlns: "http://www.w3.org/2000/svg", children: e("path", { d: "M5.75 11.625C6.37132 11.625 6.875 12.1287 6.875 12.75C6.875 13.3713 6.37132 13.875 5.75 13.875C5.12868 13.875 4.625 13.3713 4.625 12.75C4.625 12.1287 5.12868 11.625 5.75 11.625ZM10.25 11.625C10.8713 11.625 11.375 12.1287 11.375 12.75C11.375 13.3713 10.8713 13.875 10.25 13.875C9.62868 13.875 9.125 13.3713 9.125 12.75C9.125 12.1287 9.62868 11.625 10.25 11.625ZM5.75 7.375C6.37132 7.375 6.875 7.87868 6.875 8.5C6.875 9.12132 6.37132 9.625 5.75 9.625C5.12868 9.625 4.625 9.12132 4.625 8.5C4.625 7.87868 5.12868 7.375 5.75 7.375ZM10.25 7.375C10.8713 7.375 11.375 7.87868 11.375 8.5C11.375 9.12132 10.8713 9.625 10.25 9.625C9.62868 9.625 9.125 9.12132 9.125 8.5C9.125 7.87868 9.62868 7.375 10.25 7.375ZM5.75 3.125C6.37132 3.125 6.875 3.62868 6.875 4.25C6.875 4.87132 6.37132 5.375 5.75 5.375C5.12868 5.375 4.625 4.87132 4.625 4.25C4.625 3.62868 5.12868 3.125 5.75 3.125ZM10.25 3.125C10.8713 3.125 11.375 3.62868 11.375 4.25C11.375 4.87132 10.8713 5.375 10.25 5.375C9.62868 5.375 9.125 4.87132 9.125 4.25C9.125 3.62868 9.62868 3.125 10.25 3.125Z", fill: "currentColor" }) }) })] }, w);
+    var W, ae;
+  }) }), e("div", { className: "ul-card-rank__labels", children: e("span", { children: [Z, " - ", Q] }) })] }), b && e(Te, { handleSubmit: x, isSubmitDisabled: m })] }), !U && e(ge, { children: e("div", { className: "ul-card__button-wrapper", children: e(ne, { disabled: m, children: ve(r) }) }) })] }) })] }, a);
+}, tt = /* @__PURE__ */ new Set(["aidynamicfollowup", "aidynamicstandalone", "open", "matrix", "multipleselect", "multiplechoice", "rankorder"]), Ve = ({ cardInstance: n, moveToNextQuestion: s, showIndividualSubmit: c, submitQuestion: t, updateCardValues: r, allResponsesArray: a }) => {
+  const { isLongFormSurvey: p, createDynamicFollowupQuestion: h, cards: u, surveyVisitorAttributes: b } = X((y) => ({ isLongFormSurvey: le(y.studyType), createDynamicFollowupQuestion: y.createDynamicFollowupQuestion, cards: y.cards, surveyVisitorAttributes: y.surveyVisitorAttributes }));
+  if (!n) return null;
+  const { name: i, type: g, props: d, childId: _ } = n, l = c && tt.has(g), v = d == null ? void 0 : d.displayLogic;
+  if (v != null && v.length && !ze({ displayLogic: v, allResponses: a, cards: u, surveyVisitorAttributes: b ?? {} })) return null;
+  const m = { className: "ul-card", next: (y, N, F = !0) => t(y, N && F), questionId: i, type: g, showIndividualSubmit: c, ...l ? { next: (y, N) => {
+    r(y.questionId, y, N ?? !0);
+  }, onSubmitButtonClick: (y = !1) => {
+    _ ? y ? (s(i), h({ parentQuestionId: i })) : s(_) : s(i);
+  } } : {} }, S = (() => {
+    switch (g) {
+      case "consentlegal":
+        return e(Ir, { ...m, ...d });
+      case "likert":
+        return e(Cr, { ...m, ...d });
+      case "matrix":
+        return e(Mr, { ...m, ...d });
+      case "maxdiff":
+        return e(et, { ...m, ...d });
+      case "multiplechoice":
+        return e(Rr, { ...m, ...d });
+      case "multipleselect":
+        return e(Dr, { ...m, ...d });
+      case "nps":
+        return e(Fr, { ...m, ...d });
+      case "open":
+      case "aidynamicfollowup":
+      case "aidynamicstandalone":
+        return e(Qr, { ...m, type: n.type, ...d });
+      case "rankorder":
+        return e(rt, { ...m, ...d });
+      case "recordedtask":
+        return e(jr, { ...m, ...d });
+      case "texturlprompt":
+        return e(Wr, { ...m, ...d });
+      case "thanks":
+        return e(Zr, { ...m, ...d });
+      case "uploading":
+        return e(Gr, { ...m, ...d });
+      default:
+        return null;
+    }
+  })();
+  return S ? p ? e("div", { className: "ul-card-scroll-wrapper", children: S }, i) : S : null;
+}, nt = ({ isSubmitDisabled: n = !1, onSubmit: s, buttonText: c }) => {
+  var _;
+  const { cards: t, forceBrandedLogo: r, index: a, marketingUrl: p, showSurveyBrand: h, slugName: u, surveyId: b, useMobileStyling: i } = X((l) => ({ cards: l.cards, forceBrandedLogo: l.forceBrandedLogo, index: l.index, marketingUrl: l.marketingUrl, showSurveyBrand: l.showSurveyBrand, slugName: l.slugName, surveyId: l.surveyId, useMobileStyling: l.useMobileStyling })), g = ((_ = t[a]) == null ? void 0 : _.type) === "thanks", d = gr({ marketingUrl: p, slugName: u, surveyId: b, forceBrandedLogo: r });
+  return e("footer", { className: j("long-form-question-footer-container", i && "long-form-question-footer-container--mobile", g && "long-form-question-footer-container-center"), children: [g && r ? e(ur, { marketingUrlLink: d }) : e("div", { className: "long-form-question-footer-container-logo", children: h ? e(pr, { forceBrandedLogo: r, marketingUrlLink: d }) : null }), !g && e("div", { className: j("ul-card__button-wrapper", "ul-card-vertical__button-wrapper", "long-form-question-footer-container-actions"), children: e(ne, { className: j("long-form-button", n && "sprig-button-disabled"), disabled: n, onClick: s, children: e("span", { className: "long-form-button-text-container", children: c ?? e(mr, { stroke: "white" }) }) }) })] });
+}, st = /* @__PURE__ */ new Set(["thanks", "uploading"]), He = "Questions with Display Logic do not show in side-by-side previews.", ot = ({ cards: n, next: s, previousResponses: c }) => {
+  var de;
+  const t = ie(null), [r, a] = re({}), [p, h] = re({}), { isLongFormSurvey: u, focusedQuestionId: b, setFocusedQuestionId: i, createDynamicFollowupQuestion: g, allResponses: d, cardIndexByName: _, surveyVisitorAttributes: l, cards: v, createDynamicStandaloneQuestion: m, isPreview: S, update: y } = X((o) => ({ isLongFormSurvey: le(o.studyType), focusedQuestionId: o.focusedQuestionId, setFocusedQuestionId: o.setFocusedQuestionId, createDynamicFollowupQuestion: o.createDynamicFollowupQuestion, allResponses: o.allResponses, cardIndexByName: o.cardIndexByName, surveyVisitorAttributes: o.surveyVisitorAttributes, cards: o.cards, createDynamicStandaloneQuestion: o.createDynamicStandaloneQuestion, isPreview: o.isPreview, update: o.update })), N = be(() => ({ ...c, ...hr(n.map((o) => {
+    var T, C;
+    return { ...o, value: ((T = r[o.name]) == null ? void 0 : T.value) ?? null, secondaryValue: ((C = r[o.name]) == null ? void 0 : C.secondaryValue) ?? null };
+  })) }), [c, r, n]);
+  wr(N);
+  const F = br(n, N), R = be(() => vr({ storeAllResponses: d, cards: n, cardValues: r, cardIndexByName: _ }), [d, n, r, _]), P = be(() => {
+    const o = /* @__PURE__ */ new Set();
+    return n.forEach((T) => {
+      var E;
+      const C = (E = T.props) == null ? void 0 : E.displayLogic;
+      if (!C || C.length === 0) return void o.add(T.name);
+      ze({ displayLogic: C, allResponses: R, cards: v, surveyVisitorAttributes: l ?? {} }) && o.add(T.name);
+    }), o;
+  }, [n, R, l, v]), U = (({ isPreview: o, cards: T, displayedCardNames: C }) => {
+    var Z;
+    if (!o || C.size > 0) return !1;
+    const E = T.filter((K) => !st.has(K.type));
+    if (E.length !== 1) return !1;
+    const Q = (Z = E[0].props) == null ? void 0 : Z.displayLogic;
+    return !!(Q != null && Q.length);
+  })({ isPreview: !!S, cards: n, displayedCardNames: P });
+  te(() => {
+    U && requestAnimationFrame(() => {
+      y();
+    });
+  }, [U, y]), te(() => {
+    n.some((o) => {
+      if (o.type === "aidynamicstandalone" && o.props && P.has(o.name)) {
+        if (o.props.loading === Me.inFlight) return !0;
+        if (o.props.loading === void 0) return m({ questionId: o.name }), !0;
+      }
+      return !1;
+    });
+  }, [n, m, P]);
+  const f = ie(null);
+  te(() => {
+    const o = P, T = f.current;
+    if (T !== null) for (const C of T) o.has(C) || (a((E) => {
+      const Q = { ...E };
+      return delete Q[C], Q;
+    }), h((E) => {
+      const Q = { ...E };
+      return delete Q[C], Q;
+    }));
+    f.current = new Set(o);
+  }, [P]);
+  const k = ie(null), q = ie(!1), M = ie(null), $ = _e((o) => {
+    var Q, Z;
+    q.current = !0;
+    const T = n.findIndex((K) => K.name === o);
+    if (!u || o === null || T === -1) return void (q.current = !1);
+    const C = (Q = k.current) == null ? void 0 : Q.querySelectorAll(".ul-card-scroll-wrapper")[T], E = (Z = k.current) == null ? void 0 : Z.closest(".ul-card-main-content");
+    if (C && E) {
+      if (C && E) {
+        const K = C.getBoundingClientRect(), me = E.getBoundingClientRect(), ye = K.top - me.top + E.scrollTop, w = ye + K.height / 2, H = window.innerHeight - 157;
+        let O;
+        K.height >= H ? O = ye : O = w - E.clientHeight / 2;
+        const D = E.clientHeight, W = E.scrollHeight - D, ae = Math.max(0, Math.min(O, W));
+        E.scrollTo({ top: ae, behavior: "smooth" }), setTimeout(() => {
+          q.current = !1;
+        }, 500);
+      }
+    } else q.current = !1;
+  }, [u, n]);
+  function I(o, T) {
+    return o.filter((C) => P.has(C.name)).map((C) => {
+      const E = T[C.name], Q = F.find((Z) => Z.name === C.name);
+      return { ...E, questionText: Q ? Ae(Q) : void 0 };
+    });
+  }
+  te(() => {
+    b !== null && n.findIndex((o) => o.name === b) !== -1 || i(n[0].name);
+  }, [n, b, i]);
+  const B = (o) => {
+    if (!u) return;
+    let T = n.findIndex((C) => C.name === o) + 1;
+    for (; T < n.length && !P.has(n[T].name); ) T++;
+    T < n.length ? i(n[T].name) : i(o);
+  };
+  te(() => {
+    u && b !== null && (M.current !== b ? $(b) : M.current = null);
+  }, [b, u, $]);
+  const L = _e(() => {
+    var me, ye;
+    if (q.current) return;
+    const o = (me = k.current) == null ? void 0 : me.closest(".ul-card-main-content");
+    if (!o) return;
+    const T = (ye = k.current) == null ? void 0 : ye.querySelectorAll(".ul-card-scroll-wrapper");
+    if (!T || T.length === 0) return;
+    const C = o.getBoundingClientRect(), E = C.top + C.height / 2;
+    let Q = 0, Z = 1 / 0;
+    T.forEach((w, H) => {
+      const O = w.getBoundingClientRect(), D = O.top + O.height / 2, W = Math.abs(E - D);
+      W < Z && (Z = W, Q = H);
+    });
+    const K = n[Q];
+    M.current = K.name, i(K.name);
+  }, [n, i]);
+  te(() => {
+    var T;
+    if (!u) return;
+    const o = ((T = k.current) == null ? void 0 : T.closest(".ul-card__container")) || null;
+    return o && o.addEventListener("scroll", L, { passive: !0 }), () => {
+      o && o.removeEventListener("scroll", L);
+    };
+  }, [L, u]);
+  const V = be(() => n.every((o) => {
+    var T;
+    return !P.has(o.name) || !(!(o != null && o.props) || !("properties" in o.props) || ((T = o.props.properties) == null ? void 0 : T.required) !== !1) || p[o.name];
+  }), [p, n, P]), x = async (o, T, C) => {
+    return h((Q) => ({ ...Q, [o]: C })), await (E = (Q) => ({ ...Q, [o]: T }), new Promise((Q) => {
+      a((Z) => {
+        const K = E(Z);
+        return Q(K), K;
+      });
+    }));
+    var E;
+  };
+  te(() => {
+    var E;
+    if (!u) return;
+    const o = t.current, T = (E = n == null ? void 0 : n[0]) == null ? void 0 : E.groupId;
+    t.current = T;
+    const C = {};
+    if (n.forEach((Q) => {
+      var Z, K;
+      yr(Q) && (Q.props.properties.required || (C[Q.name] = { value: ((Z = r[Q.name]) == null ? void 0 : Z.value) ?? null, secondaryValue: ((K = r[Q.name]) == null ? void 0 : K.secondaryValue) ?? null, questionId: Q.name, type: Q.type }));
+    }), o == null || o !== T) a(C), h({});
+    else {
+      a((Z) => ({ ...Z, ...C }));
+      const Q = n.reduce((Z, K) => {
+        var me;
+        return K.type === "aidynamicfollowup" && ((me = K.props) == null ? void 0 : me.loading) === null && (Z[K.name] = !0), Z;
+      }, {});
+      h((Z) => ({ ...Z, ...Q }));
+    }
+  }, [n, u]);
+  const A = async (o, T) => {
+    const C = F.find((E) => E.name === o.questionId);
+    if (u) {
+      const E = await x(o.questionId, o, T), Q = z(o.type), Z = ee(o.type);
+      if (Q && (C != null && C.groupId && Le({ displayCard: C, response: o, createDynamicFollowupQuestion: g }), B(o.questionId)), Z && T) {
+        const K = I(n, E);
+        s(K);
+      }
+    } else {
+      const E = { ...o, questionText: C ? Ae(C) : void 0 };
+      Le({ displayCard: C, response: o, createDynamicFollowupQuestion: g }), s([E]);
+    }
+  }, z = (o) => (/* @__PURE__ */ new Set(["nps", "likert", "multiplechoice"])).has(o), ee = (o) => (/* @__PURE__ */ new Set(["videovoice", "consentlegal", "texturlprompt", "maxdiff"])).has(o), G = ((de = n[0]) == null ? void 0 : de.type) === "thanks";
+  return u ? e("div", { className: "ul-card-list-container--longform", "data-testid": "ui-container", ref: k, children: U ? e("div", { className: "ul-display-logic-preview-message", "data-testid": "display-logic-preview-message", children: He }) : e(Yr, { value: c, children: [F.map((o, T) => e(Ve, { allResponsesArray: R, cardInstance: o, moveToNextQuestion: B, showIndividualSubmit: n.length > 1 && T < n.length - 1, submitQuestion: A, updateCardValues: x }, (o == null ? void 0 : o.name) || T)), !G && e(nt, { isSubmitDisabled: !V, onSubmit: function() {
+    const o = I(n, r);
+    if ((F == null ? void 0 : F.length) === 1 && (o == null ? void 0 : o.length) === 1) {
+      const T = F[0], C = o[0];
+      Le({ displayCard: T, response: C, createDynamicFollowupQuestion: g });
+    }
+    s(o);
+  } })] }) }) : e(Se, { children: [e("div", { "data-testid": "ui-container", style: { display: "none" } }), U ? e("div", { className: "ul-display-logic-preview-message", "data-testid": "display-logic-preview-message", children: He }) : F.map((o, T) => e(Ve, { allResponsesArray: R, cardInstance: o, moveToNextQuestion: B, showIndividualSubmit: !1, submitQuestion: A, updateCardValues: x }, (o == null ? void 0 : o.name) || T))] });
+};
+export {
+  ot as PageCard
+};