@n1xyz/wallet-widget 0.0.4 → 0.0.7

package/dist/Modal/NTSFlow/NordFlow/screens/04-AmountInputScreen.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { ANIMATION_EASE, MAX_DEPOSIT, MIN_DEPOSIT } from '../constants';
+export function AmountInputScreen(_a) {
+    var amount = _a.amount, onAmountChange = _a.onAmountChange, onContinue = _a.onContinue, balance = _a.balance;
+    var _b = useState(false), isHovered = _b[0], setIsHovered = _b[1];
+    var handleAmountChange = function (e) {
+        var value = e.target.value;
+        if (/^\d*\.?\d*$/.test(value)) {
+            onAmountChange(value);
+        }
+    };
+    var isValidAmount = amount !== '' &&
+        Number(amount) >= MIN_DEPOSIT &&
+        Number(amount) <= MAX_DEPOSIT &&
+        Number(amount) <= balance;
+    return (_jsxs("div", { className: "overflow-hidden relative", children: [_jsx("h2", { className: "text-xl text-gray-800 dark:text-white font-semibold mb-6 text-center", children: "Enter Amount" }), _jsxs("div", { className: "space-y-8", children: [_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-sm text-gray-500 dark:text-neutral-400", children: "Amount" }), _jsxs("span", { className: "text-sm text-gray-500 dark:text-neutral-400", children: ["Balance: ", balance, " USDC"] })] }), _jsxs("div", { className: "relative", children: [_jsx("input", { type: "text", defaultValue: amount, onChange: handleAmountChange, placeholder: "0.00", className: "w-full bg-white dark:bg-neutral-950 border-2 border-gray-100 dark:border-neutral-800 rounded-md px-4 py-3 text-gray-900 dark:text-white placeholder-gray-400 dark:placeholder-neutral-500 focus:outline-none focus:ring-0 focus:border-main dark:focus:border-main transition-colors duration-200" }), _jsxs("div", { className: "absolute right-4 top-1/2 -translate-y-1/2 flex items-center gap-2", children: [_jsx("img", { src: "/images/tokens/usdc.svg", width: 20, height: 20, alt: "USDC" }), _jsx("span", { className: "text-gray-400 dark:text-neutral-500", children: "USDC" })] })] }), _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("span", { className: "text-xs text-gray-400 dark:text-neutral-500", children: ["Min: ", MIN_DEPOSIT, " USDC"] }), _jsxs("span", { className: "text-xs text-gray-400 dark:text-neutral-500", children: ["Max: ", MAX_DEPOSIT, " USDC"] })] })] }), _jsx("button", { onClick: onContinue, disabled: !isValidAmount, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, className: "\n            group relative w-full overflow-hidden rounded-md border-2 bg-gray-100 dark:bg-neutral-950 py-4 text-center\n            transition-all duration-300 ".concat(ANIMATION_EASE, "\n            cursor-pointer border-gray-200 dark:border-gray-800 hover:border-gray-400 dark:hover:border-white/60\n            ").concat(!isValidAmount ? 'opacity-50 cursor-not-allowed hover:border-gray-200 dark:hover:border-gray-800' : '', "\n          "), style: {
+                            transform: isHovered && isValidAmount ? 'scale(0.99)' : 'scale(1)',
+                        }, children: _jsx("span", { className: "\n            text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n            text-gray-700 dark:text-gray-300 group-hover:text-gray-900 dark:group-hover:text-white\n            ").concat(!isValidAmount ? 'group-hover:text-gray-700 dark:group-hover:text-gray-300' : '', "\n          "), children: "Continue" }) })] })] }));
+}

package/dist/Modal/NTSFlow/NordFlow/screens/05-DepositProgressScreen.d.ts

