@layerswap/widget 0.1.20 → 1.0.0-alpha1.1

package/dist/esm/components/shadcn/accordion.js

@@ -0,0 +1,107 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { motion, AnimatePresence } from "framer-motion";
+import { classNames } from "../utils/classNames";
+const AccordionContext = React.createContext(null);
+const Accordion = React.forwardRef(({ type, value, defaultValue, onValueChange, collapsible = false, className, children, ...props }, ref) => {
+    const [internalValue, setInternalValue] = React.useState(value ?? defaultValue);
+    const currentValue = value !== undefined ? value : internalValue;
+    const handleValueChange = onValueChange || setInternalValue;
+    const contextValue = React.useMemo(() => ({
+        value: currentValue,
+        onValueChange: handleValueChange,
+        type,
+        collapsible
+    }), [currentValue, handleValueChange, type, collapsible]);
+    return (_jsx(AccordionContext.Provider, { value: contextValue, children: _jsx("div", { ref: ref, className: className, ...props, children: children }) }));
+});
+Accordion.displayName = "Accordion";
+const AccordionItem = React.forwardRef(({ className, value: itemValue, children, ...props }, ref) => {
+    const context = React.useContext(AccordionContext);
+    if (!context)
+        throw new Error("AccordionItem must be used within Accordion");
+    return (_jsx("div", { ref: ref, className: className, "data-value": itemValue, ...props, children: children }));
+});
+AccordionItem.displayName = "AccordionItem";
+const AccordionTrigger = React.forwardRef(({ className, children, ...props }, ref) => {
+    const context = React.useContext(AccordionContext);
+    if (!context)
+        throw new Error("AccordionTrigger must be used within Accordion");
+    const itemElement = React.useContext(AccordionItemContext);
+    if (!itemElement)
+        throw new Error("AccordionTrigger must be used within AccordionItem");
+    const { value: accordionValue, onValueChange, type, collapsible } = context;
+    const { value: itemValue } = itemElement;
+    const isOpen = React.useMemo(() => {
+        if (type === "multiple") {
+            return Array.isArray(accordionValue) && accordionValue.includes(itemValue);
+        }
+        return accordionValue === itemValue;
+    }, [accordionValue, itemValue, type]);
+    const handleClick = () => {
+        if (type === "multiple") {
+            const currentValue = Array.isArray(accordionValue) ? accordionValue : [];
+            if (isOpen) {
+                onValueChange(currentValue.filter(v => v !== itemValue));
+            }
+            else {
+                onValueChange([...currentValue, itemValue]);
+            }
+        }
+        else {
+            if (isOpen && collapsible) {
+                onValueChange(undefined);
+            }
+            else if (!isOpen) {
+                onValueChange(itemValue);
+            }
+        }
+    };
+    return (_jsx("button", { type: "button", ref: ref, className: classNames("w-full grow", className), onClick: handleClick, "aria-expanded": isOpen, ...props, children: children }));
+});
+AccordionTrigger.displayName = "AccordionTrigger";
+const AccordionItemContext = React.createContext(null);
+const AccordionItemProvider = ({ value, children }) => {
+    const contextValue = React.useMemo(() => ({ value }), [value]);
+    return (_jsx(AccordionItemContext.Provider, { value: contextValue, children: children }));
+};
+const AccordionContent = React.forwardRef(({ className, children, estimatedHeight, itemsCount, ...props }, ref) => {
+    const context = React.useContext(AccordionContext);
+    const itemContext = React.useContext(AccordionItemContext);
+    if (!context)
+        throw new Error("AccordionContent must be used within Accordion");
+    if (!itemContext)
+        throw new Error("AccordionContent must be used within AccordionItem");
+    const { value: accordionValue, type } = context;
+    const { value: itemValue } = itemContext;
+    const isOpen = React.useMemo(() => {
+        if (type === "multiple") {
+            return Array.isArray(accordionValue) && accordionValue.includes(itemValue);
+        }
+        return accordionValue === itemValue;
+    }, [accordionValue, itemValue, type]);
+    // Calculate dynamic duration based on items count
+    const heightDuration = React.useMemo(() => {
+        if (!itemsCount)
+            return 0.15;
+        // Base duration: 0.1s
+        // Add 0.01s per item, max 0.4s
+        const baseDuration = 0.1;
+        const perItemDuration = 0.01;
+        const maxDuration = 0.4;
+        return Math.min(baseDuration + (itemsCount * perItemDuration), maxDuration);
+    }, [itemsCount]);
+    return (_jsx(motion.div, { initial: false, animate: {
+            height: isOpen ? (estimatedHeight || "auto") : 0,
+            opacity: isOpen ? 1 : 0
+        }, transition: {
+            duration: 0.2,
+            ease: "easeInOut",
+            height: { duration: isOpen ? heightDuration : 0.15 },
+            opacity: { duration: 0.1, delay: isOpen ? 0.05 : 0 }
+        }, style: { overflow: "hidden" }, className: classNames("AccordionContent", className), children: _jsx(AnimatePresence, { mode: "wait", children: isOpen && (_jsx(motion.div, { initial: { opacity: 1 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.1 }, children: _jsx("div", { ref: ref, className: "pt-1", ...props, children: children }) })) }) }));
+});
+AccordionContent.displayName = "AccordionContent";
+const EnhancedAccordionItem = React.forwardRef(({ value, children, ...props }, ref) => (_jsx(AccordionItemProvider, { value: value, children: _jsx(AccordionItem, { ref: ref, value: value, ...props, children: children }) })));
+EnhancedAccordionItem.displayName = "AccordionItem";
+export { Accordion, EnhancedAccordionItem as AccordionItem, AccordionTrigger, AccordionContent };

