@silentswap/ui-kit 0.0.42 → 0.0.43

package/dist/components/accordion.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+declare const Accordion: React.ForwardRefExoticComponent<(AccordionPrimitive.AccordionSingleProps | AccordionPrimitive.AccordionMultipleProps) & React.RefAttributes<HTMLDivElement>>;
+declare const AccordionItem: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AccordionTrigger: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AccordionContent: React.ForwardRefExoticComponent<Omit<AccordionPrimitive.AccordionContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/components/accordion.js

@@ -0,0 +1,14 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { ChevronDown } from 'lucide-react';
+import { cn } from '../utils';
+const Accordion = AccordionPrimitive.Root;
+const AccordionItem = React.forwardRef(({ className, ...props }, ref) => (_jsx(AccordionPrimitive.Item, { ref: ref, className: cn('border-b', className), ...props })));
+AccordionItem.displayName = 'AccordionItem';
+const AccordionTrigger = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(AccordionPrimitive.Header, { className: "flex", children: _jsxs(AccordionPrimitive.Trigger, { ref: ref, className: cn('flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180', className), ...props, children: [children, _jsx(ChevronDown, { className: "h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200" })] }) })));
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
+const AccordionContent = React.forwardRef(({ className, children, ...props }, ref) => (_jsx(AccordionPrimitive.Content, { ref: ref, className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down", ...props, children: _jsx("div", { className: cn('pb-4 pt-0', className), children: children }) })));
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };

package/dist/components/add-button.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface AddButtonProps {
+    onClick: () => void;
+    label: string;
+    disabled?: boolean;
+    disabledLabel?: string;
+    className?: string;
+}
+export declare const AddButton: React.FC<AddButtonProps>;
+export {};

package/dist/components/add-button.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React from 'react';
+import { cn } from '../utils';
+import { AddIcon } from './icons';
+export const AddButton = ({ onClick, label, disabled = false, disabledLabel, className }) => {
+    return (_jsxs("div", { className: cn(
+        // Layout - matching Figma design
+        'flex items-center justify-center gap-[10px]', 'w-[90vw] max-w-[640px] mx-auto', 'px-[20px] py-[12px] box-border', 'min-h-[42px]', 
+        // Background - matching Figma: bg-secondary (#211f12)
+        'rounded-[12px]', 
+        // Typography - matching Figma: Manrope Medium, 14px, line-height 1.5, yellow
+        'font-medium text-[14px] leading-[1.5]', 
+        // Interaction
+        'transition-all duration-300 z-[2]', disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer hover:opacity-80', 'bg-secondary', 'text-yellow', 'font-manrope', className), onClick: disabled ? undefined : onClick, role: "button", tabIndex: disabled ? -1 : 0, onKeyDown: (e) => {
+            if (!disabled && (e.key === 'Enter' || e.key === ' ')) {
+                e.preventDefault();
+                onClick();
+            }
+        }, children: [_jsx("div", { className: "flex flex-col justify-end leading-[0] shrink-0 pb-[2px]", children: _jsx("p", { className: "leading-[1.5] whitespace-nowrap", children: disabled ? disabledLabel || label : label }) }), !disabled && (_jsx("div", { className: "relative shrink-0 size-[10px]", children: _jsx(AddIcon, {}) }))] }));
+};

package/dist/components/address-selector.d.ts

@@ -0,0 +1,34 @@
+import React from 'react';
+import type { ContactSource as SDKContactSource } from '@silentswap/sdk';
+export interface Contact {
+    id: string;
+    label: string;
+    address: string | (() => Promise<string>);
+    source?: ContactSource;
+    ens?: string;
+    rawAddress?: () => string | undefined;
+    isEvm?: () => boolean;
+    isSolana?: () => boolean;
+    isBip122?: () => boolean;
+    isCosmos?: () => boolean;
+}
+export type ContactSource = SDKContactSource | 'wallet' | 'saved' | 'ens' | 'unknown';
+interface AddressSelectorProps {
+    isOpen: boolean;
+    onClose: () => void;
+    onSelect: (address: string, label?: string) => void;
+    onSaveContact?: (contactInfo: {
+        id: string;
+        label: string;
+        source: ContactSource;
+    }) => void;
+    connectedAddress?: string;
+    title?: string;
+    mode?: 'sender' | 'recipient';
+    contacts?: Contact[];
+    targetAsset?: string;
+    connectedAccounts?: Record<string, Contact>;
+    activeSenderId?: string;
+}
+export declare const AddressSelector: React.FC<AddressSelectorProps>;
+export {};

package/dist/components/address-selector.js

@@ -0,0 +1,57 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useState, useCallback, useEffect } from 'react';
+import { Dialog, DialogContent, DialogTitle } from './dialog';
+import { formatAddress } from '@silentswap/sdk';
+// Hooks
+import { useEnsResolution } from '../../hooks/useEnsResolution';
+import { useAddressSearch } from '../../hooks/useAddressSearch';
+import { useContactSearch } from '../../hooks/useContactSearch';
+// Components
+import { PanelRow } from './panel-row';
+import { UserTile } from './UserTile';
+import { ContactRow } from './ContactRow';
+import { ContactSourceBadge } from './ContactSourceBadge';
+import { ManualAddressEntry } from './ManualAddressEntry';
+import { EnsResult } from './EnsResult';
+import { BinocularsIcon } from './icons';
+// ============================================================================
+// Main Component
+// ============================================================================
+export const AddressSelector = ({ isOpen, onClose, onSelect, onSaveContact, connectedAddress, title, mode = 'recipient', contacts = [], targetAsset, connectedAccounts = {}, activeSenderId, }) => {
+    // Search state
+    const [search, setSearch] = useState('');
+    const [newLabel, setNewLabel] = useState('');
+    // Hooks
+    const ensState = useEnsResolution(search, mode === 'recipient');
+    const manualAddress = useAddressSearch(search);
+    const filteredContacts = useContactSearch(contacts, search, targetAsset, connectedAccounts);
+    // Dynamic title and placeholder
+    const displayTitle = title || `Select ${mode === 'sender' ? 'Sender' : 'Recipient'} Address`;
+    const placeholder = mode === 'recipient' ? 'Address, ENS, or nickname' : 'Filter by address';
+    // Reset and select handler
+    const resetAndSelect = useCallback((address, label) => {
+        setSearch('');
+        setNewLabel('');
+        onSelect(address, label);
+        onClose();
+    }, [onSelect, onClose]);
+    // Reset state when closing
+    useEffect(() => {
+        if (!isOpen) {
+            setSearch('');
+            setNewLabel('');
+        }
+    }, [isOpen]);
+    // Handle dialog open change
+    const handleOpenChange = useCallback((open) => {
+        if (!open) {
+            onClose();
+        }
+    }, [onClose]);
+    return (_jsx(Dialog, { open: isOpen, onOpenChange: handleOpenChange, children: _jsxs(DialogContent, { className: "text-white rounded-2xl border-[#333] bg-[#141414] w-[95vw] max-w-[580px] max-h-[85vh] p-0 flex flex-col", children: [_jsx(DialogTitle, { asChild: true, children: _jsx("div", { className: "p-4 border-b border-[#333] shrink-0", children: _jsx("div", { className: "flex items-center justify-between text-lg cursor-default", children: _jsx("div", { className: "font-semibold text-white", children: displayTitle }) }) }) }), _jsx("div", { className: "p-4 border-b border-[#333] shrink-0 mt-3", children: _jsx("input", { type: "text", className: "w-full bg-[#1a1a1a] border border-[#333] outline-none rounded-lg px-4 py-3 h-[52px] text-white text-sm box-border focus:ring-1 focus:ring-yellow focus:border-yellow", placeholder: placeholder, value: search, onChange: (e) => setSearch(e.target.value), autoFocus: true }) }), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsxs("div", { className: "p-4", children: [manualAddress && (_jsx(ManualAddressEntry, { manualAddress: manualAddress, newLabel: newLabel, onLabelChange: setNewLabel, onSave: resetAndSelect, onSaveContact: onSaveContact })), ensState.searching && (_jsx(PanelRow, { left: _jsxs("span", { className: "text-[#888] text-sm", children: ["Searching ENS for ", ensState.searching, "..."] }) })), ensState.resolved && (_jsx(EnsResult, { name: ensState.resolved.name, address: ensState.resolved.address, onSelect: resetAndSelect, onSaveContact: onSaveContact })), connectedAddress && mode === 'recipient' && !manualAddress && (_jsx("div", { className: "mb-4 pb-4 border-b border-[#333]", children: _jsx(PanelRow, { onClick: () => resetAndSelect(connectedAddress), left: _jsxs(_Fragment, { children: [_jsx("div", { style: { zoom: 0.75 }, children: _jsx(UserTile, { address: connectedAddress }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-[14px] font-mono text-white", children: "Connected Wallet" }), _jsx("span", { className: "text-[12px] font-mono text-[#888]", children: formatAddress(connectedAddress, 6) })] })] }), right: _jsx(ContactSourceBadge, { source: "wallet", isActive: true }) }) })), !manualAddress && filteredContacts.length > 0 && (_jsx("div", { className: "flex flex-col", children: filteredContacts.map((contact) => {
+                                    const isActive = activeSenderId === contact.id;
+                                    const isWallet = connectedAccounts[contact.id] !== undefined;
+                                    return (_jsx(ContactRow, { contact: contact, onSelect: resetAndSelect, isActive: isActive, isWallet: isWallet, connectedAccounts: connectedAccounts }, contact.id));
+                                }) })), !manualAddress && !ensState.searching && filteredContacts.length === 0 && search.trim() && (_jsxs("div", { className: "flex flex-col items-center justify-center py-10 px-4 text-center", children: [_jsx("div", { className: "mb-4", children: _jsx(BinocularsIcon, { width: 40, height: 40, className: "text-[#868686]" }) }), _jsx("div", { className: "text-white font-medium text-base mb-1", children: "No results found" }), _jsxs("div", { className: "text-[#868686] text-sm max-w-[240px]", children: ["We couldn't find any contacts or addresses matching \"", search.trim(), "\""] })] })), !manualAddress && !ensState.searching && contacts.length === 0 && !search.trim() && !connectedAddress && (_jsxs("div", { className: "flex flex-col items-center justify-center py-10 px-4 text-center", children: [_jsx("div", { className: "mb-4", children: _jsx(BinocularsIcon, { width: 40, height: 40, className: "text-[#868686]" }) }), _jsx("div", { className: "text-white font-medium text-base mb-1", children: "No contacts yet" }), _jsx("div", { className: "text-[#868686] text-sm", children: "Enter an address or ENS name above" })] }))] }) }), _jsx("div", { className: "p-4 border-t border-[#333] shrink-0", children: _jsx("button", { className: "w-full px-6 py-3 rounded-lg text-base font-medium bg-[#333] text-white hover:bg-[#444] transition-colors border-none", onClick: onClose, children: "Cancel" }) })] }) }));
+};

package/dist/components/alert-dialog.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+declare const AlertDialog: React.FC<AlertDialogPrimitive.AlertDialogProps>;
+declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogPortal: React.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
+declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const AlertDialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };

package/dist/components/alert-dialog.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { cn } from '../utils';
+import { buttonVariants } from './button';
+const AlertDialog = AlertDialogPrimitive.Root;
+const AlertDialogTrigger = AlertDialogPrimitive.Trigger;
+const AlertDialogPortal = AlertDialogPrimitive.Portal;
+const AlertDialogOverlay = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Overlay, { className: cn('fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0', className), ...props, ref: ref })));
+AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
+const AlertDialogContent = React.forwardRef(({ className, ...props }, ref) => (_jsxs(AlertDialogPortal, { children: [_jsx(AlertDialogOverlay, {}), _jsx(AlertDialogPrimitive.Content, { ref: ref, className: cn('fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg', className), ...props })] })));
+AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
+const AlertDialogHeader = ({ className, ...props }) => (_jsx("div", { className: cn('flex flex-col space-y-2 text-center sm:text-left', className), ...props }));
+AlertDialogHeader.displayName = 'AlertDialogHeader';
+const AlertDialogFooter = ({ className, ...props }) => (_jsx("div", { className: cn('flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2', className), ...props }));
+AlertDialogFooter.displayName = 'AlertDialogFooter';
+const AlertDialogTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Title, { ref: ref, className: cn('text-lg font-semibold', className), ...props })));
+AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
+const AlertDialogDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Description, { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
+AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
+const AlertDialogAction = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Action, { ref: ref, className: cn(buttonVariants(), className), ...props })));
+AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
+const AlertDialogCancel = React.forwardRef(({ className, ...props }, ref) => (_jsx(AlertDialogPrimitive.Cancel, { ref: ref, className: cn(buttonVariants({ variant: 'outline' }), 'mt-2 sm:mt-0', className), ...props })));
+AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };

package/dist/components/alert.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const Alert: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    variant?: "default" | "destructive" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+export { Alert, AlertTitle, AlertDescription };

package/dist/components/alert.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '../utils';
+const alertVariants = cva('relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7', {
+    variants: {
+        variant: {
+            default: 'bg-background text-foreground',
+            destructive: 'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+const Alert = React.forwardRef(({ className, variant, ...props }, ref) => (_jsx("div", { ref: ref, role: "alert", className: cn(alertVariants({ variant }), className), ...props })));
+Alert.displayName = 'Alert';
+const AlertTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx("h5", { ref: ref, className: cn('mb-1 font-medium leading-none tracking-tight', className), ...props })));
+AlertTitle.displayName = 'AlertTitle';
+const AlertDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('text-sm [&_p]:leading-relaxed', className), ...props })));
+AlertDescription.displayName = 'AlertDescription';
+export { Alert, AlertTitle, AlertDescription };

package/dist/components/avatar.d.ts

@@ -0,0 +1,6 @@
+import * as React from 'react';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+declare const Avatar: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+declare const AvatarImage: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>>;
+declare const AvatarFallback: React.ForwardRefExoticComponent<Omit<AvatarPrimitive.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>>;
+export { Avatar, AvatarImage, AvatarFallback };

package/dist/components/avatar.js

