@deframe-sdk/components 0.1.78 → 0.1.79

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.mjs CHANGED
@@ -12316,6 +12316,7 @@ var EarnAmountInputView = ({
12316
12316
  onChange,
12317
12317
  ariaLabel,
12318
12318
  dollarAmountFormatted,
12319
+ disabled,
12319
12320
  availableBalanceFormatted
12320
12321
  }) => {
12321
12322
  return /* @__PURE__ */ jsxs("div", { className: "flex-1 flex flex-col items-end justify-between min-h-[86px] text-right", children: [
@@ -12329,6 +12330,7 @@ var EarnAmountInputView = ({
12329
12330
  autoComplete: "off",
12330
12331
  "aria-label": ariaLabel,
12331
12332
  value,
12333
+ disabled,
12332
12334
  min: "0",
12333
12335
  step: "any",
12334
12336
  className: "[font-size:var(--deframe-widget-font-size-xxl)] [font-weight:var(--deframe-widget-font-weight-extrabold)] bg-transparent outline-none text-right w-full min-w-[105px] placeholder:text-[color:var(--deframe-widget-color-text-primary-disabled)] [appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none",
@@ -12985,7 +12987,8 @@ var EarnAmountInputSimpleView = ({
12985
12987
  value,
12986
12988
  onChange,
12987
12989
  ariaLabel,
12988
- dollarAmountFormatted
12990
+ dollarAmountFormatted,
12991
+ disabled
12989
12992
  }) => {
12990
12993
  const isEmpty = !value || value === "0";
12991
12994
  const fontSizeClass = useResponsiveFontSize(value || "");
@@ -13026,9 +13029,10 @@ var EarnAmountInputSimpleView = ({
13026
13029
  placeholder: "0",
13027
13030
  "aria-label": ariaLabel,
13028
13031
  value,
13032
+ disabled,
13029
13033
  onChange,
13030
13034
  onWheel: (e) => e.currentTarget.blur(),
13031
- className: inputClasses
13035
+ className: twMerge(inputClasses, "disabled:cursor-not-allowed disabled:opacity-50")
13032
13036
  }
13033
13037
  ),
13034
13038
  dollarAmountFormatted && /* @__PURE__ */ jsx(
@@ -18913,6 +18917,388 @@ var OfframpFailedSimpleView = () => {
18913
18917
  }
18914
18918
  ) });
18915
18919
  };
18920
+
18921
+ // src/stories/wallet-transfer-flow-view/layoutClasses.ts
18922
+ var walletTransferFrameClasses = [
18923
+ "relative mx-auto mt-[40px] flex w-[620px] max-w-[calc(100vw-32px)] flex-col overflow-hidden",
18924
+ "rounded-[var(--deframe-widget-size-radius-xs)]",
18925
+ "bg-[var(--deframe-widget-color-bg-subtle)]",
18926
+ "px-[var(--deframe-widget-size-padding-x-lg)] py-[var(--deframe-widget-size-padding-y-lg)]",
18927
+ "font-[var(--deframe-widget-font-family)]",
18928
+ "text-[color:var(--deframe-widget-color-text-primary)]"
18929
+ ].join(" ");
18930
+ var walletTransferHeaderClasses = [
18931
+ "flex items-start gap-[var(--deframe-widget-size-gap-sm)]",
18932
+ "px-[var(--deframe-widget-size-padding-x-sm)]"
18933
+ ].join(" ");
18934
+ var walletTransferTitleClasses = [
18935
+ "text-[21px]",
18936
+ "[font-weight:var(--deframe-widget-font-weight-bold)]",
18937
+ "leading-[1.2]",
18938
+ "text-[color:var(--deframe-widget-color-text-primary)]"
18939
+ ].join(" ");
18940
+ var walletTransferSubtitleClasses = [
18941
+ "mt-[var(--deframe-widget-size-gap-xs)]",
18942
+ "text-[14px]",
18943
+ "leading-[1.35]",
18944
+ "text-[color:var(--deframe-widget-color-text-primary)]"
18945
+ ].join(" ");
18946
+ var walletTransferBodyClasses = [
18947
+ "flex flex-col gap-[var(--deframe-widget-size-gap-md)]",
18948
+ "px-[var(--deframe-widget-size-padding-x-sm)]",
18949
+ "py-[var(--deframe-widget-size-padding-y-md)]"
18950
+ ].join(" ");
18951
+ var walletTransferInputCardClasses = [
18952
+ "rounded-[var(--deframe-widget-size-radius-sm)]",
18953
+ "border border-[color:var(--deframe-widget-color-border-secondary)]",
18954
+ "bg-[var(--deframe-widget-color-bg-subtle)]",
18955
+ "px-[var(--deframe-widget-size-padding-x-md)] py-[var(--deframe-widget-size-padding-y-md)]"
18956
+ ].join(" ");
18957
+ var walletTransferTokenSelectorClasses = [
18958
+ "bg-[var(--deframe-widget-color-bg-raised)]",
18959
+ "hover:bg-[color:color-mix(in_srgb,var(--deframe-widget-color-bg-raised)_92%,transparent)]"
18960
+ ].join(" ");
18961
+ var walletTransferFooterClasses = [
18962
+ "px-[var(--deframe-widget-size-padding-x-sm)]",
18963
+ "pt-[var(--deframe-widget-size-padding-y-md)]"
18964
+ ].join(" ");
18965
+ function WalletOnchainDepositView({
18966
+ token,
18967
+ network,
18968
+ depositAddress,
18969
+ warningMessage,
18970
+ isPreparing,
18971
+ isReady,
18972
+ qrCode,
18973
+ onTokenClick,
18974
+ onAddressCopy,
18975
+ onSubmit,
18976
+ labels,
18977
+ className
18978
+ }) {
18979
+ var _a;
18980
+ const selectedToken = token ? { symbol: token.symbol, logoURI: token.logoURI } : null;
18981
+ const hasSelection = Boolean(token && network);
18982
+ const canSubmit = hasSelection && isReady;
18983
+ const submitLabel = canSubmit ? labels.submitReady : labels.submitIdle;
18984
+ const showAddress = canSubmit && depositAddress;
18985
+ const showIdle = !isPreparing && !showAddress;
18986
+ const addressCopyHandler = React6.useCallback(() => {
18987
+ if (!depositAddress) return;
18988
+ onAddressCopy == null ? void 0 : onAddressCopy(depositAddress);
18989
+ }, [depositAddress, onAddressCopy]);
18990
+ return /* @__PURE__ */ jsxs(
18991
+ "div",
18992
+ {
18993
+ "data-test-id": "wallet-onchain-deposit-view",
18994
+ className: twMerge(
18995
+ walletTransferFrameClasses,
18996
+ className
18997
+ ),
18998
+ children: [
18999
+ /* @__PURE__ */ jsx("header", { className: walletTransferHeaderClasses, children: /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
19000
+ /* @__PURE__ */ jsx("h2", { className: walletTransferTitleClasses, children: labels.title }),
19001
+ /* @__PURE__ */ jsx("p", { className: walletTransferSubtitleClasses, children: labels.subtitle })
19002
+ ] }) }),
19003
+ /* @__PURE__ */ jsxs("div", { className: walletTransferBodyClasses, children: [
19004
+ /* @__PURE__ */ jsx(
19005
+ "section",
19006
+ {
19007
+ "data-test-id": "wallet-onchain-deposit-view-asset-card",
19008
+ className: walletTransferInputCardClasses,
19009
+ children: /* @__PURE__ */ jsx(
19010
+ EarnTokenSelectorSimpleView,
19011
+ {
19012
+ selectedToken,
19013
+ onTokenClick,
19014
+ onNetworkAndAssetClick: onTokenClick,
19015
+ isLoading: false,
19016
+ selectTokenLabel: labels.tokenPlaceholder,
19017
+ chainLabel: (_a = network == null ? void 0 : network.name) != null ? _a : labels.networkPlaceholder,
19018
+ chainImage: network == null ? void 0 : network.iconUrl,
19019
+ className: twMerge(walletTransferTokenSelectorClasses, "w-full")
19020
+ }
19021
+ )
19022
+ }
19023
+ ),
19024
+ /* @__PURE__ */ jsx(
19025
+ EarnInlineNotificationSimpleView,
19026
+ {
19027
+ variant: "warning",
19028
+ message: warningMessage
19029
+ }
19030
+ ),
19031
+ /* @__PURE__ */ jsxs(
19032
+ "section",
19033
+ {
19034
+ "data-test-id": "wallet-onchain-deposit-view-address-card",
19035
+ className: walletTransferInputCardClasses,
19036
+ children: [
19037
+ isPreparing && /* @__PURE__ */ jsx(DepositSkeleton, {}),
19038
+ showAddress && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-md)]", children: [
19039
+ /* @__PURE__ */ jsxs("div", { children: [
19040
+ /* @__PURE__ */ jsx("p", { className: "text-[13px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)]", children: labels.addressTitle }),
19041
+ /* @__PURE__ */ jsx("p", { className: "mt-1 text-[12px] leading-[1.35] text-[color:var(--deframe-widget-color-text-tertiary)]", children: labels.addressSubtitle })
19042
+ ] }),
19043
+ /* @__PURE__ */ jsx(AddressDisplay, { address: depositAddress, onCopy: addressCopyHandler }),
19044
+ qrCode && /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx("div", { className: "rounded-[var(--deframe-widget-size-radius-sm)] bg-white p-3", children: qrCode }) })
19045
+ ] }),
19046
+ showIdle && /* @__PURE__ */ jsxs("div", { className: "flex min-h-[180px] flex-col items-center justify-center gap-[var(--deframe-widget-size-gap-xs)] text-center", children: [
19047
+ /* @__PURE__ */ jsx("p", { className: "text-[14px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)]", children: labels.idleTitle }),
19048
+ /* @__PURE__ */ jsx("p", { className: "max-w-[280px] text-[13px] leading-[1.4] text-[color:var(--deframe-widget-color-text-secondary)]", children: labels.idleSubtitle })
19049
+ ] })
19050
+ ]
19051
+ }
19052
+ )
19053
+ ] }),
19054
+ /* @__PURE__ */ jsx("footer", { className: walletTransferFooterClasses, children: /* @__PURE__ */ jsx(
19055
+ PrimaryButton,
19056
+ {
19057
+ type: "button",
19058
+ disabled: !canSubmit,
19059
+ onClick: onSubmit,
19060
+ className: "h-12 rounded-[var(--deframe-widget-size-radius-sm)] text-[15px]",
19061
+ children: submitLabel
19062
+ }
19063
+ ) })
19064
+ ]
19065
+ }
19066
+ );
19067
+ }
19068
+ function DepositSkeleton() {
19069
+ return /* @__PURE__ */ jsxs("div", { className: "flex min-h-[180px] flex-col items-center justify-center gap-[var(--deframe-widget-size-gap-md)]", children: [
19070
+ /* @__PURE__ */ jsx(Skeleton, { width: "70%", height: "1rem", variant: "text", shimmer: true }),
19071
+ /* @__PURE__ */ jsx(Skeleton, { width: "100%", height: "2rem", variant: "text", shimmer: true }),
19072
+ /* @__PURE__ */ jsx(Skeleton, { width: "8rem", height: "8rem", variant: "rect", className: "rounded-[var(--deframe-widget-size-radius-sm)]", shimmer: true })
19073
+ ] });
19074
+ }
19075
+ function WalletOnchainWithdrawView({
19076
+ token,
19077
+ network,
19078
+ formattedBalance,
19079
+ amount,
19080
+ formattedAmountValue,
19081
+ destinationAddress,
19082
+ destinationNetwork,
19083
+ details,
19084
+ isProcessing,
19085
+ isAmountDisabled,
19086
+ showMaxButton,
19087
+ minAmountWarning,
19088
+ walletError,
19089
+ transferError,
19090
+ finalWarning,
19091
+ submitDisabled,
19092
+ submitLabel,
19093
+ onTokenClick,
19094
+ onAmountChange,
19095
+ onMaxClick,
19096
+ onDestinationAddressChange,
19097
+ onSubmit,
19098
+ labels,
19099
+ className
19100
+ }) {
19101
+ var _a;
19102
+ const [isDetailsOpen, setIsDetailsOpen] = React6.useState(false);
19103
+ const selectedToken = token ? { symbol: token.symbol, logoURI: token.logoURI } : null;
19104
+ const hasToken = Boolean(token && network);
19105
+ const hasAmountAlert = Boolean(minAmountWarning || walletError);
19106
+ const hasAddressAlert = Boolean(transferError);
19107
+ const tokenSelectorClick = isProcessing ? void 0 : onTokenClick;
19108
+ const destinationNetworkText = destinationNetwork ? `${labels.destinationNetworkHint}: ${destinationNetwork.name}` : labels.destinationNetworkEmpty;
19109
+ React6.useEffect(() => {
19110
+ setIsDetailsOpen(Boolean(details));
19111
+ }, [details]);
19112
+ const amountCardClasses = twMerge(
19113
+ walletTransferInputCardClasses,
19114
+ "transition-[border-color,background] duration-200",
19115
+ hasAmountAlert ? "border-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_32%,transparent)] bg-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_16%,transparent)]" : ""
19116
+ );
19117
+ const addressCardClasses = twMerge(
19118
+ walletTransferInputCardClasses,
19119
+ "transition-[border-color,background] duration-200",
19120
+ hasAddressAlert ? "border-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_32%,transparent)] bg-[color:color-mix(in_srgb,var(--deframe-widget-color-state-error)_16%,transparent)]" : ""
19121
+ );
19122
+ const addressInputWrapperClasses = twMerge(
19123
+ "flex min-h-[34px] items-center border-0 bg-transparent transition-[color] duration-150",
19124
+ hasAddressAlert ? "text-[color:var(--deframe-widget-color-state-error)]" : "focus-within:text-[color:var(--deframe-widget-color-text-primary)]"
19125
+ );
19126
+ return /* @__PURE__ */ jsxs(
19127
+ "div",
19128
+ {
19129
+ "data-test-id": "wallet-onchain-withdraw-view",
19130
+ className: twMerge(
19131
+ walletTransferFrameClasses,
19132
+ className
19133
+ ),
19134
+ children: [
19135
+ /* @__PURE__ */ jsx("header", { className: walletTransferHeaderClasses, children: /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
19136
+ /* @__PURE__ */ jsx("h2", { className: walletTransferTitleClasses, children: labels.title }),
19137
+ /* @__PURE__ */ jsx("p", { className: walletTransferSubtitleClasses, children: labels.subtitle })
19138
+ ] }) }),
19139
+ /* @__PURE__ */ jsxs("div", { className: walletTransferBodyClasses, children: [
19140
+ /* @__PURE__ */ jsxs("section", { "data-test-id": "wallet-onchain-withdraw-view-amount-card", className: amountCardClasses, children: [
19141
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[var(--deframe-widget-size-gap-sm)]", children: [
19142
+ /* @__PURE__ */ jsx(
19143
+ EarnTokenSelectorSimpleView,
19144
+ {
19145
+ selectedToken,
19146
+ onTokenClick,
19147
+ onNetworkAndAssetClick: tokenSelectorClick,
19148
+ isLoading: false,
19149
+ selectTokenLabel: labels.tokenPlaceholder,
19150
+ chainLabel: (_a = network == null ? void 0 : network.name) != null ? _a : labels.sourceNetworkPlaceholder,
19151
+ chainImage: network == null ? void 0 : network.iconUrl,
19152
+ className: walletTransferTokenSelectorClasses
19153
+ }
19154
+ ),
19155
+ /* @__PURE__ */ jsx("div", { className: "h-10 w-px shrink-0 bg-[var(--deframe-widget-color-border-secondary)]" }),
19156
+ /* @__PURE__ */ jsx(
19157
+ EarnAmountInputSimpleView,
19158
+ {
19159
+ value: amount,
19160
+ onChange: (event) => onAmountChange(event.target.value),
19161
+ ariaLabel: "Amount to withdraw",
19162
+ dollarAmountFormatted: formattedAmountValue,
19163
+ disabled: isAmountDisabled || isProcessing
19164
+ }
19165
+ )
19166
+ ] }),
19167
+ hasToken && /* @__PURE__ */ jsxs("div", { className: "mt-[var(--deframe-widget-size-gap-sm)] flex items-center justify-between gap-[var(--deframe-widget-size-gap-sm)]", children: [
19168
+ /* @__PURE__ */ jsxs("span", { className: "min-w-0 truncate text-[13px] text-[color:var(--deframe-widget-color-text-secondary)]", children: [
19169
+ labels.balanceLabel,
19170
+ ": ",
19171
+ formattedBalance
19172
+ ] }),
19173
+ showMaxButton && /* @__PURE__ */ jsx(
19174
+ "button",
19175
+ {
19176
+ type: "button",
19177
+ onClick: onMaxClick,
19178
+ disabled: isAmountDisabled || isProcessing,
19179
+ className: "shrink-0 cursor-pointer text-[13px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-brand-primary)] transition-opacity hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50",
19180
+ children: labels.maxLabel
19181
+ }
19182
+ )
19183
+ ] }),
19184
+ minAmountWarning && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(EarnInlineNotificationSimpleView, { variant: "warning", message: minAmountWarning }) }),
19185
+ walletError && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(EarnInlineNotificationSimpleView, { variant: "error", message: walletError }) })
19186
+ ] }),
19187
+ /* @__PURE__ */ jsxs("section", { "data-test-id": "wallet-onchain-withdraw-view-address-card", className: addressCardClasses, children: [
19188
+ /* @__PURE__ */ jsxs("label", { className: "flex flex-col gap-[var(--deframe-widget-size-gap-sm)]", children: [
19189
+ /* @__PURE__ */ jsx("span", { className: "text-[13px] [font-weight:var(--deframe-widget-font-weight-medium)] text-[color:var(--deframe-widget-color-text-secondary)]", children: labels.destinationAddressLabel }),
19190
+ /* @__PURE__ */ jsx("span", { className: addressInputWrapperClasses, children: /* @__PURE__ */ jsx(
19191
+ "input",
19192
+ {
19193
+ type: "text",
19194
+ value: destinationAddress,
19195
+ onChange: (event) => onDestinationAddressChange(event.target.value),
19196
+ placeholder: labels.destinationAddressPlaceholder,
19197
+ disabled: isProcessing,
19198
+ "aria-label": labels.destinationAddressLabel,
19199
+ spellCheck: false,
19200
+ autoComplete: "off",
19201
+ className: "w-full bg-transparent text-[14px] leading-[1.35] text-[color:var(--deframe-widget-color-text-primary)] outline-none placeholder:text-[color:var(--deframe-widget-color-text-secondary)] disabled:cursor-not-allowed disabled:opacity-50"
19202
+ }
19203
+ ) })
19204
+ ] }),
19205
+ /* @__PURE__ */ jsxs("div", { className: "mt-[var(--deframe-widget-size-gap-sm)] flex items-center justify-between gap-[var(--deframe-widget-size-gap-sm)] border-t border-[color:var(--deframe-widget-color-border-secondary)] pt-[var(--deframe-widget-size-gap-sm)]", children: [
19206
+ /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[12px] text-[color:var(--deframe-widget-color-text-tertiary)]", children: labels.destinationNetworkLabel }),
19207
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-right text-[12px] [font-weight:var(--deframe-widget-font-weight-medium)] text-[color:var(--deframe-widget-color-text-secondary)]", children: destinationNetworkText })
19208
+ ] }),
19209
+ transferError && /* @__PURE__ */ jsx("div", { className: "mt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(EarnInlineNotificationSimpleView, { variant: "error", message: transferError }) })
19210
+ ] }),
19211
+ /* @__PURE__ */ jsx(EarnInlineNotificationSimpleView, { variant: "info", message: labels.infoMessage }),
19212
+ finalWarning && /* @__PURE__ */ jsx(EarnInlineNotificationSimpleView, { variant: "warning", message: finalWarning }),
19213
+ details && /* @__PURE__ */ jsxs("section", { className: walletTransferInputCardClasses, children: [
19214
+ /* @__PURE__ */ jsxs(
19215
+ "button",
19216
+ {
19217
+ type: "button",
19218
+ onClick: () => setIsDetailsOpen((value) => !value),
19219
+ className: "flex w-full items-center justify-between gap-[var(--deframe-widget-size-gap-md)] text-left",
19220
+ children: [
19221
+ /* @__PURE__ */ jsx("span", { className: "text-[13px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)]", children: labels.detailsTitle }),
19222
+ /* @__PURE__ */ jsx(
19223
+ MdOutlineExpandMore,
19224
+ {
19225
+ className: twMerge("h-5 w-5 shrink-0 text-[color:var(--deframe-widget-color-text-secondary)] transition-transform", isDetailsOpen && "rotate-180"),
19226
+ "aria-hidden": "true"
19227
+ }
19228
+ )
19229
+ ]
19230
+ }
19231
+ ),
19232
+ isDetailsOpen && /* @__PURE__ */ jsxs("div", { className: "mt-[var(--deframe-widget-size-gap-md)] flex flex-col gap-[var(--deframe-widget-size-gap-sm)]", children: [
19233
+ /* @__PURE__ */ jsx(DetailRow2, { label: labels.detailsAmountLabel, value: details.amount }),
19234
+ /* @__PURE__ */ jsx(DetailRow2, { label: labels.detailsFeeLabel, value: details.fee }),
19235
+ /* @__PURE__ */ jsx("div", { className: "border-t border-[color:var(--deframe-widget-color-border-secondary)] pt-[var(--deframe-widget-size-gap-sm)]", children: /* @__PURE__ */ jsx(DetailRow2, { label: labels.detailsReceiveLabel, value: details.receive, strong: true }) })
19236
+ ] })
19237
+ ] })
19238
+ ] }),
19239
+ /* @__PURE__ */ jsx("footer", { className: walletTransferFooterClasses, children: /* @__PURE__ */ jsx(
19240
+ PrimaryButton,
19241
+ {
19242
+ type: "button",
19243
+ disabled: submitDisabled,
19244
+ onClick: onSubmit,
19245
+ className: "h-12 rounded-[var(--deframe-widget-size-radius-sm)] text-[15px]",
19246
+ children: submitLabel
19247
+ }
19248
+ ) })
19249
+ ]
19250
+ }
19251
+ );
19252
+ }
19253
+ function DetailRow2({ label, value, strong = false }) {
19254
+ const valueClasses = strong ? "text-[14px] [font-weight:var(--deframe-widget-font-weight-semibold)] text-[color:var(--deframe-widget-color-text-primary)]" : "text-[13px] [font-weight:var(--deframe-widget-font-weight-medium)] text-[color:var(--deframe-widget-color-text-primary)]";
19255
+ return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-[var(--deframe-widget-size-gap-md)]", children: [
19256
+ /* @__PURE__ */ jsx("span", { className: "text-[13px] text-[color:var(--deframe-widget-color-text-secondary)]", children: label }),
19257
+ /* @__PURE__ */ jsx("span", { className: valueClasses, children: value })
19258
+ ] });
19259
+ }
19260
+ function WalletTransferAssetNetworkPicker({
19261
+ isOpen,
19262
+ onClose,
19263
+ networks,
19264
+ selectedNetwork,
19265
+ onNetworkSelect,
19266
+ displayedTokens,
19267
+ findBalance,
19268
+ formatTokenAmount,
19269
+ formatCurrencyValue,
19270
+ onAssetClick,
19271
+ onSearch,
19272
+ autoFocus,
19273
+ hasMore = false,
19274
+ onLoadMore,
19275
+ isFetching = false,
19276
+ labels
19277
+ }) {
19278
+ const handleLoadMore = onLoadMore != null ? onLoadMore : (() => void 0);
19279
+ return /* @__PURE__ */ jsx(
19280
+ ChooseNetworkAndAssetViewSimple,
19281
+ {
19282
+ isOpen,
19283
+ onClose,
19284
+ networks,
19285
+ selectedNetwork,
19286
+ onNetworkSelect,
19287
+ displayedTokens,
19288
+ findBalance,
19289
+ formatTokenAmount,
19290
+ formatCurrencyValue,
19291
+ onAssetClick,
19292
+ onSearch,
19293
+ autoFocus,
19294
+ closeOnBackdropClick: true,
19295
+ hasMore,
19296
+ onLoadMore: handleLoadMore,
19297
+ isFetching,
19298
+ labels
19299
+ }
19300
+ );
19301
+ }
18916
19302
  var DashboardCard = ({ children, className }) => {
18917
19303
  return /* @__PURE__ */ jsx("div", { "data-test-id": "dashboard-card", className: twMerge("bg-[var(--deframe-widget-color-bg-subtle)] rounded", className), children });
18918
19304
  };
