@opexa/portal-components 0.0.957 → 0.0.959

package/dist/lib/components/KYC/KYCSumsub.js

@@ -0,0 +1,166 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import Sumsub from '@sumsub/websdk-react';
+import { isObject } from 'lodash-es';
+import { useEffect, useRef, useState } from 'react';
+import { useShallow } from 'zustand/shallow';
+import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
+import { useGenerateSumsubVerificationTokenMutation } from '../../client/hooks/useGenerateSumsubVerificationTokenMutation.js';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import { useMemberVerificationQuery } from '../../client/hooks/useMemberVerificationQuery.js';
+import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
+import { XIcon } from '../../icons/XIcon.js';
+import { Dialog } from '../../ui/Dialog/index.js';
+import { Portal } from '../../ui/Portal/index.js';
+import { getQueryClient } from '../../utils/getQueryClient.js';
+import { getAccountQueryKey, getMemberVerificationQueryKey, getProfileCompletionQueryKey, } from '../../utils/queryKeys.js';
+import { KYCReminder } from './KYCReminder.js';
+export function KYCSumsub(props) {
+    const [open, setOpen] = useGlobalStore(useShallow((ctx) => [ctx.kyc.open, ctx.kyc.setOpen]));
+    const dummyRef = useRef(null);
+    const { data: session } = useSessionQuery();
+    const { data: account } = useAccountQuery();
+    const { data: MemberVerification } = useMemberVerificationQuery();
+    const isVerified = account?.verificationStatus === 'VERIFIED' ||
+        (MemberVerification?.sumsubVerified ?? false);
+    const { mutate, mutateAsync, reset, isIdle } = useGenerateSumsubVerificationTokenMutation();
+    const [token, setToken] = useState('');
+    useEffect(() => {
+        if (session?.status === 'authenticated' &&
+            open === true &&
+            isIdle &&
+            !token) {
+            mutate(undefined, {
+                onSuccess(token) {
+                    setToken(token);
+                },
+            });
+        }
+    }, [
+        /**/
+        open,
+        token,
+        isIdle,
+        mutate,
+        session?.status,
+    ]);
+    return (_jsxs(_Fragment, { children: [_jsx(Dialog.Root, { open: open && session?.status === 'authenticated' && !isVerified, onOpenChange: (details) => {
+                    setOpen(details.open);
+                }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, initialFocusEl: () => dummyRef.current, closeOnInteractOutside: false, onInteractOutside: (e) => {
+                    e.preventDefault();
+                }, restoreFocus: false, onExitComplete: () => {
+                    reset();
+                    setToken('');
+                }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { className: "flex items-center justify-center lg:block", children: _jsxs(Dialog.Content, { className: "mx-auto flex h-full w-[calc(100%-2rem)] flex-col items-center justify-center overflow-y-auto rounded-md bg-transparent p-0 lg:mt-3 lg:block lg:h-auto lg:w-[600px]", children: [_jsx("div", { ref: dummyRef, tabIndex: -1 }), props.isSkippable && (_jsx(Dialog.Context, { children: (api) => (_jsx("div", { className: "mb-3 flex w-full justify-end", children: _jsxs("button", { type: "button", className: "rounded-full bg-white/10 p-1 text-white backdrop-blur-md", onClick: () => {
+                                                    api.setOpen(false);
+                                                }, children: [_jsx(XIcon, { className: "!size-5" }), _jsx("span", { className: "sr-only", children: "Close" })] }) })) })), token && (_jsx("div", { className: "max-h-[calc(96dvh-2rem)] w-full overflow-y-auto lg:h-auto lg:max-h-[unset]", children: _jsx(Sumsub, { accessToken: token, expirationHandler: async () => {
+                                                const token = await mutateAsync();
+                                                return token;
+                                            }, config: {
+                                                lang: 'en',
+                                                theme: 'dark',
+                                            }, options: {
+                                                debug: process.env.NODE_ENV === 'development',
+                                                addViewportTag: false,
+                                                adaptIframeHeight: true,
+                                                enableScrollIntoView: true,
+                                            }, onMessage: (type, payload) => {
+                                                /*
+    
+                                                ------------------------
+                                                    REJECTED
+                                                ------------------------
+                                                
+                                                {
+                                                    "type": "idCheck.onApplicantStatusChanged",
+                                                    "payload": {
+                                                        "reviewId": "toJnn",
+                                                        "attemptId": "ooaKO",
+                                                        "attemptCnt": 1,
+                                                        "elapsedSincePendingMs": 1072,
+                                                        "elapsedSinceQueuedMs": 1072,
+                                                        "reprocessing": true,
+                                                        "levelName": "id-and-liveness",
+                                                        "levelAutoCheckMode": null,
+                                                        "createDate": "2025-07-18 02:08:16+0000",
+                                                        "reviewDate": "2025-07-18 02:08:17+0000",
+                                                        "reviewResult": {
+                                                            "moderationComment": "We couldn’t verify your...",
+                                                            "reviewAnswer": "RED",
+                                                            "reviewRejectType": "FINAL"
+                                                        },
+                                                        "reviewStatus": "completed",
+                                                        "priority": 0
+                                                    }
+                                                }
+                                                
+                                                ------------------------
+                                                    APPROVED
+                                                ------------------------
+    
+                                                {
+                                                    "type": "idCheck.onApplicantStatusChanged",
+                                                    "payload": {
+                                                        "reviewId": "RCAdU",
+                                                        "attemptId": "iaOXv",
+                                                        "attemptCnt": 1,
+                                                        "elapsedSincePendingMs": 1956,
+                                                        "elapsedSinceQueuedMs": 1956,
+                                                        "reprocessing": true,
+                                                        "levelName": "id-and-selfie",
+                                                        "levelAutoCheckMode": null,
+                                                        "createDate": "2025-07-18 02:17:52+0000",
+                                                        "reviewDate": "2025-07-18 02:17:54+0000",
+                                                        "reviewResult": {
+                                                            "reviewAnswer": "GREEN"
+                                                        },
+                                                        "reviewStatus": "completed",
+                                                        "priority": 0
+                                                    }
+                                                }
+    
+                                                */
+                                                const queryClient = getQueryClient();
+                                                if (type === 'idCheck.onApplicantStatusChanged' &&
+                                                    isObject(payload) &&
+                                                    'reviewStatus' in payload &&
+                                                    payload.reviewStatus === 'completed' &&
+                                                    'reviewResult' in payload &&
+                                                    isObject(payload.reviewResult) &&
+                                                    'reviewAnswer' in payload.reviewResult &&
+                                                    payload.reviewResult.reviewAnswer === 'GREEN') {
+                                                    queryClient.setQueryData(getMemberVerificationQueryKey(), (prev) => ({
+                                                        id: '',
+                                                        address: '',
+                                                        nationality: '',
+                                                        natureOfWork: '',
+                                                        placeOfBirth: '',
+                                                        sourceOfIncome: '',
+                                                        permanentAddress: '',
+                                                        selfieImage: { id: '', url: '', status: 'READY' },
+                                                        idFrontImage: { id: '', url: '', status: 'READY' },
+                                                        ...(prev ?? {}),
+                                                        status: 'APPROVED',
+                                                        sumsubVerified: true,
+                                                    }));
+                                                    queryClient.setQueryData(getAccountQueryKey(), (prev) => {
+                                                        if (!prev)
+                                                            return prev;
+                                                        return {
+                                                            ...prev,
+                                                            verified: true,
+                                                        };
+                                                    });
+                                                    queryClient.setQueryData(getProfileCompletionQueryKey(), (prev) => {
+                                                        if (!prev)
+                                                            return prev;
+                                                        return {
+                                                            ...prev,
+                                                            accountVerification: true,
+                                                        };
+                                                    });
+                                                }
+                                            }, onError: (error) => {
+                                                console.warn(error);
+                                            }, className: "block max-h-full w-full overflow-y-auto rounded-md", force: true }) }))] }) })] }) }), _jsx(KYCReminder, { ...props })] }));
+}

