@silentswap/ui-kit 0.0.42 → 0.0.43

package/dist/components/dialog.js

@@ -0,0 +1,99 @@
+'use client';
+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 { motion } from 'motion/react';
+import { cn } from '../utils';
+import { useIsMobile } from '../hooks/use-mobile';
+const Dialog = DialogPrimitive.Root;
+const DialogTrigger = DialogPrimitive.Trigger;
+const DialogPortal = DialogPrimitive.Portal;
+const DialogClose = DialogPrimitive.Close;
+const DialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Overlay, { asChild: true, ...props, children: _jsx(motion.div, { ref: ref, className: cn('fixed z-50', className), style: {
+            top: 0,
+            left: 0,
+            right: 0,
+            bottom: 0,
+            width: '100%',
+            height: '200%',
+            background: 'rgba(0, 0, 0, 0.80)',
+            opacity: 0.7,
+        }, initial: { opacity: 0 }, animate: { opacity: 0.7 }, exit: { opacity: 0 }, transition: { duration: 0.2, ease: 'easeOut' } }) })));
+DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
+// Desktop animation - centered modal
+const contentVariants = {
+    hidden: {
+        opacity: 0,
+        scale: 0.95,
+        x: '-50%',
+        y: '-48%',
+    },
+    visible: {
+        opacity: 1,
+        scale: 1,
+        x: '-50%',
+        y: '-50%',
+        transition: {
+            type: 'spring',
+            stiffness: 300,
+            damping: 30,
+            opacity: { duration: 0.2 },
+        },
+    },
+    exit: {
+        opacity: 0,
+        scale: 0.95,
+        x: '-50%',
+        y: '-48%',
+        transition: {
+            duration: 0.15,
+            ease: 'easeIn',
+        },
+    },
+};
+// Mobile animation - bottom sheet slides up from bottom
+const contentVariantsBottomSheet = {
+    hidden: {
+        opacity: 0,
+        y: '100%',
+        x: '-50%',
+    },
+    visible: {
+        opacity: 1,
+        y: 0,
+        x: '-50%',
+        transition: {
+            type: 'spring',
+            stiffness: 300,
+            damping: 30,
+            opacity: { duration: 0.2 },
+        },
+    },
+    exit: {
+        opacity: 0,
+        y: '100%',
+        x: '-50%',
+        transition: {
+            duration: 0.25,
+            ease: 'easeIn',
+        },
+    },
+};
+const DialogContent = React.forwardRef(({ className, children, ...props }, ref) => {
+    const isMobile = useIsMobile();
+    return (_jsxs(DialogPortal, { children: [_jsx(DialogOverlay, {}), _jsx(DialogPrimitive.Content, { asChild: true, ...props, children: isMobile ? (_jsxs(motion.div, { ref: ref, className: cn('!fixed !left-[50%] !bottom-0 !top-auto z-50 w-full max-w-lg gap-4 border bg-background shadow-lg rounded-t-[20px] border-b-0 flex flex-col', className), style: {
+                        height: '650px',
+                        maxHeight: '90vh',
+                    }, variants: contentVariantsBottomSheet, initial: "hidden", animate: "visible", exit: "exit", children: [children, props?.role !== 'wizard' && (_jsxs(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-0 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground text-yellow-400", children: [_jsx(X, { className: "h-4 w-4" }), _jsx("span", { className: "sr-only", children: "Close" })] }))] })) : (_jsxs(motion.div, { ref: ref, className: cn('fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg gap-4 border bg-background p-6 shadow-lg rounded-[20px]', className), variants: contentVariants, initial: "hidden", animate: "visible", exit: "exit", children: [children, props?.role !== 'wizard' && (_jsxs(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-0 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground text-yellow-400", 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: cn('flex flex-col space-y-1.5 text-center sm:text-left', className), ...props }));
+DialogHeader.displayName = 'DialogHeader';
+const DialogFooter = ({ className, ...props }) => (_jsx("div", { className: cn('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: cn('text-lg font-semibold leading-none tracking-tight', className), ...props })));
+DialogTitle.displayName = DialogPrimitive.Title.displayName;
+const DialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DialogPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
+DialogDescription.displayName = DialogPrimitive.Description.displayName;
+export { Dialog, DialogPortal, DialogOverlay, DialogTrigger, DialogClose, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };

package/dist/components/disconnect-confirmation-dialog.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface DisconnectConfirmationDialogProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    onDisconnect: () => void;
+    onDisconnectAndErase: () => void;
+    walletType?: string;
+}
+export declare const DisconnectConfirmationDialog: React.FC<DisconnectConfirmationDialogProps>;
+export {};

package/dist/components/disconnect-confirmation-dialog.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { AlertDialog, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle, } from './alert-dialog';
+import { Button } from './button';
+export const DisconnectConfirmationDialog = ({ open, onOpenChange, onDisconnect, onDisconnectAndErase, }) => {
+    return (_jsx(AlertDialog, { open: open, onOpenChange: onOpenChange, children: _jsx(AlertDialogContent, { className: "bg-container border-base-stroke p-6 max-w-md", children: _jsxs(AlertDialogHeader, { className: "space-y-4", children: [_jsxs("div", { className: "space-y-4", children: [_jsx(AlertDialogTitle, { className: "text-white text-sm font-medium leading-[1.5] text-left", children: "Are you sure you want to disconnect this wallet?" }), _jsxs(AlertDialogFooter, { className: "flex-col gap-4 sm:flex-col sm:gap-4", children: [_jsx(Button, { onClick: () => {
+                                            onOpenChange(false);
+                                        }, className: "w-full h-14 bg-secondary hover:bg-secondary/80 text-primary font-medium text-lg rounded-xl", children: "Cancel" }), _jsx(Button, { onClick: () => {
+                                            onDisconnect();
+                                            onOpenChange(false);
+                                        }, className: "w-full h-14 bg-primary hover:bg-primary/90 text-black font-medium text-lg rounded-xl", children: "Disconnect" })] })] }), _jsxs("div", { className: "space-y-4 pt-4 border-t border-base-stroke", children: [_jsx(AlertDialogDescription, { className: "text-white text-sm font-medium leading-[1.5] text-left", children: "Would you like to erase all data?" }), _jsx(Button, { onClick: () => {
+                                    onDisconnectAndErase();
+                                    onOpenChange(false);
+                                }, className: "w-full h-14 bg-[#251818] hover:bg-[#251818]/80 text-[#ff383c] font-medium text-lg rounded-xl", children: "Disconnect & Erase" })] })] }) }) }));
+};

package/dist/components/drawer copy.js

@@ -0,0 +1,25 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { Drawer as DrawerPrimitive } from 'vaul';
+import { cn } from '@/lib/utils';
+const Drawer = ({ shouldScaleBackground = true, ...props }) => (_jsx(DrawerPrimitive.Root, { shouldScaleBackground: shouldScaleBackground, ...props }));
+Drawer.displayName = 'Drawer';
+const DrawerTrigger = DrawerPrimitive.Trigger;
+const DrawerPortal = DrawerPrimitive.Portal;
+const DrawerClose = DrawerPrimitive.Close;
+const DrawerOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Overlay, { ref: ref, className: cn('fixed inset-0 z-50 bg-black/60 backdrop-blur-[1px]', className), ...props })));
+DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
+const DrawerContent = React.forwardRef(({ className, children, ...props }, ref) => (
+// @ts-ignore
+_jsxs(DrawerPortal, { children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerPrimitive.Content, { ref: ref, className: cn('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border', className), ...props, children: [_jsx("div", { className: "mx-auto mt-4 h-1 w-[100px] rounded-full bg-yellow-500 fixed inset-0" }), _jsx("div", { className: "mt-5", children: children })] })] })));
+DrawerContent.displayName = 'DrawerContent';
+const DrawerHeader = ({ className, ...props }) => (_jsx("div", { className: cn('grid gap-1.5 p-4 text-center sm:text-left', className), ...props }));
+DrawerHeader.displayName = 'DrawerHeader';
+const DrawerFooter = ({ className, ...props }) => (_jsx("div", { className: cn('mt-auto flex flex-col gap-2 p-4', className), ...props }));
+DrawerFooter.displayName = 'DrawerFooter';
+const DrawerTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Title, { ref: ref, className: cn('text-lg font-semibold leading-none tracking-tight', className), ...props })));
+DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
+const DrawerDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
+DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
+export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContent, DrawerHeader, DrawerFooter, DrawerTitle, DrawerDescription, };

package/dist/components/drawer.d.ts

@@ -0,0 +1,22 @@
+import * as React from 'react';
+import { Drawer as DrawerPrimitive } from 'vaul';
+declare const Drawer: {
+    ({ shouldScaleBackground, ...props }: React.ComponentProps<typeof DrawerPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DrawerTrigger: typeof DrawerPrimitive.Trigger;
+declare const DrawerPortal: typeof import("vaul").Portal;
+declare const DrawerClose: typeof DrawerPrimitive.Close;
+declare const DrawerOverlay: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dialog").DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DrawerContent: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-dialog").DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DrawerHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DrawerFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DrawerTitle: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dialog").DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DrawerDescription: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-dialog").DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContent, DrawerHeader, DrawerFooter, DrawerTitle, DrawerDescription, };

package/dist/components/drawer.js

@@ -0,0 +1,25 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import { Drawer as DrawerPrimitive } from 'vaul';
+import { cn } from '../utils';
+const Drawer = ({ shouldScaleBackground = true, ...props }) => (_jsx(DrawerPrimitive.Root, { shouldScaleBackground: shouldScaleBackground, ...props }));
+Drawer.displayName = 'Drawer';
+const DrawerTrigger = DrawerPrimitive.Trigger;
+const DrawerPortal = DrawerPrimitive.Portal;
+const DrawerClose = DrawerPrimitive.Close;
+const DrawerOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Overlay, { ref: ref, className: cn('fixed inset-0 z-50 bg-black/60 backdrop-blur-[1px]', className), ...props })));
+DrawerOverlay.displayName = DrawerPrimitive.Overlay.displayName;
+const DrawerContent = React.forwardRef(({ className, children, ...props }, ref) => (
+// @ts-ignore
+_jsxs(DrawerPortal, { children: [_jsx(DrawerOverlay, {}), _jsxs(DrawerPrimitive.Content, { ref: ref, className: cn('fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border', className), ...props, children: [_jsx("div", { className: "mx-auto mt-4 h-1 w-[100px] rounded-full bg-yellow-500 fixed inset-0" }), _jsx("div", { className: "mt-5", children: children })] })] })));
+DrawerContent.displayName = 'DrawerContent';
+const DrawerHeader = ({ className, ...props }) => (_jsx("div", { className: cn('grid gap-1.5 p-4 text-center sm:text-left', className), ...props }));
+DrawerHeader.displayName = 'DrawerHeader';
+const DrawerFooter = ({ className, ...props }) => (_jsx("div", { className: cn('mt-auto flex flex-col gap-2 p-4', className), ...props }));
+DrawerFooter.displayName = 'DrawerFooter';
+const DrawerTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Title, { ref: ref, className: cn('text-lg font-semibold leading-none tracking-tight', className), ...props })));
+DrawerTitle.displayName = DrawerPrimitive.Title.displayName;
+const DrawerDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(DrawerPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
+DrawerDescription.displayName = DrawerPrimitive.Description.displayName;
+export { Drawer, DrawerPortal, DrawerOverlay, DrawerTrigger, DrawerClose, DrawerContent, DrawerHeader, DrawerFooter, DrawerTitle, DrawerDescription, };

package/dist/components/dropdown-menu.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, };

