@kodiak-finance/orderly-trading-leaderboard 2.7.4

package/dist/index.d.ts

@@ -0,0 +1,538 @@
+import * as react from 'react';
+import react__default, { FC, ReactNode } from 'react';
+import * as _kodiak_finance_orderly_ui from '@kodiak-finance/orderly-ui';
+import { TableSort } from '@kodiak-finance/orderly-ui';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+type Campaign = {
+    title: string;
+    description: string;
+    image: string;
+    startTime: Date | string;
+    endTime: Date | string;
+    href: string | {
+        /** learn more url */
+        learnMore: string;
+        /** trading url, if provided, will override default trading now button url */
+        trading: string;
+    };
+};
+/**
+ * Trading leaderboard provider state
+ */
+type TradingLeaderboardState$1 = {
+    /** campaigns config, if not provided, will not show campaigns section */
+    campaigns?: Campaign[];
+    /** background src, it can be a image resource or video resource */
+    backgroundSrc?: string;
+    href?: {
+        /** default trading now button url */
+        trading: string;
+    };
+};
+type TradingLeaderboardProviderProps$1 = react__default.PropsWithChildren<TradingLeaderboardState$1>;
+
+type LeaderboardScriptReturn = ReturnType<typeof useLeaderboardScript>;
+type LeaderboardScriptOptions = {
+    backgroundSrc?: string;
+    campaigns?: Campaign[];
+};
+declare function useLeaderboardScript(options: LeaderboardScriptOptions): {
+    backgroundSrc: string | undefined;
+    isVideo: boolean;
+    showCampaigns: boolean;
+    isMobile: boolean;
+};
+
+type LeaderboardProps = {
+    style?: React.CSSProperties;
+    className?: string;
+} & LeaderboardScriptReturn;
+declare const Leaderboard: FC<LeaderboardProps>;
+
+type LeaderboardWidgetProps = TradingLeaderboardProviderProps$1 & Pick<LeaderboardProps, "style" | "className">;
+/**
+ * @deprecated use LeaderboardPage instead
+ * it will be removed in next version
+ */
+declare const LeaderboardWidget: FC<LeaderboardWidgetProps>;
+
+type CampaignsWidgetProps = {
+    className?: string;
+    style?: React.CSSProperties;
+};
+declare const CampaignsWidget: FC<CampaignsWidgetProps>;
+
+type CampaignsScriptReturn = ReturnType<typeof useCampaignsScript>;
+type CategorizedCampaigns = {
+    ongoing: Campaign[];
+    past: Campaign[];
+    future: Campaign[];
+};
+type CurrentCampaigns = Campaign & {
+    displayTime: string;
+    learnMoreUrl: string;
+    tradingUrl: string;
+};
+type TEmblaApi = {
+    scrollTo?: (index: number) => void;
+};
+type CategoryKey = keyof CategorizedCampaigns;
+declare function useCampaignsScript(): {
+    options: {
+        label: string;
+        value: CategoryKey;
+    }[];
+    currentCampaigns: {
+        displayTime: string;
+        learnMoreUrl: string;
+        tradingUrl: string;
+        title: string;
+        description: string;
+        image: string;
+        startTime: Date | string;
+        endTime: Date | string;
+        href: string | {
+            learnMore: string;
+            trading: string;
+        };
+    }[];
+    category: keyof CategorizedCampaigns;
+    onCategoryChange: (value: string) => void;
+    tradingUrl: string | undefined;
+    emblaRef: _kodiak_finance_orderly_ui.EmblaViewportRefType;
+    emblaApi: TEmblaApi;
+    scrollIndex: number;
+    enableScroll: boolean;
+    onLearnMore: (campaign: CurrentCampaigns) => void;
+    onTradeNow: (campaign: CurrentCampaigns) => void;
+};
+
+type CampaignsProps = {
+    className?: string;
+    style?: React.CSSProperties;
+} & CampaignsScriptReturn;
+declare const Campaigns: FC<CampaignsProps>;
+
+type TradingData = {
+    account_id: string;
+    address: string;
+    broker_fee: number;
+    date: string;
+    perp_maker_volume: number;
+    perp_taker_volume: number;
+    perp_volume: number;
+    total_fee: number;
+    key?: string;
+};
+type TradingListScriptReturn = ReturnType<typeof useTradingListScript>;
+declare const FilterDays$1: readonly [7, 14, 30, 90];
+type TFilterDays$1 = (typeof FilterDays$1)[number];
+type DateRange$1 = {
+    from?: Date;
+    to?: Date;
+};
+declare function useTradingListScript(): {
+    pagination: _kodiak_finance_orderly_ui.PaginationMeta;
+    dateRange: DateRange$1;
+    filterDay: 30 | 7 | 14 | 90 | null;
+    updateFilterDay: (day: TFilterDays$1) => void;
+    filterItems: any;
+    onFilter: (filter: {
+        name: string;
+        value: any;
+    }) => void;
+    initialSort: TableSort;
+    onSort: (sort?: TableSort) => void;
+    dataSource: TradingData[];
+    isLoading: boolean;
+    searchValue: string;
+    onSearchValueChange: (value: string) => void;
+    clearSearchValue: () => void;
+    isMobile: boolean;
+    sentinelRef: react.MutableRefObject<HTMLDivElement | null>;
+    dataList: TradingData[];
+    address: string | undefined;
+};
+
+type TradingListProps = {
+    style?: React.CSSProperties;
+    className?: string;
+} & TradingListScriptReturn;
+declare const TradingList: FC<TradingListProps>;
+
+type TradingListWidgetProps = Pick<TradingListProps, "style" | "className">;
+/**
+ * @deprecated use TradingListPage instead
+ * it will be removed in next version
+ */
+declare const TradingListWidget: FC<TradingListWidgetProps>;
+
+type RankingColumnFields = "rank" | "address" | "volume" | "pnl" | "rewards";
+
+type ListStyle = "disc" | "decimal" | "none" | "circle" | "square" | "decimal-leading-zero" | "lower-alpha" | "upper-alpha" | "lower-roman" | "upper-roman";
+type DescriptionItem = {
+    content: string;
+    type: "markdown" | "text" | "image";
+    alt?: string;
+    className?: string;
+    listStyle?: ListStyle;
+    listClassName?: string;
+    children?: DescriptionItem[];
+};
+type DescriptionConfig = {
+    listStyle?: ListStyle;
+    listClassName?: string;
+};
+
+declare enum CampaignTagEnum {
+    ONGOING = "ongoing",
+    COMING = "coming",
+    ENDED = "ended",
+    EXCLUSIVE = "exclusive"
+}
+interface CampaignStatistics {
+    total_participants?: number;
+    total_volume?: number;
+}
+interface PrizePoolTier {
+    position?: number;
+    position_range?: [number, number];
+    amount: number;
+}
+interface PrizePool {
+    pool_id: string;
+    label: string;
+    total_prize: number;
+    currency: string;
+    metric: "volume" | "pnl";
+    tiers: PrizePoolTier[];
+    volume_limit?: number;
+}
+interface TicketTierRule {
+    value: number;
+    tickets: number;
+}
+interface TicketLinearRule {
+    every: number;
+    tickets: number;
+}
+interface TicketRules {
+    total_prize: number;
+    currency: string;
+    metric: "volume" | "pnl";
+    mode: "tiered" | "linear";
+    tiers?: TicketTierRule[];
+    linear?: TicketLinearRule;
+}
+interface CampaignConfig {
+    campaign_id: number | string;
+    title: string;
+    subtitle?: string;
+    description: string;
+    content?: ReactNode;
+    classNames?: {
+        container?: string;
+        topContainer?: string;
+        title?: string;
+        description?: string;
+        descriptionContainer?: string;
+    };
+    register_time?: string;
+    start_time: string;
+    end_time: string;
+    reward_distribution_time?: string;
+    volume_scope?: string | string[];
+    referral_codes?: string[] | string;
+    prize_pools?: PrizePool[];
+    tiered_prize_pools?: Array<PrizePool[]>;
+    ticket_rules?: TicketRules;
+    image?: string;
+    rule_url?: string;
+    rule_config?: {
+        action?: "scroll" | "click";
+    };
+    trading_url?: string;
+    trading_config?: {
+        format?: string;
+    };
+    href?: string;
+    hide_arena?: boolean;
+    hide_rewards?: boolean;
+    hide_estimated_rewards?: boolean;
+    highlight_pool_id?: string;
+    user_account_label?: string;
+    rule?: {
+        rule: DescriptionItem[];
+        terms: DescriptionItem[];
+        ruleConfig?: DescriptionConfig;
+    };
+    leaderboard_config?: LeaderboardConfig;
+    emphasisConfig?: {
+        subtitle: string;
+        walletConnect: {
+            title: string;
+            description: string;
+        };
+        hideConnectWallet: boolean;
+    };
+}
+interface LeaderboardConfig {
+    use_general_leaderboard?: boolean;
+    exclude_leaderboard_columns?: RankingColumnFields[];
+    week_one_addresses?: string[];
+}
+interface UserData {
+    rank?: number | string;
+    pnl: number;
+    total_participants?: number;
+    volume: number;
+    referral_code?: string;
+}
+type CampaignStatsDetailsResponse = {
+    broker_id: string;
+    user_count: number;
+    volume: number;
+    symbol: string;
+}[];
+type CampaignStatsResponse = {
+    sign_up_count: number;
+    user_count: number;
+    volume: number;
+    updated_time: number;
+};
+type UserCampaignsResponse = {
+    id: string;
+    register_time: number;
+}[];
+
+/**
+ * Trading leaderboard provider state
+ */
+type TradingLeaderboardState = {
+    /** campaigns config, if not provided, will not show campaigns section */
+    campaigns?: CampaignConfig[];
+    /** background src, it can be a image resource or video resource */
+    backgroundSrc?: string;
+    href?: {
+        /** default trading now button url */
+        trading: string;
+    };
+    currentCampaignId: string | number;
+    currentCampaign?: CampaignConfig;
+    onCampaignChange: (campaignId: string | number) => void;
+    /** leaderboard user data, it will be used to calculate the rewards */
+    userData?: UserData;
+    /** set leaderboard user data */
+    setUserData?: (userdata: UserData) => void;
+    /** campaign ranking list updated time */
+    updatedTime?: number;
+    /** set snapshot time */
+    setUpdatedTime?: (updatedTime?: number) => void;
+    /** custom data, if use this, you can full control the data */
+    dataAdapter?: (info: {
+        page: number;
+        pageSize: number;
+    }) => {
+        loading: boolean;
+        dataSource?: any[];
+        dataList?: any[];
+        userData?: any;
+        updatedTime?: number;
+        meta?: {
+            total: number;
+            current_page: number;
+            records_per_page: number;
+        };
+    };
+    campaignDateRange?: {
+        start_time: Date | string;
+        end_time: Date | string;
+    };
+    statistics?: CampaignStatistics;
+    setStatistics?: (statistics: CampaignStatistics) => void;
+};
+/**
+ * Trading leaderboard context
+ */
+declare const TradingLeaderboardContext: react__default.Context<TradingLeaderboardState>;
+type TradingLeaderboardProviderProps = Pick<TradingLeaderboardState, "campaigns" | "href" | "backgroundSrc" | "dataAdapter"> & {
+    campaignId?: string | number;
+    onCampaignChange?: (campaignId: string | number) => void;
+};
+declare const TradingLeaderboardProvider: react__default.FC<react__default.PropsWithChildren<TradingLeaderboardProviderProps>>;
+declare const useTradingLeaderboardContext: () => TradingLeaderboardState;
+
+type CampaignRankingData = {
+    broker_id: string;
+    account_id: string;
+    address: string;
+    volume: number;
+    pnl: number;
+    total_deposit_amount: number;
+    total_withdrawal_amount: number;
+    start_account_value: number;
+    end_account_value: number;
+    key?: string;
+    rank?: number | string;
+    rewards?: {
+        amount: number;
+        currency: string;
+    };
+};
+type CampaignRankingScriptOptions = {
+    campaignId: number | string;
+    sortKey?: "volume" | "pnl";
+};
+declare function useCampaignRankingScript(options: CampaignRankingScriptOptions): {
+    pagination: _kodiak_finance_orderly_ui.PaginationMeta;
+    initialSort: TableSort;
+    dataSource: any[] | undefined;
+    isLoading: boolean | undefined;
+    isMobile: boolean;
+    sentinelRef: react.MutableRefObject<HTMLDivElement | null>;
+    dataList: any[] | undefined;
+    address: string | undefined;
+};
+
+type DateRange = {
+    from?: Date;
+    to?: Date;
+    label?: string;
+};
+declare enum LeaderboardTab {
+    Volume = "volume",
+    Pnl = "pnl"
+}
+
+type GeneralRankingData = {
+    account_id: string;
+    address: string;
+    broker_fee: number;
+    date: string;
+    perp_maker_volume: number;
+    perp_taker_volume: number;
+    perp_volume: number;
+    realized_pnl: number;
+    total_fee: number;
+    key?: string;
+    rank?: number | string;
+    volume?: number;
+    pnl?: number;
+};
+type GeneralRankingScriptReturn = ReturnType<typeof useGeneralRankingScript>;
+type GeneralRankingScriptOptions = {
+    dateRange?: DateRange | null;
+    address?: string;
+    sortKey?: "perp_volume" | "realized_pnl";
+};
+declare function useGeneralRankingScript(options?: GeneralRankingScriptOptions): {
+    pagination: _kodiak_finance_orderly_ui.PaginationMeta;
+    initialSort: TableSort;
+    onSort: (sort?: TableSort) => void;
+    dataSource: any[];
+    isLoading: boolean;
+    isMobile: boolean;
+    sentinelRef: react.MutableRefObject<HTMLDivElement | null>;
+    dataList: any[];
+    address: string | undefined;
+};
+
+type RankingData = GeneralRankingData | CampaignRankingData;
+type RankingProps = {
+    style?: React.CSSProperties;
+    className?: string;
+    fields: RankingColumnFields[];
+} & Omit<GeneralRankingScriptReturn, "dataList" | "dataSource"> & {
+    dataList: RankingData[];
+    dataSource: RankingData[];
+};
+declare const Ranking: FC<RankingProps>;
+
+type GeneralRankingWidgetProps = Pick<RankingProps, "style" | "className" | "fields"> & GeneralRankingScriptOptions;
+declare const GeneralRankingWidget: FC<GeneralRankingWidgetProps>;
+
+type CampaignRankingWidgetProps = Pick<RankingProps, "style" | "className" | "fields"> & CampaignRankingScriptOptions;
+declare const CampaignRankingWidget: FC<CampaignRankingWidgetProps>;
+
+type WeeklyDateRange = {
+    from: Date;
+    to: Date;
+    label: string;
+};
+
+type GeneralLeaderboardScriptReturn = ReturnType<typeof useGeneralLeaderboardScript>;
+declare const FilterDays: readonly [7, 14, 30, 90];
+type TFilterDays = (typeof FilterDays)[number];
+type GeneralLeaderboardScriptOptions = {
+    campaignDateRange?: {
+        start_time: Date | string;
+        end_time: Date | string;
+    };
+};
+declare function useGeneralLeaderboardScript(options?: GeneralLeaderboardScriptOptions): {
+    activeTab: LeaderboardTab;
+    onTabChange: react.Dispatch<react.SetStateAction<LeaderboardTab>>;
+    useCampaignDateRange: boolean;
+    weeklyRanges: WeeklyDateRange[];
+    currentOrAllTimeRange: WeeklyDateRange | undefined;
+    searchValue: string;
+    onSearchValueChange: (value: string) => void;
+    clearSearchValue: () => void;
+    filterItems: any;
+    onFilter: (filter: {
+        name: string;
+        value: any;
+    }) => void;
+    dateRange: DateRange;
+    filterDay: 30 | 7 | 14 | 90 | null;
+    updateFilterDay: (day: TFilterDays) => void;
+    setDateRange: react.Dispatch<react.SetStateAction<DateRange>>;
+};
+
+type GeneralLeaderboardProps = {
+    style?: React.CSSProperties;
+    className?: string;
+    campaignDateRange?: {
+        start_time: Date | string;
+        end_time: Date | string;
+    };
+} & GeneralLeaderboardScriptReturn;
+declare const GeneralLeaderboard: FC<GeneralLeaderboardProps>;
+
+type GeneralLeaderboardWidgetProps = Pick<GeneralLeaderboardProps, "style" | "className" | "campaignDateRange">;
+declare const GeneralLeaderboardWidget: FC<GeneralLeaderboardWidgetProps>;
+
+type CampaignLeaderboardScriptReturn = ReturnType<typeof useCampaignLeaderboardScript>;
+declare function useCampaignLeaderboardScript(): {
+    activeTab: LeaderboardTab;
+    onTabChange: react.Dispatch<react.SetStateAction<LeaderboardTab>>;
+    excludeColumns: RankingColumnFields[];
+};
+
+type CampaignLeaderboardProps = {
+    style?: React.CSSProperties;
+    className?: string;
+    campaignId: number | string;
+} & CampaignLeaderboardScriptReturn;
+declare const CampaignLeaderboard: FC<CampaignLeaderboardProps>;
+
+type CampaignLeaderboardWidgetProps = Pick<CampaignLeaderboardProps, "style" | "className" | "campaignId">;
+declare const CampaignLeaderboardWidget: FC<CampaignLeaderboardWidgetProps>;
+
+type LeaderboardPageProps = GeneralLeaderboardWidgetProps & TradingLeaderboardProviderProps & {
+    style?: React.CSSProperties;
+    className?: string;
+};
+declare const LeaderboardPage: FC<LeaderboardPageProps>;
+type LeaderboardSectionProps = {
+    style?: React.CSSProperties;
+    className?: string;
+};
+declare const LeaderboardSection: FC<LeaderboardSectionProps>;
+declare const LeaderboardTitle: (props: {
+    title: ReactNode;
+    isMobile?: boolean;
+}) => react_jsx_runtime.JSX.Element;
+
+export { type Campaign, type CampaignConfig, CampaignLeaderboard, type CampaignLeaderboardProps, CampaignLeaderboardWidget, type CampaignLeaderboardWidgetProps, CampaignRankingWidget, type CampaignRankingWidgetProps, type CampaignStatistics, type CampaignStatsDetailsResponse, type CampaignStatsResponse, CampaignTagEnum, Campaigns, type CampaignsProps, CampaignsWidget, GeneralLeaderboard, type GeneralLeaderboardProps, GeneralLeaderboardWidget, type GeneralLeaderboardWidgetProps, GeneralRankingWidget, type GeneralRankingWidgetProps, Leaderboard, type LeaderboardConfig, LeaderboardPage, type LeaderboardPageProps, type LeaderboardProps, LeaderboardSection, LeaderboardTitle, LeaderboardWidget, type LeaderboardWidgetProps, type PrizePool, type PrizePoolTier, Ranking, type RankingProps, type TicketLinearRule, type TicketRules, type TicketTierRule, TradingLeaderboardContext, TradingLeaderboardProvider, type TradingLeaderboardProviderProps, type TradingLeaderboardState, TradingList, type TradingListProps, TradingListWidget, type TradingListWidgetProps, type UserCampaignsResponse, type UserData, useCampaignLeaderboardScript, useCampaignRankingScript, useCampaignsScript, useGeneralLeaderboardScript, useGeneralRankingScript, useLeaderboardScript, useTradingLeaderboardContext, useTradingListScript };