@taskon/widget-react 0.0.1-beta.1

package/dist/chunks/LeaderboardWidget-CmYfDeHV.js

@@ -0,0 +1,1068 @@
+import { B as Button, T as Table, P as Pagination, _ as __variableDynamicImportRuntimeHelper, u as usePagination } from "./dynamic-import-helper-DxEFwm31.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState, useCallback, useEffect, useMemo } from "react";
+import { createLeaderboardApi, LeaderboardContentType, formatRankRange, RewardsDistributeType, formatRewardText, calculatePrizePool, RewardType, LeaderboardTableColumn, isAllTimeResponse, isCampaignResponse } from "@taskon/core";
+import { b as useTaskOnContext } from "./ThemeProvider-wnSXrNQb.js";
+import { D as Dialog, u as useResolvedWidgetConfig, W as WidgetShell } from "./WidgetShell-D_5OjvNZ.js";
+import { u as useWidgetLocale } from "./useWidgetLocale-JDelxtt8.js";
+import '../LeaderboardWidget.css';function useLeaderboard(options) {
+  const { client } = useTaskOnContext();
+  const [data, setData] = useState(null);
+  const [loading2, setLoading] = useState(false);
+  const [error2, setError] = useState(null);
+  const { tabConfig, page: page2, pageSize } = options;
+  const fetchData = useCallback(async () => {
+    if (!client) return;
+    setLoading(true);
+    setError(null);
+    try {
+      const api = createLeaderboardApi(client);
+      const pageParams = { page_no: page2, size: pageSize };
+      let result;
+      if (tabConfig.type === LeaderboardContentType.AllTime) {
+        result = await api.getAllTimeLeaderboard({
+          page: pageParams,
+          points_id: tabConfig.relatedId
+        });
+      } else {
+        const isIncentive = tabConfig.type === LeaderboardContentType.LeaderboardSprint;
+        result = await api.getCampaignLeaderboard({
+          campaign_id: tabConfig.relatedId,
+          page: pageParams,
+          incentive_campaign: isIncentive
+        });
+      }
+      setData(result);
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error("Unknown error"));
+    } finally {
+      setLoading(false);
+    }
+  }, [client, tabConfig, page2, pageSize]);
+  useEffect(() => {
+    fetchData();
+  }, [fetchData]);
+  const { total, totalPages } = useMemo(() => {
+    if (!data) return { total: 0, totalPages: 0 };
+    const totalCount = data.total;
+    return {
+      total: totalCount,
+      totalPages: Math.ceil(totalCount / pageSize)
+    };
+  }, [data, pageSize]);
+  return {
+    data,
+    loading: loading2,
+    error: error2,
+    total,
+    totalPages,
+    refresh: fetchData
+  };
+}
+function useCampaignReward(campaignId) {
+  const { client } = useTaskOnContext();
+  const [campaignInfo, setCampaignInfo] = useState(null);
+  const [loading2, setLoading] = useState(false);
+  const [error2, setError] = useState(null);
+  const fetchCampaignInfo = async () => {
+    if (!campaignId || !client) return;
+    setLoading(true);
+    setError(null);
+    try {
+      const api = createLeaderboardApi(client);
+      const info = await api.getCampaignInfo(campaignId);
+      setCampaignInfo(info);
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error("Unknown error"));
+    } finally {
+      setLoading(false);
+    }
+  };
+  useEffect(() => {
+    fetchCampaignInfo();
+  }, [campaignId, client]);
+  const rewardSummary = useMemo(() => {
+    if (!campaignInfo) return null;
+    let totalWinners2 = 0;
+    const tiers = [];
+    campaignInfo.winner_rewards.forEach((wr) => {
+      wr.winner_layer_rewards.forEach((wlr, index) => {
+        var _a;
+        totalWinners2 += wlr.max_winners;
+        const { text: rankRangeText, from: rankFrom, to: rankTo } = formatRankRange(wlr, index);
+        const distributeType = ((_a = wlr.rewards[0]) == null ? void 0 : _a.reward_distribute_type) || RewardsDistributeType.Equally;
+        const simpleReward = campaignInfo.winner_rewards_simple[index];
+        tiers.push({
+          tierNo: index + 1,
+          rankRangeText,
+          rankFrom,
+          rankTo,
+          winnerCount: wlr.max_winners,
+          rewardText: formatRewardText(simpleReward, distributeType),
+          rewardAmount: (simpleReward == null ? void 0 : simpleReward.reward_amount) || "",
+          rewardSymbol: (simpleReward == null ? void 0 : simpleReward.reward_symbol) || "",
+          rewardIcon: (simpleReward == null ? void 0 : simpleReward.reward_icon) || "",
+          chainLabel: (simpleReward == null ? void 0 : simpleReward.chain_label) || "",
+          distributeType
+        });
+      });
+    });
+    const prizePool2 = calculatePrizePool(campaignInfo.winner_rewards_simple);
+    return {
+      prizePool: prizePool2,
+      totalWinners: totalWinners2,
+      tiers,
+      startTime: campaignInfo.start_time,
+      endTime: campaignInfo.end_time,
+      pointsName: "",
+      // TODO: 根据 incentive_rank_by_points_id 获取积分名称
+      isEnded: campaignInfo.is_end
+    };
+  }, [campaignInfo]);
+  return {
+    campaignInfo,
+    rewardSummary,
+    loading: loading2,
+    error: error2,
+    refresh: fetchCampaignInfo
+  };
+}
+function HexagonBadge({
+  rank,
+  colorClass
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: `taskon-leaderboard-rank taskon-leaderboard-rank--badge taskon-leaderboard-rank--${colorClass}`, children: [
+    /* @__PURE__ */ jsx(
+      "svg",
+      {
+        width: "27",
+        height: "27",
+        viewBox: "0 0 27 27",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className: "taskon-leaderboard-rank__hexagon",
+        children: /* @__PURE__ */ jsx(
+          "path",
+          {
+            d: "M13.5 1L25 7.5V19.5L13.5 26L2 19.5V7.5L13.5 1Z",
+            className: "taskon-leaderboard-rank__hexagon-path"
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-rank__number-overlay", children: rank })
+  ] });
+}
+function RankBadge({ rank, isAllTime = false, className = "" }) {
+  if (rank < 0) {
+    return /* @__PURE__ */ jsx("span", { className: `taskon-leaderboard-rank taskon-leaderboard-rank--na ${className}`, children: "N/A" });
+  }
+  if (rank === 0) {
+    return /* @__PURE__ */ jsx("span", { className: `taskon-leaderboard-rank taskon-leaderboard-rank--unranked ${className}`, children: "--" });
+  }
+  if (rank === 1) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(HexagonBadge, { rank: 1, colorClass: "gold" }) });
+  }
+  if (rank === 2) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(HexagonBadge, { rank: 2, colorClass: "silver" }) });
+  }
+  if (rank === 3) {
+    return /* @__PURE__ */ jsx("div", { className, children: /* @__PURE__ */ jsx(HexagonBadge, { rank: 3, colorClass: "bronze" }) });
+  }
+  return /* @__PURE__ */ jsx("span", { className: `taskon-leaderboard-rank taskon-leaderboard-rank--number ${className}`, children: rank });
+}
+function UserCell({
+  userId,
+  userName,
+  avatar,
+  isCurrentUser = false,
+  youLabel = "YOU",
+  onUserClick,
+  className = ""
+}) {
+  const handleClick = () => {
+    if (onUserClick) {
+      onUserClick(userId, userName);
+    }
+  };
+  const isClickable = !!onUserClick && !isCurrentUser;
+  if (isCurrentUser) {
+    return /* @__PURE__ */ jsx("div", { className: `taskon-leaderboard-user taskon-leaderboard-user--current ${className}`, children: /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-user__you-badge", children: youLabel }) });
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `taskon-leaderboard-user ${isClickable ? "taskon-leaderboard-user--clickable" : ""} ${className}`,
+      onClick: isClickable ? handleClick : void 0,
+      role: isClickable ? "button" : void 0,
+      tabIndex: isClickable ? 0 : void 0,
+      onKeyDown: isClickable ? (e) => {
+        if (e.key === "Enter" || e.key === " ") {
+          handleClick();
+        }
+      } : void 0,
+      children: /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-user__name", children: userName })
+    }
+  );
+}
+function getRewardTypeLabel(rewardType, rewardPointsName, messages) {
+  if (!rewardType) return null;
+  if (rewardType === RewardType.BMintedNft || rewardType === RewardType.Cap || rewardType === RewardType.Nft) {
+    return "NFT:";
+  }
+  if (rewardType === RewardType.DiscordRole) {
+    return "Discord Role:";
+  }
+  if (rewardType === RewardType.Exp) {
+    return "EXP:";
+  }
+  if (rewardType === RewardType.GTCPoints || rewardType === RewardType.Points) {
+    return `${rewardPointsName || messages.columnPoints}:`;
+  }
+  if (rewardType === RewardType.Token) {
+    return "Token:";
+  }
+  if (rewardType === RewardType.Whitelist) {
+    return null;
+  }
+  return null;
+}
+function getRewardValueLabel(rewardType, rewardAmount, rewardSymbol, chainLabel, isUsdtEqual, messages) {
+  if (!rewardType) {
+    return {
+      value: rewardAmount ? `${rewardAmount} ${rewardSymbol || ""}` : messages.noData,
+      showChain: !!chainLabel
+    };
+  }
+  if (rewardType === RewardType.Nft || rewardType === RewardType.BMintedNft || rewardType === RewardType.DiscordRole || rewardType === RewardType.Exp) {
+    return { value: rewardSymbol || "", showChain: false };
+  }
+  if (rewardType === RewardType.Cap) {
+    return { value: "CAP", showChain: false };
+  }
+  if (rewardType === RewardType.GTCPoints || rewardType === RewardType.Points) {
+    return { value: rewardAmount || "", showChain: false };
+  }
+  if (rewardType === RewardType.Token) {
+    if (isUsdtEqual) {
+      return { value: `${rewardAmount} USD in ${rewardSymbol}`, showChain: false };
+    }
+    return { value: `${rewardAmount} ${rewardSymbol}`, showChain: !!chainLabel };
+  }
+  if (rewardType === RewardType.Whitelist) {
+    return { value: messages.whitelist || "Whitelist", showChain: false };
+  }
+  return {
+    value: rewardAmount ? `${rewardAmount} ${rewardSymbol || ""}` : messages.noData,
+    showChain: !!chainLabel
+  };
+}
+function RewardCell({
+  rewardAmount,
+  rewardSymbol,
+  chainLabel,
+  rewardType,
+  rewardPointsName,
+  isUsdtEqual,
+  messages,
+  isPotential = false,
+  className = ""
+}) {
+  if (!rewardAmount && !rewardType) {
+    return /* @__PURE__ */ jsx("span", { className, children: messages.noData });
+  }
+  const typeLabel = getRewardTypeLabel(rewardType, rewardPointsName, messages);
+  const { value, showChain } = getRewardValueLabel(
+    rewardType,
+    rewardAmount,
+    rewardSymbol,
+    chainLabel,
+    isUsdtEqual,
+    messages
+  );
+  const potentialClass = isPotential ? "taskon-leaderboard-table__reward--potential" : "";
+  return /* @__PURE__ */ jsxs("span", { className: `taskon-leaderboard-table__reward ${potentialClass} ${className}`, children: [
+    typeLabel && /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-table__reward-type", children: typeLabel }),
+    /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-table__reward-value", children: value }),
+    showChain && chainLabel && /* @__PURE__ */ jsxs("span", { className: "taskon-leaderboard-table__reward-chain", children: [
+      "(",
+      chainLabel,
+      ")"
+    ] })
+  ] });
+}
+function LeaderboardTabs({
+  tabs,
+  activeTabId,
+  onTabChange,
+  className = ""
+}) {
+  if (tabs.length <= 1) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx("div", { className: `taskon-leaderboard-tabs ${className}`, role: "tablist", children: tabs.map((tab) => {
+    const isActive = tab.id === activeTabId;
+    return /* @__PURE__ */ jsx(
+      "button",
+      {
+        role: "tab",
+        "aria-selected": isActive,
+        "aria-controls": `leaderboard-panel-${tab.id}`,
+        className: `taskon-leaderboard-tabs__tab ${isActive ? "taskon-leaderboard-tabs__tab--active" : ""}`,
+        onClick: () => onTabChange(tab.id),
+        children: tab.title
+      },
+      tab.id
+    );
+  }) });
+}
+function formatTimeRange(startTime, endTime) {
+  if (!startTime || !endTime) return "";
+  const start = new Date(startTime);
+  const end = new Date(endTime);
+  const offset = -start.getTimezoneOffset();
+  const offsetHours = Math.floor(Math.abs(offset) / 60);
+  const offsetSign = offset >= 0 ? "+" : "-";
+  const timezone = `UTC${offsetSign}${offsetHours}`;
+  const startYear = start.getFullYear();
+  const startMonth = String(start.getMonth() + 1).padStart(2, "0");
+  const startDay = String(start.getDate()).padStart(2, "0");
+  const startHours = String(start.getHours()).padStart(2, "0");
+  const startMinutes = String(start.getMinutes()).padStart(2, "0");
+  const endYear = end.getFullYear();
+  const endMonth = String(end.getMonth() + 1).padStart(2, "0");
+  const endDay = String(end.getDate()).padStart(2, "0");
+  const endHours = String(end.getHours()).padStart(2, "0");
+  const endMinutes = String(end.getMinutes()).padStart(2, "0");
+  return `(${timezone})  ${startYear}-${startMonth}-${startDay} ${startHours}:${startMinutes} ～ ${endYear}-${endMonth}-${endDay} ${endHours}:${endMinutes}`;
+}
+function getEventStatus(startTime, endTime, messages) {
+  if (!startTime || !endTime) return null;
+  const now = Date.now();
+  if (now < startTime) {
+    return { label: messages.statusUpcoming, status: "upcoming" };
+  }
+  if (now > endTime) {
+    return { label: messages.statusEnded, status: "ended" };
+  }
+  return { label: messages.statusOngoing, status: "ongoing" };
+}
+function LeaderboardHeader({
+  tabConfig,
+  showTitle,
+  rewardSummary,
+  participantsCount,
+  messages,
+  onOpenRewardRules,
+  className = ""
+}) {
+  const isSprint = tabConfig.type === LeaderboardContentType.LeaderboardSprint;
+  const eventStatus = getEventStatus(tabConfig.startTime, tabConfig.endTime, messages);
+  const hasTimeRange = tabConfig.startTime && tabConfig.endTime;
+  const hasParticipants = typeof participantsCount === "number";
+  const hasContent = eventStatus || hasTimeRange || hasParticipants;
+  if (!hasContent && !showTitle && !isSprint) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `taskon-leaderboard-header ${className}`, children: [
+    (eventStatus || hasTimeRange || hasParticipants) && /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-header__info", children: [
+      eventStatus && /* @__PURE__ */ jsx(
+        "span",
+        {
+          className: `taskon-leaderboard-header__status taskon-leaderboard-header__status--${eventStatus.status}`,
+          children: eventStatus.label
+        }
+      ),
+      hasTimeRange && /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-header__time", children: formatTimeRange(tabConfig.startTime, tabConfig.endTime) }),
+      hasParticipants && (eventStatus || hasTimeRange) && /* @__PURE__ */ jsx("div", { className: "taskon-leaderboard-header__separator" }),
+      hasParticipants && /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-header__participants", children: [
+        /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-header__participants-label", children: messages.participants || "Participants" }),
+        /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-header__participants-value", children: participantsCount.toLocaleString() })
+      ] })
+    ] }),
+    isSprint && rewardSummary && /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-header__reward-info", children: [
+      /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-header__reward-item", children: [
+        /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-header__reward-label", children: messages.prizePool }),
+        /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-header__reward-value", children: rewardSummary.prizePool || "-" })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "taskon-leaderboard-header__reward-separator" }),
+      /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-header__reward-item", children: [
+        /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-header__reward-label", children: messages.totalWinners }),
+        /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-header__reward-value", children: rewardSummary.totalWinners })
+      ] }),
+      onOpenRewardRules && /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "ghost",
+          size: "small",
+          onClick: onOpenRewardRules,
+          className: "taskon-leaderboard-header__reward-rules-btn",
+          children: messages.rewardRules
+        }
+      )
+    ] })
+  ] });
+}
+function getColumnTitle(column, messages, pointsName) {
+  switch (column) {
+    case LeaderboardTableColumn.Rank:
+      return messages.columnRank;
+    case LeaderboardTableColumn.User:
+      return messages.columnUser;
+    case LeaderboardTableColumn.Tasks:
+      return messages.columnTasks;
+    case LeaderboardTableColumn.InvitedUsers:
+      return messages.columnInvitedUsers;
+    case LeaderboardTableColumn.CurrentTier:
+      return messages.columnCurrentTier;
+    case LeaderboardTableColumn.Points:
+      return pointsName || messages.columnPoints;
+    case LeaderboardTableColumn.Rewards:
+      return messages.columnRewards;
+    default:
+      return "";
+  }
+}
+function getRewardForRank(rank, rewardTiers) {
+  if (!rewardTiers || rank <= 0) return void 0;
+  return rewardTiers.find((tier) => {
+    return rank >= tier.rankFrom && rank <= tier.rankTo;
+  });
+}
+function convertAllTimeData(data) {
+  return data.map((item) => ({
+    id: item.user_id,
+    rank: item.rank,
+    displayRank: item.rank,
+    userId: item.user_id,
+    userName: item.user,
+    avatar: item.avatar,
+    tasks: item.task,
+    invitedUsers: item.invited_users,
+    points: item.point.amount,
+    isAllTime: true
+  }));
+}
+function convertCampaignData(data) {
+  return data.map((item) => {
+    var _a;
+    return {
+      id: item.user_info.user_id,
+      rank: item.rank,
+      displayRank: item.rank >= 0 ? item.rank + 1 : item.rank,
+      // Campaign 的 rank 从 0 开始
+      userId: item.user_info.user_id,
+      userName: item.user_info.user_name,
+      avatar: item.user_info.user_avatar,
+      tasks: item.task_count,
+      currentTier: item.winner_layer !== void 0 && item.winner_layer >= 0 ? item.winner_layer + 1 : void 0,
+      points: item.point.amount,
+      rewardAmount: item.reward_amount,
+      rewardSymbol: item.reward_symbol,
+      chainLabel: item.chain_label,
+      rewardType: item.reward_type,
+      rewardPointsName: (_a = item.point) == null ? void 0 : _a.points_name,
+      isUsdtEqual: item.is_usdt_equal,
+      isAllTime: false
+    };
+  });
+}
+function LeaderboardTable({
+  tabConfig,
+  allTimeData,
+  campaignData,
+  currentUserId,
+  messages,
+  onUserClick,
+  rewardTiers,
+  loading: loading2 = false,
+  className = ""
+}) {
+  const isAllTime = tabConfig.type === LeaderboardContentType.AllTime;
+  const tableData = useMemo(() => {
+    if (isAllTime && allTimeData) {
+      return convertAllTimeData(allTimeData);
+    }
+    if (!isAllTime && campaignData) {
+      return convertCampaignData(campaignData);
+    }
+    return [];
+  }, [isAllTime, allTimeData, campaignData]);
+  const columns = useMemo(() => {
+    return tabConfig.columns.map((column) => {
+      const baseColumn = {
+        key: column,
+        title: getColumnTitle(column, messages, tabConfig.pointsName)
+      };
+      switch (column) {
+        case LeaderboardTableColumn.Rank:
+          return {
+            ...baseColumn,
+            width: 120,
+            render: (_, row) => /* @__PURE__ */ jsx(RankBadge, { rank: row.displayRank, isAllTime: row.isAllTime })
+          };
+        case LeaderboardTableColumn.User:
+          return {
+            ...baseColumn,
+            minWidth: 164,
+            render: (_, row) => /* @__PURE__ */ jsx(
+              UserCell,
+              {
+                userId: row.userId,
+                userName: row.userName,
+                avatar: row.avatar,
+                isCurrentUser: currentUserId === row.userId,
+                youLabel: messages.you,
+                onUserClick
+              }
+            )
+          };
+        case LeaderboardTableColumn.Tasks:
+          return {
+            ...baseColumn,
+            width: 142,
+            render: (_, row) => row.tasks ?? messages.noData
+          };
+        case LeaderboardTableColumn.InvitedUsers:
+          return {
+            ...baseColumn,
+            width: 142,
+            render: (_, row) => row.invitedUsers ?? messages.noData
+          };
+        case LeaderboardTableColumn.CurrentTier:
+          return {
+            ...baseColumn,
+            width: 142,
+            render: (_, row) => row.currentTier ?? messages.noData
+          };
+        case LeaderboardTableColumn.Points:
+          return {
+            ...baseColumn,
+            width: 142,
+            render: (_, row) => row.points && row.points > 0 ? row.points.toLocaleString() : messages.noData
+          };
+        case LeaderboardTableColumn.Rewards:
+          return {
+            ...baseColumn,
+            width: 103,
+            align: "right",
+            render: (_, row) => {
+              if (row.rewardAmount || row.rewardType) {
+                return /* @__PURE__ */ jsx(
+                  RewardCell,
+                  {
+                    rewardAmount: row.rewardAmount,
+                    rewardSymbol: row.rewardSymbol,
+                    chainLabel: row.chainLabel,
+                    rewardType: row.rewardType,
+                    rewardPointsName: row.rewardPointsName,
+                    isUsdtEqual: row.isUsdtEqual,
+                    messages
+                  }
+                );
+              }
+              const reward = getRewardForRank(row.displayRank, rewardTiers);
+              if (reward) {
+                return /* @__PURE__ */ jsx(
+                  RewardCell,
+                  {
+                    rewardAmount: reward.rewardAmount,
+                    rewardSymbol: reward.rewardSymbol,
+                    chainLabel: reward.chainLabel,
+                    messages,
+                    isPotential: true
+                  }
+                );
+              }
+              return messages.noData;
+            }
+          };
+        default:
+          return {
+            ...baseColumn,
+            render: () => messages.noData
+          };
+      }
+    });
+  }, [tabConfig.columns, tabConfig.pointsName, messages, currentUserId, onUserClick, rewardTiers]);
+  const rowConfig = useMemo(
+    () => ({
+      getRowKey: (row) => row.id,
+      isHighlighted: (row) => currentUserId === row.userId
+    }),
+    [currentUserId]
+  );
+  const emptyConfig = useMemo(
+    () => ({
+      title: messages.emptyTitle,
+      description: messages.emptyDesc
+    }),
+    [messages.emptyTitle, messages.emptyDesc]
+  );
+  return /* @__PURE__ */ jsx(
+    Table,
+    {
+      columns,
+      data: tableData,
+      rowConfig,
+      loading: loading2,
+      loadingText: messages.loading,
+      empty: emptyConfig,
+      striped: true,
+      className
+    }
+  );
+}
+function LeaderboardPagination({
+  page: page2,
+  totalPages,
+  total,
+  hasPrevious,
+  hasNext,
+  onPrevious,
+  onNext,
+  messages,
+  className = ""
+}) {
+  if (totalPages <= 1 || total === 0) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    Pagination,
+    {
+      page: page2,
+      totalPages,
+      hasPrevious,
+      hasNext,
+      onPrevious,
+      onNext,
+      className: `taskon-leaderboard-pagination ${className}`,
+      showArrows: true,
+      showButtonText: false
+    }
+  );
+}
+function formatDate(timestamp) {
+  if (!timestamp) return "";
+  const date = new Date(timestamp);
+  return date.toLocaleDateString("en-US", {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit"
+  });
+}
+function getDistributeText(distributeType, messages) {
+  switch (distributeType) {
+    case RewardsDistributeType.Equally:
+      return "Each receives";
+    case RewardsDistributeType.Random:
+      return "Randomly split";
+    default:
+      return "";
+  }
+}
+function TierRow({
+  tier,
+  messages
+}) {
+  const distributeText = getDistributeText(tier.distributeType);
+  return /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-modal__tier", children: [
+    /* @__PURE__ */ jsxs("span", { className: "taskon-leaderboard-modal__tier-rank", children: [
+      "Top ",
+      tier.rankRangeText
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-modal__tier-reward", children: [
+      distributeText && /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-modal__tier-distribute", children: distributeText }),
+      /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-modal__tier-token", children: [
+        tier.rewardIcon && /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: tier.rewardIcon,
+            alt: tier.rewardSymbol,
+            className: "taskon-leaderboard-modal__tier-token-icon"
+          }
+        ),
+        /* @__PURE__ */ jsxs("span", { className: "taskon-leaderboard-modal__tier-amount", children: [
+          /* @__PURE__ */ jsxs("span", { className: "taskon-leaderboard-modal__tier-amount-value", children: [
+            tier.rewardAmount,
+            " "
+          ] }),
+          /* @__PURE__ */ jsx("span", { className: "taskon-leaderboard-modal__tier-amount-symbol", children: tier.rewardSymbol })
+        ] })
+      ] })
+    ] })
+  ] });
+}
+function RewardRulesModal({
+  isOpen,
+  onClose,
+  rewardSummary,
+  messages,
+  className = ""
+}) {
+  if (!rewardSummary) {
+    return null;
+  }
+  const description = messages.rewardRulesDesc.replace(
+    "{pointsName}",
+    rewardSummary.pointsName || "points"
+  );
+  return /* @__PURE__ */ jsx(
+    Dialog,
+    {
+      open: isOpen,
+      onOpenChange: (open) => {
+        if (!open) onClose();
+      },
+      title: messages.rewardRulesTitle,
+      showCloseButton: true,
+      className,
+      contentClassName: "taskon-leaderboard-modal",
+      maxWidth: 480,
+      children: /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-modal__content", children: [
+        /* @__PURE__ */ jsx("h2", { className: "taskon-leaderboard-modal__title", children: messages.rewardRulesTitle }),
+        /* @__PURE__ */ jsx("p", { className: "taskon-leaderboard-modal__desc", children: description }),
+        /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-modal__section", children: [
+          /* @__PURE__ */ jsx("h3", { className: "taskon-leaderboard-modal__section-title", children: messages.eventPeriod }),
+          /* @__PURE__ */ jsxs("p", { className: "taskon-leaderboard-modal__period", children: [
+            formatDate(rewardSummary.startTime),
+            " -",
+            " ",
+            formatDate(rewardSummary.endTime)
+          ] })
+        ] }),
+        /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard-modal__section", children: [
+          /* @__PURE__ */ jsx("h3", { className: "taskon-leaderboard-modal__section-title", children: messages.rewardDetails }),
+          /* @__PURE__ */ jsx("div", { className: "taskon-leaderboard-modal__tiers", children: rewardSummary.tiers.map((tier) => /* @__PURE__ */ jsx(TierRow, { tier, messages }, tier.tierNo)) })
+        ] })
+      ] })
+    }
+  );
+}
+function mergeLeaderboardConfig(props, cloud) {
+  return {
+    config: props.config ?? cloud ?? null
+  };
+}
+const tabAllTime = "All Time";
+const tabQuest = "Quest";
+const tabEvent = "Event";
+const tabSprint = "Sprint";
+const columnRank = "Rank";
+const columnPosition = "Position";
+const columnUser = "User";
+const columnTasks = "Tasks";
+const columnInvitedUsers = "Invited Users";
+const columnCurrentTier = "Current Tier";
+const columnPoints = "Points";
+const columnRewards = "Reward";
+const statusOngoing = "Ongoing";
+const statusEnded = "Ended";
+const statusUpcoming = "Upcoming";
+const participants = "Participants";
+const prizePool = "Prize Pool";
+const totalWinners = "Total Winners";
+const rewardRules = "Reward Rules";
+const rewardRulesTitle = "Reward Rules";
+const rewardRulesDesc = "Rewards will be given based on leaderboard rankings, determined by users' {pointsName} earned during the event.";
+const eventPeriod = "Event Period";
+const rewardDetails = "Reward Details";
+const eachReceives = "Each receives {amount}";
+const randomlySplit = "Randomly split {amount}";
+const emptyTitle = "No Rankings Yet";
+const emptyDesc = "Be the first to join and claim the top spot!";
+const page = "Page";
+const of = "of";
+const previous = "Previous";
+const next = "Next";
+const loading = "Loading...";
+const error = "Failed to load leaderboard";
+const retry = "Retry";
+const you = "You";
+const unranked = "Unranked";
+const na = "N/A";
+const noData = "-";
+const whitelist = "Whitelist";
+const enMessages = {
+  tabAllTime,
+  tabQuest,
+  tabEvent,
+  tabSprint,
+  columnRank,
+  columnPosition,
+  columnUser,
+  columnTasks,
+  columnInvitedUsers,
+  columnCurrentTier,
+  columnPoints,
+  columnRewards,
+  statusOngoing,
+  statusEnded,
+  statusUpcoming,
+  participants,
+  prizePool,
+  totalWinners,
+  rewardRules,
+  rewardRulesTitle,
+  rewardRulesDesc,
+  eventPeriod,
+  rewardDetails,
+  eachReceives,
+  randomlySplit,
+  emptyTitle,
+  emptyDesc,
+  page,
+  of,
+  previous,
+  next,
+  loading,
+  error,
+  retry,
+  you,
+  unranked,
+  na,
+  noData,
+  whitelist
+};
+const en = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  columnCurrentTier,
+  columnInvitedUsers,
+  columnPoints,
+  columnPosition,
+  columnRank,
+  columnRewards,
+  columnTasks,
+  columnUser,
+  default: enMessages,
+  eachReceives,
+  emptyDesc,
+  emptyTitle,
+  error,
+  eventPeriod,
+  loading,
+  na,
+  next,
+  noData,
+  of,
+  page,
+  participants,
+  previous,
+  prizePool,
+  randomlySplit,
+  retry,
+  rewardDetails,
+  rewardRules,
+  rewardRulesDesc,
+  rewardRulesTitle,
+  statusEnded,
+  statusOngoing,
+  statusUpcoming,
+  tabAllTime,
+  tabEvent,
+  tabQuest,
+  tabSprint,
+  totalWinners,
+  unranked,
+  whitelist,
+  you
+}, Symbol.toStringTag, { value: "Module" }));
+function LeaderboardWidget(props) {
+  const { widgetId } = props;
+  const { functionConfig, cloudTheme, isConfigLoading, configError } = useResolvedWidgetConfig(widgetId);
+  const mergedConfig = useMemo(() => {
+    return mergeLeaderboardConfig(
+      props,
+      functionConfig ?? null
+    );
+  }, [props.config, functionConfig]);
+  return /* @__PURE__ */ jsx(
+    WidgetShell,
+    {
+      widgetId,
+      isConfigLoading,
+      cloudTheme,
+      className: "taskon-leaderboard",
+      errorMessage: configError ?? (!mergedConfig.config ? "Leaderboard config is required. Please provide config via props or widgetId." : void 0),
+      children: /* @__PURE__ */ jsx(
+        LeaderboardWidgetInner,
+        {
+          ...props,
+          config: mergedConfig.config
+        }
+      )
+    }
+  );
+}
+function LeaderboardWidgetInner({
+  config,
+  defaultTabId,
+  onTabChange,
+  onUserClick,
+  className = "",
+  style
+}) {
+  var _a;
+  const { userId } = useTaskOnContext();
+  const { messages } = useWidgetLocale({
+    widgetId: "LeaderboardWidget",
+    defaultMessages: enMessages,
+    loadMessages: (locale) => __variableDynamicImportRuntimeHelper(/* @__PURE__ */ Object.assign({ "./locales/en.json": () => Promise.resolve().then(() => en), "./locales/ja.json": () => import("./leaderboardwidget-ja-Bj6gz6y1.js"), "./locales/ko.json": () => import("./leaderboardwidget-ko-f1cLO9ic.js") }), `./locales/${locale}.json`, 3)
+  });
+  const [activeTabId, setActiveTabId] = useState(
+    defaultTabId || ((_a = config.leaderboards[0]) == null ? void 0 : _a.id) || ""
+  );
+  const [isRewardModalOpen, setIsRewardModalOpen] = useState(false);
+  const currentTab = useMemo(() => {
+    return config.leaderboards.find((tab) => tab.id === activeTabId);
+  }, [config.leaderboards, activeTabId]);
+  const {
+    page: page2,
+    goToPrevious,
+    goToNext,
+    reset: resetPagination
+  } = usePagination({
+    total: 0,
+    // 初始值，hasPrevious/hasNext 将根据实际 total 重新计算
+    pageSize: config.displayOptions.rows
+  });
+  const {
+    data: leaderboardData,
+    loading: leaderboardLoading,
+    error: leaderboardError,
+    total,
+    refresh: refreshLeaderboard
+  } = useLeaderboard({
+    tabConfig: currentTab,
+    page: page2,
+    pageSize: config.displayOptions.rows
+  });
+  const actualTotalPages = Math.max(1, Math.ceil(total / config.displayOptions.rows));
+  const hasPrevious = page2 > 0;
+  const hasNext = page2 < actualTotalPages - 1;
+  const isSprint = (currentTab == null ? void 0 : currentTab.type) === LeaderboardContentType.LeaderboardSprint;
+  const { rewardSummary, loading: rewardLoading } = useCampaignReward(
+    isSprint ? currentTab == null ? void 0 : currentTab.relatedId : void 0
+  );
+  const handleTabChange = useCallback(
+    (tabId) => {
+      setActiveTabId(tabId);
+      resetPagination();
+      onTabChange == null ? void 0 : onTabChange(tabId);
+    },
+    [onTabChange, resetPagination]
+  );
+  const handleOpenRewardRules = useCallback(() => {
+    setIsRewardModalOpen(true);
+  }, []);
+  const handleCloseRewardRules = useCallback(() => {
+    setIsRewardModalOpen(false);
+  }, []);
+  const allTimeData = useMemo(() => {
+    if (leaderboardData && isAllTimeResponse(leaderboardData)) {
+      return leaderboardData.list;
+    }
+    return void 0;
+  }, [leaderboardData]);
+  const campaignData = useMemo(() => {
+    if (leaderboardData && isCampaignResponse(leaderboardData)) {
+      return leaderboardData.data;
+    }
+    return void 0;
+  }, [leaderboardData]);
+  const participantsCount = useMemo(() => {
+    if (leaderboardData && isCampaignResponse(leaderboardData)) {
+      return leaderboardData.total_user;
+    }
+    return void 0;
+  }, [leaderboardData]);
+  if (leaderboardError) {
+    return /* @__PURE__ */ jsx("div", { className: `taskon-leaderboard taskon-leaderboard--error ${className}`, style, children: /* @__PURE__ */ jsxs("div", { className: "taskon-leaderboard__error", children: [
+      /* @__PURE__ */ jsx("p", { className: "taskon-leaderboard__error-text", children: messages.error }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "primary",
+          size: "medium",
+          onClick: refreshLeaderboard,
+          className: "taskon-leaderboard__retry-btn",
+          children: messages.retry
+        }
+      )
+    ] }) });
+  }
+  if (!currentTab) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxs("div", { className: `taskon-leaderboard ${className}`, style, children: [
+    /* @__PURE__ */ jsx(
+      LeaderboardTabs,
+      {
+        tabs: config.leaderboards,
+        activeTabId,
+        onTabChange: handleTabChange
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      LeaderboardHeader,
+      {
+        tabConfig: currentTab,
+        showTitle: config.displayOptions.showTitle,
+        rewardSummary,
+        participantsCount,
+        messages,
+        onOpenRewardRules: isSprint ? handleOpenRewardRules : void 0
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      LeaderboardTable,
+      {
+        tabConfig: currentTab,
+        allTimeData,
+        campaignData,
+        currentUserId: userId,
+        messages,
+        onUserClick,
+        rewardTiers: rewardSummary == null ? void 0 : rewardSummary.tiers,
+        loading: leaderboardLoading || rewardLoading,
+        className: "taskon-leaderboard-table"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      LeaderboardPagination,
+      {
+        page: page2,
+        totalPages: actualTotalPages,
+        total,
+        hasPrevious,
+        hasNext,
+        onPrevious: goToPrevious,
+        onNext: goToNext,
+        messages
+      }
+    ),
+    isSprint && /* @__PURE__ */ jsx(
+      RewardRulesModal,
+      {
+        isOpen: isRewardModalOpen,
+        onClose: handleCloseRewardRules,
+        rewardSummary,
+        messages
+      }
+    )
+  ] });
+}
+export {
+  LeaderboardWidget as L,
+  RankBadge as R,
+  UserCell as U,
+  useCampaignReward as a,
+  LeaderboardTabs as b,
+  LeaderboardHeader as c,
+  LeaderboardTable as d,
+  LeaderboardPagination as e,
+  RewardRulesModal as f,
+  useLeaderboard as u
+};