package/dist/components/dropdown-menu.js

@@ -0,0 +1,33 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { Check, ChevronRight, Circle } from 'lucide-react';
+import { cn } from '../utils';
+const DropdownMenu = DropdownMenuPrimitive.Root;
+const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
+const DropdownMenuGroup = DropdownMenuPrimitive.Group;
+const DropdownMenuPortal = DropdownMenuPrimitive.Portal;
+const DropdownMenuSub = DropdownMenuPrimitive.Sub;
+const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
+const DropdownMenuSubTrigger = React.forwardRef(({ className, inset, children, ...props }, ref) => (_jsxs(DropdownMenuPrimitive.SubTrigger, { ref: ref, className: cn('flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0', inset && 'pl-8', className), ...props, children: [children, _jsx(ChevronRight, { className: "ml-auto" })] })));
+DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
+const DropdownMenuSubContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(DropdownMenuPrimitive.SubContent, { ref: ref, className: cn('z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-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 })));
+DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
+const DropdownMenuContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Portal, { children: _jsx(DropdownMenuPrimitive.Content, { ref: ref, sideOffset: sideOffset, className: cn('z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md', 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-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 }) })));
+DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
+const DropdownMenuItem = React.forwardRef(({ className, inset, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Item, { ref: ref, className: cn('relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&>svg]:size-4 [&>svg]:shrink-0', inset && 'pl-8', className), ...props })));
+DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
+const DropdownMenuCheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => (_jsxs(DropdownMenuPrimitive.CheckboxItem, { ref: ref, className: cn('relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', className), checked: checked, ...props, children: [_jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(Check, { className: "h-4 w-4" }) }) }), children] })));
+DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
+const DropdownMenuRadioItem = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(DropdownMenuPrimitive.RadioItem, { ref: ref, className: cn('relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', className), ...props, children: [_jsx("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: _jsx(DropdownMenuPrimitive.ItemIndicator, { children: _jsx(Circle, { className: "h-2 w-2 fill-current" }) }) }), children] })));
+DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
+const DropdownMenuLabel = React.forwardRef(({ className, inset, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Label, { ref: ref, className: cn('px-2 py-1.5 text-sm font-semibold', inset && 'pl-8', className), ...props })));
+DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
+const DropdownMenuSeparator = React.forwardRef(({ className, ...props }, ref) => (_jsx(DropdownMenuPrimitive.Separator, { ref: ref, className: cn('-mx-1 my-1 h-px bg-muted', className), ...props })));
+DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
+const DropdownMenuShortcut = ({ className, ...props }) => {
+    return _jsx("span", { className: cn('ml-auto text-xs tracking-widest opacity-60', className), ...props });
+};
+DropdownMenuShortcut.displayName = 'DropdownMenuShortcut';
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, };

package/dist/components/icons.d.ts

@@ -0,0 +1,30 @@
+import React from 'react';
+interface IconProps {
+    className?: string;
+    width?: number | string;
+    height?: number | string;
+}
+export declare const TwitterIcon: React.FC<IconProps>;
+export declare const TelegramIcon: React.FC<IconProps>;
+export declare const InfoIcon: React.FC<IconProps>;
+export declare const DisconnectIcon: React.FC<IconProps>;
+export declare const AddIcon: React.FC<IconProps>;
+export declare const CloseIcon: React.FC<IconProps>;
+export declare const SearchIcon: React.FC<IconProps>;
+export declare const PasteIcon: React.FC<IconProps>;
+export declare const ArrowExpandIcon: React.FC<IconProps>;
+export declare const RangeSliderIcon: React.FC<IconProps>;
+export declare const LoadingQuoteIcon: React.FC<IconProps>;
+export declare const LoaderIcon: React.FC<IconProps>;
+export declare const EmptyContactIcon: React.FC<IconProps>;
+export declare const CompletedCheckIcon: React.FC<IconProps>;
+export declare const InputAssetEmptyContactIcon: React.FC<IconProps>;
+export declare const CompleteAnonIcon: React.FC<IconProps>;
+export declare const SupportIcon: React.FC<IconProps>;
+export declare const ClockIcon: React.FC<IconProps>;
+export declare const CheckIcon: React.FC<IconProps>;
+export declare const XIcon: React.FC<IconProps>;
+export declare const SpinnerIcon: React.FC<IconProps>;
+export declare const RefreshIcon: React.FC<IconProps>;
+export declare const BinocularsIcon: React.FC<IconProps>;
+export {};

package/dist/components/icons.js

@@ -0,0 +1,71 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+export const TwitterIcon = ({}) => {
+    return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M10.668 7.88086L14.1357 3.85254H16.0781L11.5312 9.13477L16.3418 16.1396H12.1025L9.16797 11.876L5.5 16.1396H3.55762L8.30371 10.6221L3.65723 3.85254H7.89648L10.668 7.88086ZM9.55762 9.8623L10.002 10.5059L10.0029 10.5068L12.9404 14.7168H13.6055L10.2598 9.93164L9.81641 9.28809L7.04102 5.32227H6.37695L9.55762 9.8623Z", fill: "currentColor" }), _jsx("rect", { x: "2", width: "16", height: "2", fill: "#FFD600" }), _jsx("rect", { x: "2", y: "18", width: "16", height: "2", fill: "#FFD600" }), _jsx("rect", { y: "2", width: "2", height: "16", fill: "#FFD600" }), _jsx("rect", { x: "18", y: "2", width: "2", height: "16", fill: "#FFD600" })] }));
+};
+export const TelegramIcon = ({}) => {
+    return (_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M14.8917 5.03754C14.8917 5.03754 16.0943 4.5614 15.9941 5.71775C15.9607 6.19389 15.66 7.86039 15.4262 9.66295L14.6245 15.0026C14.6245 15.0026 14.5577 15.7848 13.9563 15.9208C13.355 16.0569 12.4531 15.4447 12.2861 15.3086C12.1524 15.2066 9.78068 13.6762 8.94552 12.9279C8.71168 12.7239 8.44443 12.3157 8.97892 11.8396L12.4865 8.43858C12.8874 8.03045 13.2882 7.07817 11.618 8.23452L6.9412 11.4655C6.9412 11.4655 6.40671 11.8056 5.40457 11.4995L3.2332 10.8193C3.2332 10.8193 2.43147 10.3091 3.80109 9.79897C7.14165 8.20048 11.2505 6.56799 14.8917 5.03754Z", fill: "#FFD600" }), _jsx("rect", { x: "2", width: "16", height: "2", fill: "#FFD600" }), _jsx("rect", { x: "2", y: "18", width: "16", height: "2", fill: "#FFD600" }), _jsx("rect", { y: "2", width: "2", height: "16", fill: "#FFD600" }), _jsx("rect", { x: "18", y: "2", width: "2", height: "16", fill: "#FFD600" })] }));
+};
+export const InfoIcon = ({ className = '', width = 12, height = 12 }) => {
+    return (_jsxs("svg", { width: width, height: height, viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, children: [_jsx("circle", { cx: "6", cy: "6", r: "5.5", stroke: "currentColor", fill: "none" }), _jsx("path", { d: "M6 4V6M6 8H6.01", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] }));
+};
+export const DisconnectIcon = ({ className = '', width = 16, height = 16 }) => {
+    return (_jsxs("svg", { width: width, height: height, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, children: [_jsx("path", { d: "M6.5 2.5L5.5 3.5L7.5 5.5H3.5V10.5H7.5L5.5 12.5L6.5 13.5L10.5 9.5V6.5L6.5 2.5ZM11.5 2.5L10.5 3.5L12.5 5.5H8.5V10.5H12.5L10.5 12.5L11.5 13.5L15.5 9.5V6.5L11.5 2.5Z", fill: "currentColor" }), _jsx("line", { x1: "1", y1: "1", x2: "15", y2: "15", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round" })] }));
+};
+export const AddIcon = ({}) => {
+    return (_jsx("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M4 6H0V4H4V0H6V4H10V6H6V10H4V6Z", fill: "#FFD600" }) }));
+};
+export const CloseIcon = ({}) => {
+    return (_jsx("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M1.4 9.975L0 8.575L3.6 4.975L0 1.4L1.4 0L5 3.6L8.575 0L9.975 1.4L6.375 4.975L9.975 8.575L8.575 9.975L5 6.375L1.4 9.975Z", fill: "#FFD600" }) }));
+};
+export const SearchIcon = ({}) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M11.5 7C11.5 9.48528 9.48528 11.5 7 11.5C4.51472 11.5 2.5 9.48528 2.5 7C2.5 4.51472 4.51472 2.5 7 2.5C9.48528 2.5 11.5 4.51472 11.5 7ZM10.6792 11.7399C9.66322 12.5297 8.38653 13 7 13C3.68629 13 1 10.3137 1 7C1 3.68629 3.68629 1 7 1C10.3137 1 13 3.68629 13 7C13 8.38653 12.5297 9.66322 11.7399 10.6792L14.5303 13.4697C14.8232 13.7626 14.8232 14.2374 14.5303 14.5303C14.2374 14.8232 13.7626 14.8232 13.4697 14.5303L10.6792 11.7399Z", fill: "#FFD600" }) }));
+};
+export const PasteIcon = ({}) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M12 2.5H8C7.17157 2.5 6.5 3.17157 6.5 4V5H8C9.65685 5 11 6.34315 11 8V9.5H12C12.8284 9.5 13.5 8.82843 13.5 8V4C13.5 3.17157 12.8284 2.5 12 2.5ZM11 11H12C13.6569 11 15 9.65685 15 8V4C15 2.34315 13.6569 1 12 1H8C6.34315 1 5 2.34315 5 4V5H4C2.34315 5 1 6.34315 1 8V12C1 13.6569 2.34315 15 4 15H8C9.65685 15 11 13.6569 11 12V11ZM8 6.5H4C3.17157 6.5 2.5 7.17157 2.5 8V12C2.5 12.8284 3.17157 13.5 4 13.5H8C8.82843 13.5 9.5 12.8284 9.5 12V8C9.5 7.17157 8.82843 6.5 8 6.5ZM6 7.75C6.41421 7.75 6.75 8.08579 6.75 8.5V9.25H7.5C7.91421 9.25 8.25 9.58579 8.25 10C8.25 10.4142 7.91421 10.75 7.5 10.75H6.75V11.5C6.75 11.9142 6.41421 12.25 6 12.25C5.58579 12.25 5.25 11.9142 5.25 11.5V10.75H4.5C4.08579 10.75 3.75 10.4142 3.75 10C3.75 9.58579 4.08579 9.25 4.5 9.25H5.25V8.5C5.25 8.08579 5.58579 7.75 6 7.75Z", fill: "#FFD600" }) }));
+};
+export const ArrowExpandIcon = ({}) => {
+    return (_jsx("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M2.11304 5.89043L5.68765 8.75012C5.87026 8.89621 6.12974 8.89621 6.31235 8.75012L9.88696 5.89043C10.256 5.59518 10.0472 5 9.57461 5L2.42539 5C1.95275 5 1.74397 5.59518 2.11304 5.89043Z", fill: "#FFD600" }) }));
+};
+export const RangeSliderIcon = ({}) => {
+    return (_jsx("svg", { width: "12", height: "21", viewBox: "0 0 12 21", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M4.99262 20.5303C5.28551 20.8232 5.76039 20.8232 6.05328 20.5303L10.8263 15.7574C11.1191 15.4645 11.1191 14.9896 10.8263 14.6967C10.5334 14.4038 10.0585 14.4038 9.76559 14.6967L5.52295 18.9393L1.28031 14.6967C0.987415 14.4038 0.512542 14.4038 0.219648 14.6967C-0.073245 14.9896 -0.073245 15.4645 0.219648 15.7574L4.99262 20.5303ZM5.52295 0H4.77295V1H5.52295H6.27295V0H5.52295ZM5.52295 3H4.77295V5H5.52295H6.27295V3H5.52295ZM5.52295 7H4.77295V9H5.52295H6.27295V7H5.52295ZM5.52295 11H4.77295V13H5.52295H6.27295V11H5.52295ZM5.52295 15H4.77295V17H5.52295H6.27295V15H5.52295ZM5.52295 19H4.77295V20H5.52295H6.27295V19H5.52295Z", fill: "#868686" }) }));
+};
+export const LoadingQuoteIcon = ({}) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M13.124 4.34277C13.4872 4.14369 13.9425 4.27645 14.1416 4.63965C14.6888 5.63786 15 6.78367 15 8C15 11.866 11.866 15 8 15C6.78367 15 5.63786 14.6888 4.63965 14.1416C4.27645 13.9425 4.14369 13.4872 4.34277 13.124C4.54183 12.7609 4.99718 12.6273 5.36035 12.8262C6.14313 13.2553 7.042 13.5 8 13.5C11.0376 13.5 13.5 11.0376 13.5 8C13.5 7.042 13.2553 6.14313 12.8262 5.36035C12.6273 4.99718 12.7609 4.54183 13.124 4.34277ZM8 1C9.21634 1 10.3621 1.3112 11.3604 1.8584C11.7236 2.05751 11.8563 2.51277 11.6572 2.87598C11.4582 3.23909 11.0028 3.37269 10.6396 3.17383C9.85687 2.74472 8.958 2.5 8 2.5C4.96243 2.5 2.5 4.96243 2.5 8C2.5 8.958 2.74472 9.85687 3.17383 10.6396C3.37269 11.0028 3.23909 11.4582 2.87598 11.6572C2.51277 11.8563 2.05751 11.7236 1.8584 11.3604C1.3112 10.3621 1 9.21634 1 8C1 4.13401 4.13401 1 8 1Z", fill: "#868686" }) }));
+};
+export const LoaderIcon = ({}) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M13.124 4.34277C13.4872 4.14369 13.9425 4.27645 14.1416 4.63965C14.6888 5.63786 15 6.78367 15 8C15 11.866 11.866 15 8 15C6.78367 15 5.63786 14.6888 4.63965 14.1416C4.27645 13.9425 4.14369 13.4872 4.34277 13.124C4.54183 12.7609 4.99718 12.6273 5.36035 12.8262C6.14313 13.2553 7.042 13.5 8 13.5C11.0376 13.5 13.5 11.0376 13.5 8C13.5 7.042 13.2553 6.14313 12.8262 5.36035C12.6273 4.99718 12.7609 4.54183 13.124 4.34277ZM8 1C9.21634 1 10.3621 1.3112 11.3604 1.8584C11.7236 2.05751 11.8563 2.51277 11.6572 2.87598C11.4582 3.23909 11.0028 3.37269 10.6396 3.17383C9.85687 2.74472 8.958 2.5 8 2.5C4.96243 2.5 2.5 4.96243 2.5 8C2.5 8.958 2.74472 9.85687 3.17383 10.6396C3.37269 11.0028 3.23909 11.4582 2.87598 11.6572C2.51277 11.8563 2.05751 11.7236 1.8584 11.3604C1.3112 10.3621 1 9.21634 1 8C1 4.13401 4.13401 1 8 1Z", fill: "#868686" }) }));
+};
+export const EmptyContactIcon = ({}) => {
+    return (_jsxs("svg", { width: "84", height: "84", viewBox: "0 0 84 84", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("rect", { x: "0.5", y: "0.5", width: "83", height: "83", rx: "11.5", fill: "#FFD600" }), _jsx("rect", { x: "0.5", y: "0.5", width: "83", height: "83", rx: "11.5", stroke: "#594B00" }), _jsx("rect", { x: "33", y: "37", width: "18", height: "13", rx: "2", stroke: "black", strokeWidth: "2" }), _jsx("path", { d: "M32 35C32 33.8954 32.8954 33 34 33H47C48.1046 33 49 33.8954 49 35H32Z", fill: "black" }), _jsx("rect", { x: "32", y: "35", width: "2", height: "6", fill: "black" }), _jsx("circle", { cx: "45.5", cy: "43.5", r: "1.5", fill: "black" })] }));
+};
+export const CompletedCheckIcon = ({}) => {
+    return (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("mask", { id: "mask0_401_2723", style: { maskType: 'alpha' }, maskUnits: "userSpaceOnUse", x: "0", y: "0", width: "12", height: "12", children: _jsx("rect", { width: "12", height: "12", fill: "#D9D9D9" }) }), _jsx("g", { mask: "url(#mask0_401_2723)", children: _jsx("path", { d: "M4.7748 8.9998L1.9248 6.1498L2.6373 5.4373L4.7748 7.5748L9.36231 2.9873L10.0748 3.6998L4.7748 8.9998Z", fill: "#B2ED00" }) })] }));
+};
+export const InputAssetEmptyContactIcon = ({}) => {
+    return (_jsxs("svg", { width: "84", height: "84", viewBox: "0 0 84 84", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("rect", { x: "0.5", y: "0.5", width: "83", height: "83", rx: "11.5", fill: "#211F12" }), _jsx("rect", { x: "0.5", y: "0.5", width: "83", height: "83", rx: "11.5", stroke: "#594B00", "stroke-dasharray": "4 4" }), _jsx("rect", { x: "33", y: "37", width: "18", height: "13", rx: "2", stroke: "#FFD600", "stroke-width": "2" }), _jsx("path", { d: "M32 35C32 33.8954 32.8954 33 34 33H47C48.1046 33 49 33.8954 49 35H32Z", fill: "#FFD600" }), _jsx("rect", { x: "32", y: "35", width: "2", height: "6", fill: "#FFD600" }), _jsx("circle", { cx: "45.5", cy: "43.5", r: "1.5", fill: "#FFD600" })] }));
+};
+export const CompleteAnonIcon = ({}) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.96406 1.78988C7.08021 2.18747 6.85206 2.60395 6.45447 2.7201C4.66012 3.24432 3.24407 4.66037 2.71986 6.45471C2.6037 6.85231 2.18723 7.08046 1.78963 6.9643C1.39204 6.84814 1.16389 6.43167 1.28004 6.03407C1.94781 3.74835 3.74811 1.94806 6.03383 1.28029C6.43142 1.16413 6.8479 1.39228 6.96406 1.78988ZM9.03585 1.78988C9.152 1.39228 9.56848 1.16413 9.96607 1.28029C12.8743 2.12992 15 4.81584 15 8.0002C15 9.21653 14.6891 10.3625 14.1419 11.3607C13.9428 11.7239 13.4869 11.857 13.1237 11.6579C12.7605 11.4588 12.6274 11.0029 12.8265 10.6397C13.2557 9.85689 13.5 8.9582 13.5 8.0002C13.5 5.50017 11.8313 3.38792 9.54543 2.7201C9.14784 2.60395 8.91969 2.18747 9.03585 1.78988ZM1.78963 9.03609C2.18723 8.91994 2.6037 9.14809 2.71986 9.54568C3.38767 11.8316 5.49992 13.5002 7.99995 13.5002C8.95795 13.5002 9.85665 13.2559 10.6394 12.8268C11.0026 12.6277 11.4585 12.7607 11.6576 13.1239C11.8567 13.4872 11.7237 13.943 11.3605 14.1421C10.3623 14.6893 9.21629 15.0002 7.99995 15.0002C4.8156 15.0002 2.12967 12.8745 1.28004 9.96632C1.16389 9.56872 1.39204 9.15225 1.78963 9.03609ZM7.99995 5.5002C6.61924 5.5002 5.49995 6.61948 5.49995 8.0002C5.49995 8.96364 6.04475 9.80109 6.84659 10.219C7.21391 10.4104 7.35648 10.8634 7.16504 11.2307C6.9736 11.598 6.52063 11.7406 6.15331 11.5492C4.87526 10.8831 3.99995 9.54447 3.99995 8.0002C3.99995 5.79106 5.79081 4.0002 7.99995 4.0002C10.2091 4.0002 12 5.79106 12 8.0002C12 8.41441 11.6642 8.7502 11.25 8.7502C10.8357 8.7502 10.5 8.41441 10.5 8.0002C10.5 6.61948 9.38066 5.5002 7.99995 5.5002ZM8.7421 7.89195C8.68232 7.48207 8.30158 7.19827 7.89171 7.25805C7.48183 7.31783 7.19802 7.69856 7.2578 8.10844C7.50949 9.83403 8.75044 11.1095 10.4388 11.2477C10.8516 11.2815 11.2137 10.9742 11.2475 10.5614C11.2812 10.1485 10.974 9.78649 10.5611 9.7527C9.64288 9.67753 8.90403 9.00219 8.7421 7.89195Z", fill: "#868686" }) }));
+};
+export const SupportIcon = ({}) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M8 13.5C9.24835 13.5 10.3996 13.0841 11.3226 12.3833L9.88737 10.948C9.34279 11.2974 8.69505 11.5 8 11.5C7.30495 11.5 6.65721 11.2974 6.11263 10.948L4.67736 12.3833C5.60043 13.0841 6.75165 13.5 8 13.5ZM5.05197 9.88737C4.7026 9.34279 4.5 8.69505 4.5 8C4.5 7.30495 4.7026 6.65721 5.05197 6.11263L3.6167 4.67736C2.9159 5.60043 2.5 6.75165 2.5 8C2.5 9.24835 2.9159 10.3996 3.6167 11.3226L5.05197 9.88737ZM6.11263 5.05197L4.67736 3.6167C5.60043 2.9159 6.75165 2.5 8 2.5C9.24835 2.5 10.3996 2.9159 11.3226 3.6167L9.88737 5.05197C9.34279 4.7026 8.69505 4.5 8 4.5C7.30495 4.5 6.65721 4.7026 6.11263 5.05197ZM10.948 6.11263C11.2974 6.65721 11.5 7.30495 11.5 8C11.5 8.69505 11.2974 9.34279 10.948 9.88737L12.3833 11.3226C13.0841 10.3996 13.5 9.24835 13.5 8C13.5 6.75165 13.0841 5.60043 12.3833 4.67736L10.948 6.11263ZM8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15ZM10 8C10 9.10457 9.10457 10 8 10C6.89543 10 6 9.10457 6 8C6 6.89543 6.89543 6 8 6C9.10457 6 10 6.89543 10 8Z", fill: "#868686" }) }));
+};
+export const ClockIcon = ({ className = '', width = 16, height = 16 }) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M6.25 0C5.83579 0 5.5 0.335786 5.5 0.75C5.5 1.16421 5.83579 1.5 6.25 1.5H9.75C10.1642 1.5 10.5 1.16421 10.5 0.75C10.5 0.335786 10.1642 0 9.75 0H6.25ZM13 9C13 11.7614 10.7614 14 8 14C5.23858 14 3 11.7614 3 9C3 6.23858 5.23858 4 8 4C10.7614 4 13 6.23858 13 9ZM14.5 9C14.5 12.5899 11.5899 15.5 8 15.5C4.41015 15.5 1.5 12.5899 1.5 9C1.5 5.41015 4.41015 2.5 8 2.5C11.5899 2.5 14.5 5.41015 14.5 9ZM12.2197 1.71967C12.5126 1.42678 12.9874 1.42678 13.2803 1.71967L14.7803 3.21967C15.0732 3.51256 15.0732 3.98744 14.7803 4.28033C14.4874 4.57322 14.0126 4.57322 13.7197 4.28033L12.2197 2.78033C11.9268 2.48744 11.9268 2.01256 12.2197 1.71967ZM8.75 6C8.75 5.58579 8.41421 5.25 8 5.25C7.58579 5.25 7.25 5.58579 7.25 6V9C7.25 9.23607 7.36115 9.45836 7.55 9.6L8.88333 10.6C9.2147 10.8485 9.6848 10.7814 9.93333 10.45C10.1819 10.1186 10.1147 9.64853 9.78333 9.4L8.75 8.625V6Z", fill: "#868686" }) }));
+};
+export const CheckIcon = ({ className = '', width = 16, height = 16 }) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M13.4881 3.43057C13.8026 3.70014 13.839 4.17361 13.5694 4.48811L7.56944 11.4881C7.43349 11.6467 7.23754 11.7414 7.02878 11.7495C6.82003 11.7575 6.61739 11.6781 6.46967 11.5303L2.96967 8.03034C2.67678 7.73745 2.67678 7.26258 2.96967 6.96968C3.26256 6.67679 3.73744 6.67679 4.03033 6.96968L6.95764 9.89699L12.4306 3.51192C12.7001 3.19743 13.1736 3.161 13.4881 3.43057Z", fill: "#B2ED00" }) }));
+};
+export const XIcon = ({ className = '', width = 16, height = 16 }) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M3.46967 3.46967C3.76256 3.17678 4.23744 3.17678 4.53033 3.46967L8 6.93934L11.4697 3.46967C11.7626 3.17678 12.2374 3.17678 12.5303 3.46967C12.8232 3.76256 12.8232 4.23744 12.5303 4.53033L9.06066 8L12.5303 11.4697C12.8232 11.7626 12.8232 12.2374 12.5303 12.5303C12.2374 12.8232 11.7626 12.8232 11.4697 12.5303L8 9.06066L4.53033 12.5303C4.23744 12.8232 3.76256 12.8232 3.46967 12.5303C3.17678 12.2374 3.17678 11.7626 3.46967 11.4697L6.93934 8L3.46967 4.53033C3.17678 4.23744 3.17678 3.76256 3.46967 3.46967Z", fill: "#FF383C" }) }));
+};
+export const SpinnerIcon = ({ className = '', width = 16, height = 16 }) => {
+    return (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M9.28033 4.78033C9.57322 4.48744 9.57322 4.01256 9.28033 3.71967L6.78033 1.21967C6.48744 0.926777 6.01256 0.926777 5.71967 1.21967C5.42678 1.51256 5.42678 1.98744 5.71967 2.28033L6.93934 3.5L1.75 3.5C1.33579 3.5 1 3.83579 1 4.25C1 4.66421 1.33579 5 1.75 5L6.93934 5L5.71967 6.21967C5.42678 6.51256 5.42678 6.98744 5.71967 7.28033C6.01256 7.57322 6.48744 7.57322 6.78033 7.28033L9.28033 4.78033ZM9.21967 8.71967L6.71967 11.2197C6.42678 11.5126 6.42678 11.9874 6.71967 12.2803L9.21967 14.7803C9.51256 15.0732 9.98744 15.0732 10.2803 14.7803C10.5732 14.4874 10.5732 14.0126 10.2803 13.7197L9.06066 12.5H14.25C14.6642 12.5 15 12.1642 15 11.75C15 11.3358 14.6642 11 14.25 11H9.06066L10.2803 9.78033C10.5732 9.48744 10.5732 9.01256 10.2803 8.71967C9.98744 8.42678 9.51256 8.42678 9.21967 8.71967ZM14 4.25C14 5.2165 13.2165 6 12.25 6C11.2835 6 10.5 5.2165 10.5 4.25C10.5 3.2835 11.2835 2.5 12.25 2.5C13.2165 2.5 14 3.2835 14 4.25ZM3.75 13.5C4.7165 13.5 5.5 12.7165 5.5 11.75C5.5 10.7835 4.7165 10 3.75 10C2.7835 10 2 10.7835 2 11.75C2 12.7165 2.7835 13.5 3.75 13.5Z", fill: "white" }) }));
+};
+export const RefreshIcon = ({ className = '', width = 16, height = 16 }) => {
+    return (_jsx("svg", { width: width, height: height, viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, children: _jsx("path", { d: "M2 8C2 5.23858 4.23858 3 7 3C9.76142 3 12 5.23858 12 8M14 8C14 10.7614 11.7614 13 9 13C6.23858 13 4 10.7614 4 8M7 1V5H3M9 15V11H13", stroke: "currentColor", fill: "none", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }));
+};
+export const BinocularsIcon = ({ className = '', width = 16, height = 16 }) => {
+    return (_jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("g", { clipPath: "url(#clip0_38_15703)", children: _jsx("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M1.52215 10.6796C1.67385 11.6692 2.51956 12.4963 3.63276 12.5C4.80302 12.4961 5.75049 11.5462 5.75049 10.375C5.75049 9.2014 4.7991 8.25 3.62549 8.25C2.45189 8.25 1.50049 9.2014 1.50049 10.375C1.50049 10.4784 1.50788 10.5801 1.52215 10.6796ZM3.64017 14L3.63362 14L3.62549 14C1.86224 14 0.393015 12.7411 0.0676399 11.073C-0.0760155 10.3638 -0.00951999 9.59737 0.323361 8.86091L2.98154 2.97999C3.38878 2.07901 4.2859 1.5 5.27465 1.5C6.74358 1.5 7.90026 2.7529 7.78312 4.21716L7.67258 5.59888C7.77686 5.57515 7.88617 5.5625 8.00049 5.5625C8.11481 5.5625 8.22412 5.57515 8.3284 5.59888L8.21787 4.21716C8.10073 2.7529 9.2574 1.5 10.7263 1.5C11.7151 1.5 12.6122 2.07901 13.0195 2.97999L15.6776 8.86091C16.0105 9.59743 16.077 10.3639 15.9333 11.0732C15.6079 12.7412 14.1387 14 12.3755 14L12.3674 14L12.3608 14C10.4631 14 8.88385 12.542 8.73252 10.6504L8.55843 8.47421C8.41439 8.37309 8.22346 8.3125 8.00051 8.3125C7.77754 8.3125 7.5866 8.3731 7.44255 8.47423L7.26846 10.6504C7.11713 12.542 5.53786 14 3.64017 14ZM3.62549 6.75C4.53587 6.75 5.36786 7.08559 6.00452 7.63981L6.2879 4.09754C6.33521 3.50609 5.868 3 5.27465 3C4.87527 3 4.51289 3.23388 4.34839 3.59781L2.88984 6.82469C3.1274 6.77572 3.37344 6.75 3.62549 6.75ZM14.4788 10.6796C14.4931 10.5801 14.5005 10.4784 14.5005 10.375C14.5005 9.2014 13.5491 8.25 12.3755 8.25C11.2019 8.25 10.2505 9.2014 10.2505 10.375C10.2505 11.5462 11.198 12.4961 12.3682 12.5C13.4814 12.4963 14.3271 11.6692 14.4788 10.6796ZM11.6526 3.59781L13.1111 6.82469C12.8736 6.77572 12.6275 6.75 12.3755 6.75C11.4651 6.75 10.6331 7.08559 9.99647 7.63981L9.71309 4.09754C9.66577 3.50609 10.133 3 10.7263 3C11.1257 3 11.4881 3.23388 11.6526 3.59781Z", fill: "#868686" }) }), _jsx("defs", { children: _jsx("clipPath", { id: "clip0_38_15703", children: _jsx("rect", { width: "16", height: "16", fill: "white" }) }) })] }));
+};