@@ -0,0 +1,7 @@
+import { WaitingMessageState } from '../types';
+interface DepositProgressScreenProps {
+    message: WaitingMessageState;
+    percentComplete?: number;
+}
+export declare function DepositProgressScreen({ message }: DepositProgressScreenProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Modal/NTSFlow/NordFlow/screens/05-DepositProgressScreen.js

@@ -0,0 +1,6 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { WaitingMessage } from '../components/WaitingMessage';
+export function DepositProgressScreen(_a) {
+    var message = _a.message;
+    return (_jsx("div", { className: "overflow-hidden relative", children: _jsx(WaitingMessage, { message: message }) }));
+}

package/dist/Modal/NTSFlow/NordFlow/screens/06-DepositSuccessScreen.d.ts

@@ -0,0 +1,8 @@
+import { TableValues } from '../types';
+interface DepositSuccessScreenProps {
+    amount: string;
+    tableValues: TableValues;
+    onContinue: () => void;
+}
+export declare function DepositSuccessScreen({ amount, tableValues, onContinue, }: DepositSuccessScreenProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Modal/NTSFlow/NordFlow/screens/06-DepositSuccessScreen.js

@@ -0,0 +1,99 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { TransactionTable } from '../components/TransactionTable';
+import { ANIMATION_EASE, TYPING_INTERVAL } from '../constants';
+export function DepositSuccessScreen(_a) {
+    var amount = _a.amount, tableValues = _a.tableValues, onContinue = _a.onContinue;
+    var _b = useState(false), isHovered = _b[0], setIsHovered = _b[1];
+    var _c = useState(false), showDetails = _c[0], setShowDetails = _c[1];
+    var _d = useState({
+        amount: { text: '', visible: false, typing: false },
+        tx: { text: '', visible: false, typing: false },
+        from: { text: '', visible: false, typing: false },
+        to: { text: '', visible: false, typing: false },
+        network: { text: '', visible: false, typing: false },
+        status: { text: '', visible: false, typing: false },
+    }), animatedTableValues = _d[0], setAnimatedTableValues = _d[1];
+    // Add state to track if the button should be enabled
+    var _e = useState(false), isContinueEnabled = _e[0], setIsContinueEnabled = _e[1];
+    // Add state to show a message about waiting
+    var _f = useState(true), showWaitingMessage = _f[0], setShowWaitingMessage = _f[1];
+    // Add animation to table values
+    useEffect(function () {
+        if (!showDetails)
+            return;
+        // Extract the text values from the tableValues
+        var values = {
+            amount: "".concat(Number(amount).toLocaleString(), " USDC"),
+            tx: tableValues.tx.text,
+            from: tableValues.from.text,
+            to: tableValues.to.text,
+            network: tableValues.network.text,
+            status: tableValues.status.text,
+        };
+        // Animate each field with typing effect
+        Object.entries(values).forEach(function (_a, index) {
+            var key = _a[0], value = _a[1];
+            setTimeout(function () {
+                // Make the field visible first
+                setAnimatedTableValues(function (prev) {
+                    var _a;
+                    return (__assign(__assign({}, prev), (_a = {}, _a[key] = __assign(__assign({}, prev[key]), { visible: true, typing: true }), _a)));
+                });
+                var textIndex = 0;
+                // Type out each character with the typing animation
+                var interval = setInterval(function () {
+                    if (textIndex <= value.length) {
+                        setAnimatedTableValues(function (prev) {
+                            var _a;
+                            return (__assign(__assign({}, prev), (_a = {}, _a[key] = {
+                                text: value.slice(0, textIndex),
+                                visible: true,
+                                typing: textIndex < value.length,
+                            }, _a)));
+                        });
+                        textIndex++;
+                    }
+                    else {
+                        clearInterval(interval);
+                        setAnimatedTableValues(function (prev) {
+                            var _a;
+                            return (__assign(__assign({}, prev), (_a = {}, _a[key] = {
+                                text: value,
+                                visible: true,
+                                typing: false,
+                            }, _a)));
+                        });
+                    }
+                }, TYPING_INTERVAL);
+            }, index * 300); // Slightly faster staggering for better UX
+        });
+    }, [tableValues, showDetails, amount]);
+    // Enable the continue button after a minimum viewing time
+    useEffect(function () {
+        var enableTimer = setTimeout(function () {
+            setIsContinueEnabled(true);
+            setShowWaitingMessage(false);
+        }, 4000);
+        return function () { return clearTimeout(enableTimer); };
+    }, []);
+    var toggleDetails = function () {
+        setShowDetails(function (prev) { return !prev; });
+    };
+    return (_jsx("div", { className: "relative w-full px-4", children: _jsx("div", { className: "flex flex-col space-y-6", children: _jsxs("div", { className: "w-full", children: [_jsx("div", { className: "relative w-full px-3 py-3 flex items-center justify-center transition-all duration-300 ".concat(ANIMATION_EASE, " ").concat(showDetails ? 'opacity-0 max-h-0' : 'opacity-100 max-h-[200px]'), children: _jsxs("div", { className: "relative w-full px-5 py-8 transition-all duration-300 ".concat(ANIMATION_EASE, " ").concat(showDetails ? 'max-h-0 overflow-hidden' : 'max-h-[200px]'), children: [_jsx("div", { className: "w-2 h-2 bg-green-200 dark:bg-emerald-800 absolute -top-2 -left-2 rounded-sm" }), _jsx("div", { className: "w-2 h-2 bg-green-200 dark:bg-emerald-800 absolute -top-2 -right-2 rounded-sm" }), _jsx("div", { className: "w-2 h-2 bg-green-200 dark:bg-emerald-800 absolute -bottom-2 -left-2 rounded-sm" }), _jsx("div", { className: "w-2 h-2 bg-green-200 dark:bg-emerald-800 absolute -bottom-2 -right-2 rounded-sm" }), _jsxs("p", { className: "text-5xl md:text-7xl tracking-tight text-green-500/80 dark:text-emerald-500/80 font-medium pt-4 underline text-center animate-fade-up", style: { animationDelay: '0.3s' }, children: ["+", Number(amount).toLocaleString(), _jsx("span", { className: "text-xl md:text-2xl text-green-500/50 dark:text-emerald-500/50 ml-2", children: "USDC" })] }), _jsx("div", { className: "absolute bottom-0 left-0 right-0 flex justify-center -mb-3", children: _jsxs("button", { onClick: toggleDetails, className: "\n                    group flex items-center space-x-1 px-3 py-1 text-xs font-medium \n                    transition-colors duration-200 focus:outline-none\n                    ".concat(showDetails
+                                            ? 'text-green-600 dark:text-emerald-400 hover:text-green-700 dark:hover:text-emerald-300'
+                                            : 'text-gray-500 dark:text-gray-400 hover:text-green-600 dark:hover:text-emerald-400', "\n                  "), children: [_jsx("span", { children: "View details" }), _jsx("svg", { xmlns: "http://www.w3.org/2000/svg", className: "h-3 w-3 transition-transform duration-200", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) })] }) })] }) }), _jsx("div", { className: "transition-all duration-300 ease-in-out overflow-hidden ".concat(showDetails ? 'max-h-[500px] opacity-100 -mt-4' : 'max-h-0 opacity-0'), children: _jsx(TransactionTable, { tableValues: animatedTableValues, onClose: toggleDetails }) }), _jsxs("div", { className: "mt-6", children: [showWaitingMessage && (_jsx("p", { className: "text-sm text-gray-600 dark:text-neutral-400 text-center mb-2 animate-pulse", children: "Please wait a moment..." })), _jsx("button", { onClick: isContinueEnabled ? onContinue : undefined, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, className: "\n                group relative w-full overflow-hidden rounded-md border-2 bg-gray-100 dark:bg-neutral-950 py-4 text-center\n                transition-all duration-300 ".concat(ANIMATION_EASE, "\n                cursor-pointer border-gray-200 dark:border-gray-800 hover:border-gray-400 dark:hover:border-white/60\n                ").concat(!isContinueEnabled ? 'opacity-50 cursor-not-allowed' : '', "\n              "), style: {
+                                    transform: isHovered && isContinueEnabled ? 'scale(0.99)' : 'scale(1)',
+                                }, disabled: !isContinueEnabled, children: _jsx("span", { className: "\n                text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n                text-gray-700 dark:text-gray-300 group-hover:text-gray-900 dark:group-hover:text-white\n              "), children: "Continue" }) })] })] }) }) }));
+}

