@deframe-sdk/components 0.1.74 → 0.1.76
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 +31 -2
- package/dist/index.d.ts +31 -2
- package/dist/index.js +398 -7
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +396 -9
- package/dist/index.mjs.map +1 -1
- package/dist/styles.css +60 -0
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -6870,6 +6870,7 @@ var SwapQuoteDetailsView = ({
|
|
|
6870
6870
|
gasCostFormatted,
|
|
6871
6871
|
protocolFee,
|
|
6872
6872
|
slippageFormatted,
|
|
6873
|
+
minReceivedFormatted,
|
|
6873
6874
|
etaFormatted,
|
|
6874
6875
|
quoteId,
|
|
6875
6876
|
hasQuoteError,
|
|
@@ -6881,6 +6882,8 @@ var SwapQuoteDetailsView = ({
|
|
|
6881
6882
|
quoteHeaderLabel,
|
|
6882
6883
|
/* @__PURE__ */ jsxRuntime.jsx(LoadingDots, {})
|
|
6883
6884
|
] }) : quoteHeaderLabel;
|
|
6885
|
+
const slippageDetailLabel = minReceivedFormatted ? labels.minReceivedLabel : labels.slippageLabel;
|
|
6886
|
+
const slippageDetailValue = minReceivedFormatted || slippageFormatted;
|
|
6884
6887
|
const items = [
|
|
6885
6888
|
{
|
|
6886
6889
|
label: "",
|
|
@@ -6910,8 +6913,8 @@ var SwapQuoteDetailsView = ({
|
|
|
6910
6913
|
valueClassName: "flex flex-col gap-sm w-full text-right"
|
|
6911
6914
|
},
|
|
6912
6915
|
{
|
|
6913
|
-
label:
|
|
6914
|
-
value:
|
|
6916
|
+
label: slippageDetailLabel,
|
|
6917
|
+
value: slippageDetailValue
|
|
6915
6918
|
},
|
|
6916
6919
|
{
|
|
6917
6920
|
label: labels.etaLabel,
|
|
@@ -8487,6 +8490,291 @@ function QuoteIdRow({ label, quoteId }) {
|
|
|
8487
8490
|
}
|
|
8488
8491
|
);
|
|
8489
8492
|
}
|
|
8493
|
+
var detailValueColorClassNames = {
|
|
8494
|
+
default: "text-[color:var(--deframe-widget-color-text-primary)]",
|
|
8495
|
+
negative: "text-[color:var(--deframe-widget-color-state-error)]",
|
|
8496
|
+
positive: "text-[color:var(--deframe-widget-color-state-success)]"
|
|
8497
|
+
};
|
|
8498
|
+
function getPriceImpactValueColor(isPositive) {
|
|
8499
|
+
return isPositive ? "positive" : "negative";
|
|
8500
|
+
}
|
|
8501
|
+
function PodsDetailRow({ label, value, valueColor = "default" }) {
|
|
8502
|
+
if (!label && !value) return null;
|
|
8503
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
8504
|
+
"div",
|
|
8505
|
+
{
|
|
8506
|
+
"data-test-id": "pods-swap-detail-row",
|
|
8507
|
+
className: "flex items-center justify-between gap-[var(--deframe-widget-size-gap-md)] py-[var(--deframe-widget-size-padding-y-xs)]",
|
|
8508
|
+
children: [
|
|
8509
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[12px] text-[color:var(--deframe-widget-color-text-tertiary)] font-[var(--deframe-widget-font-family)] shrink-0", children: label }),
|
|
8510
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8511
|
+
"span",
|
|
8512
|
+
{
|
|
8513
|
+
className: tailwindMerge.twMerge(
|
|
8514
|
+
"text-[13px] [font-weight:var(--deframe-widget-font-weight-medium)] font-[var(--deframe-widget-font-family)] text-right",
|
|
8515
|
+
detailValueColorClassNames[valueColor]
|
|
8516
|
+
),
|
|
8517
|
+
children: value
|
|
8518
|
+
}
|
|
8519
|
+
)
|
|
8520
|
+
]
|
|
8521
|
+
}
|
|
8522
|
+
);
|
|
8523
|
+
}
|
|
8524
|
+
function PodsSwapQuoteDetails({ details, advancedSettings }) {
|
|
8525
|
+
const [isOpen, setIsOpen] = React6__namespace.default.useState(details.isVisible);
|
|
8526
|
+
const [isSlippageOpen, setIsSlippageOpen] = React6__namespace.default.useState(false);
|
|
8527
|
+
React6__namespace.default.useEffect(() => {
|
|
8528
|
+
if (details.isVisible) setIsOpen(true);
|
|
8529
|
+
}, [details.isVisible]);
|
|
8530
|
+
const hasErrors = details.hasQuoteError || details.hasBytecodeError;
|
|
8531
|
+
const shouldRenderDetails = details.isVisible || hasErrors;
|
|
8532
|
+
if (!shouldRenderDetails) {
|
|
8533
|
+
return null;
|
|
8534
|
+
}
|
|
8535
|
+
const headerLabel = details.isLoading ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
8536
|
+
details.quoteHeaderLabel,
|
|
8537
|
+
/* @__PURE__ */ jsxRuntime.jsx(LoadingDots, {})
|
|
8538
|
+
] }) : details.quoteHeaderLabel;
|
|
8539
|
+
const hasSlippageControls = advancedSettings.slippageOptions.length > 0;
|
|
8540
|
+
const handleSlippageSelect = advancedSettings.onSlippageSelect;
|
|
8541
|
+
const slippageDetailLabel = details.minReceivedFormatted ? details.labels.minReceivedLabel : details.labels.slippageLabel;
|
|
8542
|
+
const slippageDetailValue = details.minReceivedFormatted || details.slippageFormatted;
|
|
8543
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-test-id": "pods-swap-quote-details", "data-slot": "pods-swap-quote-details", className: "w-full", children: [
|
|
8544
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "overflow-hidden rounded-[var(--deframe-widget-size-radius-sm)] border border-[color:var(--deframe-widget-color-border-secondary)] bg-[var(--deframe-widget-color-bg-secondary)]", children: [
|
|
8545
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-[var(--deframe-widget-size-gap-sm)] px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-sm)]", children: [
|
|
8546
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
8547
|
+
"button",
|
|
8548
|
+
{
|
|
8549
|
+
type: "button",
|
|
8550
|
+
onClick: () => setIsOpen((open) => !open),
|
|
8551
|
+
className: "flex min-w-0 flex-1 cursor-pointer items-center gap-[var(--deframe-widget-size-gap-sm)] border-none bg-transparent p-0 text-left outline-none",
|
|
8552
|
+
"aria-expanded": isOpen,
|
|
8553
|
+
children: [
|
|
8554
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[13px] [font-weight:var(--deframe-widget-font-weight-medium)] text-[color:var(--deframe-widget-color-text-primary)] font-[var(--deframe-widget-font-family)]", children: details.labels.headerLabel }),
|
|
8555
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8556
|
+
framerMotion.motion.span,
|
|
8557
|
+
{
|
|
8558
|
+
className: "inline-flex h-4 w-4 flex-shrink-0 items-center justify-center text-[color:var(--deframe-widget-color-text-tertiary)]",
|
|
8559
|
+
animate: { rotate: isOpen ? 180 : 0 },
|
|
8560
|
+
transition: { duration: 0.2, ease: "easeInOut" },
|
|
8561
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(md.MdKeyboardArrowDown, { className: "h-4 w-4", "aria-hidden": "true" })
|
|
8562
|
+
}
|
|
8563
|
+
)
|
|
8564
|
+
]
|
|
8565
|
+
}
|
|
8566
|
+
),
|
|
8567
|
+
hasSlippageControls && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
8568
|
+
"button",
|
|
8569
|
+
{
|
|
8570
|
+
type: "button",
|
|
8571
|
+
onClick: () => setIsSlippageOpen((open) => !open),
|
|
8572
|
+
"aria-label": advancedSettings.slippageLabel,
|
|
8573
|
+
className: tailwindMerge.twMerge(
|
|
8574
|
+
"inline-flex h-6 flex-shrink-0 cursor-pointer items-center gap-[5px] rounded-[var(--deframe-widget-size-radius-full)] border px-[8px]",
|
|
8575
|
+
"text-[11px] [font-weight:var(--deframe-widget-font-weight-medium)] font-[var(--deframe-widget-font-family)] outline-none transition-all duration-150",
|
|
8576
|
+
isSlippageOpen ? "border-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_40%,transparent)] bg-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_10%,transparent)] text-[color:var(--deframe-widget-color-brand-primary)]" : "border-[color:var(--deframe-widget-color-border-secondary)] bg-transparent text-[color:var(--deframe-widget-color-text-secondary)] hover:border-[color:var(--deframe-widget-color-border-primary)] hover:text-[color:var(--deframe-widget-color-text-primary)]"
|
|
8577
|
+
),
|
|
8578
|
+
children: [
|
|
8579
|
+
/* @__PURE__ */ jsxRuntime.jsx(md.MdSettings, { className: "h-[11px] w-[11px]", "aria-hidden": "true" }),
|
|
8580
|
+
advancedSettings.formatPercentage(advancedSettings.slippageBps)
|
|
8581
|
+
]
|
|
8582
|
+
}
|
|
8583
|
+
)
|
|
8584
|
+
] }),
|
|
8585
|
+
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: false, children: isOpen && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
8586
|
+
framerMotion.motion.div,
|
|
8587
|
+
{
|
|
8588
|
+
initial: { height: 0, opacity: 0 },
|
|
8589
|
+
animate: { height: "auto", opacity: 1 },
|
|
8590
|
+
exit: { height: 0, opacity: 0 },
|
|
8591
|
+
transition: { duration: 0.2, ease: "easeInOut" },
|
|
8592
|
+
style: { overflow: "hidden" },
|
|
8593
|
+
children: [
|
|
8594
|
+
/* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: false, children: isSlippageOpen && hasSlippageControls && /* @__PURE__ */ jsxRuntime.jsx(
|
|
8595
|
+
framerMotion.motion.div,
|
|
8596
|
+
{
|
|
8597
|
+
initial: { height: 0, opacity: 0 },
|
|
8598
|
+
animate: { height: "auto", opacity: 1 },
|
|
8599
|
+
exit: { height: 0, opacity: 0 },
|
|
8600
|
+
transition: { duration: 0.15, ease: "easeInOut" },
|
|
8601
|
+
style: { overflow: "hidden" },
|
|
8602
|
+
className: "border-t border-[color:var(--deframe-widget-color-border-secondary)]",
|
|
8603
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-sm)]", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
8604
|
+
SlippageChip,
|
|
8605
|
+
{
|
|
8606
|
+
options: advancedSettings.slippageOptions,
|
|
8607
|
+
selected: advancedSettings.slippageBps,
|
|
8608
|
+
onSelect: handleSlippageSelect,
|
|
8609
|
+
formatLabel: advancedSettings.formatPercentage
|
|
8610
|
+
}
|
|
8611
|
+
) })
|
|
8612
|
+
},
|
|
8613
|
+
"pods-slippage-panel"
|
|
8614
|
+
) }),
|
|
8615
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t border-[color:var(--deframe-widget-color-border-secondary)] px-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-sm)]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-[var(--deframe-widget-size-gap-sm)] pt-[var(--deframe-widget-size-padding-y-sm)]", children: [
|
|
8616
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "min-w-0 text-[15px] [font-weight:var(--deframe-widget-font-weight-semibold)] leading-snug text-[color:var(--deframe-widget-color-text-primary)] font-[var(--deframe-widget-font-family)]", children: headerLabel }),
|
|
8617
|
+
details.timerElement && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-shrink-0 items-center gap-[var(--deframe-widget-size-gap-sm)]", children: details.timerElement })
|
|
8618
|
+
] }) }),
|
|
8619
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col border-t border-[color:var(--deframe-widget-color-border-secondary)] px-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-sm)]", children: [
|
|
8620
|
+
/* @__PURE__ */ jsxRuntime.jsx(PodsDetailRow, { label: details.labels.exchangeRateLabel, value: details.exchangeRateFormatted }),
|
|
8621
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "py-[var(--deframe-widget-size-padding-y-xs)]", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
8622
|
+
SwapQuoteBlockchainCostsView,
|
|
8623
|
+
{
|
|
8624
|
+
totalCostFormatted: details.totalCostFormatted,
|
|
8625
|
+
feePercentage: details.feePercentage,
|
|
8626
|
+
gasCostFormatted: details.gasCostFormatted,
|
|
8627
|
+
protocolFee: details.protocolFee,
|
|
8628
|
+
blockchainCostsLabel: details.labels.blockchainCostsLabel,
|
|
8629
|
+
networkGasLabel: details.labels.networkGasLabel,
|
|
8630
|
+
protocolFeeLabel: details.labels.protocolFeeLabel,
|
|
8631
|
+
collapseLabel: details.labels.costsCollapseLabel,
|
|
8632
|
+
expandLabel: details.labels.costsExpandLabel
|
|
8633
|
+
}
|
|
8634
|
+
) }),
|
|
8635
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8636
|
+
PodsDetailRow,
|
|
8637
|
+
{
|
|
8638
|
+
label: details.labels.priceImpactLabel,
|
|
8639
|
+
value: details.priceImpactFormatted,
|
|
8640
|
+
valueColor: getPriceImpactValueColor(details.priceImpactIsPositive)
|
|
8641
|
+
}
|
|
8642
|
+
),
|
|
8643
|
+
/* @__PURE__ */ jsxRuntime.jsx(PodsDetailRow, { label: slippageDetailLabel, value: slippageDetailValue }),
|
|
8644
|
+
/* @__PURE__ */ jsxRuntime.jsx(PodsDetailRow, { label: details.labels.etaLabel, value: details.etaFormatted })
|
|
8645
|
+
] }),
|
|
8646
|
+
details.quoteId && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-[var(--deframe-widget-size-gap-sm)] border-t border-[color:var(--deframe-widget-color-border-secondary)] px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-xs)]", children: [
|
|
8647
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] text-[color:var(--deframe-widget-color-text-tertiary)] opacity-60 font-[var(--deframe-widget-font-family)]", children: details.labels.quoteIdLabel }),
|
|
8648
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8649
|
+
AddressDisplay,
|
|
8650
|
+
{
|
|
8651
|
+
address: details.quoteId,
|
|
8652
|
+
className: "max-w-[150px] min-w-0 px-[8px] py-[3px]"
|
|
8653
|
+
}
|
|
8654
|
+
)
|
|
8655
|
+
] })
|
|
8656
|
+
]
|
|
8657
|
+
},
|
|
8658
|
+
"pods-quote-body"
|
|
8659
|
+
) })
|
|
8660
|
+
] }),
|
|
8661
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8662
|
+
SwapQuoteErrorsView,
|
|
8663
|
+
{
|
|
8664
|
+
hasQuoteError: details.hasQuoteError,
|
|
8665
|
+
hasBytecodeError: details.hasBytecodeError,
|
|
8666
|
+
quoteErrorMessage: details.quoteErrorMessage,
|
|
8667
|
+
bytecodeErrorMessage: details.bytecodeErrorMessage
|
|
8668
|
+
}
|
|
8669
|
+
)
|
|
8670
|
+
] });
|
|
8671
|
+
}
|
|
8672
|
+
var PodsSwapFormView = ({
|
|
8673
|
+
onSubmit,
|
|
8674
|
+
formRef,
|
|
8675
|
+
labels,
|
|
8676
|
+
onHistoryClick,
|
|
8677
|
+
onSwitchTokens,
|
|
8678
|
+
switchTokensAriaLabel,
|
|
8679
|
+
showHistoryTooltip = false,
|
|
8680
|
+
fromCard,
|
|
8681
|
+
toCard,
|
|
8682
|
+
advancedSettings,
|
|
8683
|
+
transactionDetails,
|
|
8684
|
+
priceImpactWarning,
|
|
8685
|
+
confirmButton
|
|
8686
|
+
}) => {
|
|
8687
|
+
const historyTooltipId = React6__namespace.default.useId();
|
|
8688
|
+
const historyTooltipProps = showHistoryTooltip ? { "aria-describedby": historyTooltipId, title: labels.historyAriaLabel } : {};
|
|
8689
|
+
const handlePercentageClick = advancedSettings.onPercentageClick;
|
|
8690
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
8691
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8692
|
+
"div",
|
|
8693
|
+
{
|
|
8694
|
+
"data-testid": "pods-swap-form-view",
|
|
8695
|
+
"data-slot": "pods-swap-form-view",
|
|
8696
|
+
className: "flex-1 min-h-0 overflow-y-auto swap-flow-content px-[var(--deframe-widget-size-padding-x-sm)] pb-[var(--deframe-widget-size-padding-y-xs)]",
|
|
8697
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("form", { ref: formRef, onSubmit, "data-testid": "pods-swap-flow-form", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-md)] text-[color:var(--deframe-widget-color-text-secondary)]", children: [
|
|
8698
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-[var(--deframe-widget-size-gap-md)]", children: [
|
|
8699
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-sm)]", children: [
|
|
8700
|
+
/* @__PURE__ */ jsxRuntime.jsx(TextHeading, { variant: "h5", className: "!text-[21px]", children: /* @__PURE__ */ jsxRuntime.jsx("span", { "data-testid": "pods-swap-flow-title", children: labels.title }) }),
|
|
8701
|
+
labels.subtitle && /* @__PURE__ */ jsxRuntime.jsx(TextBody, { variant: "text-small", className: "!text-[14px]", children: labels.subtitle })
|
|
8702
|
+
] }),
|
|
8703
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative inline-flex group", children: [
|
|
8704
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8705
|
+
"button",
|
|
8706
|
+
__spreadProps(__spreadValues({
|
|
8707
|
+
"data-testid": "pods-swap-history-button",
|
|
8708
|
+
type: "button",
|
|
8709
|
+
onClick: onHistoryClick,
|
|
8710
|
+
className: "flex h-12 w-12 cursor-pointer items-center justify-center rounded-[var(--deframe-widget-size-radius-full)] text-[color:var(--deframe-widget-color-text-secondary)] transition-colors hover:text-[color:var(--deframe-widget-color-brand-primary)]",
|
|
8711
|
+
"aria-label": labels.historyAriaLabel
|
|
8712
|
+
}, historyTooltipProps), {
|
|
8713
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(md.MdHistory, { className: "h-6 w-6", "aria-hidden": "true" })
|
|
8714
|
+
})
|
|
8715
|
+
),
|
|
8716
|
+
showHistoryTooltip && /* @__PURE__ */ jsxRuntime.jsx(
|
|
8717
|
+
"span",
|
|
8718
|
+
{
|
|
8719
|
+
id: historyTooltipId,
|
|
8720
|
+
role: "tooltip",
|
|
8721
|
+
className: "pointer-events-none absolute right-0 top-full z-10 mt-1 whitespace-nowrap rounded-[var(--deframe-widget-size-radius-xs)] bg-[var(--deframe-widget-color-bg-tertiary)] px-2 py-1 text-xs text-[color:var(--deframe-widget-color-text-primary)] opacity-0 shadow-lg transition-opacity group-hover:opacity-100 group-focus-within:opacity-100",
|
|
8722
|
+
children: labels.historyAriaLabel
|
|
8723
|
+
}
|
|
8724
|
+
)
|
|
8725
|
+
] })
|
|
8726
|
+
] }),
|
|
8727
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col items-stretch gap-[var(--deframe-widget-size-gap-sm)]", children: [
|
|
8728
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
8729
|
+
SwapFromCardViewSimple,
|
|
8730
|
+
__spreadProps(__spreadValues({}, fromCard), {
|
|
8731
|
+
percentageOptions: advancedSettings.percentageOptions,
|
|
8732
|
+
onPercentageClick: handlePercentageClick,
|
|
8733
|
+
maxLabel: advancedSettings.maxLabel
|
|
8734
|
+
})
|
|
8735
|
+
),
|
|
8736
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-10 -my-5 flex justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
8737
|
+
"button",
|
|
8738
|
+
{
|
|
8739
|
+
"data-testid": "pods-swap-switch-tokens-button",
|
|
8740
|
+
type: "button",
|
|
8741
|
+
onClick: onSwitchTokens,
|
|
8742
|
+
className: "flex h-10 w-10 cursor-pointer items-center justify-center rounded-[var(--deframe-widget-size-radius-full)] bg-[var(--deframe-widget-color-brand-secondary)] text-[color:var(--deframe-widget-color-text-primary)] shadow-md transition-shadow hover:shadow-lg focus:outline-none focus:ring-2 focus:ring-[color:var(--deframe-widget-color-brand-secondary)]",
|
|
8743
|
+
"aria-label": switchTokensAriaLabel,
|
|
8744
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(md.MdOutlineSwapVert, { className: "h-5 w-5", "aria-hidden": "true" })
|
|
8745
|
+
}
|
|
8746
|
+
) }),
|
|
8747
|
+
/* @__PURE__ */ jsxRuntime.jsx(SwapToCardViewSimple, __spreadValues({}, toCard))
|
|
8748
|
+
] }),
|
|
8749
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "pb-[var(--deframe-widget-size-padding-y-xl)]", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
8750
|
+
PodsSwapQuoteDetails,
|
|
8751
|
+
{
|
|
8752
|
+
details: transactionDetails,
|
|
8753
|
+
advancedSettings
|
|
8754
|
+
}
|
|
8755
|
+
) })
|
|
8756
|
+
] }) })
|
|
8757
|
+
}
|
|
8758
|
+
),
|
|
8759
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
8760
|
+
"div",
|
|
8761
|
+
{
|
|
8762
|
+
"data-testid": "pods-swap-flow-footer",
|
|
8763
|
+
className: "w-full p-[var(--deframe-widget-size-padding-x-md)]",
|
|
8764
|
+
children: [
|
|
8765
|
+
priceImpactWarning && /* @__PURE__ */ jsxRuntime.jsx(
|
|
8766
|
+
SwapPriceImpactWarning,
|
|
8767
|
+
{
|
|
8768
|
+
warning: priceImpactWarning,
|
|
8769
|
+
className: "mb-[var(--deframe-widget-size-gap-sm)]"
|
|
8770
|
+
}
|
|
8771
|
+
),
|
|
8772
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "pods-swap-confirm-button", children: /* @__PURE__ */ jsxRuntime.jsx(ConfirmSwapButtonViewSimple, __spreadValues({}, confirmButton)) })
|
|
8773
|
+
]
|
|
8774
|
+
}
|
|
8775
|
+
)
|
|
8776
|
+
] });
|
|
8777
|
+
};
|
|
8490
8778
|
var ChooseANetworkView = ({
|
|
8491
8779
|
labels,
|
|
8492
8780
|
autoFocus = true,
|
|
@@ -9033,8 +9321,12 @@ function AssetSearchAndList({
|
|
|
9033
9321
|
hasMore,
|
|
9034
9322
|
onLoadMore,
|
|
9035
9323
|
labels,
|
|
9036
|
-
autoFocus
|
|
9324
|
+
autoFocus,
|
|
9325
|
+
categories,
|
|
9326
|
+
selectedCategory,
|
|
9327
|
+
onCategoryChange
|
|
9037
9328
|
}) {
|
|
9329
|
+
const hasCategories = categories && categories.length > 0;
|
|
9038
9330
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
9039
9331
|
"div",
|
|
9040
9332
|
{
|
|
@@ -9065,6 +9357,48 @@ function AssetSearchAndList({
|
|
|
9065
9357
|
)
|
|
9066
9358
|
}
|
|
9067
9359
|
),
|
|
9360
|
+
hasCategories && /* @__PURE__ */ jsxRuntime.jsx(
|
|
9361
|
+
"div",
|
|
9362
|
+
{
|
|
9363
|
+
"data-test-id": "category-chips",
|
|
9364
|
+
"data-slot": "category-chips",
|
|
9365
|
+
className: "flex gap-[var(--deframe-widget-size-gap-sm)] overflow-x-auto px-[var(--deframe-widget-size-padding-x-md)] pb-[var(--deframe-widget-size-padding-y-sm)] flex-shrink-0 [scrollbar-width:none]",
|
|
9366
|
+
children: categories.map((cat) => {
|
|
9367
|
+
const isActive = cat.id === selectedCategory;
|
|
9368
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
9369
|
+
"button",
|
|
9370
|
+
{
|
|
9371
|
+
type: "button",
|
|
9372
|
+
"data-test-id": "category-chip",
|
|
9373
|
+
"data-slot": "category-chip",
|
|
9374
|
+
onClick: () => onCategoryChange == null ? void 0 : onCategoryChange(cat.id),
|
|
9375
|
+
className: tailwindMerge.twMerge(
|
|
9376
|
+
"inline-flex items-center justify-center",
|
|
9377
|
+
"h-[28px] px-[10px]",
|
|
9378
|
+
"rounded-[var(--deframe-widget-size-radius-full)]",
|
|
9379
|
+
"cursor-pointer text-[12px] font-[var(--deframe-widget-font-family)]",
|
|
9380
|
+
"border outline-none transition-all duration-150 whitespace-nowrap flex-shrink-0",
|
|
9381
|
+
isActive ? [
|
|
9382
|
+
"border-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_32%,transparent)]",
|
|
9383
|
+
"bg-[color:color-mix(in_srgb,var(--deframe-widget-color-brand-primary)_12%,transparent)]",
|
|
9384
|
+
"text-[color:var(--deframe-widget-color-brand-primary)]",
|
|
9385
|
+
"[font-weight:var(--deframe-widget-font-weight-semibold)]"
|
|
9386
|
+
].join(" ") : [
|
|
9387
|
+
"border-[color:var(--deframe-widget-color-border-secondary)]",
|
|
9388
|
+
"bg-transparent",
|
|
9389
|
+
"text-[color:var(--deframe-widget-color-text-secondary)]",
|
|
9390
|
+
"[font-weight:var(--deframe-widget-font-weight-regular)]",
|
|
9391
|
+
"hover:border-[color:var(--deframe-widget-color-border-primary)]",
|
|
9392
|
+
"hover:text-[color:var(--deframe-widget-color-text-primary)]"
|
|
9393
|
+
].join(" ")
|
|
9394
|
+
),
|
|
9395
|
+
children: cat.label
|
|
9396
|
+
},
|
|
9397
|
+
cat.id
|
|
9398
|
+
);
|
|
9399
|
+
})
|
|
9400
|
+
}
|
|
9401
|
+
),
|
|
9068
9402
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
9069
9403
|
"div",
|
|
9070
9404
|
{
|
|
@@ -9166,7 +9500,10 @@ function ChooseNetworkAndAssetViewSimple({
|
|
|
9166
9500
|
hasMore,
|
|
9167
9501
|
onLoadMore,
|
|
9168
9502
|
isFetching,
|
|
9169
|
-
labels
|
|
9503
|
+
labels,
|
|
9504
|
+
categories,
|
|
9505
|
+
selectedCategory,
|
|
9506
|
+
onCategoryChange
|
|
9170
9507
|
}) {
|
|
9171
9508
|
var _a;
|
|
9172
9509
|
const [query, setQuery] = React6__namespace.useState("");
|
|
@@ -9261,7 +9598,10 @@ function ChooseNetworkAndAssetViewSimple({
|
|
|
9261
9598
|
hasMore,
|
|
9262
9599
|
onLoadMore,
|
|
9263
9600
|
labels,
|
|
9264
|
-
autoFocus
|
|
9601
|
+
autoFocus,
|
|
9602
|
+
categories,
|
|
9603
|
+
selectedCategory,
|
|
9604
|
+
onCategoryChange
|
|
9265
9605
|
}
|
|
9266
9606
|
);
|
|
9267
9607
|
if (isMobile) {
|
|
@@ -19053,6 +19393,53 @@ var DUST_THRESHOLD_USD = 0.01;
|
|
|
19053
19393
|
function isDustValue(amountInUSD) {
|
|
19054
19394
|
return isNaN(amountInUSD) || amountInUSD < DUST_THRESHOLD_USD;
|
|
19055
19395
|
}
|
|
19396
|
+
|
|
19397
|
+
// src/utils/wellKnownTokens.ts
|
|
19398
|
+
var WELL_KNOWN_TOKEN_SYMBOLS = /* @__PURE__ */ new Set([
|
|
19399
|
+
// Native & wrapped ETH
|
|
19400
|
+
"ETH",
|
|
19401
|
+
"WETH",
|
|
19402
|
+
// BTC
|
|
19403
|
+
"WBTC",
|
|
19404
|
+
// Stablecoins
|
|
19405
|
+
"USDC",
|
|
19406
|
+
"USDT",
|
|
19407
|
+
"DAI",
|
|
19408
|
+
"PYUSD",
|
|
19409
|
+
"EURC",
|
|
19410
|
+
"WXDAI",
|
|
19411
|
+
// Fiat-pegged (Brazilian)
|
|
19412
|
+
"BRLA",
|
|
19413
|
+
// L1/L2 native tokens
|
|
19414
|
+
"BNB",
|
|
19415
|
+
"WBNB",
|
|
19416
|
+
"MATIC",
|
|
19417
|
+
"POL",
|
|
19418
|
+
"OP",
|
|
19419
|
+
"ARB",
|
|
19420
|
+
"GNO",
|
|
19421
|
+
"XDAI"
|
|
19422
|
+
]);
|
|
19423
|
+
function isWellKnownToken(symbol) {
|
|
19424
|
+
return WELL_KNOWN_TOKEN_SYMBOLS.has(symbol.toUpperCase());
|
|
19425
|
+
}
|
|
19426
|
+
var USD_PEGGED_SYMBOLS = /* @__PURE__ */ new Set([
|
|
19427
|
+
"USDC",
|
|
19428
|
+
"USDC.E",
|
|
19429
|
+
"USDBC",
|
|
19430
|
+
"USDT",
|
|
19431
|
+
"DAI",
|
|
19432
|
+
"WXDAI",
|
|
19433
|
+
"PYUSD",
|
|
19434
|
+
"EURC"
|
|
19435
|
+
]);
|
|
19436
|
+
function isUsdPeggedToken(symbol) {
|
|
19437
|
+
return USD_PEGGED_SYMBOLS.has(symbol.toUpperCase());
|
|
19438
|
+
}
|
|
19439
|
+
var BRL_PEGGED_SYMBOLS2 = /* @__PURE__ */ new Set(["BRLA"]);
|
|
19440
|
+
function isBrlPeggedToken(symbol) {
|
|
19441
|
+
return BRL_PEGGED_SYMBOLS2.has(symbol.toUpperCase());
|
|
19442
|
+
}
|
|
19056
19443
|
function HistoryButton4({ onClick }) {
|
|
19057
19444
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
19058
19445
|
"button",
|
|
@@ -19358,7 +19745,7 @@ var DashboardTokensViewSimple = ({
|
|
|
19358
19745
|
]
|
|
19359
19746
|
}
|
|
19360
19747
|
),
|
|
19361
|
-
sortedRegularTokens.filter((t) => !isDustValue(t.amountInUSD)).map((item) => {
|
|
19748
|
+
sortedRegularTokens.filter((t) => !isDustValue(t.amountInUSD) || isWellKnownToken(t.symbol) && Number.parseFloat(t.formattedAmount) > 0).map((item) => {
|
|
19362
19749
|
var _a, _b;
|
|
19363
19750
|
const m = item.metadata;
|
|
19364
19751
|
const color = (_a = m == null ? void 0 : m.color) != null ? _a : "#888";
|
|
@@ -19391,7 +19778,7 @@ var DashboardTokensViewSimple = ({
|
|
|
19391
19778
|
] }),
|
|
19392
19779
|
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center", children: trendDirection && trendValue ? /* @__PURE__ */ jsxRuntime.jsx(AssetTrendBadge, { direction: trendDirection, value: trendValue }) : null }),
|
|
19393
19780
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-end text-right", children: [
|
|
19394
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-sm)] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] leading-[var(--deframe-widget-font-leading-sm)] font-[var(--deframe-widget-font-family)]", children: item.formattedFiatValue }),
|
|
19781
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[length:var(--deframe-widget-font-size-sm)] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)] leading-[var(--deframe-widget-font-leading-sm)] font-[var(--deframe-widget-font-family)]", children: item.amountInUSD > 0 ? item.formattedFiatValue : "-" }),
|
|
19395
19782
|
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-[length:var(--deframe-widget-font-size-xs)] text-[color:var(--deframe-widget-color-text-secondary)] leading-[var(--deframe-widget-font-leading-xs)]", children: [
|
|
19396
19783
|
item.formattedAmount,
|
|
19397
19784
|
" ",
|
|
@@ -19904,6 +20291,7 @@ exports.OnrampPixcodeView = OnrampPixcodeView;
|
|
|
19904
20291
|
exports.OnrampSuccessSimpleView = OnrampSuccessSimpleView;
|
|
19905
20292
|
exports.OnrampSuccessView = OnrampSuccessView;
|
|
19906
20293
|
exports.PercentageButton = PercentageButton;
|
|
20294
|
+
exports.PodsSwapFormView = PodsSwapFormView;
|
|
19907
20295
|
exports.PrimaryButton = PrimaryButton;
|
|
19908
20296
|
exports.ProcessingBadge = ProcessingBadge;
|
|
19909
20297
|
exports.ProgressIndicator = ProgressIndicator;
|
|
@@ -19968,7 +20356,10 @@ exports.WalletList = ConnectWalletList;
|
|
|
19968
20356
|
exports.WalletListContainer = WalletListContainer;
|
|
19969
20357
|
exports.WithdrawFailedIcon = WithdrawFailedIcon;
|
|
19970
20358
|
exports.WithdrawSuccessIcon = WithdrawSuccessIcon;
|
|
20359
|
+
exports.isBrlPeggedToken = isBrlPeggedToken;
|
|
19971
20360
|
exports.isDustValue = isDustValue;
|
|
20361
|
+
exports.isUsdPeggedToken = isUsdPeggedToken;
|
|
20362
|
+
exports.isWellKnownToken = isWellKnownToken;
|
|
19972
20363
|
exports.truncateAddress = truncateAddress;
|
|
19973
20364
|
//# sourceMappingURL=index.js.map
|
|
19974
20365
|
//# sourceMappingURL=index.js.map
|