"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const designSystem = require("@choiceform/design-system");
const iconsReact = require("@choiceform/icons-react");
const react = require("../../_vendor/@legendapp/state/react.cjs");
const React = require("react");
const index$1 = require("../../_vendor/usehooks-ts/dist-index.cjs");
const index = require("../../i18n/index.cjs");
const ratingStore = require("../../stores/rating-store.cjs");
const FeedbackDialog = react.observer(function FeedbackDialog2(props) {
  const { onSubmit } = props;
  const feedbackDialog = react.use$(ratingStore.ratingStore$.feedbackDialog);
  const rating = feedbackDialog.rating || "positive";
  const [reason, setReason] = React.useState("");
  const [additionalFeedback, setAdditionalFeedback] = React.useState("");
  const reasonsList = rating === "positive" ? index.t("dialog", "additional-feedback-positive-reasons") : index.t("dialog", "additional-feedback-negative-reasons");
  const reasons = reasonsList.split(",").map((s) => s.trim()).filter((s) => s.length > 0).map((s) => ({ value: s, label: s }));
  const icon = rating === "positive" ? /* @__PURE__ */ jsxRuntime.jsx(iconsReact.ThumbUp, {}) : /* @__PURE__ */ jsxRuntime.jsx(iconsReact.ThumbDown, {});
  const reasonTitle = index.t("dialog", "reason-title");
  const reasonPlaceholder = index.t("dialog", "reason-placeholder");
  const additionalFeedbackTitle = index.t("dialog", "additional-feedback-title");
  const additionalFeedbackPlaceholder = index.t("dialog", "additional-feedback-placeholder");
  const title = index.t("dialog", "title");
  const cancel = index.t("common", "cancel");
  const submit = index.t("common", "submit");
  const handleSubmit = index$1.useEventCallback(() => {
    onSubmit?.({
      rating,
      reason: reason || void 0,
      additionalFeedback: additionalFeedback.trim() || void 0
    });
    handleClose();
  });
  const handleClose = index$1.useEventCallback(() => {
    setReason("");
    setAdditionalFeedback("");
    ratingStore.ratingActions.closeFeedbackDialog();
  });
  if (!feedbackDialog.isOpen) return null;
  return /* @__PURE__ */ jsxRuntime.jsxs(
    designSystem.Dialog,
    {
      open: feedbackDialog.isOpen,
      onOpenChange: () => ratingStore.ratingActions.closeFeedbackDialog(),
      children: [
        /* @__PURE__ */ jsxRuntime.jsx(
          designSystem.Dialog.Header,
          {
            title: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1", children: [
              icon,
              /* @__PURE__ */ jsxRuntime.jsx("span", { children: title })
            ] }),
            onClose: handleClose
          }
        ),
        /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Content, { className: "w-md space-y-4 p-4", children: [
          /* @__PURE__ */ jsxRuntime.jsxs(
            designSystem.Modal.Select,
            {
              label: reasonTitle,
              value: reason,
              onChange: (value) => setReason(value),
              children: [
                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Select.Trigger, { children: /* @__PURE__ */ jsxRuntime.jsx(designSystem.Select.Value, { children: reasons.find((option) => option.value === reason)?.label || reasonPlaceholder }) }),
                /* @__PURE__ */ jsxRuntime.jsx(designSystem.Select.Content, { children: reasons.map((option) => /* @__PURE__ */ jsxRuntime.jsx(
                  designSystem.Select.Item,
                  {
                    value: option.value,
                    children: option.label
                  },
                  option.value
                )) })
              ]
            }
          ),
          /* @__PURE__ */ jsxRuntime.jsx(
            designSystem.Modal.Textarea,
            {
              label: additionalFeedbackTitle,
              value: additionalFeedback,
              onChange: (value) => setAdditionalFeedback(value),
              placeholder: additionalFeedbackPlaceholder
            }
          )
        ] }),
        /* @__PURE__ */ jsxRuntime.jsxs(designSystem.Dialog.Footer, { className: "flex justify-end gap-2", children: [
          /* @__PURE__ */ jsxRuntime.jsx(
            designSystem.Button,
            {
              variant: "secondary",
              onClick: handleClose,
              children: cancel
            }
          ),
          /* @__PURE__ */ jsxRuntime.jsx(
            designSystem.Button,
            {
              onClick: handleSubmit,
              disabled: !reason,
              children: submit
            }
          )
        ] })
      ]
    }
  );
});
exports.FeedbackDialog = FeedbackDialog;
//# sourceMappingURL=feedback-dialog.cjs.map
