@anoki/fse-ui/dist/index.es132.js

FSE UI components library

import { j as e } from "./index.es278.js";
import './styles/typography.css';import './components/ui/Feedback/Feedback.css';/* empty css            */
import { Rating as y } from "./index.es440.js";
import { Questions as z } from "./index.es441.js";
import { useState as o, useEffect as B } from "react";
import { CardComponent as D } from "./index.es442.js";
/* empty css            */
function W({
  question: p,
  rating: u,
  questions: t,
  onSend: w,
  buttons: x,
  maxCharactersMessage: h,
  successMessage: g,
  errorMessage: j,
  loadingMessage: A,
  isLoading: v = !1,
  hasError: b = !1,
  openAnswerPlaceholder: k
}) {
  const [r, i] = o(() => u ?? 0), [c, l] = o([]), [d, C] = o(""), [m, Q] = o(!1), [N, S] = o([]);
  B(() => {
    S((() => {
      const n = [];
      return r >= 3 ? (n[0] = t[0], n[1] = t[2]) : (n[0] = t[1], n[1] = t[2]), n;
    })()), l([]);
  }, [r, t]);
  const F = (s) => {
    i(s);
  }, R = (s, n) => {
    l((a) => [...a.filter((M) => M.id !== s), {
      id: s,
      answer: [n]
      // Single answer for radio buttons
    }]);
  }, E = (s) => {
    C(s);
  }, O = () => {
    Q(!0);
    const s = c.map((a) => a.answer.map((f) => f.answer)).flat();
    w({
      rating: r,
      closedAnswer: s,
      openAnswer: d
    });
  }, V = () => v ? A : b ? j : g, H = () => {
    i(0);
  };
  return /* @__PURE__ */ e.jsxs(D.Root, { children: [
    !m && /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
      /* @__PURE__ */ e.jsxs("div", { className: "p-3 d-flex flex-column gap-3 align-items-start", children: [
        /* @__PURE__ */ e.jsx("p", { className: "fs-5 fw-semibold", children: p }),
        /* @__PURE__ */ e.jsx(y, { onClick: F, rating: r })
      ] }),
      r > 0 && /* @__PURE__ */ e.jsx("div", { className: "feedback-questions-container", children: /* @__PURE__ */ e.jsx(
        z,
        {
          onSend: O,
          questions: N,
          onChangeAnswer: R,
          values: c,
          openAnswer: d,
          handleOpenAnswer: E,
          resetFeedback: H,
          buttons: x,
          maxCharactersMessage: h,
          openAnswerPlaceholder: k
        }
      ) })
    ] }),
    m && /* @__PURE__ */ e.jsx("div", { className: "steppers-content p-4", "aria-live": "polite", children: /* @__PURE__ */ e.jsx("p", { className: "feedback-final-message fw-semibold fs-custom", children: V() }) })
  ] });
}
export {
  W as Feedback
};
//# sourceMappingURL=index.es132.js.map