package/dist/lib/components/KYC/KYCTrigger.d.ts

@@ -0,0 +1,5 @@
+import type { ComponentPropsWithRef } from 'react';
+export interface KYCTriggerProps extends ComponentPropsWithRef<'button'> {
+    asChild?: boolean;
+}
+export declare function KYCTrigger(props: KYCTriggerProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/KYC/KYCTrigger.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { ark } from '@ark-ui/react/factory';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+export function KYCTrigger(props) {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        kyc: ctx.kyc,
+    })));
+    return (_jsx(ark.button, { type: "button", "aria-label": "Verify your identity now", "data-state": globalStore.kyc.open ? 'open' : 'closed', ...props, onClick: (e) => {
+            globalStore.kyc.setOpen(true);
+            return props.onClick?.(e);
+        } }));
+}

package/dist/lib/components/KYC/KycOpenOnHomeMount.d.ts

@@ -0,0 +1,5 @@
+export interface KycOpenOnHomeMountProps {
+    isSkippable?: boolean;
+    bypassKycCheck?: boolean;
+}
+export declare function KycOpenOnHomeMount(props: KycOpenOnHomeMountProps): null;

package/dist/lib/components/KYC/KycOpenOnHomeMount.js

@@ -0,0 +1,78 @@
+'use client';
+import { useEffect } from 'react';
+import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import { useMemberVerificationQuery } from '../../client/hooks/useMemberVerificationQuery.js';
+export function KycOpenOnHomeMount(props) {
+    const setkycReminderOpen = useGlobalStore((s) => s.kycReminder.setOpen);
+    const setkycOpen = useGlobalStore((s) => s.kyc.setOpen);
+    const { data: verification, isLoading: verificationLoading } = useMemberVerificationQuery();
+    const { data: account, isLoading: accountLoading } = useAccountQuery();
+    const isVerificationLocked = account?.status === 'VERIFICATION_LOCKED';
+    const isRejected = verification?.status === 'REJECTED';
+    const isUnverified = verification === null ||
+        verification?.status === 'UNVERIFIED' ||
+        verification?.status === 'CREATED';
+    const isKycCompleted = account?.verified ||
+        verification?.sumsubVerified ||
+        verification?.status === 'APPROVED' ||
+        verification?.status === 'PENDING' ||
+        verification?.status === 'VERIFIED'; //add default value on null return
+    useEffect(() => {
+        // If bypass is enabled, do nothing.
+        if (props.bypassKycCheck) {
+            return;
+        }
+        if (!verificationLoading && !accountLoading) {
+            const shouldShowReminder = Boolean(props.isSkippable);
+            const hasSeenKycModal = sessionStorage.getItem('hasSeenKycModal');
+            const isFirstVisit = !hasSeenKycModal;
+            // Handle rejected verification status
+            if (isRejected) {
+                if (isFirstVisit) {
+                    setkycReminderOpen(false);
+                    setkycOpen(true);
+                    sessionStorage.setItem('hasSeenKycModal', 'true');
+                }
+                else {
+                    setkycReminderOpen(shouldShowReminder);
+                    setkycOpen(!shouldShowReminder);
+                }
+            }
+            // Handle unverified verification status
+            else if (isUnverified) {
+                if (isFirstVisit) {
+                    setkycReminderOpen(false);
+                    setkycOpen(true);
+                    sessionStorage.setItem('hasSeenKycModal', 'true');
+                }
+                else {
+                    setkycReminderOpen(shouldShowReminder);
+                    setkycOpen(!shouldShowReminder);
+                }
+            }
+            // Handle member verification locked
+            else if (isVerificationLocked) {
+                setkycReminderOpen(true);
+            }
+            // Handle completed kyc progress
+            else if (isKycCompleted) {
+                setkycReminderOpen(false);
+                setkycOpen(false);
+                sessionStorage.removeItem('hasSeenKycModal');
+            }
+        }
+    }, [
+        setkycReminderOpen,
+        setkycOpen,
+        verificationLoading,
+        accountLoading,
+        isVerificationLocked,
+        isRejected,
+        isUnverified,
+        isKycCompleted,
+        props.isSkippable,
+        props.bypassKycCheck,
+    ]);
+    return null;
+}

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