package/dist/esm/components/shadcn/command.js

@@ -0,0 +1,26 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Command as CommandPrimitive } from "cmdk";
+import { classNames } from "../utils/classNames";
+const Command = React.forwardRef(({ className, ...props }, ref) => (_jsx(CommandPrimitive, { ref: ref, className: classNames("flex h-full w-full flex-col overflow-hidden rounded-md", className), ...props })));
+Command.displayName = CommandPrimitive.displayName;
+// eslint-disable-next-line react/display-name
+const CommandWrapper = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(Command, { ...props, className: classNames("[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-secondary-text [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5", className), children: children })));
+const CommandInput = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs("div", { className: "relative z-0 flex items-center mt-1 mb-2", "cmdk-input-wrapper": "", children: [_jsx("div", { className: "absolute", children: children }), _jsx(CommandPrimitive.Input, { placeholder: " ", ref: ref, id: "floating_standard", ...props, className: classNames("peer/draft text-base font-normal leading-5 bg-secondary-500 rounded-lg border-0 border-b-0 pl-8 border-primary-text focus:border-primary-text appearance-none block p-2 w-full h-11 outline-hidden focus:outline-hidden focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50", className) })] })));
+CommandInput.displayName = CommandPrimitive.Input.displayName;
+const CommandList = React.forwardRef(({ className, ...props }, ref) => (_jsx(CommandPrimitive.List, { ref: ref, className: classNames("overflow-y-auto styled-scroll-no-bg rdxCommandList overflow-x-hidden", className), ...props })));
+CommandList.displayName = CommandPrimitive.List.displayName;
+const CommandEmpty = React.forwardRef((props, ref) => (_jsx(CommandPrimitive.Empty, { ref: ref, className: "py-6 text-center text-sm", ...props })));
+CommandEmpty.displayName = CommandPrimitive.Empty.displayName;
+const CommandGroup = React.forwardRef(({ className, ...props }, ref) => (_jsx(CommandPrimitive.Group, { ref: ref, className: classNames("overflow-hidden pr-1 py-1.5 text-primary-text [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-secondary-text", className), ...props, children: _jsx("div", { className: "bg-secondary-800 rounded-md overflow-hidden", children: props.children }) })));
+CommandGroup.displayName = CommandPrimitive.Group.displayName;
+const CommandSeparator = React.forwardRef(({ className, ...props }, ref) => (_jsx(CommandPrimitive.Separator, { ref: ref, className: classNames("-mx-1 h-px bg-secondary-500", className), ...props })));
+CommandSeparator.displayName = CommandPrimitive.Separator.displayName;
+const CommandItem = React.forwardRef(({ className, ...props }, ref) => (_jsx(CommandPrimitive.Item, { ref: ref, className: classNames("!p-0 outline-none", className, props.disabled && "cursor-not-allowed"), ...props })));
+CommandItem.displayName = CommandPrimitive.Item.displayName;
+const CommandShortcut = ({ className, ...props }) => {
+    return (_jsx("span", { className: classNames("ml-auto text-xs tracking-widest text-primary-text-tertiary", className), ...props }));
+};
+CommandShortcut.displayName = "CommandShortcut";
+export { Command, CommandWrapper, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };

package/dist/esm/components/shadcn/dialog.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as DialogPrimitive from "@radix-ui/react-dialog";
+import { X } from "lucide-react";
+import { classNames } from "../utils/classNames";
+const Dialog = DialogPrimitive.Root;
+const DialogTrigger = DialogPrimitive.Trigger;
+const DialogPortal = ({ children, ...props }) => (_jsx(DialogPrimitive.Portal, { ...props, children: _jsx("div", { className: "fixed inset-0 z-50 flex items-end justify-center sm:items-center", children: children }) }));
+DialogPortal.displayName = DialogPrimitive.Portal.displayName;
+const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Overlay, { ref: ref, className: classNames("fixed inset-0 z-50 bg-black/50 backdrop-blur-xs transition-all duration-100 data-[state=closed]:animate-out data-[state=closed]:fade-out data-[state=open]:fade-in", className), ...props })));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+const DialogContent = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsxs(DialogPrimitive.Content, { ref: ref, className: classNames("fixed z-50 grid w-full gap-4 rounded-t-lg bg-secondary-800 p-4 shadow-lg animate-in data-[state=open]:fade-in-90 data-[state=open]:slide-in-from-bottom-10 sm:max-w-sm sm:rounded-lg sm:zoom-in-90 sm:data-[state=open]:slide-in-from-bottom-0", className), ...props, children: [children, _jsxs(DialogPrimitive.Close, { className: "absolute text-secondary-text right-4 top-3 p-1 justify-self-start hover:brightness-105 hover:scale-110 duartion-100 ring-1 ring-secondary-400 transition bg-secondary-500 hover:text-primary-text focus:outline-hidden rounded-full items-center", children: [_jsx(X, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "Close" })] })] })] })));
+DialogContent.displayName = DialogPrimitive.Content.displayName;
+const DialogHeader = ({ className, ...props }) => (_jsx("div", { className: classNames("flex flex-col space-y-1.5 text-center sm:text-left", className), ...props }));
+DialogHeader.displayName = "DialogHeader";
+const DialogFooter = ({ className, ...props }) => (_jsx("div", { className: classNames("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className), ...props }));
+DialogFooter.displayName = "DialogFooter";
+const DialogTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Title, { ref: ref, className: classNames("text-lg font-normal leading-none tracking-tight text-primary-text", className), ...props })));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+const DialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Description, { ref: ref, className: classNames("text-sm text-secondary-text", className), ...props })));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+export { Dialog, DialogTrigger, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };

package/dist/esm/components/shadcn/index.js

@@ -0,0 +1,8 @@
+export * from "./select";
+export * from "./checkbox";
+export * from "./dialog";
+export * from "./command";
+export * from "./tab";
+export * from "./tooltip";
+export * from "./popover";
+export * from "./accordion";

package/dist/esm/components/shadcn/popover.js