package/dist/components/input.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const Input: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export { Input };

package/dist/components/input.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../utils';
+const Input = React.forwardRef(({ className, type, ...props }, ref) => {
+    return (_jsx("input", { type: type, className: cn('flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground  disabled:cursor-not-allowed disabled:opacity-50 md:text-sm', className), ref: ref, ...props }));
+});
+Input.displayName = 'Input';
+export { Input };

package/dist/components/label.d.ts

@@ -0,0 +1,5 @@
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { type VariantProps } from 'class-variance-authority';
+declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: import("class-variance-authority/types").ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>>;
+export { Label };

package/dist/components/label.js

@@ -0,0 +1,10 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { cva } from 'class-variance-authority';
+import { cn } from '../utils';
+const labelVariants = cva('text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70');
+const Label = React.forwardRef(({ className, ...props }, ref) => (_jsx(LabelPrimitive.Root, { ref: ref, className: cn(labelVariants(), className), ...props })));
+Label.displayName = LabelPrimitive.Root.displayName;
+export { Label };

package/dist/components/modal.d.ts

@@ -0,0 +1,40 @@
+import type React from 'react';
+declare const ModalOverlay: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("motion/react").HTMLMotionProps<"div">, "ref"> & React.RefAttributes<HTMLDivElement>, never>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof React.Component<any, {}, any>>;
+declare const ModalContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("motion/react").HTMLMotionProps<"div">, "ref"> & React.RefAttributes<HTMLDivElement>, never>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof React.Component<any, {}, any>>;
+declare const CloseButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, never>> & string;
+declare const MobileDrawerContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("motion/react").HTMLMotionProps<"div">, "ref"> & React.RefAttributes<HTMLDivElement>, never>> & string & Omit<import("motion/react").ForwardRefComponent<HTMLDivElement, import("motion/react").HTMLMotionProps<"div">>, keyof React.Component<any, {}, any>>;
+declare const modalVariants: {
+    readonly hidden: {
+        readonly opacity: 0;
+        readonly scale: 0.9;
+        readonly transition: {
+            readonly type: "spring";
+            readonly stiffness: 300;
+            readonly damping: 30;
+        };
+    };
+    readonly visible: {
+        readonly opacity: 1;
+        readonly scale: 1;
+        readonly transition: {
+            readonly type: "spring";
+            readonly stiffness: 300;
+            readonly damping: 30;
+        };
+    };
+};
+declare const overlayVariants: {
+    readonly hidden: {
+        readonly opacity: 0;
+        readonly transition: {
+            readonly duration: 0.2;
+        };
+    };
+    readonly visible: {
+        readonly opacity: 1;
+        readonly transition: {
+            readonly duration: 0.2;
+        };
+    };
+};
+export { ModalOverlay, ModalContainer, CloseButton, MobileDrawerContainer, overlayVariants, modalVariants };

