"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const designSystem = require("@choiceform/design-system");
const React = require("react");
const index = require("../../../../i18n/index.cjs");
const MessageConfirmationTv = designSystem.tcv({
  slots: {
    root: "confirmation-message flex flex-col gap-2 rounded-lg border p-2",
    description: "mb-2",
    actions: "flex gap-4",
    responded: "text-secondary-foreground"
  }
});
const MessageConfirmation = React.memo(function MessageConfirmation2(props) {
  const { children, className, onConfirm } = props;
  const [responded, setResponded] = React.useState(false);
  const handleResponse = (confirmed) => {
    setResponded(true);
    onConfirm?.(confirmed);
  };
  const confirmationConfirm = index.t("common", "confirm");
  const confirmationCancel = index.t("common", "cancel");
  const confirmationResponded = index.t("response", "confirmation-responded");
  const tv = MessageConfirmationTv();
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: designSystem.tcx(tv.root(), className), children: [
    /* @__PURE__ */ jsxRuntime.jsx("div", { className: tv.description(), children }),
    !responded && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: tv.actions(), children: [
      /* @__PURE__ */ jsxRuntime.jsx(designSystem.Button, { onClick: () => handleResponse(true), children: confirmationConfirm }),
      /* @__PURE__ */ jsxRuntime.jsx(
        designSystem.Button,
        {
          variant: "secondary",
          onClick: () => handleResponse(false),
          children: confirmationCancel
        }
      )
    ] }),
    responded && /* @__PURE__ */ jsxRuntime.jsx("div", { className: tv.responded(), children: confirmationResponded })
  ] });
});
exports.MessageConfirmation = MessageConfirmation;
//# sourceMappingURL=message-confirmation.cjs.map