@@ -0,0 +1,18 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import clsx from 'clsx';
+function Popover({ ...props }) {
+    return _jsx(PopoverPrimitive.Root, { "data-slot": "popover", ...props });
+}
+function PopoverTrigger({ ...props }) {
+    return _jsx(PopoverPrimitive.Trigger, { "data-slot": "popover-trigger", ...props });
+}
+function PopoverContent({ className, align = "center", sideOffset = 4, ...props }) {
+    const container = document.getElementById('widget');
+    return (_jsx(PopoverPrimitive.Portal, { container: container, children: _jsx(PopoverPrimitive.Content, { "data-slot": "popover-content", align: align, sideOffset: sideOffset, onOpenAutoFocus: (e) => e.preventDefault(), className: clsx("z-50 w-fit max-w-72 rounded-xl bg-secondary-600 p-2 text-secondary-text shadow-md outline-hidden animate-in data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className), ...props }) }));
+}
+function PopoverAnchor({ ...props }) {
+    return _jsx(PopoverPrimitive.Anchor, { "data-slot": "popover-anchor", ...props });
+}
+export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };

package/dist/esm/components/shadcn/progressBar.js

@@ -0,0 +1,8 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as ProgressPrimitive from "@radix-ui/react-progress";
+import { classNames } from "../utils/classNames";
+const Progress = React.forwardRef(({ className, value, ...props }, ref) => (_jsx(ProgressPrimitive.Root, { ref: ref, className: classNames("relative h-4 w-full overflow-hidden rounded-full bg-primary/20", className), ...props, children: _jsx(ProgressPrimitive.Indicator, { className: "h-full w-full flex-1 transition-all bg-primary", style: { transform: `translateX(-${100 - (value || 0)}%)` } }) })));
+Progress.displayName = ProgressPrimitive.Root.displayName;
+export { Progress };

package/dist/esm/components/shadcn/select.js

@@ -0,0 +1,20 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { Check, ChevronRight } from "lucide-react";
+import { classNames } from "../utils/classNames";
+const Select = SelectPrimitive.Root;
+const SelectGroup = SelectPrimitive.Group;
+const SelectValue = SelectPrimitive.Value;
+const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(SelectPrimitive.Trigger, { ref: ref, className: classNames("flex h-10 w-full items-center justify-between rounded-md border border-slate-300 bg-transparent py-2 px-3 text-sm placeholder:text-secondary-text focus:outline-hidden focus:ring-0 disabled:cursor-not-allowed disabled:opacity-50 dark:border-slate-700 dark:text-primary-text", className), ...props, children: [children, _jsx(ChevronRight, { className: "h-4 w-4 text-primary-text" })] })));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+const SelectContent = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(SelectPrimitive.Portal, { children: _jsx(SelectPrimitive.Content, { ref: ref, className: classNames("animate-in fade-in-80 relative z-50 min-w-[8rem] overflow-hidden rounded-md shadow-md ring-1 ring-secondary-500 bg-secondary-700 text-secondary-text", className), ...props, children: _jsx(SelectPrimitive.Viewport, { className: "p-1", children: children }) }) })));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+const SelectLabel = React.forwardRef(({ className, ...props }, ref) => (_jsx(SelectPrimitive.Label, { ref: ref, className: classNames("py-1.5 pr-2 pl-8 text-sm font-semibold text-primary-text-tertiary", className), ...props })));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+const SelectItem = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(SelectPrimitive.Item, { ref: ref, className: classNames("relative flex cursor-default select-none items-center rounded-xs py-1.5 pr-2 pl-8 text-sm outline-hidden focus:bg-slate-100 data-disabled:pointer-events-none data-disabled:opacity-50 dark:focus:bg-slate-700", className), ...props, children: [_jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: _jsx(SelectPrimitive.ItemIndicator, { children: _jsx(Check, { className: "h-4 w-4" }) }) }), _jsx(SelectPrimitive.ItemText, { children: children })] })));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+const SelectSeparator = React.forwardRef(({ className, ...props }, ref) => (_jsx(SelectPrimitive.Separator, { ref: ref, className: classNames("-mx-1 my-1 h-px bg-slate-100 dark:bg-slate-700", className), ...props })));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
+export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, };