@@ -20104,6 +20490,6 @@ var DashboardViewSimple = ({
20104
20490
  );
20105
20491
  };
20106
20492
 
20107
- export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChoiceCard, ChooseANetworkView, ChooseAStrategyActionsheetView, ChooseAnAssetSwapView, ChooseNetworkAndAssetViewSimple, CloseButton_default as CloseButton, CollapsibleInfoRow, CollapsibleSection, ConfirmSwapButtonView, ConfirmSwapButtonViewSimple, ConnectWalletList, Currency, DashboardBalancesBreakdown, DashboardCard, DashboardInvestmentOpportunitiesView, DashboardPortfolioView, DashboardPortfolioViewSimple, DashboardRecentTransactionsView, DashboardRecentTransactionsViewSimple, DashboardStrategiesListView, DashboardTokenListView, DashboardTokensView, DashboardTokensViewSimple, DashboardTransactionsPlaceholder, DashboardView, DashboardViewSimple, DeframeComponentsProvider, DepositSuccessIcon, DetailsHeader, EARN_CATEGORY_DEFINITIONS, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnDesktopViewSimple, EarnExploreGridView, EarnFlowSkeletonSimple, EarnHistoryView, EarnInvestedSectionView, EarnInvestmentDetailsView, EarnInvestmentSummaryView, EarnNoBalanceNotificationView, EarnOverviewView, EarnPercentageButtonsView, EarnPositionCardView, EarnRecentTransactionsView, EarnTokenSelectorView, EarnTxStatusCardView, EarnWithdrawFailedSimpleView, EarnWithdrawFailedView, EarnWithdrawFormView, EarnWithdrawFormViewSimple, EarnWithdrawProcessingSimpleView, EarnWithdrawProcessingView, EarnWithdrawSuccessSimpleView, EarnWithdrawSuccessView, EarnWithdrawTokenSelectorView, EarnWithdrawWarningSimpleView, EarnWithdrawWarningView, Currency as Fiat, FlexCol, FlexRow, GroupedStrategyListView, HighRiskBadge, HistoryDepositDetailsView, HistoryListItem, HistoryListItemSimple, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InputField, InputLabel, Input as InputRoot, InvestmentCrossChainProcessingSimpleView, InvestmentCrossChainProcessingView, KYCActionRow, KYCAddressPage, KYCBasicDataPage, KYCChecklistCard, KYCChecklistItem, KYCDataCard, KYCDocumentPage, KYCEditPage, KYCFieldMessage, KYCFormPage, KYCInfoRow, KYCIntroPage, KYCLoadingPage, KYCMessageBanner, KYCPageHeader, KYCPageSection, KYCPageShell, KYCReviewPage, KYCReviewPageSkeleton, KYCStatusItemCard, KYCStatusPage, KYCStatusPanel, KYCStepIndicator, KycLoadingView, KycRequiredView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, OffchainMethodSelectionView, OfframpFailedSimpleView, OfframpInputFormSimpleView, OfframpInputFormView, OfframpProcessingSimpleView, OfframpProcessingView, OfframpSuccessSimpleView, OfframpSuccessView, OnchainDepositFormSimpleView, OnchainDepositFormView, OnchainDepositSuccessSimpleView, OnchainDepositSuccessView, OnchainWithdrawChainSelectorView, OnchainWithdrawFailedSimpleView, OnchainWithdrawFailedView, OnchainWithdrawFormSimpleView, OnchainWithdrawFormView, OnchainWithdrawProcessingSimpleView, OnchainWithdrawSignatureWarningSimpleView, OnchainWithdrawSignatureWarningView, OnchainWithdrawSuccessSimpleView, OnchainWithdrawSuccessView, OnrampFormSimpleView, OnrampFormView, OnrampPixcodeView, OnrampSuccessSimpleView, OnrampSuccessView, PercentageButton, PodsSwapFormView, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapCrossChainProcessingViewSimple, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapHistoryViewSimple, SwapProcessingView, SwapProcessingViewSimple, SwapQuoteDetailsView, SwapSignatureWarningView, SwapSignatureWarningViewSimple, SwapSuccessView, SwapSuccessViewSimple, SwapToCardView, SwapToCardViewSimple, SwapTransactionFailedView, SwapTransactionFailedViewSimple, SwapWidgetFallbackView, Tabs, TabsContent, TabsList, TabsTrigger, TertiaryButton, Text_default as Text, TextAccent, TextBody, TextHeading, Title, TokenWithChainBadge, TransactionProcessingDetails, TransactionScreen, TransactionScreenIcon, TransactionScreenInvestmentCard, WalletBalances, WalletConnectPanel, WalletItem, ConnectWalletList as WalletList, WalletListContainer, WithdrawFailedIcon, WithdrawSuccessIcon, isBrlPeggedToken, isDustValue, isUsdPeggedToken, isWellKnownToken, truncateAddress };
20493
+ export { ActionButton, ActionSheet, AddressDisplay, ApyRange, BackButton, BackgroundContainer, BannerNotification, Chip, ChipGroup, ChoiceCard, ChooseANetworkView, ChooseAStrategyActionsheetView, ChooseAnAssetSwapView, ChooseNetworkAndAssetViewSimple, CloseButton_default as CloseButton, CollapsibleInfoRow, CollapsibleSection, ConfirmSwapButtonView, ConfirmSwapButtonViewSimple, ConnectWalletList, Currency, DashboardBalancesBreakdown, DashboardCard, DashboardInvestmentOpportunitiesView, DashboardPortfolioView, DashboardPortfolioViewSimple, DashboardRecentTransactionsView, DashboardRecentTransactionsViewSimple, DashboardStrategiesListView, DashboardTokenListView, DashboardTokensView, DashboardTokensViewSimple, DashboardTransactionsPlaceholder, DashboardView, DashboardViewSimple, DeframeComponentsProvider, DepositSuccessIcon, DetailsHeader, EARN_CATEGORY_DEFINITIONS, EarnAmountInputView, EarnBalanceCard, EarnBytecodeErrorView, EarnDepositFailedSimpleView, EarnDepositFailedView, EarnDepositFormView, EarnDepositFormViewSimple, EarnDepositProcessingSimpleView, EarnDepositProcessingView, EarnDepositSuccessSimpleView, EarnDepositSuccessView, EarnDepositWarningSimpleView, EarnDepositWarningView, EarnDesktopView, EarnDesktopViewSimple, EarnExploreGridView, EarnFlowSkeletonSimple, EarnHistoryView, EarnInvestedSectionView, EarnInvestmentDetailsView, EarnInvestmentSummaryView, EarnNoBalanceNotificationView, EarnOverviewView, EarnPercentageButtonsView, EarnPositionCardView, EarnRecentTransactionsView, EarnTokenSelectorView, EarnTxStatusCardView, EarnWithdrawFailedSimpleView, EarnWithdrawFailedView, EarnWithdrawFormView, EarnWithdrawFormViewSimple, EarnWithdrawProcessingSimpleView, EarnWithdrawProcessingView, EarnWithdrawSuccessSimpleView, EarnWithdrawSuccessView, EarnWithdrawTokenSelectorView, EarnWithdrawWarningSimpleView, EarnWithdrawWarningView, Currency as Fiat, FlexCol, FlexRow, GroupedStrategyListView, HighRiskBadge, HistoryDepositDetailsView, HistoryListItem, HistoryListItemSimple, HistoryListSkeleton, HistoryListView, HistorySwapDetailsView, HistoryTabEmpty, HistoryWithdrawDetailsView, InfoLabel, InfoRow, InfoRowIconLabel, InfoRowIconValue, InfoRowWithIcon, InfoValue, Input2 as Input, InputField, InputLabel, Input as InputRoot, InvestmentCrossChainProcessingSimpleView, InvestmentCrossChainProcessingView, KYCActionRow, KYCAddressPage, KYCBasicDataPage, KYCChecklistCard, KYCChecklistItem, KYCDataCard, KYCDocumentPage, KYCEditPage, KYCFieldMessage, KYCFormPage, KYCInfoRow, KYCIntroPage, KYCLoadingPage, KYCMessageBanner, KYCPageHeader, KYCPageSection, KYCPageShell, KYCReviewPage, KYCReviewPageSkeleton, KYCStatusItemCard, KYCStatusPage, KYCStatusPanel, KYCStepIndicator, KycLoadingView, KycRequiredView, Label, Link, ListItem, ListItemContent, ListItemLeftSide, ListItemRightSide, LoadingDots, LowRiskBadge, MediumRiskBadge, Navbar, OffchainMethodSelectionView, OfframpFailedSimpleView, OfframpInputFormSimpleView, OfframpInputFormView, OfframpProcessingSimpleView, OfframpProcessingView, OfframpSuccessSimpleView, OfframpSuccessView, OnchainDepositFormSimpleView, OnchainDepositFormView, OnchainDepositSuccessSimpleView, OnchainDepositSuccessView, OnchainWithdrawChainSelectorView, OnchainWithdrawFailedSimpleView, OnchainWithdrawFailedView, OnchainWithdrawFormSimpleView, OnchainWithdrawFormView, OnchainWithdrawProcessingSimpleView, OnchainWithdrawSignatureWarningSimpleView, OnchainWithdrawSignatureWarningView, OnchainWithdrawSuccessSimpleView, OnchainWithdrawSuccessView, OnrampFormSimpleView, OnrampFormView, OnrampPixcodeView, OnrampSuccessSimpleView, OnrampSuccessView, PercentageButton, PodsSwapFormView, PrimaryButton, ProcessingBadge, ProgressIndicator, ScrollableContent, SearchEmptyState, SearchInput, SecondaryButton, SectionCard, Select, SelectContent, SelectItem, SelectTrigger, Skeleton, StepDisplay, StepStatusIcon, StepStatusText, StrategyDetailsView, StrategyGridCard, SummaryDetails, SummaryDetailsCryptoControlV2, SwapAdvancedSettingsView, SwapAmountInputView, SwapCrossChainProcessingView, SwapCrossChainProcessingViewSimple, SwapFormView, SwapFormViewSimple, SwapFromCardView, SwapFromCardViewSimple, SwapHistoryView, SwapHistoryViewSimple, SwapProcessingView, SwapProcessingViewSimple, SwapQuoteDetailsView, SwapSignatureWarningView, SwapSignatureWarningViewSimple, SwapSuccessView, SwapSuccessViewSimple, SwapToCardView, SwapToCardViewSimple, SwapTransactionFailedView, SwapTransactionFailedViewSimple, SwapWidgetFallbackView, Tabs, TabsContent, TabsList, TabsTrigger, TertiaryButton, Text_default as Text, TextAccent, TextBody, TextHeading, Title, TokenWithChainBadge, TransactionProcessingDetails, TransactionScreen, TransactionScreenIcon, TransactionScreenInvestmentCard, WalletBalances, WalletConnectPanel, WalletItem, ConnectWalletList as WalletList, WalletListContainer, WalletOnchainDepositView, WalletOnchainWithdrawView, WalletTransferAssetNetworkPicker, WithdrawFailedIcon, WithdrawSuccessIcon, isBrlPeggedToken, isDustValue, isUsdPeggedToken, isWellKnownToken, truncateAddress };
20108
20494
  //# sourceMappingURL=index.mjs.map
20109
20495
  //# sourceMappingURL=index.mjs.map