@opexa/portal-components 0.1.22 → 0.1.24

package/dist/lib/client/utils/createRecipeContext.js

@@ -1,65 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import * as React from 'react';
-import { createSplitProps } from '../../utils/createSplitProps.js';
-export function createRecipeContext(recipe) {
-    const RecipeContext = React.createContext(null);
-    function useContext() {
-        const context = React.use(RecipeContext);
-        return context;
-    }
-    function withRootProvider(Component) {
-        const StyledComponent = (props) => {
-            const [recipeProps, localProps] = createSplitProps(recipe.variantKeys)(props);
-            const context = recipe(recipeProps);
-            return (_jsx(RecipeContext.Provider, { value: context, children: _jsx(Component, { ...localProps }) }));
-        };
-        return StyledComponent;
-    }
-    function withProvider(Component, slot) {
-        const StyledComponent = (props) => {
-            const [recipeProps, localProps] = createSplitProps(recipe.variantKeys)(props);
-            const context = recipe(recipeProps);
-            const slotName = slot;
-            const getStyle = context[slotName];
-            const userDefinedClassName = 'className' in localProps && typeof localProps.className === 'string'
-                ? localProps.className
-                : undefined;
-            const className = !getStyle
-                ? userDefinedClassName
-                : getStyle({
-                    ...recipeProps,
-                    className: userDefinedClassName,
-                });
-            return (_jsx(RecipeContext.Provider, { value: context, children: _jsx(Component, { ...localProps, className: className }) }));
-        };
-        StyledComponent.displayName = Component.displayName || Component.name;
-        return StyledComponent;
-    }
-    function withContext(Component, slot) {
-        const StyledComponent = (props) => {
-            const context = useContext();
-            const [recipeProps, localProps] = createSplitProps(recipe.variantKeys)(props);
-            const slotName = slot;
-            const getStyle = !context
-                ? recipe(recipeProps)[slotName]
-                : context[slotName];
-            const userDefinedClassName = 'className' in localProps && typeof localProps.className === 'string'
-                ? localProps.className
-                : undefined;
-            const className = !getStyle
-                ? userDefinedClassName
-                : getStyle({
-                    ...recipeProps,
-                    className: userDefinedClassName,
-                });
-            return _jsx(Component, { ...localProps, className: className });
-        };
-        StyledComponent.displayName = Component.displayName || Component.name;
-        return StyledComponent;
-    }
-    return {
-        withRootProvider,
-        withProvider,
-        withContext,
-    };
-}

package/dist/lib/client/utils/toaster.d.ts

@@ -1,2 +0,0 @@
-import { type CreateToasterReturn } from '@ark-ui/react/toast';
-export declare const toaster: CreateToasterReturn;

package/dist/lib/client/utils/toaster.js

@@ -1,8 +0,0 @@
-import { createToaster } from '@ark-ui/react/toast';
-export const toaster = createToaster({
-    placement: 'top',
-    duration: 5000,
-    max: 5,
-    overlap: true,
-    gap: 8,
-});

package/dist/lib/components/Account/Account.d.ts

@@ -1,3 +0,0 @@
-import type { AccountProps } from './Account.lazy';
-export declare function Account(props: AccountProps): import("react/jsx-runtime").JSX.Element | undefined;
-export type { AccountProps };

package/dist/lib/components/Account/Account.js

@@ -1,14 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import dynamic from 'next/dynamic';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
-const Component = dynamic(() => import('./Account.lazy.js').then((m) => m.Account), {
-    ssr: false,
-    loading: () => null,
-});
-export function Account(props) {
-    const touched = useGlobalStore(useShallow((ctx) => ctx.account['~touched']));
-    if (touched)
-        return _jsx(Component, { ...props });
-}

package/dist/lib/components/Account/Account.lazy.d.ts