package/dist/esm/components/shadcn/tab.js

@@ -0,0 +1,13 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import { classNames } from "../utils/classNames";
+const Tabs = TabsPrimitive.Root;
+const TabsList = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.List, { ref: ref, className: classNames("inline-flex h-9 items-center justify-center rounded-lg bg-muted p-1", className), ...props })));
+TabsList.displayName = TabsPrimitive.List.displayName;
+const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.Trigger, { ref: ref, className: classNames("inline-flex items-center justify-center whitespace-nowrap rounded-md px-3 py-1 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow", className), ...props })));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+const TabsContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.Content, { ref: ref, className: classNames("mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", className), ...props })));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+export { Tabs, TabsList, TabsTrigger, TabsContent };

package/dist/esm/components/shadcn/tooltip.js

@@ -0,0 +1,48 @@
+"use client";
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { clsx } from "clsx";
+function TooltipProvider({ delayDuration = 0, ...props }) {
+    return (_jsx(TooltipPrimitive.Provider, { "data-slot": "tooltip-provider", delayDuration: delayDuration, ...props }));
+}
+const TooltipClickContext = React.createContext({ openOnClick: false });
+function Tooltip({ delayDuration = 400, openOnClick, open: controlledOpen, onOpenChange, ...props }) {
+    const isClickable = Boolean(openOnClick);
+    const [uncontrolledOpen, setUncontrolledOpen] = React.useState(false);
+    const isControlled = controlledOpen !== undefined;
+    const open = isControlled ? controlledOpen : uncontrolledOpen;
+    const handleOpenChange = (next) => {
+        if (isClickable) {
+            if (!isControlled)
+                setUncontrolledOpen(next);
+            onOpenChange?.(next);
+            return;
+        }
+        onOpenChange?.(next);
+    };
+    const toggle = React.useCallback(() => {
+        const next = !open;
+        if (!isControlled)
+            setUncontrolledOpen(next);
+        onOpenChange?.(next);
+    }, [open, isControlled, onOpenChange]);
+    return (_jsx(TooltipProvider, { children: _jsx(TooltipClickContext.Provider, { value: { openOnClick: isClickable, toggle }, children: _jsx(TooltipPrimitive.Root, { "data-slot": "tooltip", delayDuration: delayDuration, ...(isClickable ? { open, onOpenChange: handleOpenChange } : { onOpenChange }), ...props }) }) }));
+}
+function TooltipTrigger({ className, onClick, ...props }) {
+    const { openOnClick, toggle } = React.useContext(TooltipClickContext);
+    const handleClick = (e) => {
+        onClick?.(e);
+        if (openOnClick) {
+            e.preventDefault();
+            e.stopPropagation();
+            toggle?.();
+        }
+    };
+    return _jsx(TooltipPrimitive.Trigger, { "data-slot": "tooltip-trigger", className: clsx("cursor-pointer", className), onClick: handleClick, ...props });
+}
+function TooltipContent({ className, sideOffset = 0, children, arrowClasses, ...props }) {
+    const container = document.getElementById('widget');
+    return (_jsx(TooltipPrimitive.Portal, { container: container, children: _jsx(TooltipPrimitive.Content, { "data-slot": "tooltip-content", sideOffset: sideOffset, className: clsx("z-50 rounded-md border border-secondary-600 bg-secondary-800 px-3 py-1.5 text-xs text-secondary-text animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", className), ...props, children: children }) }));
+}
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/dist/esm/components/themeWrapper.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { X } from "lucide-react";
+import toast, { ToastBar, Toaster } from "react-hot-toast";
+import { TooltipProvider } from "./shadcn/tooltip";
+export default function ThemeWrapper({ children }) {
+    return _jsx(TooltipProvider, { delayDuration: 400, children: _jsx("main", { className: "styled-scroll", children: _jsxs("div", { className: `flex flex-col items-center overflow-hidden relative font-robo`, children: [_jsx(Toaster, { position: "top-center", toastOptions: {
+                            duration: 5000,
+                            style: {
+                                background: 'rgb(var(--ls-colors-secondary-600))',
+                                color: 'rgb(var(--ls-colors-secondary-text))'
+                            },
+                            position: 'top-center',
+                            error: {
+                                duration: Infinity,
+                            },
+                        }, children: (t) => (_jsx(ToastBar, { toast: t, children: ({ icon, message }) => (_jsxs(_Fragment, { children: [icon, message, t.type !== 'loading' && (_jsx("button", { type: "button", onClick: () => toast.dismiss(t.id), children: _jsx(X, { className: "h-5" }) }))] })) })) }), _jsx("div", { className: "w-full h-full max-w-lg z-[1] sm:mb-6", children: _jsx("div", { className: "flex h-full content-center items-center justify-center space-y-5 flex-col container mx-auto sm:px-[20px] max-w-lg", children: _jsx("div", { className: "h-full w-full text-primary-text", children: children }) }) }), _jsx("div", { id: "offset-for-stickyness", className: "block md:hidden" })] }) }) });
+}

