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

FSE UI components library

import { j as e } from "./index.es244.js";
import './styles/typography.css';import './components/ui/Feedback/Feedback.css';/* empty css            */
import { Rating as M } from "./index.es442.js";
import { Questions as y } from "./index.es443.js";
import { useState as o, useEffect as z } from "react";
import { CardComponent as B } from "./index.es444.js";
/* empty css            */
function U({
  question: f,
  rating: p,
  questions: t,
  onSend: u,
  buttons: w,
  maxCharactersMessage: x,
  successMessage: h,
  errorMessage: g,
  loadingMessage: j,
  isLoading: A = !1,
  hasError: v = !1,
  openAnswerPlaceholder: C
}) {
  const [r, Q] = o(() => p ?? 0), [i, c] = o([]), [l, b] = o(""), [d, k] = o(!1), [N, S] = o([]);
  z(() => {
    S((() => {
      const n = [];
      return r >= 3 ? (n[0] = t[0], n[1] = t[2]) : (n[0] = t[1], n[1] = t[2]), n;
    })()), c([]);
  }, [r, t]);
  const R = (s) => {
    Q(s);
  }, F = (s, n) => {
    c((a) => [...a.filter((H) => H.id !== s), {
      id: s,
      answer: [n]
      // Single answer for radio buttons
    }]);
  }, E = (s) => {
    b(s);
  }, O = () => {
    k(!0);
    const s = i.map((a) => a.answer.map((m) => m.answer)).flat();
    u({
      rating: r,
      closedAnswer: s,
      openAnswer: l
    });
  }, V = () => A ? j : v ? g : h;
  return /* @__PURE__ */ e.jsxs(B.Root, { children: [
    !d && /* @__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: f }),
        /* @__PURE__ */ e.jsx(M, { onClick: R, rating: r })
      ] }),
      r > 0 && /* @__PURE__ */ e.jsx("div", { className: "feedback-questions-container", children: /* @__PURE__ */ e.jsx(
        y,
        {
          onSend: O,
          questions: N,
          onChangeAnswer: F,
          values: i,
          openAnswer: l,
          handleOpenAnswer: E,
          buttons: w,
          maxCharactersMessage: x,
          openAnswerPlaceholder: C
        }
      ) })
    ] }),
    d && /* @__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 {
  U as Feedback
};
//# sourceMappingURL=index.es131.js.map