@@ -0,0 +1,4 @@
+export * from './KYC';
+export * from './KYCDefault/KYCVerificationStatus';
+export * from './KYCTrigger';
+export * from './KycOpenOnHomeMount';

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

@@ -0,0 +1,4 @@
+export * from './KYC.js';
+export * from './KYCDefault/KYCVerificationStatus.js';
+export * from './KYCTrigger.js';
+export * from './KycOpenOnHomeMount.js';

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

@@ -0,0 +1,5 @@
+export interface MarqueeProps {
+    children?: React.ReactNode;
+    className?: string;
+}
+export declare function Marquee(props: MarqueeProps): Promise<import("react/jsx-runtime").JSX.Element>;

package/dist/lib/components/Marquee/Marquee.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { twMerge } from 'tailwind-merge';
+export async function Marquee(props) {
+    return (_jsxs("div", { className: twMerge('flex gap-lg rounded-lg border border-border-primary bg-bg-primary p-1 pr-2.5 font-medium text-sm text-text-secondary-700 shadow-xs', props.className), children: [_jsxs("div", { className: "flex shrink-0 items-center gap-sm rounded-sm border border-border-primary px-2 py-0.5", children: [_jsx("span", { className: "size-2 rounded-full bg-utility-success-500 outline-2 outline-utility-success-100" }), _jsx("span", { children: "What's new" })] }), _jsx("div", { className: "flex grow items-center overflow-hidden", children: _jsxs("div", { className: "flex items-center whitespace-nowrap", children: [_jsx("div", { className: "animate-marquee pr-4 [animation-delay:1s]", children: props.children }), _jsx("div", { className: "animate-marquee pr-4 [animation-delay:1s]", children: props.children })] }) })] }));
+}

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