package/dist/esm/components/utils/RoundDecimals.js

@@ -0,0 +1,51 @@
+export function roundDecimals(value, decimals) {
+    if (decimals === 1) {
+        decimals = 0;
+    }
+    return Number(Math.ceil(Number(value + 'e' + decimals)) + 'e-' + decimals);
+}
+export function truncateDecimals(value, decimals = 0) {
+    if (value === 0)
+        return '0';
+    const factor = Math.pow(10, decimals);
+    const truncated = Math.trunc(value * factor) / factor;
+    const formatted = isScientific(truncated)
+        ? truncated.toFixed(decimals).replace(/\.?0+$/, '')
+        : truncated.toString();
+    return Number(formatted).toLocaleString('en-US', {
+        minimumFractionDigits: 0,
+        maximumFractionDigits: decimals
+    });
+}
+export function truncateDecimalsToFloor(number, decimalPlaces) {
+    let factor = Math.pow(10, decimalPlaces);
+    return Math.floor(number * factor) / factor;
+}
+export function findIndexOfFirstNonZeroAfterComma(number) {
+    // Convert the number to a string
+    let numberStr = number.toString();
+    // Find the position of the decimal point
+    let decimalIndex = numberStr.indexOf('.');
+    // If there's no decimal point, return null
+    if (decimalIndex === -1) {
+        return null;
+    }
+    // Loop through the characters after the decimal point
+    for (let i = decimalIndex + 1; i < numberStr.length; i++) {
+        if (numberStr[i] !== '0') {
+            return i - decimalIndex; // Position after the decimal point
+        }
+    }
+    // If no non-zero number was found, return null
+    return null;
+}
+export function isScientific(x) {
+    const s = String(x);
+    // 1) If it’s already a string that “looks like” sci-notation, catch it:
+    if (/^[+-]?\d+(?:\.\d+)?[eE][+-]?\d+$/.test(s)) {
+        return true;
+    }
+    // 2) Otherwise, convert to Number (in case it's a numeric string or other) 
+    //    and see if toString() uses 'e' (lowercased for consistency):
+    return Number(s).toString().toLowerCase().includes('e');
+}

package/dist/esm/components/utils/SwapStatus.js

@@ -0,0 +1,11 @@
+import { SwapStatus } from "../../Models/SwapStatus";
+export const ResolvePollingInterval = (step) => {
+    switch (step) {
+        case SwapStatus.Failed:
+        case SwapStatus.UserTransferDelayed:
+        case SwapStatus.Completed:
+            return 0;
+        default:
+            return 1000;
+    }
+};

package/dist/esm/components/utils/dateDifference.js

