@hyperbridge/ui 0.0.36 → 0.0.38
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +17 -2
- package/dist/index.mjs +645 -574
- package/package.json +2 -1
package/dist/index.mjs
CHANGED
|
@@ -569,39 +569,72 @@ var GradientButton = React.forwardRef((props, ref) => {
|
|
|
569
569
|
) });
|
|
570
570
|
});
|
|
571
571
|
|
|
572
|
-
// src
|
|
573
|
-
import {
|
|
574
|
-
function Input(_a) {
|
|
575
|
-
var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
|
|
576
|
-
return /* @__PURE__ */ jsx9(
|
|
577
|
-
"input",
|
|
578
|
-
__spreadValues({
|
|
579
|
-
type,
|
|
580
|
-
"data-slot": "input",
|
|
581
|
-
className: cn(
|
|
582
|
-
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
|
|
583
|
-
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
|
584
|
-
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
585
|
-
className
|
|
586
|
-
)
|
|
587
|
-
}, props)
|
|
588
|
-
);
|
|
589
|
-
}
|
|
572
|
+
// src/components/form/swap-form.tsx
|
|
573
|
+
import { useState } from "react";
|
|
590
574
|
|
|
591
|
-
// src/
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
575
|
+
// src/components/input/numeric-input.tsx
|
|
576
|
+
import * as React2 from "react";
|
|
577
|
+
import CurrencyInput from "react-currency-input-field";
|
|
578
|
+
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
579
|
+
var NumericInput = React2.forwardRef(
|
|
580
|
+
({
|
|
581
|
+
className,
|
|
582
|
+
decimalsLimit = 18,
|
|
583
|
+
value = "",
|
|
584
|
+
onValueChange,
|
|
585
|
+
allowDecimals = true,
|
|
586
|
+
allowNegativeValue = false,
|
|
587
|
+
decimalSeparator = ".",
|
|
588
|
+
groupSeparator = ",",
|
|
589
|
+
prefix = "",
|
|
590
|
+
suffix = "",
|
|
591
|
+
disableGroupSeparators = true,
|
|
592
|
+
disabled,
|
|
593
|
+
placeholder = "0",
|
|
594
|
+
id,
|
|
595
|
+
name,
|
|
596
|
+
onFocus,
|
|
597
|
+
onBlur,
|
|
598
|
+
"data-testid": dataTestId,
|
|
599
|
+
autoFocus,
|
|
600
|
+
autoComplete,
|
|
601
|
+
maxLength
|
|
602
|
+
}, ref) => {
|
|
603
|
+
return /* @__PURE__ */ jsx9(
|
|
604
|
+
CurrencyInput,
|
|
605
|
+
{
|
|
606
|
+
ref,
|
|
607
|
+
id,
|
|
608
|
+
name,
|
|
609
|
+
value,
|
|
610
|
+
onValueChange,
|
|
611
|
+
decimalsLimit,
|
|
612
|
+
allowDecimals,
|
|
613
|
+
allowNegativeValue,
|
|
614
|
+
decimalSeparator,
|
|
615
|
+
groupSeparator,
|
|
616
|
+
prefix,
|
|
617
|
+
suffix,
|
|
618
|
+
disableGroupSeparators,
|
|
619
|
+
disabled,
|
|
620
|
+
placeholder,
|
|
621
|
+
onFocus,
|
|
622
|
+
onBlur,
|
|
623
|
+
"data-testid": dataTestId,
|
|
624
|
+
autoFocus,
|
|
625
|
+
autoComplete,
|
|
626
|
+
maxLength,
|
|
627
|
+
className: cn(
|
|
628
|
+
"w-[269px] border-none ring-0 focus-visible:ring-0 focus-visible:ring-offset-0 text-[48px] leading-[1.2] h-[58px] p-0 text-white placeholder:text-brand-black-100 disabled:opacity-50 bg-transparent outline-none",
|
|
629
|
+
className
|
|
630
|
+
)
|
|
631
|
+
}
|
|
632
|
+
);
|
|
633
|
+
}
|
|
634
|
+
);
|
|
635
|
+
NumericInput.displayName = "NumericInput";
|
|
602
636
|
|
|
603
637
|
// src/components/form/swap-form.tsx
|
|
604
|
-
import { useState } from "react";
|
|
605
638
|
import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
606
639
|
function SwapForm({
|
|
607
640
|
sender,
|
|
@@ -615,10 +648,10 @@ function SwapForm({
|
|
|
615
648
|
estimatedTime = "",
|
|
616
649
|
isLoading = false,
|
|
617
650
|
className,
|
|
618
|
-
error = false
|
|
651
|
+
error = false,
|
|
652
|
+
decimalsLimit = 18
|
|
619
653
|
}) {
|
|
620
654
|
var _a;
|
|
621
|
-
const handleKeyDown = createKeyDownHandler();
|
|
622
655
|
const [focusedSection, setFocusedSection] = useState("sender");
|
|
623
656
|
const handleInvert = () => {
|
|
624
657
|
onInvert == null ? void 0 : onInvert();
|
|
@@ -668,23 +701,24 @@ function SwapForm({
|
|
|
668
701
|
] }),
|
|
669
702
|
/* @__PURE__ */ jsxs7("div", { className: "flex mt-3", children: [
|
|
670
703
|
/* @__PURE__ */ jsx10(
|
|
671
|
-
|
|
704
|
+
NumericInput,
|
|
672
705
|
{
|
|
673
|
-
min: 0,
|
|
674
|
-
type: "number",
|
|
675
706
|
placeholder: "0",
|
|
676
707
|
value: sender.amount,
|
|
677
|
-
|
|
708
|
+
onValueChange: (value) => {
|
|
678
709
|
var _a2;
|
|
679
|
-
|
|
710
|
+
const syntheticEvent = {
|
|
711
|
+
target: { value: value || "" }
|
|
712
|
+
};
|
|
713
|
+
(_a2 = sender.onAmountChange) == null ? void 0 : _a2.call(sender, value || "", syntheticEvent);
|
|
680
714
|
onPercentageChange == null ? void 0 : onPercentageChange(null);
|
|
681
715
|
},
|
|
682
|
-
onKeyDown: handleKeyDown,
|
|
683
716
|
onFocus: () => setFocusedSection("sender"),
|
|
684
717
|
onBlur: () => setFocusedSection(null),
|
|
685
718
|
disabled: isLoading,
|
|
686
719
|
"data-testid": "sender-amount-input",
|
|
687
|
-
|
|
720
|
+
decimalsLimit,
|
|
721
|
+
className: "!rounded-none"
|
|
688
722
|
}
|
|
689
723
|
),
|
|
690
724
|
/* @__PURE__ */ jsx10("div", { className: "w-[170px] pl-0 py-[13px]", children: /* @__PURE__ */ jsx10(
|
|
@@ -788,23 +822,24 @@ function SwapForm({
|
|
|
788
822
|
] }),
|
|
789
823
|
/* @__PURE__ */ jsxs7("div", { className: "flex mt-3", children: [
|
|
790
824
|
/* @__PURE__ */ jsx10(
|
|
791
|
-
|
|
825
|
+
NumericInput,
|
|
792
826
|
{
|
|
793
|
-
min: 0,
|
|
794
|
-
type: "number",
|
|
795
827
|
placeholder: "0",
|
|
796
828
|
value: receiver.amount,
|
|
797
|
-
|
|
829
|
+
onValueChange: (value) => {
|
|
798
830
|
var _a2;
|
|
799
|
-
|
|
831
|
+
const syntheticEvent = {
|
|
832
|
+
target: { value: value || "" }
|
|
833
|
+
};
|
|
834
|
+
(_a2 = receiver.onAmountChange) == null ? void 0 : _a2.call(receiver, value || "", syntheticEvent);
|
|
800
835
|
onPercentageChange == null ? void 0 : onPercentageChange(null);
|
|
801
836
|
},
|
|
802
|
-
onKeyDown: handleKeyDown,
|
|
803
837
|
onFocus: () => setFocusedSection("receiver"),
|
|
804
838
|
onBlur: () => setFocusedSection(null),
|
|
805
839
|
disabled: isLoading,
|
|
806
840
|
"data-testid": "receiver-amount-input",
|
|
807
|
-
|
|
841
|
+
decimalsLimit,
|
|
842
|
+
className: "!rounded-none"
|
|
808
843
|
}
|
|
809
844
|
),
|
|
810
845
|
/* @__PURE__ */ jsx10("div", { className: "w-[170px] pl-0 py-[13px]", children: /* @__PURE__ */ jsx10(
|
|
@@ -849,7 +884,7 @@ import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
|
849
884
|
|
|
850
885
|
// src/components/atoms/smooth-corners.tsx
|
|
851
886
|
import { Slot as Slot5 } from "@radix-ui/react-slot";
|
|
852
|
-
import
|
|
887
|
+
import React3 from "react";
|
|
853
888
|
import { cva as cva5 } from "class-variance-authority";
|
|
854
889
|
import { jsx as jsx11 } from "react/jsx-runtime";
|
|
855
890
|
var SmoothCornersSingleton = {
|
|
@@ -883,8 +918,8 @@ var smoothCornersVariants = cva5("superellipse", {
|
|
|
883
918
|
});
|
|
884
919
|
function SmoothCorners(props) {
|
|
885
920
|
const { size } = props;
|
|
886
|
-
const [isLoaded, setIsLoaded] =
|
|
887
|
-
|
|
921
|
+
const [isLoaded, setIsLoaded] = React3.useState(false);
|
|
922
|
+
React3.useEffect(() => {
|
|
888
923
|
SmoothCornersSingleton.init().then(() => setIsLoaded(true)).catch(() => {
|
|
889
924
|
console.error(
|
|
890
925
|
"SmoothCorners/SuperEllipsePainter: Error Loading Necessary Worklet"
|
|
@@ -1113,7 +1148,7 @@ function NetworkSwitcherButton(props) {
|
|
|
1113
1148
|
|
|
1114
1149
|
// src/components/network/network-selector.tsx
|
|
1115
1150
|
import { useMemo } from "react";
|
|
1116
|
-
import
|
|
1151
|
+
import React6 from "react";
|
|
1117
1152
|
|
|
1118
1153
|
// src/hooks/selector-hooks.ts
|
|
1119
1154
|
import { useState as useState2, useRef, useEffect } from "react";
|
|
@@ -1157,17 +1192,17 @@ var sortItems = (items, sortFn) => {
|
|
|
1157
1192
|
};
|
|
1158
1193
|
|
|
1159
1194
|
// src/components/molecules/empty-state.tsx
|
|
1160
|
-
import
|
|
1195
|
+
import React4 from "react";
|
|
1161
1196
|
import { Fragment, jsx as jsx15 } from "react/jsx-runtime";
|
|
1162
1197
|
var ContextDefault = {
|
|
1163
1198
|
isEmpty: true
|
|
1164
1199
|
};
|
|
1165
|
-
var EmptyStateCtx = isSSR() ? {} :
|
|
1200
|
+
var EmptyStateCtx = isSSR() ? {} : React4.createContext(ContextDefault);
|
|
1166
1201
|
function useContext() {
|
|
1167
|
-
const context =
|
|
1202
|
+
const context = React4.useContext(EmptyStateCtx);
|
|
1168
1203
|
return isSSR() ? ContextDefault : context;
|
|
1169
1204
|
}
|
|
1170
|
-
var EmptyStateContent =
|
|
1205
|
+
var EmptyStateContent = React4.forwardRef(function Content2(props, ref) {
|
|
1171
1206
|
const { isEmpty } = useContext();
|
|
1172
1207
|
if (!isEmpty) return null;
|
|
1173
1208
|
return /* @__PURE__ */ jsx15(
|
|
@@ -1178,7 +1213,7 @@ var EmptyStateContent = React3.forwardRef(function Content2(props, ref) {
|
|
|
1178
1213
|
})
|
|
1179
1214
|
);
|
|
1180
1215
|
});
|
|
1181
|
-
var EmptyStateTitle =
|
|
1216
|
+
var EmptyStateTitle = React4.forwardRef(function ESTitle(props, ref) {
|
|
1182
1217
|
return /* @__PURE__ */ jsx15(
|
|
1183
1218
|
"h6",
|
|
1184
1219
|
__spreadProps(__spreadValues({
|
|
@@ -1188,7 +1223,7 @@ var EmptyStateTitle = React3.forwardRef(function ESTitle(props, ref) {
|
|
|
1188
1223
|
})
|
|
1189
1224
|
);
|
|
1190
1225
|
});
|
|
1191
|
-
var EmptyStateDescription =
|
|
1226
|
+
var EmptyStateDescription = React4.forwardRef(function ESDescription(props, ref) {
|
|
1192
1227
|
return /* @__PURE__ */ jsx15(
|
|
1193
1228
|
"div",
|
|
1194
1229
|
__spreadProps(__spreadValues({
|
|
@@ -1484,12 +1519,12 @@ function DestkopModal(props) {
|
|
|
1484
1519
|
}
|
|
1485
1520
|
|
|
1486
1521
|
// src/components/molecules/scroll-aware-area.tsx
|
|
1487
|
-
import
|
|
1522
|
+
import React5 from "react";
|
|
1488
1523
|
import { jsx as jsx18 } from "react/jsx-runtime";
|
|
1489
1524
|
function ScrollAwareSeparator(props) {
|
|
1490
1525
|
const _a = props, { scrollRef } = _a, props_ = __objRest(_a, ["scrollRef"]);
|
|
1491
|
-
const [showHeaderBorder, setShowHeaderBorder] =
|
|
1492
|
-
|
|
1526
|
+
const [showHeaderBorder, setShowHeaderBorder] = React5.useState(false);
|
|
1527
|
+
React5.useEffect(() => {
|
|
1493
1528
|
let scrollableElement = scrollRef.current;
|
|
1494
1529
|
if (!scrollableElement) return;
|
|
1495
1530
|
const radixScrollArea = scrollableElement == null ? void 0 : scrollableElement.querySelector(
|
|
@@ -1535,7 +1570,7 @@ var NetworkSelector = ({
|
|
|
1535
1570
|
onClose
|
|
1536
1571
|
}) => {
|
|
1537
1572
|
const { searchQuery, setSearchQuery } = useSearch();
|
|
1538
|
-
const scrollableRef =
|
|
1573
|
+
const scrollableRef = React6.useRef(null);
|
|
1539
1574
|
const filteredAvailableNetworks = useMemo(() => {
|
|
1540
1575
|
return filterItems(availableNetworks, searchQuery, (network) => [
|
|
1541
1576
|
network.name
|
|
@@ -1614,11 +1649,11 @@ var NetworkSelector = ({
|
|
|
1614
1649
|
children: [
|
|
1615
1650
|
filteredAvailableNetworks.length > 0 && /* @__PURE__ */ jsxs11("div", { children: [
|
|
1616
1651
|
/* @__PURE__ */ jsx19("p", { className: "text-caption text-brand-black-100", children: "Available" }),
|
|
1617
|
-
/* @__PURE__ */ jsx19("div", { className: "mt-[6px] space-y-2", children: filteredAvailableNetworks.map((network) => /* @__PURE__ */ jsx19(
|
|
1652
|
+
/* @__PURE__ */ jsx19("div", { className: "mt-[6px] space-y-2", children: filteredAvailableNetworks.map((network) => /* @__PURE__ */ jsx19(React6.Fragment, { children: renderNetworkItem(network, true) }, network.name)) })
|
|
1618
1653
|
] }),
|
|
1619
1654
|
filteredUnavailableNetworks.length > 0 && /* @__PURE__ */ jsxs11("div", { children: [
|
|
1620
1655
|
/* @__PURE__ */ jsx19("p", { className: "text-caption text-brand-black-100", children: "Not available" }),
|
|
1621
|
-
/* @__PURE__ */ jsx19("div", { className: "mt-[6px] space-y-2", children: filteredUnavailableNetworks.map((network) => /* @__PURE__ */ jsx19(
|
|
1656
|
+
/* @__PURE__ */ jsx19("div", { className: "mt-[6px] space-y-2", children: filteredUnavailableNetworks.map((network) => /* @__PURE__ */ jsx19(React6.Fragment, { children: "renderNetworkItem(network, false)," }, network.name)) })
|
|
1622
1657
|
] }),
|
|
1623
1658
|
hasNoResults && /* @__PURE__ */ jsx19("div", { className: "text-center py-8 h-full flex items-center justify-center", children: /* @__PURE__ */ jsxs11("p", { className: "text-caption text-brand-black-100", children: [
|
|
1624
1659
|
"No results found for",
|
|
@@ -1650,7 +1685,7 @@ function NetworkSelectionItem(props) {
|
|
|
1650
1685
|
"isActive",
|
|
1651
1686
|
"SecondaryContent"
|
|
1652
1687
|
]);
|
|
1653
|
-
const buttonRef =
|
|
1688
|
+
const buttonRef = React6.useRef(null);
|
|
1654
1689
|
const is_default_mode = variant === "default";
|
|
1655
1690
|
const buttonContent = /* @__PURE__ */ jsxs11(
|
|
1656
1691
|
"div",
|
|
@@ -1706,7 +1741,7 @@ function NetworkSelectionItem(props) {
|
|
|
1706
1741
|
}
|
|
1707
1742
|
|
|
1708
1743
|
// src/components/tokens/token-selector.tsx
|
|
1709
|
-
import
|
|
1744
|
+
import React7 from "react";
|
|
1710
1745
|
|
|
1711
1746
|
// src/@/ui/scroll-area.tsx
|
|
1712
1747
|
import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
|
|
@@ -1936,7 +1971,7 @@ function TokenSelectionItem(props) {
|
|
|
1936
1971
|
"isActive",
|
|
1937
1972
|
"AddWalletButton"
|
|
1938
1973
|
]);
|
|
1939
|
-
const buttonRef =
|
|
1974
|
+
const buttonRef = React7.useRef(null);
|
|
1940
1975
|
const buttonContent = /* @__PURE__ */ jsxs13(
|
|
1941
1976
|
"div",
|
|
1942
1977
|
{
|
|
@@ -1992,49 +2027,7 @@ function TokenSelectionItem(props) {
|
|
|
1992
2027
|
|
|
1993
2028
|
// src/components/form/bridge-input.tsx
|
|
1994
2029
|
import React8 from "react";
|
|
1995
|
-
|
|
1996
|
-
// src/components/input/input.tsx
|
|
1997
|
-
import * as React7 from "react";
|
|
1998
2030
|
import { jsx as jsx22, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1999
|
-
var Input2 = React7.forwardRef((_a, ref) => {
|
|
2000
|
-
var _b = _a, { className, label, error, helperText, id } = _b, props = __objRest(_b, ["className", "label", "error", "helperText", "id"]);
|
|
2001
|
-
const inputId = id || React7.useId();
|
|
2002
|
-
return /* @__PURE__ */ jsxs14("div", { className: "space-y-2", children: [
|
|
2003
|
-
label && /* @__PURE__ */ jsx22(
|
|
2004
|
-
"label",
|
|
2005
|
-
{
|
|
2006
|
-
htmlFor: inputId,
|
|
2007
|
-
className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
2008
|
-
children: label
|
|
2009
|
-
}
|
|
2010
|
-
),
|
|
2011
|
-
/* @__PURE__ */ jsx22(
|
|
2012
|
-
Input,
|
|
2013
|
-
__spreadValues({
|
|
2014
|
-
ref,
|
|
2015
|
-
id: inputId,
|
|
2016
|
-
className: cn(
|
|
2017
|
-
error && "border-destructive focus-visible:border-destructive",
|
|
2018
|
-
className
|
|
2019
|
-
)
|
|
2020
|
-
}, props)
|
|
2021
|
-
),
|
|
2022
|
-
(error || helperText) && /* @__PURE__ */ jsx22(
|
|
2023
|
-
"p",
|
|
2024
|
-
{
|
|
2025
|
-
className: cn(
|
|
2026
|
-
"text-sm",
|
|
2027
|
-
error ? "text-destructive" : "text-muted-foreground"
|
|
2028
|
-
),
|
|
2029
|
-
children: error || helperText
|
|
2030
|
-
}
|
|
2031
|
-
)
|
|
2032
|
-
] });
|
|
2033
|
-
});
|
|
2034
|
-
Input2.displayName = "Input";
|
|
2035
|
-
|
|
2036
|
-
// src/components/form/bridge-input.tsx
|
|
2037
|
-
import { jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2038
2031
|
function BridgeInput(props) {
|
|
2039
2032
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
2040
2033
|
const {
|
|
@@ -2046,15 +2039,15 @@ function BridgeInput(props) {
|
|
|
2046
2039
|
},
|
|
2047
2040
|
presentation = "default",
|
|
2048
2041
|
mode = "ready",
|
|
2049
|
-
hasError: error
|
|
2042
|
+
hasError: error,
|
|
2043
|
+
decimalsLimit = 18
|
|
2050
2044
|
} = props;
|
|
2051
2045
|
const isConnected = mode === "ready";
|
|
2052
2046
|
const isLoading = presentation === "loading";
|
|
2053
|
-
const handleKeyDown = createKeyDownHandler();
|
|
2054
2047
|
const formatPercentageLabel = (percentage2) => {
|
|
2055
2048
|
return percentage2 === 100 ? "Max" : `${percentage2}%`;
|
|
2056
2049
|
};
|
|
2057
|
-
return /* @__PURE__ */
|
|
2050
|
+
return /* @__PURE__ */ jsxs14(
|
|
2058
2051
|
"div",
|
|
2059
2052
|
{
|
|
2060
2053
|
className: cn(
|
|
@@ -2062,7 +2055,7 @@ function BridgeInput(props) {
|
|
|
2062
2055
|
isConnected && "border-dashed-wide"
|
|
2063
2056
|
),
|
|
2064
2057
|
children: [
|
|
2065
|
-
/* @__PURE__ */
|
|
2058
|
+
/* @__PURE__ */ jsx22(
|
|
2066
2059
|
"section",
|
|
2067
2060
|
{
|
|
2068
2061
|
"data-testid": "send-section",
|
|
@@ -2071,23 +2064,23 @@ function BridgeInput(props) {
|
|
|
2071
2064
|
isConnected && "bg-brand-black-200",
|
|
2072
2065
|
error ? "bg-brand-danger-500" : "bridge-form-border"
|
|
2073
2066
|
),
|
|
2074
|
-
children: /* @__PURE__ */
|
|
2075
|
-
/* @__PURE__ */
|
|
2076
|
-
/* @__PURE__ */
|
|
2077
|
-
/* @__PURE__ */
|
|
2078
|
-
/* @__PURE__ */
|
|
2067
|
+
children: /* @__PURE__ */ jsxs14("div", { className: "bg-brand-black-500 rounded-[14.5px] h-full relative px-3", children: [
|
|
2068
|
+
/* @__PURE__ */ jsxs14("div", { className: "w-full flex justify-between h-10 items-center", children: [
|
|
2069
|
+
/* @__PURE__ */ jsx22("div", { className: "w-1/2", children: /* @__PURE__ */ jsx22("p", { className: "text-caption text-brand-black-100 font-medium", children: "Send" }) }),
|
|
2070
|
+
/* @__PURE__ */ jsx22("div", { className: "w-1/2", children: /* @__PURE__ */ jsxs14("div", { className: "text-caption text-brand-black-100 font-medium text-right flex items-center gap-1 justify-end", children: [
|
|
2071
|
+
/* @__PURE__ */ jsx22("span", { className: "max-w-[100px] truncate", children: sender.address ? sender.address : "Balance" }),
|
|
2079
2072
|
" ",
|
|
2080
|
-
/* @__PURE__ */
|
|
2073
|
+
/* @__PURE__ */ jsx22(
|
|
2081
2074
|
"span",
|
|
2082
2075
|
{
|
|
2083
2076
|
className: cn(
|
|
2084
2077
|
"max-w-[100px] truncate",
|
|
2085
2078
|
props.hasError ? "text-brand-danger-500" : "text-white"
|
|
2086
2079
|
),
|
|
2087
|
-
children: /* @__PURE__ */
|
|
2080
|
+
children: /* @__PURE__ */ jsx22(
|
|
2088
2081
|
React8.Suspense,
|
|
2089
2082
|
{
|
|
2090
|
-
fallback: /* @__PURE__ */
|
|
2083
|
+
fallback: /* @__PURE__ */ jsx22(
|
|
2091
2084
|
"div",
|
|
2092
2085
|
{
|
|
2093
2086
|
className: cn(
|
|
@@ -2103,36 +2096,37 @@ function BridgeInput(props) {
|
|
|
2103
2096
|
)
|
|
2104
2097
|
] }) })
|
|
2105
2098
|
] }),
|
|
2106
|
-
/* @__PURE__ */
|
|
2107
|
-
/* @__PURE__ */
|
|
2108
|
-
|
|
2099
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex h-[70px] items-center", children: [
|
|
2100
|
+
/* @__PURE__ */ jsx22(
|
|
2101
|
+
NumericInput,
|
|
2109
2102
|
{
|
|
2110
|
-
min: 0,
|
|
2111
|
-
type: "number",
|
|
2112
2103
|
placeholder: "0",
|
|
2113
2104
|
value: sender.amount,
|
|
2114
2105
|
disabled: isLoading,
|
|
2115
|
-
onKeyDown: handleKeyDown,
|
|
2116
2106
|
"data-testid": "sender-amount-input",
|
|
2117
|
-
|
|
2118
|
-
|
|
2107
|
+
decimalsLimit,
|
|
2108
|
+
className: "!rounded-none",
|
|
2109
|
+
onValueChange: (value) => {
|
|
2119
2110
|
var _a2;
|
|
2120
|
-
|
|
2111
|
+
const syntheticEvent = {
|
|
2112
|
+
target: { value: value || "" }
|
|
2113
|
+
};
|
|
2114
|
+
(_a2 = props.onValueChange) == null ? void 0 : _a2.call(props, value || "", syntheticEvent);
|
|
2121
2115
|
}
|
|
2122
2116
|
}
|
|
2123
2117
|
),
|
|
2124
|
-
/* @__PURE__ */
|
|
2118
|
+
/* @__PURE__ */ jsx22("div", { className: "w-[170px] pl-3 py-[13px] flex justify-end", children: props.TokenChangeButton })
|
|
2125
2119
|
] }),
|
|
2126
|
-
/* @__PURE__ */
|
|
2127
|
-
/* @__PURE__ */
|
|
2120
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex justify-between h-10", children: [
|
|
2121
|
+
/* @__PURE__ */ jsx22(
|
|
2128
2122
|
"div",
|
|
2129
2123
|
{
|
|
2130
2124
|
"data-testid": "sender-usd-value",
|
|
2131
2125
|
className: "flex items-center text-caption text-brand-black-100 font-medium min-h-6 hover:text-white duration-200 transition-colors",
|
|
2132
|
-
children: isLoading ? /* @__PURE__ */
|
|
2126
|
+
children: isLoading ? /* @__PURE__ */ jsx22("div", { className: "w-8 h-3 bg-brand-black-200 animate-pulse rounded ml-1" }) : sender.secondaryAmount
|
|
2133
2127
|
}
|
|
2134
2128
|
),
|
|
2135
|
-
isConnected && /* @__PURE__ */
|
|
2129
|
+
isConnected && /* @__PURE__ */ jsx22("div", { className: "flex gap-[6px] pt-1", children: percentage.options.map((percent_value) => /* @__PURE__ */ jsx22(
|
|
2136
2130
|
Button2,
|
|
2137
2131
|
{
|
|
2138
2132
|
type: "button",
|
|
@@ -2152,17 +2146,17 @@ function BridgeInput(props) {
|
|
|
2152
2146
|
] })
|
|
2153
2147
|
}
|
|
2154
2148
|
),
|
|
2155
|
-
/* @__PURE__ */
|
|
2149
|
+
/* @__PURE__ */ jsx22(
|
|
2156
2150
|
"section",
|
|
2157
2151
|
{
|
|
2158
2152
|
className: cn(
|
|
2159
2153
|
"grid transition-all duration-200 ease-out",
|
|
2160
2154
|
isConnected ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
|
|
2161
2155
|
),
|
|
2162
|
-
children: /* @__PURE__ */
|
|
2163
|
-
/* @__PURE__ */
|
|
2164
|
-
/* @__PURE__ */
|
|
2165
|
-
!props.EditDestAddressTrigger ? /* @__PURE__ */
|
|
2156
|
+
children: /* @__PURE__ */ jsx22("div", { className: "overflow-hidden min-h-0", children: /* @__PURE__ */ jsxs14("div", { className: "p-3", children: [
|
|
2157
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex justify-between", children: [
|
|
2158
|
+
/* @__PURE__ */ jsx22("p", { className: "text-caption text-brand-black-100 font-medium w-1/2", children: "Receive" }),
|
|
2159
|
+
!props.EditDestAddressTrigger ? /* @__PURE__ */ jsx22("span", { className: "text-caption text-brand-black-100 font-medium text-right flex items-center justify-end w-1/2", children: /* @__PURE__ */ jsx22("span", { className: "max-w-[100px] truncate", children: receiver.address }) }) : /* @__PURE__ */ jsx22(props.EditDestAddressTrigger, { asChild: true, children: /* @__PURE__ */ jsxs14(
|
|
2166
2160
|
"button",
|
|
2167
2161
|
{
|
|
2168
2162
|
type: "button",
|
|
@@ -2170,29 +2164,29 @@ function BridgeInput(props) {
|
|
|
2170
2164
|
"aria-label": "Edit receiver address",
|
|
2171
2165
|
className: "cursor-pointer flex !gap-1.5 !text-caption text-brand-black-100 font-medium text-right items-center justify-end w-1/2",
|
|
2172
2166
|
children: [
|
|
2173
|
-
/* @__PURE__ */
|
|
2174
|
-
/* @__PURE__ */
|
|
2167
|
+
/* @__PURE__ */ jsx22("span", { className: "max-w-[100px] truncate", children: receiver.address }),
|
|
2168
|
+
/* @__PURE__ */ jsx22(
|
|
2175
2169
|
"span",
|
|
2176
2170
|
{
|
|
2177
2171
|
"aria-label": "Edit address",
|
|
2178
2172
|
className: "cursor-pointer text-foreground hover:scale-110 transition-transform disabled:opacity-50",
|
|
2179
|
-
children: /* @__PURE__ */
|
|
2173
|
+
children: /* @__PURE__ */ jsx22(Pen_default, { className: "size-[0.875rem]" })
|
|
2180
2174
|
}
|
|
2181
2175
|
)
|
|
2182
2176
|
]
|
|
2183
2177
|
}
|
|
2184
2178
|
) })
|
|
2185
2179
|
] }),
|
|
2186
|
-
/* @__PURE__ */
|
|
2180
|
+
/* @__PURE__ */ jsx22(
|
|
2187
2181
|
"div",
|
|
2188
2182
|
{
|
|
2189
2183
|
className: cn(
|
|
2190
2184
|
"grid transition-all duration-200 ease-out",
|
|
2191
2185
|
sender.amount ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
|
|
2192
2186
|
),
|
|
2193
|
-
children: /* @__PURE__ */
|
|
2194
|
-
/* @__PURE__ */
|
|
2195
|
-
/* @__PURE__ */
|
|
2187
|
+
children: /* @__PURE__ */ jsxs14("div", { className: "overflow-hidden min-h-0", children: [
|
|
2188
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex items-center gap-2 py-2", children: [
|
|
2189
|
+
/* @__PURE__ */ jsx22(
|
|
2196
2190
|
BadgeIcon,
|
|
2197
2191
|
{
|
|
2198
2192
|
src: (_b = (_a = sender.token) == null ? void 0 : _a.image) != null ? _b : "",
|
|
@@ -2201,18 +2195,18 @@ function BridgeInput(props) {
|
|
|
2201
2195
|
badgeSrc: (_h = (_g = receiver.network) == null ? void 0 : _g.image) != null ? _h : ""
|
|
2202
2196
|
}
|
|
2203
2197
|
),
|
|
2204
|
-
/* @__PURE__ */
|
|
2198
|
+
/* @__PURE__ */ jsx22("span", { className: "text-[20px] leading-[1] font-medium text-brand-black-100", children: isLoading ? /* @__PURE__ */ jsx22("div", { className: "w-16 h-5 bg-brand-black-200 animate-pulse rounded" }) : `${receiver.amount} ${((_i = sender.token) == null ? void 0 : _i.symbol) || ""}` })
|
|
2205
2199
|
] }),
|
|
2206
|
-
/* @__PURE__ */
|
|
2207
|
-
/* @__PURE__ */
|
|
2200
|
+
/* @__PURE__ */ jsxs14("div", { className: "flex justify-between pt-1", children: [
|
|
2201
|
+
/* @__PURE__ */ jsx22(
|
|
2208
2202
|
"div",
|
|
2209
2203
|
{
|
|
2210
2204
|
"data-testid": "receiver-usd-value",
|
|
2211
2205
|
className: "flex items-center text-caption text-brand-black-100 font-medium",
|
|
2212
|
-
children: isLoading ? /* @__PURE__ */
|
|
2206
|
+
children: isLoading ? /* @__PURE__ */ jsx22("div", { className: "w-8 h-3 bg-brand-black-200 animate-pulse rounded ml-1" }) : receiver.secondaryAmount
|
|
2213
2207
|
}
|
|
2214
2208
|
),
|
|
2215
|
-
isConnected && /* @__PURE__ */
|
|
2209
|
+
isConnected && /* @__PURE__ */ jsx22("div", { className: "text-brand-black-100 text-caption font-medium", children: isLoading ? /* @__PURE__ */ jsx22("div", { className: "w-12 h-3 bg-brand-black-200 animate-pulse rounded" }) : receiver.estimatedTime })
|
|
2216
2210
|
] })
|
|
2217
2211
|
] })
|
|
2218
2212
|
}
|
|
@@ -2226,7 +2220,7 @@ function BridgeInput(props) {
|
|
|
2226
2220
|
}
|
|
2227
2221
|
|
|
2228
2222
|
// src/components/form/bridge-form.tsx
|
|
2229
|
-
import { Fragment as Fragment4, jsx as
|
|
2223
|
+
import { Fragment as Fragment4, jsx as jsx23, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2230
2224
|
function BridgeForm({
|
|
2231
2225
|
networks,
|
|
2232
2226
|
onNetworkInvert,
|
|
@@ -2271,7 +2265,8 @@ function BridgeForm({
|
|
|
2271
2265
|
availableNetworks = [],
|
|
2272
2266
|
unavailableNetworks = [],
|
|
2273
2267
|
onSourceNetworkSelect,
|
|
2274
|
-
onDestinationNetworkSelect
|
|
2268
|
+
onDestinationNetworkSelect,
|
|
2269
|
+
decimalsLimit = 18
|
|
2275
2270
|
}) {
|
|
2276
2271
|
const [showDetails, setShowDetails] = useState5(false);
|
|
2277
2272
|
const [isGasHovered, setIsGasHovered] = useState5(false);
|
|
@@ -2364,9 +2359,9 @@ function BridgeForm({
|
|
|
2364
2359
|
return "Select Network";
|
|
2365
2360
|
}
|
|
2366
2361
|
};
|
|
2367
|
-
return /* @__PURE__ */
|
|
2368
|
-
/* @__PURE__ */
|
|
2369
|
-
/* @__PURE__ */
|
|
2362
|
+
return /* @__PURE__ */ jsxs15("div", { className: "relative", children: [
|
|
2363
|
+
/* @__PURE__ */ jsxs15("form", { onSubmit: handleSubmit, children: [
|
|
2364
|
+
/* @__PURE__ */ jsx23(
|
|
2370
2365
|
NetworkSwitcher,
|
|
2371
2366
|
{
|
|
2372
2367
|
from: networks.from,
|
|
@@ -2376,16 +2371,17 @@ function BridgeForm({
|
|
|
2376
2371
|
onDestinationClick: handleDestinationNetworkClick
|
|
2377
2372
|
}
|
|
2378
2373
|
),
|
|
2379
|
-
/* @__PURE__ */
|
|
2374
|
+
/* @__PURE__ */ jsx23("div", { className: "mt-4", children: /* @__PURE__ */ jsx23(
|
|
2380
2375
|
BridgeInput,
|
|
2381
2376
|
{
|
|
2382
2377
|
hasError: Boolean(error),
|
|
2383
2378
|
mode: isConnected ? "ready" : "idle",
|
|
2384
2379
|
presentation: isLoading ? "loading" : "default",
|
|
2380
|
+
decimalsLimit,
|
|
2385
2381
|
sender: {
|
|
2386
2382
|
token: senderToken,
|
|
2387
2383
|
amount: senderAmount,
|
|
2388
|
-
balance: /* @__PURE__ */
|
|
2384
|
+
balance: /* @__PURE__ */ jsx23(Fragment4, { children: senderBalance }),
|
|
2389
2385
|
secondaryAmount: senderUsdValue,
|
|
2390
2386
|
address: senderAddress || ""
|
|
2391
2387
|
},
|
|
@@ -2415,7 +2411,7 @@ function BridgeForm({
|
|
|
2415
2411
|
onPercentageClick == null ? void 0 : onPercentageClick(percent_value);
|
|
2416
2412
|
},
|
|
2417
2413
|
EditDestAddressTrigger: (props) => {
|
|
2418
|
-
return /* @__PURE__ */
|
|
2414
|
+
return /* @__PURE__ */ jsx23(
|
|
2419
2415
|
Button2,
|
|
2420
2416
|
__spreadProps(__spreadValues({}, props), {
|
|
2421
2417
|
variant: "unset",
|
|
@@ -2426,7 +2422,7 @@ function BridgeForm({
|
|
|
2426
2422
|
})
|
|
2427
2423
|
);
|
|
2428
2424
|
},
|
|
2429
|
-
TokenChangeButton: /* @__PURE__ */
|
|
2425
|
+
TokenChangeButton: /* @__PURE__ */ jsx23(TokenSelectorDialog, { children: /* @__PURE__ */ jsx23(
|
|
2430
2426
|
TagButton,
|
|
2431
2427
|
{
|
|
2432
2428
|
className: "cursor-pointer !transition-none",
|
|
@@ -2438,21 +2434,21 @@ function BridgeForm({
|
|
|
2438
2434
|
) })
|
|
2439
2435
|
}
|
|
2440
2436
|
) }),
|
|
2441
|
-
/* @__PURE__ */
|
|
2437
|
+
/* @__PURE__ */ jsx23(
|
|
2442
2438
|
"div",
|
|
2443
2439
|
{
|
|
2444
2440
|
className: cn(
|
|
2445
2441
|
"grid transition-all duration-200 ease-out mt-4",
|
|
2446
2442
|
senderAmount && Number.parseFloat(senderAmount) > 0 ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
|
|
2447
2443
|
),
|
|
2448
|
-
children: /* @__PURE__ */
|
|
2449
|
-
!showDetails ? /* @__PURE__ */
|
|
2450
|
-
/* @__PURE__ */
|
|
2451
|
-
/* @__PURE__ */
|
|
2452
|
-
/* @__PURE__ */
|
|
2453
|
-
/* @__PURE__ */
|
|
2444
|
+
children: /* @__PURE__ */ jsxs15("div", { className: "overflow-hidden min-h-0", children: [
|
|
2445
|
+
!showDetails ? /* @__PURE__ */ jsxs15("div", { className: "flex justify-between items-center text-brand-black-100", children: [
|
|
2446
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-3", children: [
|
|
2447
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex items-center gap-1", children: [
|
|
2448
|
+
/* @__PURE__ */ jsx23(Server_default, { className: "size-[14px] mt-[0.5px]" }),
|
|
2449
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium", children: bridgeDetails.bridgeFee })
|
|
2454
2450
|
] }),
|
|
2455
|
-
/* @__PURE__ */
|
|
2451
|
+
/* @__PURE__ */ jsx23(
|
|
2456
2452
|
"button",
|
|
2457
2453
|
{
|
|
2458
2454
|
type: "button",
|
|
@@ -2460,88 +2456,88 @@ function BridgeForm({
|
|
|
2460
2456
|
onClick: onAdjustRelayerFee,
|
|
2461
2457
|
onMouseEnter: () => setIsGasHovered(true),
|
|
2462
2458
|
onMouseLeave: () => setIsGasHovered(false),
|
|
2463
|
-
children: !isGasHovered ? /* @__PURE__ */
|
|
2464
|
-
/* @__PURE__ */
|
|
2465
|
-
/* @__PURE__ */
|
|
2466
|
-
] }) : /* @__PURE__ */
|
|
2467
|
-
/* @__PURE__ */
|
|
2468
|
-
/* @__PURE__ */
|
|
2459
|
+
children: !isGasHovered ? /* @__PURE__ */ jsxs15(Fragment4, { children: [
|
|
2460
|
+
/* @__PURE__ */ jsx23(Gas_default, { className: "size-[14px] mt-[0.5px]" }),
|
|
2461
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium", children: bridgeDetails.gasFee })
|
|
2462
|
+
] }) : /* @__PURE__ */ jsxs15(Fragment4, { children: [
|
|
2463
|
+
/* @__PURE__ */ jsx23(Gas_default, { className: "size-[14px] mt-[0.5px] text-white" }),
|
|
2464
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium text-white", children: "Adjust relayer fee" })
|
|
2469
2465
|
] })
|
|
2470
2466
|
}
|
|
2471
2467
|
)
|
|
2472
2468
|
] }),
|
|
2473
|
-
/* @__PURE__ */
|
|
2469
|
+
/* @__PURE__ */ jsxs15(
|
|
2474
2470
|
"button",
|
|
2475
2471
|
{
|
|
2476
2472
|
type: "button",
|
|
2477
2473
|
onClick: () => setShowDetails(!showDetails),
|
|
2478
2474
|
className: "flex items-center gap-[2px] cursor-pointer hover:text-white duration-200 transition-colors",
|
|
2479
2475
|
children: [
|
|
2480
|
-
/* @__PURE__ */
|
|
2481
|
-
/* @__PURE__ */
|
|
2476
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium", children: "Details" }),
|
|
2477
|
+
/* @__PURE__ */ jsx23(ChevronBottomDown_default, { className: "rotate-180 size-[14px]" })
|
|
2482
2478
|
]
|
|
2483
2479
|
}
|
|
2484
2480
|
)
|
|
2485
|
-
] }) : /* @__PURE__ */
|
|
2486
|
-
/* @__PURE__ */
|
|
2487
|
-
/* @__PURE__ */
|
|
2481
|
+
] }) : /* @__PURE__ */ jsxs15("div", { className: "flex justify-between items-center text-brand-black-100", children: [
|
|
2482
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium opacity-50", children: "Bridge summary" }),
|
|
2483
|
+
/* @__PURE__ */ jsxs15(
|
|
2488
2484
|
"button",
|
|
2489
2485
|
{
|
|
2490
2486
|
type: "button",
|
|
2491
2487
|
onClick: () => setShowDetails(!showDetails),
|
|
2492
2488
|
className: "flex items-center gap-[2px] cursor-pointer hover:text-white duration-200 transition-colors",
|
|
2493
2489
|
children: [
|
|
2494
|
-
/* @__PURE__ */
|
|
2495
|
-
/* @__PURE__ */
|
|
2490
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium", children: "Hide" }),
|
|
2491
|
+
/* @__PURE__ */ jsx23(ChevronBottomDown_default, { className: "size-[14px]" })
|
|
2496
2492
|
]
|
|
2497
2493
|
}
|
|
2498
2494
|
)
|
|
2499
2495
|
] }),
|
|
2500
|
-
/* @__PURE__ */
|
|
2496
|
+
/* @__PURE__ */ jsx23(
|
|
2501
2497
|
"div",
|
|
2502
2498
|
{
|
|
2503
2499
|
className: cn(
|
|
2504
2500
|
"grid transition-all duration-200 ease-out",
|
|
2505
2501
|
showDetails ? "grid-rows-[1fr]" : "grid-rows-[0fr]"
|
|
2506
2502
|
),
|
|
2507
|
-
children: /* @__PURE__ */
|
|
2508
|
-
/* @__PURE__ */
|
|
2509
|
-
/* @__PURE__ */
|
|
2510
|
-
/* @__PURE__ */
|
|
2503
|
+
children: /* @__PURE__ */ jsx23("div", { className: "overflow-hidden min-h-0", children: /* @__PURE__ */ jsxs15("div", { className: "pt-4 space-y-3", children: [
|
|
2504
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex justify-between items-center text-brand-black-100", children: [
|
|
2505
|
+
/* @__PURE__ */ jsxs15("span", { className: "text-caption font-medium flex items-center gap-1", children: [
|
|
2506
|
+
/* @__PURE__ */ jsx23(Percent_default, { className: "size-[14px]" }),
|
|
2511
2507
|
"Bridge fee"
|
|
2512
2508
|
] }),
|
|
2513
|
-
/* @__PURE__ */
|
|
2509
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium text-white", children: bridgeDetails.bridgeFee })
|
|
2514
2510
|
] }),
|
|
2515
|
-
/* @__PURE__ */
|
|
2516
|
-
/* @__PURE__ */
|
|
2517
|
-
/* @__PURE__ */
|
|
2511
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex justify-between items-center text-brand-black-100", children: [
|
|
2512
|
+
/* @__PURE__ */ jsxs15("span", { className: "text-caption font-medium flex items-center gap-1", children: [
|
|
2513
|
+
/* @__PURE__ */ jsx23(Gas_default, { className: "size-[14px]" }),
|
|
2518
2514
|
"Gas costs"
|
|
2519
2515
|
] }),
|
|
2520
|
-
/* @__PURE__ */
|
|
2516
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium text-white", children: bridgeDetails.gasFee })
|
|
2521
2517
|
] }),
|
|
2522
|
-
/* @__PURE__ */
|
|
2523
|
-
/* @__PURE__ */
|
|
2524
|
-
/* @__PURE__ */
|
|
2518
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex justify-between items-center text-brand-black-100", children: [
|
|
2519
|
+
/* @__PURE__ */ jsxs15("span", { className: "text-caption font-medium flex items-center gap-1", children: [
|
|
2520
|
+
/* @__PURE__ */ jsx23(ArrowBottomTop_default, { className: "size-[14px]" }),
|
|
2525
2521
|
"Slippage tolerance"
|
|
2526
2522
|
] }),
|
|
2527
|
-
/* @__PURE__ */
|
|
2523
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium text-white", children: bridgeDetails.slippageTolerance })
|
|
2528
2524
|
] }),
|
|
2529
|
-
/* @__PURE__ */
|
|
2530
|
-
/* @__PURE__ */
|
|
2531
|
-
/* @__PURE__ */
|
|
2525
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex justify-between items-center text-brand-black-100", children: [
|
|
2526
|
+
/* @__PURE__ */ jsxs15("span", { className: "text-caption font-medium flex items-center gap-1", children: [
|
|
2527
|
+
/* @__PURE__ */ jsx23(ArrowSplit_default, { className: "size-[14px]" }),
|
|
2532
2528
|
"Route"
|
|
2533
2529
|
] }),
|
|
2534
|
-
/* @__PURE__ */
|
|
2530
|
+
/* @__PURE__ */ jsxs15("span", { className: "text-caption font-medium text-white", children: [
|
|
2535
2531
|
bridgeDetails.routes,
|
|
2536
2532
|
" stops"
|
|
2537
2533
|
] })
|
|
2538
2534
|
] }),
|
|
2539
|
-
/* @__PURE__ */
|
|
2540
|
-
/* @__PURE__ */
|
|
2541
|
-
/* @__PURE__ */
|
|
2535
|
+
/* @__PURE__ */ jsxs15("div", { className: "flex justify-between items-center text-brand-black-100", children: [
|
|
2536
|
+
/* @__PURE__ */ jsxs15("span", { className: "text-caption font-medium flex items-center gap-1", children: [
|
|
2537
|
+
/* @__PURE__ */ jsx23(Clock_default, { className: "size-[14px]" }),
|
|
2542
2538
|
"Estimated time"
|
|
2543
2539
|
] }),
|
|
2544
|
-
/* @__PURE__ */
|
|
2540
|
+
/* @__PURE__ */ jsx23("span", { className: "text-caption font-medium text-white", children: bridgeDetails.estimatedTime })
|
|
2545
2541
|
] })
|
|
2546
2542
|
] }) })
|
|
2547
2543
|
}
|
|
@@ -2549,7 +2545,7 @@ function BridgeForm({
|
|
|
2549
2545
|
] })
|
|
2550
2546
|
}
|
|
2551
2547
|
),
|
|
2552
|
-
/* @__PURE__ */
|
|
2548
|
+
/* @__PURE__ */ jsx23("div", { className: "mt-4", children: /* @__PURE__ */ jsx23(
|
|
2553
2549
|
Button2,
|
|
2554
2550
|
{
|
|
2555
2551
|
type: buttonState.onClick ? "submit" : "button",
|
|
@@ -2562,7 +2558,7 @@ function BridgeForm({
|
|
|
2562
2558
|
}
|
|
2563
2559
|
) })
|
|
2564
2560
|
] }),
|
|
2565
|
-
/* @__PURE__ */
|
|
2561
|
+
/* @__PURE__ */ jsx23(
|
|
2566
2562
|
NetworkSelector,
|
|
2567
2563
|
{
|
|
2568
2564
|
isOpen: !!networkSelectorState,
|
|
@@ -2594,9 +2590,9 @@ function TokenSelectorDialog(props) {
|
|
|
2594
2590
|
onTokenSelect == null ? void 0 : onTokenSelect(token);
|
|
2595
2591
|
setIsTokenSelectorOpen(false);
|
|
2596
2592
|
};
|
|
2597
|
-
return /* @__PURE__ */
|
|
2598
|
-
/* @__PURE__ */
|
|
2599
|
-
/* @__PURE__ */
|
|
2593
|
+
return /* @__PURE__ */ jsxs15(Dialog, { children: [
|
|
2594
|
+
/* @__PURE__ */ jsx23(DialogTrigger, { asChild: true, children }),
|
|
2595
|
+
/* @__PURE__ */ jsx23(
|
|
2600
2596
|
TokenSelector,
|
|
2601
2597
|
{
|
|
2602
2598
|
isOpen: isTokenSelectorOpen,
|
|
@@ -2612,19 +2608,80 @@ function TokenSelectorDialog(props) {
|
|
|
2612
2608
|
] });
|
|
2613
2609
|
}
|
|
2614
2610
|
|
|
2611
|
+
// src/components/input/input.tsx
|
|
2612
|
+
import * as React9 from "react";
|
|
2613
|
+
|
|
2614
|
+
// src/@/ui/input.tsx
|
|
2615
|
+
import { jsx as jsx24 } from "react/jsx-runtime";
|
|
2616
|
+
function Input(_a) {
|
|
2617
|
+
var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
|
|
2618
|
+
return /* @__PURE__ */ jsx24(
|
|
2619
|
+
"input",
|
|
2620
|
+
__spreadValues({
|
|
2621
|
+
type,
|
|
2622
|
+
"data-slot": "input",
|
|
2623
|
+
className: cn(
|
|
2624
|
+
"file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
|
|
2625
|
+
"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
|
|
2626
|
+
"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
|
|
2627
|
+
className
|
|
2628
|
+
)
|
|
2629
|
+
}, props)
|
|
2630
|
+
);
|
|
2631
|
+
}
|
|
2632
|
+
|
|
2633
|
+
// src/components/input/input.tsx
|
|
2634
|
+
import { jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2635
|
+
var Input2 = React9.forwardRef((_a, ref) => {
|
|
2636
|
+
var _b = _a, { className, label, error, helperText, id } = _b, props = __objRest(_b, ["className", "label", "error", "helperText", "id"]);
|
|
2637
|
+
const inputId = id || React9.useId();
|
|
2638
|
+
return /* @__PURE__ */ jsxs16("div", { className: "space-y-2", children: [
|
|
2639
|
+
label && /* @__PURE__ */ jsx25(
|
|
2640
|
+
"label",
|
|
2641
|
+
{
|
|
2642
|
+
htmlFor: inputId,
|
|
2643
|
+
className: "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
|
2644
|
+
children: label
|
|
2645
|
+
}
|
|
2646
|
+
),
|
|
2647
|
+
/* @__PURE__ */ jsx25(
|
|
2648
|
+
Input,
|
|
2649
|
+
__spreadValues({
|
|
2650
|
+
ref,
|
|
2651
|
+
id: inputId,
|
|
2652
|
+
className: cn(
|
|
2653
|
+
error && "border-destructive focus-visible:border-destructive",
|
|
2654
|
+
className
|
|
2655
|
+
)
|
|
2656
|
+
}, props)
|
|
2657
|
+
),
|
|
2658
|
+
(error || helperText) && /* @__PURE__ */ jsx25(
|
|
2659
|
+
"p",
|
|
2660
|
+
{
|
|
2661
|
+
className: cn(
|
|
2662
|
+
"text-sm",
|
|
2663
|
+
error ? "text-destructive" : "text-muted-foreground"
|
|
2664
|
+
),
|
|
2665
|
+
children: error || helperText
|
|
2666
|
+
}
|
|
2667
|
+
)
|
|
2668
|
+
] });
|
|
2669
|
+
});
|
|
2670
|
+
Input2.displayName = "Input";
|
|
2671
|
+
|
|
2615
2672
|
// src/components/molecules/address-input.tsx
|
|
2616
|
-
import { useId as useId2, forwardRef as
|
|
2673
|
+
import { useId as useId2, forwardRef as forwardRef3 } from "react";
|
|
2617
2674
|
import { motion as motion2 } from "motion/react";
|
|
2618
2675
|
import { Slot as Slot6 } from "@radix-ui/react-slot";
|
|
2619
|
-
import { jsx as
|
|
2620
|
-
var AddressInput =
|
|
2676
|
+
import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
2677
|
+
var AddressInput = forwardRef3((props, ref) => {
|
|
2621
2678
|
const id = useId2();
|
|
2622
2679
|
const _a = props, { network, validity } = _a, __props = __objRest(_a, ["network", "validity"]);
|
|
2623
2680
|
const input_id = `address${id}`;
|
|
2624
2681
|
return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-[calc(6rem/16)] w-full select-none", children: [
|
|
2625
|
-
/* @__PURE__ */
|
|
2682
|
+
/* @__PURE__ */ jsx26(Text, { variant: "caption", className: "text-muted-foreground", asChild: true, children: /* @__PURE__ */ jsx26("label", { htmlFor: input_id, children: "To address" }) }),
|
|
2626
2683
|
/* @__PURE__ */ jsxs17("div", { className: "bg-brand-black-350 w-full h-[calc(50rem/16)] justify-start gap-2 flex py-[calc(13rem/16)] px-[calc(12rem/16)] rounded-[1rem]", children: [
|
|
2627
|
-
props.validity.status === "error" ? /* @__PURE__ */
|
|
2684
|
+
props.validity.status === "error" ? /* @__PURE__ */ jsx26(IconButton, { variant: "level_2", rounded: "full", size: "xs", asChild: true, children: /* @__PURE__ */ jsx26("span", { className: "w-[calc(24rem/16)]", children: /* @__PURE__ */ jsx26(CirclePlaceholderDashed_default, { width: "1em" }) }) }) : /* @__PURE__ */ jsx26(
|
|
2628
2685
|
TokenImage,
|
|
2629
2686
|
{
|
|
2630
2687
|
className: "w-[calc(24rem/16)]",
|
|
@@ -2632,7 +2689,7 @@ var AddressInput = forwardRef2((props, ref) => {
|
|
|
2632
2689
|
alt: props.network.name
|
|
2633
2690
|
}
|
|
2634
2691
|
),
|
|
2635
|
-
/* @__PURE__ */
|
|
2692
|
+
/* @__PURE__ */ jsx26(
|
|
2636
2693
|
"input",
|
|
2637
2694
|
__spreadProps(__spreadValues({
|
|
2638
2695
|
ref,
|
|
@@ -2644,7 +2701,7 @@ var AddressInput = forwardRef2((props, ref) => {
|
|
|
2644
2701
|
})
|
|
2645
2702
|
)
|
|
2646
2703
|
] }),
|
|
2647
|
-
/* @__PURE__ */
|
|
2704
|
+
/* @__PURE__ */ jsx26(Text, { variant: "caption", asChild: true, children: /* @__PURE__ */ jsxs17(
|
|
2648
2705
|
motion2.p,
|
|
2649
2706
|
{
|
|
2650
2707
|
initial: { opacity: 0, marginTop: -10 },
|
|
@@ -2654,15 +2711,15 @@ var AddressInput = forwardRef2((props, ref) => {
|
|
|
2654
2711
|
"text-brand-danger-500": props.validity.status === "error"
|
|
2655
2712
|
}),
|
|
2656
2713
|
children: [
|
|
2657
|
-
props.validity.status === "ok" ? /* @__PURE__ */
|
|
2658
|
-
/* @__PURE__ */
|
|
2714
|
+
props.validity.status === "ok" ? /* @__PURE__ */ jsx26(Check_default, { width: "1em" }) : /* @__PURE__ */ jsx26(XCircle_default, { width: "1em" }),
|
|
2715
|
+
/* @__PURE__ */ jsx26("span", { children: props.validity.message })
|
|
2659
2716
|
]
|
|
2660
2717
|
}
|
|
2661
2718
|
) })
|
|
2662
2719
|
] });
|
|
2663
2720
|
});
|
|
2664
2721
|
function AddressInputFocusBehaviour(props) {
|
|
2665
|
-
return /* @__PURE__ */
|
|
2722
|
+
return /* @__PURE__ */ jsx26(
|
|
2666
2723
|
Slot6,
|
|
2667
2724
|
__spreadProps(__spreadValues({}, props), {
|
|
2668
2725
|
onFocus: (e) => {
|
|
@@ -2684,21 +2741,21 @@ function AddressInputFocusBehaviour(props) {
|
|
|
2684
2741
|
}
|
|
2685
2742
|
|
|
2686
2743
|
// src/components/if.tsx
|
|
2687
|
-
import { Fragment as Fragment5, jsx as
|
|
2744
|
+
import { Fragment as Fragment5, jsx as jsx27 } from "react/jsx-runtime";
|
|
2688
2745
|
function If({ cond: condition, children }) {
|
|
2689
2746
|
if (!condition) return null;
|
|
2690
|
-
return /* @__PURE__ */
|
|
2747
|
+
return /* @__PURE__ */ jsx27(Fragment5, { children });
|
|
2691
2748
|
}
|
|
2692
2749
|
var if_default = If;
|
|
2693
2750
|
|
|
2694
2751
|
// src/components/molecules/asset-list.tsx
|
|
2695
|
-
import { jsx as
|
|
2752
|
+
import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
2696
2753
|
function AssetListItem(props) {
|
|
2697
2754
|
const { caption, tokenImage } = props;
|
|
2698
2755
|
return /* @__PURE__ */ jsxs18("li", { className: "flex gap-[0.75rem] select-none items-center text-brand-black-100", children: [
|
|
2699
|
-
/* @__PURE__ */
|
|
2756
|
+
/* @__PURE__ */ jsx28(BadgeIcon, __spreadValues({}, tokenImage)),
|
|
2700
2757
|
/* @__PURE__ */ jsxs18("div", { className: "flex flex-grow flex-col text-start gap-[0.125rem]", children: [
|
|
2701
|
-
/* @__PURE__ */
|
|
2758
|
+
/* @__PURE__ */ jsx28("span", { className: "text-brand-white-500 text-[0.875rem] h-[1.25rem]", children: caption }),
|
|
2702
2759
|
/* @__PURE__ */ jsxs18("span", { className: "text-xs h-[1rem] flex items-center gap-[0.125rem]", children: [
|
|
2703
2760
|
props.amountInUSD,
|
|
2704
2761
|
" ",
|
|
@@ -2708,24 +2765,24 @@ function AssetListItem(props) {
|
|
|
2708
2765
|
] })
|
|
2709
2766
|
] })
|
|
2710
2767
|
] }),
|
|
2711
|
-
/* @__PURE__ */
|
|
2768
|
+
/* @__PURE__ */ jsx28("div", { className: "flex-col shrink-0 text-end", children: /* @__PURE__ */ jsx28("span", { className: "text-brand-white-500 text-[1rem] h-[1.25rem]", children: props.amount }) })
|
|
2712
2769
|
] });
|
|
2713
2770
|
}
|
|
2714
2771
|
function AssetList(props) {
|
|
2715
|
-
return /* @__PURE__ */
|
|
2772
|
+
return /* @__PURE__ */ jsx28("ul", __spreadProps(__spreadValues({}, props), { className: cn("flex flex-col gap-[1rem]", props.className), children: props.children }));
|
|
2716
2773
|
}
|
|
2717
2774
|
|
|
2718
2775
|
// src/components/atoms/gradient-line.tsx
|
|
2719
2776
|
import { Slot as Slot7 } from "@radix-ui/react-slot";
|
|
2720
|
-
import
|
|
2721
|
-
import { jsx as
|
|
2777
|
+
import React10 from "react";
|
|
2778
|
+
import { jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
2722
2779
|
function GradientContainer(props) {
|
|
2723
|
-
return /* @__PURE__ */
|
|
2780
|
+
return /* @__PURE__ */ jsx29(Slot7, { className: "relative overflow-hidden", children: props.children });
|
|
2724
2781
|
}
|
|
2725
2782
|
function GradientLine(props) {
|
|
2726
|
-
const ref =
|
|
2783
|
+
const ref = React10.useRef(null);
|
|
2727
2784
|
const { behaviour, value, mode = "default" } = props;
|
|
2728
|
-
|
|
2785
|
+
React10.useEffect(() => {
|
|
2729
2786
|
const el = ref.current;
|
|
2730
2787
|
if (!el) return;
|
|
2731
2788
|
const parent = el.parentElement;
|
|
@@ -2741,26 +2798,26 @@ function GradientLine(props) {
|
|
|
2741
2798
|
window.removeEventListener("resize", updateWidth);
|
|
2742
2799
|
};
|
|
2743
2800
|
}, []);
|
|
2744
|
-
|
|
2801
|
+
React10.useEffect(() => {
|
|
2745
2802
|
const el = ref.current;
|
|
2746
2803
|
if (!el) return;
|
|
2747
2804
|
if (behaviour !== "duration") return;
|
|
2748
2805
|
el.style.transition = `width ${value}ms linear`;
|
|
2749
2806
|
el.style.width = "100%";
|
|
2750
2807
|
}, [behaviour, value]);
|
|
2751
|
-
|
|
2808
|
+
React10.useEffect(() => {
|
|
2752
2809
|
if (behaviour !== "progress") return;
|
|
2753
2810
|
const el = ref.current;
|
|
2754
2811
|
if (!el) return;
|
|
2755
2812
|
el.style.width = `${value}%`;
|
|
2756
2813
|
}, [behaviour, value]);
|
|
2757
|
-
return /* @__PURE__ */
|
|
2814
|
+
return /* @__PURE__ */ jsx29("div", { className: "inset-0 flex flex-col absolute z-[0] justify-end", children: /* @__PURE__ */ jsx29(
|
|
2758
2815
|
"div",
|
|
2759
2816
|
{
|
|
2760
2817
|
ref,
|
|
2761
2818
|
className: "relative flex flex-col overflow-hidden w-0 h-[var(--grad-container-h)]",
|
|
2762
2819
|
children: /* @__PURE__ */ jsxs19("div", { className: "flex flex-col flex-1 z-[-1] w-[var(--grad-container-w)]", children: [
|
|
2763
|
-
/* @__PURE__ */
|
|
2820
|
+
/* @__PURE__ */ jsx29(
|
|
2764
2821
|
"div",
|
|
2765
2822
|
{
|
|
2766
2823
|
className: cn("flex-1 w-full", {
|
|
@@ -2769,7 +2826,7 @@ function GradientLine(props) {
|
|
|
2769
2826
|
})
|
|
2770
2827
|
}
|
|
2771
2828
|
),
|
|
2772
|
-
/* @__PURE__ */
|
|
2829
|
+
/* @__PURE__ */ jsx29(
|
|
2773
2830
|
"div",
|
|
2774
2831
|
{
|
|
2775
2832
|
className: "w-full h-px",
|
|
@@ -2784,11 +2841,11 @@ function GradientLine(props) {
|
|
|
2784
2841
|
}
|
|
2785
2842
|
|
|
2786
2843
|
// src/components/molecules/connect-wallet.tsx
|
|
2787
|
-
import { Fragment as Fragment6, jsx as
|
|
2844
|
+
import { Fragment as Fragment6, jsx as jsx30, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2788
2845
|
function WalletAccountItem(props) {
|
|
2789
2846
|
const { network, wallet, address, isActive } = props;
|
|
2790
2847
|
return /* @__PURE__ */ jsxs20("li", { className: "p-[0.75rem] select-none h-[3.75rem] rounded-[1rem] bg-brand-black-350 items-center flex gap-[0.625rem] w-full", children: [
|
|
2791
|
-
/* @__PURE__ */
|
|
2848
|
+
/* @__PURE__ */ jsx30(
|
|
2792
2849
|
BadgeIcon,
|
|
2793
2850
|
{
|
|
2794
2851
|
src: wallet.image,
|
|
@@ -2799,14 +2856,14 @@ function WalletAccountItem(props) {
|
|
|
2799
2856
|
),
|
|
2800
2857
|
/* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
2801
2858
|
/* @__PURE__ */ jsxs20("div", { className: "flex grow-1 flex-col font-medium text-brand-white-500", children: [
|
|
2802
|
-
/* @__PURE__ */
|
|
2859
|
+
/* @__PURE__ */ jsx30("span", { className: "text-body", children: address != null ? address : "{{Address}}" }),
|
|
2803
2860
|
isActive && /* @__PURE__ */ jsxs20("span", { className: "text-caption-2 h-[1rem] text-brand-white-500 inline-flex items-center gap-0.5", children: [
|
|
2804
|
-
/* @__PURE__ */
|
|
2861
|
+
/* @__PURE__ */ jsx30(Check_default, { className: "text-brand-success-400" }),
|
|
2805
2862
|
" Connected"
|
|
2806
2863
|
] })
|
|
2807
2864
|
] }),
|
|
2808
2865
|
/* @__PURE__ */ jsxs20("div", { className: "flex grow-0 gap-[0.375rem] h-[2rem] items-stretch shrink-0 *:shrink-0", children: [
|
|
2809
|
-
/* @__PURE__ */
|
|
2866
|
+
/* @__PURE__ */ jsx30(
|
|
2810
2867
|
IconButton,
|
|
2811
2868
|
{
|
|
2812
2869
|
size: "sm",
|
|
@@ -2817,7 +2874,7 @@ function WalletAccountItem(props) {
|
|
|
2817
2874
|
var _a;
|
|
2818
2875
|
(_a = props == null ? void 0 : props.onCopy) == null ? void 0 : _a.call(props);
|
|
2819
2876
|
},
|
|
2820
|
-
children: /* @__PURE__ */
|
|
2877
|
+
children: /* @__PURE__ */ jsx30(Copy_default, { className: "size-4 text-brand-black-100" })
|
|
2821
2878
|
}
|
|
2822
2879
|
),
|
|
2823
2880
|
/* @__PURE__ */ jsxs20(
|
|
@@ -2831,8 +2888,8 @@ function WalletAccountItem(props) {
|
|
|
2831
2888
|
return (_a = props == null ? void 0 : props.onDisconnect) == null ? void 0 : _a.call(props);
|
|
2832
2889
|
},
|
|
2833
2890
|
children: [
|
|
2834
|
-
/* @__PURE__ */
|
|
2835
|
-
/* @__PURE__ */
|
|
2891
|
+
/* @__PURE__ */ jsx30(Power_default, { className: "size-4 text-brand-black-100" }),
|
|
2892
|
+
/* @__PURE__ */ jsx30("span", { className: "w-0 transition-all overflow-hidden group-hover:w-[10ch]", children: "Disconnect" })
|
|
2836
2893
|
]
|
|
2837
2894
|
}
|
|
2838
2895
|
)
|
|
@@ -2849,8 +2906,8 @@ function WalletProviderItem(props) {
|
|
|
2849
2906
|
transition = { progress_duration: 5e3 }
|
|
2850
2907
|
} = props;
|
|
2851
2908
|
const is_supported = unsupported === "supported";
|
|
2852
|
-
return /* @__PURE__ */
|
|
2853
|
-
status === "connecting" ? /* @__PURE__ */
|
|
2909
|
+
return /* @__PURE__ */ jsx30(GradientContainer, { children: /* @__PURE__ */ jsxs20("li", { className: "p-[0.75rem] select-none w-full flex h-[3.75rem] rounded-[1rem] bg-brand-black-350 items-center", children: [
|
|
2910
|
+
status === "connecting" ? /* @__PURE__ */ jsx30(
|
|
2854
2911
|
GradientLine,
|
|
2855
2912
|
{
|
|
2856
2913
|
behaviour: "duration",
|
|
@@ -2858,10 +2915,10 @@ function WalletProviderItem(props) {
|
|
|
2858
2915
|
}
|
|
2859
2916
|
) : null,
|
|
2860
2917
|
/* @__PURE__ */ jsxs20("div", { className: "flex z-10 gap-[0.625rem] w-full items-center", children: [
|
|
2861
|
-
/* @__PURE__ */
|
|
2862
|
-
/* @__PURE__ */
|
|
2863
|
-
!is_supported ? /* @__PURE__ */
|
|
2864
|
-
!installed && is_supported ? /* @__PURE__ */
|
|
2918
|
+
/* @__PURE__ */ jsx30(TokenImage, { src: wallet.src, alt: wallet.name, className: "w-[2rem]" }),
|
|
2919
|
+
/* @__PURE__ */ jsx30("div", { className: "flex grow-1 flex-col font-medium text-brand-white-500", children: /* @__PURE__ */ jsx30("span", { className: "text-base leading-[1.6]", children: wallet.name }) }),
|
|
2920
|
+
!is_supported ? /* @__PURE__ */ jsx30("span", { className: "text-brand-black-100 text-xs font-medium", children: unsupported }) : null,
|
|
2921
|
+
!installed && is_supported ? /* @__PURE__ */ jsx30(Button, { variant: "level_2", size: "sm", onClick: props.onConnect, children: "Install" }) : null,
|
|
2865
2922
|
installed && is_supported && /* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
2866
2923
|
status === "failed" && /* @__PURE__ */ jsxs20("div", { className: "flex grow-0 gap-[0.375rem] h-[2rem] items-stretch shrink-0 *:shrink-0", children: [
|
|
2867
2924
|
/* @__PURE__ */ jsxs20(
|
|
@@ -2872,12 +2929,12 @@ function WalletProviderItem(props) {
|
|
|
2872
2929
|
className: "h-[auto]",
|
|
2873
2930
|
onClick: props.onRetry,
|
|
2874
2931
|
children: [
|
|
2875
|
-
/* @__PURE__ */
|
|
2932
|
+
/* @__PURE__ */ jsx30(RotateCcw_default, { className: "size-4 text-brand-black-100" }),
|
|
2876
2933
|
"Try again"
|
|
2877
2934
|
]
|
|
2878
2935
|
}
|
|
2879
2936
|
),
|
|
2880
|
-
/* @__PURE__ */
|
|
2937
|
+
/* @__PURE__ */ jsx30(
|
|
2881
2938
|
IconButton,
|
|
2882
2939
|
{
|
|
2883
2940
|
className: "cursor-pointer",
|
|
@@ -2885,11 +2942,11 @@ function WalletProviderItem(props) {
|
|
|
2885
2942
|
size: "sm",
|
|
2886
2943
|
onClick: props.onCancel,
|
|
2887
2944
|
rounded: "default",
|
|
2888
|
-
children: /* @__PURE__ */
|
|
2945
|
+
children: /* @__PURE__ */ jsx30(XIcon_default, { className: "text-brand-black-100 size-[1em]" })
|
|
2889
2946
|
}
|
|
2890
2947
|
)
|
|
2891
2948
|
] }),
|
|
2892
|
-
(status === "connecting" || status === "idle") && /* @__PURE__ */
|
|
2949
|
+
(status === "connecting" || status === "idle") && /* @__PURE__ */ jsx30(
|
|
2893
2950
|
Button,
|
|
2894
2951
|
{
|
|
2895
2952
|
variant: "level_2",
|
|
@@ -2910,8 +2967,8 @@ function WalletProviderItem(props) {
|
|
|
2910
2967
|
return (_a = props == null ? void 0 : props.onDisconnect) == null ? void 0 : _a.call(props);
|
|
2911
2968
|
},
|
|
2912
2969
|
children: [
|
|
2913
|
-
/* @__PURE__ */
|
|
2914
|
-
/* @__PURE__ */
|
|
2970
|
+
/* @__PURE__ */ jsx30(Power_default, { className: "size-4 text-brand-black-100" }),
|
|
2971
|
+
/* @__PURE__ */ jsx30("span", { className: "w-0 transition-all overflow-hidden group-hover:w-[10ch]", children: "Disconnect" })
|
|
2915
2972
|
]
|
|
2916
2973
|
}
|
|
2917
2974
|
)
|
|
@@ -2921,13 +2978,13 @@ function WalletProviderItem(props) {
|
|
|
2921
2978
|
}
|
|
2922
2979
|
function NetworkGroupItem(props) {
|
|
2923
2980
|
const { image: wallet } = props;
|
|
2924
|
-
return /* @__PURE__ */
|
|
2925
|
-
/* @__PURE__ */
|
|
2981
|
+
return /* @__PURE__ */ jsx30("li", { className: "p-[0.75rem] select-none flex h-[3.75rem] rounded-[1rem] bg-brand-black-350 w-full", children: /* @__PURE__ */ jsxs20("div", { className: "flex gap-[0.625rem] w-full z-20 relative items-center", children: [
|
|
2982
|
+
/* @__PURE__ */ jsx30(TokenImage, { className: "w-[2rem]", src: wallet.src, alt: wallet.name }),
|
|
2926
2983
|
/* @__PURE__ */ jsxs20("div", { className: "flex grow-1 flex-col font-medium text-brand-white-500", children: [
|
|
2927
|
-
/* @__PURE__ */
|
|
2928
|
-
/* @__PURE__ */
|
|
2984
|
+
/* @__PURE__ */ jsx30("span", { className: "text-body", children: wallet.name }),
|
|
2985
|
+
/* @__PURE__ */ jsx30("span", { className: "text-caption-2 text-brand-black-100", children: props.description })
|
|
2929
2986
|
] }),
|
|
2930
|
-
/* @__PURE__ */
|
|
2987
|
+
/* @__PURE__ */ jsx30(Button, { variant: "level_2", size: "sm", onClick: props.onConnect, children: "Connect" })
|
|
2931
2988
|
] }) });
|
|
2932
2989
|
}
|
|
2933
2990
|
function AccountItem(props) {
|
|
@@ -2939,7 +2996,7 @@ function AccountItem(props) {
|
|
|
2939
2996
|
}
|
|
2940
2997
|
};
|
|
2941
2998
|
return /* @__PURE__ */ jsxs20("li", { className: "select-none h-[3.75rem] items-center flex gap-[0.625rem] w-full", children: [
|
|
2942
|
-
/* @__PURE__ */
|
|
2999
|
+
/* @__PURE__ */ jsx30(
|
|
2943
3000
|
IconButton,
|
|
2944
3001
|
{
|
|
2945
3002
|
className: cn(
|
|
@@ -2949,10 +3006,10 @@ function AccountItem(props) {
|
|
|
2949
3006
|
variant: "secondary",
|
|
2950
3007
|
onClick: handleSelect,
|
|
2951
3008
|
title: isActive ? "Already active" : "Activate this account",
|
|
2952
|
-
children: isActive ? /* @__PURE__ */
|
|
3009
|
+
children: isActive ? /* @__PURE__ */ jsx30(Check_default, { className: "size-4 text-brand-success-400" }) : /* @__PURE__ */ jsx30(CirclePlaceholder_default, { className: "size-4 text-brand-black-100 group-hover:text-white duration-200 transition-colors" })
|
|
2953
3010
|
}
|
|
2954
3011
|
),
|
|
2955
|
-
/* @__PURE__ */
|
|
3012
|
+
/* @__PURE__ */ jsx30(
|
|
2956
3013
|
BadgeIcon,
|
|
2957
3014
|
{
|
|
2958
3015
|
src: wallet.image,
|
|
@@ -2963,9 +3020,9 @@ function AccountItem(props) {
|
|
|
2963
3020
|
}
|
|
2964
3021
|
),
|
|
2965
3022
|
/* @__PURE__ */ jsxs20(Fragment6, { children: [
|
|
2966
|
-
/* @__PURE__ */
|
|
3023
|
+
/* @__PURE__ */ jsx30("div", { className: "flex grow-1 flex-col font-medium text-brand-white-500", children: /* @__PURE__ */ jsx30("div", { className: "flex items-center gap-[6px]", children: /* @__PURE__ */ jsx30("span", { className: "text-body", children: address != null ? address : "{{Address}}" }) }) }),
|
|
2967
3024
|
/* @__PURE__ */ jsxs20("div", { className: "relative flex gap-[6px] grow-0 h-[2rem] items-stretch shrink-0 *:shrink-0 pr-[45px]", children: [
|
|
2968
|
-
/* @__PURE__ */
|
|
3025
|
+
/* @__PURE__ */ jsx30(
|
|
2969
3026
|
IconButton,
|
|
2970
3027
|
{
|
|
2971
3028
|
size: "sm",
|
|
@@ -2976,7 +3033,7 @@ function AccountItem(props) {
|
|
|
2976
3033
|
var _a;
|
|
2977
3034
|
(_a = props == null ? void 0 : props.onCopy) == null ? void 0 : _a.call(props);
|
|
2978
3035
|
},
|
|
2979
|
-
children: /* @__PURE__ */
|
|
3036
|
+
children: /* @__PURE__ */ jsx30(Copy_default, { className: "size-4 text-brand-black-100" })
|
|
2980
3037
|
}
|
|
2981
3038
|
),
|
|
2982
3039
|
/* @__PURE__ */ jsxs20(
|
|
@@ -2990,8 +3047,8 @@ function AccountItem(props) {
|
|
|
2990
3047
|
return (_a = props == null ? void 0 : props.onDisconnect) == null ? void 0 : _a.call(props);
|
|
2991
3048
|
},
|
|
2992
3049
|
children: [
|
|
2993
|
-
/* @__PURE__ */
|
|
2994
|
-
/* @__PURE__ */
|
|
3050
|
+
/* @__PURE__ */ jsx30(Power_default, { className: "size-4 text-brand-black-100" }),
|
|
3051
|
+
/* @__PURE__ */ jsx30("span", { className: "w-0 transition-all overflow-hidden group-hover:w-[10ch]", children: "Disconnect" })
|
|
2995
3052
|
]
|
|
2996
3053
|
}
|
|
2997
3054
|
)
|
|
@@ -3001,29 +3058,29 @@ function AccountItem(props) {
|
|
|
3001
3058
|
}
|
|
3002
3059
|
|
|
3003
3060
|
// src/components/molecules/review-item.tsx
|
|
3004
|
-
import
|
|
3005
|
-
import { jsx as
|
|
3061
|
+
import React11 from "react";
|
|
3062
|
+
import { jsx as jsx31, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3006
3063
|
function ReviewItem(props) {
|
|
3007
3064
|
const Btn = props.AddressInfo ? props.AddressInfo : ReviewItemCopyAddressButton;
|
|
3008
3065
|
return /* @__PURE__ */ jsxs21("li", { className: "bg-brand-black-500 font-medium items-center w-full h-[calc(64rem/16)] flex gap-[1rem] p-[calc(12rem/16)]", children: [
|
|
3009
|
-
/* @__PURE__ */
|
|
3066
|
+
/* @__PURE__ */ jsx31(BadgeIcon, __spreadValues({}, props.badge)),
|
|
3010
3067
|
/* @__PURE__ */ jsxs21("div", { className: "flex-1 text-start flex flex-col", children: [
|
|
3011
3068
|
/* @__PURE__ */ jsxs21("span", { className: "text-[1rem] leading-[1.25] text-brand-white-500", children: [
|
|
3012
3069
|
props.asset.amount,
|
|
3013
3070
|
" ",
|
|
3014
3071
|
props.asset.symbol
|
|
3015
3072
|
] }),
|
|
3016
|
-
/* @__PURE__ */
|
|
3073
|
+
/* @__PURE__ */ jsx31("span", { className: "text-[calc(12rem/16)] leading-[1rem]", children: props.asset.secondaryValue })
|
|
3017
3074
|
] }),
|
|
3018
3075
|
/* @__PURE__ */ jsxs21("div", { className: "flex flex-col items-end gap-[2px] text-end shrink-0", children: [
|
|
3019
|
-
/* @__PURE__ */
|
|
3020
|
-
/* @__PURE__ */
|
|
3076
|
+
/* @__PURE__ */ jsx31(Btn, { address: props.address, tag: props.tag }),
|
|
3077
|
+
/* @__PURE__ */ jsx31("span", { className: "text-[calc(12rem/16)] leading-[1rem]", children: props.networkName })
|
|
3021
3078
|
] })
|
|
3022
3079
|
] });
|
|
3023
3080
|
}
|
|
3024
|
-
var ReviewItemAddress =
|
|
3081
|
+
var ReviewItemAddress = React11.forwardRef((props, ref) => {
|
|
3025
3082
|
const _a = props, { address, tag } = _a, PROPS = __objRest(_a, ["address", "tag"]);
|
|
3026
|
-
return /* @__PURE__ */
|
|
3083
|
+
return /* @__PURE__ */ jsx31(
|
|
3027
3084
|
"span",
|
|
3028
3085
|
__spreadProps(__spreadValues({
|
|
3029
3086
|
ref
|
|
@@ -3032,11 +3089,11 @@ var ReviewItemAddress = React10.forwardRef((props, ref) => {
|
|
|
3032
3089
|
"rounded-full px-[6px] py-[3px] text-[calc(14rem/16)] inline-flex items-center gap-[calc(4rem/16)] bg-brand-black-300",
|
|
3033
3090
|
props.className
|
|
3034
3091
|
),
|
|
3035
|
-
children: /* @__PURE__ */
|
|
3092
|
+
children: /* @__PURE__ */ jsx31("span", { className: "text-[calc(12rem/16)] not-sr-only leading-[1rem] text-brand-white-500", children: address })
|
|
3036
3093
|
})
|
|
3037
3094
|
);
|
|
3038
3095
|
});
|
|
3039
|
-
var ReviewItemCopyAddressButton =
|
|
3096
|
+
var ReviewItemCopyAddressButton = React11.forwardRef((props, ref) => {
|
|
3040
3097
|
const _a = props, { address, tag } = _a, PROPS = __objRest(_a, ["address", "tag"]);
|
|
3041
3098
|
return /* @__PURE__ */ jsxs21(
|
|
3042
3099
|
"button",
|
|
@@ -3053,8 +3110,8 @@ var ReviewItemCopyAddressButton = React10.forwardRef((props, ref) => {
|
|
|
3053
3110
|
tag,
|
|
3054
3111
|
" address"
|
|
3055
3112
|
] }),
|
|
3056
|
-
/* @__PURE__ */
|
|
3057
|
-
/* @__PURE__ */
|
|
3113
|
+
/* @__PURE__ */ jsx31("span", { className: "text-[calc(12rem/16)] not-sr-only leading-[1rem] text-brand-white-500", children: address }),
|
|
3114
|
+
/* @__PURE__ */ jsx31(Copy_default, { className: "size-4" })
|
|
3058
3115
|
]
|
|
3059
3116
|
})
|
|
3060
3117
|
);
|
|
@@ -3062,15 +3119,15 @@ var ReviewItemCopyAddressButton = React10.forwardRef((props, ref) => {
|
|
|
3062
3119
|
|
|
3063
3120
|
// src/components/molecules/swap-review-item.tsx
|
|
3064
3121
|
import { Loader2Icon } from "lucide-react";
|
|
3065
|
-
import
|
|
3066
|
-
import { jsx as
|
|
3122
|
+
import React12 from "react";
|
|
3123
|
+
import { jsx as jsx32, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
3067
3124
|
function SwapReviewItem(props) {
|
|
3068
3125
|
const addressButton = props.addressButton;
|
|
3069
3126
|
const { pendingMode = "idle" } = props;
|
|
3070
3127
|
return /* @__PURE__ */ jsxs22("li", { className: "font-medium text-brand-black-100 items-center w-full h-[calc(48rem/16)] flex gap-[1rem]", children: [
|
|
3071
|
-
/* @__PURE__ */
|
|
3128
|
+
/* @__PURE__ */ jsx32(BadgeIcon, __spreadValues({ size: "2.5rem" }, props.badge)),
|
|
3072
3129
|
/* @__PURE__ */ jsxs22("div", { className: "flex-1 text-start flex flex-col", children: [
|
|
3073
|
-
/* @__PURE__ */
|
|
3130
|
+
/* @__PURE__ */ jsx32("span", { className: "text-[calc(12rem/16)] leading-[1rem]", children: props.tag === "from" ? "Amount in" : "Amount out" }),
|
|
3074
3131
|
/* @__PURE__ */ jsxs22(
|
|
3075
3132
|
"span",
|
|
3076
3133
|
{
|
|
@@ -3089,7 +3146,7 @@ function SwapReviewItem(props) {
|
|
|
3089
3146
|
)
|
|
3090
3147
|
] }),
|
|
3091
3148
|
/* @__PURE__ */ jsxs22("div", { className: "flex self-stretch items-end text-end shrink-0", children: [
|
|
3092
|
-
/* @__PURE__ */
|
|
3149
|
+
/* @__PURE__ */ jsx32(if_default, { cond: props.variant === "processing", children: /* @__PURE__ */ jsx32(
|
|
3093
3150
|
"span",
|
|
3094
3151
|
{
|
|
3095
3152
|
className: cn(
|
|
@@ -3102,7 +3159,7 @@ function SwapReviewItem(props) {
|
|
|
3102
3159
|
children: props.asset.secondaryValue
|
|
3103
3160
|
}
|
|
3104
3161
|
) }),
|
|
3105
|
-
/* @__PURE__ */
|
|
3162
|
+
/* @__PURE__ */ jsx32(if_default, { cond: props.variant === "reviewing", children: /* @__PURE__ */ jsxs22("div", { className: "flex flex-col items-end gap-1.5", children: [
|
|
3106
3163
|
addressButton,
|
|
3107
3164
|
/* @__PURE__ */ jsxs22("span", { className: "text-[calc(11rem/16)] text-brand-black-100 px-2", children: [
|
|
3108
3165
|
props.wallet.networkName,
|
|
@@ -3112,8 +3169,8 @@ function SwapReviewItem(props) {
|
|
|
3112
3169
|
] })
|
|
3113
3170
|
] });
|
|
3114
3171
|
}
|
|
3115
|
-
var SwapReviewCopyAddressButton =
|
|
3116
|
-
return /* @__PURE__ */
|
|
3172
|
+
var SwapReviewCopyAddressButton = React12.forwardRef(function SwapReviewCopyAddressButton2(props, ref) {
|
|
3173
|
+
return /* @__PURE__ */ jsx32(
|
|
3117
3174
|
ReviewItemCopyAddressButton,
|
|
3118
3175
|
__spreadValues({
|
|
3119
3176
|
ref,
|
|
@@ -3121,9 +3178,9 @@ var SwapReviewCopyAddressButton = React11.forwardRef(function SwapReviewCopyAddr
|
|
|
3121
3178
|
}, props)
|
|
3122
3179
|
);
|
|
3123
3180
|
});
|
|
3124
|
-
var SwapReviewItemAddress =
|
|
3181
|
+
var SwapReviewItemAddress = React12.forwardRef((props, ref) => {
|
|
3125
3182
|
const _a = props, { address, tag } = _a, PROPS = __objRest(_a, ["address", "tag"]);
|
|
3126
|
-
return /* @__PURE__ */
|
|
3183
|
+
return /* @__PURE__ */ jsx32(
|
|
3127
3184
|
"span",
|
|
3128
3185
|
__spreadProps(__spreadValues({
|
|
3129
3186
|
ref
|
|
@@ -3132,12 +3189,12 @@ var SwapReviewItemAddress = React11.forwardRef((props, ref) => {
|
|
|
3132
3189
|
"rounded-full px-[6px] py-[3px] text-[calc(14rem/16)] inline-flex items-center gap-[calc(4rem/16)] bg-brand-black-300",
|
|
3133
3190
|
props.className
|
|
3134
3191
|
),
|
|
3135
|
-
children: /* @__PURE__ */
|
|
3192
|
+
children: /* @__PURE__ */ jsx32("span", { className: "text-[calc(12rem/16)] not-sr-only leading-[1rem] text-brand-white-500", children: address })
|
|
3136
3193
|
})
|
|
3137
3194
|
);
|
|
3138
3195
|
});
|
|
3139
3196
|
function SwapReviewRoot(props) {
|
|
3140
|
-
return /* @__PURE__ */
|
|
3197
|
+
return /* @__PURE__ */ jsx32(
|
|
3141
3198
|
"section",
|
|
3142
3199
|
{
|
|
3143
3200
|
className: "select-none flex max-w-[25rem] flex-col gap-2 rounded-xl bg-brand-black-550 py-5 px-3.5",
|
|
@@ -3151,8 +3208,8 @@ function SwapReviewRoot(props) {
|
|
|
3151
3208
|
}
|
|
3152
3209
|
function SwapReviewSeperator(props) {
|
|
3153
3210
|
return /* @__PURE__ */ jsxs22("div", { className: "overflow-x-hidden relative flex items-center justify-center", children: [
|
|
3154
|
-
/* @__PURE__ */
|
|
3155
|
-
/* @__PURE__ */
|
|
3211
|
+
/* @__PURE__ */ jsx32("div", { className: "border-dashed border-brand-black-200 z-10 absolute inset-x-0 border-b" }),
|
|
3212
|
+
/* @__PURE__ */ jsx32(
|
|
3156
3213
|
"div",
|
|
3157
3214
|
{
|
|
3158
3215
|
className: "z-20 absolute inset-0",
|
|
@@ -3161,7 +3218,7 @@ function SwapReviewSeperator(props) {
|
|
|
3161
3218
|
}
|
|
3162
3219
|
}
|
|
3163
3220
|
),
|
|
3164
|
-
/* @__PURE__ */
|
|
3221
|
+
/* @__PURE__ */ jsx32("div", { className: "self-center place-self-center relative z-30", children: props.children })
|
|
3165
3222
|
] });
|
|
3166
3223
|
}
|
|
3167
3224
|
function SwapReviewSeperatorStatus(props) {
|
|
@@ -3178,7 +3235,7 @@ function SwapReviewSeperatorStatus(props) {
|
|
|
3178
3235
|
}
|
|
3179
3236
|
),
|
|
3180
3237
|
children: [
|
|
3181
|
-
/* @__PURE__ */
|
|
3238
|
+
/* @__PURE__ */ jsx32(
|
|
3182
3239
|
"span",
|
|
3183
3240
|
{
|
|
3184
3241
|
className: cn("text-xs text-brand-black-100", {
|
|
@@ -3187,8 +3244,8 @@ function SwapReviewSeperatorStatus(props) {
|
|
|
3187
3244
|
children: mode === "processing" ? "Swapping" : "Swapped"
|
|
3188
3245
|
}
|
|
3189
3246
|
),
|
|
3190
|
-
/* @__PURE__ */
|
|
3191
|
-
/* @__PURE__ */
|
|
3247
|
+
/* @__PURE__ */ jsx32("span", { role: "presentation", className: "absolute end-2.5", children: /* @__PURE__ */ jsxs22("span", { className: "text-[0.65625rem] size-[1em] flex items-center justify-center *:absolute *:left-0 *:top-0 relative", children: [
|
|
3248
|
+
/* @__PURE__ */ jsx32(
|
|
3192
3249
|
Loader2Icon,
|
|
3193
3250
|
{
|
|
3194
3251
|
className: cn(
|
|
@@ -3199,7 +3256,7 @@ function SwapReviewSeperatorStatus(props) {
|
|
|
3199
3256
|
)
|
|
3200
3257
|
}
|
|
3201
3258
|
),
|
|
3202
|
-
/* @__PURE__ */
|
|
3259
|
+
/* @__PURE__ */ jsx32(
|
|
3203
3260
|
Check_default,
|
|
3204
3261
|
{
|
|
3205
3262
|
className: cn(
|
|
@@ -3218,8 +3275,8 @@ function SwapReviewSeperatorStatus(props) {
|
|
|
3218
3275
|
|
|
3219
3276
|
// src/components/molecules/dialog.tsx
|
|
3220
3277
|
import * as DialogPrimitive2 from "@radix-ui/react-dialog";
|
|
3221
|
-
import
|
|
3222
|
-
import { Fragment as Fragment7, jsx as
|
|
3278
|
+
import React13 from "react";
|
|
3279
|
+
import { Fragment as Fragment7, jsx as jsx33, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3223
3280
|
function DialogMorphContent(_a) {
|
|
3224
3281
|
var _b = _a, {
|
|
3225
3282
|
className,
|
|
@@ -3232,8 +3289,8 @@ function DialogMorphContent(_a) {
|
|
|
3232
3289
|
"showCloseButton",
|
|
3233
3290
|
"onInteractOutside"
|
|
3234
3291
|
]);
|
|
3235
|
-
const [mode, setViewMode] =
|
|
3236
|
-
|
|
3292
|
+
const [mode, setViewMode] = React13.useState("card");
|
|
3293
|
+
React13.useEffect(() => {
|
|
3237
3294
|
const controller = new AbortController();
|
|
3238
3295
|
const signal = controller.signal;
|
|
3239
3296
|
const checkOrientation = () => {
|
|
@@ -3281,8 +3338,8 @@ function DialogMorphContent(_a) {
|
|
|
3281
3338
|
"data-slot": "dialog-close",
|
|
3282
3339
|
className: "ring-offset-background cursor-pointer w-[calc(32rem/16)] inline-flex items-center justify-center rounded-full text-brand-black-100 aspect-square focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
3283
3340
|
children: [
|
|
3284
|
-
/* @__PURE__ */
|
|
3285
|
-
/* @__PURE__ */
|
|
3341
|
+
/* @__PURE__ */ jsx33(XIcon_default, { width: "1rem", height: "1rem" }),
|
|
3342
|
+
/* @__PURE__ */ jsx33("span", { className: "sr-only", children: "Close" })
|
|
3286
3343
|
]
|
|
3287
3344
|
}
|
|
3288
3345
|
)
|
|
@@ -3290,33 +3347,33 @@ function DialogMorphContent(_a) {
|
|
|
3290
3347
|
})
|
|
3291
3348
|
);
|
|
3292
3349
|
return /* @__PURE__ */ jsxs23(DialogPortal, { "data-slot": "dialog-portal", children: [
|
|
3293
|
-
/* @__PURE__ */
|
|
3294
|
-
mode === "card" ? /* @__PURE__ */
|
|
3350
|
+
/* @__PURE__ */ jsx33(DialogOverlay, {}),
|
|
3351
|
+
mode === "card" ? /* @__PURE__ */ jsx33(SmoothCorners, { children: Content9 }) : /* @__PURE__ */ jsx33(Fragment7, { children: Content9 })
|
|
3295
3352
|
] });
|
|
3296
3353
|
}
|
|
3297
3354
|
|
|
3298
3355
|
// src/components/molecules/manage-wallet.tsx
|
|
3299
|
-
import
|
|
3356
|
+
import React14 from "react";
|
|
3300
3357
|
import { Slot as Slot8 } from "@radix-ui/react-slot";
|
|
3301
|
-
import { jsx as
|
|
3358
|
+
import { jsx as jsx34 } from "react/jsx-runtime";
|
|
3302
3359
|
function WalletManagerUIProvider(props) {
|
|
3303
3360
|
const { expand: open = false, children } = props;
|
|
3304
|
-
const [show, setShow] =
|
|
3305
|
-
return /* @__PURE__ */
|
|
3361
|
+
const [show, setShow] = React14.useState(open);
|
|
3362
|
+
return /* @__PURE__ */ jsx34(WalletManagerContext.Provider, { value: { show, setShow }, children });
|
|
3306
3363
|
}
|
|
3307
|
-
var WalletManagerContext =
|
|
3364
|
+
var WalletManagerContext = React14.createContext({
|
|
3308
3365
|
show: false,
|
|
3309
3366
|
// @ts-expect-error
|
|
3310
|
-
setShow:
|
|
3367
|
+
setShow: React14.Dispatch
|
|
3311
3368
|
});
|
|
3312
3369
|
function useManager() {
|
|
3313
|
-
return
|
|
3370
|
+
return React14.useContext(WalletManagerContext);
|
|
3314
3371
|
}
|
|
3315
3372
|
function WalletManagerUIContent({
|
|
3316
3373
|
children
|
|
3317
3374
|
}) {
|
|
3318
3375
|
const { show } = useManager();
|
|
3319
|
-
return /* @__PURE__ */
|
|
3376
|
+
return /* @__PURE__ */ jsx34(
|
|
3320
3377
|
Slot8,
|
|
3321
3378
|
{
|
|
3322
3379
|
className: cn("transition-all pt-[1rem] flex-1", {
|
|
@@ -3332,14 +3389,14 @@ import { InfoIcon } from "lucide-react";
|
|
|
3332
3389
|
|
|
3333
3390
|
// src/@/ui/tooltip.tsx
|
|
3334
3391
|
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
|
3335
|
-
import { jsx as
|
|
3392
|
+
import { jsx as jsx35, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3336
3393
|
function TooltipProvider(_a) {
|
|
3337
3394
|
var _b = _a, {
|
|
3338
3395
|
delayDuration = 0
|
|
3339
3396
|
} = _b, props = __objRest(_b, [
|
|
3340
3397
|
"delayDuration"
|
|
3341
3398
|
]);
|
|
3342
|
-
return /* @__PURE__ */
|
|
3399
|
+
return /* @__PURE__ */ jsx35(
|
|
3343
3400
|
TooltipPrimitive.Provider,
|
|
3344
3401
|
__spreadValues({
|
|
3345
3402
|
"data-slot": "tooltip-provider",
|
|
@@ -3349,11 +3406,11 @@ function TooltipProvider(_a) {
|
|
|
3349
3406
|
}
|
|
3350
3407
|
function Tooltip(_a) {
|
|
3351
3408
|
var props = __objRest(_a, []);
|
|
3352
|
-
return /* @__PURE__ */
|
|
3409
|
+
return /* @__PURE__ */ jsx35(TooltipProvider, { children: /* @__PURE__ */ jsx35(TooltipPrimitive.Root, __spreadValues({ "data-slot": "tooltip" }, props)) });
|
|
3353
3410
|
}
|
|
3354
3411
|
function TooltipTrigger(_a) {
|
|
3355
3412
|
var props = __objRest(_a, []);
|
|
3356
|
-
return /* @__PURE__ */
|
|
3413
|
+
return /* @__PURE__ */ jsx35(TooltipPrimitive.Trigger, __spreadValues({ "data-slot": "tooltip-trigger" }, props));
|
|
3357
3414
|
}
|
|
3358
3415
|
function TooltipContent(_a) {
|
|
3359
3416
|
var _b = _a, {
|
|
@@ -3365,7 +3422,7 @@ function TooltipContent(_a) {
|
|
|
3365
3422
|
"sideOffset",
|
|
3366
3423
|
"children"
|
|
3367
3424
|
]);
|
|
3368
|
-
return /* @__PURE__ */
|
|
3425
|
+
return /* @__PURE__ */ jsx35(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsxs24(
|
|
3369
3426
|
TooltipPrimitive.Content,
|
|
3370
3427
|
__spreadProps(__spreadValues({
|
|
3371
3428
|
"data-slot": "tooltip-content",
|
|
@@ -3377,31 +3434,31 @@ function TooltipContent(_a) {
|
|
|
3377
3434
|
}, props), {
|
|
3378
3435
|
children: [
|
|
3379
3436
|
children,
|
|
3380
|
-
/* @__PURE__ */
|
|
3437
|
+
/* @__PURE__ */ jsx35(TooltipPrimitive.Arrow, { className: "bg-brand-black-600 fill-brand-black-600 z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" })
|
|
3381
3438
|
]
|
|
3382
3439
|
})
|
|
3383
3440
|
) });
|
|
3384
3441
|
}
|
|
3385
3442
|
|
|
3386
3443
|
// src/components/molecules/summary.tsx
|
|
3387
|
-
import { jsx as
|
|
3444
|
+
import { jsx as jsx36, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
3388
3445
|
function Summary(props) {
|
|
3389
|
-
return /* @__PURE__ */
|
|
3446
|
+
return /* @__PURE__ */ jsx36("div", { className: "flex flex-col gap-2 text-brand-black-100", children: props.children });
|
|
3390
3447
|
}
|
|
3391
3448
|
function SummaryEntry(props) {
|
|
3392
3449
|
var _a;
|
|
3393
3450
|
const Icon = props.icon;
|
|
3394
3451
|
const tooltip = typeof props.tooltip === "string" ? /* @__PURE__ */ jsxs25(Tooltip, { children: [
|
|
3395
|
-
/* @__PURE__ */
|
|
3396
|
-
/* @__PURE__ */
|
|
3452
|
+
/* @__PURE__ */ jsx36(TooltipTrigger, { children: /* @__PURE__ */ jsx36(InfoIcon, { size: "1em" }) }),
|
|
3453
|
+
/* @__PURE__ */ jsx36(TooltipContent, { children: props.tooltip })
|
|
3397
3454
|
] }) : (_a = props.tooltip) != null ? _a : null;
|
|
3398
3455
|
return /* @__PURE__ */ jsxs25("div", { className: "flex select-none items-center text-[calc(12rem/16)] font-medium", children: [
|
|
3399
3456
|
/* @__PURE__ */ jsxs25("dt", { className: "flex-1 gap-1 flex items-center", children: [
|
|
3400
|
-
/* @__PURE__ */
|
|
3401
|
-
/* @__PURE__ */
|
|
3457
|
+
/* @__PURE__ */ jsx36(Icon, { size: "1.16em" }),
|
|
3458
|
+
/* @__PURE__ */ jsx36("span", { className: "text-[1em] leading-[1rem]", children: props.name }),
|
|
3402
3459
|
tooltip
|
|
3403
3460
|
] }),
|
|
3404
|
-
/* @__PURE__ */
|
|
3461
|
+
/* @__PURE__ */ jsx36("dd", { children: props.children })
|
|
3405
3462
|
] });
|
|
3406
3463
|
}
|
|
3407
3464
|
function makeEntry({
|
|
@@ -3413,7 +3470,7 @@ function makeEntry({
|
|
|
3413
3470
|
children,
|
|
3414
3471
|
tooltip: overwriteTooltip
|
|
3415
3472
|
}) {
|
|
3416
|
-
return /* @__PURE__ */
|
|
3473
|
+
return /* @__PURE__ */ jsx36(
|
|
3417
3474
|
SummaryEntry,
|
|
3418
3475
|
{
|
|
3419
3476
|
icon,
|
|
@@ -3426,39 +3483,39 @@ function makeEntry({
|
|
|
3426
3483
|
};
|
|
3427
3484
|
}
|
|
3428
3485
|
var Bridge = makeEntry({
|
|
3429
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3486
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(Percent_default, { width: size }),
|
|
3430
3487
|
name: "Bridge fee"
|
|
3431
3488
|
});
|
|
3432
3489
|
var RecipientAddress = makeEntry({
|
|
3433
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3490
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(Wallet_default, { width: size }),
|
|
3434
3491
|
name: "Recipient Address"
|
|
3435
3492
|
});
|
|
3436
3493
|
var GasEntry = makeEntry({
|
|
3437
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3494
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(Gas_default, { width: size }),
|
|
3438
3495
|
name: "Gas costs"
|
|
3439
3496
|
});
|
|
3440
3497
|
var SpillageTolerance = makeEntry({
|
|
3441
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3498
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(ArrowBottomTop_default, { width: size }),
|
|
3442
3499
|
name: "Spillage tolerance"
|
|
3443
3500
|
});
|
|
3444
3501
|
var Route = makeEntry({
|
|
3445
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3502
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(ArrowSplit_default, { width: size }),
|
|
3446
3503
|
name: "Route"
|
|
3447
3504
|
});
|
|
3448
3505
|
var Rate = makeEntry({
|
|
3449
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3506
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(ArrowBottomTop_default, { width: size }),
|
|
3450
3507
|
name: "Rate"
|
|
3451
3508
|
});
|
|
3452
3509
|
var Fee = makeEntry({
|
|
3453
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3510
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(Gas_default, { width: size }),
|
|
3454
3511
|
name: "Fee"
|
|
3455
3512
|
});
|
|
3456
3513
|
var ETA = makeEntry({
|
|
3457
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3514
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(Clock_default, { width: size }),
|
|
3458
3515
|
name: "Estimated time"
|
|
3459
3516
|
});
|
|
3460
3517
|
var Points = makeEntry({
|
|
3461
|
-
icon: ({ size }) => /* @__PURE__ */
|
|
3518
|
+
icon: ({ size }) => /* @__PURE__ */ jsx36(Star_default, { width: size }),
|
|
3462
3519
|
name: "Points"
|
|
3463
3520
|
});
|
|
3464
3521
|
var SummaryValues = {
|
|
@@ -3475,10 +3532,10 @@ var SummaryValues = {
|
|
|
3475
3532
|
},
|
|
3476
3533
|
Values: {
|
|
3477
3534
|
Highlight: ({ children }) => {
|
|
3478
|
-
return /* @__PURE__ */
|
|
3535
|
+
return /* @__PURE__ */ jsx36("span", { className: "text-[inherit] text-brand-white-500", children });
|
|
3479
3536
|
},
|
|
3480
3537
|
Soft: ({ children }) => {
|
|
3481
|
-
return /* @__PURE__ */
|
|
3538
|
+
return /* @__PURE__ */ jsx36("span", { className: "text-[inherit]text-brand-black-50", children });
|
|
3482
3539
|
}
|
|
3483
3540
|
}
|
|
3484
3541
|
};
|
|
@@ -3487,11 +3544,11 @@ var SummaryValues = {
|
|
|
3487
3544
|
import { Slot as Slot9 } from "@radix-ui/react-slot";
|
|
3488
3545
|
import { Loader2 } from "lucide-react";
|
|
3489
3546
|
import { AnimatePresence as AnimatePresence2, motion as motion3 } from "motion/react";
|
|
3490
|
-
import
|
|
3547
|
+
import React15 from "react";
|
|
3491
3548
|
|
|
3492
3549
|
// src/@/ui/progress.tsx
|
|
3493
3550
|
import * as ProgressPrimitive from "@radix-ui/react-progress";
|
|
3494
|
-
import { jsx as
|
|
3551
|
+
import { jsx as jsx37 } from "react/jsx-runtime";
|
|
3495
3552
|
function Progress(_a) {
|
|
3496
3553
|
var _b = _a, {
|
|
3497
3554
|
className,
|
|
@@ -3500,7 +3557,7 @@ function Progress(_a) {
|
|
|
3500
3557
|
"className",
|
|
3501
3558
|
"value"
|
|
3502
3559
|
]);
|
|
3503
|
-
return /* @__PURE__ */
|
|
3560
|
+
return /* @__PURE__ */ jsx37(
|
|
3504
3561
|
ProgressPrimitive.Root,
|
|
3505
3562
|
__spreadProps(__spreadValues({
|
|
3506
3563
|
"data-slot": "progress",
|
|
@@ -3509,7 +3566,7 @@ function Progress(_a) {
|
|
|
3509
3566
|
className
|
|
3510
3567
|
)
|
|
3511
3568
|
}, props), {
|
|
3512
|
-
children: /* @__PURE__ */
|
|
3569
|
+
children: /* @__PURE__ */ jsx37(
|
|
3513
3570
|
ProgressPrimitive.Indicator,
|
|
3514
3571
|
{
|
|
3515
3572
|
"data-slot": "progress-indicator",
|
|
@@ -3522,13 +3579,13 @@ function Progress(_a) {
|
|
|
3522
3579
|
}
|
|
3523
3580
|
|
|
3524
3581
|
// src/components/molecules/timeline.tsx
|
|
3525
|
-
import { jsx as
|
|
3582
|
+
import { jsx as jsx38, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
3526
3583
|
var StatusTextMap = {
|
|
3527
3584
|
processing: "Processing",
|
|
3528
3585
|
upcoming: "Upcoming",
|
|
3529
3586
|
error: "Failed"
|
|
3530
3587
|
};
|
|
3531
|
-
var TimelineItem =
|
|
3588
|
+
var TimelineItem = React15.forwardRef(function TimelineItem2(props, ref) {
|
|
3532
3589
|
var _b, _c, _d, _e;
|
|
3533
3590
|
const _a = props, {
|
|
3534
3591
|
processingStatus,
|
|
@@ -3544,10 +3601,10 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3544
3601
|
"durationMode"
|
|
3545
3602
|
]);
|
|
3546
3603
|
const is_visually_active = processingStatus !== "upcoming";
|
|
3547
|
-
const id =
|
|
3604
|
+
const id = React15.useId();
|
|
3548
3605
|
const layoutId = `${id}/${caption}/content-2`;
|
|
3549
3606
|
const hideTime = durationMode === "none";
|
|
3550
|
-
return /* @__PURE__ */
|
|
3607
|
+
return /* @__PURE__ */ jsx38(
|
|
3551
3608
|
motion3.li,
|
|
3552
3609
|
__spreadProps(__spreadValues({
|
|
3553
3610
|
ref
|
|
@@ -3563,7 +3620,7 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3563
3620
|
},
|
|
3564
3621
|
className: "flex h-[3.5rem] items-center gap-[0.86rem] py-[0.5625rem] px-[0.75rem] ",
|
|
3565
3622
|
children: [
|
|
3566
|
-
props.level === 0 ? /* @__PURE__ */
|
|
3623
|
+
props.level === 0 ? /* @__PURE__ */ jsx38(BadgeIcon, __spreadValues({}, props.badge)) : /* @__PURE__ */ jsx38(
|
|
3567
3624
|
IconButton,
|
|
3568
3625
|
{
|
|
3569
3626
|
variant: "level_2",
|
|
@@ -3573,7 +3630,7 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3573
3630
|
style: {
|
|
3574
3631
|
boxShadow: "0 4px 24px 0 rgba(255, 255, 255, 0.05) inset"
|
|
3575
3632
|
},
|
|
3576
|
-
children: /* @__PURE__ */
|
|
3633
|
+
children: /* @__PURE__ */ jsx38(
|
|
3577
3634
|
"span",
|
|
3578
3635
|
{
|
|
3579
3636
|
className: cn(
|
|
@@ -3588,8 +3645,8 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3588
3645
|
}
|
|
3589
3646
|
),
|
|
3590
3647
|
/* @__PURE__ */ jsxs26("div", { className: "flex flex-col flex-1 gap-[calc(4/16rem)]", children: [
|
|
3591
|
-
/* @__PURE__ */
|
|
3592
|
-
/* @__PURE__ */
|
|
3648
|
+
/* @__PURE__ */ jsx38("div", { className: "text-brand-white-500 text-xs md:!text-base h-auto md:h-[1.25rem] truncate max-w-[150px] md:max-w-full", children: caption }),
|
|
3649
|
+
/* @__PURE__ */ jsx38("div", { className: "text-xs h-[1rem] text-brand-black-100", children: processingStatus === "completed" ? ((_b = props.data) == null ? void 0 : _b.transactionUrl) ? /* @__PURE__ */ jsxs26(
|
|
3593
3650
|
"a",
|
|
3594
3651
|
{
|
|
3595
3652
|
href: props.data.transactionUrl,
|
|
@@ -3597,11 +3654,11 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3597
3654
|
target: "_blank",
|
|
3598
3655
|
rel: "noopener noreferrer",
|
|
3599
3656
|
children: [
|
|
3600
|
-
/* @__PURE__ */
|
|
3601
|
-
/* @__PURE__ */
|
|
3657
|
+
/* @__PURE__ */ jsx38("span", { children: "View in explorer " }),
|
|
3658
|
+
/* @__PURE__ */ jsx38(ArrowUpRight_default, { width: "0.75rem", height: "0.75rem" })
|
|
3602
3659
|
]
|
|
3603
3660
|
}
|
|
3604
|
-
) : /* @__PURE__ */
|
|
3661
|
+
) : /* @__PURE__ */ jsx38("span", { children: props.secondary }) : /* @__PURE__ */ jsx38("span", { children: (_c = props == null ? void 0 : props.secondary) != null ? _c : StatusTextMap[processingStatus] }) })
|
|
3605
3662
|
] }),
|
|
3606
3663
|
/* @__PURE__ */ jsxs26(AnimatePresence2, { children: [
|
|
3607
3664
|
processingStatus === "completed" ? /* @__PURE__ */ jsxs26(
|
|
@@ -3613,8 +3670,8 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3613
3670
|
exit: { x: 10, opacity: 0 },
|
|
3614
3671
|
className: "flex gap-[calc(8rem/16)] items-center",
|
|
3615
3672
|
children: [
|
|
3616
|
-
!hideTime && /* @__PURE__ */
|
|
3617
|
-
/* @__PURE__ */
|
|
3673
|
+
!hideTime && /* @__PURE__ */ jsx38("span", { className: "text-[calc(13rem/16)] text-brand-black-100", children: (_d = props == null ? void 0 : props.data) == null ? void 0 : _d.completedIn }),
|
|
3674
|
+
/* @__PURE__ */ jsx38(
|
|
3618
3675
|
Check_default,
|
|
3619
3676
|
{
|
|
3620
3677
|
height: "1rem",
|
|
@@ -3634,8 +3691,8 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3634
3691
|
layoutId,
|
|
3635
3692
|
className: "flex gap-[calc(10rem/16)] items-center",
|
|
3636
3693
|
children: [
|
|
3637
|
-
!hideTime && /* @__PURE__ */
|
|
3638
|
-
/* @__PURE__ */
|
|
3694
|
+
!hideTime && /* @__PURE__ */ jsx38("span", { className: "text-[calc(13rem/16)]", children: (_e = props == null ? void 0 : props.data) == null ? void 0 : _e.eta }),
|
|
3695
|
+
/* @__PURE__ */ jsx38(
|
|
3639
3696
|
Loader2,
|
|
3640
3697
|
{
|
|
3641
3698
|
size: "1rem",
|
|
@@ -3653,13 +3710,13 @@ var TimelineItem = React14.forwardRef(function TimelineItem2(props, ref) {
|
|
|
3653
3710
|
);
|
|
3654
3711
|
});
|
|
3655
3712
|
function TimelineListGroup(props) {
|
|
3656
|
-
return /* @__PURE__ */
|
|
3713
|
+
return /* @__PURE__ */ jsx38("ul", { className: cn("flex flex-col overflow-hidden"), children: props.children });
|
|
3657
3714
|
}
|
|
3658
3715
|
function TimelineList(props) {
|
|
3659
|
-
return /* @__PURE__ */
|
|
3716
|
+
return /* @__PURE__ */ jsx38("ul", { className: "flex flex-col", children: props.children });
|
|
3660
3717
|
}
|
|
3661
|
-
var TimelineRoot =
|
|
3662
|
-
return /* @__PURE__ */
|
|
3718
|
+
var TimelineRoot = React15.forwardRef((props, ref) => {
|
|
3719
|
+
return /* @__PURE__ */ jsx38(
|
|
3663
3720
|
"ul",
|
|
3664
3721
|
__spreadProps(__spreadValues({
|
|
3665
3722
|
ref
|
|
@@ -3698,7 +3755,7 @@ function TransactionTimer(props) {
|
|
|
3698
3755
|
}
|
|
3699
3756
|
),
|
|
3700
3757
|
children: [
|
|
3701
|
-
/* @__PURE__ */
|
|
3758
|
+
/* @__PURE__ */ jsx38("span", { children: timerMessage }),
|
|
3702
3759
|
/* @__PURE__ */ jsxs26("span", { className: "text-brand-white-500", children: [
|
|
3703
3760
|
String(hours).padStart(2, "0"),
|
|
3704
3761
|
":",
|
|
@@ -3706,14 +3763,14 @@ function TransactionTimer(props) {
|
|
|
3706
3763
|
":",
|
|
3707
3764
|
String(seconds).padStart(2, "0")
|
|
3708
3765
|
] }),
|
|
3709
|
-
tooltipContent && /* @__PURE__ */
|
|
3710
|
-
/* @__PURE__ */
|
|
3711
|
-
/* @__PURE__ */
|
|
3766
|
+
tooltipContent && /* @__PURE__ */ jsx38(TooltipProvider, { children: /* @__PURE__ */ jsxs26(Tooltip, { children: [
|
|
3767
|
+
/* @__PURE__ */ jsx38(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx38("span", { children: /* @__PURE__ */ jsx38(CircleInfo_default, { width: "1em", height: "1em" }) }) }),
|
|
3768
|
+
/* @__PURE__ */ jsx38(TooltipContent, { children: /* @__PURE__ */ jsx38("p", { children: tooltipContent }) })
|
|
3712
3769
|
] }) })
|
|
3713
3770
|
]
|
|
3714
3771
|
}
|
|
3715
3772
|
),
|
|
3716
|
-
/* @__PURE__ */
|
|
3773
|
+
/* @__PURE__ */ jsx38(
|
|
3717
3774
|
Progress,
|
|
3718
3775
|
{
|
|
3719
3776
|
value: props.progress,
|
|
@@ -3737,7 +3794,7 @@ function TimerWrap(props) {
|
|
|
3737
3794
|
},
|
|
3738
3795
|
className: "flex flex-col items-stretch justify-start relative",
|
|
3739
3796
|
children: [
|
|
3740
|
-
/* @__PURE__ */
|
|
3797
|
+
/* @__PURE__ */ jsx38(
|
|
3741
3798
|
"div",
|
|
3742
3799
|
{
|
|
3743
3800
|
className: cn(
|
|
@@ -3747,7 +3804,7 @@ function TimerWrap(props) {
|
|
|
3747
3804
|
children: props.Timer
|
|
3748
3805
|
}
|
|
3749
3806
|
),
|
|
3750
|
-
/* @__PURE__ */
|
|
3807
|
+
/* @__PURE__ */ jsx38(
|
|
3751
3808
|
Slot9,
|
|
3752
3809
|
{
|
|
3753
3810
|
className: cn("min-h-[calc(56rem/11)] z-20 relative !rounded-[1rem]", {
|
|
@@ -3764,14 +3821,14 @@ function TimerWrap(props) {
|
|
|
3764
3821
|
// src/components/molecules/timeline-alt.tsx
|
|
3765
3822
|
import { Loader2 as Loader22 } from "lucide-react";
|
|
3766
3823
|
import { AnimatePresence as AnimatePresence3, motion as motion4 } from "motion/react";
|
|
3767
|
-
import
|
|
3768
|
-
import { jsx as
|
|
3824
|
+
import React16 from "react";
|
|
3825
|
+
import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
3769
3826
|
var StatusTextMap2 = {
|
|
3770
3827
|
processing: "Processing",
|
|
3771
3828
|
upcoming: "Upcoming",
|
|
3772
3829
|
error: "Failed"
|
|
3773
3830
|
};
|
|
3774
|
-
var TimelineAltItem =
|
|
3831
|
+
var TimelineAltItem = React16.forwardRef(function TimelineAltItem2(props, ref) {
|
|
3775
3832
|
var _b, _c, _d, _e;
|
|
3776
3833
|
const _a = props, {
|
|
3777
3834
|
processingStatus,
|
|
@@ -3787,10 +3844,10 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3787
3844
|
"durationMode"
|
|
3788
3845
|
]);
|
|
3789
3846
|
const is_visually_active = processingStatus !== "upcoming";
|
|
3790
|
-
const id =
|
|
3847
|
+
const id = React16.useId();
|
|
3791
3848
|
const layoutId = `${id}/${caption}/content-2`;
|
|
3792
3849
|
const hideTime = durationMode === "none";
|
|
3793
|
-
return /* @__PURE__ */
|
|
3850
|
+
return /* @__PURE__ */ jsx39(
|
|
3794
3851
|
motion4.li,
|
|
3795
3852
|
__spreadProps(__spreadValues({
|
|
3796
3853
|
ref
|
|
@@ -3802,7 +3859,7 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3802
3859
|
},
|
|
3803
3860
|
children: /* @__PURE__ */ jsxs27(motion4.div, { className: "flex items-center bordergap-[0.86rem] py-[0.75rem] px-[0.875rem] ", children: [
|
|
3804
3861
|
/* @__PURE__ */ jsxs27("div", { className: "flex flex-col flex-1 gap-[calc(4/16rem)]", children: [
|
|
3805
|
-
/* @__PURE__ */
|
|
3862
|
+
/* @__PURE__ */ jsx39(
|
|
3806
3863
|
"div",
|
|
3807
3864
|
{
|
|
3808
3865
|
className: cn(
|
|
@@ -3816,7 +3873,7 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3816
3873
|
children: caption
|
|
3817
3874
|
}
|
|
3818
3875
|
),
|
|
3819
|
-
/* @__PURE__ */
|
|
3876
|
+
/* @__PURE__ */ jsx39("div", { className: "text-xs h-[1rem] text-brand-black-100", children: processingStatus === "completed" ? ((_b = props.data) == null ? void 0 : _b.transactionUrl) ? /* @__PURE__ */ jsxs27(
|
|
3820
3877
|
"a",
|
|
3821
3878
|
{
|
|
3822
3879
|
href: props.data.transactionUrl,
|
|
@@ -3824,11 +3881,11 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3824
3881
|
target: "_blank",
|
|
3825
3882
|
rel: "noopener noreferrer",
|
|
3826
3883
|
children: [
|
|
3827
|
-
/* @__PURE__ */
|
|
3828
|
-
/* @__PURE__ */
|
|
3884
|
+
/* @__PURE__ */ jsx39("span", { children: "View in explorer " }),
|
|
3885
|
+
/* @__PURE__ */ jsx39(ArrowUpRight_default, { width: "0.75rem", height: "0.75rem" })
|
|
3829
3886
|
]
|
|
3830
3887
|
}
|
|
3831
|
-
) : /* @__PURE__ */
|
|
3888
|
+
) : /* @__PURE__ */ jsx39("span", { children: props.secondary }) : /* @__PURE__ */ jsx39("span", { children: (_c = props == null ? void 0 : props.secondary) != null ? _c : StatusTextMap2[processingStatus] }) })
|
|
3832
3889
|
] }),
|
|
3833
3890
|
/* @__PURE__ */ jsxs27(AnimatePresence3, { children: [
|
|
3834
3891
|
processingStatus === "completed" ? /* @__PURE__ */ jsxs27(
|
|
@@ -3840,7 +3897,7 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3840
3897
|
exit: { x: 10, opacity: 0 },
|
|
3841
3898
|
className: "flex gap-[calc(8rem/16)] items-center",
|
|
3842
3899
|
children: [
|
|
3843
|
-
!hideTime && /* @__PURE__ */
|
|
3900
|
+
!hideTime && /* @__PURE__ */ jsx39(
|
|
3844
3901
|
"span",
|
|
3845
3902
|
{
|
|
3846
3903
|
className: cn("text-[calc(13rem/16)] text-brand-black-100", {
|
|
@@ -3849,7 +3906,7 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3849
3906
|
children: (_d = props == null ? void 0 : props.data) == null ? void 0 : _d.completedIn
|
|
3850
3907
|
}
|
|
3851
3908
|
),
|
|
3852
|
-
/* @__PURE__ */
|
|
3909
|
+
/* @__PURE__ */ jsx39(
|
|
3853
3910
|
Check_default,
|
|
3854
3911
|
{
|
|
3855
3912
|
height: "1rem",
|
|
@@ -3869,8 +3926,8 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3869
3926
|
layoutId,
|
|
3870
3927
|
className: "flex gap-[calc(10rem/16)] items-center",
|
|
3871
3928
|
children: [
|
|
3872
|
-
!hideTime && /* @__PURE__ */
|
|
3873
|
-
/* @__PURE__ */
|
|
3929
|
+
!hideTime && /* @__PURE__ */ jsx39("span", { className: "text-[calc(13rem/16)]", children: (_e = props == null ? void 0 : props.data) == null ? void 0 : _e.eta }),
|
|
3930
|
+
/* @__PURE__ */ jsx39(
|
|
3874
3931
|
Loader22,
|
|
3875
3932
|
{
|
|
3876
3933
|
size: "1rem",
|
|
@@ -3886,7 +3943,7 @@ var TimelineAltItem = React15.forwardRef(function TimelineAltItem2(props, ref) {
|
|
|
3886
3943
|
);
|
|
3887
3944
|
});
|
|
3888
3945
|
function TimelineAltListGroup(props) {
|
|
3889
|
-
return /* @__PURE__ */
|
|
3946
|
+
return /* @__PURE__ */ jsx39(
|
|
3890
3947
|
"ul",
|
|
3891
3948
|
{
|
|
3892
3949
|
className: cn(
|
|
@@ -3897,10 +3954,10 @@ function TimelineAltListGroup(props) {
|
|
|
3897
3954
|
);
|
|
3898
3955
|
}
|
|
3899
3956
|
function TimelineAltList(props) {
|
|
3900
|
-
return /* @__PURE__ */
|
|
3957
|
+
return /* @__PURE__ */ jsx39("ul", { className: "group/list group-list flex flex-col", children: props.children });
|
|
3901
3958
|
}
|
|
3902
|
-
var TimelineAltRoot =
|
|
3903
|
-
return /* @__PURE__ */
|
|
3959
|
+
var TimelineAltRoot = React16.forwardRef((props, ref) => {
|
|
3960
|
+
return /* @__PURE__ */ jsx39(
|
|
3904
3961
|
"ul",
|
|
3905
3962
|
__spreadProps(__spreadValues({
|
|
3906
3963
|
ref
|
|
@@ -3919,7 +3976,7 @@ var TimelineAltRoot = React15.forwardRef((props, ref) => {
|
|
|
3919
3976
|
TimelineAltRoot.displayName = "TimelineAltRoot";
|
|
3920
3977
|
|
|
3921
3978
|
// src/components/molecules/toast.tsx
|
|
3922
|
-
import { Fragment as Fragment8, jsx as
|
|
3979
|
+
import { Fragment as Fragment8, jsx as jsx40, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
3923
3980
|
var SeverityConfig = {
|
|
3924
3981
|
error: {
|
|
3925
3982
|
icon: Alert_default,
|
|
@@ -3945,23 +4002,23 @@ function ToastBox(props) {
|
|
|
3945
4002
|
event.stopPropagation();
|
|
3946
4003
|
onDismiss == null ? void 0 : onDismiss(event);
|
|
3947
4004
|
};
|
|
3948
|
-
return /* @__PURE__ */
|
|
4005
|
+
return /* @__PURE__ */ jsx40(SmoothCorners, { size: "sm", children: /* @__PURE__ */ jsxs28(
|
|
3949
4006
|
"div",
|
|
3950
4007
|
{
|
|
3951
4008
|
"data-is-toast": "true",
|
|
3952
4009
|
className: "bg-brand-black-500 flex flex-col md:flex-row gap-[0.75rem] items-start py-[calc(10rem/16)] px-[calc(12rem/16)] text-muted-foreground",
|
|
3953
4010
|
children: [
|
|
3954
|
-
/* @__PURE__ */
|
|
4011
|
+
/* @__PURE__ */ jsx40(
|
|
3955
4012
|
"div",
|
|
3956
4013
|
{
|
|
3957
4014
|
className: cn("items-center justify-center shrink-0 grow-0", color),
|
|
3958
4015
|
style: { fontSize: "calc(calc(24/16) * 1rem)" },
|
|
3959
|
-
children: /* @__PURE__ */
|
|
4016
|
+
children: /* @__PURE__ */ jsx40(Icon, { width: "1em", height: "1em" })
|
|
3960
4017
|
}
|
|
3961
4018
|
),
|
|
3962
4019
|
/* @__PURE__ */ jsxs28("div", { className: "flex flex-col flex-1", children: [
|
|
3963
|
-
/* @__PURE__ */
|
|
3964
|
-
/* @__PURE__ */
|
|
4020
|
+
/* @__PURE__ */ jsx40(Text, { variant: "body1", className: "text-foreground", children: props.heading }),
|
|
4021
|
+
/* @__PURE__ */ jsx40(
|
|
3965
4022
|
Text,
|
|
3966
4023
|
{
|
|
3967
4024
|
variant: "caption2",
|
|
@@ -3970,9 +4027,9 @@ function ToastBox(props) {
|
|
|
3970
4027
|
}
|
|
3971
4028
|
)
|
|
3972
4029
|
] }),
|
|
3973
|
-
/* @__PURE__ */
|
|
3974
|
-
/* @__PURE__ */
|
|
3975
|
-
/* @__PURE__ */
|
|
4030
|
+
/* @__PURE__ */ jsx40("div", { className: "flex gap-[calc(6rem/16)] items-center self-center w-full md:w-auto", children: actions ? /* @__PURE__ */ jsxs28(Fragment8, { children: [
|
|
4031
|
+
/* @__PURE__ */ jsx40("div", { className: "flex gap-[calc(6rem/16)] flex-1 items-center *:flex-1", children: actions }),
|
|
4032
|
+
/* @__PURE__ */ jsx40(
|
|
3976
4033
|
IconButton,
|
|
3977
4034
|
{
|
|
3978
4035
|
className: "cursor-pointer",
|
|
@@ -3980,10 +4037,10 @@ function ToastBox(props) {
|
|
|
3980
4037
|
size: "smx",
|
|
3981
4038
|
variant: "level_2",
|
|
3982
4039
|
rounded: "default",
|
|
3983
|
-
children: /* @__PURE__ */
|
|
4040
|
+
children: /* @__PURE__ */ jsx40(XIcon_default, { width: "1rem" })
|
|
3984
4041
|
}
|
|
3985
4042
|
)
|
|
3986
|
-
] }) : /* @__PURE__ */
|
|
4043
|
+
] }) : /* @__PURE__ */ jsx40(
|
|
3987
4044
|
Button2,
|
|
3988
4045
|
{
|
|
3989
4046
|
size: "sm",
|
|
@@ -4000,11 +4057,11 @@ function ToastBox(props) {
|
|
|
4000
4057
|
|
|
4001
4058
|
// src/components/molecules/transaction-list.tsx
|
|
4002
4059
|
import { motion as motion5 } from "motion/react";
|
|
4003
|
-
import { Fragment as Fragment9, jsx as
|
|
4060
|
+
import { Fragment as Fragment9, jsx as jsx41, jsxs as jsxs29 } from "react/jsx-runtime";
|
|
4004
4061
|
function TxListItemProcessing(props) {
|
|
4005
4062
|
const { size = "2rem" } = props;
|
|
4006
|
-
return /* @__PURE__ */
|
|
4007
|
-
/* @__PURE__ */
|
|
4063
|
+
return /* @__PURE__ */ jsx41(GradientContainer, { children: /* @__PURE__ */ jsxs29("div", { className: "rounded-[1rem] bg-brand-black-350 px-[0.75rem] h-[3.75rem] flex items-center", children: [
|
|
4064
|
+
/* @__PURE__ */ jsx41(
|
|
4008
4065
|
GradientLine,
|
|
4009
4066
|
{
|
|
4010
4067
|
behaviour: "progress",
|
|
@@ -4013,7 +4070,7 @@ function TxListItemProcessing(props) {
|
|
|
4013
4070
|
}
|
|
4014
4071
|
),
|
|
4015
4072
|
/* @__PURE__ */ jsxs29("div", { className: "flex gap-[1rem] flex-1 z-20 text-brand-black-100 font-medium", children: [
|
|
4016
|
-
/* @__PURE__ */
|
|
4073
|
+
/* @__PURE__ */ jsx41(
|
|
4017
4074
|
TokenTransferPair,
|
|
4018
4075
|
{
|
|
4019
4076
|
fromToken: props.from,
|
|
@@ -4022,13 +4079,13 @@ function TxListItemProcessing(props) {
|
|
|
4022
4079
|
}
|
|
4023
4080
|
),
|
|
4024
4081
|
/* @__PURE__ */ jsxs29("div", { className: "flex flex-grow flex-col text-start", children: [
|
|
4025
|
-
/* @__PURE__ */
|
|
4082
|
+
/* @__PURE__ */ jsx41("span", { className: "text-brand-white-500 whitespace-nowrap text-[0.875rem] h-[1.25rem] max-w-28 md:max-w-full truncate", children: props.caption }),
|
|
4026
4083
|
/* @__PURE__ */ jsxs29(StatusBadge, { variant: props.status === "failed" ? "error" : "none", children: [
|
|
4027
4084
|
"~ ",
|
|
4028
4085
|
props.eta
|
|
4029
4086
|
] })
|
|
4030
4087
|
] }),
|
|
4031
|
-
/* @__PURE__ */
|
|
4088
|
+
/* @__PURE__ */ jsx41("div", { className: "basis-4/12 max-w-xs shrink-0 flex justify-end h-[2.25rem] whitespace-nowrap", children: /* @__PURE__ */ jsxs29(
|
|
4032
4089
|
motion5.div,
|
|
4033
4090
|
{
|
|
4034
4091
|
initial: { y: 0 },
|
|
@@ -4041,7 +4098,7 @@ function TxListItemProcessing(props) {
|
|
|
4041
4098
|
animate: { opacity: props.status === "processing" ? 1 : 0 },
|
|
4042
4099
|
className: "flex flex-col text-end h-[2.25rem]",
|
|
4043
4100
|
children: [
|
|
4044
|
-
/* @__PURE__ */
|
|
4101
|
+
/* @__PURE__ */ jsx41("span", { className: "text-base text-brand-white-500 h-[1.25rem]", children: props.amount }),
|
|
4045
4102
|
/* @__PURE__ */ jsxs29("span", { className: "text-xs h-[1rem]", children: [
|
|
4046
4103
|
props.percentage,
|
|
4047
4104
|
"%"
|
|
@@ -4055,14 +4112,14 @@ function TxListItemProcessing(props) {
|
|
|
4055
4112
|
animate: { opacity: props.status === "failed" ? 1 : 0 },
|
|
4056
4113
|
className: "flex gap-[0.75rem] items-center h-[2.25rem] justify-end",
|
|
4057
4114
|
children: [
|
|
4058
|
-
/* @__PURE__ */
|
|
4059
|
-
/* @__PURE__ */
|
|
4115
|
+
/* @__PURE__ */ jsx41("span", { className: "text-base text-brand-white-500 h-[1.25rem]", children: props.amount }),
|
|
4116
|
+
/* @__PURE__ */ jsx41(
|
|
4060
4117
|
IconButton,
|
|
4061
4118
|
{
|
|
4062
4119
|
variant: "destructive",
|
|
4063
4120
|
rounded: "default",
|
|
4064
4121
|
size: "smx",
|
|
4065
|
-
children: /* @__PURE__ */
|
|
4122
|
+
children: /* @__PURE__ */ jsx41(RotateCcw_default, { className: "size-4 text-[currentColor]" })
|
|
4066
4123
|
}
|
|
4067
4124
|
)
|
|
4068
4125
|
]
|
|
@@ -4092,7 +4149,7 @@ var TxListItem = function TxListItem2(props) {
|
|
|
4092
4149
|
"amount",
|
|
4093
4150
|
"size"
|
|
4094
4151
|
]);
|
|
4095
|
-
return /* @__PURE__ */
|
|
4152
|
+
return /* @__PURE__ */ jsx41(
|
|
4096
4153
|
"button",
|
|
4097
4154
|
__spreadProps(__spreadValues({}, rest), {
|
|
4098
4155
|
type: "button",
|
|
@@ -4101,14 +4158,14 @@ var TxListItem = function TxListItem2(props) {
|
|
|
4101
4158
|
props.className
|
|
4102
4159
|
),
|
|
4103
4160
|
children: /* @__PURE__ */ jsxs29("div", { className: "flex justify-between gap-4 flex-1 z-20 text-brand-black-100 font-medium", children: [
|
|
4104
|
-
/* @__PURE__ */
|
|
4161
|
+
/* @__PURE__ */ jsx41(TokenTransferPair, { fromToken: from, toToken: to, size }),
|
|
4105
4162
|
/* @__PURE__ */ jsxs29("div", { className: "flex flex-grow flex-col text-start whitespace-nowrap", children: [
|
|
4106
|
-
/* @__PURE__ */
|
|
4107
|
-
/* @__PURE__ */
|
|
4163
|
+
/* @__PURE__ */ jsx41("span", { className: "text-brand-white-500 text-[0.875rem] h-[1.25rem] max-w-28 md:max-w-full truncate", children: caption }),
|
|
4164
|
+
/* @__PURE__ */ jsx41(StatusBadge, { variant: mode === "rollback" ? "refunded" : "success" })
|
|
4108
4165
|
] }),
|
|
4109
4166
|
/* @__PURE__ */ jsxs29("div", { className: "shrink-0 flex flex-col text-end", children: [
|
|
4110
|
-
/* @__PURE__ */
|
|
4111
|
-
/* @__PURE__ */
|
|
4167
|
+
/* @__PURE__ */ jsx41("span", { className: "text-base text-brand-white-500 h-[1.25rem]", children: amount }),
|
|
4168
|
+
/* @__PURE__ */ jsx41("span", { className: "text-xs h-[1rem]", children: completedAt })
|
|
4112
4169
|
] })
|
|
4113
4170
|
] })
|
|
4114
4171
|
})
|
|
@@ -4120,44 +4177,44 @@ function StatusBadge({
|
|
|
4120
4177
|
}) {
|
|
4121
4178
|
return /* @__PURE__ */ jsxs29("span", { className: "text-[0.625rem] md:text-xs h-[1rem] flex items-center gap-[0.125rem]", children: [
|
|
4122
4179
|
variant === "success" ? /* @__PURE__ */ jsxs29("span", { className: "text-brand-success-400 flex items-center gap-[0.125rem]", children: [
|
|
4123
|
-
/* @__PURE__ */
|
|
4180
|
+
/* @__PURE__ */ jsx41(Check_default, { className: "size-2 md:size-3" }),
|
|
4124
4181
|
" ",
|
|
4125
|
-
/* @__PURE__ */
|
|
4182
|
+
/* @__PURE__ */ jsx41("span", { children: "Success" })
|
|
4126
4183
|
] }) : null,
|
|
4127
4184
|
variant === "refunded" ? /* @__PURE__ */ jsxs29(Fragment9, { children: [
|
|
4128
|
-
/* @__PURE__ */
|
|
4129
|
-
/* @__PURE__ */
|
|
4185
|
+
/* @__PURE__ */ jsx41(StepBack_default, { strokeWidth: 2, className: "size-2 md:size-3" }),
|
|
4186
|
+
/* @__PURE__ */ jsx41("span", { children: "Refunded" })
|
|
4130
4187
|
] }) : null,
|
|
4131
4188
|
variant === "error" ? /* @__PURE__ */ jsxs29(Fragment9, { children: [
|
|
4132
|
-
/* @__PURE__ */
|
|
4133
|
-
/* @__PURE__ */
|
|
4189
|
+
/* @__PURE__ */ jsx41(Alert_default, { className: "size-2 md:size-3 text-brand-danger-500" }),
|
|
4190
|
+
/* @__PURE__ */ jsx41("span", { className: "text-brand-danger-500", children: "Order expired" })
|
|
4134
4191
|
] }) : null,
|
|
4135
4192
|
variant === "none" ? children : null
|
|
4136
4193
|
] });
|
|
4137
4194
|
}
|
|
4138
4195
|
function TxList({ children }) {
|
|
4139
|
-
return /* @__PURE__ */
|
|
4196
|
+
return /* @__PURE__ */ jsx41("ul", { className: "flex flex-col gap-[0.5rem]", children });
|
|
4140
4197
|
}
|
|
4141
4198
|
|
|
4142
4199
|
// src/components/molecules/wallet-header.tsx
|
|
4143
4200
|
import { Slot as Slot10 } from "@radix-ui/react-slot";
|
|
4144
4201
|
import { cva as cva6 } from "class-variance-authority";
|
|
4145
4202
|
import { motion as motion6 } from "motion/react";
|
|
4146
|
-
import * as
|
|
4203
|
+
import * as React17 from "react";
|
|
4147
4204
|
|
|
4148
4205
|
// src/components/organisms/assets-collection.tsx
|
|
4149
4206
|
import * as Tab_ from "@radix-ui/react-tabs";
|
|
4150
4207
|
|
|
4151
4208
|
// src/@/ui/tabs.tsx
|
|
4152
4209
|
import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
4153
|
-
import { jsx as
|
|
4210
|
+
import { jsx as jsx42 } from "react/jsx-runtime";
|
|
4154
4211
|
function Tabs(_a) {
|
|
4155
4212
|
var _b = _a, {
|
|
4156
4213
|
className
|
|
4157
4214
|
} = _b, props = __objRest(_b, [
|
|
4158
4215
|
"className"
|
|
4159
4216
|
]);
|
|
4160
|
-
return /* @__PURE__ */
|
|
4217
|
+
return /* @__PURE__ */ jsx42(
|
|
4161
4218
|
TabsPrimitive.Root,
|
|
4162
4219
|
__spreadValues({
|
|
4163
4220
|
"data-slot": "tabs",
|
|
@@ -4171,7 +4228,7 @@ function TabsContent(_a) {
|
|
|
4171
4228
|
} = _b, props = __objRest(_b, [
|
|
4172
4229
|
"className"
|
|
4173
4230
|
]);
|
|
4174
|
-
return /* @__PURE__ */
|
|
4231
|
+
return /* @__PURE__ */ jsx42(
|
|
4175
4232
|
TabsPrimitive.Content,
|
|
4176
4233
|
__spreadValues({
|
|
4177
4234
|
"data-slot": "tabs-content",
|
|
@@ -4181,12 +4238,12 @@ function TabsContent(_a) {
|
|
|
4181
4238
|
}
|
|
4182
4239
|
|
|
4183
4240
|
// src/components/organisms/assets-collection.tsx
|
|
4184
|
-
import { jsx as
|
|
4241
|
+
import { jsx as jsx43, jsxs as jsxs30 } from "react/jsx-runtime";
|
|
4185
4242
|
function TabsList2(props) {
|
|
4186
|
-
return /* @__PURE__ */
|
|
4243
|
+
return /* @__PURE__ */ jsx43("nav", { className: "flex flex-col", children: /* @__PURE__ */ jsx43(Tab_.TabsList, { asChild: true, children: /* @__PURE__ */ jsx43("ul", { className: "flex p-0 bg-transparent gap-3", children: props.children }) }) });
|
|
4187
4244
|
}
|
|
4188
4245
|
function TabItem(props) {
|
|
4189
|
-
return /* @__PURE__ */
|
|
4246
|
+
return /* @__PURE__ */ jsx43(
|
|
4190
4247
|
Tab_.TabsTrigger,
|
|
4191
4248
|
{
|
|
4192
4249
|
value: props.value,
|
|
@@ -4208,7 +4265,7 @@ function AssetValueTrend(props) {
|
|
|
4208
4265
|
"--trend-color": isZero ? "inherit" : !isUp ? "var(--color-brand-danger-500, indigo)" : "var(--color-brand-success-400, cyan)"
|
|
4209
4266
|
},
|
|
4210
4267
|
children: [
|
|
4211
|
-
/* @__PURE__ */
|
|
4268
|
+
/* @__PURE__ */ jsx43("span", { className: "text-[var(--trend-color)]", children: /* @__PURE__ */ jsx43(
|
|
4212
4269
|
ArrowTriangleBottom_default,
|
|
4213
4270
|
{
|
|
4214
4271
|
width: "0.75rem",
|
|
@@ -4242,7 +4299,7 @@ function Balance(props) {
|
|
|
4242
4299
|
const { prefix = "$", suffix = "", formatter = currencyFormat } = props;
|
|
4243
4300
|
const is_zero = props.amount === 0;
|
|
4244
4301
|
const [int_, fraction] = formatter.format(props.amount).split(".");
|
|
4245
|
-
return /* @__PURE__ */
|
|
4302
|
+
return /* @__PURE__ */ jsx43("div", { className: "select-none", children: /* @__PURE__ */ jsxs30("span", { className: "text-[2.375rem] font-medium leading-[2.875rem] whitespace-nowrap", children: [
|
|
4246
4303
|
/* @__PURE__ */ jsxs30(
|
|
4247
4304
|
"span",
|
|
4248
4305
|
{
|
|
@@ -4267,10 +4324,10 @@ function Balance(props) {
|
|
|
4267
4324
|
}
|
|
4268
4325
|
|
|
4269
4326
|
// src/components/molecules/wallet-header.tsx
|
|
4270
|
-
import { Fragment as Fragment11, jsx as
|
|
4271
|
-
var WalletHeaderContext =
|
|
4327
|
+
import { Fragment as Fragment11, jsx as jsx44, jsxs as jsxs31 } from "react/jsx-runtime";
|
|
4328
|
+
var WalletHeaderContext = React17.createContext(null);
|
|
4272
4329
|
function useWalletHeader() {
|
|
4273
|
-
const context =
|
|
4330
|
+
const context = React17.useContext(WalletHeaderContext);
|
|
4274
4331
|
if (!context) {
|
|
4275
4332
|
throw new Error("useWalletHeader must be used within a WalletHeader");
|
|
4276
4333
|
}
|
|
@@ -4291,7 +4348,7 @@ var walletHeaderVariants = cva6(
|
|
|
4291
4348
|
}
|
|
4292
4349
|
);
|
|
4293
4350
|
var globalWalletHeaderState = null;
|
|
4294
|
-
var WalletHeader =
|
|
4351
|
+
var WalletHeader = React17.forwardRef(
|
|
4295
4352
|
(_a, ref) => {
|
|
4296
4353
|
var _b = _a, {
|
|
4297
4354
|
className,
|
|
@@ -4309,15 +4366,15 @@ var WalletHeader = React16.forwardRef(
|
|
|
4309
4366
|
"children"
|
|
4310
4367
|
]);
|
|
4311
4368
|
const Comp = asChild ? Slot10 : "div";
|
|
4312
|
-
const [show, setShow] =
|
|
4369
|
+
const [show, setShow] = React17.useState(() => {
|
|
4313
4370
|
return persistOpen && globalWalletHeaderState !== null ? globalWalletHeaderState : defaultOpen;
|
|
4314
4371
|
});
|
|
4315
|
-
|
|
4372
|
+
React17.useEffect(() => {
|
|
4316
4373
|
if (persistOpen) {
|
|
4317
4374
|
globalWalletHeaderState = show;
|
|
4318
4375
|
}
|
|
4319
4376
|
}, [show, persistOpen]);
|
|
4320
|
-
return /* @__PURE__ */
|
|
4377
|
+
return /* @__PURE__ */ jsx44(WalletHeaderContext.Provider, { value: { show, setShow }, children: /* @__PURE__ */ jsx44(
|
|
4321
4378
|
Comp,
|
|
4322
4379
|
__spreadProps(__spreadValues({
|
|
4323
4380
|
ref,
|
|
@@ -4330,10 +4387,10 @@ var WalletHeader = React16.forwardRef(
|
|
|
4330
4387
|
}
|
|
4331
4388
|
);
|
|
4332
4389
|
WalletHeader.displayName = "WalletHeader";
|
|
4333
|
-
var WalletConnectedHeader =
|
|
4390
|
+
var WalletConnectedHeader = React17.forwardRef((_a, ref) => {
|
|
4334
4391
|
var _b = _a, { className, accounts, children } = _b, props = __objRest(_b, ["className", "accounts", "children"]);
|
|
4335
4392
|
const { show: open, setShow } = useWalletHeader();
|
|
4336
|
-
return /* @__PURE__ */
|
|
4393
|
+
return /* @__PURE__ */ jsx44(
|
|
4337
4394
|
"button",
|
|
4338
4395
|
__spreadProps(__spreadValues({
|
|
4339
4396
|
ref,
|
|
@@ -4348,8 +4405,8 @@ var WalletConnectedHeader = React16.forwardRef((_a, ref) => {
|
|
|
4348
4405
|
onClick: () => setShow((e) => !e)
|
|
4349
4406
|
}, props), {
|
|
4350
4407
|
children: /* @__PURE__ */ jsxs31("div", { className: "flex w-full gap-2 justify-between items-center", children: [
|
|
4351
|
-
children || /* @__PURE__ */
|
|
4352
|
-
/* @__PURE__ */
|
|
4408
|
+
children || /* @__PURE__ */ jsx44(AccountStack, { accounts }),
|
|
4409
|
+
/* @__PURE__ */ jsx44(
|
|
4353
4410
|
IconButton,
|
|
4354
4411
|
{
|
|
4355
4412
|
variant: "level_1",
|
|
@@ -4358,7 +4415,7 @@ var WalletConnectedHeader = React16.forwardRef((_a, ref) => {
|
|
|
4358
4415
|
rounded: "full",
|
|
4359
4416
|
size: "sm",
|
|
4360
4417
|
asChild: true,
|
|
4361
|
-
children: /* @__PURE__ */
|
|
4418
|
+
children: /* @__PURE__ */ jsx44("span", { children: /* @__PURE__ */ jsx44(ChevronBottomDown_default, {}) })
|
|
4362
4419
|
}
|
|
4363
4420
|
)
|
|
4364
4421
|
] })
|
|
@@ -4366,16 +4423,16 @@ var WalletConnectedHeader = React16.forwardRef((_a, ref) => {
|
|
|
4366
4423
|
);
|
|
4367
4424
|
});
|
|
4368
4425
|
WalletConnectedHeader.displayName = "WalletConnectedHeader";
|
|
4369
|
-
var WalletHeaderContent =
|
|
4426
|
+
var WalletHeaderContent = React17.forwardRef((_a, _ref) => {
|
|
4370
4427
|
var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
|
|
4371
4428
|
const { show: open } = useWalletHeader();
|
|
4372
|
-
const containerRef =
|
|
4373
|
-
const parentRef =
|
|
4429
|
+
const containerRef = React17.useRef(null);
|
|
4430
|
+
const parentRef = React17.useRef(null);
|
|
4374
4431
|
const slideDown = {
|
|
4375
4432
|
show: { opacity: [0, 0.8, 1] },
|
|
4376
4433
|
hide: { opacity: [1, 0.25, 0] }
|
|
4377
4434
|
};
|
|
4378
|
-
|
|
4435
|
+
React17.useEffect(() => {
|
|
4379
4436
|
const updateHeight = () => {
|
|
4380
4437
|
if (containerRef.current && parentRef.current) {
|
|
4381
4438
|
const height = containerRef.current.offsetHeight;
|
|
@@ -4430,7 +4487,7 @@ var WalletHeaderContent = React16.forwardRef((_a, _ref) => {
|
|
|
4430
4487
|
"onTransitionRun",
|
|
4431
4488
|
"onTransitionCancel"
|
|
4432
4489
|
]);
|
|
4433
|
-
return /* @__PURE__ */
|
|
4490
|
+
return /* @__PURE__ */ jsx44(
|
|
4434
4491
|
motion6.div,
|
|
4435
4492
|
{
|
|
4436
4493
|
ref: parentRef,
|
|
@@ -4439,7 +4496,7 @@ var WalletHeaderContent = React16.forwardRef((_a, _ref) => {
|
|
|
4439
4496
|
className: cn("z-10 relative", {
|
|
4440
4497
|
"pointer-events-none": !open
|
|
4441
4498
|
}),
|
|
4442
|
-
children: /* @__PURE__ */
|
|
4499
|
+
children: /* @__PURE__ */ jsx44(
|
|
4443
4500
|
motion6.div,
|
|
4444
4501
|
__spreadProps(__spreadValues({
|
|
4445
4502
|
ref: containerRef,
|
|
@@ -4459,18 +4516,18 @@ var WalletHeaderContent = React16.forwardRef((_a, _ref) => {
|
|
|
4459
4516
|
);
|
|
4460
4517
|
});
|
|
4461
4518
|
WalletHeaderContent.displayName = "WalletHeaderContent";
|
|
4462
|
-
var AccountStack =
|
|
4519
|
+
var AccountStack = React17.forwardRef(
|
|
4463
4520
|
({ accounts = [] }, ref) => {
|
|
4464
4521
|
var _a, _b;
|
|
4465
|
-
return /* @__PURE__ */
|
|
4466
|
-
/* @__PURE__ */
|
|
4522
|
+
return /* @__PURE__ */ jsx44("div", { ref, className: "flex gap-[0.625rem] items-center", children: accounts.length > 0 ? /* @__PURE__ */ jsxs31(React17.Fragment, { children: [
|
|
4523
|
+
/* @__PURE__ */ jsx44("div", { className: "inline-flex -space-x-[0.3125rem]", children: accounts.map((account, index) => /* @__PURE__ */ jsx44(
|
|
4467
4524
|
"div",
|
|
4468
4525
|
{
|
|
4469
4526
|
style: {
|
|
4470
4527
|
zIndex: accounts.length - index,
|
|
4471
4528
|
position: "relative"
|
|
4472
4529
|
},
|
|
4473
|
-
children: /* @__PURE__ */
|
|
4530
|
+
children: /* @__PURE__ */ jsx44(
|
|
4474
4531
|
BadgeIcon,
|
|
4475
4532
|
{
|
|
4476
4533
|
outline: true,
|
|
@@ -4485,14 +4542,14 @@ var AccountStack = React16.forwardRef(
|
|
|
4485
4542
|
account.address
|
|
4486
4543
|
)) }),
|
|
4487
4544
|
/* @__PURE__ */ jsxs31("span", { className: "flex flex-col whitespace-nowrap", children: [
|
|
4488
|
-
/* @__PURE__ */
|
|
4545
|
+
/* @__PURE__ */ jsx44("span", { className: "text-base font-medium h-[1.25rem] text-brand-white-500", children: accounts.length > 1 ? /* @__PURE__ */ jsxs31(Fragment11, { children: [
|
|
4489
4546
|
accounts.length,
|
|
4490
4547
|
" wallets"
|
|
4491
|
-
] }) : /* @__PURE__ */
|
|
4492
|
-
/* @__PURE__ */
|
|
4548
|
+
] }) : /* @__PURE__ */ jsx44(Fragment11, { children: shortenAccountAddress((_b = (_a = accounts[0]) == null ? void 0 : _a.address) != null ? _b : "") || "--" }) }),
|
|
4549
|
+
/* @__PURE__ */ jsx44("span", { className: "text-xs text-start h-[1rem] font-medium inline-flex items-center gap-[0.125rem] text-brand-black-100", children: "Connected" })
|
|
4493
4550
|
] })
|
|
4494
4551
|
] }) : /* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-[0.625rem] select-none", children: [
|
|
4495
|
-
/* @__PURE__ */
|
|
4552
|
+
/* @__PURE__ */ jsx44(
|
|
4496
4553
|
IconButton,
|
|
4497
4554
|
{
|
|
4498
4555
|
disabled: true,
|
|
@@ -4500,22 +4557,22 @@ var AccountStack = React16.forwardRef(
|
|
|
4500
4557
|
variant: "level_2",
|
|
4501
4558
|
rounded: "full",
|
|
4502
4559
|
size: "sm",
|
|
4503
|
-
children: /* @__PURE__ */
|
|
4560
|
+
children: /* @__PURE__ */ jsx44(Wallet_default, { className: "size-5" })
|
|
4504
4561
|
}
|
|
4505
4562
|
),
|
|
4506
|
-
/* @__PURE__ */
|
|
4563
|
+
/* @__PURE__ */ jsx44("p", { className: "text-base font-medium text-brand-white-100", children: "Select an account" })
|
|
4507
4564
|
] }) });
|
|
4508
4565
|
}
|
|
4509
4566
|
);
|
|
4510
4567
|
AccountStack.displayName = "AccountStack";
|
|
4511
|
-
var WalletHeaderTabs =
|
|
4568
|
+
var WalletHeaderTabs = React17.forwardRef((_a, ref) => {
|
|
4512
4569
|
var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
|
|
4513
|
-
return /* @__PURE__ */
|
|
4570
|
+
return /* @__PURE__ */ jsx44(Tabs, __spreadProps(__spreadValues({ ref, className: cn("gap-0 pt-3", className) }, props), { children }));
|
|
4514
4571
|
});
|
|
4515
4572
|
WalletHeaderTabs.displayName = "WalletHeaderTabs";
|
|
4516
|
-
var WalletHeaderTabsList =
|
|
4573
|
+
var WalletHeaderTabsList = React17.forwardRef((_a, ref) => {
|
|
4517
4574
|
var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
|
|
4518
|
-
return /* @__PURE__ */
|
|
4575
|
+
return /* @__PURE__ */ jsx44(
|
|
4519
4576
|
TabsList2,
|
|
4520
4577
|
__spreadProps(__spreadValues({
|
|
4521
4578
|
ref,
|
|
@@ -4526,9 +4583,9 @@ var WalletHeaderTabsList = React16.forwardRef((_a, ref) => {
|
|
|
4526
4583
|
);
|
|
4527
4584
|
});
|
|
4528
4585
|
WalletHeaderTabsList.displayName = "WalletHeaderTabsList";
|
|
4529
|
-
var WalletHeaderTabItem =
|
|
4586
|
+
var WalletHeaderTabItem = React17.forwardRef((_a, ref) => {
|
|
4530
4587
|
var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
|
|
4531
|
-
return /* @__PURE__ */
|
|
4588
|
+
return /* @__PURE__ */ jsx44(
|
|
4532
4589
|
TabItem,
|
|
4533
4590
|
__spreadProps(__spreadValues({
|
|
4534
4591
|
ref,
|
|
@@ -4542,9 +4599,9 @@ var WalletHeaderTabItem = React16.forwardRef((_a, ref) => {
|
|
|
4542
4599
|
);
|
|
4543
4600
|
});
|
|
4544
4601
|
WalletHeaderTabItem.displayName = "WalletHeaderTabItem";
|
|
4545
|
-
var WalletHeaderTabsContent =
|
|
4602
|
+
var WalletHeaderTabsContent = React17.forwardRef((_a, ref) => {
|
|
4546
4603
|
var _b = _a, { className, children } = _b, props = __objRest(_b, ["className", "children"]);
|
|
4547
|
-
return /* @__PURE__ */
|
|
4604
|
+
return /* @__PURE__ */ jsx44(
|
|
4548
4605
|
TabsContent,
|
|
4549
4606
|
__spreadProps(__spreadValues({
|
|
4550
4607
|
ref,
|
|
@@ -4555,7 +4612,7 @@ var WalletHeaderTabsContent = React16.forwardRef((_a, ref) => {
|
|
|
4555
4612
|
);
|
|
4556
4613
|
});
|
|
4557
4614
|
WalletHeaderTabsContent.displayName = "WalletHeaderTabsContent";
|
|
4558
|
-
var WalletHeaderContentBlur =
|
|
4615
|
+
var WalletHeaderContentBlur = React17.forwardRef((_a, ref) => {
|
|
4559
4616
|
var _b = _a, { className, children, asChild = false } = _b, props = __objRest(_b, ["className", "children", "asChild"]);
|
|
4560
4617
|
const { show: open, setShow } = useWalletHeader();
|
|
4561
4618
|
const Comp = asChild ? Slot10 : "div";
|
|
@@ -4577,7 +4634,7 @@ var WalletHeaderContentBlur = React16.forwardRef((_a, ref) => {
|
|
|
4577
4634
|
)
|
|
4578
4635
|
}, props), {
|
|
4579
4636
|
children: [
|
|
4580
|
-
open && /* @__PURE__ */
|
|
4637
|
+
open && /* @__PURE__ */ jsx44(
|
|
4581
4638
|
"div",
|
|
4582
4639
|
{
|
|
4583
4640
|
className: "absolute inset-0 z-10",
|
|
@@ -4596,15 +4653,15 @@ var WalletHeaderContentBlur = React16.forwardRef((_a, ref) => {
|
|
|
4596
4653
|
WalletHeaderContentBlur.displayName = "WalletHeaderContentBlur";
|
|
4597
4654
|
|
|
4598
4655
|
// src/components/navigation/header.tsx
|
|
4599
|
-
import { jsx as
|
|
4656
|
+
import { jsx as jsx45 } from "react/jsx-runtime";
|
|
4600
4657
|
function HeaderGradient() {
|
|
4601
|
-
return /* @__PURE__ */
|
|
4658
|
+
return /* @__PURE__ */ jsx45("div", { className: "absolute inset-0 h-[3px] bg-gradient-brand-animated" });
|
|
4602
4659
|
}
|
|
4603
4660
|
function HeaderContent({
|
|
4604
4661
|
children,
|
|
4605
4662
|
className
|
|
4606
4663
|
}) {
|
|
4607
|
-
return /* @__PURE__ */
|
|
4664
|
+
return /* @__PURE__ */ jsx45(
|
|
4608
4665
|
"div",
|
|
4609
4666
|
{
|
|
4610
4667
|
className: cn(
|
|
@@ -4619,7 +4676,7 @@ function Header({
|
|
|
4619
4676
|
children,
|
|
4620
4677
|
className
|
|
4621
4678
|
}) {
|
|
4622
|
-
return /* @__PURE__ */
|
|
4679
|
+
return /* @__PURE__ */ jsx45(
|
|
4623
4680
|
"header",
|
|
4624
4681
|
{
|
|
4625
4682
|
className: cn(
|
|
@@ -4632,7 +4689,7 @@ function Header({
|
|
|
4632
4689
|
}
|
|
4633
4690
|
|
|
4634
4691
|
// src/components/navigation/tabs.tsx
|
|
4635
|
-
import { jsx as
|
|
4692
|
+
import { jsx as jsx46, jsxs as jsxs32 } from "react/jsx-runtime";
|
|
4636
4693
|
function TabAltHeader({
|
|
4637
4694
|
label,
|
|
4638
4695
|
isNew,
|
|
@@ -4640,7 +4697,7 @@ function TabAltHeader({
|
|
|
4640
4697
|
onClick,
|
|
4641
4698
|
className = ""
|
|
4642
4699
|
}) {
|
|
4643
|
-
return /* @__PURE__ */
|
|
4700
|
+
return /* @__PURE__ */ jsx46(
|
|
4644
4701
|
"button",
|
|
4645
4702
|
{
|
|
4646
4703
|
type: "button",
|
|
@@ -4651,8 +4708,8 @@ function TabAltHeader({
|
|
|
4651
4708
|
className
|
|
4652
4709
|
),
|
|
4653
4710
|
children: /* @__PURE__ */ jsxs32("span", { className: "relative z-10 flex items-center gap-2", children: [
|
|
4654
|
-
/* @__PURE__ */
|
|
4655
|
-
isNew && /* @__PURE__ */
|
|
4711
|
+
/* @__PURE__ */ jsx46("span", { className: "font-medium", children: label }),
|
|
4712
|
+
isNew && /* @__PURE__ */ jsx46("span", { className: "text-brand-warning-500 caption-text absolute top-0 left-[100%] w-max", children: "New" })
|
|
4656
4713
|
] })
|
|
4657
4714
|
}
|
|
4658
4715
|
);
|
|
@@ -4661,13 +4718,13 @@ function TabAltHeaders({
|
|
|
4661
4718
|
children,
|
|
4662
4719
|
className = ""
|
|
4663
4720
|
}) {
|
|
4664
|
-
return /* @__PURE__ */
|
|
4721
|
+
return /* @__PURE__ */ jsx46("div", { className: cn("flex space-x-3 mb-6", className), children });
|
|
4665
4722
|
}
|
|
4666
4723
|
function TabAltContent({
|
|
4667
4724
|
children,
|
|
4668
4725
|
className = ""
|
|
4669
4726
|
}) {
|
|
4670
|
-
return /* @__PURE__ */
|
|
4727
|
+
return /* @__PURE__ */ jsx46("div", { className, children });
|
|
4671
4728
|
}
|
|
4672
4729
|
function TabAltPanel({
|
|
4673
4730
|
id,
|
|
@@ -4676,18 +4733,32 @@ function TabAltPanel({
|
|
|
4676
4733
|
className = ""
|
|
4677
4734
|
}) {
|
|
4678
4735
|
if (activeTab !== id) return null;
|
|
4679
|
-
return /* @__PURE__ */
|
|
4736
|
+
return /* @__PURE__ */ jsx46("div", { className, children }, id);
|
|
4680
4737
|
}
|
|
4681
4738
|
function TabAlt({
|
|
4682
4739
|
children,
|
|
4683
4740
|
className = ""
|
|
4684
4741
|
}) {
|
|
4685
|
-
return /* @__PURE__ */
|
|
4742
|
+
return /* @__PURE__ */ jsx46("div", { className: cn("w-full", className), children });
|
|
4686
4743
|
}
|
|
4687
4744
|
|
|
4688
4745
|
// src/components/organisms/settings.tsx
|
|
4689
4746
|
import { useState as useState7 } from "react";
|
|
4690
|
-
|
|
4747
|
+
|
|
4748
|
+
// src/lib/form-utils.ts
|
|
4749
|
+
var createKeyDownHandler = () => {
|
|
4750
|
+
return (e) => {
|
|
4751
|
+
if (e.ctrlKey || e.metaKey || e.altKey) {
|
|
4752
|
+
return;
|
|
4753
|
+
}
|
|
4754
|
+
if (["e", "E", "+", "-"].includes(e.key) || /^[a-zA-Z]$/.test(e.key)) {
|
|
4755
|
+
e.preventDefault();
|
|
4756
|
+
}
|
|
4757
|
+
};
|
|
4758
|
+
};
|
|
4759
|
+
|
|
4760
|
+
// src/components/organisms/settings.tsx
|
|
4761
|
+
import { jsx as jsx47, jsxs as jsxs33 } from "react/jsx-runtime";
|
|
4691
4762
|
var PRESET_SLIPPAGES = ["Auto", "0.25%", "0.5%", "0.75%", "1%"];
|
|
4692
4763
|
var DEFAULT_TOOLTIP_TEXTS = {
|
|
4693
4764
|
bridge: {
|
|
@@ -4767,7 +4838,7 @@ var Settings = ({
|
|
|
4767
4838
|
title,
|
|
4768
4839
|
" settings"
|
|
4769
4840
|
] }),
|
|
4770
|
-
/* @__PURE__ */
|
|
4841
|
+
/* @__PURE__ */ jsx47(
|
|
4771
4842
|
XIcon_default,
|
|
4772
4843
|
{
|
|
4773
4844
|
className: "size-4 cursor-pointer text-brand-black-100 hover:text-white duration-200 transition-colors",
|
|
@@ -4782,31 +4853,31 @@ var Settings = ({
|
|
|
4782
4853
|
" Slippage"
|
|
4783
4854
|
] }),
|
|
4784
4855
|
/* @__PURE__ */ jsxs33(Tooltip, { children: [
|
|
4785
|
-
/* @__PURE__ */
|
|
4786
|
-
/* @__PURE__ */
|
|
4856
|
+
/* @__PURE__ */ jsx47(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx47(CircleInfo_default, { className: "size-[14px] cursor-pointer hover:text-white duration-200 transition-colors" }) }),
|
|
4857
|
+
/* @__PURE__ */ jsx47(TooltipContent, { children: /* @__PURE__ */ jsx47("p", { className: "text-caption", children: effectiveSlippageTooltip }) })
|
|
4787
4858
|
] })
|
|
4788
4859
|
] }),
|
|
4789
4860
|
/* @__PURE__ */ jsxs33("div", { className: "grid grid-cols-3 gap-2 mt-3", children: [
|
|
4790
|
-
PRESET_SLIPPAGES.map((option) => /* @__PURE__ */
|
|
4861
|
+
PRESET_SLIPPAGES.map((option) => /* @__PURE__ */ jsx47(
|
|
4791
4862
|
"div",
|
|
4792
4863
|
{
|
|
4793
4864
|
className: cn(
|
|
4794
4865
|
"relative rounded-2xl p-[1.5px]",
|
|
4795
4866
|
isSlippageSelected(option) ? "animated-gradient-border" : "bg-transparent"
|
|
4796
4867
|
),
|
|
4797
|
-
children: /* @__PURE__ */
|
|
4868
|
+
children: /* @__PURE__ */ jsx47(
|
|
4798
4869
|
"button",
|
|
4799
4870
|
{
|
|
4800
4871
|
type: "button",
|
|
4801
4872
|
onClick: () => handleSlippageSelect(option),
|
|
4802
4873
|
className: "cursor-pointer w-full rounded-[16px] bg-brand-card-100 hover:bg-brand-card-100/80 transition-colors duration-200 p-[14px] flex items-center justify-center min-h-12",
|
|
4803
|
-
children: /* @__PURE__ */
|
|
4874
|
+
children: /* @__PURE__ */ jsx47("p", { className: "body-1 font-medium", children: option })
|
|
4804
4875
|
}
|
|
4805
4876
|
)
|
|
4806
4877
|
},
|
|
4807
4878
|
option
|
|
4808
4879
|
)),
|
|
4809
|
-
/* @__PURE__ */
|
|
4880
|
+
/* @__PURE__ */ jsx47(
|
|
4810
4881
|
"div",
|
|
4811
4882
|
{
|
|
4812
4883
|
className: cn(
|
|
@@ -4814,7 +4885,7 @@ var Settings = ({
|
|
|
4814
4885
|
isCustomSlippageActive ? "animated-gradient-border" : "bg-transparent"
|
|
4815
4886
|
),
|
|
4816
4887
|
children: /* @__PURE__ */ jsxs33("div", { className: "relative bg-brand-card-100 rounded-[16px]", children: [
|
|
4817
|
-
/* @__PURE__ */
|
|
4888
|
+
/* @__PURE__ */ jsx47(
|
|
4818
4889
|
Input,
|
|
4819
4890
|
{
|
|
4820
4891
|
min: 0,
|
|
@@ -4829,7 +4900,7 @@ var Settings = ({
|
|
|
4829
4900
|
onKeyDown: handleKeyDown
|
|
4830
4901
|
}
|
|
4831
4902
|
),
|
|
4832
|
-
/* @__PURE__ */
|
|
4903
|
+
/* @__PURE__ */ jsx47("span", { className: "body-1 absolute right-4 top-1/2 -translate-y-1/2 text-brand-black-100", children: "%" })
|
|
4833
4904
|
] })
|
|
4834
4905
|
}
|
|
4835
4906
|
)
|
|
@@ -4842,12 +4913,12 @@ var Settings = ({
|
|
|
4842
4913
|
" deadline"
|
|
4843
4914
|
] }),
|
|
4844
4915
|
/* @__PURE__ */ jsxs33(Tooltip, { children: [
|
|
4845
|
-
/* @__PURE__ */
|
|
4846
|
-
/* @__PURE__ */
|
|
4916
|
+
/* @__PURE__ */ jsx47(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx47(CircleInfo_default, { className: "size-[14px] cursor-pointer hover:text-white duration-200 transition-colors" }) }),
|
|
4917
|
+
/* @__PURE__ */ jsx47(TooltipContent, { children: /* @__PURE__ */ jsx47("p", { className: "text-caption", children: effectiveDeadlineTooltip }) })
|
|
4847
4918
|
] })
|
|
4848
4919
|
] }),
|
|
4849
4920
|
/* @__PURE__ */ jsxs33("div", { className: "relative mt-3", children: [
|
|
4850
|
-
/* @__PURE__ */
|
|
4921
|
+
/* @__PURE__ */ jsx47(
|
|
4851
4922
|
Input,
|
|
4852
4923
|
{
|
|
4853
4924
|
value: customDeadline,
|
|
@@ -4860,32 +4931,32 @@ var Settings = ({
|
|
|
4860
4931
|
min: 0
|
|
4861
4932
|
}
|
|
4862
4933
|
),
|
|
4863
|
-
/* @__PURE__ */
|
|
4934
|
+
/* @__PURE__ */ jsx47("span", { className: "body-1 absolute right-4 top-1/2 -translate-y-1/2 text-brand-black-100", children: "minutes" })
|
|
4864
4935
|
] })
|
|
4865
4936
|
] })
|
|
4866
4937
|
] });
|
|
4867
4938
|
};
|
|
4868
4939
|
|
|
4869
4940
|
// src/components/organisms/bridge-settings.tsx
|
|
4870
|
-
import { jsx as
|
|
4941
|
+
import { jsx as jsx48 } from "react/jsx-runtime";
|
|
4871
4942
|
var BridgeSettings = (props) => {
|
|
4872
|
-
return /* @__PURE__ */
|
|
4943
|
+
return /* @__PURE__ */ jsx48(Settings, __spreadProps(__spreadValues({}, props), { type: "bridge" }));
|
|
4873
4944
|
};
|
|
4874
4945
|
|
|
4875
4946
|
// src/@/ui/sheet.tsx
|
|
4876
4947
|
import * as SheetPrimitive from "@radix-ui/react-dialog";
|
|
4877
|
-
import { jsx as
|
|
4948
|
+
import { jsx as jsx49, jsxs as jsxs34 } from "react/jsx-runtime";
|
|
4878
4949
|
function Sheet(_a) {
|
|
4879
4950
|
var props = __objRest(_a, []);
|
|
4880
|
-
return /* @__PURE__ */
|
|
4951
|
+
return /* @__PURE__ */ jsx49(SheetPrimitive.Root, __spreadValues({ "data-slot": "sheet" }, props));
|
|
4881
4952
|
}
|
|
4882
4953
|
function SheetTrigger(_a) {
|
|
4883
4954
|
var props = __objRest(_a, []);
|
|
4884
|
-
return /* @__PURE__ */
|
|
4955
|
+
return /* @__PURE__ */ jsx49(SheetPrimitive.Trigger, __spreadValues({ "data-slot": "sheet-trigger" }, props));
|
|
4885
4956
|
}
|
|
4886
4957
|
function SheetPortal(_a) {
|
|
4887
4958
|
var props = __objRest(_a, []);
|
|
4888
|
-
return /* @__PURE__ */
|
|
4959
|
+
return /* @__PURE__ */ jsx49(SheetPrimitive.Portal, __spreadValues({ "data-slot": "sheet-portal" }, props));
|
|
4889
4960
|
}
|
|
4890
4961
|
function SheetOverlay(_a) {
|
|
4891
4962
|
var _b = _a, {
|
|
@@ -4893,7 +4964,7 @@ function SheetOverlay(_a) {
|
|
|
4893
4964
|
} = _b, props = __objRest(_b, [
|
|
4894
4965
|
"className"
|
|
4895
4966
|
]);
|
|
4896
|
-
return /* @__PURE__ */
|
|
4967
|
+
return /* @__PURE__ */ jsx49(
|
|
4897
4968
|
SheetPrimitive.Overlay,
|
|
4898
4969
|
__spreadValues({
|
|
4899
4970
|
"data-slot": "sheet-overlay",
|
|
@@ -4915,7 +4986,7 @@ function SheetContent(_a) {
|
|
|
4915
4986
|
"side"
|
|
4916
4987
|
]);
|
|
4917
4988
|
return /* @__PURE__ */ jsxs34(SheetPortal, { children: [
|
|
4918
|
-
/* @__PURE__ */
|
|
4989
|
+
/* @__PURE__ */ jsx49(SheetOverlay, {}),
|
|
4919
4990
|
/* @__PURE__ */ jsxs34(
|
|
4920
4991
|
SheetPrimitive.Content,
|
|
4921
4992
|
__spreadProps(__spreadValues({
|
|
@@ -4931,7 +5002,7 @@ function SheetContent(_a) {
|
|
|
4931
5002
|
}, props), {
|
|
4932
5003
|
children: [
|
|
4933
5004
|
children,
|
|
4934
|
-
/* @__PURE__ */
|
|
5005
|
+
/* @__PURE__ */ jsx49(
|
|
4935
5006
|
SheetPrimitive.Close,
|
|
4936
5007
|
{
|
|
4937
5008
|
asChild: true,
|
|
@@ -4944,8 +5015,8 @@ function SheetContent(_a) {
|
|
|
4944
5015
|
rounded: "full",
|
|
4945
5016
|
size: "sm",
|
|
4946
5017
|
children: [
|
|
4947
|
-
/* @__PURE__ */
|
|
4948
|
-
/* @__PURE__ */
|
|
5018
|
+
/* @__PURE__ */ jsx49(ChevronDoubleRight_default, { className: "size-4 text-brand-black-100" }),
|
|
5019
|
+
/* @__PURE__ */ jsx49("span", { className: "sr-only", children: "Close" })
|
|
4949
5020
|
]
|
|
4950
5021
|
}
|
|
4951
5022
|
)
|
|
@@ -4958,7 +5029,7 @@ function SheetContent(_a) {
|
|
|
4958
5029
|
}
|
|
4959
5030
|
function SheetHeader(_a) {
|
|
4960
5031
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
4961
|
-
return /* @__PURE__ */
|
|
5032
|
+
return /* @__PURE__ */ jsx49(
|
|
4962
5033
|
"div",
|
|
4963
5034
|
__spreadValues({
|
|
4964
5035
|
"data-slot": "sheet-header",
|
|
@@ -4969,22 +5040,22 @@ function SheetHeader(_a) {
|
|
|
4969
5040
|
|
|
4970
5041
|
// src/components/navigation/hyperbridge-drawer.tsx
|
|
4971
5042
|
import { Drawer as DrawerPrimitive2 } from "vaul";
|
|
4972
|
-
import { Fragment as Fragment12, jsx as
|
|
5043
|
+
import { Fragment as Fragment12, jsx as jsx50, jsxs as jsxs35 } from "react/jsx-runtime";
|
|
4973
5044
|
function HBDrawer(_a) {
|
|
4974
5045
|
var props = __objRest(_a, []);
|
|
4975
|
-
return /* @__PURE__ */
|
|
5046
|
+
return /* @__PURE__ */ jsx50(DrawerPrimitive2.Root, __spreadValues({ "data-slot": "hb-drawer" }, props));
|
|
4976
5047
|
}
|
|
4977
5048
|
function HBDrawerTrigger(_a) {
|
|
4978
5049
|
var props = __objRest(_a, []);
|
|
4979
|
-
return /* @__PURE__ */
|
|
5050
|
+
return /* @__PURE__ */ jsx50(DrawerPrimitive2.Trigger, __spreadValues({ "data-slot": "hb-drawer-trigger" }, props));
|
|
4980
5051
|
}
|
|
4981
5052
|
function HBDrawerPortal(_a) {
|
|
4982
5053
|
var props = __objRest(_a, []);
|
|
4983
|
-
return /* @__PURE__ */
|
|
5054
|
+
return /* @__PURE__ */ jsx50(DrawerPrimitive2.Portal, __spreadValues({ "data-slot": "hb-drawer-portal" }, props));
|
|
4984
5055
|
}
|
|
4985
5056
|
function HBDrawerClose(_a) {
|
|
4986
5057
|
var props = __objRest(_a, []);
|
|
4987
|
-
return /* @__PURE__ */
|
|
5058
|
+
return /* @__PURE__ */ jsx50(DrawerPrimitive2.Close, __spreadValues({ "data-slot": "hb-drawer-close" }, props));
|
|
4988
5059
|
}
|
|
4989
5060
|
function HBDrawerOverlay(_a) {
|
|
4990
5061
|
var _b = _a, {
|
|
@@ -4992,7 +5063,7 @@ function HBDrawerOverlay(_a) {
|
|
|
4992
5063
|
} = _b, props = __objRest(_b, [
|
|
4993
5064
|
"className"
|
|
4994
5065
|
]);
|
|
4995
|
-
return /* @__PURE__ */
|
|
5066
|
+
return /* @__PURE__ */ jsx50(
|
|
4996
5067
|
DrawerPrimitive2.Overlay,
|
|
4997
5068
|
__spreadValues({
|
|
4998
5069
|
"data-slot": "hb-drawer-overlay",
|
|
@@ -5012,8 +5083,8 @@ function HBDrawerContent(_a) {
|
|
|
5012
5083
|
"children"
|
|
5013
5084
|
]);
|
|
5014
5085
|
return /* @__PURE__ */ jsxs35(Fragment12, { children: [
|
|
5015
|
-
/* @__PURE__ */
|
|
5016
|
-
/* @__PURE__ */
|
|
5086
|
+
/* @__PURE__ */ jsx50(HBDrawerPortal, {}),
|
|
5087
|
+
/* @__PURE__ */ jsx50(HBDrawerOverlay, {}),
|
|
5017
5088
|
/* @__PURE__ */ jsxs35(
|
|
5018
5089
|
DrawerPrimitive2.Content,
|
|
5019
5090
|
__spreadProps(__spreadValues({
|
|
@@ -5028,7 +5099,7 @@ function HBDrawerContent(_a) {
|
|
|
5028
5099
|
)
|
|
5029
5100
|
}, props), {
|
|
5030
5101
|
children: [
|
|
5031
|
-
/* @__PURE__ */
|
|
5102
|
+
/* @__PURE__ */ jsx50("div", { className: "bg-brand-black-350 mx-auto my-2 hidden h-[5px] w-16 shrink-0 rounded-[2.5px] group-data-[vaul-drawer-direction=bottom]/drawer-content:block" }),
|
|
5032
5103
|
children
|
|
5033
5104
|
]
|
|
5034
5105
|
})
|
|
@@ -5037,7 +5108,7 @@ function HBDrawerContent(_a) {
|
|
|
5037
5108
|
}
|
|
5038
5109
|
function HBDrawerHeader(_a) {
|
|
5039
5110
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
5040
|
-
return /* @__PURE__ */
|
|
5111
|
+
return /* @__PURE__ */ jsx50(
|
|
5041
5112
|
"div",
|
|
5042
5113
|
__spreadValues({
|
|
5043
5114
|
"data-slot": "hb-drawer-header",
|
|
@@ -5050,7 +5121,7 @@ function HBDrawerHeader(_a) {
|
|
|
5050
5121
|
}
|
|
5051
5122
|
function HBDrawerFooter(_a) {
|
|
5052
5123
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
5053
|
-
return /* @__PURE__ */
|
|
5124
|
+
return /* @__PURE__ */ jsx50(
|
|
5054
5125
|
"div",
|
|
5055
5126
|
__spreadValues({
|
|
5056
5127
|
"data-slot": "hb-drawer-footer",
|
|
@@ -5064,7 +5135,7 @@ function HBDrawerTitle(_a) {
|
|
|
5064
5135
|
} = _b, props = __objRest(_b, [
|
|
5065
5136
|
"className"
|
|
5066
5137
|
]);
|
|
5067
|
-
return /* @__PURE__ */
|
|
5138
|
+
return /* @__PURE__ */ jsx50(
|
|
5068
5139
|
DrawerPrimitive2.Title,
|
|
5069
5140
|
__spreadValues({
|
|
5070
5141
|
"data-slot": "hb-drawer-title",
|
|
@@ -5078,7 +5149,7 @@ function HBDrawerDescription(_a) {
|
|
|
5078
5149
|
} = _b, props = __objRest(_b, [
|
|
5079
5150
|
"className"
|
|
5080
5151
|
]);
|
|
5081
|
-
return /* @__PURE__ */
|
|
5152
|
+
return /* @__PURE__ */ jsx50(
|
|
5082
5153
|
DrawerPrimitive2.Description,
|
|
5083
5154
|
__spreadValues({
|
|
5084
5155
|
"data-slot": "hb-drawer-description",
|
|
@@ -5088,14 +5159,14 @@ function HBDrawerDescription(_a) {
|
|
|
5088
5159
|
}
|
|
5089
5160
|
|
|
5090
5161
|
// src/components/organisms/manage-account.tsx
|
|
5091
|
-
import { jsx as
|
|
5162
|
+
import { jsx as jsx51, jsxs as jsxs36 } from "react/jsx-runtime";
|
|
5092
5163
|
function ManageAccounts() {
|
|
5093
5164
|
console.warn("ManageAccounts is deprecated");
|
|
5094
5165
|
return null;
|
|
5095
5166
|
}
|
|
5096
5167
|
function HeaderChooseProvider() {
|
|
5097
|
-
return /* @__PURE__ */
|
|
5098
|
-
/* @__PURE__ */
|
|
5168
|
+
return /* @__PURE__ */ jsx51(SheetHeader, { className: "p-[1rem] -mx-[1rem]", children: /* @__PURE__ */ jsxs36("div", { className: "flex items-center gap-[0.625rem] select-none", children: [
|
|
5169
|
+
/* @__PURE__ */ jsx51(
|
|
5099
5170
|
IconButton,
|
|
5100
5171
|
{
|
|
5101
5172
|
disabled: true,
|
|
@@ -5103,17 +5174,17 @@ function HeaderChooseProvider() {
|
|
|
5103
5174
|
variant: "level_2",
|
|
5104
5175
|
rounded: "full",
|
|
5105
5176
|
size: "sm",
|
|
5106
|
-
children: /* @__PURE__ */
|
|
5177
|
+
children: /* @__PURE__ */ jsx51(Wallet_default, { className: "size-5" })
|
|
5107
5178
|
}
|
|
5108
5179
|
),
|
|
5109
|
-
/* @__PURE__ */
|
|
5180
|
+
/* @__PURE__ */ jsx51("span", { className: "text-base font-medium text-brand-white-100", children: "Connect Your Wallet" })
|
|
5110
5181
|
] }) });
|
|
5111
5182
|
}
|
|
5112
5183
|
function HeaderNested(props) {
|
|
5113
5184
|
var _a;
|
|
5114
5185
|
const { heading, image, onBack, hideBackButton } = props;
|
|
5115
|
-
return /* @__PURE__ */
|
|
5116
|
-
/* @__PURE__ */
|
|
5186
|
+
return /* @__PURE__ */ jsx51("div", { className: "p-[1rem] -mx-[1rem]", children: /* @__PURE__ */ jsxs36("div", { className: "flex items-center gap-[0.625rem] select-none", children: [
|
|
5187
|
+
/* @__PURE__ */ jsx51(
|
|
5117
5188
|
TokenImage,
|
|
5118
5189
|
{
|
|
5119
5190
|
src: image.src,
|
|
@@ -5121,15 +5192,15 @@ function HeaderNested(props) {
|
|
|
5121
5192
|
alt: (_a = image.alt) != null ? _a : heading
|
|
5122
5193
|
}
|
|
5123
5194
|
),
|
|
5124
|
-
/* @__PURE__ */
|
|
5125
|
-
!hideBackButton && /* @__PURE__ */
|
|
5195
|
+
/* @__PURE__ */ jsx51("div", { className: "text-brand-white-100 flex-1", children: /* @__PURE__ */ jsx51("span", { className: "text-base font-medium", children: heading }) }),
|
|
5196
|
+
!hideBackButton && /* @__PURE__ */ jsx51(
|
|
5126
5197
|
IconButton,
|
|
5127
5198
|
{
|
|
5128
5199
|
variant: "level_1",
|
|
5129
5200
|
rounded: "full",
|
|
5130
5201
|
size: "sm",
|
|
5131
5202
|
onClick: onBack,
|
|
5132
|
-
children: /* @__PURE__ */
|
|
5203
|
+
children: /* @__PURE__ */ jsx51(
|
|
5133
5204
|
StepBack_default,
|
|
5134
5205
|
{
|
|
5135
5206
|
width: "1rem",
|
|
@@ -5147,8 +5218,8 @@ function ListSection({
|
|
|
5147
5218
|
contentClassName
|
|
5148
5219
|
}) {
|
|
5149
5220
|
return /* @__PURE__ */ jsxs36("div", { className: "flex flex-col gap-y-[0.375rem]", children: [
|
|
5150
|
-
/* @__PURE__ */
|
|
5151
|
-
/* @__PURE__ */
|
|
5221
|
+
/* @__PURE__ */ jsx51("div", { className: "text-caption text-brand-black-100 select-none font-normal", children: caption }),
|
|
5222
|
+
/* @__PURE__ */ jsx51("div", { className: cn("flex flex-col gap-2", contentClassName), children })
|
|
5152
5223
|
] });
|
|
5153
5224
|
}
|
|
5154
5225
|
function CWDrawerContent(_a) {
|
|
@@ -5160,7 +5231,7 @@ function CWDrawerContent(_a) {
|
|
|
5160
5231
|
const isMobile = useIsMobile();
|
|
5161
5232
|
const viewportHeight = useViewportHeight(isMobile);
|
|
5162
5233
|
if (isMobile) {
|
|
5163
|
-
return /* @__PURE__ */
|
|
5234
|
+
return /* @__PURE__ */ jsx51(
|
|
5164
5235
|
HBDrawerContent,
|
|
5165
5236
|
{
|
|
5166
5237
|
className: "bg-brand-black-550 rounded-t-[1rem] w-full px-[1rem] border-t border-brand-black-300",
|
|
@@ -5171,30 +5242,30 @@ function CWDrawerContent(_a) {
|
|
|
5171
5242
|
} : {
|
|
5172
5243
|
minHeight: "90dvh"
|
|
5173
5244
|
},
|
|
5174
|
-
children: /* @__PURE__ */
|
|
5245
|
+
children: /* @__PURE__ */ jsx51("div", { className: "flex flex-col flex-1", children })
|
|
5175
5246
|
}
|
|
5176
5247
|
);
|
|
5177
5248
|
}
|
|
5178
|
-
return /* @__PURE__ */
|
|
5249
|
+
return /* @__PURE__ */ jsx51(
|
|
5179
5250
|
SheetContent,
|
|
5180
5251
|
__spreadProps(__spreadValues({}, props), {
|
|
5181
5252
|
side: "right",
|
|
5182
5253
|
className: "h-full max-h-auto max-w-[calc(29.75rem_+_1.25rem)] select-none border-none shadow-none text-brand-white-500 w-full sm:w-[540px] bg-transparent p-[0.625rem]",
|
|
5183
|
-
children: /* @__PURE__ */
|
|
5254
|
+
children: /* @__PURE__ */ jsx51("div", { className: "bg-brand-black-550 flex-1 flex flex-col rounded-[1rem] px-[1rem] overflow-hidden", children })
|
|
5184
5255
|
})
|
|
5185
5256
|
);
|
|
5186
5257
|
}
|
|
5187
5258
|
|
|
5188
5259
|
// src/components/tokens/swap-token-selector.tsx
|
|
5189
5260
|
import { useRef as useRef3 } from "react";
|
|
5190
|
-
import { jsx as
|
|
5261
|
+
import { jsx as jsx52, jsxs as jsxs37 } from "react/jsx-runtime";
|
|
5191
5262
|
var SwapTokenSelector = ({
|
|
5192
5263
|
isOpen,
|
|
5193
5264
|
onClose,
|
|
5194
5265
|
children,
|
|
5195
5266
|
className
|
|
5196
5267
|
}) => {
|
|
5197
|
-
return /* @__PURE__ */
|
|
5268
|
+
return /* @__PURE__ */ jsx52(Modal, { isOpen, onClose, className, children });
|
|
5198
5269
|
};
|
|
5199
5270
|
var SwapTokenSelectorHeader = ({
|
|
5200
5271
|
title,
|
|
@@ -5211,8 +5282,8 @@ var SwapTokenSelectorHeader = ({
|
|
|
5211
5282
|
),
|
|
5212
5283
|
children: [
|
|
5213
5284
|
/* @__PURE__ */ jsxs37("div", { className: "flex items-center justify-between", children: [
|
|
5214
|
-
title && /* @__PURE__ */
|
|
5215
|
-
onClose && /* @__PURE__ */
|
|
5285
|
+
title && /* @__PURE__ */ jsx52("div", { className: "body-1 font-medium text-white max-w-[200px] break-words", children: title }),
|
|
5286
|
+
onClose && /* @__PURE__ */ jsx52(
|
|
5216
5287
|
XIcon_default,
|
|
5217
5288
|
{
|
|
5218
5289
|
className: "size-4 cursor-pointer text-brand-black-100 hover:text-white duration-200 transition-colors",
|
|
@@ -5229,7 +5300,7 @@ var SwapTokenSelectorSearch = ({
|
|
|
5229
5300
|
children,
|
|
5230
5301
|
className
|
|
5231
5302
|
}) => {
|
|
5232
|
-
return /* @__PURE__ */
|
|
5303
|
+
return /* @__PURE__ */ jsx52("div", { className: cn("mt-4", className), children });
|
|
5233
5304
|
};
|
|
5234
5305
|
var SwapTokenSelectorContent = ({
|
|
5235
5306
|
children,
|
|
@@ -5237,8 +5308,8 @@ var SwapTokenSelectorContent = ({
|
|
|
5237
5308
|
}) => {
|
|
5238
5309
|
const scrollRef = useRef3(null);
|
|
5239
5310
|
return /* @__PURE__ */ jsxs37("div", { className: "relative flex-1 flex flex-col min-h-0", children: [
|
|
5240
|
-
/* @__PURE__ */
|
|
5241
|
-
/* @__PURE__ */
|
|
5311
|
+
/* @__PURE__ */ jsx52(ScrollAwareSeparator, { scrollRef }),
|
|
5312
|
+
/* @__PURE__ */ jsx52(ScrollArea, { ref: scrollRef, className: "h-full", children: /* @__PURE__ */ jsx52("div", { className: cn("px-6 pb-6 space-y-4", className), children }) })
|
|
5242
5313
|
] });
|
|
5243
5314
|
};
|
|
5244
5315
|
var SwapTokenSelectorSection = ({
|
|
@@ -5247,15 +5318,15 @@ var SwapTokenSelectorSection = ({
|
|
|
5247
5318
|
className
|
|
5248
5319
|
}) => {
|
|
5249
5320
|
return /* @__PURE__ */ jsxs37("div", { className: cn("flex flex-col", className), children: [
|
|
5250
|
-
title && /* @__PURE__ */
|
|
5251
|
-
/* @__PURE__ */
|
|
5321
|
+
title && /* @__PURE__ */ jsx52("p", { className: "text-caption text-brand-black-100 mb-2", children: title }),
|
|
5322
|
+
/* @__PURE__ */ jsx52("div", { className: "space-y-2", children })
|
|
5252
5323
|
] });
|
|
5253
5324
|
};
|
|
5254
5325
|
var SwapTokenSelectorEmpty = ({
|
|
5255
5326
|
children,
|
|
5256
5327
|
className
|
|
5257
5328
|
}) => {
|
|
5258
|
-
return /* @__PURE__ */
|
|
5329
|
+
return /* @__PURE__ */ jsx52(
|
|
5259
5330
|
"div",
|
|
5260
5331
|
{
|
|
5261
5332
|
className: cn(
|
|
@@ -5276,7 +5347,7 @@ var SwapTokenItem = ({
|
|
|
5276
5347
|
amount,
|
|
5277
5348
|
usdValue
|
|
5278
5349
|
}) => {
|
|
5279
|
-
return /* @__PURE__ */
|
|
5350
|
+
return /* @__PURE__ */ jsx52(
|
|
5280
5351
|
"div",
|
|
5281
5352
|
{
|
|
5282
5353
|
className: cn(
|
|
@@ -5292,7 +5363,7 @@ var SwapTokenItem = ({
|
|
|
5292
5363
|
onClick,
|
|
5293
5364
|
children: [
|
|
5294
5365
|
/* @__PURE__ */ jsxs37("div", { className: "flex items-center text-start gap-3", children: [
|
|
5295
|
-
/* @__PURE__ */
|
|
5366
|
+
/* @__PURE__ */ jsx52(
|
|
5296
5367
|
BadgeIcon,
|
|
5297
5368
|
{
|
|
5298
5369
|
src: token.image,
|
|
@@ -5302,13 +5373,13 @@ var SwapTokenItem = ({
|
|
|
5302
5373
|
}
|
|
5303
5374
|
),
|
|
5304
5375
|
/* @__PURE__ */ jsxs37("div", { className: "flex flex-col gap-[2px] items-start", children: [
|
|
5305
|
-
/* @__PURE__ */
|
|
5376
|
+
/* @__PURE__ */ jsx52("p", { className: "body-1 font-medium text-white", children: token.name }),
|
|
5306
5377
|
address
|
|
5307
5378
|
] })
|
|
5308
5379
|
] }),
|
|
5309
5380
|
/* @__PURE__ */ jsxs37("div", { className: "flex flex-col items-end gap-[2px]", children: [
|
|
5310
|
-
/* @__PURE__ */
|
|
5311
|
-
/* @__PURE__ */
|
|
5381
|
+
/* @__PURE__ */ jsx52("p", { className: "body-1 font-medium text-white", children: amount }),
|
|
5382
|
+
/* @__PURE__ */ jsx52("p", { className: "text-caption text-brand-black-100", children: usdValue })
|
|
5312
5383
|
] })
|
|
5313
5384
|
]
|
|
5314
5385
|
}
|
|
@@ -5320,18 +5391,18 @@ var SwapTokenItem = ({
|
|
|
5320
5391
|
// src/@/ui/dropdown-menu.tsx
|
|
5321
5392
|
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
|
|
5322
5393
|
import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
|
|
5323
|
-
import { jsx as
|
|
5394
|
+
import { jsx as jsx53, jsxs as jsxs38 } from "react/jsx-runtime";
|
|
5324
5395
|
function DropdownMenu(_a) {
|
|
5325
5396
|
var props = __objRest(_a, []);
|
|
5326
|
-
return /* @__PURE__ */
|
|
5397
|
+
return /* @__PURE__ */ jsx53(DropdownMenuPrimitive.Root, __spreadValues({ "data-slot": "dropdown-menu" }, props));
|
|
5327
5398
|
}
|
|
5328
5399
|
function DropdownMenuPortal(_a) {
|
|
5329
5400
|
var props = __objRest(_a, []);
|
|
5330
|
-
return /* @__PURE__ */
|
|
5401
|
+
return /* @__PURE__ */ jsx53(DropdownMenuPrimitive.Portal, __spreadValues({ "data-slot": "dropdown-menu-portal" }, props));
|
|
5331
5402
|
}
|
|
5332
5403
|
function DropdownMenuTrigger(_a) {
|
|
5333
5404
|
var props = __objRest(_a, []);
|
|
5334
|
-
return /* @__PURE__ */
|
|
5405
|
+
return /* @__PURE__ */ jsx53(
|
|
5335
5406
|
DropdownMenuPrimitive.Trigger,
|
|
5336
5407
|
__spreadValues({
|
|
5337
5408
|
"data-slot": "dropdown-menu-trigger"
|
|
@@ -5346,7 +5417,7 @@ function DropdownMenuContent(_a) {
|
|
|
5346
5417
|
"className",
|
|
5347
5418
|
"sideOffset"
|
|
5348
5419
|
]);
|
|
5349
|
-
return /* @__PURE__ */
|
|
5420
|
+
return /* @__PURE__ */ jsx53(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx53(
|
|
5350
5421
|
DropdownMenuPrimitive.Content,
|
|
5351
5422
|
__spreadValues({
|
|
5352
5423
|
"data-slot": "dropdown-menu-content",
|
|
@@ -5360,7 +5431,7 @@ function DropdownMenuContent(_a) {
|
|
|
5360
5431
|
}
|
|
5361
5432
|
function DropdownMenuGroup(_a) {
|
|
5362
5433
|
var props = __objRest(_a, []);
|
|
5363
|
-
return /* @__PURE__ */
|
|
5434
|
+
return /* @__PURE__ */ jsx53(DropdownMenuPrimitive.Group, __spreadValues({ "data-slot": "dropdown-menu-group" }, props));
|
|
5364
5435
|
}
|
|
5365
5436
|
function DropdownMenuItem(_a) {
|
|
5366
5437
|
var _b = _a, {
|
|
@@ -5372,7 +5443,7 @@ function DropdownMenuItem(_a) {
|
|
|
5372
5443
|
"inset",
|
|
5373
5444
|
"variant"
|
|
5374
5445
|
]);
|
|
5375
|
-
return /* @__PURE__ */
|
|
5446
|
+
return /* @__PURE__ */ jsx53(
|
|
5376
5447
|
DropdownMenuPrimitive.Item,
|
|
5377
5448
|
__spreadValues({
|
|
5378
5449
|
"data-slot": "dropdown-menu-item",
|
|
@@ -5406,7 +5477,7 @@ function DropdownMenuCheckboxItem(_a) {
|
|
|
5406
5477
|
checked
|
|
5407
5478
|
}, props), {
|
|
5408
5479
|
children: [
|
|
5409
|
-
/* @__PURE__ */
|
|
5480
|
+
/* @__PURE__ */ jsx53("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx53(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx53(CheckIcon, { className: "size-4" }) }) }),
|
|
5410
5481
|
children
|
|
5411
5482
|
]
|
|
5412
5483
|
})
|
|
@@ -5414,7 +5485,7 @@ function DropdownMenuCheckboxItem(_a) {
|
|
|
5414
5485
|
}
|
|
5415
5486
|
function DropdownMenuRadioGroup(_a) {
|
|
5416
5487
|
var props = __objRest(_a, []);
|
|
5417
|
-
return /* @__PURE__ */
|
|
5488
|
+
return /* @__PURE__ */ jsx53(
|
|
5418
5489
|
DropdownMenuPrimitive.RadioGroup,
|
|
5419
5490
|
__spreadValues({
|
|
5420
5491
|
"data-slot": "dropdown-menu-radio-group"
|
|
@@ -5439,7 +5510,7 @@ function DropdownMenuRadioItem(_a) {
|
|
|
5439
5510
|
)
|
|
5440
5511
|
}, props), {
|
|
5441
5512
|
children: [
|
|
5442
|
-
/* @__PURE__ */
|
|
5513
|
+
/* @__PURE__ */ jsx53("span", { className: "pointer-events-none absolute left-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsx53(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx53(CircleIcon, { className: "size-2 fill-current" }) }) }),
|
|
5443
5514
|
children
|
|
5444
5515
|
]
|
|
5445
5516
|
})
|
|
@@ -5453,7 +5524,7 @@ function DropdownMenuLabel(_a) {
|
|
|
5453
5524
|
"className",
|
|
5454
5525
|
"inset"
|
|
5455
5526
|
]);
|
|
5456
|
-
return /* @__PURE__ */
|
|
5527
|
+
return /* @__PURE__ */ jsx53(
|
|
5457
5528
|
DropdownMenuPrimitive.Label,
|
|
5458
5529
|
__spreadValues({
|
|
5459
5530
|
"data-slot": "dropdown-menu-label",
|
|
@@ -5471,7 +5542,7 @@ function DropdownMenuSeparator(_a) {
|
|
|
5471
5542
|
} = _b, props = __objRest(_b, [
|
|
5472
5543
|
"className"
|
|
5473
5544
|
]);
|
|
5474
|
-
return /* @__PURE__ */
|
|
5545
|
+
return /* @__PURE__ */ jsx53(
|
|
5475
5546
|
DropdownMenuPrimitive.Separator,
|
|
5476
5547
|
__spreadValues({
|
|
5477
5548
|
"data-slot": "dropdown-menu-separator",
|
|
@@ -5485,7 +5556,7 @@ function DropdownMenuShortcut(_a) {
|
|
|
5485
5556
|
} = _b, props = __objRest(_b, [
|
|
5486
5557
|
"className"
|
|
5487
5558
|
]);
|
|
5488
|
-
return /* @__PURE__ */
|
|
5559
|
+
return /* @__PURE__ */ jsx53(
|
|
5489
5560
|
"span",
|
|
5490
5561
|
__spreadValues({
|
|
5491
5562
|
"data-slot": "dropdown-menu-shortcut",
|
|
@@ -5498,7 +5569,7 @@ function DropdownMenuShortcut(_a) {
|
|
|
5498
5569
|
}
|
|
5499
5570
|
function DropdownMenuSub(_a) {
|
|
5500
5571
|
var props = __objRest(_a, []);
|
|
5501
|
-
return /* @__PURE__ */
|
|
5572
|
+
return /* @__PURE__ */ jsx53(DropdownMenuPrimitive.Sub, __spreadValues({ "data-slot": "dropdown-menu-sub" }, props));
|
|
5502
5573
|
}
|
|
5503
5574
|
function DropdownMenuSubTrigger(_a) {
|
|
5504
5575
|
var _b = _a, {
|
|
@@ -5522,7 +5593,7 @@ function DropdownMenuSubTrigger(_a) {
|
|
|
5522
5593
|
}, props), {
|
|
5523
5594
|
children: [
|
|
5524
5595
|
children,
|
|
5525
|
-
/* @__PURE__ */
|
|
5596
|
+
/* @__PURE__ */ jsx53(ChevronRightIcon, { className: "ml-auto size-4" })
|
|
5526
5597
|
]
|
|
5527
5598
|
})
|
|
5528
5599
|
);
|
|
@@ -5533,7 +5604,7 @@ function DropdownMenuSubContent(_a) {
|
|
|
5533
5604
|
} = _b, props = __objRest(_b, [
|
|
5534
5605
|
"className"
|
|
5535
5606
|
]);
|
|
5536
|
-
return /* @__PURE__ */
|
|
5607
|
+
return /* @__PURE__ */ jsx53(
|
|
5537
5608
|
DropdownMenuPrimitive.SubContent,
|
|
5538
5609
|
__spreadValues({
|
|
5539
5610
|
"data-slot": "dropdown-menu-sub-content",
|
|
@@ -5547,14 +5618,14 @@ function DropdownMenuSubContent(_a) {
|
|
|
5547
5618
|
|
|
5548
5619
|
// src/@/ui/popover.tsx
|
|
5549
5620
|
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
5550
|
-
import { jsx as
|
|
5621
|
+
import { jsx as jsx54 } from "react/jsx-runtime";
|
|
5551
5622
|
function Popover(_a) {
|
|
5552
5623
|
var props = __objRest(_a, []);
|
|
5553
|
-
return /* @__PURE__ */
|
|
5624
|
+
return /* @__PURE__ */ jsx54(PopoverPrimitive.Root, __spreadValues({ "data-slot": "popover" }, props));
|
|
5554
5625
|
}
|
|
5555
5626
|
function PopoverTrigger(_a) {
|
|
5556
5627
|
var props = __objRest(_a, []);
|
|
5557
|
-
return /* @__PURE__ */
|
|
5628
|
+
return /* @__PURE__ */ jsx54(PopoverPrimitive.Trigger, __spreadValues({ "data-slot": "popover-trigger" }, props));
|
|
5558
5629
|
}
|
|
5559
5630
|
function PopoverContent(_a) {
|
|
5560
5631
|
var _b = _a, {
|
|
@@ -5566,7 +5637,7 @@ function PopoverContent(_a) {
|
|
|
5566
5637
|
"align",
|
|
5567
5638
|
"sideOffset"
|
|
5568
5639
|
]);
|
|
5569
|
-
return /* @__PURE__ */
|
|
5640
|
+
return /* @__PURE__ */ jsx54(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx54(
|
|
5570
5641
|
PopoverPrimitive.Content,
|
|
5571
5642
|
__spreadValues({
|
|
5572
5643
|
"data-slot": "popover-content",
|
|
@@ -5581,13 +5652,13 @@ function PopoverContent(_a) {
|
|
|
5581
5652
|
}
|
|
5582
5653
|
function PopoverAnchor(_a) {
|
|
5583
5654
|
var props = __objRest(_a, []);
|
|
5584
|
-
return /* @__PURE__ */
|
|
5655
|
+
return /* @__PURE__ */ jsx54(PopoverPrimitive.Anchor, __spreadValues({ "data-slot": "popover-anchor" }, props));
|
|
5585
5656
|
}
|
|
5586
5657
|
|
|
5587
5658
|
// src/@/ui/badge.tsx
|
|
5588
5659
|
import { Slot as Slot11 } from "@radix-ui/react-slot";
|
|
5589
5660
|
import { cva as cva7 } from "class-variance-authority";
|
|
5590
|
-
import { jsx as
|
|
5661
|
+
import { jsx as jsx55 } from "react/jsx-runtime";
|
|
5591
5662
|
var badgeVariants = cva7(
|
|
5592
5663
|
"inline-flex font-semibold whitespace-nowrap items-center justify-center rounded-full px-2 py-1 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
|
|
5593
5664
|
{
|
|
@@ -5620,7 +5691,7 @@ function Badge(_a) {
|
|
|
5620
5691
|
"asChild"
|
|
5621
5692
|
]);
|
|
5622
5693
|
const Comp = asChild ? Slot11 : "span";
|
|
5623
|
-
return /* @__PURE__ */
|
|
5694
|
+
return /* @__PURE__ */ jsx55(
|
|
5624
5695
|
Comp,
|
|
5625
5696
|
__spreadValues({
|
|
5626
5697
|
"data-slot": "badge",
|