package/dist/Modal/NTSFlow/NordFlow/screens/07-NordAuthScreen.d.ts

@@ -0,0 +1,7 @@
+interface NordAuthScreenProps {
+    onCreateAccount: () => void;
+    onLogin: () => void;
+    hasNordAccount: boolean;
+}
+export declare function NordAuthScreen({ onCreateAccount, onLogin, hasNordAccount, }: NordAuthScreenProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Modal/NTSFlow/NordFlow/screens/07-NordAuthScreen.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { ANIMATION_EASE } from '../constants';
+export function NordAuthScreen(_a) {
+    var onCreateAccount = _a.onCreateAccount, onLogin = _a.onLogin, hasNordAccount = _a.hasNordAccount;
+    var _b = useState(null), isHovered = _b[0], setIsHovered = _b[1];
+    return (_jsxs("div", { className: "overflow-hidden relative", children: [_jsx("h2", { className: "text-xl text-gray-800 dark:text-white font-semibold mb-2 text-center", children: hasNordAccount ? 'Continue to Nord' : 'Create Nord Account' }), _jsx("p", { className: "text-sm text-gray-600 dark:text-neutral-400 text-center mb-8", children: hasNordAccount
+                    ? 'Log in to your Nord account to continue'
+                    : 'Create a Nord account to manage your deposits' }), _jsxs("div", { className: "space-y-4", children: [!hasNordAccount && (_jsx("button", { onClick: onCreateAccount, onMouseEnter: function () { return setIsHovered('create'); }, onMouseLeave: function () { return setIsHovered(null); }, className: "\n              group relative w-full overflow-hidden rounded-md border-2 bg-gray-100 dark:bg-neutral-950 py-4 text-center\n              transition-all duration-300 ".concat(ANIMATION_EASE, "\n              cursor-pointer border-gray-200 dark:border-gray-800 hover:border-gray-400 dark:hover:border-white/60\n            "), style: {
+                            transform: isHovered === 'create' ? 'scale(0.99)' : 'scale(1)',
+                        }, children: _jsx("span", { className: "\n              text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n              text-gray-700 dark:text-gray-300 group-hover:text-gray-900 dark:group-hover:text-white\n            "), children: "Create Account" }) })), hasNordAccount && (_jsx("button", { onClick: onLogin, onMouseEnter: function () { return setIsHovered('login'); }, onMouseLeave: function () { return setIsHovered(null); }, className: "\n              group relative w-full overflow-hidden rounded-md border-2 bg-gray-100 dark:bg-neutral-950 py-4 text-center\n              transition-all duration-300 ".concat(ANIMATION_EASE, "\n              cursor-pointer border-gray-200 dark:border-gray-800 hover:border-gray-400 dark:hover:border-white/60\n            "), style: {
+                            transform: isHovered === 'login' ? 'scale(0.99)' : 'scale(1)',
+                        }, children: _jsx("span", { className: "\n              text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n              text-gray-700 dark:text-gray-300 group-hover:text-gray-900 dark:group-hover:text-white\n            "), children: "Log In" }) }))] })] }));
+}