@@ -0,0 +1,34 @@
+export const getDateDifferenceString = (fromDate, toDate = new Date()) => {
+    let years = toDate.getFullYear() - fromDate.getFullYear();
+    let months = toDate.getMonth() - fromDate.getMonth();
+    let days = toDate.getDate() - fromDate.getDate();
+    // Adjust negative days
+    if (days < 0) {
+        months--;
+        const prevMonth = new Date(toDate.getFullYear(), toDate.getMonth(), 0);
+        days += prevMonth.getDate();
+    }
+    // Adjust negative months
+    if (months < 0) {
+        years--;
+        months += 12;
+    }
+    const parts = [];
+    if (years > 0) {
+        // Convert months to days and add to days count
+        const daysFromMonths = months * 30; // Approximation
+        const totalDays = days + daysFromMonths;
+        parts.push(`${years} year${years !== 1 ? "s" : ""}`);
+        if (totalDays > 0)
+            parts.push(`${totalDays} day${totalDays !== 1 ? "s" : ""}`);
+    }
+    else if (months > 0) {
+        parts.push(`${months} month${months !== 1 ? "s" : ""}`);
+        if (days > 0)
+            parts.push(`${days} day${days !== 1 ? "s" : ""}`);
+    }
+    else if (days > 0) {
+        parts.push(`${days} day${days !== 1 ? "s" : ""}`);
+    }
+    return parts.length > 0 ? `(${parts.join(", ")} ago)` : ``;
+};

package/dist/esm/components/utils/formatUsdAmount.js

@@ -0,0 +1,12 @@
+export function formatUsd(amount) {
+    if (amount === undefined || amount === null)
+        return '$0.00';
+    if (amount > 0 && amount < 0.01)
+        return '<$0.01';
+    return new Intl.NumberFormat('en-US', {
+        style: 'currency',
+        currency: 'USD',
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2,
+    }).format(amount);
+}

package/dist/esm/components/utils/numbers.js

@@ -0,0 +1,3 @@
+export function isDiffByPercent(a, b, perc) {
+    return Math.abs(a - b) / Math.abs(a) > perc / 100;
+}

package/dist/esm/components/utils/swapUtils.js

@@ -0,0 +1 @@
+export const swapInProgress = { current: false };

package/dist/esm/context/LayerswapProvider.js

@@ -0,0 +1,49 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import ThemeWrapper from "../components/themeWrapper";
+import { ErrorBoundary } from "react-error-boundary";
+import { SettingsProvider } from "./settings";
+import { LayerSwapAppSettings } from "../Models/LayerSwapAppSettings";
+import ErrorFallback from "../components/ErrorFallback";
+import { THEME_COLORS } from "../Models/Theme";
+import { AsyncModalProvider } from "./asyncModal";
+import { IntercomProvider } from 'react-use-intercom';
+import AppSettings from "../lib/AppSettings";
+import { getSettings } from "../helpers/getSettings";
+import LayerSwapApiClient from "../lib/apiClients/layerSwapApiClient";
+import ColorSchema from "../components/ColorSchema";
+import { WidgetLoading } from "../components/WidgetLoading";
+import WalletsProviders from "../components/Wallet/WalletProviders";
+import { CallbackProvider } from "./callbackProvider";
+import { BalanceAccountsProvider } from "./balanceAccounts";
+import { ResolverProviders } from "./resolverContext";
+const INTERCOM_APP_ID = 'h5zisg78';
+const LayerswapProviderComponent = ({ children, settings: _settings, themeData, apiKey, integrator, version, callbacks, initialValues, walletConnect, imtblPassport, walletProviders = [] }) => {
+    const [fetchedSettings, setFetchedSettings] = useState(null);
+    AppSettings.ApiVersion = version;
+    AppSettings.Integrator = integrator;
+    AppSettings.ThemeData = { ...THEME_COLORS['default'], ...themeData };
+    AppSettings.ImtblPassportConfig = imtblPassport;
+    if (apiKey)
+        LayerSwapApiClient.apiKey = apiKey;
+    useEffect(() => {
+        if (!_settings) {
+            (async () => {
+                const fetchedSettings = await getSettings();
+                if (!fetchedSettings)
+                    throw new Error('Failed to fetch settings');
+                setFetchedSettings(fetchedSettings);
+            })();
+        }
+    }, []);
+    const settings = _settings || fetchedSettings;
+    if (!settings)
+        return _jsx(WidgetLoading, {});
+    let appSettings = new LayerSwapAppSettings(settings);
+    themeData = { ...THEME_COLORS['default'], ...themeData };
+    return (_jsx(IntercomProvider, { appId: INTERCOM_APP_ID, initializeDelay: 2500, children: _jsx(SettingsProvider, { initialLayerswapData: appSettings, initialSettings: initialValues, children: _jsx(CallbackProvider, { callbacks: callbacks, children: _jsx(ErrorBoundary, { FallbackComponent: ErrorFallback, children: _jsx(ThemeWrapper, { children: _jsx(WalletsProviders, { appName: integrator, basePath: "/", themeData: themeData, walletProviders: walletProviders, children: _jsx(ResolverProviders, { walletProviders: walletProviders, children: _jsx(BalanceAccountsProvider, { children: _jsx(AsyncModalProvider, { children: children }) }) }) }) }) }) }) }) }));
+};
+export const LayerswapProvider = (props) => {
+    return (_jsxs(_Fragment, { children: [_jsx(ColorSchema, { themeData: props.themeData }), _jsx("div", { style: { backgroundColor: 'transparent' }, className: "layerswap-styles", children: _jsx(LayerswapProviderComponent, { ...props, children: props.children }) })] }));
+};

