"use client";
import { j as l } from "../../../../../node_modules/.pnpm/react@19.1.0/node_modules/react/jsx-runtime.mjs";
import { parseNumIntoReadableString as c, decimalUnits as r } from "../../../../../node_modules/.pnpm/@hyperplay_utils@0.3.18/node_modules/@hyperplay/utils/dist/index.es.mjs";
import t from "../../../../../node_modules/.pnpm/classnames@2.5.1/node_modules/classnames/index.mjs";
import "react";
import { ReactComponent as h } from "../../../../assets/images/LinkExternal.svg.mjs";
import d from "../../../Button/index.mjs";
import j from "../../../Loading/index.mjs";
import e from "./index.module.scss.mjs";
import { Tooltip as v } from "@mantine/core";
function B({
  reward: i,
  i18n: a = {
    claimsLeft: "Claims left",
    viewReward: "View Reward",
    claimed: "Claimed",
    claim: "Claim",
    claimNotAvailable: "This reward isn't available to claim right now."
  },
  className: u,
  onClaim: p,
  hideClaim: f,
  claimNotAvailable: C,
  ...x
}) {
  let n = null;
  if (i.numOfClaimsLeft) {
    const o = c({
      num: i.numOfClaimsLeft,
      units: r,
      minValue: "0",
      maxValue: "9999"
    }), N = Number(i.numOfClaimsLeft) === 0;
    n = /* @__PURE__ */ l.jsxs("div", { className: e.claimsContainer, children: [
      /* @__PURE__ */ l.jsx(
        "div",
        {
          className: t(
            e.dot,
            N ? e.redDot : e.greenDot
          )
        }
      ),
      /* @__PURE__ */ l.jsx(
        "div",
        {
          className: t("menu-item", e.claims),
          children: `${o} ${a.claimsLeft}`
        }
      )
    ] });
  }
  let m = null;
  i.numToClaim && (m = `+${c({
    num: i.numToClaim,
    units: r,
    minValue: "0",
    maxValue: "9999"
  })}`);
  let s = null;
  return C || i.isClaimed ? s = /* @__PURE__ */ l.jsx(
    v,
    {
      withArrow: !0,
      arrowSize: 12,
      label: a.claimNotAvailable,
      position: "bottom",
      classNames: { tooltip: t(e.tooltip, "caption") },
      children: /* @__PURE__ */ l.jsx(
        d,
        {
          disabled: !0,
          type: "secondaryGradient",
          size: "small",
          htmlType: "button",
          className: e.claimButton,
          children: a.claim
        }
      )
    }
  ) : s = /* @__PURE__ */ l.jsx(
    d,
    {
      disabled: i.claimPending,
      onClick: p,
      type: "secondaryGradient",
      size: "small",
      htmlType: "button",
      className: e.claimButton,
      children: i.claimPending ? /* @__PURE__ */ l.jsx(j, { className: e.spinner }) : a.claim
    }
  ), /* @__PURE__ */ l.jsxs(
    "div",
    {
      className: t(e.container, u),
      ...x,
      children: [
        /* @__PURE__ */ l.jsxs("div", { className: e.rewardImageContainer, children: [
          i.isClaimed ? /* @__PURE__ */ l.jsx("div", { className: e.isClaimed, children: a.claimed }) : null,
          i.marketplaceUrl ? /* @__PURE__ */ l.jsxs(
            "a",
            {
              href: i.marketplaceUrl,
              className: e.viewRewardContainer,
              rel: "nooepner noreferrer",
              target: "_blank",
              children: [
                /* @__PURE__ */ l.jsx(h, { className: e.linkExternalIcon }),
                a.viewReward
              ]
            }
          ) : null,
          /* @__PURE__ */ l.jsx("img", { src: i.imageUrl })
        ] }),
        /* @__PURE__ */ l.jsxs("div", { className: e.infoContainer, children: [
          /* @__PURE__ */ l.jsxs("div", { className: e.textContainer, children: [
            /* @__PURE__ */ l.jsx("div", { className: t("title-sm", e.title), children: m ? `${m} ${i.title}` : i.title }),
            n
          ] }),
          f ? null : s
        ] })
      ]
    },
    i.title
  );
}
export {
  B as Reward
};
//# sourceMappingURL=index.mjs.map