package/dist/Modal/NTSFlow/NordFlow/screens/08-AuthLoadingScreen.d.ts

@@ -0,0 +1,6 @@
+interface AuthLoadingScreenProps {
+    isCreatingAccount?: boolean;
+    onAuthComplete?: (success: boolean) => void;
+}
+export declare function AuthLoadingScreen({ isCreatingAccount, onAuthComplete }: AuthLoadingScreenProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Modal/NTSFlow/NordFlow/screens/08-AuthLoadingScreen.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { LoadingSquares } from '../components/LoadingSquares';
+export function AuthLoadingScreen(_a) {
+    var _b = _a.isCreatingAccount, isCreatingAccount = _b === void 0 ? false : _b, onAuthComplete = _a.onAuthComplete;
+    useEffect(function () {
+        // Simulate authentication completion after 5 seconds (increased from 2 seconds)
+        // to give users more time to read transaction details
+        var timer = setTimeout(function () {
+            if (onAuthComplete) {
+                console.log('Auth completed, calling onAuthComplete callback');
+                onAuthComplete(true); // Authentication was successful
+            }
+        }, 5000);
+        return function () { return clearTimeout(timer); };
+    }, [onAuthComplete]);
+    return (_jsxs("div", { className: "flex flex-col items-center justify-center py-12 space-y-6", children: [_jsx(LoadingSquares, {}), _jsxs("div", { className: "space-y-2 text-center w-[300px]", children: [_jsx("h3", { className: "text-xl text-gray-800 dark:text-white font-semibold", children: isCreatingAccount ? 'Creating Account' : 'Authenticating' }), _jsx("p", { className: "text-sm text-gray-600 dark:text-neutral-400", children: isCreatingAccount
+                            ? 'Please wait while we create your Nord account'
+                            : 'Please wait while we log you in to your Nord account' })] })] }));
+}

package/dist/Modal/NTSFlow/NordFlow/screens/09-FinalSuccessScreen.d.ts

@@ -0,0 +1,5 @@
+interface FinalSuccessScreenProps {
+    onDone: () => void;
+}
+export declare function FinalSuccessScreen({ onDone, }: FinalSuccessScreenProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Modal/NTSFlow/NordFlow/screens/09-FinalSuccessScreen.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { ANIMATION_EASE } from '../constants';
+export function FinalSuccessScreen(_a) {
+    var onDone = _a.onDone;
+    var _b = useState(false), isHovered = _b[0], setIsHovered = _b[1];
+    var _c = useState(false), isButtonEnabled = _c[0], setIsButtonEnabled = _c[1];
+    // Add a minimum viewing time before enabling the button
+    useEffect(function () {
+        var timer = setTimeout(function () {
+            setIsButtonEnabled(true);
+        }, 3000); // 3 seconds minimum viewing time
+        return function () { return clearTimeout(timer); };
+    }, []);
+    return (_jsx("div", { className: "overflow-hidden relative", children: _jsxs("div", { className: "space-y-8", children: [_jsxs("div", { className: "flex flex-col items-center justify-center pt-4", children: [_jsx("div", { className: "mb-6", children: _jsx("div", { className: "w-20 h-20 rounded-full bg-green-100 dark:bg-green-900/30 flex items-center justify-center", children: _jsx("svg", { className: "w-10 h-10 text-green-500 dark:text-green-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M5 13l4 4L19 7" }) }) }) }), _jsx("h2", { className: "text-2xl text-gray-800 dark:text-white font-semibold mb-2 text-center", children: "Authentication Successful!" }), _jsx("p", { className: "text-lg text-gray-700 dark:text-neutral-300 text-center", children: "Your wallet has been successfully connected" })] }), _jsx("button", { onClick: isButtonEnabled ? onDone : undefined, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () { return setIsHovered(false); }, className: "\n            group relative w-full overflow-hidden rounded-md border-2 bg-gray-100 dark:bg-neutral-950 py-4 text-center\n            transition-all duration-300 ".concat(ANIMATION_EASE, "\n            cursor-pointer border-gray-200 dark:border-gray-800 hover:border-gray-400 dark:hover:border-white/60\n            ").concat(!isButtonEnabled ? 'opacity-50 cursor-not-allowed' : '', "\n          "), style: {
+                        transform: isHovered && isButtonEnabled ? 'scale(0.99)' : 'scale(1)',
+                    }, disabled: !isButtonEnabled, children: _jsx("span", { className: "\n            text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n            text-gray-700 dark:text-gray-300 group-hover:text-gray-900 dark:group-hover:text-white\n          "), children: isButtonEnabled ? 'Open App' : 'Please wait...' }) })] }) }));
+}