@@ -0,0 +1,12 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import { cn } from '../utils';
+const Avatar = React.forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Root, { ref: ref, className: cn('relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full', className), ...props })));
+Avatar.displayName = AvatarPrimitive.Root.displayName;
+const AvatarImage = React.forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Image, { ref: ref, className: cn('aspect-square h-full w-full', className), ...props })));
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
+const AvatarFallback = React.forwardRef(({ className, ...props }, ref) => (_jsx(AvatarPrimitive.Fallback, { ref: ref, className: cn('flex h-full w-full items-center justify-center rounded-full bg-muted', className), ...props })));
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
+export { Avatar, AvatarImage, AvatarFallback };

package/dist/components/badge.d.ts

@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "destructive" | "outline" | "secondary" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
+}
+declare function Badge({ className, variant, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export { Badge, badgeVariants };

package/dist/components/badge.js

@@ -0,0 +1,21 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cva } from 'class-variance-authority';
+import { cn } from '../utils';
+const badgeVariants = cva('inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-ring focus:ring-offset-2', {
+    variants: {
+        variant: {
+            default: 'border-transparent bg-primary text-primary-foreground shadow hover:bg-primary/80',
+            secondary: 'border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80',
+            destructive: 'border-transparent bg-destructive text-destructive-foreground shadow hover:bg-destructive/80',
+            outline: 'text-foreground',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+    },
+});
+function Badge({ className, variant, ...props }) {
+    return _jsx("div", { className: cn(badgeVariants({ variant }), className), ...props });
+}
+export { Badge, badgeVariants };

package/dist/components/button.d.ts

@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { type VariantProps } from 'class-variance-authority';
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "yellow" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface ButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+    children?: React.ReactNode;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };

package/dist/components/button.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { Slot } from '@radix-ui/react-slot';
+import { cva } from 'class-variance-authority';
+import { cn } from '../utils';
+const buttonVariants = cva('inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-0 focus-visible:ring-0 disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0', {
+    variants: {
+        variant: {
+            default: 'cursor-pointer bg-primary text-primary-foreground shadow hover:bg-primary/90',
+            yellow: 'cursor-pointer bg-yellow text-black shadow hover:bg-yellow/90',
+            destructive: 'cursor-pointer bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90',
+            outline: 'cursor-pointer border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground',
+            secondary: 'cursor-pointer bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80',
+            ghost: 'cursor-pointer hover:bg-accent hover:text-accent-foreground',
+            link: 'cursor-pointer text-primary underline-offset-4 hover:underline',
+        },
+        size: {
+            default: 'h-9 px-4 py-2',
+            sm: 'h-8 rounded-md px-3 text-xs',
+            lg: 'h-10 rounded-md px-8',
+            icon: 'h-9 w-9',
+        },
+    },
+    defaultVariants: {
+        variant: 'default',
+        size: 'default',
+    },
+});
+const Button = React.forwardRef(({ className, variant, size, asChild = false, disabled, ...props }, ref) => {
+    const Comp = asChild ? Slot : 'button';
+    const { disabled: _disabledProp, ...restProps } = props;
+    const buttonProps = {
+        ...restProps,
+        disabled: disabled === true ? true : undefined,
+    };
+    return (_jsx(Comp, { className: cn(buttonVariants({ variant, size, className })), ref: ref, suppressHydrationWarning: true, ...buttonProps }));
+});
+Button.displayName = 'Button';
+export { Button, buttonVariants };

package/dist/components/card.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

package/dist/components/card.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from 'react';
+import { cn } from '../utils';
+const Card = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('rounded-xl border bg-card text-card-foreground shadow', className), ...props })));
+Card.displayName = 'Card';
+const CardHeader = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('flex flex-col space-y-1.5 p-6', className), ...props })));
+CardHeader.displayName = 'CardHeader';
+const CardTitle = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('font-semibold leading-none tracking-tight', className), ...props })));
+CardTitle.displayName = 'CardTitle';
+const CardDescription = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('text-sm text-muted-foreground', className), ...props })));
+CardDescription.displayName = 'CardDescription';
+const CardContent = React.forwardRef(({ className, ...props }, ref) => _jsx("div", { ref: ref, className: cn('p-6 pt-0', className), ...props }));
+CardContent.displayName = 'CardContent';
+const CardFooter = React.forwardRef(({ className, ...props }, ref) => (_jsx("div", { ref: ref, className: cn('flex items-center p-6 pt-0', className), ...props })));
+CardFooter.displayName = 'CardFooter';
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

