import { ClockIcon as d } from "./accelbyte-widgets387.mjs";
import { PurchaseHelper as f } from "./accelbyte-widgets211.mjs";
import { RegionDataItemHelper as E } from "./accelbyte-widgets388.mjs";
import h from "classnames";
import { formatDistanceToNow as g, parseISO as w } from "date-fns";
import e from "react";
import { Trans as l } from "react-i18next";
import "./accelbyte-widgets389.mjs";
class O extends e.Component {
  constructor(i) {
    super(i), this.toggleTooltip = (t) => {
      t.preventDefault(), this.setState((n) => ({
        isOpen: !n.isOpen
      }));
    }, this.closeTooltip = (t) => {
      t.preventDefault(), this.setState({ isOpen: !1 }), window.clearTimeout(this.state.timeoutState);
    }, this.closeTooltipOnMouseLeave = (t, n = 2e3) => {
      t.preventDefault();
      const a = window.setTimeout(() => this.closeTooltip(t), n);
      this.setState({ timeoutState: a });
    }, this.onMouseEnter = (t) => {
      t.preventDefault(), window.clearTimeout(this.state.timeoutState);
    }, this.state = {
      isOpen: !1,
      timeoutState: void 0
    };
  }
  render() {
    const { item: i, currencyMap: t, position: n, showDetail: a } = this.props, m = n || "bottom", { isOpen: p } = this.state, c = i && i.regionData;
    if (!c || !t)
      return null;
    const s = f.makePaymentOptionWithExpiryDiscount(c, t);
    return /* @__PURE__ */ e.createElement(e.Fragment, null, s[0] && s[0].regionData.discountExpireAt && /* @__PURE__ */ e.createElement("div", { className: "discountCountdownWidgetWrapper", onMouseLeave: this.closeTooltipOnMouseLeave, onMouseEnter: this.onMouseEnter }, /* @__PURE__ */ e.createElement("span", { className: "discountCountdownWidget", onClick: (o) => this.toggleTooltip(o) }, /* @__PURE__ */ e.createElement(d, { className: "clockIcon" }), a && /* @__PURE__ */ e.createElement(l, { i18nKey: "DiscountCountdown.end" }, "Discount will end in"), " ", u(s[0].regionData.discountExpireAt), " >"), /* @__PURE__ */ e.createElement(
      "div",
      {
        className: h("tooltipCountdownWidget", m, {
          open: p
        })
      },
      /* @__PURE__ */ e.createElement("div", { className: "tooltipTextWrapper" }, s.map((o) => /* @__PURE__ */ e.createElement("div", { key: o.currencySymbol, className: "tooltipText" }, /* @__PURE__ */ e.createElement("b", null, E.calculateDiscountPercentage(o.regionData), "%"), " ", /* @__PURE__ */ e.createElement(l, { i18nKey: "DiscountCountdown.for" }, "off for"), " ", /* @__PURE__ */ e.createElement("b", null, o.currencySymbol, " ", o.finalPrice), " ", /* @__PURE__ */ e.createElement(l, { i18nKey: "DiscountCountdown.expire" }, "will expire in"), " ", /* @__PURE__ */ e.createElement("b", null, u(o.regionData.discountExpireAt))))),
      /* @__PURE__ */ e.createElement("div", { className: "tooltipCloseButton", onClick: this.closeTooltip }, "×")
    )));
  }
}
function u(r) {
  return r ? g(w(r), { addSuffix: !0 }) : null;
}
export {
  O as DiscountCountdownWidget
};