package/dist/Modal/NTSFlow/NordFlow/screens/10-ErrorScreen.d.ts

@@ -0,0 +1,7 @@
+interface ErrorScreenProps {
+    onRetry: () => void;
+    onCancel: () => void;
+    error: Error | null;
+}
+export declare function ErrorScreen({ onRetry, onCancel, error, }: ErrorScreenProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Modal/NTSFlow/NordFlow/screens/10-ErrorScreen.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { ANIMATION_EASE } from '../constants';
+export function ErrorScreen(_a) {
+    var onRetry = _a.onRetry, onCancel = _a.onCancel, error = _a.error;
+    var _b = useState(null), isHovered = _b[0], setIsHovered = _b[1];
+    var errorMessage = (error === null || error === void 0 ? void 0 : error.message) || 'An unexpected error occurred';
+    return (_jsx("div", { className: "overflow-hidden relative", children: _jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "flex flex-col items-center justify-center py-4", children: [_jsx("div", { className: "mb-6", children: _jsx("div", { className: "w-20 h-20 rounded-full bg-red-100 dark:bg-red-900/30 flex items-center justify-center", children: _jsx("svg", { className: "w-10 h-10 text-red-500 dark:text-red-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" }) }) }) }), _jsx("h2", { className: "text-xl text-gray-800 dark:text-white font-semibold mb-2 text-center", children: "Something went wrong" }), _jsx("p", { className: "text-sm text-gray-600 dark:text-neutral-400 text-center mb-6 max-w-xs", children: errorMessage })] }), _jsxs("div", { className: "space-y-3", children: [_jsx("button", { onClick: onRetry, onMouseEnter: function () { return setIsHovered('retry'); }, onMouseLeave: function () { return setIsHovered(null); }, className: "\n              group relative w-full overflow-hidden rounded-md border-2 bg-gray-100 dark:bg-neutral-950 py-4 text-center\n              transition-all duration-300 ".concat(ANIMATION_EASE, "\n              cursor-pointer border-gray-200 dark:border-gray-800 hover:border-gray-400 dark:hover:border-white/60\n            "), style: {
+                                transform: isHovered === 'retry' ? 'scale(0.99)' : 'scale(1)',
+                            }, children: _jsx("span", { className: "\n              text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n              text-gray-700 dark:text-gray-300 group-hover:text-gray-900 dark:group-hover:text-white\n            "), children: "Try Again" }) }), _jsx("button", { onClick: onCancel, onMouseEnter: function () { return setIsHovered('cancel'); }, onMouseLeave: function () { return setIsHovered(null); }, className: "\n              group relative w-full overflow-hidden rounded-md border-2 border-gray-200 dark:border-gray-800 bg-white dark:bg-neutral-900 py-4 text-center\n              transition-all duration-300 ".concat(ANIMATION_EASE, "\n              cursor-pointer hover:bg-gray-50 dark:hover:bg-neutral-950\n            "), style: {
+                                transform: isHovered === 'cancel' ? 'scale(0.99)' : 'scale(1)',
+                            }, children: _jsx("span", { className: "\n              text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n              text-gray-500 dark:text-gray-400 group-hover:text-gray-700 dark:group-hover:text-gray-300\n            "), children: "Cancel" }) })] })] }) }));
+}

package/dist/Modal/NTSFlow/NordFlow/screens/index.d.ts

@@ -0,0 +1,10 @@
+export * from './01-ConnectWalletScreen';
+export * from './02-EvmWalletAuthScreen';
+export * from './03-ChainSelectionScreen';
+export * from './04-AmountInputScreen';
+export * from './05-DepositProgressScreen';
+export * from './06-DepositSuccessScreen';
+export * from './07-NordAuthScreen';
+export * from './08-AuthLoadingScreen';
+export * from './09-FinalSuccessScreen';
+export * from './10-ErrorScreen';