package/dist/esm/context/asyncModal.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from "react";
+import SubmitButton from "../components/Buttons/submitButton";
+import SecondaryButton from "../components/Buttons/secondaryButton";
+import VaulDrawer from "../components/Modal/vaulModal";
+;
+const AsyncModal = ({ onConfirm, onDismiss, children, submitText, dismissText, ...props }) => {
+    return (_jsx(VaulDrawer, { onClose: onDismiss, ...props, children: _jsx(VaulDrawer.Snap, { id: "item-1", children: _jsxs("div", { className: "flex flex-col items-center gap-2 mt-2", children: [children, _jsxs("div", { className: "h-full w-full space-y-3", children: [_jsx(SubmitButton, { type: "button", onClick: onConfirm, children: submitText ?? 'Confirm' }), dismissText &&
+                                _jsx(SecondaryButton, { className: "w-full h-full py-3 !text-base", size: "xl", onClick: onDismiss, children: dismissText })] })] }) }) }));
+};
+const AsyncModalContext = React.createContext(null);
+const AsyncModalProvider = ({ children }) => {
+    const [dialogOpen, setDialogOpen] = React.useState(false);
+    const [dialogConfig, setDialogConfig] = React.useState(undefined);
+    const openDialog = ({ content, actionCallback, submitText, dismissText }) => {
+        setDialogOpen(true);
+        setDialogConfig({ content, actionCallback, submitText, dismissText });
+    };
+    const resetDialog = () => {
+        setDialogOpen(false);
+    };
+    const onConfirm = () => {
+        resetDialog();
+        dialogConfig?.actionCallback(true);
+    };
+    const onDismiss = () => {
+        resetDialog();
+        dialogConfig?.actionCallback(false);
+    };
+    return (_jsxs(AsyncModalContext.Provider, { value: { openDialog }, children: [_jsx(AsyncModal, { show: dialogOpen, setShow: setDialogOpen, onConfirm: onConfirm, onDismiss: onDismiss, onAnimationEnd: (v) => !v && setDialogConfig(undefined), submitText: dialogConfig?.submitText, dismissText: dialogConfig?.dismissText, modalId: "asyncModal", children: dialogConfig?.content }), children] }));
+};
+const useAsyncModal = () => {
+    const context = React.useContext(AsyncModalContext);
+    if (context === undefined) {
+        throw new Error('useAsyncModal must be used within a AsyncModalProvider');
+    }
+    const getConfirmation = ({ content, dismissText, submitText }) => new Promise((res) => {
+        context.openDialog({ content, actionCallback: res, submitText, dismissText });
+    });
+    return { getConfirmation };
+};
+export { AsyncModalProvider, useAsyncModal };