@@ -0,0 +1 @@
+export * from './Marquee';

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

@@ -0,0 +1 @@
+export * from './Marquee.js';

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

@@ -0,0 +1,26 @@
+import { type ImageProps } from 'next/image';
+export interface ClassNameEntries {
+    root?: string;
+    banner?: string;
+    logo?: string;
+    progressRoot?: string;
+    progressTrack?: string;
+    progressTrackCompleteBG?: string;
+    progressTrackIncompleteBG?: string;
+    progressTrackOuter?: string;
+    progressTrackInner?: string;
+    progressBar?: string;
+    progressLabel?: string;
+    licensedBy?: string;
+    pagcorLogo?: string;
+    responsibleGamingLogo?: string;
+}
+interface MayaProps {
+    logo: ImageProps['src'];
+    responsibleGamingLogo?: ImageProps['src'];
+    pagcorLogo?: ImageProps['src'];
+    banner?: ImageProps['src'];
+    className?: string | ClassNameEntries;
+}
+export declare function Maya({ logo, responsibleGamingLogo, pagcorLogo, banner, className, }: MayaProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/lib/components/Maya/Maya.js

@@ -0,0 +1,90 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { isString } from 'lodash-es';
+import Image, {} from 'next/image';
+import { useRouter, useSearchParams } from 'next/navigation';
+import { useEffect, useState } from 'react';
+import { twMerge } from 'tailwind-merge';
+import { useMayaAuth } from '../../client/hooks/useMayaAuth.js';
+import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
+import { useSignInMutation } from '../../client/hooks/useSignInMutation.js';
+import { signOut } from '../../client/services/signOut.js';
+import { toaster } from '../../client/utils/toaster.js';
+import pagcorLogoDefault from '../../images/pagcor2.png';
+import responsibleGamingLogoDefault from '../../images/responsible-gaming.png';
+export function Maya({ logo, responsibleGamingLogo, pagcorLogo, banner, className, }) {
+    const signIn = useSignInMutation();
+    const router = useRouter();
+    const searchParams = useSearchParams();
+    const [progress, setProgress] = useState(0);
+    const [complete, setComplete] = useState(false);
+    const { mayaSessIdKey } = useMayaAuth();
+    const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+    const session = useSessionQuery();
+    const mayaSessionId = searchParams.get('sessionId');
+    const classNames = isString(className)
+        ? { root: className }
+        : (className ?? {});
+    const init = async () => {
+        setProgress(25);
+        if (session.data?.status === 'authenticated') {
+            if (mayaSessionId) {
+                if (localStorage.getItem(mayaSessIdKey) === mayaSessionId) {
+                    setProgress(100);
+                    return;
+                }
+                setProgress(50);
+                await signOut();
+                await sleep(1000);
+            }
+            else {
+                setProgress(100);
+                return;
+            }
+        }
+        if (!mayaSessionId) {
+            setProgress(100);
+            throw new Error('Maya session ID is required');
+        }
+        await new Promise((resolve, reject) => {
+            signIn.mutate({ type: 'MAYA', session: mayaSessionId }, {
+                onSuccess: () => {
+                    setProgress(100);
+                    setComplete(true);
+                    resolve();
+                },
+                onError: (error) => {
+                    setProgress(100);
+                    setComplete(true);
+                    reject(error);
+                },
+            });
+        });
+        await sleep(1000);
+    };
+    // biome-ignore lint/correctness/useExhaustiveDependencies: Only run on mount; dependencies intentionally omitted to avoid re-running effect on changes.
+    useEffect(() => {
+        const runInit = async () => {
+            try {
+                await init();
+                if (mayaSessionId) {
+                    localStorage.setItem(mayaSessIdKey, mayaSessionId);
+                }
+                // Wait briefly to ensure localStorage is flushed before navigation.
+                await new Promise((resolve) => setTimeout(resolve, 50));
+                router.replace('/');
+            }
+            catch (error) {
+                console.error('Maya init error:', error);
+                toaster.error({
+                    title: 'Login Failed',
+                    description: 'Failed to login. Please try again.',
+                });
+            }
+        };
+        runInit();
+    }, []);
+    return (_jsxs("div", { className: twMerge('relative flex min-h-screen flex-col bg-[#1F1F1F]', classNames.root), children: [banner && (_jsx(Image, { src: banner, alt: "brand logo", fill: true, className: twMerge('w-full grow object-contain object-top', classNames.banner) })), _jsxs("div", { className: twMerge('absolute bottom-safe-area-inset-bottom w-full shrink-0 bg-[#1F1F1F] p-6', classNames.progressRoot), children: [_jsxs("div", { children: [_jsx(Image, { src: logo, alt: "brand logo", height: 50, width: 120, className: twMerge('mx-auto mb-5 h-12.5 w-auto', classNames.logo) }), _jsx("div", { className: twMerge('overflow-hidden rounded-full p-px', !complete &&
+                                    (classNames.progressTrackIncompleteBG ?? 'bg-[#373A41]'), complete &&
+                                    (classNames.progressTrackCompleteBG ?? 'bg-[#ffb300]'), classNames.progressTrack), id: "progress:root", role: "progressbar", "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": progress, "aria-labelledby": "progress:label", children: _jsx("div", { className: twMerge('rounded-full bg-[#1F1F1F] p-px', classNames.progressTrackOuter), children: _jsx("div", { className: twMerge('relative h-4 w-full overflow-hidden rounded-full bg-[#22262e]', classNames.progressTrackInner), children: _jsx("div", { className: twMerge('absolute left-0 h-full rounded-full bg-[#ffb300] transition-all duration-150', classNames.progressBar), style: { width: `${progress}%` } }) }) }) }), _jsxs("span", { id: "progress:label", className: twMerge('mt-3 block text-center text-[#CECFD2] text-sm', classNames.progressLabel), children: [progress, "% Loading..."] })] }), _jsxs("div", { className: twMerge('mt-7 flex items-center justify-center gap-2 text-[#94969C] text-xs', classNames.licensedBy), children: [_jsx("span", { children: "Officially Licensed by" }), _jsx(Image, { src: pagcorLogo ?? pagcorLogoDefault, alt: "PAGCOR logo", height: 43, width: 88, className: twMerge('h-[43px] w-auto shrink-0', classNames.pagcorLogo), draggable: false, unoptimized: true }), _jsx(Image, { src: responsibleGamingLogo ?? responsibleGamingLogoDefault, alt: "Responsible Gaming logo", height: 50, width: 186, className: twMerge('h-[50px] w-auto shrink-0', classNames.responsibleGamingLogo), draggable: false, unoptimized: true })] })] })] }));
+}

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

@@ -0,0 +1 @@
+export * from './Maya';

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

@@ -0,0 +1 @@
+export * from './Maya.js';

package/dist/lib/components/Messages/MessageIcon.d.ts

@@ -0,0 +1,7 @@
+import type { ComponentPropsWithRef } from 'react';
+import type { Merge } from 'type-fest';
+import type { MessageIcon as TMessageIcon } from '../../types';
+export type MessageIconProps = Merge<ComponentPropsWithRef<'svg'>, {
+    type: TMessageIcon;
+}>;
+export declare function MessageIcon(props: MessageIconProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Messages/MessageIcon.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { AlertTriangleIcon } from '../../icons/AlertTriangle.js';
+import { AnnotationInfoIcon } from '../../icons/AnnotationInfoIcon.js';
+import { BellRinging04Icon } from '../../icons/BellRinging04Icon.js';
+import { CheckCircleIcon } from '../../icons/CheckCircleIcon.js';
+import { ConfettiIcon } from '../../icons/ConfettiIcon.js';
+import { Gift01Icon } from '../../icons/Gift01Icon.js';
+const MAP = {
+    ALERT: AlertTriangleIcon,
+    CELEBRATE: ConfettiIcon,
+    CHECK: CheckCircleIcon,
+    MESSAGE: BellRinging04Icon,
+    CONGRATS: Gift01Icon,
+    INFO: AnnotationInfoIcon,
+};
+export function MessageIcon(props) {
+    const { type, ...rest } = props;
+    const Component = MAP[type];
+    return _jsx(Component, { ...rest });
+}

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

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

package/dist/lib/components/Messages/Messages.js

@@ -0,0 +1,18 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import dynamic from 'next/dynamic';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import { MessagesPropsProvider } from './MessagesContext.js';
+const Component = dynamic(() => import('./Messages.lazy.js').then((mod) => mod.Messages), {
+    ssr: false,
+    loading: () => null,
+});
+const MessagesPopup = dynamic(() => import('./MessagesPopup.js').then((mod) => mod.MessagesPopup), {
+    ssr: false,
+    loading: () => null,
+});
+export function Messages(props) {
+    const touched = useGlobalStore(useShallow((ctx) => ctx.messages['~touched']));
+    return (_jsxs(MessagesPropsProvider, { value: props, children: [touched && _jsx(Component, { ...props }), _jsx(MessagesPopup, {})] }));
+}

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

@@ -0,0 +1,18 @@
+export interface MessagesProps {
+    /**
+     * @default '0px'
+     * @example
+     * ```tsx
+     * offsetTop="1em"
+     * offsetTop="1rem"
+     * offsetTop="16px"
+     * ```
+     */
+    offsetTop?: string | [mobile: string, desktop: string];
+    /** @default '/transactions' */
+    transactionsPageUrl?: string;
+    /** @default '/quests' */
+    questsPageUrl?: string;
+}
+export declare function Messages(props: MessagesProps): import("react/jsx-runtime").JSX.Element;
+export declare function MessageDetails(): import("react/jsx-runtime").JSX.Element;