package/dist/Modal/NTSFlow/NordFlow/screens/index.js

@@ -0,0 +1,10 @@
+export * from './01-ConnectWalletScreen';
+export * from './02-EvmWalletAuthScreen';
+export * from './03-ChainSelectionScreen';
+export * from './04-AmountInputScreen';
+export * from './05-DepositProgressScreen';
+export * from './06-DepositSuccessScreen';
+export * from './07-NordAuthScreen';
+export * from './08-AuthLoadingScreen';
+export * from './09-FinalSuccessScreen';
+export * from './10-ErrorScreen';

package/dist/Modal/NTSFlow/NordFlow/types.d.ts

@@ -0,0 +1,105 @@
+/**
+ * Types for the wallet connection flow state machine
+ */
+/**
+ * Enum representing all possible states in the wallet connection flow
+ */
+export declare enum FlowState {
+    IDLE = "IDLE",
+    CONNECTING_WALLET = "CONNECTING_WALLET",
+    WALLET_CONNECTED = "WALLET_CONNECTED",
+    ETH_TO_SOL_AUTH = "ETH_TO_SOL_AUTH",
+    CHAIN_SELECTION = "CHAIN_SELECTION",
+    AMOUNT_INPUT = "AMOUNT_INPUT",
+    DEPOSIT_PROGRESS = "DEPOSIT_PROGRESS",
+    DEPOSIT_SUCCESS = "DEPOSIT_SUCCESS",
+    NORD_AUTH = "NORD_AUTH",
+    AUTH_LOADING = "AUTH_LOADING",
+    FINAL_SUCCESS = "FINAL_SUCCESS",
+    ERROR = "ERROR"
+}
+/**
+ * Interface representing the flow context, containing all data necessary
+ * for the wallet connection flow
+ */
+export interface FlowContext {
+    walletType: 'solana' | 'ethereum' | null;
+    hasNordAccount: boolean;
+    hasActiveSession: boolean;
+    selectedChain: string | null;
+    amount: string;
+    transactionId: string | null;
+    error: Error | null;
+    lastInterruption: {
+        timestamp: number;
+        state: FlowState;
+        context: Partial<FlowContext>;
+    } | null;
+}
+/**
+ * Interface for state transitions in the flow
+ */
+export interface StateTransition {
+    from: FlowState | FlowState[];
+    to: FlowState;
+    condition?: (context: FlowContext) => boolean;
+}
+/**
+ * Initial flow context with default values
+ */
+export declare const initialFlowContext: FlowContext;
+export interface TableValues {
+    amount?: {
+        text: string;
+        visible: boolean;
+        typing: boolean;
+    };
+    tx: {
+        text: string;
+        visible: boolean;
+        typing: boolean;
+    };
+    from: {
+        text: string;
+        visible: boolean;
+        typing: boolean;
+    };
+    to: {
+        text: string;
+        visible: boolean;
+        typing: boolean;
+    };
+    network: {
+        text: string;
+        visible: boolean;
+        typing: boolean;
+    };
+    status: {
+        text: string;
+        visible: boolean;
+        typing: boolean;
+    };
+}
+export interface WaitingMessageState {
+    title: string;
+    subtitle: string;
+    visible: boolean;
+    isTyping: boolean;
+}
+export interface Chain {
+    id: string;
+    name: string;
+    logo: string;
+}
+export interface App {
+    name: string;
+    color: string;
+    progress: number;
+}
+export type ButtonKey = 'deposit' | 'continue' | 'openApp';
+export interface ButtonState {
+    text: string;
+    isTyping: boolean;
+    showCursor: boolean;
+}
+export type ButtonStates = Record<ButtonKey, ButtonState>;

package/dist/Modal/NTSFlow/NordFlow/types.js

