0xtrails 0.0.1 → 0.0.2

package/dist/widget/components/TokenImage.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TokenImage as SeqTokenImage } from "@0xsequence/design-system";
+export const TokenImage = ({ imageUrl, symbol, chainId, size = 24, }) => {
+    imageUrl = imageUrl?.replace("/small/", "/large/");
+    symbol = imageUrl ? symbol : symbol?.[0];
+    return (_jsx("div", { className: `rounded-full flex items-center justify-center text-sm relative bg-black-100 bg-opacity-90`, style: { width: size, height: size }, children: _jsx(SeqTokenImage, { src: imageUrl, symbol: symbol, withNetwork: chainId, size: "xl", className: "absolute w-full h-full text-white", disableAnimation: true }) }));
+};
+export default TokenImage;

package/dist/widget/components/TokenList.d.ts

@@ -0,0 +1,16 @@
+import type { SequenceIndexerGateway } from "@0xsequence/indexer";
+import type React from "react";
+import type { ActiveTheme } from "../../theme.js";
+import type { Token } from "../hooks/useTokenList.js";
+interface TokenListProps {
+    onContinue: (selectedToken: Token) => void;
+    onBack: () => void;
+    indexerGatewayClient: SequenceIndexerGateway;
+    theme?: ActiveTheme;
+    targetAmountUsd?: number | null;
+    targetAmountUsdFormatted?: string | null;
+    onError: (error: Error | string | null) => void;
+}
+export declare const TokenList: React.FC<TokenListProps>;
+export default TokenList;
+//# sourceMappingURL=TokenList.d.ts.map

package/dist/widget/components/TokenList.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TokenList.d.ts","sourceRoot":"","sources":["../../../src/widget/components/TokenList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAA;AAEjE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AACjD,OAAO,KAAK,EAAE,KAAK,EAAkB,MAAM,0BAA0B,CAAA;AAIrE,UAAU,cAAc;IACtB,UAAU,EAAE,CAAC,aAAa,EAAE,KAAK,KAAK,IAAI,CAAA;IAC1C,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,oBAAoB,EAAE,sBAAsB,CAAA;IAC5C,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC/B,wBAAwB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACxC,OAAO,EAAE,CAAC,KAAK,EAAE,KAAK,GAAG,MAAM,GAAG,IAAI,KAAK,IAAI,CAAA;CAChD;AAED,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA0Q9C,CAAA;AAED,eAAe,SAAS,CAAA"}

package/dist/widget/components/TokenList.js

@@ -0,0 +1,39 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ChevronLeft, Search } from "lucide-react";
+import { useTokenList } from "../hooks/useTokenList.js";
+import { TokenImage } from "./TokenImage.js";
+export const TokenList = ({ onContinue, onBack, indexerGatewayClient, theme = "light", targetAmountUsd, targetAmountUsdFormatted, onError, }) => {
+    const { searchQuery, setSearchQuery, handleTokenSelect, filteredTokens, isLoadingSortedTokens, isTokenSelected, selectedToken, showContinueButton, filteredTokensFormatted, totalBalanceUsd, totalBalanceUsdFormatted, showInsufficientBalance, balanceError, } = useTokenList({
+        onContinue,
+        targetAmountUsd,
+        indexerGatewayClient,
+        onError,
+    });
+    return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "flex items-center justify-between relative", children: [_jsxs("div", { className: "flex items-center", children: [!targetAmountUsd && (_jsx("button", { type: "button", onClick: onBack, className: `p-2 rounded-full transition-colors cursor-pointer ${theme === "dark"
+                                    ? "hover:bg-gray-800 text-gray-400"
+                                    : "hover:bg-gray-100 text-gray-600"}`, children: _jsx(ChevronLeft, { className: "h-6 w-6" }) })), _jsx("h2", { className: `text-lg font-semibold ${targetAmountUsd ? "text-left" : "text-center"} ${theme === "dark" ? "text-white" : "text-gray-900"}`, children: targetAmountUsd
+                                    ? `Pay ${targetAmountUsdFormatted} with:`
+                                    : "Select Token" })] }), totalBalanceUsd > 0 && (_jsxs("p", { className: `text-xs mr-8 ${theme === "dark" ? "text-gray-400" : "text-gray-500"}`, children: ["Total balance: ", totalBalanceUsdFormatted] }))] }), _jsxs("div", { className: "relative", children: [_jsx("div", { className: "absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none", children: _jsx(Search, { className: `h-5 w-5 ${theme === "dark" ? "text-gray-500" : "text-gray-400"}` }) }), _jsx("input", { type: "text", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), placeholder: "Search tokens", className: `block w-full pl-10 pr-3 py-2 border rounded-[24px] focus:ring-2 focus:ring-blue-500 focus:border-blue-500 ${theme === "dark"
+                            ? "bg-gray-800 border-gray-700 text-white placeholder-gray-500"
+                            : "bg-white border-gray-300 text-gray-900 placeholder-gray-500"}` })] }), isLoadingSortedTokens && (_jsxs("div", { className: "text-center py-4", children: [_jsx("div", { className: `animate-spin rounded-full h-8 w-8 border-b-2 mx-auto ${theme === "dark" ? "border-white" : "border-black"}` }), _jsx("p", { className: `mt-2 ${theme === "dark" ? "text-gray-400" : "text-gray-500"}`, children: "Loading your token balances..." })] })), !isLoadingSortedTokens &&
+                !balanceError &&
+                filteredTokens.length === 0 && (_jsx("div", { className: `text-center py-4 rounded-lg ${theme === "dark" ? "bg-gray-800" : "bg-gray-50"}`, children: _jsx("p", { className: theme === "dark" ? "text-gray-400" : "text-gray-500", children: searchQuery.trim()
+                        ? "No tokens found matching your search."
+                        : "No tokens found with balance greater than 0." }) })), _jsx("div", { className: `divide-y ${theme === "dark" ? "divide-gray-700/50" : "divide-gray-200"} max-h-[35vh] overflow-y-auto rounded-[16px] ${theme === "dark" ? "bg-gray-800/50" : "bg-white"}`, children: filteredTokensFormatted.map((token) => {
+                    const { symbol, imageUrl, chainId, contractAddress, balanceUsdFormatted, tokenName, priceUsd, balanceFormatted, isSufficientBalance, } = token;
+                    return (_jsxs("button", { type: "button", onClick: () => handleTokenSelect(token), title: !isSufficientBalance
+                            ? "Insufficient balance for this token"
+                            : undefined, className: `w-full py-2.5 px-3 flex items-center space-x-3 transition-colors ${theme === "dark"
+                            ? isTokenSelected(token)
+                                ? "bg-gray-800"
+                                : "hover:bg-gray-800/80"
+                            : isTokenSelected(token)
+                                ? "bg-gray-100"
+                                : "hover:bg-gray-50"} ${!isSufficientBalance ? "opacity-50 cursor-not-allowed" : "cursor-pointer"}`, children: [_jsx("div", { className: "relative flex-shrink-0", children: _jsx("div", { className: `rounded-full flex items-center justify-center ${theme === "dark" ? "bg-gray-700" : "bg-gray-100"}`, children: contractAddress ? (_jsx(TokenImage, { symbol: symbol[0], imageUrl: imageUrl, chainId: chainId, size: 32 })) : (_jsx("span", { className: `text-base font-medium ${theme === "dark" ? "text-gray-300" : "text-gray-600"}`, children: symbol })) }) }), _jsxs("div", { className: "flex-1 min-w-0 text-left", children: [_jsx("h3", { className: `text-sm font-medium truncate ${theme === "dark" ? "text-white" : "text-gray-900"} ${!isSufficientBalance ? (theme === "dark" ? "text-gray-500" : "text-gray-400") : ""}`, children: tokenName }), _jsx("p", { className: `text-xs ${theme === "dark" ? "text-gray-400" : "text-gray-500"} ${!isSufficientBalance ? (theme === "dark" ? "text-gray-600" : "text-gray-400") : ""}`, children: symbol })] }), _jsx("div", { className: "text-right flex-shrink-0", children: priceUsd > 0 ? (_jsxs(_Fragment, { children: [_jsx("p", { className: `text-sm font-medium ${theme === "dark" ? "text-white" : "text-gray-900"} ${!isSufficientBalance ? (theme === "dark" ? "text-gray-500" : "text-gray-400") : ""}`, children: balanceUsdFormatted }), _jsx("p", { className: `text-xs ${theme === "dark" ? "text-gray-400" : "text-gray-500"} ${!isSufficientBalance ? (theme === "dark" ? "text-gray-600" : "text-gray-400") : ""}`, children: balanceFormatted })] })) : (_jsx("p", { className: `text-sm font-medium ${theme === "dark" ? "text-white" : "text-gray-900"} ${!isSufficientBalance ? (theme === "dark" ? "text-gray-500" : "text-gray-400") : ""}`, children: balanceFormatted })) })] }, `${chainId}-${contractAddress}`));
+                }) }), showInsufficientBalance && (_jsxs("div", { className: `text-left py-3 px-4 rounded-lg ${theme === "dark"
+                    ? "bg-amber-500/10 border border-amber-500/30"
+                    : "bg-amber-50 border border-amber-200"}`, children: [_jsx("p", { className: `text-xs font-medium ${theme === "dark" ? "text-amber-400" : "text-amber-700"}`, children: "Insufficient balance" }), _jsx("p", { className: `text-xs mt-1 ${theme === "dark" ? "text-amber-300" : "text-amber-600"}`, children: "You do not have enough funds to reach the target amount" })] })), showContinueButton && (_jsx("div", { className: "space-y-4", children: _jsx("button", { type: "button", onClick: () => selectedToken && onContinue(selectedToken), disabled: !selectedToken, className: `w-full font-semibold py-3 px-4 rounded-[24px] transition-colors ${theme === "dark"
+                        ? "bg-blue-600 disabled:bg-gray-700 text-white disabled:text-gray-400 enabled:hover:bg-blue-700"
+                        : "bg-blue-500 disabled:bg-gray-300 text-white disabled:text-gray-500 enabled:hover:bg-blue-600"} disabled:cursor-not-allowed cursor-pointer`, children: "Continue" }) }))] }));
+};
+export default TokenList;

package/dist/widget/components/TransferPending.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import type { TransactionState } from "../../prepareSend.js";
+import type { ActiveTheme } from "../../theme.js";
+interface TransferPendingProps {
+    onComplete: () => void;
+    theme?: ActiveTheme;
+    transactionStates: TransactionState[];
+}
+export declare const TransferPending: React.FC<TransferPendingProps>;
+export default TransferPending;
+//# sourceMappingURL=TransferPending.d.ts.map

package/dist/widget/components/TransferPending.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransferPending.d.ts","sourceRoot":"","sources":["../../../src/widget/components/TransferPending.tsx"],"names":[],"mappings":"AACA,OAAO,KAAoB,MAAM,OAAO,CAAA;AACxC,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAEjD,UAAU,oBAAoB;IAC5B,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,iBAAiB,EAAE,gBAAgB,EAAE,CAAA;CACtC;AAMD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA0L1D,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/widget/components/TransferPending.js

@@ -0,0 +1,77 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ExternalLink } from "lucide-react";
+import React, { useEffect } from "react";
+const _truncateHash = (hash) => {
+    return `${hash.slice(0, 6)}...${hash.slice(-4)}`;
+};
+export const TransferPending = ({ onComplete, theme = "light", transactionStates, }) => {
+    useEffect(() => {
+        const timer = setTimeout(() => {
+            onComplete();
+        }, 5000);
+        return () => clearTimeout(timer);
+    }, [onComplete]);
+    // Find the first pending transaction index
+    const activePendingIndex = transactionStates.findIndex((tx) => tx.state === "pending");
+    const renderStep = (tx, index) => {
+        const isPending = tx.state === "pending";
+        const isActivePending = index === activePendingIndex;
+        const isAfterPending = activePendingIndex !== -1 && index > activePendingIndex;
+        const dotClasses = `relative w-3 h-3 rounded-full transition-colors ${isAfterPending
+            ? theme === "dark"
+                ? "bg-gray-700"
+                : "bg-gray-300"
+            : tx.state === "confirmed"
+                ? theme === "dark"
+                    ? "bg-green-500"
+                    : "bg-green-600"
+                : tx.state === "failed"
+                    ? theme === "dark"
+                        ? "bg-red-500"
+                        : "bg-red-600"
+                    : theme === "dark"
+                        ? "bg-blue-500"
+                        : "bg-blue-600"} ${isActivePending ? "animate-[pulse_1.5s_ease-in-out_infinite]" : ""}`;
+        const labelClasses = `mt-2 text-xs transition-colors text-center whitespace-nowrap flex items-center gap-1 ${isPending || isAfterPending
+            ? theme === "dark"
+                ? "text-gray-400 font-medium"
+                : "text-gray-500 font-medium"
+            : theme === "dark"
+                ? "text-gray-100 font-semibold hover:underline"
+                : "text-gray-900 font-semibold hover:underline"}`;
+        const content = (_jsxs(_Fragment, { children: [_jsx("div", { className: "relative", children: _jsx("div", { className: dotClasses, children: isActivePending && (_jsx("div", { className: `absolute inset-0 rounded-full ${theme === "dark" ? "bg-blue-500" : "bg-blue-600"} animate-[pulseRing_2s_cubic-bezier(0.4,0,0.6,1)_infinite]` })) }) }), _jsx("div", { className: "mt-2 flex justify-center", children: _jsxs("div", { className: labelClasses, children: [tx.label, !isPending && !isAfterPending && (_jsx(ExternalLink, { className: "w-3 h-3" }))] }) })] }));
+        if (isPending || isAfterPending) {
+            return (_jsx("div", { className: "flex flex-col items-center relative", children: content }));
+        }
+        return (_jsx("a", { href: tx.explorerUrl, target: "_blank", rel: "noopener noreferrer", className: "flex flex-col items-center relative", children: content }));
+    };
+    const renderDots = (index) => {
+        const isActiveDots = index === activePendingIndex - 1;
+        return (_jsx("div", { className: "flex-1 flex items-center justify-center mx-4", children: _jsx("div", { className: "flex items-center space-x-2", children: [...Array(3)].map((_, i) => (_jsx("div", { className: `w-1 h-1 rounded-full ${theme === "dark"
+                        ? index >= activePendingIndex
+                            ? "bg-gray-700"
+                            : "bg-gray-600"
+                        : index >= activePendingIndex
+                            ? "bg-gray-300"
+                            : "bg-gray-400"} ${isActiveDots ? "animate-[dotFadeIn_1.5s_ease-in-out_infinite]" : ""}`, style: {
+                        animationDelay: isActiveDots ? `${i * 0.2}s` : "0s",
+                    } }, i))) }) }));
+    };
+    return (_jsxs(_Fragment, { children: [_jsx("style", { children: `
+          @keyframes dotFadeIn {
+            0% { opacity: 0.3; transform: scale(0.8); }
+            50% { opacity: 1; transform: scale(1.2); }
+            100% { opacity: 0.3; transform: scale(0.8); }
+          }
+          @keyframes pulseRing {
+            0% { transform: scale(0.7); opacity: 0; }
+            50% { opacity: 0.3; }
+            100% { transform: scale(2); opacity: 0; }
+          }
+        ` }), _jsxs("div", { className: "space-y-8 flex flex-col items-center justify-center py-8", children: [_jsx("h2", { className: `text-2xl font-bold ${theme === "dark" ? "text-white" : "text-gray-900"}`, children: "Transfer Pending" }), _jsx("div", { className: `animate-spin rounded-full h-16 w-16 border-b-2 ${theme === "dark" ? "border-blue-400" : "border-blue-500"}`, style: { borderTopWidth: "2px", borderBottomWidth: "2px" } }), _jsx("div", { className: "w-full max-w-2xl", children: _jsx("div", { className: "relative flex items-center justify-center pb-8", children: _jsx("div", { className: `flex items-center ${transactionStates.length === 1
+                                    ? "w-auto"
+                                    : transactionStates.length === 2
+                                        ? "w-[200px]"
+                                        : "w-full justify-between"}`, children: transactionStates.map((tx, index) => (_jsxs(React.Fragment, { children: [_jsx("div", { className: "flex flex-col items-center", children: renderStep(tx, index) }), index < transactionStates.length - 1 && renderDots(index)] }, `${tx.transactionHash}-${index}`))) }) }) }), _jsx("p", { className: theme === "dark" ? "text-gray-400" : "text-gray-500", children: "Waiting for confirmation..." })] })] }));
+};
+export default TransferPending;

package/dist/widget/components/TransferPendingVertical.d.ts

@@ -0,0 +1,18 @@
+import type React from "react";
+import type { TransactionState } from "../../prepareSend.js";
+import type { ActiveTheme } from "../../theme.js";
+interface TransferPendingProps {
+    onComplete: () => void;
+    theme?: ActiveTheme;
+    transactionStates: TransactionState[];
+    fromAmount: string;
+    fromAmountUsd: string;
+    fromTokenSymbol: string;
+    fromTokenName: string;
+    fromChainId: number;
+    fromTokenImageUrl?: string;
+    timestamp?: number;
+}
+export declare const TransferPending: React.FC<TransferPendingProps>;
+export default TransferPending;
+//# sourceMappingURL=TransferPendingVertical.d.ts.map

package/dist/widget/components/TransferPendingVertical.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TransferPendingVertical.d.ts","sourceRoot":"","sources":["../../../src/widget/components/TransferPendingVertical.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAC5D,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAGjD,UAAU,oBAAoB;IAC5B,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,iBAAiB,EAAE,gBAAgB,EAAE,CAAA;IACrC,UAAU,EAAE,MAAM,CAAA;IAClB,aAAa,EAAE,MAAM,CAAA;IACrB,eAAe,EAAE,MAAM,CAAA;IACvB,aAAa,EAAE,MAAM,CAAA;IACrB,WAAW,EAAE,MAAM,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAMD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAiY1D,CAAA;AAED,eAAe,eAAe,CAAA"}

package/dist/widget/components/TransferPendingVertical.js

@@ -0,0 +1,183 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ExternalLink } from "lucide-react";
+import { useEffect, useState } from "react";
+import { TokenImage } from "./TokenImage.js";
+const _truncateHash = (hash) => {
+    return `${hash.slice(0, 6)}...${hash.slice(-4)}`;
+};
+export const TransferPending = ({ onComplete, theme = "light", transactionStates, fromAmount, fromAmountUsd, fromTokenSymbol, fromTokenName, fromChainId, fromTokenImageUrl, timestamp, }) => {
+    const [showContent, setShowContent] = useState(false);
+    const [activePendingIndex, setActivePendingIndex] = useState(-1);
+    const [showDots, setShowDots] = useState(false);
+    const [showLine, setShowLine] = useState(false);
+    useEffect(() => {
+        const timer = setTimeout(() => {
+            onComplete();
+        }, 5000);
+        return () => clearTimeout(timer);
+    }, [onComplete]);
+    useEffect(() => {
+        // Animate content in
+        const contentTimer = setTimeout(() => {
+            setShowContent(true);
+        }, 200);
+        return () => clearTimeout(contentTimer);
+    }, []);
+    useEffect(() => {
+        // Show dots first, then animate them in
+        const dotsTimer = setTimeout(() => {
+            setShowDots(true);
+        }, 400);
+        // Show line after dots are visible
+        const lineTimer = setTimeout(() => {
+            setShowLine(true);
+        }, 800);
+        return () => {
+            clearTimeout(dotsTimer);
+            clearTimeout(lineTimer);
+        };
+    }, []);
+    useEffect(() => {
+        // Update active pending index with animation
+        const newActiveIndex = transactionStates.findIndex((tx) => tx.state === "pending");
+        if (newActiveIndex !== activePendingIndex) {
+            setActivePendingIndex(newActiveIndex);
+        }
+    }, [transactionStates, activePendingIndex]);
+    // Add CSS animation for draw effect
+    useEffect(() => {
+        const style = document.createElement("style");
+        style.textContent = `
+      @keyframes draw {
+        from {
+          stroke-dasharray: 0 100;
+        }
+        to {
+          stroke-dasharray: 100 0;
+        }
+      }
+      
+      .animate-draw {
+        animation: draw 0.6s ease-out forwards;
+      }
+
+      @keyframes slideInFromTop {
+        from {
+          transform: translateY(-20px);
+        }
+        to {
+          transform: translateY(0);
+        }
+      }
+
+      @keyframes lineGrow {
+        from {
+          height: 0;
+        }
+        to {
+          height: 100%;
+        }
+      }
+
+      .animate-slide-in {
+        animation: slideInFromTop 0.3s ease-out forwards;
+      }
+
+      .animate-line-grow {
+        animation: lineGrow 0.6s ease-out forwards;
+      }
+    `;
+        document.head.appendChild(style);
+        return () => {
+            document.head.removeChild(style);
+        };
+    }, []);
+    // Calculate time difference
+    const getTimeAgo = () => {
+        if (!timestamp)
+            return "Sent just now";
+        const now = Date.now();
+        const diffInSeconds = Math.floor((now - timestamp) / 1000);
+        if (diffInSeconds < 1)
+            return "Sent just now";
+        if (diffInSeconds === 1)
+            return "Sent 1 second ago";
+        if (diffInSeconds < 60)
+            return `Sent ${diffInSeconds} seconds ago`;
+        const diffInMinutes = Math.floor(diffInSeconds / 60);
+        if (diffInMinutes === 1)
+            return "Sent 1 minute ago";
+        if (diffInMinutes < 60)
+            return `Sent ${diffInMinutes} minutes ago`;
+        const diffInHours = Math.floor(diffInMinutes / 60);
+        if (diffInHours === 1)
+            return "Sent 1 hour ago";
+        if (diffInHours < 24)
+            return `Sent ${diffInHours} hours ago`;
+        const diffInDays = Math.floor(diffInHours / 24);
+        if (diffInDays === 1)
+            return "Sent 1 day ago";
+        return `Sent ${diffInDays} days ago`;
+    };
+    const renderStep = (tx, index) => {
+        const isActivePending = index === activePendingIndex;
+        const isCompleted = tx.state === "confirmed";
+        const isFailed = tx.state === "failed";
+        // Determine step state
+        let stepState;
+        if (isFailed) {
+            stepState = "failed";
+        }
+        else if (isCompleted) {
+            stepState = "completed";
+        }
+        else if (isActivePending) {
+            stepState = "active";
+        }
+        else {
+            stepState = "pending";
+        }
+        // Circle styles based on state
+        const getCircleStyles = () => {
+            const baseStyles = "w-5 h-5 rounded-full flex items-center justify-center transition-all duration-500 ease-out";
+            switch (stepState) {
+                case "completed":
+                    return `${baseStyles} ${theme === "dark" ? "bg-green-500" : "bg-green-600"} scale-100`;
+                case "active":
+                    return `${baseStyles} ${theme === "dark" ? "bg-blue-500" : "bg-blue-600"} scale-110`;
+                case "failed":
+                    return `${baseStyles} ${theme === "dark" ? "bg-red-500" : "bg-red-600"} scale-100`;
+                case "pending":
+                    return `${baseStyles} ${theme === "dark" ? "bg-gray-600" : "bg-gray-300"} scale-100`;
+            }
+        };
+        // Checkmark icon for completed steps
+        const CheckmarkIcon = () => (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: [_jsx("title", { children: "Completed" }), _jsx("path", { d: "M2.5 6L5 8.5L9.5 4", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "animate-draw" })] }));
+        // X icon for failed steps
+        const XIcon = () => (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: [_jsx("title", { children: "Failed" }), _jsx("path", { d: "M3 3L9 9M9 3L3 9", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", className: "animate-draw" })] }));
+        // Spinner icon for active steps
+        const SpinnerIcon = () => (_jsxs("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", className: "animate-spin", children: [_jsx("title", { children: "Processing" }), _jsx("circle", { cx: "6", cy: "6", r: "4", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeDasharray: "6 6", strokeDashoffset: "0" })] }));
+        // Text styles based on state
+        const getTextStyles = () => {
+            const baseStyles = "text-sm font-medium transition-all duration-500 ease-out";
+            // Use regular colors instead of state-based colors
+            return `${baseStyles} ${theme === "dark" ? "text-white" : "text-gray-900"}`;
+        };
+        const content = (_jsxs("div", { className: "flex items-start space-x-4", children: [_jsx("div", { className: "flex-shrink-0", children: _jsxs("div", { className: getCircleStyles(), children: [stepState === "completed" && _jsx(CheckmarkIcon, {}), stepState === "failed" && _jsx(XIcon, {}), stepState === "active" && _jsx(SpinnerIcon, {})] }) }), _jsx("div", { className: "flex-1 min-w-0", children: _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("span", { className: getTextStyles(), children: tx.label }), stepState === "completed" && (_jsx(ExternalLink, { className: "w-4 h-4 text-gray-400 transition-opacity duration-300" }))] }) })] }));
+        if (stepState === "completed" || stepState === "failed") {
+            return (_jsx("a", { href: tx.explorerUrl, target: "_blank", rel: "noopener noreferrer", className: "block hover:opacity-80 transition-all duration-300 ease-out", children: content }));
+        }
+        return _jsx("div", { className: "block", children: content });
+    };
+    return (_jsxs("div", { className: "space-y-8 flex flex-col items-center justify-center py-8", children: [_jsx("h2", { className: `text-2xl font-bold transition-all duration-500 ease-out ${showContent ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"} ${theme === "dark" ? "text-white" : "text-gray-900"}`, children: "Transaction status" }), _jsx("div", { className: `w-full max-w-sm p-3 rounded-lg transition-all duration-500 ease-out delay-100 ${showContent ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"} ${theme === "dark"
+                    ? "bg-gray-800/50 text-gray-200"
+                    : "bg-gray-50 text-gray-700"}`, children: _jsxs("div", { className: "flex items-start justify-between", children: [_jsx("div", { className: "flex items-start space-x-2", children: _jsxs("div", { className: "flex items-center space-x-2", children: [_jsx("div", { style: { width: "24px", height: "24px" }, children: _jsx(TokenImage, { imageUrl: fromTokenImageUrl, symbol: fromTokenSymbol, chainId: fromChainId, size: 24 }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: `text-xs font-medium ${theme === "dark" ? "text-white" : "text-gray-900"}`, children: fromTokenName }), _jsx("span", { className: `text-xs ${theme === "dark" ? "text-gray-400" : "text-gray-500"}`, children: getTimeAgo() })] })] }) }), _jsxs("div", { className: "text-right", children: [_jsx("div", { className: `text-xs font-medium ${theme === "dark" ? "text-white" : "text-gray-900"}`, children: fromAmountUsd }), _jsxs("div", { className: `text-xs ${theme === "dark" ? "text-gray-400" : "text-gray-600"}`, children: [fromAmount, " ", fromTokenSymbol] })] })] }) }), _jsx("div", { className: "w-full mx-auto", style: { width: "auto" }, children: _jsxs("div", { className: "relative", children: [_jsx("div", { className: `absolute left-2.5 top-5 bottom-5 w-0.5 transition-all duration-500 ease-out ${theme === "dark" ? "bg-gray-700" : "bg-gray-300"} ${showLine ? "animate-line-grow" : "h-0"}` }), activePendingIndex > 0 && showLine && (_jsx("div", { className: "absolute left-2.5 top-5 w-0.5 bg-green-500 transition-all duration-1000 ease-out", style: {
+                                height: `${(activePendingIndex / (transactionStates.length - 1)) * 80}%`,
+                                maxHeight: "calc(100% - 20px)",
+                            } })), _jsx("div", { className: "space-y-6", children: transactionStates.map((tx, index) => (_jsx("div", { className: "relative transition-all duration-300 ease-out", style: {
+                                    transitionDelay: showDots ? `${index * 100}ms` : "0ms",
+                                    transform: showDots ? "translateY(0)" : "translateY(-20px)",
+                                    visibility: showDots ? "visible" : "hidden",
+                                }, children: renderStep(tx, index) }, `${tx.transactionHash}-${index}`))) })] }) })] }));
+};
+export default TransferPending;

package/dist/widget/components/WalletConfirmation.d.ts

@@ -0,0 +1,18 @@
+import type React from "react";
+import type { ActiveTheme } from "../../theme.js";
+interface WalletConfirmationProps {
+    onBack: () => void;
+    onComplete: () => void;
+    theme?: ActiveTheme;
+    amount?: string;
+    recipient?: string;
+    tokenSymbol?: string;
+    retryEnabled?: boolean;
+    onRetry?: () => void;
+    fromTokenSymbol: string;
+    fromChainId: number;
+    fromTokenImageUrl: string;
+}
+export declare const WalletConfirmation: React.FC<WalletConfirmationProps>;
+export default WalletConfirmation;
+//# sourceMappingURL=WalletConfirmation.d.ts.map

package/dist/widget/components/WalletConfirmation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"WalletConfirmation.d.ts","sourceRoot":"","sources":["../../../src/widget/components/WalletConfirmation.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAEjD,UAAU,uBAAuB;IAC/B,MAAM,EAAE,MAAM,IAAI,CAAA;IAClB,UAAU,EAAE,MAAM,IAAI,CAAA;IACtB,KAAK,CAAC,EAAE,WAAW,CAAA;IACnB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;IACpB,eAAe,EAAE,MAAM,CAAA;IACvB,WAAW,EAAE,MAAM,CAAA;IACnB,iBAAiB,EAAE,MAAM,CAAA;CAC1B;AAED,eAAO,MAAM,kBAAkB,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAoJhE,CAAA;AAED,eAAe,kBAAkB,CAAA"}

package/dist/widget/components/WalletConfirmation.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TokenImage } from "./TokenImage.js";
+import { ChevronLeft } from "lucide-react";
+import { useEffect, useState } from "react";
+import { getExplorerUrlForAddress } from "../../explorer.js";
+export const WalletConfirmation = ({ theme = "light", amount, recipient, tokenSymbol, retryEnabled = false, onRetry, onBack, fromTokenSymbol, fromChainId, fromTokenImageUrl, }) => {
+    const [showContent, setShowContent] = useState(false);
+    useEffect(() => {
+        setShowContent(true);
+    }, []);
+    return (_jsxs("div", { className: "space-y-6", children: [_jsx("div", { className: "flex items-center relative", children: _jsx("button", { type: "button", onClick: onBack, className: `absolute -left-2 p-2 rounded-full transition-colors cursor-pointer ${theme === "dark"
+                        ? "hover:bg-gray-800 text-gray-400"
+                        : "hover:bg-gray-100 text-gray-600"}`, children: _jsx(ChevronLeft, { className: "h-6 w-6" }) }) }), _jsxs("div", { className: "flex flex-col justify-center min-h-full space-y-6 pt-8", children: [_jsxs("div", { className: "text-center", children: [_jsxs("div", { className: `mx-auto flex items-center justify-center transition-all duration-500 ease-out relative ${showContent ? "transform -translate-y-8" : ""}`, children: [retryEnabled ? (_jsx("div", { className: `h-24 w-24` })) : (_jsx("div", { className: `animate-spin rounded-full h-24 w-24 border-b-2 ${theme === "dark" ? "border-blue-400" : "border-blue-500"}`, style: { borderTopWidth: "2px", borderBottomWidth: "2px" } })), _jsx("div", { className: "absolute", children: _jsx(TokenImage, { imageUrl: fromTokenImageUrl, symbol: fromTokenSymbol, chainId: fromChainId, size: 64 }) })] }), _jsxs("div", { className: `transition-all duration-500 ease-out ${showContent ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`, children: [_jsx("h2", { className: `text-xl font-bold ${theme === "dark" ? "text-white" : "text-gray-900"}`, children: retryEnabled ? "Try again" : "Waiting for wallet..." }), _jsx("p", { className: `mt-2 text-sm ${theme === "dark" ? "text-gray-300" : "text-gray-600"}`, children: "Please approve the request in your wallet" })] })] }), _jsx("div", { className: `transition-all duration-500 ease-out delay-100 ${showContent ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`, children: _jsx("div", { className: `p-4 rounded-lg border ${theme === "dark"
+                                ? "bg-gray-800/50 border-gray-700"
+                                : "bg-gray-50 border-gray-200"}`, children: _jsxs("div", { className: "space-y-3", children: [amount && tokenSymbol && (_jsxs("div", { className: "flex justify-between items-center", children: [_jsx("span", { className: `text-xs ${theme === "dark" ? "text-gray-400" : "text-gray-600"}`, children: "Amount:" }), _jsxs("span", { className: `font-medium text-xs ${theme === "dark" ? "text-white" : "text-gray-900"}`, children: [amount, " ", tokenSymbol] })] })), recipient && (_jsxs("div", { className: "flex justify-between items-center", children: [_jsx("span", { className: `text-xs ${theme === "dark" ? "text-gray-400" : "text-gray-600"}`, children: "To (Intent):" }), _jsxs("a", { href: getExplorerUrlForAddress({
+                                                    address: recipient,
+                                                    chainId: fromChainId,
+                                                }), target: "_blank", rel: "noopener noreferrer", className: `font-mono text-xs hover:underline ${theme === "dark" ? "text-gray-300" : "text-gray-700"}`, children: [recipient.slice(0, 6), "...", recipient.slice(-4)] })] }))] }) }) }), retryEnabled && onRetry && (_jsx("div", { className: `transition-all duration-500 ease-out delay-300 ${showContent ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`, children: _jsx("button", { type: "button", onClick: onRetry, className: `w-full px-4 py-2 rounded-lg font-medium transition-colors cursor-pointer ${theme === "dark"
+                                ? "bg-blue-600 hover:bg-blue-700 text-white"
+                                : "bg-blue-500 hover:bg-blue-600 text-white"}`, children: "Try Again" }) }))] })] }));
+};
+export default WalletConfirmation;

package/dist/widget/config.d.ts

@@ -0,0 +1,4 @@
+export declare const defaultPrivyAppId = "cmc25oq0a01dvl40mn0ex5e1o";
+export declare const defaultPrivyClientId = "client-WY6MrvK6dbp1FSBPU1DKa6ymAHrJBPYxyFX39dFCCd56L";
+export declare const SITE_URL = "https://trails.build/";
+//# sourceMappingURL=config.d.ts.map

package/dist/widget/config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/widget/config.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,iBAAiB,8BAA8B,CAAA;AAC5D,eAAO,MAAM,oBAAoB,yDACuB,CAAA;AAExD,eAAO,MAAM,QAAQ,0BAA0B,CAAA"}

package/dist/widget/config.js

@@ -0,0 +1,3 @@
+export const defaultPrivyAppId = "cmc25oq0a01dvl40mn0ex5e1o";
+export const defaultPrivyClientId = "client-WY6MrvK6dbp1FSBPU1DKa6ymAHrJBPYxyFX39dFCCd56L";
+export const SITE_URL = "https://trails.build/";

package/dist/widget/copy-e0xXvKN0.js

@@ -0,0 +1,20 @@
+import "./index-CK94R-H7.js";
+import { b as C } from "./lit-html-BRjl1r6K.js";
+const e = C`<svg
+  xmlns="http://www.w3.org/2000/svg"
+  width="16"
+  height="16"
+  viewBox="0 0 16 16"
+  fill="none"
+>
+  <path
+    fill="currentColor"
+    fill-rule="evenodd"
+    clip-rule="evenodd"
+    d="M9.21498 1.28565H10.5944C11.1458 1.28562 11.6246 1.2856 12.0182 1.32093C12.4353 1.35836 12.853 1.44155 13.2486 1.66724C13.7005 1.92498 14.0749 2.29935 14.3326 2.75122C14.5583 3.14689 14.6415 3.56456 14.6789 3.9817C14.7143 4.37531 14.7142 4.85403 14.7142 5.40545V6.78489C14.7142 7.33631 14.7143 7.81503 14.6789 8.20865C14.6415 8.62578 14.5583 9.04345 14.3326 9.43912C14.0749 9.89099 13.7005 10.2654 13.2486 10.5231C12.853 10.7488 12.4353 10.832 12.0182 10.8694C11.7003 10.8979 11.3269 10.9034 10.9045 10.9045C10.9034 11.3269 10.8979 11.7003 10.8694 12.0182C10.832 12.4353 10.7488 12.853 10.5231 13.2486C10.2654 13.7005 9.89099 14.0749 9.43912 14.3326C9.04345 14.5583 8.62578 14.6415 8.20865 14.6789C7.81503 14.7143 7.33631 14.7142 6.78489 14.7142H5.40545C4.85403 14.7142 4.37531 14.7143 3.9817 14.6789C3.56456 14.6415 3.14689 14.5583 2.75122 14.3326C2.29935 14.0749 1.92498 13.7005 1.66724 13.2486C1.44155 12.853 1.35836 12.4353 1.32093 12.0182C1.2856 11.6246 1.28562 11.1458 1.28565 10.5944V9.21498C1.28562 8.66356 1.2856 8.18484 1.32093 7.79122C1.35836 7.37409 1.44155 6.95642 1.66724 6.56074C1.92498 6.10887 2.29935 5.73451 2.75122 5.47677C3.14689 5.25108 3.56456 5.16789 3.9817 5.13045C4.2996 5.10192 4.67301 5.09645 5.09541 5.09541C5.09645 4.67302 5.10192 4.2996 5.13045 3.9817C5.16789 3.56456 5.25108 3.14689 5.47676 2.75122C5.73451 2.29935 6.10887 1.92498 6.56074 1.66724C6.95642 1.44155 7.37409 1.35836 7.79122 1.32093C8.18484 1.2856 8.66356 1.28562 9.21498 1.28565ZM5.09541 7.09552C4.68397 7.09667 4.39263 7.10161 4.16046 7.12245C3.88053 7.14757 3.78516 7.18949 3.74214 7.21403C3.60139 7.29431 3.48478 7.41091 3.4045 7.55166C3.37997 7.59468 3.33804 7.69005 3.31292 7.96999C3.28659 8.26345 3.28565 8.65147 3.28565 9.25708V10.5523C3.28565 11.1579 3.28659 11.5459 3.31292 11.8394C3.33804 12.1193 3.37997 12.2147 3.4045 12.2577C3.48478 12.3985 3.60139 12.5151 3.74214 12.5954C3.78516 12.6199 3.88053 12.6618 4.16046 12.6869C4.45393 12.7133 4.84195 12.7142 5.44755 12.7142H6.74279C7.3484 12.7142 7.73641 12.7133 8.02988 12.6869C8.30981 12.6618 8.40518 12.6199 8.44821 12.5954C8.58895 12.5151 8.70556 12.3985 8.78584 12.2577C8.81038 12.2147 8.8523 12.1193 8.87742 11.8394C8.89825 11.6072 8.90319 11.3159 8.90435 10.9045C8.48219 10.9034 8.10898 10.8979 7.79122 10.8694C7.37409 10.832 6.95641 10.7488 6.56074 10.5231C6.10887 10.2654 5.73451 9.89099 5.47676 9.43912C5.25108 9.04345 5.16789 8.62578 5.13045 8.20865C5.10194 7.89089 5.09645 7.51767 5.09541 7.09552ZM7.96999 3.31292C7.69005 3.33804 7.59468 3.37997 7.55166 3.4045C7.41091 3.48478 7.29431 3.60139 7.21403 3.74214C7.18949 3.78516 7.14757 3.88053 7.12245 4.16046C7.09611 4.45393 7.09517 4.84195 7.09517 5.44755V6.74279C7.09517 7.3484 7.09611 7.73641 7.12245 8.02988C7.14757 8.30981 7.18949 8.40518 7.21403 8.4482C7.29431 8.58895 7.41091 8.70556 7.55166 8.78584C7.59468 8.81038 7.69005 8.8523 7.96999 8.87742C8.26345 8.90376 8.65147 8.9047 9.25708 8.9047H10.5523C11.1579 8.9047 11.5459 8.90376 11.8394 8.87742C12.1193 8.8523 12.2147 8.81038 12.2577 8.78584C12.3985 8.70556 12.5151 8.58895 12.5954 8.4482C12.6199 8.40518 12.6618 8.30981 12.6869 8.02988C12.7133 7.73641 12.7142 7.3484 12.7142 6.74279V5.44755C12.7142 4.84195 12.7133 4.45393 12.6869 4.16046C12.6618 3.88053 12.6199 3.78516 12.5954 3.74214C12.5151 3.60139 12.3985 3.48478 12.2577 3.4045C12.2147 3.37997 12.1193 3.33804 11.8394 3.31292C11.5459 3.28659 11.1579 3.28565 10.5523 3.28565H9.25708C8.65147 3.28565 8.26345 3.28659 7.96999 3.31292Z"
+    fill="#788181"
+  /></svg
+>`;
+export {
+  e as copySvg
+};

package/dist/widget/cursor-CqM3v0xJ.js

@@ -0,0 +1,8 @@
+import "./index-CK94R-H7.js";
+import { b as o } from "./lit-html-BRjl1r6K.js";
+const i = o` <svg fill="none" viewBox="0 0 13 4">
+  <path fill="currentColor" d="M.5 0h12L8.9 3.13a3.76 3.76 0 0 1-4.8 0L.5 0Z" />
+</svg>`;
+export {
+  i as cursorSvg
+};

package/dist/widget/cursor-transparent-CUQpdsCG.js

@@ -0,0 +1,17 @@
+import "./index-CK94R-H7.js";
+import { b as o } from "./lit-html-BRjl1r6K.js";
+const t = o`<svg fill="none" viewBox="0 0 14 6">
+  <path style="fill: var(--wui-color-bg-150);" d="M0 1h14L9.21 5.12a3.31 3.31 0 0 1-4.49 0L0 1Z" />
+  <path
+    style="stroke: var(--wui-color-inverse-100);"
+    stroke-opacity=".05"
+    d="M1.33 1.5h11.32L8.88 4.75l-.01.01a2.81 2.81 0 0 1-3.8 0l-.02-.01L1.33 1.5Z"
+  />
+  <path
+    style="fill: var(--wui-color-bg-150);"
+    d="M1.25.71h11.5L9.21 3.88a3.31 3.31 0 0 1-4.49 0L1.25.71Z"
+  />
+</svg> `;
+export {
+  t as cursorTransparentSvg
+};

package/dist/widget/desktop-DUDGIRpM.js

@@ -0,0 +1,14 @@
+import "./index-CK94R-H7.js";
+import { b as c } from "./lit-html-BRjl1r6K.js";
+const l = c`<svg fill="none" viewBox="0 0 20 20">
+  <path
+    fill="currentColor"
+    fill-rule="evenodd"
+    d="M13.66 2H6.34c-1.07 0-1.96 0-2.68.08-.74.08-1.42.25-2.01.68a4 4 0 0 0-.89.89c-.43.6-.6 1.27-.68 2.01C0 6.38 0 7.26 0 8.34v.89c0 1.07 0 1.96.08 2.68.08.74.25 1.42.68 2.01a4 4 0 0 0 .89.89c.6.43 1.27.6 2.01.68a27 27 0 0 0 2.68.08h7.32a27 27 0 0 0 2.68-.08 4.03 4.03 0 0 0 2.01-.68 4 4 0 0 0 .89-.89c.43-.6.6-1.27.68-2.01.08-.72.08-1.6.08-2.68v-.89c0-1.07 0-1.96-.08-2.68a4.04 4.04 0 0 0-.68-2.01 4 4 0 0 0-.89-.89c-.6-.43-1.27-.6-2.01-.68C15.62 2 14.74 2 13.66 2ZM2.82 4.38c.2-.14.48-.25 1.06-.31C4.48 4 5.25 4 6.4 4h7.2c1.15 0 1.93 0 2.52.07.58.06.86.17 1.06.31a2 2 0 0 1 .44.44c.14.2.25.48.31 1.06.07.6.07 1.37.07 2.52v.77c0 1.15 0 1.93-.07 2.52-.06.58-.17.86-.31 1.06a2 2 0 0 1-.44.44c-.2.14-.48.25-1.06.32-.6.06-1.37.06-2.52.06H6.4c-1.15 0-1.93 0-2.52-.06-.58-.07-.86-.18-1.06-.32a2 2 0 0 1-.44-.44c-.14-.2-.25-.48-.31-1.06C2 11.1 2 10.32 2 9.17V8.4c0-1.15 0-1.93.07-2.52.06-.58.17-.86.31-1.06a2 2 0 0 1 .44-.44Z"
+    clip-rule="evenodd"
+  />
+  <path fill="currentColor" d="M6.14 17.57a1 1 0 1 0 0 2h7.72a1 1 0 1 0 0-2H6.14Z" />
+</svg>`;
+export {
+  l as desktopSvg
+};

package/dist/widget/disconnect-DUFST9QQ.js

@@ -0,0 +1,13 @@
+import "./index-CK94R-H7.js";
+import { b as a } from "./lit-html-BRjl1r6K.js";
+const e = a`<svg fill="none" viewBox="0 0 16 16">
+  <path
+    fill="currentColor"
+    fill-rule="evenodd"
+    d="M6.07 1h.57a1 1 0 0 1 0 2h-.52c-.98 0-1.64 0-2.14.06-.48.05-.7.14-.84.24-.13.1-.25.22-.34.35-.1.14-.2.35-.25.83-.05.5-.05 1.16-.05 2.15v2.74c0 .99 0 1.65.05 2.15.05.48.14.7.25.83.1.14.2.25.34.35.14.1.36.2.84.25.5.05 1.16.05 2.14.05h.52a1 1 0 0 1 0 2h-.57c-.92 0-1.69 0-2.3-.07a3.6 3.6 0 0 1-1.8-.61c-.3-.22-.57-.49-.8-.8a3.6 3.6 0 0 1-.6-1.79C.5 11.11.5 10.35.5 9.43V6.58c0-.92 0-1.7.06-2.31a3.6 3.6 0 0 1 .62-1.8c.22-.3.48-.57.79-.79a3.6 3.6 0 0 1 1.8-.61C4.37 1 5.14 1 6.06 1ZM9.5 3a1 1 0 0 1 1.42 0l4.28 4.3a1 1 0 0 1 0 1.4L10.93 13a1 1 0 0 1-1.42-1.42L12.1 9H6.8a1 1 0 1 1 0-2h5.3L9.51 4.42a1 1 0 0 1 0-1.41Z"
+    clip-rule="evenodd"
+  />
+</svg>`;
+export {
+  e as disconnectSvg
+};

package/dist/widget/discord-C1cj365Z.js

@@ -0,0 +1,22 @@
+import "./index-CK94R-H7.js";
+import { b as l } from "./lit-html-BRjl1r6K.js";
+const f = l`<svg fill="none" viewBox="0 0 40 40">
+  <g clip-path="url(#a)">
+    <g clip-path="url(#b)">
+      <circle cx="20" cy="19.89" r="20" fill="#5865F2" />
+      <path
+        fill="#fff"
+        fill-rule="evenodd"
+        d="M25.71 28.15C30.25 28 32 25.02 32 25.02c0-6.61-2.96-11.98-2.96-11.98-2.96-2.22-5.77-2.15-5.77-2.15l-.29.32c3.5 1.07 5.12 2.61 5.12 2.61a16.75 16.75 0 0 0-10.34-1.93l-.35.04a15.43 15.43 0 0 0-5.88 1.9s1.71-1.63 5.4-2.7l-.2-.24s-2.81-.07-5.77 2.15c0 0-2.96 5.37-2.96 11.98 0 0 1.73 2.98 6.27 3.13l1.37-1.7c-2.6-.79-3.6-2.43-3.6-2.43l.58.35.09.06.08.04.02.01.08.05a17.25 17.25 0 0 0 4.52 1.58 14.4 14.4 0 0 0 8.3-.86c.72-.27 1.52-.66 2.37-1.21 0 0-1.03 1.68-3.72 2.44.61.78 1.35 1.67 1.35 1.67Zm-9.55-9.6c-1.17 0-2.1 1.03-2.1 2.28 0 1.25.95 2.28 2.1 2.28 1.17 0 2.1-1.03 2.1-2.28.01-1.25-.93-2.28-2.1-2.28Zm7.5 0c-1.17 0-2.1 1.03-2.1 2.28 0 1.25.95 2.28 2.1 2.28 1.17 0 2.1-1.03 2.1-2.28 0-1.25-.93-2.28-2.1-2.28Z"
+        clip-rule="evenodd"
+      />
+    </g>
+  </g>
+  <defs>
+    <clipPath id="a"><rect width="40" height="40" fill="#fff" rx="20" /></clipPath>
+    <clipPath id="b"><path fill="#fff" d="M0 0h40v40H0z" /></clipPath>
+  </defs>
+</svg>`;
+export {
+  f as discordSvg
+};