@@ -1,57 +0,0 @@
-export interface ClassNameEntries {
-    root?: string;
-    positioner?: string;
-    walletActions?: string;
-    withdrawButton?: string;
-    depositButton?: string;
-    walletBalanceContainer?: string;
-    totalBalanceLabel?: string;
-    totalBalanceAmount?: string;
-    balanceDetailsContainer?: string;
-    depositBalanceLabel?: string;
-    depositBalanceAmount?: string;
-    bonusBalanceLabel?: string;
-    bonusBalanceAmount?: string;
-    navItemRoot?: string;
-    navItemLink?: string;
-    navItemIcon?: string;
-    navItemLabel?: string;
-    navItemBadge?: string;
-    navItemIndicator?: string;
-}
-export interface AccountProps {
-    className?: string | ClassNameEntries;
-    /**
-     * @default '0px'
-     * @example
-     * ```tsx
-     * offsetTop="1em"
-     * offsetTop="1rem"
-     * offsetTop="16px"
-     * ```
-     */
-    offsetTop?: string;
-    /** @default '/rewards' */
-    rewardsUrl?: string;
-    /** @default true */
-    rewardsEnabled?: boolean;
-    /** @default '/bet-records' */
-    betRecordsUrl?: string;
-    /** @default true */
-    betRecordsEnabled?: boolean;
-    /** @default '/transactions' */
-    transactionsUrl?: string;
-    /** @default true */
-    transactionsEnabled?: boolean;
-    /** @default '/account' */
-    accountSettingsUrl?: string;
-    /** @default true */
-    accountSettingsEnabled?: boolean;
-    /** @default true */
-    notificationsEnabled?: boolean;
-    /** @default true */
-    shouldShowAccountStatus?: boolean;
-    /** Avatar image source */
-    avatar?: string;
-}
-export declare function Account(props: AccountProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Account/Account.lazy.js

@@ -1,176 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Capacitor } from '@capacitor/core';
-import { isString } from 'lodash-es';
-import Image from 'next/image';
-import Link from 'next/link';
-import { useRouter } from 'next/navigation';
-import { twMerge } from 'tailwind-merge';
-import invariant from 'tiny-invariant';
-import { useShallow } from 'zustand/shallow';
-import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
-import { useBonusesCountQuery } from '../../client/hooks/useBonusesCountQuery.js';
-import { useCashbackBonusesCountQuery } from '../../client/hooks/useCashbackBonusesCountQuery.js';
-import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
-import { useMayaAuth } from '../../client/hooks/useMayaAuth.js';
-import { useProfileCompletionQuery } from '../../client/hooks/useProfileCompletionQuery.js';
-import { useSignOutMutation } from '../../client/hooks/useSignOutMutation.js';
-import { useUnreadMessagesCountQuery } from '../../client/hooks/useUnreadMessagesCountQuery.js';
-import { getSession } from '../../client/services/getSession.js';
-import { BIOMETRIC_STORAGE_KEY } from '../../client/utils/biometric.js';
-import { AlertCircleIcon } from '../../icons/AlertCircleIcon.js';
-import { Bell01Icon } from '../../icons/Bell01Icon.js';
-import { ChevronRightIcon } from '../../icons/ChevronRightIcon.js';
-import { CoinsStacked02Icon } from '../../icons/CoinsStacked02Icon.js';
-import { CoinsSwap02Icon } from '../../icons/CoinsSwap02Icon.js';
-import { Gift01Icon } from '../../icons/Gift01Icon.js';
-import { Logout01Icon } from '../../icons/Logout01Icon.js';
-import { Settings02Icon } from '../../icons/Settings02Icon.js';
-import avatarPlaceholder from '../../images/placeholder-avatar.png';
-import { unregisterFCMDevice } from '../../services/trigger.js';
-import { Badge } from '../../ui/Badge/index.js';
-import { Drawer } from '../../ui/Drawer/index.js';
-import { Popover } from '../../ui/Popover/index.js';
-import { Portal } from '../../ui/Portal/index.js';
-import { capitalize } from '../../utils/capitalize.js';
-import { getQueryClient } from '../../utils/getQueryClient.js';
-import { parseDecimal } from '../../utils/parseDecimal.js';
-import { getSessionQueryKey } from '../../utils/queryKeys.js';
-import { AccountPropsContext, useAccountPropsContext } from './AccountContext.js';
-import { accountRecipe } from './account.recipe.js';
-import { Wallet } from './Wallet.js';
-const defaultAccountProps = {
-    offsetTop: '0px',
-    rewardsUrl: '/rewards',
-    rewardsEnabled: true,
-    betRecordsUrl: '/bet-records',
-    betRecordsEnabled: true,
-    transactionsUrl: '/transactions',
-    transactionsEnabled: true,
-    accountSettingsUrl: '/account',
-    accountSettingsEnabled: true,
-    notificationsEnabled: true,
-    shouldShowAccountStatus: true,
-};
-const recipe = accountRecipe();
-export function Account(props) {
-    const router = useRouter();
-    const globalStore = useGlobalStore(useShallow((ctx) => ({
-        account: ctx.account,
-        account__mobile: ctx.account__mobile,
-    })));
-    const [mobileOffsetTop, desktopOffsetTop] = Array.isArray(props.offsetTop)
-        ? props.offsetTop
-        : [props.offsetTop ?? '0px', props.offsetTop ?? '0px'];
-    const classNames = isString(props.className)
-        ? { root: props.className }
-        : (props.className ?? {});
-    const contextValue = {
-        ...defaultAccountProps,
-        ...props,
-        className: props.className ?? undefined,
-    };
-    return (_jsxs(AccountPropsContext, { value: contextValue, children: [_jsx(Drawer.Root, { open: globalStore.account__mobile.open, onOpenChange: (details) => {
-                    globalStore.account__mobile.setOpen(details.open);
-                }, lazyMount: true, unmountOnExit: true, children: _jsx(Portal, { children: _jsx(Drawer.Positioner, { className: classNames.positioner, children: _jsx(Drawer.Content, { className: twMerge('relative', 'flex', 'flex-col', 'top-[var(--offset-top-mobile)]', 'h-[calc(100%-var(--offset-top-mobile))]', 'w-full', 'lg:top-[var(--offset-top-desktop)]', 'lg:h-[calc(100%-var(--offset-top-desktop))]', 'overflow-auto', classNames.root), style: {
-                                ['--offset-top-mobile']: mobileOffsetTop,
-                                ['--offset-top-desktop']: desktopOffsetTop,
-                            }, children: _jsxs("div", { className: "h-full overflow-y-auto px-xl py-6", children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router, classNames: classNames })] }) }) }) }) }), _jsx(Popover.Root, { open: globalStore.account.open, onOpenChange: (details) => {
-                    globalStore.account.setOpen(details.open);
-                }, lazyMount: true, unmountOnExit: true, positioning: {
-                    placement: 'bottom',
-                    strategy: 'fixed',
-                }, ids: {
-                    trigger: 'opexa-powerplay:account-trigger',
-                }, children: _jsx(Portal, { children: _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "relative z-popover max-h-[80vh] w-[23.438rem] ui-closed:animate-fade-out ui-open:animate-fade-in overflow-y-auto overscroll-contain rounded-xl border border-border-primary bg-bg-primary p-xl", style: {
-                                WebkitOverflowScrolling: 'touch',
-                            }, children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router, classNames: classNames })] }) }) }) })] }));
-}
-function Profile() {
-    const accountQuery = useAccountQuery();
-    const accountProps = useAccountPropsContext();
-    const account = accountQuery.data;
-    const getVerificationColorScheme = (status) => {
-        switch (status) {
-            case 'VERIFIED':
-                return 'success';
-            case 'PENDING':
-                return 'brand';
-            default:
-                return 'danger';
-        }
-    };
-    return (_jsxs("div", { className: "flex shrink-0 items-center gap-lg", children: [_jsx(Image, { src: accountProps.avatar || avatarPlaceholder, alt: "", width: 48, height: 48, className: "size-12" }), _jsxs("div", { className: "grow", children: [_jsx("p", { className: "font-semibold text-text-secondary-700 leading-tight", children: account?.name }), _jsxs("div", { className: "flex", children: [_jsxs("p", { className: "grow items-center text-text-tertiary-600 leading-tight", children: ["ID: ", account?.id] }), accountProps.shouldShowAccountStatus && (_jsxs(Badge.Root, { colorScheme: getVerificationColorScheme(account?.verificationStatus), className: "self-start", children: [_jsx(Badge.Indicator, {}), _jsx(Badge.Label, { children: capitalize(account?.verificationStatus || '') })] }))] })] })] }));
-}
-function Links({ router, classNames, }) {
-    const accountProps = useAccountPropsContext();
-    const globalStore = useGlobalStore(useShallow((ctx) => ({
-        account: ctx.account,
-        account__mobile: ctx.account__mobile,
-        messages: ctx.messages,
-    })));
-    const signOutMutation = useSignOutMutation({
-        onSuccess: async () => {
-            // Clear everything except the 'biometric' entry
-            const keep = new Set([BIOMETRIC_STORAGE_KEY]);
-            for (let i = 0; i < localStorage.length;) {
-                const key = localStorage.key(i);
-                if (key && !keep.has(key)) {
-                    localStorage.removeItem(key);
-                }
-                else {
-                    i++;
-                }
-            }
-            sessionStorage.clear();
-            router.replace('/');
-        },
-    });
-    const unreadMessagesCountQuery = useUnreadMessagesCountQuery({}, { refetchInterval: 5000 });
-    const unreadMessagesCount = unreadMessagesCountQuery.data ?? 0;
-    const profileCompletionQuery = useProfileCompletionQuery();
-    const profileCompletion = profileCompletionQuery.data;
-    const profileCompletionPercentage = parseDecimal(profileCompletion?.completionPercentage, 0);
-    const bonusesCountQuery = useBonusesCountQuery();
-    const bonusesCount = bonusesCountQuery.data ?? 0;
-    const cashbackBonusesCountQuery = useCashbackBonusesCountQuery();
-    const cashbackBonusesCount = cashbackBonusesCountQuery.data ?? 0;
-    const rewardsCount = bonusesCount + cashbackBonusesCount;
-    const { onMaya } = useMayaAuth();
-    return (_jsxs("nav", { className: recipe.nav({ className: 'mt-xl' }), children: [_jsxs("ul", { hidden: !accountProps.notificationsEnabled && !accountProps.rewardsEnabled, children: [_jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.notificationsEnabled, children: _jsxs("button", { type: "button", className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
-                                globalStore.account.setOpen(false);
-                                globalStore.account__mobile.setOpen(false);
-                                globalStore.messages.setOpen(true);
-                            }, children: [_jsx(Bell01Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Notifications" }), unreadMessagesCount > 0 && (_jsx("span", { className: twMerge(recipe.navItemBadge(), classNames.navItemBadge), "data-type": "warning", children: unreadMessagesCount })), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }), _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.rewardsEnabled, children: _jsxs(Link, { href: accountProps.rewardsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
-                                globalStore.account.setOpen(false);
-                                globalStore.account__mobile.setOpen(false);
-                            }, children: [_jsx(Gift01Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Rewards" }), rewardsCount > 0 && (_jsx("span", { className: twMerge(recipe.navItemBadge(), classNames.navItemBadge), "data-type": "warning", children: rewardsCount })), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) })] }), _jsx("ul", { hidden: !accountProps.accountSettingsEnabled, children: _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.accountSettingsEnabled, children: _jsxs(Link, { href: accountProps.accountSettingsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
-                            globalStore.account.setOpen(false);
-                            globalStore.account__mobile.setOpen(false);
-                        }, children: [_jsx(Settings02Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Settings" }), profileCompletionPercentage < 100 && (_jsx("span", { className: twMerge(recipe.navItemBadge(), classNames.navItemBadge), "data-type": "error", children: _jsx(AlertCircleIcon, {}) })), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }) }), _jsxs("ul", { hidden: !accountProps.betRecordsEnabled && !accountProps.transactionsEnabled, children: [_jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.betRecordsEnabled, children: _jsxs(Link, { href: accountProps.betRecordsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
-                                globalStore.account.setOpen(false);
-                                globalStore.account__mobile.setOpen(false);
-                            }, children: [_jsx(CoinsStacked02Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Bet Records" }), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }), _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.transactionsEnabled, children: _jsxs(Link, { href: accountProps.transactionsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
-                                globalStore.account.setOpen(false);
-                                globalStore.account__mobile.setOpen(false);
-                            }, children: [_jsx(CoinsSwap02Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Transactions" }), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) })] }), _jsx("ul", { children: _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: onMaya, children: _jsxs("button", { type: "button", className: twMerge(recipe.navItemLink(), classNames.navItemLink), disabled: signOutMutation.isPending, onClick: async () => {
-                            if (Capacitor.isNativePlatform()) {
-                                const session = await getQueryClient().fetchQuery({
-                                    queryKey: getSessionQueryKey(),
-                                    queryFn: async () => getSession(),
-                                });
-                                invariant(session.status === 'authenticated');
-                                await unregisterFCMDevice({
-                                    type: ['IOS', 'ANDROID'],
-                                }, {
-                                    headers: {
-                                        Authorization: `Bearer ${session.token}`,
-                                    },
-                                });
-                            }
-                            signOutMutation.mutate();
-                            globalStore.account.setOpen(false);
-                            globalStore.account__mobile.setOpen(false);
-                            router.push('/');
-                        }, children: [_jsx(Logout01Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Log Out" }), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }) })] }));
-}

package/dist/lib/components/Account/AccountContext.d.ts

@@ -1,6 +0,0 @@
-import type { AccountProps } from './Account.lazy';
-export declare const AccountPropsContext: (props: {
-    value: import("type-fest/source/required-deep").RequiredObjectDeep<AccountProps>;
-} & {
-    children?: import("react").ReactNode | undefined;
-}) => React.ReactNode, useAccountPropsContext: () => import("type-fest/source/required-deep").RequiredObjectDeep<AccountProps>;

package/dist/lib/components/Account/AccountContext.js

@@ -1,2 +0,0 @@
-import { createContext } from '../../client/utils/createContext.js';
-export const [AccountPropsContext, useAccountPropsContext] = createContext();

package/dist/lib/components/Account/AccountTrigger.d.ts

@@ -1,7 +0,0 @@
-import type { ComponentPropsWithRef } from 'react';
-export interface AccountTriggerProps extends ComponentPropsWithRef<'button'> {
-    asChild?: boolean;
-    /** Avatar image source */
-    avatar?: string;
-}
-export declare function AccountTrigger({ asChild, children, avatar, ...props }: AccountTriggerProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Account/AccountTrigger.js

@@ -1,26 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { ark } from '@ark-ui/react/factory';
-import Image from 'next/image';
-import { useMediaQuery } from 'usehooks-ts';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
-import { XIcon } from '../../icons/XIcon.js';
-import avatarPlaceholder from '../../images/placeholder-avatar.png';
-import { IconButton } from '../../ui/IconButton/index.js';
-export function AccountTrigger({ asChild, children, avatar, ...props }) {
-    const desktop = useMediaQuery('(min-width: 1024px)', {
-        defaultValue: true,
-    });
-    const globalStore = useGlobalStore(useShallow((ctx) => ({
-        account: ctx.account,
-        account__mobile: ctx.account__mobile,
-    })));
-    const disclosure = desktop
-        ? globalStore.account
-        : globalStore.account__mobile;
-    return (_jsx(ark.button, { type: "button", "aria-label": "Toggle account menu", "data-open": disclosure.open ? 'open' : 'closed', ...props, onClick: (e) => {
-            disclosure.setOpen(!disclosure.open);
-            return props.onClick?.(e);
-        }, asChild: !children ? true : asChild, children: children ?? (_jsx(IconButton, { id: "opexa-powerplay:account-trigger", size: "sm", colorScheme: "gray", children: !desktop && disclosure.open ? (_jsx(XIcon, {})) : (_jsx(Image, { src: avatar || avatarPlaceholder, alt: "", width: 64, height: 64, className: "size-10" })) })) }));
-}

package/dist/lib/components/Account/Wallet.d.ts

@@ -1,17 +0,0 @@
-export interface WalletClassNames {
-    walletActions?: string;
-    withdrawButton?: string;
-    depositButton?: string;
-    walletBalanceContainer?: string;
-    totalBalanceLabel?: string;
-    totalBalanceAmount?: string;
-    balanceDetailsContainer?: string;
-    depositBalanceLabel?: string;
-    depositBalanceAmount?: string;
-    bonusBalanceLabel?: string;
-    bonusBalanceAmount?: string;
-}
-export interface WalletProps {
-    classNames?: WalletClassNames;
-}
-export declare function Wallet({ classNames }: WalletProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Account/Wallet.example.d.ts

@@ -1,33 +0,0 @@
-/**
- * Example usage of the Wallet component
- *
- * Import the Wallet component:
- * ```tsx
- * import { Wallet } from '@opexa/portal-components/Account/Wallet';
- * ```
- *
- * Basic usage:
- * ```tsx
- * <Wallet />
- * ```
- *
- * With custom class names:
- * ```tsx
- * <Wallet
- *   classNames={{
- *     walletBalanceContainer: "custom-balance-container",
- *     totalBalanceAmount: "custom-total-amount",
- *     depositButton: "custom-deposit-btn",
- *     withdrawButton: "custom-withdraw-btn"
- *   }}
- * />
- * ```
- *
- * The Wallet component includes:
- * - Total balance display
- * - Deposit and bonus balance breakdown
- * - Deposit and Withdraw buttons
- * - Automatic wallet data fetching with 1-second refresh interval
- * - Integration with global store for deposit/withdrawal modals
- */
-export declare const WalletExample: () => import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Account/Wallet.example.js

@@ -1,36 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/**
- * Example usage of the Wallet component
- *
- * Import the Wallet component:
- * ```tsx
- * import { Wallet } from '@opexa/portal-components/Account/Wallet';
- * ```
- *
- * Basic usage:
- * ```tsx
- * <Wallet />
- * ```
- *
- * With custom class names:
- * ```tsx
- * <Wallet
- *   classNames={{
- *     walletBalanceContainer: "custom-balance-container",
- *     totalBalanceAmount: "custom-total-amount",
- *     depositButton: "custom-deposit-btn",
- *     withdrawButton: "custom-withdraw-btn"
- *   }}
- * />
- * ```
- *
- * The Wallet component includes:
- * - Total balance display
- * - Deposit and bonus balance breakdown
- * - Deposit and Withdraw buttons
- * - Automatic wallet data fetching with 1-second refresh interval
- * - Integration with global store for deposit/withdrawal modals
- */
-export const WalletExample = () => {
-    return (_jsxs("div", { className: "p-4", children: [_jsx("h2", { className: 'mb-4 font-bold text-xl', children: "Wallet Component Example" }), _jsx("p", { className: 'mb-4 text-gray-600', children: "The Wallet component is now available as a standalone component that you can use anywhere in your application." }), _jsxs("div", { className: 'rounded-lg bg-gray-100 p-4', children: [_jsx("h3", { className: 'mb-2 font-semibold', children: "Import:" }), _jsxs("code", { className: 'block rounded bg-white p-2 text-sm', children: ["import ", `{ Wallet }`, " from '@opexa/portal-components/Account/Wallet';"] })] }), _jsxs("div", { className: 'mt-4 rounded-lg bg-gray-100 p-4', children: [_jsx("h3", { className: 'mb-2 font-semibold', children: "Usage:" }), _jsx("code", { className: 'block rounded bg-white p-2 text-sm', children: `<Wallet classNames={{ walletActions: "custom-actions" }} />` })] })] }));
-};

package/dist/lib/components/Account/Wallet.js

@@ -1,54 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { isNil } from 'lodash-es';
-import { twMerge } from 'tailwind-merge';
-import { useShallow } from 'zustand/shallow';
-import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
-import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
-import { useWalletQuery } from '../../client/hooks/useWalletQuery.js';
-import { Button } from '../../ui/Button/index.js';
-import { formatNumber } from '../../utils/formatNumber.js';
-import { parseDecimal } from '../../utils/parseDecimal.js';
-export function Wallet({ classNames = {} }) {
-    const localeInfo = useLocaleInfo();
-    const walletQuery = useWalletQuery({
-        refetchInterval: 1000,
-    });
-    const globalStore = useGlobalStore(useShallow((ctx) => ({
-        profile: ctx.account,
-        mobileProfile: ctx.account__mobile,
-        depositWithdrawal: ctx.depositWithdrawal,
-    })));
-    const depositBalance = parseDecimal(walletQuery.data?.balance, 0);
-    const bonusBalance = parseDecimal(walletQuery.data?.bonus, 0);
-    const totalBalance = depositBalance + bonusBalance;
-    const turnoverRequirement = parseDecimal(walletQuery.data?.turnoverRequirement);
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: twMerge('mt-3 overflow-hidden rounded-xl border border-border-primary', classNames.walletBalanceContainer), children: [_jsxs("div", { className: "bg-bg-tertiary p-xl", children: [_jsx("div", { className: twMerge('text-sm text-text-secondary-700', classNames.totalBalanceLabel), children: "Total Balance" }), _jsx("div", { className: twMerge('font-bold text-3xl', classNames.totalBalanceAmount), children: formatNumber(totalBalance, {
-                                    currency: localeInfo?.currency.code,
-                                    minDecimalPlaces: 2,
-                                }) }), _jsxs("div", { className: twMerge('mt-1.5 flex gap-7xl', classNames.balanceDetailsContainer), children: [_jsxs("div", { children: [_jsx("p", { className: twMerge('text-2xs text-text-secondary-700', classNames.depositBalanceLabel), children: "Deposit Balance" }), _jsx("p", { className: twMerge('text-medium text-text-primary-brand', classNames.depositBalanceAmount), children: formatNumber(depositBalance, {
-                                                    currency: localeInfo?.currency.code,
-                                                    minDecimalPlaces: 2,
-                                                }) })] }), _jsxs("div", { children: [_jsx("p", { className: twMerge('text-2xs text-text-secondary-700', classNames.bonusBalanceLabel), children: "Bonus Balance" }), _jsx("p", { className: twMerge('text-medium text-text-primary-brand', classNames.bonusBalanceAmount), children: formatNumber(bonusBalance, {
-                                                    currency: localeInfo?.currency.code,
-                                                    minDecimalPlaces: 2,
-                                                }) })] })] })] }), !isNil(turnoverRequirement) && turnoverRequirement > 0 && (_jsxs("div", { className: "border-border-primary border-t bg-bg-quaternary px-xl py-2", children: [_jsx("p", { className: "text-2xs leading-tight", children: "Deposit Turnover Requirement" }), _jsx("p", { className: "mt-1 font-medium text-xs leading-tight", children: formatNumber(turnoverRequirement, {
-                                    currency: localeInfo?.currency.code,
-                                    minDecimalPlaces: 1,
-                                    maxDecimalPlaces: 2,
-                                }) }), _jsxs("p", { className: "mt-0.5 text-2xs text-text-tertiary-600 leading-tight", children: ["You need to wager", ' ', _jsx("span", { className: "font-medium text-text-warning-primary-600 leading-tight", children: formatNumber(turnoverRequirement, {
-                                            currency: localeInfo?.currency.code,
-                                            minDecimalPlaces: 1,
-                                            maxDecimalPlaces: 2,
-                                        }) }), ' ', "to meet this requirement before you can withdraw."] })] }))] }), _jsxs("div", { className: twMerge('mt-3 flex gap-lg', classNames.walletActions), children: [_jsx(Button, { size: "xs", variant: "outline", className: classNames.withdrawButton, onClick: () => {
-                            globalStore.depositWithdrawal.setOpen(true);
-                            globalStore.depositWithdrawal.setTab('WITHDRAWAL');
-                            globalStore.profile.setOpen(false);
-                            globalStore.mobileProfile.setOpen(false);
-                        }, children: "Withdraw" }), _jsx(Button, { size: "xs", className: classNames.depositButton, onClick: () => {
-                            globalStore.depositWithdrawal.setOpen(true);
-                            globalStore.depositWithdrawal.setTab('DEPOSIT');
-                            globalStore.profile.setOpen(false);
-                            globalStore.mobileProfile.setOpen(false);
-                        }, children: "Deposit" })] })] }));
-}

package/dist/lib/components/Account/account.recipe.d.ts

@@ -1,61 +0,0 @@
-export declare const accountRecipe: import("tailwind-variants").TVReturnType<{
-    [key: string]: {
-        [key: string]: import("tailwind-variants").ClassValue | {
-            nav?: import("tailwind-variants").ClassValue;
-            navItemRoot?: import("tailwind-variants").ClassValue;
-            navItemLink?: import("tailwind-variants").ClassValue;
-            navItemIcon?: import("tailwind-variants").ClassValue;
-            navItemLabel?: import("tailwind-variants").ClassValue;
-            navItemIndicator?: import("tailwind-variants").ClassValue;
-            navItemBadge?: import("tailwind-variants").ClassValue;
-        };
-    };
-} | {
-    [x: string]: {
-        [x: string]: import("tailwind-variants").ClassValue | {
-            nav?: import("tailwind-variants").ClassValue;
-            navItemRoot?: import("tailwind-variants").ClassValue;
-            navItemLink?: import("tailwind-variants").ClassValue;
-            navItemIcon?: import("tailwind-variants").ClassValue;
-            navItemLabel?: import("tailwind-variants").ClassValue;
-            navItemIndicator?: import("tailwind-variants").ClassValue;
-            navItemBadge?: import("tailwind-variants").ClassValue;
-        };
-    };
-} | {}, {
-    nav: string;
-    navItemRoot: string;
-    navItemLink: string;
-    navItemIcon: string;
-    navItemLabel: string;
-    navItemIndicator: string;
-    navItemBadge: string[];
-}, undefined, {
-    [key: string]: {
-        [key: string]: import("tailwind-variants").ClassValue | {
-            nav?: import("tailwind-variants").ClassValue;
-            navItemRoot?: import("tailwind-variants").ClassValue;
-            navItemLink?: import("tailwind-variants").ClassValue;
-            navItemIcon?: import("tailwind-variants").ClassValue;
-            navItemLabel?: import("tailwind-variants").ClassValue;
-            navItemIndicator?: import("tailwind-variants").ClassValue;
-            navItemBadge?: import("tailwind-variants").ClassValue;
-        };
-    };
-} | {}, {
-    nav: string;
-    navItemRoot: string;
-    navItemLink: string;
-    navItemIcon: string;
-    navItemLabel: string;
-    navItemIndicator: string;
-    navItemBadge: string[];
-}, import("tailwind-variants").TVReturnType<unknown, {
-    nav: string;
-    navItemRoot: string;
-    navItemLink: string;
-    navItemIcon: string;
-    navItemLabel: string;
-    navItemIndicator: string;
-    navItemBadge: string[];
-}, undefined, unknown, unknown, undefined>>;

package/dist/lib/components/Account/account.recipe.js

@@ -1,32 +0,0 @@
-import { tv } from 'tailwind-variants';
-export const accountRecipe = tv({
-    slots: {
-        nav: 'space-y-xl',
-        navItemRoot: 'block bg-bg-primary-alt first:rounded-t-xl last:rounded-b-xl',
-        navItemLink: 'flex w-full items-center px-xl py-xl text-left font-semibold text-sm',
-        navItemIcon: 'size-5 text-text-nav-item-button-icon',
-        navItemLabel: 'ml-lg grow',
-        navItemIndicator: 'size-5 text-gray-400 text-text-quarterary-500',
-        navItemBadge: [
-            'mr-md',
-            'flex',
-            'items-center',
-            'justify-center',
-            'border',
-            'rounded-full',
-            'h-5.5',
-            'ui-type-[warning]:min-w-6',
-            'ui-type-[warning]:text-xs',
-            'ui-type-[warning]:font-medium',
-            'ui-type-[warning]:leading-tight',
-            'ui-type-[warning]:border-utility-brand-200',
-            'ui-type-[warning]:bg-utility-brand-50',
-            'ui-type-[warning]:text-utility-brand-700',
-            'ui-type-[error]:w-5.5',
-            'ui-type-[error]:icon:size-3',
-            'ui-type-[error]:border-utility-warning-200',
-            'ui-type-[error]:bg-utility-warning-50',
-            'ui-type-[error]:text-utility-warning-500',
-        ],
-    },
-});

package/dist/lib/components/Account/index.d.ts

@@ -1,3 +0,0 @@
-export * from './Account';
-export * from './AccountTrigger';
-export * from './Wallet';

package/dist/lib/components/Account/index.js

@@ -1,3 +0,0 @@
-export * from './Account.js';
-export * from './AccountTrigger.js';
-export * from './Wallet.js';