package/dist/components/coin.d.ts

@@ -0,0 +1,6 @@
+export declare const CoinAvatar: ({ tokenImage, chainImage, className, chainIconSize, }: {
+    tokenImage: string;
+    chainImage: string;
+    className?: string;
+    chainIconSize?: number;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/components/coin.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useState, useEffect, useMemo } from 'react';
+import { cn } from '../utils';
+import { Skeleton } from './skeleton';
+export const CoinAvatar = ({ tokenImage, chainImage, className, chainIconSize = 3, }) => {
+    const [isTokenImageError, setTokenImageError] = useState(false);
+    const [isChainImageError, setChainImageError] = useState(false);
+    const [isLoading, setIsLoading] = useState(false);
+    const borderCircleSize = chainIconSize * 4 + 4;
+    useEffect(() => {
+        setTokenImageError(false);
+    }, [tokenImage]);
+    const resolvedTokenImage = useMemo(() => {
+        if (!tokenImage) {
+            return '/tokens/default.png';
+        }
+        return isTokenImageError ? '/tokens/default.png' : tokenImage;
+    }, [isTokenImageError, tokenImage]);
+    return (_jsxs("div", { "data-testid": "coin-avatar", className: "relative inline-block", children: [isLoading && _jsx(Skeleton, { className: cn('rounded-full bg-gray-700', className) }), _jsx("img", { src: resolvedTokenImage, alt: "Token Avatar", "data-testid": "token-image", className: cn(className ? className : 'w-7 h-7 rounded-full object-cover aspect-square  shrink-0 grow-0', isLoading ? 'hidden' : ''), onError: () => setTokenImageError(true), onLoad: () => setIsLoading(false) }), _jsx("div", { "data-testid": "chain-image", className: `absolute -bottom-0.5 -right-1.5 flex items-center justify-center bg-base rounded-full border border-base-stroke`, style: { width: `${borderCircleSize}px`, height: `${borderCircleSize}px` }, children: isLoading ? (_jsx(Skeleton, { className: `w-${chainIconSize} h-${chainIconSize} bg-gray-500 rounded-full` })) : (_jsx("img", { src: isChainImageError ? '/tokens/default-chain.png' : chainImage, alt: "Chain Image", className: `w-${chainIconSize} h-${chainIconSize} object-fill`, onError: () => setChainImageError(true) })) })] }));
+};

package/dist/components/collapsible.d.ts

@@ -0,0 +1,5 @@
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+declare const Collapsible: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleProps & import("react").RefAttributes<HTMLDivElement>>;
+declare const CollapsibleTrigger: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleTriggerProps & import("react").RefAttributes<HTMLButtonElement>>;
+declare const CollapsibleContent: import("react").ForwardRefExoticComponent<CollapsiblePrimitive.CollapsibleContentProps & import("react").RefAttributes<HTMLDivElement>>;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };

package/dist/components/collapsible.js

@@ -0,0 +1,6 @@
+'use client';
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+const Collapsible = CollapsiblePrimitive.Root;
+const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
+const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };

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

@@ -0,0 +1,27 @@
+import * as React from 'react';
+import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
+declare const ContextMenu: React.FC<ContextMenuPrimitive.ContextMenuProps>;
+declare const ContextMenuTrigger: React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuTriggerProps & React.RefAttributes<HTMLSpanElement>>;
+declare const ContextMenuGroup: React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuPortal: React.FC<ContextMenuPrimitive.ContextMenuPortalProps>;
+declare const ContextMenuSub: React.FC<ContextMenuPrimitive.ContextMenuSubProps>;
+declare const ContextMenuRadioGroup: React.ForwardRefExoticComponent<ContextMenuPrimitive.ContextMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuSubTrigger: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuSubContent: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuContent: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuItem: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuRadioItem: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuLabel: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuSeparator: React.ForwardRefExoticComponent<Omit<ContextMenuPrimitive.ContextMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const ContextMenuShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuCheckboxItem, ContextMenuRadioItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuGroup, ContextMenuPortal, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuRadioGroup, };

package/dist/components/context-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 ContextMenuPrimitive from '@radix-ui/react-context-menu';
+import { Check, ChevronRight, Circle } from 'lucide-react';
+import { cn } from '../utils';
+const ContextMenu = ContextMenuPrimitive.Root;
+const ContextMenuTrigger = ContextMenuPrimitive.Trigger;
+const ContextMenuGroup = ContextMenuPrimitive.Group;
+const ContextMenuPortal = ContextMenuPrimitive.Portal;
+const ContextMenuSub = ContextMenuPrimitive.Sub;
+const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
+const ContextMenuSubTrigger = React.forwardRef(({ className, inset, children, ...props }, ref) => (_jsxs(ContextMenuPrimitive.SubTrigger, { ref: ref, className: cn('flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground', inset && 'pl-8', className), ...props, children: [children, _jsx(ChevronRight, { className: "ml-auto h-4 w-4" })] })));
+ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
+const ContextMenuSubContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(ContextMenuPrimitive.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 origin-[--radix-context-menu-content-transform-origin]', className), ...props })));
+ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
+const ContextMenuContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(ContextMenuPrimitive.Portal, { children: _jsx(ContextMenuPrimitive.Content, { ref: ref, className: cn('z-50 max-h-[--radix-context-menu-content-available-height] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border  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 origin-[--radix-context-menu-content-transform-origin]', className), ...props }) })));
+ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
+const ContextMenuItem = React.forwardRef(({ className, inset, ...props }, ref) => (_jsx(ContextMenuPrimitive.Item, { ref: ref, className: cn('relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50', inset && 'pl-8', className), ...props })));
+ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
+const ContextMenuCheckboxItem = React.forwardRef(({ className, children, checked, ...props }, ref) => (_jsxs(ContextMenuPrimitive.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 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(ContextMenuPrimitive.ItemIndicator, { children: _jsx(Check, { className: "h-4 w-4" }) }) }), children] })));
+ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
+const ContextMenuRadioItem = React.forwardRef(({ className, children, ...props }, ref) => (_jsxs(ContextMenuPrimitive.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 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(ContextMenuPrimitive.ItemIndicator, { children: _jsx(Circle, { className: "h-4 w-4 fill-current" }) }) }), children] })));
+ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
+const ContextMenuLabel = React.forwardRef(({ className, inset, ...props }, ref) => (_jsx(ContextMenuPrimitive.Label, { ref: ref, className: cn('px-2 py-1.5 text-sm font-semibold text-foreground', inset && 'pl-8', className), ...props })));
+ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
+const ContextMenuSeparator = React.forwardRef(({ className, ...props }, ref) => (_jsx(ContextMenuPrimitive.Separator, { ref: ref, className: cn('-mx-1 my-1 h-px bg-border', className), ...props })));
+ContextMenuSeparator.displayName = ContextMenuPrimitive.Separator.displayName;
+const ContextMenuShortcut = ({ className, ...props }) => {
+    return _jsx("span", { className: cn('ml-auto text-xs tracking-widest text-muted-foreground', className), ...props });
+};
+ContextMenuShortcut.displayName = 'ContextMenuShortcut';
+export { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuCheckboxItem, ContextMenuRadioItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuGroup, ContextMenuPortal, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuRadioGroup, };

package/dist/components/dialog.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export { Dialog, DialogPortal, DialogOverlay, DialogTrigger, DialogClose, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };