0xtrails 0.16.2 → 0.17.0

package/dist/widget/components/TransferPendingVertical.js

@@ -1,356 +0,0 @@
-import { MINUTE_MS as w, formatDuration as X } from "../../utils/time.js";
-import "../../constants.js";
-import { useViewManager as Z } from "../../hooks/useViewManager.js";
-import { ScreenHeader as J } from "./ScreenHeader.js";
-import { hasMetaTxError as O } from "../../utils/passthrough.js";
-import { hasAnyFailedOrAbortedTransactions as K, hasFailedOrAbortedTransaction as v } from "../utils/transactionFailure.js";
-import q from "./QuoteDetails.js";
-import ee from "./OFTProgressBar.js";
-import { OriginTransferInformation as te } from "./OriginTransferInformation.js";
-import { SwapDisplay as re } from "./SwapDisplay.js";
-import { mainnet as ae } from "viem/chains";
-import { useEffect as o, useState as l } from "react";
-import { jsx as e, jsxs as a } from "react/jsx-runtime";
-import { ChevronRight as ie, ExternalLink as ne } from "lucide-react";
-var se = "LZ_OFT", oe = (u) => u?.length ? u.some((i) => i.id === se) : !1, le = 60 * w, ce = w, de = 2 * w, me = 3 * w, he = () => /* @__PURE__ */ a("svg", {
-  width: "12",
-  height: "12",
-  viewBox: "0 0 12 12",
-  fill: "none",
-  children: [/* @__PURE__ */ e("title", { children: "Completed" }), /* @__PURE__ */ e("path", {
-    d: "M2.5 6L5 8.5L9.5 4",
-    stroke: "white",
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    className: "animate-draw"
-  })]
-}), ue = () => /* @__PURE__ */ a("svg", {
-  width: "12",
-  height: "12",
-  viewBox: "0 0 12 12",
-  fill: "none",
-  children: [/* @__PURE__ */ e("title", { children: "Failed" }), /* @__PURE__ */ e("path", {
-    d: "M3 3L9 9M9 3L3 9",
-    stroke: "white",
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    className: "animate-draw"
-  })]
-}), fe = () => /* @__PURE__ */ a("svg", {
-  className: "w-4 h-4 text-white",
-  fill: "none",
-  viewBox: "0 0 24 24",
-  stroke: "currentColor",
-  children: [/* @__PURE__ */ e("title", { children: "An internal meta tx failure occurred" }), /* @__PURE__ */ e("path", {
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 2,
-    d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z"
-  })]
-}), pe = () => /* @__PURE__ */ a("svg", {
-  width: "12",
-  height: "12",
-  viewBox: "0 0 12 12",
-  fill: "none",
-  className: "animate-spin",
-  children: [/* @__PURE__ */ e("title", { children: "Processing" }), /* @__PURE__ */ e("circle", {
-    cx: "6",
-    cy: "6",
-    r: "4",
-    stroke: "white",
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeDasharray: "6 6",
-    strokeDashoffset: "0"
-  })]
-}), Oe = ({ onElapsedTime: u, transactionStates: i, quote: s, onRampQuote: _, timestamp: A, onContinue: b, fundMethod: T }) => {
-  const { mode: N } = Z(), [d, D] = l(!1), [y, F] = l(!1), [I, P] = l(!1), [$, U] = l(!1), [j, L] = l(0), [p, R] = l(null), f = oe(s?.routeProviders), M = s?.originChain?.id === ae.id, S = K(i) && b;
-  o(() => {
-    const t = setTimeout(() => {
-      U(!0);
-    }, T === "onramp-mesh" ? me : f ? le : M ? de : ce);
-    return () => clearTimeout(t);
-  }, [
-    T,
-    M,
-    f
-  ]), o(() => {
-    f && i?.[0]?.state === "confirmed" && !p && R(Date.now());
-  }, [
-    i,
-    f,
-    p
-  ]), o(() => {
-    const t = setTimeout(() => {
-      D(!0);
-    }, 200);
-    return () => clearTimeout(t);
-  }, []), o(() => {
-    const t = setTimeout(() => {
-      F(!0);
-    }, 400), r = setTimeout(() => {
-      P(!0);
-    }, 800);
-    return () => {
-      clearTimeout(t), clearTimeout(r);
-    };
-  }, []);
-  const [m, W] = l(-1);
-  o(() => {
-    const t = i.findIndex((r) => r.state === "pending");
-    t !== m && (W(t), L(0));
-  }, [i, m]), o(() => {
-    const t = document.createElement("style");
-    return t.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(t), () => {
-      document.head.removeChild(t);
-    };
-  }, []);
-  const [g, B] = l(0);
-  o(() => {
-    const t = setInterval(() => {
-      B((r) => r + 1);
-    }, 1e3);
-    return () => clearInterval(t);
-  }, []), o(() => {
-    if (m >= 0) {
-      const t = setInterval(() => {
-        L((r) => r + 1);
-      }, 1e3);
-      return () => clearInterval(t);
-    }
-  }, [m]), o(() => {
-    u(g);
-  }, [u, g]);
-  const x = [];
-  let C = !1;
-  for (const t of i) C || t.state !== "confirmed" ? (C = !0, x.push({
-    ...t,
-    state: t.state === "confirmed" ? "pending" : t.state
-  })) : x.push(t);
-  const H = (t, r) => {
-    const h = r === m, Y = t.state === "confirmed", G = v(t), k = O(t), V = i.slice(0, r).some((c) => v(c));
-    let n;
-    G ? n = "failed" : Y ? n = "completed" : h && !V ? n = "active" : n = "pending";
-    const z = () => {
-      const c = "w-5 h-5 rounded-full flex items-center justify-center transition-all duration-500 ease-out";
-      switch (n) {
-        case "completed":
-          return k ? `${c} bg-orange-500 scale-100` : `${c} bg-green-600 dark:bg-green-500 scale-100`;
-        case "active":
-          return `${c} bg-blue-600 dark:bg-blue-500 scale-110`;
-        case "failed":
-          return `${c} bg-red-600 dark:bg-red-500 scale-100`;
-        case "pending":
-          return `${c} bg-gray-300 dark:bg-gray-600 scale-100`;
-      }
-    }, Q = () => "text-sm font-medium transition-all duration-500 ease-out text-gray-900 dark:text-white", E = /* @__PURE__ */ a("div", {
-      className: "flex items-start space-x-4",
-      children: [/* @__PURE__ */ e("div", {
-        className: "flex-shrink-0",
-        children: /* @__PURE__ */ a("div", {
-          className: z(),
-          children: [
-            n === "completed" && !k && /* @__PURE__ */ e(he, {}),
-            n === "completed" && k && /* @__PURE__ */ e(fe, {}),
-            n === "failed" && /* @__PURE__ */ e(ue, {}),
-            n === "active" && /* @__PURE__ */ e(pe, {})
-          ]
-        })
-      }), /* @__PURE__ */ e("div", {
-        className: "flex-1 min-w-0",
-        children: /* @__PURE__ */ a("div", {
-          className: "flex items-center space-x-2",
-          children: [/* @__PURE__ */ e("span", {
-            className: Q(),
-            children: t.label
-          }), n === "completed" ? /* @__PURE__ */ e(ne, { className: "w-4 h-4 text-gray-400 transition-opacity duration-300" }) : n === "active" ? /* @__PURE__ */ e("span", {
-            className: "text-xs text-gray-500 dark:text-gray-400 font-mono animate-pulse mt-1",
-            title: "Elapsed time",
-            children: X(j)
-          }) : /* @__PURE__ */ e("div", { className: "w-4 h-4" })]
-        })
-      })]
-    });
-    return n === "completed" || n === "failed" ? /* @__PURE__ */ e("a", {
-      href: t.explorerUrl,
-      target: "_blank",
-      rel: "noopener noreferrer",
-      className: "block hover:opacity-80 transition-all duration-300 ease-out",
-      children: E
-    }) : /* @__PURE__ */ e("div", {
-      className: "block",
-      children: E
-    });
-  };
-  return /* @__PURE__ */ a("div", {
-    className: "space-y-2 flex flex-col items-center justify-center py-8",
-    children: [
-      /* @__PURE__ */ e("div", {
-        className: `w-full max-w-sm transition-all duration-500 ease-out ${d ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`,
-        children: /* @__PURE__ */ e(J, {
-          headerContent: N === "swap" ? "Swap in progress" : "Transaction Status",
-          headerContentAlign: "center"
-        })
-      }),
-      s && /* @__PURE__ */ e("div", {
-        className: `w-full max-w-sm transition-all duration-500 ease-out delay-100 ${d ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`,
-        children: N === "swap" ? /* @__PURE__ */ e(re, {
-          quote: s,
-          elapsedSeconds: g
-        }) : /* @__PURE__ */ e(te, {
-          quote: s,
-          elapsedSeconds: g,
-          timestamp: A
-        })
-      }),
-      /* @__PURE__ */ e("div", {
-        className: "mb-2 w-full mx-auto",
-        style: { width: "auto" },
-        children: /* @__PURE__ */ a("div", {
-          className: "relative",
-          children: [
-            /* @__PURE__ */ e("div", { className: `absolute left-2.5 top-5 bottom-5 w-0.5 transition-all duration-500 ease-out bg-gray-300 dark:bg-gray-700 ${I ? "animate-line-grow" : "h-0"}` }),
-            m > 0 && I && /* @__PURE__ */ e("div", {
-              className: "absolute left-2.5 top-5 w-0.5 bg-green-500 transition-all duration-1000 ease-out",
-              style: {
-                height: `${(() => {
-                  let t = -1;
-                  for (let r = 0; r < i.length; r++) {
-                    const h = i[r];
-                    if (h && h.state === "confirmed" && !v(h)) t = r;
-                    else if (v(h)) break;
-                  }
-                  return t >= 0 ? t / (i.length - 1) * 80 : 0;
-                })()}%`,
-                maxHeight: "calc(100% - 20px)"
-              }
-            }),
-            /* @__PURE__ */ e("div", {
-              className: "space-y-6 mt-4",
-              children: x.map((t, r) => /* @__PURE__ */ e("div", {
-                className: "relative transition-all duration-300 ease-out",
-                style: {
-                  transitionDelay: y ? `${r * 100}ms` : "0ms",
-                  transform: y ? "translateY(0)" : "translateY(-20px)",
-                  visibility: y ? "visible" : "hidden"
-                },
-                children: H(t, r)
-              }, t.id))
-            })
-          ]
-        })
-      }),
-      f && p && s?.completionEstimateSeconds != null && /* @__PURE__ */ e(ee, {
-        depositConfirmedAt: p,
-        estimatedDurationSeconds: s.completionEstimateSeconds,
-        showContent: d
-      }),
-      S && /* @__PURE__ */ e("div", {
-        className: `w-full max-w-sm transition-all duration-500 ease-out delay-150 mt-4 flex justify-center ${d ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`,
-        children: /* @__PURE__ */ a("button", {
-          type: "button",
-          onClick: b,
-          className: "inline-flex items-center gap-1 px-4 py-2 trails-border-radius-button font-medium transition-colors cursor-pointer bg-blue-500 hover:bg-blue-600 text-white dark:bg-blue-600 dark:hover:bg-blue-700",
-          children: ["Continue", /* @__PURE__ */ e(ie, { className: "w-4 h-4" })]
-        })
-      }),
-      s && /* @__PURE__ */ e("div", {
-        className: `w-full max-w-sm transition-all duration-500 ease-out delay-200 ${d ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`,
-        children: /* @__PURE__ */ e("div", {
-          className: "mt-4",
-          children: /* @__PURE__ */ e(q, {
-            quote: s,
-            onRampQuote: _,
-            showContent: !0,
-            compact: !0,
-            liveTransactionStates: i,
-            hasMetaTxError: O
-          })
-        })
-      }),
-      $ && !S && /* @__PURE__ */ e("div", {
-        className: `w-full max-w-sm transition-all duration-500 ease-out delay-250 ${d ? "opacity-100 translate-y-0" : "opacity-0 translate-y-4"}`,
-        children: /* @__PURE__ */ e("div", {
-          className: "p-4 trails-border-radius-container text-sm bg-yellow-50 border border-solid border-yellow-200 dark:bg-yellow-900/20 dark:border-yellow-700/50",
-          children: /* @__PURE__ */ a("div", {
-            className: "flex items-start space-x-3",
-            children: [/* @__PURE__ */ a("svg", {
-              className: "w-5 h-5 mt-0.5 flex-shrink-0 text-yellow-600 dark:text-yellow-400",
-              fill: "none",
-              viewBox: "0 0 24 24",
-              stroke: "currentColor",
-              children: [/* @__PURE__ */ e("title", { children: "Warning" }), /* @__PURE__ */ e("path", {
-                strokeLinecap: "round",
-                strokeLinejoin: "round",
-                strokeWidth: 2,
-                d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.732 16.5c-.77.833.192 2.5 1.732 2.5z"
-              })]
-            }), /* @__PURE__ */ a("div", { children: [/* @__PURE__ */ e("p", {
-              className: "font-medium text-yellow-800 dark:text-yellow-300",
-              children: "Transaction taking longer than expected"
-            }), /* @__PURE__ */ a("p", {
-              className: "mt-1 text-xs text-yellow-700 dark:text-yellow-400",
-              children: [
-                "This transaction is taking longer than expected.",
-                " ",
-                /* @__PURE__ */ e("a", {
-                  href: "https://support.trails.build/",
-                  target: "_blank",
-                  rel: "noopener noreferrer",
-                  className: "text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300 hover:underline",
-                  children: "Visit support"
-                }),
-                " ",
-                "for help if the issue persists."
-              ]
-            })] })]
-          })
-        })
-      })
-    ]
-  });
-};
-export {
-  Oe as default
-};

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

@@ -1,12 +0,0 @@
-import { default as React } from 'react';
-interface TruncatedTransactionHashProps {
-    txHash: string;
-    chainId: number;
-    className?: string;
-    expandOnHover?: boolean;
-    sliceStart?: number;
-    sliceEnd?: number;
-}
-export declare const TruncatedTransactionHash: React.FC<TruncatedTransactionHashProps>;
-export default TruncatedTransactionHash;
-//# sourceMappingURL=TruncatedTransactionHash.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"TruncatedTransactionHash.d.ts","sourceRoot":"","sources":["../../../src/widget/components/TruncatedTransactionHash.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,UAAU,6BAA6B;IACrC,MAAM,EAAE,MAAM,CAAA;IACd,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,eAAO,MAAM,wBAAwB,EAAE,KAAK,CAAC,EAAE,CAC7C,6BAA6B,CAwD9B,CAAA;AAED,eAAe,wBAAwB,CAAA"}

package/dist/widget/components/TruncatedTransactionHash.js

@@ -1,36 +0,0 @@
-import { getExplorerUrl as p } from "../../explorer.js";
-import { isDisplayableTransactionHash as f } from "../../transactions.js";
-import { useState as d } from "react";
-import { jsx as r, jsxs as m } from "react/jsx-runtime";
-var y = ({ txHash: e, chainId: i, className: n = "", expandOnHover: s = !1, sliceStart: c = 10, sliceEnd: u = 6 }) => {
-  const [o, a] = d(!1);
-  if (!f(e)) return null;
-  const t = `${e.slice(0, c)}…${e.slice(-u)}`, l = p({
-    txHash: e,
-    chainId: i
-  });
-  return s ? /* @__PURE__ */ m("a", {
-    href: l,
-    target: "_blank",
-    rel: "noopener noreferrer",
-    onMouseEnter: () => a(!0),
-    onMouseLeave: () => a(!1),
-    className: `font-mono transition-all duration-300 cursor-pointer hover:underline relative inline-block ${n}`,
-    children: [/* @__PURE__ */ r("span", {
-      className: `transition-all duration-300 ${o ? "opacity-0" : "opacity-100"}`,
-      children: t
-    }), /* @__PURE__ */ r("span", {
-      className: `absolute left-0 top-0 transition-all duration-300 underline ${o ? "opacity-100" : "opacity-0"}`,
-      children: e
-    })]
-  }) : /* @__PURE__ */ r("a", {
-    href: l,
-    target: "_blank",
-    rel: "noopener noreferrer",
-    className: `font-mono cursor-pointer hover:underline ${n}`,
-    children: t
-  });
-};
-export {
-  y as default
-};

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

@@ -1,7 +0,0 @@
-import { default as React } from 'react';
-interface UserPreferencesProps {
-    onBack?: () => void;
-}
-export declare const UserPreferences: React.FC<UserPreferencesProps>;
-export default UserPreferences;
-//# sourceMappingURL=UserPreferences.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"UserPreferences.d.ts","sourceRoot":"","sources":["../../../src/widget/components/UserPreferences.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAgB9B,UAAU,oBAAoB;IAC5B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAA;CACpB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAkiB1D,CAAA;AAED,eAAe,eAAe,CAAA"}