package/dist/components/modal.js

@@ -0,0 +1,100 @@
+import { motion } from 'motion/react';
+import styled from 'styled-components';
+// @ts-ignore - Type inference issue with styled-components + motion + React 19
+const ModalOverlay = styled(motion.div) `
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 88;
+`;
+// @ts-ignore - Type inference issue with styled-components + motion + React 19
+const ModalContainer = styled(motion.div) `
+  max-height: 90dvh;
+  border: 1px solid #2c2c2c;
+  border-radius: 16px;
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
+  padding: 24px;
+  overflow-y: auto;
+  position: relative;
+  @media (max-width: 768px) {
+    display: none;
+  }
+`;
+// @ts-ignore - Type inference issue with styled-components + React 19
+const CloseButton = styled.button `
+  cursor: pointer;
+  background: none;
+  border: none;
+`;
+// @ts-ignore - Type inference issue with styled-components + motion + React 19
+const MobileDrawerContainer = styled(motion.div) `
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  overflow-y: auto;
+  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.15);
+  border-top-left-radius: 16px;
+  border-top-right-radius: 16px;
+  z-index: 88;
+  padding: 16px;
+  display: none;
+  overscroll-behavior: none;
+
+  &::before {
+    content: '';
+    position: absolute;
+    top: 16px;
+    left: 50%;
+    transform: translateX(-50%);
+    width: 40%;
+    height: 3px;
+    background-color: #f1c730;
+    border-radius: 10px;
+  }
+
+  & > * {
+    margin-top: 15px;
+  }
+
+  @media (max-width: 768px) {
+    display: block;
+  }
+`;
+const modalVariants = {
+    hidden: {
+        opacity: 0,
+        scale: 0.9,
+        transition: {
+            type: 'spring',
+            stiffness: 300,
+            damping: 30,
+        },
+    },
+    visible: {
+        opacity: 1,
+        scale: 1,
+        transition: {
+            type: 'spring',
+            stiffness: 300,
+            damping: 30,
+        },
+    },
+};
+const overlayVariants = {
+    hidden: {
+        opacity: 0,
+        transition: { duration: 0.2 },
+    },
+    visible: {
+        opacity: 1,
+        transition: { duration: 0.2 },
+    },
+};
+export { ModalOverlay, ModalContainer, CloseButton, MobileDrawerContainer, overlayVariants, modalVariants };

package/dist/components/panel-row.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+interface PanelRowProps {
+    onClick?: () => void;
+    left: React.ReactNode;
+    right?: React.ReactNode;
+}
+/**
+ * Panel row component (matching Svelte PanelRow)
+ */
+export declare const PanelRow: React.FC<PanelRowProps>;
+export {};

package/dist/components/panel-row.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+/**
+ * Panel row component (matching Svelte PanelRow)
+ */
+export const PanelRow = ({ onClick, left, right }) => {
+    return (_jsxs("div", { className: `flex items-center justify-between p-3 rounded-lg transition-colors ${onClick ? 'cursor-pointer hover:bg-dim-light/30' : ''}`, onClick: onClick, children: [_jsx("div", { className: "flex items-center gap-3", children: left }), right && _jsx("div", { children: right })] }));
+};