@@ -0,0 +1,34 @@
+/**
+ * Types for the wallet connection flow state machine
+ */
+/**
+ * Enum representing all possible states in the wallet connection flow
+ */
+export var FlowState;
+(function (FlowState) {
+    FlowState["IDLE"] = "IDLE";
+    FlowState["CONNECTING_WALLET"] = "CONNECTING_WALLET";
+    FlowState["WALLET_CONNECTED"] = "WALLET_CONNECTED";
+    FlowState["ETH_TO_SOL_AUTH"] = "ETH_TO_SOL_AUTH";
+    FlowState["CHAIN_SELECTION"] = "CHAIN_SELECTION";
+    FlowState["AMOUNT_INPUT"] = "AMOUNT_INPUT";
+    FlowState["DEPOSIT_PROGRESS"] = "DEPOSIT_PROGRESS";
+    FlowState["DEPOSIT_SUCCESS"] = "DEPOSIT_SUCCESS";
+    FlowState["NORD_AUTH"] = "NORD_AUTH";
+    FlowState["AUTH_LOADING"] = "AUTH_LOADING";
+    FlowState["FINAL_SUCCESS"] = "FINAL_SUCCESS";
+    FlowState["ERROR"] = "ERROR";
+})(FlowState || (FlowState = {}));
+/**
+ * Initial flow context with default values
+ */
+export var initialFlowContext = {
+    walletType: null,
+    hasNordAccount: false,
+    hasActiveSession: false,
+    selectedChain: null,
+    amount: '',
+    transactionId: null,
+    error: null,
+    lastInterruption: null,
+};

package/dist/Modal/NTSFlow/NordFlow/utils/persistence.d.ts

@@ -0,0 +1,24 @@
+import { FlowContext, FlowState } from '../types';
+/**
+ * Saves the current flow state and context to localStorage
+ * @param state Current flow state
+ * @param context Current flow context
+ */
+export declare const saveStateToLocalStorage: (state: FlowState, context: FlowContext) => void;
+/**
+ * Loads the flow state and context from localStorage if available and not expired
+ * @returns The loaded state and context, or null if not available or expired
+ */
+export declare const loadStateFromLocalStorage: () => {
+    state: FlowState;
+    context: FlowContext;
+} | null;
+/**
+ * Clears the stored flow state from localStorage
+ */
+export declare const clearStoredState: () => void;
+/**
+ * Checks if there is a stored state that can be recovered
+ * @returns True if there is a recoverable state, false otherwise
+ */
+export declare const hasRecoverableState: () => boolean;

package/dist/Modal/NTSFlow/NordFlow/utils/persistence.js

@@ -0,0 +1,83 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import { initialFlowContext } from '../types';
+import { FLOW_STATE_STORAGE_KEY, STATE_EXPIRY_TIME } from '../constants';
+/**
+ * Saves the current flow state and context to localStorage
+ * @param state Current flow state
+ * @param context Current flow context
+ */
+export var saveStateToLocalStorage = function (state, context) {
+    try {
+        var persistedData = {
+            state: state,
+            context: __assign(__assign({}, context), { 
+                // Filter out any sensitive data or error objects that shouldn't be persisted
+                error: context.error
+                    ? {
+                        message: context.error.message,
+                        name: context.error.name,
+                    }
+                    : null }),
+            timestamp: Date.now(),
+        };
+        localStorage.setItem(FLOW_STATE_STORAGE_KEY, JSON.stringify(persistedData));
+    }
+    catch (error) {
+        console.error('Failed to save flow state:', error);
+    }
+};
+/**
+ * Loads the flow state and context from localStorage if available and not expired
+ * @returns The loaded state and context, or null if not available or expired
+ */
+export var loadStateFromLocalStorage = function () {
+    try {
+        var storedData = localStorage.getItem(FLOW_STATE_STORAGE_KEY);
+        if (!storedData) {
+            return null;
+        }
+        var parsedData = JSON.parse(storedData);
+        var state = parsedData.state, context = parsedData.context, timestamp = parsedData.timestamp;
+        // Check if data is expired
+        if (Date.now() - timestamp > STATE_EXPIRY_TIME) {
+            localStorage.removeItem(FLOW_STATE_STORAGE_KEY);
+            return null;
+        }
+        return {
+            state: state,
+            context: __assign(__assign({}, initialFlowContext), context),
+        };
+    }
+    catch (error) {
+        console.error('Failed to load flow state:', error);
+        return null;
+    }
+};
+/**
+ * Clears the stored flow state from localStorage
+ */
+export var clearStoredState = function () {
+    try {
+        localStorage.removeItem(FLOW_STATE_STORAGE_KEY);
+    }
+    catch (error) {
+        console.error('Failed to clear flow state:', error);
+    }
+};
+/**
+ * Checks if there is a stored state that can be recovered
+ * @returns True if there is a recoverable state, false otherwise
+ */
+export var hasRecoverableState = function () {
+    return loadStateFromLocalStorage() !== null;
+};

package/dist/Modal/NTSFlow/components/BackButton.d.ts

@@ -0,0 +1,3 @@
+export declare function BackButton(props: {
+    onClick?: () => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/Modal/NTSFlow/components/BackButton.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { useN1WalletInternalContext } from '../../../Provider/hooks';
+import { N1ModalViewMode } from '../../../Provider/types';
+import { ANIMATION_EASE } from '../../NordFlow/constants';
+export function BackButton(props) {
+    var _a = useN1WalletInternalContext(), setViewMode = _a.setViewMode, dynamicHandleLogOut = _a.dynamicHandleLogOut;
+    var _b = useState(false), isHovered = _b[0], setIsHovered = _b[1];
+    var _c = useState(false), isPressed = _c[0], setIsPressed = _c[1];
+    function back() {
+        // todo: disconnect
+        dynamicHandleLogOut();
+        setViewMode(N1ModalViewMode.Connect);
+    }
+    return (_jsx("button", { onClick: props.onClick || back, onMouseEnter: function () { return setIsHovered(true); }, onMouseLeave: function () {
+            setIsHovered(false);
+            setIsPressed(false);
+        }, onMouseDown: function () { return setIsPressed(true); }, onMouseUp: function () { return setIsPressed(false); }, className: "\n        group relative w-full overflow-hidden rounded-md border-2 bg-gray-100 dark:bg-neutral-950 py-4 text-center\n        transition-all duration-300 ".concat(ANIMATION_EASE, "\n        cursor-pointer border-gray-200 dark:border-gray-800 hover:border-gray-400 dark:hover:border-white/60\n      "), style: {
+            transform: isPressed
+                ? 'scale(0.98)'
+                : isHovered
+                    ? 'scale(0.99)'
+                    : 'scale(1)',
+        }, children: _jsx("div", { className: "relative z-[200] pl-4 isolate", children: _jsx("div", { className: "flex items-center", children: _jsx("span", { className: "\n            text-base font-medium tracking-wide transition-colors duration-300 ".concat(ANIMATION_EASE, "\n            text-gray-500 dark:text-neutral-400 group-hover:text-gray-900 dark:group-hover:text-white\n          "), children: "Back" }) }) }) }));
+}

package/dist/Modal/NTSFlow/components/ModalHeader.d.ts

@@ -0,0 +1 @@
+export declare function ModalHeader(): import("react/jsx-runtime").JSX.Element;

package/dist/Modal/NTSFlow/components/ModalHeader.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useN1WalletContext, useN1WalletInternalContext, } from '../../../Provider/hooks';
+import { N1ModalViewMode } from '../../../Provider/types';
+import { X } from 'lucide-react';
+import Logo from '../../../components/Logo';
+import { ANIMATION_EASE } from '../../NordFlow/constants';
+export function ModalHeader() {
+    var _a = useN1WalletInternalContext(), setViewMode = _a.setViewMode, setStartClosingLogin = _a.setStartClosingLogin, setDynamicWallet = _a.setDynamicWallet, setAddress = _a.setAddress, dynamicHandleLogOut = _a.dynamicHandleLogOut;
+    var viewMode = useN1WalletContext().viewMode;
+    var close = function () {
+        setStartClosingLogin(true);
+        if (viewMode === N1ModalViewMode.CreateSession) {
+            setDynamicWallet(null);
+            setAddress('');
+            dynamicHandleLogOut();
+            setViewMode(N1ModalViewMode.Connect);
+        }
+    };
+    return (_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "w-6 h-6 text-gray-50", children: _jsx(Logo, { size: 24 }) }), _jsxs("h2", { className: "text-xl text-gray-400 flex items-center gap-2", children: ["Connect", viewMode === N1ModalViewMode.CreateSession && (_jsx("span", { className: "text-gray-700 dark:text-gray-300 font-normal", children: "/ / Session" })), viewMode === N1ModalViewMode.Signing && (_jsx("span", { className: "text-gray-700 dark:text-gray-300 font-normal", children: "/ / Sign" })), viewMode === N1ModalViewMode.CreatingUser && (_jsx("span", { className: "text-gray-700 dark:text-gray-300 font-normal", children: "/ / Create User" })), viewMode === N1ModalViewMode.Success && (_jsx("span", { className: "text-gray-700 dark:text-gray-300 font-normal", children: "/ / Success" }))] })] }), _jsx("button", { onClick: close, className: "\n          text-neutral-400 hover:text-gray-900 dark:hover:text-white \n          transition-colors duration-300 ".concat(ANIMATION_EASE, "\n          h-10 w-10 rounded-full hover:bg-gray-100 dark:hover:bg-gray-800\n          flex items-center justify-center\n        "), children: _jsx(X, { size: 20 }) })] }));
+}

package/dist/Modal/NTSFlow/index.d.ts

@@ -0,0 +1 @@
+export { NTSFlow } from './NTSFlow';

package/dist/Modal/NTSFlow/index.js

@@ -0,0 +1 @@
+export { NTSFlow } from './NTSFlow';

package/dist/Modal/NTSFlow/views/ConnectView.d.ts

@@ -0,0 +1 @@
+export declare function ConnectView(): import("react/jsx-runtime").JSX.Element;