@sprig-technologies/sprig-browser/dist/index-3sluQdVW.js

npm package for the sprig web sdk

import { a as J, h as K, u as e, c as G, f as Be, b as ie, F as Se, p as ee, g as xe, e as ye, _ as se, T as Te, A as cr, s as ur, q as pr, M as qe, D as Ee, j as mr, P as gr, r as hr, v as vr, x as pe, z as Ke, B as Xe, C as br, n as yr, k as fr, l as Sr, m as xr, E as Ir, G as kr, t as Re, o as Ve } from "./view-CvoT_Cd7.js";
import { t as de } from "./metricsReporter-CVAZgxNJ.js";
import { b as Me, D as Je, g as er, A as Tr } from "./core-BtQuNcD-.js";
import { b as le, a as oe, H as _e, M as be, Q as ve, O as Ne, B as re, L as we, S as wr, u as _r, g as Nr, p as Cr, v as qr, R as ae, c as Lr, s as Pr, d as Dr } from "./videoPlayer-DGWjJmY2.js";
import { d as Rr } from "./debounce-CMb8f7wh.js";
const Mr = ({ className: n, message: i, next: c, properties: r, questionId: t, type: s }) => {
  const { useMobileStyling: m, border: v, isLongFormSurvey: d, focusedQuestionId: b, useNewSurveyUI: a } = J((S) => {
    var U;
    return { useMobileStyling: S.useMobileStyling, border: S.border, isLongFormSurvey: de(S.studyType), focusedQuestionId: S.focusedQuestionId, useNewSurveyUI: !!((U = S.experimentFlags) != null && U["sdk-new-survey-ui"]) };
  }), [h, p] = K(!1), [k, u] = K(""), [f, l] = K(!1), T = d && b === t, w = r == null ? void 0 : r.collectName, C = (r == null ? void 0 : r.nameLabelText) || "Full Name", P = (r == null ? void 0 : r.consentText) || "I agree to the stated conditions", D = (r == null ? void 0 : r.submitButtonText) || "Submit", _ = !!k.trim(), R = h && (!w || _), j = (S, U = !1) => {
    S.preventDefault(), S.stopPropagation();
    let q = null;
    if (!U) {
      if (!R) return void l(!0);
      q = { submitted: !0 }, w && (q.name = k);
    }
    c({ value: q, questionId: t, type: s }, R);
  };
  return e("div", { className: G(n, d && !T && "ul-card--unfocused", "ul-card__consent-legal", "fade-in-transition"), children: [e(le, { isRequired: d && (r == null ? void 0 : r.required), message: i, properties: { image: r.image, questionHtml: r.questionHtml, captionHtml: a ? r.richTextBody : void 0, captionText: a ? r.body : void 0 } }), !a && (r != null && r.richTextBody) ? e(oe, { children: e(_e, { className: "ul-rich-text-body", html: r.richTextBody, id: "ul-card__consent-legal-body-container" }) }) : null, e(be, { embeddedType: "pdf", properties: r, children: e(ve, { children: [e("div", { className: "sprig-stretch", children: [e(Ne, { allowTextEntry: !1, border: v, error: f && !h, id: "consent", isRadio: !1, isSelected: h, label: P, onUserInputChanged: ({ selected: S }) => {
    S !== h && p(!h);
  }, useMobileStyling: m }), w && e("input", { "aria-label": C, "aria-placeholder": C, className: G(ie("ul-consent-legal__name-input", m)), "data-gramm": "false", maxLength: 250, name: "name", onBlur: (S) => {
    S.currentTarget.style.borderColor = f && !_ ? Me : Je;
  }, onFocus: (S) => {
    S.currentTarget.style.borderColor = f && !_ ? Me : v;
  }, onInput: (S) => {
    S.preventDefault(), S.stopPropagation(), u(S.currentTarget.value);
  }, placeholder: C, style: f && !_ ? { borderColor: Me } : {}, tabIndex: 0, value: k })] }), e("div", { className: "ul-card__button-wrapper ul-card-vertical__button-wrapper", children: [e(re, { className: R ? "" : "sprig-button-disabled", onClick: j, children: D }), r.required === !1 && !d && e("button", { className: "ul-card-skip__button", onClick: (S) => j(S, !0), children: Be(r) })] })] }) })] }, t);
}, ke = (n) => (i) => {
  i.pointerType !== "touch" && n();
}, Ur = ({ activeValue: n, border: i, icon: c, isPressed: r, onSubmit: t, range: s, scaleLabelType: m, selectedValue: v, setSelectedValue: d, setActiveValue: b, setIsPressed: a, useMobileStyling: h, value: p, viewDocument: k }) => {
  const { isLongFormSurvey: u, enableCspTrustedTypes: f } = J((S) => ({ isLongFormSurvey: de(S.studyType), enableCspTrustedTypes: S.enableCspTrustedTypes })), l = `option-${p}`, T = m === "number", w = m === "star", C = m === "smiley", P = T && p === n || p === v, [D, _] = (() => {
    const S = w && v !== null && p <= v;
    return w && p <= n || C && p === n || S || p === n || p === v ? [i, r || S || p === v ? 1 : 0.3] : ["", 1];
  })(), R = Se(() => {
    const S = v === p, U = { borderColor: P && !h || S ? D : "", fillOpacity: P ? "" : _, zIndex: P ? 3 : "auto", color: S ? "#fff" : "" };
    return T ? { ...U, backgroundColor: S ? D : "" } : { ...U, color: w || C || S ? D : "" };
  }, [P, D, _, v, p, T, w, C, h]), j = Se(() => er((({ icon: S, scaleLabelType: U, value: q, selectedValue: A }) => {
    if (U === "smiley" && q === A) {
      let I = 0;
      return S.replace(/black/g, () => ++I == 1 ? "black" : "white");
    }
    return S;
  })({ icon: c, scaleLabelType: m, value: p, selectedValue: v }), f), [f, c, m, v, p]);
  return e("button", { "aria-label": T ? void 0 : String(p), className: (() => {
    switch (m) {
      case "star":
        return G(ie("likert-star", h), ie(`likert-star-${p}`, h));
      case "smiley":
        return G(ie("likert-smiley", h), ie(`likert-smiley-${p}`, h));
      default:
        return p === s ? G(ie("likert-number", h), ie(`likert-number-${p}`, h), ie("likert-last-option", h)) : G(ie("likert-number", h), ie(`likert-number-${p}`, h));
    }
  })(), dangerouslySetInnerHTML: { __html: j }, id: l, onClick: (S) => {
    u && (S.preventDefault(), S.stopPropagation(), d(p)), t();
  }, onKeyDown: (S) => {
    var A, I;
    const U = k.querySelectorAll(`.likert-${m ?? "number"}`), q = p - 1;
    S.key === "ArrowRight" ? (A = U[q + 1]) == null || A.focus() : S.key === "ArrowLeft" ? (I = U[q - 1]) == null || I.focus() : S.key !== "Enter" && S.key !== " " || (u && (S.preventDefault(), S.stopPropagation(), d(p)), t());
  }, onPointerCancel: ke(() => a(!1)), onPointerDown: ke(() => {
    a(!0), b(p);
  }), onPointerEnter: ke(() => b(p)), onPointerLeave: ke(() => {
    b(-1), a(!1);
  }), onPointerUp: ke(() => a(!1)), style: R, tabIndex: 0 });
}, Er = ({ className: n, labels: i, message: c, next: r, properties: t, questionId: s, type: m }) => {
  const { border: v, useMobileStyling: d, viewDocument: b, isLongFormSurvey: a, focusedQuestionId: h, useNewSurveyUI: p } = J((I) => {
    var M;
    return { border: I.border, useMobileStyling: I.useMobileStyling, viewDocument: I.viewDocument, isLongFormSurvey: de(I.studyType), focusedQuestionId: I.focusedQuestionId, useNewSurveyUI: !!((M = I.experimentFlags) != null && M["sdk-new-survey-ui"]) };
  }), [k, u] = K(-1), [f, l] = K(!1), [T, w] = K(null);
  ee(() => {
    u(-1), l(!1), w(null);
  }, [s]);
  const C = a && h === s, P = i && i.left, D = i && i.right;
  let _;
  const { range: R, scaleLabelType: j, ratingIcons: S } = t;
  R && (_ = Number(R));
  const U = _ || 5, q = (I) => {
    var M, g;
    switch (j) {
      case "star":
        return (M = S[0]) == null ? void 0 : M.svg;
      case "smiley":
        return (g = S[I]) == null ? void 0 : g.svg;
      default:
        return String(I + 1);
    }
  }, A = e(xe, { children: [e("div", { "aria-label": `Rating (1 - ${U})`, className: "ul-card--likert__numbers", role: "radiogroup", children: [...Array(U)].map((I, M) => {
    const g = M + 1;
    return e(Ur, { activeValue: k, border: v, icon: q(M), isPressed: f, onSubmit: () => r({ value: g, questionId: s, type: m }, !0), range: U, scaleLabelType: j, selectedValue: T, setActiveValue: u, setIsPressed: l, setSelectedValue: w, useMobileStyling: d, value: g, viewDocument: b }, M);
  }) }), e("div", { className: "ul-card--likert__labels", children: [e("span", { children: P }), e("span", { children: D })] })] });
  return e("form", { className: G(n, "ul-card--likert", "fade-in-transition", a && !C && "ul-card--unfocused"), children: [e(le, { isRequired: a && (t == null ? void 0 : t.required), message: c, properties: t }), e(be, { properties: t, children: e(xe, { children: [e(oe, { children: p ? e("div", { className: "ul-card--likert__scale", children: A }) : A }), !t.required && !a && e(ve, { children: e("div", { className: "ul-vertical-centered-container", children: e(re, { onClick: (I) => {
    I.preventDefault(), I.stopPropagation(), r({ value: null, questionId: s, type: m }, !0);
  }, children: ye(t) }) }) })] }) })] }, s);
}, Fr = ({ columns: n, onSelect: i, options: c, selectedOptions: r }) => {
  const t = se([]), { border: s, useMobileStyling: m, cards: v, index: d } = J((u) => ({ border: u.border, useMobileStyling: u.useMobileStyling, cards: u.cards, index: u.index })), b = c.findIndex((u) => r[u.id] === null), [a, h] = K(b), p = Te((u, f) => {
    var w;
    i(u, f);
    const l = a + 1, T = c[l];
    if (T && r[T.id] === null) {
      h(l);
      const C = v[d];
      (C == null ? void 0 : C.groupId) != null || ((w = t.current[l]) == null || w.scrollIntoView({ block: "nearest", behavior: "smooth" }));
    }
  }, [i, c, r, a, v, d]), k = Te((u, f) => {
    const l = a === u;
    return e(cr, { animate: !0, header: f.label, isOpen: l, onClick: () => {
      var T;
      return h(l && !((T = window.UserLeap) != null && T.isMobileSDK) ? -1 : u);
    }, ref: (T) => {
      T && (t.current[u] = T);
    }, showHeaderCheck: r[f.id] !== null, children: e("div", { style: { paddingTop: "12px" }, children: n.map((T) => e(Ne, { allowTextEntry: !1, ariaLabel: `${f.label}-${T.label}`, border: s, error: !1, id: `${f.id}-${T.value}`, isRadio: !0, isSelected: r[f.id] === T.value, label: T.label, onUserInputChanged: () => p(f.id, T.value), useMobileStyling: m }, T.label)) }) }, f.id);
  }, [s, n, a, p, r, m]);
  return e("div", { children: c.map((u, f) => k(f, u)) });
}, Qr = ({ columns: n, onSelect: i, options: c, selectedOptions: r }) => {
  const { border: t, useMobileStyling: s, isLongFormSurvey: m } = J((u) => ({ border: u.border, useMobileStyling: u.useMobileStyling, isLongFormSurvey: de(u.studyType) })), v = c.length, d = n.length, b = se(null), [a, h] = K(!1), [p, k] = K(!1);
  return ee(() => {
    if (m) return;
    const u = b.current, f = new ResizeObserver((l) => {
      window.requestAnimationFrame(() => {
        u && (h(Math.round(l[0].contentRect.width) < u.scrollWidth), k(Math.round(l[0].contentRect.width) < u.scrollWidth));
      });
    });
    return u && f.observe(u), () => {
      u && f.unobserve(u);
    };
  }, [m]), e("div", { className: "ul-card--matrix_question_container", children: [e("div", { className: G("ul-card--matrix_container", !m && a && "ul-matrix-scroll-gradient"), onScroll: m ? void 0 : () => {
    const u = b.current;
    u && h(u.clientWidth + Math.abs(u.scrollLeft) < u.scrollWidth);
  }, ref: b, children: e("div", { className: G(m && "ul-card--matrix_grid_longform", "ul-card--matrix_grid"), style: `--numColumns: ${d}; --numRows: ${v + 1};`, children: [e("div", { className: "ul-matrix-header-row", children: [e("div", {}), " ", n.map((u) => e("div", { className: "ul-matrix-column-label", children: u.label }, u.label))] }), c.map((u) => e("div", { className: "ul-matrix-row", children: [e("div", { "aria-label": u.label, className: "ul-matrix-row-label", children: u.label }), e("div", { className: "ul-matrix-row-options", role: "radiogroup", children: n.map((f, l) => e("div", { className: G("ul-matrix-option-wrapper", l === d - 1 && "ul-matrix-last-option"), children: e(Ne, { allowTextEntry: !1, ariaLabel: `${u.label}-${f.label}`, border: t, choiceStyle: { background: "transparent", border: "none", marginBottom: "0", padding: "0" }, error: !1, id: `${u.id}-${f.value}`, isRadio: !0, isSelected: r[u.id] === f.value, onUserInputChanged: () => i(u.id, f.value), useMobileStyling: s }) }, f.value)) })] }, u.label))] }) }), !m && (a || p) && e("button", { className: p && !a ? "ul-matrix-scroll-arrow left" : "ul-matrix-scroll-arrow", onClick: p && !a ? (u) => {
    u.preventDefault();
    const f = b.current;
    if (f) {
      const l = getComputedStyle(f).direction === "rtl";
      f.scrollTo({ left: l ? f.scrollWidth - f.clientWidth : 0, behavior: "smooth" });
    }
  } : (u) => {
    u.preventDefault();
    const f = b.current;
    if (f) {
      const l = getComputedStyle(f).direction === "rtl";
      f.scrollTo({ left: l ? f.clientWidth - f.scrollWidth : f.scrollWidth, behavior: "smooth" });
    }
  }, children: e(p && !a ? Ar : Br, {}) })] });
}, Ar = () => 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" }) }), Br = () => 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" }) }), Or = ({ className: n, message: i, next: c, options: r, properties: t, questionId: s, type: m, showIndividualSubmit: v = !1, onSubmitButtonClick: d }) => {
  const { useMobileStyling: b, isLongFormSurvey: a, focusedQuestionId: h, setFocusedQuestionId: p, update: k } = J((g) => ({ useMobileStyling: g.useMobileStyling, isLongFormSurvey: de(g.studyType), focusedQuestionId: g.focusedQuestionId, setFocusedQuestionId: g.setFocusedQuestionId, update: g.update })), u = t.matrixColumn, f = t.required, l = a && h === s, T = (g) => Object.values(g).every((O) => O == null), w = (g) => f && T(g), C = (g) => {
    if (g.preventDefault(), g.stopPropagation(), c({ value: D, questionId: s, type: m }, !0), d) {
      const O = !T(D);
      d(O);
    }
  }, P = r.reduce((g, O) => (g[O.id] = null, g), {}), [D, _] = K(P), [R, j] = K(window.innerWidth), S = (g, O) => {
    a && c({ value: { ...D, [g]: O }, questionId: s, type: m }, !w({ ...D, [g]: O })), _((x) => ({ ...x, [g]: O }));
  }, U = t.displayMatrixAsAccordion || b, q = a && !U && ur(u.length, R), A = U || q, I = a && !A, M = I && pr(u.length, R);
  return ee(() => {
    if (!a) return;
    const g = Rr(() => j(window.innerWidth), 100);
    return window.addEventListener("resize", g), k(), () => window.removeEventListener("resize", g);
  }, [a, M, q, R, k]), e("form", { className: G(n, !a && "ul-card__matrix", I && "ul-card--matrix-expandable", M && "ul-card--matrix-expandable-fill", "fade-in-transition", a && !l && "ul-card--unfocused"), id: "text-form", onClick: () => {
    l && p(s);
  }, onSubmit: C, children: [e(le, { isRequired: a && (t == null ? void 0 : t.required), message: i, properties: t }), e(be, { properties: t, children: [e(oe, { children: [e(A ? Fr : Qr, { columns: u, onSelect: S, options: r, selectedOptions: D }), v && e(we, { handleSubmit: C, isSubmitDisabled: w(D) })] }), !a && e(ve, { children: e("div", { className: "ul-card__button-wrapper", children: e(re, { disabled: w(D), children: ye(t) }) }) })] })] }, s);
}, rr = ({ className: n, message: i, onSubmit: c, options: r = [], properties: t, questionId: s, type: m, showIndividualSubmit: v = !1, onSubmitButtonClick: d }) => {
  const { border: b, useMobileStyling: a, isLongFormSurvey: h, focusedQuestionId: p, setFocusedQuestionId: k } = J((x) => ({ border: x.border, useMobileStyling: x.useMobileStyling, isLongFormSurvey: de(x.studyType), focusedQuestionId: x.focusedQuestionId, setFocusedQuestionId: x.setFocusedQuestionId })), u = h && p === s, f = r.reduce((x, B) => (x[B.id] = { isSelected: !1 }, x), {}), [l, T] = K(f), w = m === "multiplechoice", C = t.required, P = r.find((x) => {
    var B;
    return (B = x.optionProperties) == null ? void 0 : B.noneOfTheAbove;
  }), D = (x) => Object.entries(x).some(([B, E]) => {
    var me;
    const X = r.find((ce) => `${ce.id}` === B), z = E.userText === void 0 || E.userText.trim() === "";
    return ((me = X == null ? void 0 : X.optionProperties) == null ? void 0 : me.allowsTextEntry) && z && E.isSelected;
  }), _ = (x) => Object.values(x).filter((B) => B.isSelected).length, R = (x) => {
    const { minSelect: B = 0, maxSelect: E = 1 / 0, maxSelectMode: X } = t, z = _(x);
    switch (X) {
      case qe.Maximum:
        return z <= E;
      case qe.Range:
        return z === 0 || z >= B;
      default:
        return !0;
    }
  }, j = t.minSelect && t.minSelect > 0 && t.maxSelectMode === qe.Range && _(l) < t.minSelect && (C || _(l) > 0), S = (x) => D(x) || C && !_(x) || !R(x), U = (x) => R(x) && !D(x) && _(x) > 0, q = Object.entries(l).some(([x, B]) => {
    var E, X;
    return B.isSelected && ((X = (E = r.find((z) => `${z.id}` === x)) == null ? void 0 : E.optionProperties) == null ? void 0 : X.allowsTextEntry);
  }), A = v && (!w || q), I = (x) => {
    O(x.id, x.selected, x.userText, x.noneOfTheAbove), x.selected && h && !w && !u && k(s);
  }, M = (x) => {
    var B;
    return (t == null ? void 0 : t.maxSelectMode) !== qe.Unlimited && _(l) === (t == null ? void 0 : t.maxSelect) && !((B = l[x]) != null && B.isSelected);
  }, g = (x) => {
    if (x.preventDefault(), x.stopPropagation(), c(l, !0), d) {
      const B = U(l);
      d(B);
    }
  }, O = (x, B, E, X) => {
    const z = Object.assign({}, l);
    if ((w || X) && B) for (const ne of Object.values(z)) ne.isSelected = !1, delete ne.userText;
    else P && !X && l[P.id].isSelected && (z[P.id].isSelected = !1);
    z[x] = { isSelected: B, userText: E };
    const me = w && Object.entries(z).some(([ne, ge]) => {
      var fe, o;
      return ge.isSelected && ((o = (fe = r.find((N) => `${N.id}` === ne)) == null ? void 0 : fe.optionProperties) == null ? void 0 : o.allowsTextEntry);
    }), ce = !S(z);
    if (h && (c(z, ce), w && !me && ce && d)) {
      const ne = U(z);
      d(ne);
    }
    T(z);
  };
  return e("form", { className: G(n, "ul-card--multiple", "fade-in-transition", h && !u && "ul-card--unfocused"), id: "text-form", onClick: m === "multipleselect" ? () => {
    h && p !== s && m === "multipleselect" && k(s);
  } : void 0, onSubmit: g, children: [e(le, { isRequired: h && (t == null ? void 0 : t.required), message: i, properties: t }), e(be, { properties: t, children: e(xe, { children: [e(oe, { children: [t.isDropdown ? e(wr, { disabledOptions: r.filter((x) => M(x.id)), dropdownFooter: j ? e("div", { className: "ul-card__min-select-counter", style: { marginLeft: "16px" }, children: [_(l), "/", t.minSelect] }) : void 0, isMultiSelect: !w, multiselectText: t.dropdownMultiselectedText ?? "choices selected", onChange: (x) => {
    const B = { ...l };
    for (const E of r) x.includes(E) ? B[E.id].isSelected = !0 : B[E.id].isSelected = !1;
    h && c(B, !S(B)), T(B);
  }, options: r, placeholderText: t.dropdownPlaceholderText ?? (w ? "Select choice" : "Select choice(s)"), value: r.filter((x) => l[x.id].isSelected) }) : e("div", { className: G(ie("ul-card__choices", a)), role: w ? "radiogroup" : "group", children: [r.map(({ id: x, label: B, value: E, optionProperties: X }) => {
    var ne, ge;
    const z = `${x}`, { allowsTextEntry: me, noneOfTheAbove: ce } = { allowsTextEntry: !1, noneOfTheAbove: !1, ...X };
    return e(Ne, { allowTextEntry: me, border: b, disabled: M(z), error: D({ [z]: l[z] }), id: z, isRadio: w, isSelected: !!((ne = l[z]) != null && ne.isSelected), label: B, noneOfTheAbove: ce, onUserInputChanged: I, promptText: (X == null ? void 0 : X.otherOptionPlaceholder) || "Please specify", text: (ge = l[x]) == null ? void 0 : ge.userText, useMobileStyling: a, value: E }, z);
  }), !!j && e("div", { className: "ul-card__min-select-counter", children: [_(l), "/", t.minSelect] })] }), A && e(we, { handleSubmit: g, isSubmitDisabled: S(l) })] }), !h && e(ve, { children: e("div", { className: "ul-card__button-wrapper", children: e(re, { disabled: S(l), onClick: g, children: ye(t) }) }) })] }) })] }, s);
}, $r = (n) => {
  const { questionId: i, type: c, next: r, options: t } = n, { setFocusedQuestionId: s } = J((m) => ({ setFocusedQuestionId: m.setFocusedQuestionId }));
  return e(rr, { ...n, onSubmit: (m, v) => {
    var k;
    const d = Object.entries(m).find(([, u]) => u.isSelected) || [void 0, void 0], [b, a] = d, h = t.find((u) => `${u.id}` === b);
    !((k = h == null ? void 0 : h.optionProperties) != null && k.allowsTextEntry) || a != null && a.userText && a.userText.trim() !== "" || s(i);
    const p = a != null && a.userText ? { [b]: { userText: a.userText } } : null;
    r({ value: h && b ? { [b]: h.value } : {}, secondaryValue: p, questionId: i, type: c }, v);
  } });
}, Vr = (n) => {
  const { questionId: i, type: c, next: r } = n;
  return e(rr, { ...n, onSubmit: (t, s) => {
    const m = Object.entries(t).reduce((d, [b, a]) => (d[b] = a.isSelected, d), {}), v = Object.entries(t).reduce((d, [b, a]) => {
      if (!a.userText) return d;
      const h = d || {};
      return h[b] = { userText: a.userText }, h;
    }, null);
    r({ value: m, secondaryValue: v, questionId: i, type: c }, s);
  } });
}, Hr = ({ className: n, labels: i, message: c, properties: r, next: t, questionId: s, type: m }) => {
  const [v, d] = K(null), { border: b, useMobileStyling: a, viewDocument: h, isLongFormSurvey: p, focusedQuestionId: k } = J((T) => ({ border: T.border, useMobileStyling: T.useMobileStyling, viewDocument: T.viewDocument, isLongFormSurvey: de(T.studyType), focusedQuestionId: T.focusedQuestionId })), u = p && k === s, f = i && i.left, l = i && i.right;
  return e("form", { className: G(n, "ul-card--nps", "fade-in-transition", p && !u && "ul-card--unfocused"), children: [e(le, { isRequired: p && (r == null ? void 0 : r.required), message: c, properties: r }), e(be, { properties: r, children: [e(oe, { children: [e("div", { className: "ul-card--nps__numbers", children: [...Array(11)].map((T, w) => e("button", { className: G(ie("nps-number", a), ie(`nps-number-${w}`, a)), id: `option-${w}`, onClick: (C) => {
    p && (C.preventDefault(), C.stopPropagation(), d(w)), t({ value: w, questionId: s, type: m }, !0);
  }, onKeyDown: (C) => {
    var D, _;
    const P = h.querySelectorAll("button.nps-number");
    C.key === "ArrowRight" ? (D = P[w + 1]) == null || D.focus() : C.key === "ArrowLeft" ? (_ = P[w - 1]) == null || _.focus() : C.key !== "Enter" && C.key !== " " || (p && (C.preventDefault(), C.stopPropagation(), d(w)), t({ value: w, questionId: s, type: m }, !0));
  }, onPointerDown: (C) => {
    C.currentTarget.style.zIndex = "2", C.currentTarget.style.borderColor = b;
  }, onPointerLeave: (C) => {
    C.currentTarget.style.zIndex = "auto", C.currentTarget.style.borderColor = "";
  }, style: v === w ? { backgroundColor: b, color: "#fff" } : void 0, tabIndex: 0, children: w }, w)) }), e("div", { className: "ul-card--nps__labels", children: [e("span", { children: f }), e("span", { children: l })] })] }), !r.required && !p && e(ve, { children: e("div", { className: "ul-vertical-centered-container", children: e(re, { onClick: (T) => {
    T.preventDefault(), T.stopPropagation(), t({ value: null, questionId: s, type: m }, !0);
  }, children: ye(r) }) }) })] })] }, s);
}, Gr = (n) => {
  const { className: i, message: c, next: r, properties: t, questionId: s, type: m, showIndividualSubmit: v = !1, onSubmitButtonClick: d } = n, b = m === "aidynamicfollowup" || m === "aidynamicstandalone", a = b ? n.loading : void 0, { border: h, useMobileStyling: p, update: k, isLongFormSurvey: u, focusedQuestionId: f, setFocusedQuestionId: l, isPreview: T } = J((I) => ({ border: I.border, useMobileStyling: I.useMobileStyling, update: I.update, isLongFormSurvey: de(I.studyType), focusedQuestionId: I.focusedQuestionId, setFocusedQuestionId: I.setFocusedQuestionId, isPreview: I.isPreview })), [w, C] = K(""), P = se(null), D = u && f === s;
  ee(() => {
    var I, M;
    u && !T && (D ? (I = P.current) == null || I.focus() : (M = P.current) == null || M.blur());
  }, [u, D, T]);
  const _ = w.trim(), R = t.required === !0 && !_, j = _r(P, () => k()), S = (I) => {
    I.preventDefault(), I.stopPropagation();
    const M = _.length > 0, g = !t.required || M;
    r({ value: w, questionId: s, type: m }, g), d && d(M);
  }, U = t && t.openTextPlaceholder ? t.openTextPlaceholder : "";
  if ((a === Ee.failure || a === void 0) && b) return e(xe, {});
  const q = a === Ee.inFlight, A = q ? "Preparing your next question" : c;
  return e("form", { className: G(i, "ul-card-text", "fade-in-transition", u && !D && "ul-card--unfocused"), id: "text-form", onClick: () => {
    u && f !== s && l(s);
  }, children: [e(le, { isRequired: u && (t == null ? void 0 : t.required), message: A, properties: t }), e(be, { properties: t, children: e("div", { className: "ul-card-text", children: e(oe, { children: [e("div", { className: "ul-card-text__container", children: e("textarea", { "aria-describedby": "ul-caption", "aria-labelledby": "ul-question", "aria-multiline": "true", "aria-placeholder": U, className: G(q && "ul-card-text__input__loading", ie("ul-card-text__input", p)), "data-gramm": "false", disabled: q, maxLength: 5e3, name: "text", onBlur: (I) => {
    I.currentTarget.style.borderColor = Je;
  }, onChange: (I) => {
    const { value: M } = I.currentTarget;
    if (j(), I.preventDefault(), I.stopPropagation(), C(M), u) {
      const g = M.trim().length > 0;
      r({ value: M, questionId: s, type: m }, g);
    }
  }, onFocus: (I) => {
    I.currentTarget.style.borderColor = h, l(s);
  }, placeholder: U, ref: P, role: "textbox", tabIndex: 0 }) }), t.footerHtml && e(_e, { className: "footer", html: t.footerHtml }), v && e(we, { handleSubmit: S, isSubmitDisabled: R }), e(ve, { children: !u && e(re, { disabled: R || q, onClick: S, children: ye(t) }) })] }) }) })] }, s);
}, Fe = 1, tr = 2, nr = 3, Le = (n) => n.type === "av_permission", He = (n) => n.type === "screen_permission", ir = (n, i) => n === void 0 ? Fe : n ? ((c, r) => !(Le(r) ? r.permissionDescriptors : []).includes("camera") || c.getVideoTracks().length > 0)(n, i) ? nr : Fe : tr, Ge = { avStream: null, currentPage: null, mediaRecordingUids: null, nextQuestion: () => {
}, passthroughData: void 0, recordingMediaTypes: void 0, screenPermissionRequested: !1, type: void 0 }, he = mr((n) => ({ ...Ge, reset: () => {
  n(Ge);
}, updatePage: (i) => {
  n(i);
} }));
function Qe({ currentPage: n, pages: i }) {
  const { avStream: c, recordingMediaTypes: r, updatePage: t } = he.getState(), { recorderEventEmitter: s } = J.getState();
  s.emit("av.permission", { "permission.descriptors": n.permissionDescriptors, "stream.ready": (m, v) => {
    if (c === m) return;
    let d = n;
    if (m && !n.permissionDescriptors.includes("camera")) {
      const b = i.indexOf(n), a = v != null && v.active ? b + 2 : b + 1;
      v != null && v.active && r && s.emit("begin.recording", { "recording.media.types": r, "start.recording.callback": (h) => t({ mediaRecordingUids: h }) }), d = i[a];
    }
    t({ currentPage: d, avStream: m });
  } });
}
function Ae({ status: n }) {
  const { nextQuestion: i, passthroughData: c, mediaRecordingUids: r, reset: t } = he.getState(), { recorderEventEmitter: s, handleUploadUpdate: m, index: v } = J.getState(), d = { value: { taskStatus: n }, type: "recordedtask", questionId: (c == null ? void 0 : c.questionId) || 1 };
  c && s.emit("finish.task", { "begin.callback": (b) => {
    m({ mediaRecordingUid: b, isSubmitted: !0, progressPct: 0, isComplete: !1 });
  }, "progress.callback": (b, a) => {
    m({ mediaRecordingUid: b, progressPct: a.detail, isSubmitted: !1, isComplete: !1 });
  }, "upload.callback": (b) => {
    b && m({ mediaRecordingUid: b, isComplete: !0, isSubmitted: !0, progressPct: 100 });
  }, "passthrough.data": c, "current.index": v, "task.response": d, "task.complete.callback": (b) => {
    d.value.taskDurationMillisecond = b, r && (d.value.mediaRecordingUids = r), t(), i(d);
  } });
}
function Oe({ pages: n, setIsRequestingPermission: i }) {
  const { recorderEventEmitter: c, eventEmitFn: r } = J.getState(), { updatePage: t, currentPage: s, recordingMediaTypes: m, screenPermissionRequested: v } = he.getState();
  if (!s) return;
  const d = n.indexOf(s);
  switch (s.type) {
    case "av_permission": {
      const b = v ? d + 2 : d + 1;
      return v && m && c.emit("begin.recording", { "recording.media.types": m, "start.recording.callback": (a) => {
        t({ mediaRecordingUids: a });
      } }), void t({ currentPage: n[b] });
    }
    case "screen_permission":
      return void c.emit("screen.permission", { "screen.permission.requested": i, "stream.ready.callback": (b, a) => {
        const h = a ? n[d + 1] : s;
        a && m && c.emit("begin.recording", { "recording.media.types": m, "start.recording.callback": (p) => {
          t({ captureStream: a, mediaRecordingUids: p });
        } }), t({ currentPage: h, screenPermissionRequested: !0, captureStream: a });
      } });
    case "start_task":
      return r("recorded.task.start"), c.emit("recorded.task.start"), c.emit("start.task"), void t({ currentPage: n[d + 1], screenPermissionRequested: !0 });
    case "complete_task":
      return;
  }
}
const sr = "ul-permission-graphics-container", ar = "ul-permission-body", lr = G(sr, "ul_recorded-task-inset-spacing"), Pe = G("ul-horizontal-button-container", "ul-horizontal-button-container-left"), or = ({ richTextBody: n }) => e(_e, { className: "ul-rich-text-body", html: n, id: "ul-task-detail-container" }), De = ({ required: n, skipButtonText: i, bottom: c = !1 }) => n ? null : e(re, { className: G(c && "ul-skip-button-below", "ul-button-inactive"), onClick: Ae.bind(null, { status: "abandoned" }), children: i || "Skip" }), $e = (n) => {
  const { avStream: i, captureStream: c, recordingMediaTypes: r, updatePage: t } = he.getState(), s = (r == null ? void 0 : r.includes("audio")) || (r == null ? void 0 : r.includes("video"));
  ee(() => {
    const m = setInterval(() => {
      s && i && !i.active ? t({ avStream: null, currentPage: n[0] }) : c && c.active || t({ captureStream: void 0, currentPage: n[s ? 1 : 0] });
    }, 1e3);
    return () => clearInterval(m);
  }, [i, c, s, n, r, t]);
}, jr = ({ content: n, pages: i, required: c }) => {
  const { buttonText: r, skipButtonText: t, taskDetail: s } = n;
  return $e(i), e("div", { className: "ul-task-page", children: [s && e(or, { richTextBody: s }), e("div", { className: Pe, children: [e(re, { onClick: Oe.bind(null, { pages: i }), children: r }), e(De, { required: c, skipButtonText: t })] })] }, "start-task");
}, zr = ({ content: n, pages: i, properties: c }) => {
  const { buttonText: r, skipButtonText: t } = n;
  return $e(i), e("div", { className: "ul-task-page", children: [n.taskDetail && e(or, { richTextBody: n.taskDetail }), e(be, { properties: c, children: e("div", { className: Pe, children: [e(re, { className: "ul-complete-task-button", onClick: Ae.bind(null, { status: "completed" }), children: r }), e(re, { className: G("ul-button-inactive"), onClick: Ae.bind(null, { status: "given.up" }), children: t })] }) })] }, "complete-task");
}, Zr = ({ content: n, pages: i, required: c }) => {
  const { buttonText: r, skipButtonText: t } = n, [s] = J((d) => [d.tabTitle]), [m, v] = K(!1);
  return e("div", { children: [e("div", { className: lr, children: [e("p", { style: { marginTop: "auto" }, children: n.selectTabText }), e("div", { className: "ul-select-tab-container", children: e("p", { className: ar, children: s }) })] }), e("div", { className: c ? "" : Pe, children: [e(re, { disabled: m, onClick: Oe.bind(null, { pages: i, setIsRequestingPermission: v }), children: r }), e(De, { required: c, skipButtonText: t })] })] });
}, Wr = ({ content: n }) => e(_e, { className: G(sr, "ul_permission_svg_container", "ul_recorded-task-inset-spacing", "ul-center-horizontally"), html: n.svg }, "ul-permission-request-graphic"), Yr = ({ content: n, pages: i, required: c }) => {
  const { permissionDeniedHeadline: r, permissionDeniedBody: t, skipButtonText: s, tryAgainButtonText: m } = n, v = Le(i[0]) ? i[0] : null;
  return ee(() => {
    const d = setInterval(() => {
      v !== null && Qe({ currentPage: v, pages: i });
    }, 1e3);
    return () => clearInterval(d);
  }, [v, i]), v ? e("div", { children: [e("div", { className: lr, children: e("p", { className: "ul-av-permission-denied-paragraph", children: [e("span", { className: "ul-av-permission-denied-headline", children: r }), e("span", { className: ar, children: t })] }) }), e("div", { className: Pe, children: [e(re, { onClick: Qe.bind(null, { currentPage: v, pages: i }), children: m }), e(De, { required: c, skipButtonText: s })] })] }) : null;
}, Kr = ({ stream: n }) => e("video", { autoPlay: !0, className: G("ul_recorded-task-inset-spacing"), id: "ul-record-task-video-preview", muted: !0, ref: (i) => {
  i && (i.srcObject = n || null);
} }), Xr = ({ content: n, pages: i, required: c }) => {
  const { skipButtonText: r } = n, { avStream: t } = he.getState();
  return $e(i), e("div", { children: [e(Kr, { stream: t }), e("div", { className: "ul-vertical-button-container-center", children: [e(re, { onClick: Oe.bind(null, { pages: i }), children: n.buttonText }), e(De, { bottom: !0, required: c, skipButtonText: r })] })] });
}, Jr = ({ properties: n }) => {
  const { pages: i, required: c } = n, { avStream: r, currentPage: t } = he.getState();
  if (t === void 0) return null;
  switch (t == null ? void 0 : t.type) {
    case "av_permission": {
      const s = ir(r, t);
      return s === Fe ? e(Wr, { content: t }) : e(s === tr ? Yr : Xr, { content: t, pages: i, required: c });
    }
    case "screen_permission":
      return e(Zr, { content: t, pages: i, required: c });
    case "start_task":
      return e(jr, { content: t, pages: i, required: c });
    case "complete_task":
      return e(zr, { content: t, pages: i, properties: n });
    default:
      return null;
  }
}, et = ({ className: n, properties: i, next: c, questionId: r }) => {
  const t = J(), { surveyId: s, responseGroupUid: m, userId: v, update: d } = t, b = he(), { screenPermissionRequested: a } = b, h = he((l) => l.avStream);
  let p = he((l) => l.currentPage);
  p || (p = function({ pages: l, userId: T, responseGroupUid: w, surveyId: C, questionId: P, next: D }) {
    const { updatePage: _ } = he.getState(), { eventEmitFn: R, recorderEventEmitter: j } = J.getState(), S = { questionId: P, surveyId: C, visitorId: T, responseGroupUid: w };
    let U = 0;
    j.emit("recorded.task.permission.screen"), R("recorded.task.permission.screen"), j.emit("permission.status", { "permission.status.callback": (A, I, M, g) => {
      const O = l[U], { type: x } = O, B = ["screen"];
      if (Le(O)) {
        const { permissionDescriptors: E } = O, X = E == null ? void 0 : E.includes("microphone"), z = E == null ? void 0 : E.includes("camera");
        X && B.push("audio"), z && B.push("video"), (A != null && A.active && !z || A != null && A.active && I) && U++;
      }
      He(l[U]) && M && (U++, j.emit("begin.recording", { "recording.media.types": B, "start.recording.callback": (E) => _({ mediaRecordingUids: E }) })), _({ currentPage: l[U], avStream: A, screenPermissionRequested: M, nextQuestion: D, type: x, passthroughData: S, recordingMediaTypes: B, captureStream: g });
    } });
    const q = l[U];
    return q.type === "av_permission" && Qe({ currentPage: q, pages: l }), q;
  }({ questionId: r, surveyId: s, next: (l) => {
    c(l, !0);
  }, pages: i.pages, responseGroupUid: m, userId: v }));
  let k = p.headline, u = p.captionText;
  const f = ir(h, p);
  return He(p) && a && (k = p.permissionDeniedHeadline, u = p.permissionDeniedCaptionText), Le(p) && f === nr && (k = p.permissionGrantedHeadline, u = p.permissionGrantedCaptionText), ee(() => {
    d();
  }, [d]), e("div", { className: G(n, "ul-center-horizontally", "fade-in-transition"), children: [e(le, { isRequired: i == null ? void 0 : i.required, message: k, properties: { captionText: u } }), e(oe, { children: e(Jr, { properties: i }) })] });
}, rt = ({ richTextBody: n, plaintextBody: i }) => n ? e(_e, { className: "ul-rich-text-body", html: n, id: "ul-card__text-url-body-container" }) : i ? e("div", { className: "ul-rich-text-body", id: "ul-card__text-url-body-container", children: (i ? i.split(/\n\s*\n/g) : []).map((c, r) => e("p", { children: c }, r)) }) : null, tt = ({ className: n, message: i, next: c, properties: r, questionId: t, type: s }) => {
  const { visitorAttributes: m, isLongFormSurvey: v, useNewSurveyUI: d } = J((p) => {
    var k;
    return { visitorAttributes: p.visitorAttributes, isLongFormSurvey: de(p.studyType), useNewSurveyUI: !!((k = p.experimentFlags) != null && k["sdk-new-survey-ui"]) };
  }), b = (p, k = !1) => {
    c({ value: k ? { skipped: !0 } : void 0, questionId: t, type: s }, !0);
  }, a = Nr(r && r.buttonUrl, m), h = !d && v && r.promptActionType === gr.NO_BUTTON;
  return e("div", { className: G(n, "ul-card__text-url-prompt", "fade-in-transition"), children: [e(le, { isRequired: v && (r == null ? void 0 : r.required), message: i, properties: { image: r.image, questionHtml: r.questionHtml, captionHtml: d ? r.richTextBody : void 0, captionText: d ? r.body : void 0 } }), !d && e(oe, { children: e(rt, { plaintextBody: r == null ? void 0 : r.body, richTextBody: r == null ? void 0 : r.richTextBody }) }), e(be, { properties: r, children: !h && e(ve, { children: e("div", { className: "ul-card-button-group", children: [e("a", { className: "ul-card-text__button ul-card__text-url-prompt-button", href: a, id: "ul-card-text__button", onClick: b, onKeyPress: (p) => {
    p.key !== "Enter" && p.key !== " " || c({ value: void 0, questionId: t, type: s }, !0);
  }, rel: "noreferrer", role: a ? "link" : "button", tabIndex: 0, target: "_blank", children: ye(r) }), r.required === !1 && e("button", { className: "ul-card-skip__button", onClick: (p) => b(0, !0), children: Be(r) })] }) }) })] }, t);
}, nt = ({ className: n, questionId: i }) => {
  const { border: c, destroy: r, endCard: t, forceBrandedLogo: s, quotaEndcardText: m, update: v } = J((h) => ({ border: h.border, destroy: h.destroy, endCard: h.endCard, forceBrandedLogo: h.forceBrandedLogo, quotaEndcardText: h.quotaEndcardText, update: h.update }));
  ee(() => {
    setTimeout(() => {
      r(Tr);
    }, s ? 4e3 : 2e3);
  }, [r, s]);
  const d = (m == null ? void 0 : m.subheader) ?? (t == null ? void 0 : t.subheader), b = d ? e("p", { className: "ul-caption", children: d }) : null, a = (m == null ? void 0 : m.headline) ?? (t == null ? void 0 : t.headline) ?? "";
  return ee(() => {
    v();
  }, [v]), e("div", { className: G(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(le, { message: a }), b] }) }) }, i);
}, Ie = "ul-card-video__player_recorder", je = "ul-video-btn", Ue = 0, ze = 1, it = ({ className: n, message: i, next: c, properties: r, questionId: t, type: s }) => {
  const { apiURL: m, envId: v, handleUploadUpdate: d, headers: b, responseGroupUid: a, surveyId: h, update: p, viewDocument: k, visitorId: u } = J((g) => ({ apiURL: g.apiURL, envId: g.envId, handleUploadUpdate: g.handleUploadUpdate, headers: g.headers, responseGroupUid: g.responseGroupUid, surveyId: g.surveyId, update: g.update, viewDocument: g.viewDocument, visitorId: g.userId })), [f, l] = K(!1), [T, w] = K(null), [C, P] = K(null), [D, _] = K(Ue), [R, j] = K(null), [S, U] = K(null), q = r && r.videoUrl, A = Te((g) => {
    g && j(g);
  }, [j]);
  ee(() => {
    const g = new ResizeObserver(() => {
      setTimeout(p, 0);
    });
    return S && g.observe(S), R && g.observe(R), () => {
      g.disconnect();
    };
  }, [p, S, R]);
  const I = (g, O) => {
    g === ae.UPLOAD_STARTED ? (w(O[ae.UPLOAD_ID]), P(O[ae.MEDIA_RECORDING_UID]), l(!0)) : g === ae.DELETE ? (w(null), P(null), l(!1)) : g === ae.UPLOAD_PROGRESS ? isNaN(O[ae.UPLOAD_PROGRESS_PCT]) ? d({ mediaRecordingUid: O[ae.MEDIA_RECORDING_UID], isComplete: !0 }) : d({ mediaRecordingUid: O[ae.MEDIA_RECORDING_UID], progressPct: O[ae.UPLOAD_PROGRESS_PCT] }) : g === ae.UPLOAD_FINISHED && d({ mediaRecordingUid: O[ae.MEDIA_RECORDING_UID], isComplete: !0 });
  }, M = (g) => {
    g.preventDefault(), g.stopPropagation(), document.getElementById(Ie) && Pr(Ie), T && C ? (d({ mediaRecordingUid: C, isSubmitted: !0 }), c({ value: { mediaRecordingUid: C }, questionId: t, type: s }, !0)) : c({ value: null, questionId: t, type: s }, !0);
  };
  return e("form", { className: G(n, "ul-card--video", "fade-in-transition"), id: "ul-video-interview-form", children: [e(le, { isRequired: r == null ? void 0 : r.required, message: i, properties: r }), e(oe, { children: [e("div", { id: "ul-question-player-container", ref: A, style: { display: D === Ue ? "" : "none" }, children: [e("div", { id: Ie, ref: (g) => {
    if (g && g.children.length === 0 && !r.hideRecordedPrompt) {
      U(g);
      const O = qr(Ie, { src: q, type: "application/x-mpegURL" }, void 0, r.mediaType === ae.MEDIA_TYPE_AUDIO, m, k);
      g.appendChild(O);
    }
  } }), e(be, { properties: r, children: e("button", { className: `${je} ul-record-response-btn`, onClick: (g) => {
    g.preventDefault(), g.stopPropagation(), document.getElementById(Ie) && Cr(Ie), _(ze);
  } }) })] }), e("div", { style: { display: D === ze ? "block" : "none" }, children: [e("button", { className: `${je} ul-back-question-btn`, onClick: (g) => {
    g.preventDefault(), g.stopPropagation(), _(Ue);
  }, style: { display: r.hideRecordedPrompt ? "none" : "block" } }), e("div", { id: "ul-recorder-player-container", ref: (g) => {
    if (g && g.children.length === 0) {
      U(g);
      const O = Lr(Ie, { surveyId: h, responseGroupUid: a, questionId: t, visitorId: u, envId: v }, m, I, void 0, { ...b, "x-ul-video-recorder-origin": "sdk" }, r.mediaType === ae.MEDIA_TYPE_AUDIO, k);
      g.appendChild(O);
    }
  } })] })] }), e(ve, { children: [e(re, { disabled: !f, onClick: M, children: ye(r) }), e("button", { className: "ul-card-text__button ul-button-inactive ul-card-skip__button", id: "ul-card-video__skip_button", onClick: M, style: { display: r.required ? "none" : "block", ...f ? { display: "none" } : {} }, children: Be(r) })] })] });
}, st = ({ className: n }) => {
  const { uploadProgress: i } = J((s) => ({ uploadProgress: s.uploadProgress }));
  let c, r;
  Object.values(i).filter((s) => s.isSubmitted).length > 1 ? (c = "Your responses are processing", r = "Please keep this tab open until your responses are fully processed.") : (c = "Your response is processing", r = "Please keep this tab open until your response is fully processed.");
  const t = Math.round(Math.min(99, ...Object.values(i).filter((s) => s.isSubmitted).map((s) => s.progressPct || 0)));
  return e("div", { className: G(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(le, { message: `${c} (${t}% complete)` }), e("p", { className: "ul-caption", children: r })] });
}, dr = hr(void 0), at = ({ value: n, children: i }) => e(dr.Provider, { value: n, children: i }), lt = ({ isRightLabel: n, isLeftLabel: i }) => n ? pe.RIGHT : i ? pe.LEFT : null, ot = "Best", dt = "Worst", ct = ({ enableCspTrustedTypes: n, ariaPressed: i, className: c, html: r, id: t, onClick: s }) => {
  const m = Se(() => er(r, n), [n, r]);
  return e("span", { "aria-pressed": i, className: c, dangerouslySetInnerHTML: { __html: m }, id: t, onClick: s, tabIndex: 0, type: "button" });
}, Ze = ({ border: n, choice: i, choiceStyle: c, enableCspTrustedTypes: r, id: t, isSelected: s, label: m, onSelect: v, smileySvg: d, useMobileStyling: b }) => {
  const a = i === pe.LEFT, h = a ? "good" : "bad";
  return e("div", { className: "ul-card-maxdiff__option-control " + (d ? "smiley" : ""), children: d ? e(ct, { ariaPressed: s, className: s ? `ul-card-maxdiff__option-btn ul-card-maxdiff__option-selected ${h}` : "ul-card-maxdiff__option-btn", enableCspTrustedTypes: r, html: d, id: `smiley-${h}-${t}`, onClick: v }) : e(Ne, { allowTextEntry: !1, ariaLabel: `${a ? "best" : "worst"}Label-${m}`, border: n, choiceStyle: c, error: !1, id: `${t}`, isRadio: !0, isSelected: s, onUserInputChanged: v, useMobileStyling: b }) });
}, ut = ({ id: n, label: i, isLeftLabel: c, isRightLabel: r, useNewSurveyUI: t, border: s, choiceStyle: m, enableCspTrustedTypes: v, goodSmileySvg: d, badSmileySvg: b, handleSelect: a, useMobileStyling: h }) => {
  const p = { border: s, choiceStyle: m, enableCspTrustedTypes: v, id: n, label: i, useMobileStyling: h }, k = e(xe, { children: [e(Ze, { ...p, choice: pe.LEFT, isSelected: c, onSelect: a(n, pe.LEFT), smileySvg: d }), e("div", { className: "ul-card-maxdiff__option-label", children: i }), e(Ze, { ...p, choice: pe.RIGHT, isSelected: r, onSelect: a(n, pe.RIGHT), smileySvg: b })] });
  return t ? e("div", { className: "ul-card-maxdiff__option-row", children: k }) : k;
}, pt = ({ className: n, labels: i, message: c, properties: r, options: t, questionId: s, type: m, next: v }) => {
  var R, j, S, U;
  const [d, b] = K(t.map((q, A) => ({ ...q, label: q.label === "" ? `Item ${A + 1}` : q.label, isRightLabel: !1, isLeftLabel: !1 }))), a = (() => {
    const q = vr(dr);
    if (q === void 0) throw new Error("usePreviousResponses must be used within a PreviousResponsesProvider");
    return q;
  })(), [h, p] = K(!1);
  ee(() => {
    const q = d.findIndex((E) => E.isRightLabel), A = d.findIndex((E) => E.isLeftLabel), I = q !== -1 && A !== -1;
    p(I);
    const M = !r.required || r.required && I, g = d.map((E) => ({ id: E.id, option: E.label, selected: lt(E) })), O = Math.floor(s), x = Object.keys(a).filter((E) => E.startsWith(O.toString())).map(Number).sort((E, X) => E - X).at(-1), B = [];
    if (typeof x == "number") {
      const E = a[x], X = JSON.parse(E);
      B.push(...X);
    }
    B.push(g), setTimeout(() => {
      v({ value: B, questionId: s, type: m }, M, I), p(!1);
    }, I ? 500 : 0);
  }, [d]);
  const { border: k, useMobileStyling: u, enableCspTrustedTypes: f, useNewSurveyUI: l } = J((q) => {
    var A;
    return { border: q.border, useMobileStyling: q.useMobileStyling, enableCspTrustedTypes: q.enableCspTrustedTypes, useNewSurveyUI: !!((A = q.experimentFlags) != null && A["sdk-new-survey-ui"]) };
  }), T = l ? { padding: "0", display: "flex", cursor: "pointer", width: "auto" } : { padding: "24px", display: "flex", cursor: "pointer", width: "auto" }, w = (R = r.ratingIcons) == null ? void 0 : R[0].svg, C = (j = r.ratingIcons) == null ? void 0 : j[1].svg, P = (i == null ? void 0 : i.left) || ((S = r == null ? void 0 : r.labels) == null ? void 0 : S.left) || ot, D = (i == null ? void 0 : i.right) || ((U = r == null ? void 0 : r.labels) == null ? void 0 : U.right) || dt, _ = { border: k, choiceStyle: T, enableCspTrustedTypes: f, goodSmileySvg: C, badSmileySvg: w, handleSelect: (q, A) => () => {
    h || b((I) => ((M, g, O) => M.map((x) => x.id === g ? { ...x, isRightLabel: O === pe.RIGHT, isLeftLabel: O === pe.LEFT } : O === pe.RIGHT && x.isRightLabel || O === pe.LEFT && x.isLeftLabel ? { ...x, isRightLabel: !1, isLeftLabel: !1 } : x))(I, q, A));
  }, useMobileStyling: u, useNewSurveyUI: l };
  return e("form", { className: G(n, "ul-card-maxdiff", "fade-in-transition"), children: [e(le, { isRequired: r == null ? void 0 : r.required, message: c, properties: r }), e(oe, { children: e("div", { className: "ul-card--maxdiff__question-inner-container", children: [l ? e("div", { className: "ul-card-maxdiff__labels-row", children: [e("div", { className: "ul-card-maxdiff__la