kaleido-ui 0.1.31 → 0.1.32
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/web/index.cjs +218 -194
- package/dist/web/index.d.cts +14 -2
- package/dist/web/index.d.ts +14 -2
- package/dist/web/index.js +218 -194
- package/package.json +1 -1
package/dist/web/index.cjs
CHANGED
|
@@ -2321,7 +2321,9 @@ function FilterDropdown({
|
|
|
2321
2321
|
options,
|
|
2322
2322
|
onChange,
|
|
2323
2323
|
clusterMax = 3,
|
|
2324
|
-
className
|
|
2324
|
+
className,
|
|
2325
|
+
compact = false,
|
|
2326
|
+
hideLabel = false
|
|
2325
2327
|
}) {
|
|
2326
2328
|
const [isOpen, setIsOpen] = (0, import_react8.useState)(false);
|
|
2327
2329
|
const selected = options.find((option) => option.id === value) ?? options[0];
|
|
@@ -2335,16 +2337,19 @@ function FilterDropdown({
|
|
|
2335
2337
|
{
|
|
2336
2338
|
type: "button",
|
|
2337
2339
|
onClick: () => setIsOpen(!isOpen),
|
|
2340
|
+
"aria-label": hideLabel ? label : void 0,
|
|
2338
2341
|
className: cn(
|
|
2339
|
-
"flex w-full items-center justify-between
|
|
2342
|
+
"flex w-full items-center justify-between rounded-2xl leading-none outline-none transition-all",
|
|
2343
|
+
compact ? "gap-1 px-2 py-1.5" : "gap-1.5 px-2.5 py-2",
|
|
2340
2344
|
isFiltered ? "bg-white/[0.13] shadow-inner" : "bg-white/[0.09] backdrop-blur-md hover:bg-white/[0.13]"
|
|
2341
2345
|
),
|
|
2342
2346
|
children: [
|
|
2343
|
-
/* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
2347
|
+
!hideLabel && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
|
|
2344
2348
|
"span",
|
|
2345
2349
|
{
|
|
2346
2350
|
className: cn(
|
|
2347
|
-
"shrink-0
|
|
2351
|
+
"shrink-0 font-bold uppercase tracking-wider",
|
|
2352
|
+
compact ? "text-xxs" : "text-mini",
|
|
2348
2353
|
isFiltered ? "text-muted-foreground" : "text-white/45"
|
|
2349
2354
|
),
|
|
2350
2355
|
children: label
|
|
@@ -2953,209 +2958,228 @@ function BalanceBreakdown({
|
|
|
2953
2958
|
btcArkadePending = false,
|
|
2954
2959
|
onRefresh,
|
|
2955
2960
|
isRefreshing = false,
|
|
2956
|
-
onNavigate
|
|
2961
|
+
onNavigate,
|
|
2962
|
+
compact = false
|
|
2957
2963
|
}) {
|
|
2958
2964
|
const [expanded, setExpanded] = (0, import_react10.useState)(false);
|
|
2959
2965
|
const fiatTotal = formatFiatValue(totalBTC);
|
|
2960
|
-
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className:
|
|
2961
|
-
|
|
2962
|
-
|
|
2963
|
-
|
|
2964
|
-
|
|
2965
|
-
{
|
|
2966
|
-
|
|
2967
|
-
|
|
2968
|
-
|
|
2969
|
-
|
|
2970
|
-
|
|
2971
|
-
|
|
2972
|
-
|
|
2973
|
-
|
|
2974
|
-
|
|
2975
|
-
|
|
2976
|
-
|
|
2977
|
-
|
|
2978
|
-
|
|
2966
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: `flex flex-col ${compact ? "gap-2" : "gap-3"}`, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
2967
|
+
"div",
|
|
2968
|
+
{
|
|
2969
|
+
className: `relative overflow-hidden rounded-3xl bg-card ${compact ? "p-3.5" : "p-5"}`,
|
|
2970
|
+
children: [
|
|
2971
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "pointer-events-none absolute right-0 top-0 h-48 w-48 -translate-y-1/4 translate-x-1/4 rounded-full bg-white/[0.04] blur-[60px]" }),
|
|
2972
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "relative z-10 flex items-start justify-between gap-3", children: [
|
|
2973
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
2974
|
+
"button",
|
|
2975
|
+
{
|
|
2976
|
+
onClick: cycle,
|
|
2977
|
+
className: "group flex min-w-0 flex-1 flex-col items-start text-left",
|
|
2978
|
+
title: `Tap to switch unit (current: ${label})`,
|
|
2979
|
+
children: [
|
|
2980
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "mb-1 text-xxs font-bold uppercase tracking-widest text-white/40", children: "Total Balance" }),
|
|
2981
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "mt-1 space-y-2", children: [
|
|
2982
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "h-9 w-36 animate-pulse rounded-lg bg-white/10" }),
|
|
2983
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: "h-3 w-20 animate-pulse rounded bg-white/5" })
|
|
2984
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(import_jsx_runtime34.Fragment, { children: [
|
|
2985
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex min-w-0 max-w-full flex-wrap items-baseline gap-x-2.5 gap-y-1", children: [
|
|
2986
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-display font-black leading-[1.1] tracking-tighter text-white drop-shadow-sm transition-all duration-300 group-active:scale-95 group-active:text-primary", children: balanceVisible ? numberOnly(format(totalBTC)) : "\u2022\u2022\u2022\u2022\u2022\u2022" }),
|
|
2987
|
+
unit !== "fiat" && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "inline-block rounded-md border border-white/10 bg-white/5 px-2 py-0.5 text-tiny font-bold uppercase tracking-widest text-white/45", children: label }),
|
|
2988
|
+
isPartial && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2989
|
+
"span",
|
|
2990
|
+
{
|
|
2991
|
+
className: "inline-flex size-4 items-center justify-center rounded-full border bg-white/[0.06]",
|
|
2992
|
+
title: "Loading remaining balances",
|
|
2993
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "size-2 animate-spin rounded-full border border-primary/30 border-t-primary" })
|
|
2994
|
+
}
|
|
2995
|
+
)
|
|
2996
|
+
] }),
|
|
2997
|
+
balanceVisible && unit !== "fiat" && fiatTotal && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "mt-1 font-mono text-xs font-medium text-white/45", children: fiatTotal }),
|
|
2998
|
+
balanceVisible && unit === "fiat" && totalBTC > 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { className: "mt-1 font-mono text-xs font-medium text-white/45", children: [
|
|
2999
|
+
(totalBTC / 1e8).toFixed(8).replace(/\.?0+$/, ""),
|
|
3000
|
+
"\xA0BTC"
|
|
3001
|
+
] })
|
|
3002
|
+
] })
|
|
3003
|
+
]
|
|
3004
|
+
}
|
|
3005
|
+
),
|
|
3006
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "mt-1 flex shrink-0 items-center gap-1.5", children: [
|
|
3007
|
+
onRefresh && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3008
|
+
"button",
|
|
3009
|
+
{
|
|
3010
|
+
onClick: onRefresh,
|
|
3011
|
+
disabled: isRefreshing,
|
|
3012
|
+
className: "flex size-7 items-center justify-center rounded-full bg-white/[0.08] transition-all hover:bg-white/[0.12] disabled:opacity-40",
|
|
3013
|
+
title: "Refresh balances",
|
|
3014
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2979
3015
|
"span",
|
|
2980
3016
|
{
|
|
2981
|
-
className:
|
|
2982
|
-
|
|
2983
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "size-2 animate-spin rounded-full border border-primary/30 border-t-primary" })
|
|
3017
|
+
className: `material-symbols-outlined text-icon-sm leading-none text-white/60${isRefreshing ? " animate-spin" : ""}`,
|
|
3018
|
+
children: "refresh"
|
|
2984
3019
|
}
|
|
2985
3020
|
)
|
|
2986
|
-
|
|
2987
|
-
|
|
2988
|
-
|
|
2989
|
-
|
|
2990
|
-
"\xA0BTC"
|
|
2991
|
-
] })
|
|
2992
|
-
] })
|
|
2993
|
-
]
|
|
2994
|
-
}
|
|
2995
|
-
),
|
|
2996
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "mt-1 flex shrink-0 items-center gap-1.5", children: [
|
|
2997
|
-
onRefresh && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
2998
|
-
"button",
|
|
2999
|
-
{
|
|
3000
|
-
onClick: onRefresh,
|
|
3001
|
-
disabled: isRefreshing,
|
|
3002
|
-
className: "flex size-7 items-center justify-center rounded-full bg-white/[0.08] transition-all hover:bg-white/[0.12] disabled:opacity-40",
|
|
3003
|
-
title: "Refresh balances",
|
|
3004
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3005
|
-
"span",
|
|
3021
|
+
}
|
|
3022
|
+
),
|
|
3023
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3024
|
+
"button",
|
|
3006
3025
|
{
|
|
3007
|
-
|
|
3008
|
-
|
|
3026
|
+
onClick: () => setExpanded(!expanded),
|
|
3027
|
+
className: "flex size-7 items-center justify-center rounded-full bg-white/[0.08] transition-all hover:bg-white/[0.12]",
|
|
3028
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3029
|
+
Icon2,
|
|
3030
|
+
{
|
|
3031
|
+
name: expanded ? "expand_less" : "expand_more",
|
|
3032
|
+
size: "sm",
|
|
3033
|
+
className: "text-white/60"
|
|
3034
|
+
}
|
|
3035
|
+
)
|
|
3009
3036
|
}
|
|
3010
3037
|
)
|
|
3038
|
+
] })
|
|
3039
|
+
] }),
|
|
3040
|
+
expanded && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
3041
|
+
"div",
|
|
3042
|
+
{
|
|
3043
|
+
className: `space-y-1 border-t border-white/[0.08] duration-300 animate-in fade-in slide-in-from-top-2 ${compact ? "mt-3 pt-3" : "mt-4 pt-4"}`,
|
|
3044
|
+
children: [
|
|
3045
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "Bitcoin" }),
|
|
3046
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3047
|
+
NetworkRow,
|
|
3048
|
+
{
|
|
3049
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(OnchainIcon, { className: "text-icon-sm" }),
|
|
3050
|
+
iconColor: "text-network-spark",
|
|
3051
|
+
dotColor: "bg-network-spark",
|
|
3052
|
+
label: "BTC on-chain",
|
|
3053
|
+
sublabel: "Standard Bitcoin balance",
|
|
3054
|
+
amount: btcOnchain,
|
|
3055
|
+
isPending: btcOnchainPending,
|
|
3056
|
+
visible: balanceVisible,
|
|
3057
|
+
format,
|
|
3058
|
+
formatFiat: formatFiatValue
|
|
3059
|
+
}
|
|
3060
|
+
),
|
|
3061
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3062
|
+
NetworkRow,
|
|
3063
|
+
{
|
|
3064
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3065
|
+
ImageIcon,
|
|
3066
|
+
{
|
|
3067
|
+
src: "/icons/lightning/lightning.svg",
|
|
3068
|
+
alt: "Lightning",
|
|
3069
|
+
className: "size-3.5"
|
|
3070
|
+
}
|
|
3071
|
+
),
|
|
3072
|
+
iconColor: "text-network-lightning",
|
|
3073
|
+
dotColor: "bg-network-lightning",
|
|
3074
|
+
label: "BTC on RLN",
|
|
3075
|
+
sublabel: "RLN balance",
|
|
3076
|
+
amount: btcLightning,
|
|
3077
|
+
isPending: btcLightningPending,
|
|
3078
|
+
visible: balanceVisible,
|
|
3079
|
+
format,
|
|
3080
|
+
formatFiat: formatFiatValue
|
|
3081
|
+
}
|
|
3082
|
+
),
|
|
3083
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3084
|
+
NetworkRow,
|
|
3085
|
+
{
|
|
3086
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3087
|
+
ImageIcon,
|
|
3088
|
+
{
|
|
3089
|
+
src: "/icons/spark/Asterisk/Spark Asterisk White.svg",
|
|
3090
|
+
alt: "Spark",
|
|
3091
|
+
className: "size-3.5 opacity-90"
|
|
3092
|
+
}
|
|
3093
|
+
),
|
|
3094
|
+
iconColor: "",
|
|
3095
|
+
dotColor: "bg-info",
|
|
3096
|
+
label: "BTC on Spark",
|
|
3097
|
+
sublabel: "Spark balance",
|
|
3098
|
+
amount: btcSpark,
|
|
3099
|
+
isPending: btcSparkPending,
|
|
3100
|
+
visible: balanceVisible,
|
|
3101
|
+
format,
|
|
3102
|
+
formatFiat: formatFiatValue
|
|
3103
|
+
}
|
|
3104
|
+
),
|
|
3105
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3106
|
+
NetworkRow,
|
|
3107
|
+
{
|
|
3108
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3109
|
+
ImageIcon,
|
|
3110
|
+
{
|
|
3111
|
+
src: "/icons/arkade/arkade-icon.svg",
|
|
3112
|
+
alt: "Arkade",
|
|
3113
|
+
className: "size-3.5 rounded-sm"
|
|
3114
|
+
}
|
|
3115
|
+
),
|
|
3116
|
+
iconColor: "",
|
|
3117
|
+
dotColor: "bg-network-arkade",
|
|
3118
|
+
label: "BTC on Arkade",
|
|
3119
|
+
sublabel: "Arkade balance",
|
|
3120
|
+
amount: btcArkade,
|
|
3121
|
+
isPending: btcArkadePending,
|
|
3122
|
+
visible: balanceVisible,
|
|
3123
|
+
format,
|
|
3124
|
+
formatFiat: formatFiatValue
|
|
3125
|
+
}
|
|
3126
|
+
),
|
|
3127
|
+
rgbAssets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RgbAssetsBreakdown, { assets: rgbAssets, balanceVisible }),
|
|
3128
|
+
accounts.RGB?.connected && nodeInfo?.pubkey && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "mt-3 border-t border-white/[0.08] pt-4", children: [
|
|
3129
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "RLN Details" }),
|
|
3130
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "grid grid-cols-3 gap-2", children: [
|
|
3131
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3132
|
+
StatusChip,
|
|
3133
|
+
{
|
|
3134
|
+
label: "Node",
|
|
3135
|
+
value: `${nodeInfo.pubkey.slice(0, 8)}...${nodeInfo.pubkey.slice(-6)}`
|
|
3136
|
+
}
|
|
3137
|
+
),
|
|
3138
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StatusChip, { label: "Peers", value: String(nodeInfo.num_peers ?? 0) }),
|
|
3139
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StatusChip, { label: "Channels", value: String(nodeInfo.num_channels ?? 0) })
|
|
3140
|
+
] })
|
|
3141
|
+
] })
|
|
3142
|
+
]
|
|
3011
3143
|
}
|
|
3012
3144
|
),
|
|
3013
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.
|
|
3014
|
-
"
|
|
3145
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
3146
|
+
"div",
|
|
3015
3147
|
{
|
|
3016
|
-
|
|
3017
|
-
|
|
3018
|
-
|
|
3019
|
-
|
|
3020
|
-
|
|
3021
|
-
|
|
3022
|
-
|
|
3023
|
-
|
|
3024
|
-
|
|
3025
|
-
|
|
3148
|
+
className: `relative z-10 flex gap-2.5 border-t border-white/[0.08] ${compact ? "mt-2 pt-2" : "mt-3 pt-3"}`,
|
|
3149
|
+
children: [
|
|
3150
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3151
|
+
ActionTile,
|
|
3152
|
+
{
|
|
3153
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "call_received" }),
|
|
3154
|
+
label: "Deposit",
|
|
3155
|
+
onClick: () => onNavigate?.("deposit"),
|
|
3156
|
+
"data-testid": "dashboard-action-deposit"
|
|
3157
|
+
}
|
|
3158
|
+
),
|
|
3159
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3160
|
+
ActionTile,
|
|
3161
|
+
{
|
|
3162
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "swap_horiz" }),
|
|
3163
|
+
label: "Swap",
|
|
3164
|
+
onClick: () => onNavigate?.("swap"),
|
|
3165
|
+
"data-testid": "dashboard-action-swap"
|
|
3166
|
+
}
|
|
3167
|
+
),
|
|
3168
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3169
|
+
ActionTile,
|
|
3170
|
+
{
|
|
3171
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "arrow_outward" }),
|
|
3172
|
+
label: "Withdraw",
|
|
3173
|
+
onClick: () => onNavigate?.("withdraw"),
|
|
3174
|
+
"data-testid": "dashboard-action-withdraw"
|
|
3175
|
+
}
|
|
3176
|
+
)
|
|
3177
|
+
]
|
|
3026
3178
|
}
|
|
3027
3179
|
)
|
|
3028
|
-
]
|
|
3029
|
-
|
|
3030
|
-
|
|
3031
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "Bitcoin" }),
|
|
3032
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3033
|
-
NetworkRow,
|
|
3034
|
-
{
|
|
3035
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(OnchainIcon, { className: "text-icon-sm" }),
|
|
3036
|
-
iconColor: "text-network-spark",
|
|
3037
|
-
dotColor: "bg-network-spark",
|
|
3038
|
-
label: "BTC on-chain",
|
|
3039
|
-
sublabel: "Standard Bitcoin balance",
|
|
3040
|
-
amount: btcOnchain,
|
|
3041
|
-
isPending: btcOnchainPending,
|
|
3042
|
-
visible: balanceVisible,
|
|
3043
|
-
format,
|
|
3044
|
-
formatFiat: formatFiatValue
|
|
3045
|
-
}
|
|
3046
|
-
),
|
|
3047
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3048
|
-
NetworkRow,
|
|
3049
|
-
{
|
|
3050
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3051
|
-
ImageIcon,
|
|
3052
|
-
{
|
|
3053
|
-
src: "/icons/lightning/lightning.svg",
|
|
3054
|
-
alt: "Lightning",
|
|
3055
|
-
className: "size-3.5"
|
|
3056
|
-
}
|
|
3057
|
-
),
|
|
3058
|
-
iconColor: "text-network-lightning",
|
|
3059
|
-
dotColor: "bg-network-lightning",
|
|
3060
|
-
label: "BTC on RLN",
|
|
3061
|
-
sublabel: "RLN balance",
|
|
3062
|
-
amount: btcLightning,
|
|
3063
|
-
isPending: btcLightningPending,
|
|
3064
|
-
visible: balanceVisible,
|
|
3065
|
-
format,
|
|
3066
|
-
formatFiat: formatFiatValue
|
|
3067
|
-
}
|
|
3068
|
-
),
|
|
3069
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3070
|
-
NetworkRow,
|
|
3071
|
-
{
|
|
3072
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3073
|
-
ImageIcon,
|
|
3074
|
-
{
|
|
3075
|
-
src: "/icons/spark/Asterisk/Spark Asterisk White.svg",
|
|
3076
|
-
alt: "Spark",
|
|
3077
|
-
className: "size-3.5 opacity-90"
|
|
3078
|
-
}
|
|
3079
|
-
),
|
|
3080
|
-
iconColor: "",
|
|
3081
|
-
dotColor: "bg-info",
|
|
3082
|
-
label: "BTC on Spark",
|
|
3083
|
-
sublabel: "Spark balance",
|
|
3084
|
-
amount: btcSpark,
|
|
3085
|
-
isPending: btcSparkPending,
|
|
3086
|
-
visible: balanceVisible,
|
|
3087
|
-
format,
|
|
3088
|
-
formatFiat: formatFiatValue
|
|
3089
|
-
}
|
|
3090
|
-
),
|
|
3091
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3092
|
-
NetworkRow,
|
|
3093
|
-
{
|
|
3094
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3095
|
-
ImageIcon,
|
|
3096
|
-
{
|
|
3097
|
-
src: "/icons/arkade/arkade-icon.svg",
|
|
3098
|
-
alt: "Arkade",
|
|
3099
|
-
className: "size-3.5 rounded-sm"
|
|
3100
|
-
}
|
|
3101
|
-
),
|
|
3102
|
-
iconColor: "",
|
|
3103
|
-
dotColor: "bg-network-arkade",
|
|
3104
|
-
label: "BTC on Arkade",
|
|
3105
|
-
sublabel: "Arkade balance",
|
|
3106
|
-
amount: btcArkade,
|
|
3107
|
-
isPending: btcArkadePending,
|
|
3108
|
-
visible: balanceVisible,
|
|
3109
|
-
format,
|
|
3110
|
-
formatFiat: formatFiatValue
|
|
3111
|
-
}
|
|
3112
|
-
),
|
|
3113
|
-
rgbAssets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RgbAssetsBreakdown, { assets: rgbAssets, balanceVisible }),
|
|
3114
|
-
accounts.RGB?.connected && nodeInfo?.pubkey && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "mt-3 border-t border-white/[0.08] pt-4", children: [
|
|
3115
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "RLN Details" }),
|
|
3116
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "grid grid-cols-3 gap-2", children: [
|
|
3117
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3118
|
-
StatusChip,
|
|
3119
|
-
{
|
|
3120
|
-
label: "Node",
|
|
3121
|
-
value: `${nodeInfo.pubkey.slice(0, 8)}...${nodeInfo.pubkey.slice(-6)}`
|
|
3122
|
-
}
|
|
3123
|
-
),
|
|
3124
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StatusChip, { label: "Peers", value: String(nodeInfo.num_peers ?? 0) }),
|
|
3125
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(StatusChip, { label: "Channels", value: String(nodeInfo.num_channels ?? 0) })
|
|
3126
|
-
] })
|
|
3127
|
-
] })
|
|
3128
|
-
] }),
|
|
3129
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "relative z-10 mt-3 flex gap-2.5 border-t border-white/[0.08] pt-3", children: [
|
|
3130
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3131
|
-
ActionTile,
|
|
3132
|
-
{
|
|
3133
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "call_received" }),
|
|
3134
|
-
label: "Deposit",
|
|
3135
|
-
onClick: () => onNavigate?.("deposit"),
|
|
3136
|
-
"data-testid": "dashboard-action-deposit"
|
|
3137
|
-
}
|
|
3138
|
-
),
|
|
3139
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3140
|
-
ActionTile,
|
|
3141
|
-
{
|
|
3142
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "swap_horiz" }),
|
|
3143
|
-
label: "Swap",
|
|
3144
|
-
onClick: () => onNavigate?.("swap"),
|
|
3145
|
-
"data-testid": "dashboard-action-swap"
|
|
3146
|
-
}
|
|
3147
|
-
),
|
|
3148
|
-
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
3149
|
-
ActionTile,
|
|
3150
|
-
{
|
|
3151
|
-
icon: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "arrow_outward" }),
|
|
3152
|
-
label: "Withdraw",
|
|
3153
|
-
onClick: () => onNavigate?.("withdraw"),
|
|
3154
|
-
"data-testid": "dashboard-action-withdraw"
|
|
3155
|
-
}
|
|
3156
|
-
)
|
|
3157
|
-
] })
|
|
3158
|
-
] }) });
|
|
3180
|
+
]
|
|
3181
|
+
}
|
|
3182
|
+
) });
|
|
3159
3183
|
}
|
|
3160
3184
|
function RgbAssetsBreakdown({
|
|
3161
3185
|
assets,
|
|
@@ -4933,7 +4957,7 @@ function RecoveryPhraseCard({
|
|
|
4933
4957
|
var import_react13 = require("react");
|
|
4934
4958
|
var import_jsx_runtime55 = require("react/jsx-runtime");
|
|
4935
4959
|
var PROTOCOLS = [
|
|
4936
|
-
{ name: "Bitcoin
|
|
4960
|
+
{ name: "Bitcoin", network: "Bitcoin" },
|
|
4937
4961
|
{ name: "Lightning", network: "LN" },
|
|
4938
4962
|
{ name: "RGB", network: "RGB20" },
|
|
4939
4963
|
{ name: "Spark", network: "Spark" },
|
|
@@ -4947,7 +4971,7 @@ var BADGE_SIZE = 32;
|
|
|
4947
4971
|
var BADGE_HALF = BADGE_SIZE / 2;
|
|
4948
4972
|
var N = PROTOCOLS.length;
|
|
4949
4973
|
var PROTOCOL_COLORS = {
|
|
4950
|
-
|
|
4974
|
+
Bitcoin: "#F7931A",
|
|
4951
4975
|
LN: "#fbbf24",
|
|
4952
4976
|
RGB20: "#EF4444",
|
|
4953
4977
|
Spark: "#FFFFFF",
|
package/dist/web/index.d.cts
CHANGED
|
@@ -374,8 +374,18 @@ interface FilterDropdownProps {
|
|
|
374
374
|
onChange: (id: string) => void;
|
|
375
375
|
clusterMax?: number;
|
|
376
376
|
className?: string;
|
|
377
|
+
/**
|
|
378
|
+
* Tighten paddings and shrink the label so more cluster icons fit
|
|
379
|
+
* horizontally. Useful on narrow popups.
|
|
380
|
+
*/
|
|
381
|
+
compact?: boolean;
|
|
382
|
+
/**
|
|
383
|
+
* Hide the label text entirely (kept available via `aria-label`). Combine
|
|
384
|
+
* with `compact` for the densest variant.
|
|
385
|
+
*/
|
|
386
|
+
hideLabel?: boolean;
|
|
377
387
|
}
|
|
378
|
-
declare function FilterDropdown({ label, value, options, onChange, clusterMax, className, }: FilterDropdownProps): react_jsx_runtime.JSX.Element;
|
|
388
|
+
declare function FilterDropdown({ label, value, options, onChange, clusterMax, className, compact, hideLabel, }: FilterDropdownProps): react_jsx_runtime.JSX.Element;
|
|
379
389
|
|
|
380
390
|
interface SettingsTileProps {
|
|
381
391
|
icon: ReactNode;
|
|
@@ -575,8 +585,10 @@ interface BalanceBreakdownProps {
|
|
|
575
585
|
onRefresh?: () => void;
|
|
576
586
|
isRefreshing?: boolean;
|
|
577
587
|
onNavigate?: (view: 'deposit' | 'swap' | 'withdraw') => void;
|
|
588
|
+
/** Reduce vertical padding/margins so the card occupies less of the viewport. */
|
|
589
|
+
compact?: boolean;
|
|
578
590
|
}
|
|
579
|
-
declare function BalanceBreakdown({ btcOnchain, btcLightning, btcSpark, btcArkade, totalBTC, rgbAssets, accounts, nodeInfo, balanceVisible, format, formatFiatValue, unit, label, cycle, isLoading, isPartial, btcOnchainPending, btcLightningPending, btcSparkPending, btcArkadePending, onRefresh, isRefreshing, onNavigate, }: BalanceBreakdownProps): react_jsx_runtime.JSX.Element;
|
|
591
|
+
declare function BalanceBreakdown({ btcOnchain, btcLightning, btcSpark, btcArkade, totalBTC, rgbAssets, accounts, nodeInfo, balanceVisible, format, formatFiatValue, unit, label, cycle, isLoading, isPartial, btcOnchainPending, btcLightningPending, btcSparkPending, btcArkadePending, onRefresh, isRefreshing, onNavigate, compact, }: BalanceBreakdownProps): react_jsx_runtime.JSX.Element;
|
|
580
592
|
|
|
581
593
|
interface AssetSelectorOption {
|
|
582
594
|
ticker: string;
|
package/dist/web/index.d.ts
CHANGED
|
@@ -374,8 +374,18 @@ interface FilterDropdownProps {
|
|
|
374
374
|
onChange: (id: string) => void;
|
|
375
375
|
clusterMax?: number;
|
|
376
376
|
className?: string;
|
|
377
|
+
/**
|
|
378
|
+
* Tighten paddings and shrink the label so more cluster icons fit
|
|
379
|
+
* horizontally. Useful on narrow popups.
|
|
380
|
+
*/
|
|
381
|
+
compact?: boolean;
|
|
382
|
+
/**
|
|
383
|
+
* Hide the label text entirely (kept available via `aria-label`). Combine
|
|
384
|
+
* with `compact` for the densest variant.
|
|
385
|
+
*/
|
|
386
|
+
hideLabel?: boolean;
|
|
377
387
|
}
|
|
378
|
-
declare function FilterDropdown({ label, value, options, onChange, clusterMax, className, }: FilterDropdownProps): react_jsx_runtime.JSX.Element;
|
|
388
|
+
declare function FilterDropdown({ label, value, options, onChange, clusterMax, className, compact, hideLabel, }: FilterDropdownProps): react_jsx_runtime.JSX.Element;
|
|
379
389
|
|
|
380
390
|
interface SettingsTileProps {
|
|
381
391
|
icon: ReactNode;
|
|
@@ -575,8 +585,10 @@ interface BalanceBreakdownProps {
|
|
|
575
585
|
onRefresh?: () => void;
|
|
576
586
|
isRefreshing?: boolean;
|
|
577
587
|
onNavigate?: (view: 'deposit' | 'swap' | 'withdraw') => void;
|
|
588
|
+
/** Reduce vertical padding/margins so the card occupies less of the viewport. */
|
|
589
|
+
compact?: boolean;
|
|
578
590
|
}
|
|
579
|
-
declare function BalanceBreakdown({ btcOnchain, btcLightning, btcSpark, btcArkade, totalBTC, rgbAssets, accounts, nodeInfo, balanceVisible, format, formatFiatValue, unit, label, cycle, isLoading, isPartial, btcOnchainPending, btcLightningPending, btcSparkPending, btcArkadePending, onRefresh, isRefreshing, onNavigate, }: BalanceBreakdownProps): react_jsx_runtime.JSX.Element;
|
|
591
|
+
declare function BalanceBreakdown({ btcOnchain, btcLightning, btcSpark, btcArkade, totalBTC, rgbAssets, accounts, nodeInfo, balanceVisible, format, formatFiatValue, unit, label, cycle, isLoading, isPartial, btcOnchainPending, btcLightningPending, btcSparkPending, btcArkadePending, onRefresh, isRefreshing, onNavigate, compact, }: BalanceBreakdownProps): react_jsx_runtime.JSX.Element;
|
|
580
592
|
|
|
581
593
|
interface AssetSelectorOption {
|
|
582
594
|
ticker: string;
|
package/dist/web/index.js
CHANGED
|
@@ -2163,7 +2163,9 @@ function FilterDropdown({
|
|
|
2163
2163
|
options,
|
|
2164
2164
|
onChange,
|
|
2165
2165
|
clusterMax = 3,
|
|
2166
|
-
className
|
|
2166
|
+
className,
|
|
2167
|
+
compact = false,
|
|
2168
|
+
hideLabel = false
|
|
2167
2169
|
}) {
|
|
2168
2170
|
const [isOpen, setIsOpen] = useState8(false);
|
|
2169
2171
|
const selected = options.find((option) => option.id === value) ?? options[0];
|
|
@@ -2177,16 +2179,19 @@ function FilterDropdown({
|
|
|
2177
2179
|
{
|
|
2178
2180
|
type: "button",
|
|
2179
2181
|
onClick: () => setIsOpen(!isOpen),
|
|
2182
|
+
"aria-label": hideLabel ? label : void 0,
|
|
2180
2183
|
className: cn(
|
|
2181
|
-
"flex w-full items-center justify-between
|
|
2184
|
+
"flex w-full items-center justify-between rounded-2xl leading-none outline-none transition-all",
|
|
2185
|
+
compact ? "gap-1 px-2 py-1.5" : "gap-1.5 px-2.5 py-2",
|
|
2182
2186
|
isFiltered ? "bg-white/[0.13] shadow-inner" : "bg-white/[0.09] backdrop-blur-md hover:bg-white/[0.13]"
|
|
2183
2187
|
),
|
|
2184
2188
|
children: [
|
|
2185
|
-
/* @__PURE__ */ jsx29(
|
|
2189
|
+
!hideLabel && /* @__PURE__ */ jsx29(
|
|
2186
2190
|
"span",
|
|
2187
2191
|
{
|
|
2188
2192
|
className: cn(
|
|
2189
|
-
"shrink-0
|
|
2193
|
+
"shrink-0 font-bold uppercase tracking-wider",
|
|
2194
|
+
compact ? "text-xxs" : "text-mini",
|
|
2190
2195
|
isFiltered ? "text-muted-foreground" : "text-white/45"
|
|
2191
2196
|
),
|
|
2192
2197
|
children: label
|
|
@@ -2795,209 +2800,228 @@ function BalanceBreakdown({
|
|
|
2795
2800
|
btcArkadePending = false,
|
|
2796
2801
|
onRefresh,
|
|
2797
2802
|
isRefreshing = false,
|
|
2798
|
-
onNavigate
|
|
2803
|
+
onNavigate,
|
|
2804
|
+
compact = false
|
|
2799
2805
|
}) {
|
|
2800
2806
|
const [expanded, setExpanded] = useState10(false);
|
|
2801
2807
|
const fiatTotal = formatFiatValue(totalBTC);
|
|
2802
|
-
return /* @__PURE__ */ jsx34("div", { className:
|
|
2803
|
-
|
|
2804
|
-
|
|
2805
|
-
|
|
2806
|
-
|
|
2807
|
-
{
|
|
2808
|
-
|
|
2809
|
-
|
|
2810
|
-
|
|
2811
|
-
|
|
2812
|
-
|
|
2813
|
-
|
|
2814
|
-
|
|
2815
|
-
|
|
2816
|
-
|
|
2817
|
-
|
|
2818
|
-
|
|
2819
|
-
|
|
2820
|
-
|
|
2808
|
+
return /* @__PURE__ */ jsx34("div", { className: `flex flex-col ${compact ? "gap-2" : "gap-3"}`, children: /* @__PURE__ */ jsxs21(
|
|
2809
|
+
"div",
|
|
2810
|
+
{
|
|
2811
|
+
className: `relative overflow-hidden rounded-3xl bg-card ${compact ? "p-3.5" : "p-5"}`,
|
|
2812
|
+
children: [
|
|
2813
|
+
/* @__PURE__ */ jsx34("div", { className: "pointer-events-none absolute right-0 top-0 h-48 w-48 -translate-y-1/4 translate-x-1/4 rounded-full bg-white/[0.04] blur-[60px]" }),
|
|
2814
|
+
/* @__PURE__ */ jsxs21("div", { className: "relative z-10 flex items-start justify-between gap-3", children: [
|
|
2815
|
+
/* @__PURE__ */ jsxs21(
|
|
2816
|
+
"button",
|
|
2817
|
+
{
|
|
2818
|
+
onClick: cycle,
|
|
2819
|
+
className: "group flex min-w-0 flex-1 flex-col items-start text-left",
|
|
2820
|
+
title: `Tap to switch unit (current: ${label})`,
|
|
2821
|
+
children: [
|
|
2822
|
+
/* @__PURE__ */ jsx34("p", { className: "mb-1 text-xxs font-bold uppercase tracking-widest text-white/40", children: "Total Balance" }),
|
|
2823
|
+
isLoading ? /* @__PURE__ */ jsxs21("div", { className: "mt-1 space-y-2", children: [
|
|
2824
|
+
/* @__PURE__ */ jsx34("div", { className: "h-9 w-36 animate-pulse rounded-lg bg-white/10" }),
|
|
2825
|
+
/* @__PURE__ */ jsx34("div", { className: "h-3 w-20 animate-pulse rounded bg-white/5" })
|
|
2826
|
+
] }) : /* @__PURE__ */ jsxs21(Fragment5, { children: [
|
|
2827
|
+
/* @__PURE__ */ jsxs21("div", { className: "flex min-w-0 max-w-full flex-wrap items-baseline gap-x-2.5 gap-y-1", children: [
|
|
2828
|
+
/* @__PURE__ */ jsx34("span", { className: "text-display font-black leading-[1.1] tracking-tighter text-white drop-shadow-sm transition-all duration-300 group-active:scale-95 group-active:text-primary", children: balanceVisible ? numberOnly(format(totalBTC)) : "\u2022\u2022\u2022\u2022\u2022\u2022" }),
|
|
2829
|
+
unit !== "fiat" && /* @__PURE__ */ jsx34("span", { className: "inline-block rounded-md border border-white/10 bg-white/5 px-2 py-0.5 text-tiny font-bold uppercase tracking-widest text-white/45", children: label }),
|
|
2830
|
+
isPartial && /* @__PURE__ */ jsx34(
|
|
2831
|
+
"span",
|
|
2832
|
+
{
|
|
2833
|
+
className: "inline-flex size-4 items-center justify-center rounded-full border bg-white/[0.06]",
|
|
2834
|
+
title: "Loading remaining balances",
|
|
2835
|
+
children: /* @__PURE__ */ jsx34("span", { className: "size-2 animate-spin rounded-full border border-primary/30 border-t-primary" })
|
|
2836
|
+
}
|
|
2837
|
+
)
|
|
2838
|
+
] }),
|
|
2839
|
+
balanceVisible && unit !== "fiat" && fiatTotal && /* @__PURE__ */ jsx34("span", { className: "mt-1 font-mono text-xs font-medium text-white/45", children: fiatTotal }),
|
|
2840
|
+
balanceVisible && unit === "fiat" && totalBTC > 0 && /* @__PURE__ */ jsxs21("span", { className: "mt-1 font-mono text-xs font-medium text-white/45", children: [
|
|
2841
|
+
(totalBTC / 1e8).toFixed(8).replace(/\.?0+$/, ""),
|
|
2842
|
+
"\xA0BTC"
|
|
2843
|
+
] })
|
|
2844
|
+
] })
|
|
2845
|
+
]
|
|
2846
|
+
}
|
|
2847
|
+
),
|
|
2848
|
+
/* @__PURE__ */ jsxs21("div", { className: "mt-1 flex shrink-0 items-center gap-1.5", children: [
|
|
2849
|
+
onRefresh && /* @__PURE__ */ jsx34(
|
|
2850
|
+
"button",
|
|
2851
|
+
{
|
|
2852
|
+
onClick: onRefresh,
|
|
2853
|
+
disabled: isRefreshing,
|
|
2854
|
+
className: "flex size-7 items-center justify-center rounded-full bg-white/[0.08] transition-all hover:bg-white/[0.12] disabled:opacity-40",
|
|
2855
|
+
title: "Refresh balances",
|
|
2856
|
+
children: /* @__PURE__ */ jsx34(
|
|
2821
2857
|
"span",
|
|
2822
2858
|
{
|
|
2823
|
-
className:
|
|
2824
|
-
|
|
2825
|
-
children: /* @__PURE__ */ jsx34("span", { className: "size-2 animate-spin rounded-full border border-primary/30 border-t-primary" })
|
|
2859
|
+
className: `material-symbols-outlined text-icon-sm leading-none text-white/60${isRefreshing ? " animate-spin" : ""}`,
|
|
2860
|
+
children: "refresh"
|
|
2826
2861
|
}
|
|
2827
2862
|
)
|
|
2828
|
-
|
|
2829
|
-
|
|
2830
|
-
|
|
2831
|
-
|
|
2832
|
-
"\xA0BTC"
|
|
2833
|
-
] })
|
|
2834
|
-
] })
|
|
2835
|
-
]
|
|
2836
|
-
}
|
|
2837
|
-
),
|
|
2838
|
-
/* @__PURE__ */ jsxs21("div", { className: "mt-1 flex shrink-0 items-center gap-1.5", children: [
|
|
2839
|
-
onRefresh && /* @__PURE__ */ jsx34(
|
|
2840
|
-
"button",
|
|
2841
|
-
{
|
|
2842
|
-
onClick: onRefresh,
|
|
2843
|
-
disabled: isRefreshing,
|
|
2844
|
-
className: "flex size-7 items-center justify-center rounded-full bg-white/[0.08] transition-all hover:bg-white/[0.12] disabled:opacity-40",
|
|
2845
|
-
title: "Refresh balances",
|
|
2846
|
-
children: /* @__PURE__ */ jsx34(
|
|
2847
|
-
"span",
|
|
2863
|
+
}
|
|
2864
|
+
),
|
|
2865
|
+
/* @__PURE__ */ jsx34(
|
|
2866
|
+
"button",
|
|
2848
2867
|
{
|
|
2849
|
-
|
|
2850
|
-
|
|
2868
|
+
onClick: () => setExpanded(!expanded),
|
|
2869
|
+
className: "flex size-7 items-center justify-center rounded-full bg-white/[0.08] transition-all hover:bg-white/[0.12]",
|
|
2870
|
+
children: /* @__PURE__ */ jsx34(
|
|
2871
|
+
Icon2,
|
|
2872
|
+
{
|
|
2873
|
+
name: expanded ? "expand_less" : "expand_more",
|
|
2874
|
+
size: "sm",
|
|
2875
|
+
className: "text-white/60"
|
|
2876
|
+
}
|
|
2877
|
+
)
|
|
2851
2878
|
}
|
|
2852
2879
|
)
|
|
2880
|
+
] })
|
|
2881
|
+
] }),
|
|
2882
|
+
expanded && /* @__PURE__ */ jsxs21(
|
|
2883
|
+
"div",
|
|
2884
|
+
{
|
|
2885
|
+
className: `space-y-1 border-t border-white/[0.08] duration-300 animate-in fade-in slide-in-from-top-2 ${compact ? "mt-3 pt-3" : "mt-4 pt-4"}`,
|
|
2886
|
+
children: [
|
|
2887
|
+
/* @__PURE__ */ jsx34("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "Bitcoin" }),
|
|
2888
|
+
/* @__PURE__ */ jsx34(
|
|
2889
|
+
NetworkRow,
|
|
2890
|
+
{
|
|
2891
|
+
icon: /* @__PURE__ */ jsx34(OnchainIcon, { className: "text-icon-sm" }),
|
|
2892
|
+
iconColor: "text-network-spark",
|
|
2893
|
+
dotColor: "bg-network-spark",
|
|
2894
|
+
label: "BTC on-chain",
|
|
2895
|
+
sublabel: "Standard Bitcoin balance",
|
|
2896
|
+
amount: btcOnchain,
|
|
2897
|
+
isPending: btcOnchainPending,
|
|
2898
|
+
visible: balanceVisible,
|
|
2899
|
+
format,
|
|
2900
|
+
formatFiat: formatFiatValue
|
|
2901
|
+
}
|
|
2902
|
+
),
|
|
2903
|
+
/* @__PURE__ */ jsx34(
|
|
2904
|
+
NetworkRow,
|
|
2905
|
+
{
|
|
2906
|
+
icon: /* @__PURE__ */ jsx34(
|
|
2907
|
+
ImageIcon,
|
|
2908
|
+
{
|
|
2909
|
+
src: "/icons/lightning/lightning.svg",
|
|
2910
|
+
alt: "Lightning",
|
|
2911
|
+
className: "size-3.5"
|
|
2912
|
+
}
|
|
2913
|
+
),
|
|
2914
|
+
iconColor: "text-network-lightning",
|
|
2915
|
+
dotColor: "bg-network-lightning",
|
|
2916
|
+
label: "BTC on RLN",
|
|
2917
|
+
sublabel: "RLN balance",
|
|
2918
|
+
amount: btcLightning,
|
|
2919
|
+
isPending: btcLightningPending,
|
|
2920
|
+
visible: balanceVisible,
|
|
2921
|
+
format,
|
|
2922
|
+
formatFiat: formatFiatValue
|
|
2923
|
+
}
|
|
2924
|
+
),
|
|
2925
|
+
/* @__PURE__ */ jsx34(
|
|
2926
|
+
NetworkRow,
|
|
2927
|
+
{
|
|
2928
|
+
icon: /* @__PURE__ */ jsx34(
|
|
2929
|
+
ImageIcon,
|
|
2930
|
+
{
|
|
2931
|
+
src: "/icons/spark/Asterisk/Spark Asterisk White.svg",
|
|
2932
|
+
alt: "Spark",
|
|
2933
|
+
className: "size-3.5 opacity-90"
|
|
2934
|
+
}
|
|
2935
|
+
),
|
|
2936
|
+
iconColor: "",
|
|
2937
|
+
dotColor: "bg-info",
|
|
2938
|
+
label: "BTC on Spark",
|
|
2939
|
+
sublabel: "Spark balance",
|
|
2940
|
+
amount: btcSpark,
|
|
2941
|
+
isPending: btcSparkPending,
|
|
2942
|
+
visible: balanceVisible,
|
|
2943
|
+
format,
|
|
2944
|
+
formatFiat: formatFiatValue
|
|
2945
|
+
}
|
|
2946
|
+
),
|
|
2947
|
+
/* @__PURE__ */ jsx34(
|
|
2948
|
+
NetworkRow,
|
|
2949
|
+
{
|
|
2950
|
+
icon: /* @__PURE__ */ jsx34(
|
|
2951
|
+
ImageIcon,
|
|
2952
|
+
{
|
|
2953
|
+
src: "/icons/arkade/arkade-icon.svg",
|
|
2954
|
+
alt: "Arkade",
|
|
2955
|
+
className: "size-3.5 rounded-sm"
|
|
2956
|
+
}
|
|
2957
|
+
),
|
|
2958
|
+
iconColor: "",
|
|
2959
|
+
dotColor: "bg-network-arkade",
|
|
2960
|
+
label: "BTC on Arkade",
|
|
2961
|
+
sublabel: "Arkade balance",
|
|
2962
|
+
amount: btcArkade,
|
|
2963
|
+
isPending: btcArkadePending,
|
|
2964
|
+
visible: balanceVisible,
|
|
2965
|
+
format,
|
|
2966
|
+
formatFiat: formatFiatValue
|
|
2967
|
+
}
|
|
2968
|
+
),
|
|
2969
|
+
rgbAssets.length > 0 && /* @__PURE__ */ jsx34(RgbAssetsBreakdown, { assets: rgbAssets, balanceVisible }),
|
|
2970
|
+
accounts.RGB?.connected && nodeInfo?.pubkey && /* @__PURE__ */ jsxs21("div", { className: "mt-3 border-t border-white/[0.08] pt-4", children: [
|
|
2971
|
+
/* @__PURE__ */ jsx34("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "RLN Details" }),
|
|
2972
|
+
/* @__PURE__ */ jsxs21("div", { className: "grid grid-cols-3 gap-2", children: [
|
|
2973
|
+
/* @__PURE__ */ jsx34(
|
|
2974
|
+
StatusChip,
|
|
2975
|
+
{
|
|
2976
|
+
label: "Node",
|
|
2977
|
+
value: `${nodeInfo.pubkey.slice(0, 8)}...${nodeInfo.pubkey.slice(-6)}`
|
|
2978
|
+
}
|
|
2979
|
+
),
|
|
2980
|
+
/* @__PURE__ */ jsx34(StatusChip, { label: "Peers", value: String(nodeInfo.num_peers ?? 0) }),
|
|
2981
|
+
/* @__PURE__ */ jsx34(StatusChip, { label: "Channels", value: String(nodeInfo.num_channels ?? 0) })
|
|
2982
|
+
] })
|
|
2983
|
+
] })
|
|
2984
|
+
]
|
|
2853
2985
|
}
|
|
2854
2986
|
),
|
|
2855
|
-
/* @__PURE__ */
|
|
2856
|
-
"
|
|
2987
|
+
/* @__PURE__ */ jsxs21(
|
|
2988
|
+
"div",
|
|
2857
2989
|
{
|
|
2858
|
-
|
|
2859
|
-
|
|
2860
|
-
|
|
2861
|
-
|
|
2862
|
-
|
|
2863
|
-
|
|
2864
|
-
|
|
2865
|
-
|
|
2866
|
-
|
|
2867
|
-
|
|
2990
|
+
className: `relative z-10 flex gap-2.5 border-t border-white/[0.08] ${compact ? "mt-2 pt-2" : "mt-3 pt-3"}`,
|
|
2991
|
+
children: [
|
|
2992
|
+
/* @__PURE__ */ jsx34(
|
|
2993
|
+
ActionTile,
|
|
2994
|
+
{
|
|
2995
|
+
icon: /* @__PURE__ */ jsx34("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "call_received" }),
|
|
2996
|
+
label: "Deposit",
|
|
2997
|
+
onClick: () => onNavigate?.("deposit"),
|
|
2998
|
+
"data-testid": "dashboard-action-deposit"
|
|
2999
|
+
}
|
|
3000
|
+
),
|
|
3001
|
+
/* @__PURE__ */ jsx34(
|
|
3002
|
+
ActionTile,
|
|
3003
|
+
{
|
|
3004
|
+
icon: /* @__PURE__ */ jsx34("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "swap_horiz" }),
|
|
3005
|
+
label: "Swap",
|
|
3006
|
+
onClick: () => onNavigate?.("swap"),
|
|
3007
|
+
"data-testid": "dashboard-action-swap"
|
|
3008
|
+
}
|
|
3009
|
+
),
|
|
3010
|
+
/* @__PURE__ */ jsx34(
|
|
3011
|
+
ActionTile,
|
|
3012
|
+
{
|
|
3013
|
+
icon: /* @__PURE__ */ jsx34("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "arrow_outward" }),
|
|
3014
|
+
label: "Withdraw",
|
|
3015
|
+
onClick: () => onNavigate?.("withdraw"),
|
|
3016
|
+
"data-testid": "dashboard-action-withdraw"
|
|
3017
|
+
}
|
|
3018
|
+
)
|
|
3019
|
+
]
|
|
2868
3020
|
}
|
|
2869
3021
|
)
|
|
2870
|
-
]
|
|
2871
|
-
|
|
2872
|
-
|
|
2873
|
-
/* @__PURE__ */ jsx34("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "Bitcoin" }),
|
|
2874
|
-
/* @__PURE__ */ jsx34(
|
|
2875
|
-
NetworkRow,
|
|
2876
|
-
{
|
|
2877
|
-
icon: /* @__PURE__ */ jsx34(OnchainIcon, { className: "text-icon-sm" }),
|
|
2878
|
-
iconColor: "text-network-spark",
|
|
2879
|
-
dotColor: "bg-network-spark",
|
|
2880
|
-
label: "BTC on-chain",
|
|
2881
|
-
sublabel: "Standard Bitcoin balance",
|
|
2882
|
-
amount: btcOnchain,
|
|
2883
|
-
isPending: btcOnchainPending,
|
|
2884
|
-
visible: balanceVisible,
|
|
2885
|
-
format,
|
|
2886
|
-
formatFiat: formatFiatValue
|
|
2887
|
-
}
|
|
2888
|
-
),
|
|
2889
|
-
/* @__PURE__ */ jsx34(
|
|
2890
|
-
NetworkRow,
|
|
2891
|
-
{
|
|
2892
|
-
icon: /* @__PURE__ */ jsx34(
|
|
2893
|
-
ImageIcon,
|
|
2894
|
-
{
|
|
2895
|
-
src: "/icons/lightning/lightning.svg",
|
|
2896
|
-
alt: "Lightning",
|
|
2897
|
-
className: "size-3.5"
|
|
2898
|
-
}
|
|
2899
|
-
),
|
|
2900
|
-
iconColor: "text-network-lightning",
|
|
2901
|
-
dotColor: "bg-network-lightning",
|
|
2902
|
-
label: "BTC on RLN",
|
|
2903
|
-
sublabel: "RLN balance",
|
|
2904
|
-
amount: btcLightning,
|
|
2905
|
-
isPending: btcLightningPending,
|
|
2906
|
-
visible: balanceVisible,
|
|
2907
|
-
format,
|
|
2908
|
-
formatFiat: formatFiatValue
|
|
2909
|
-
}
|
|
2910
|
-
),
|
|
2911
|
-
/* @__PURE__ */ jsx34(
|
|
2912
|
-
NetworkRow,
|
|
2913
|
-
{
|
|
2914
|
-
icon: /* @__PURE__ */ jsx34(
|
|
2915
|
-
ImageIcon,
|
|
2916
|
-
{
|
|
2917
|
-
src: "/icons/spark/Asterisk/Spark Asterisk White.svg",
|
|
2918
|
-
alt: "Spark",
|
|
2919
|
-
className: "size-3.5 opacity-90"
|
|
2920
|
-
}
|
|
2921
|
-
),
|
|
2922
|
-
iconColor: "",
|
|
2923
|
-
dotColor: "bg-info",
|
|
2924
|
-
label: "BTC on Spark",
|
|
2925
|
-
sublabel: "Spark balance",
|
|
2926
|
-
amount: btcSpark,
|
|
2927
|
-
isPending: btcSparkPending,
|
|
2928
|
-
visible: balanceVisible,
|
|
2929
|
-
format,
|
|
2930
|
-
formatFiat: formatFiatValue
|
|
2931
|
-
}
|
|
2932
|
-
),
|
|
2933
|
-
/* @__PURE__ */ jsx34(
|
|
2934
|
-
NetworkRow,
|
|
2935
|
-
{
|
|
2936
|
-
icon: /* @__PURE__ */ jsx34(
|
|
2937
|
-
ImageIcon,
|
|
2938
|
-
{
|
|
2939
|
-
src: "/icons/arkade/arkade-icon.svg",
|
|
2940
|
-
alt: "Arkade",
|
|
2941
|
-
className: "size-3.5 rounded-sm"
|
|
2942
|
-
}
|
|
2943
|
-
),
|
|
2944
|
-
iconColor: "",
|
|
2945
|
-
dotColor: "bg-network-arkade",
|
|
2946
|
-
label: "BTC on Arkade",
|
|
2947
|
-
sublabel: "Arkade balance",
|
|
2948
|
-
amount: btcArkade,
|
|
2949
|
-
isPending: btcArkadePending,
|
|
2950
|
-
visible: balanceVisible,
|
|
2951
|
-
format,
|
|
2952
|
-
formatFiat: formatFiatValue
|
|
2953
|
-
}
|
|
2954
|
-
),
|
|
2955
|
-
rgbAssets.length > 0 && /* @__PURE__ */ jsx34(RgbAssetsBreakdown, { assets: rgbAssets, balanceVisible }),
|
|
2956
|
-
accounts.RGB?.connected && nodeInfo?.pubkey && /* @__PURE__ */ jsxs21("div", { className: "mt-3 border-t border-white/[0.08] pt-4", children: [
|
|
2957
|
-
/* @__PURE__ */ jsx34("p", { className: "mb-3 text-xxs font-bold uppercase tracking-widest text-white/30", children: "RLN Details" }),
|
|
2958
|
-
/* @__PURE__ */ jsxs21("div", { className: "grid grid-cols-3 gap-2", children: [
|
|
2959
|
-
/* @__PURE__ */ jsx34(
|
|
2960
|
-
StatusChip,
|
|
2961
|
-
{
|
|
2962
|
-
label: "Node",
|
|
2963
|
-
value: `${nodeInfo.pubkey.slice(0, 8)}...${nodeInfo.pubkey.slice(-6)}`
|
|
2964
|
-
}
|
|
2965
|
-
),
|
|
2966
|
-
/* @__PURE__ */ jsx34(StatusChip, { label: "Peers", value: String(nodeInfo.num_peers ?? 0) }),
|
|
2967
|
-
/* @__PURE__ */ jsx34(StatusChip, { label: "Channels", value: String(nodeInfo.num_channels ?? 0) })
|
|
2968
|
-
] })
|
|
2969
|
-
] })
|
|
2970
|
-
] }),
|
|
2971
|
-
/* @__PURE__ */ jsxs21("div", { className: "relative z-10 mt-3 flex gap-2.5 border-t border-white/[0.08] pt-3", children: [
|
|
2972
|
-
/* @__PURE__ */ jsx34(
|
|
2973
|
-
ActionTile,
|
|
2974
|
-
{
|
|
2975
|
-
icon: /* @__PURE__ */ jsx34("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "call_received" }),
|
|
2976
|
-
label: "Deposit",
|
|
2977
|
-
onClick: () => onNavigate?.("deposit"),
|
|
2978
|
-
"data-testid": "dashboard-action-deposit"
|
|
2979
|
-
}
|
|
2980
|
-
),
|
|
2981
|
-
/* @__PURE__ */ jsx34(
|
|
2982
|
-
ActionTile,
|
|
2983
|
-
{
|
|
2984
|
-
icon: /* @__PURE__ */ jsx34("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "swap_horiz" }),
|
|
2985
|
-
label: "Swap",
|
|
2986
|
-
onClick: () => onNavigate?.("swap"),
|
|
2987
|
-
"data-testid": "dashboard-action-swap"
|
|
2988
|
-
}
|
|
2989
|
-
),
|
|
2990
|
-
/* @__PURE__ */ jsx34(
|
|
2991
|
-
ActionTile,
|
|
2992
|
-
{
|
|
2993
|
-
icon: /* @__PURE__ */ jsx34("span", { className: "material-symbols-outlined text-icon-lg leading-none", children: "arrow_outward" }),
|
|
2994
|
-
label: "Withdraw",
|
|
2995
|
-
onClick: () => onNavigate?.("withdraw"),
|
|
2996
|
-
"data-testid": "dashboard-action-withdraw"
|
|
2997
|
-
}
|
|
2998
|
-
)
|
|
2999
|
-
] })
|
|
3000
|
-
] }) });
|
|
3022
|
+
]
|
|
3023
|
+
}
|
|
3024
|
+
) });
|
|
3001
3025
|
}
|
|
3002
3026
|
function RgbAssetsBreakdown({
|
|
3003
3027
|
assets,
|
|
@@ -4775,7 +4799,7 @@ function RecoveryPhraseCard({
|
|
|
4775
4799
|
import { useRef as useRef4, useEffect as useEffect7, useState as useState12 } from "react";
|
|
4776
4800
|
import { Fragment as Fragment12, jsx as jsx55, jsxs as jsxs41 } from "react/jsx-runtime";
|
|
4777
4801
|
var PROTOCOLS = [
|
|
4778
|
-
{ name: "Bitcoin
|
|
4802
|
+
{ name: "Bitcoin", network: "Bitcoin" },
|
|
4779
4803
|
{ name: "Lightning", network: "LN" },
|
|
4780
4804
|
{ name: "RGB", network: "RGB20" },
|
|
4781
4805
|
{ name: "Spark", network: "Spark" },
|
|
@@ -4789,7 +4813,7 @@ var BADGE_SIZE = 32;
|
|
|
4789
4813
|
var BADGE_HALF = BADGE_SIZE / 2;
|
|
4790
4814
|
var N = PROTOCOLS.length;
|
|
4791
4815
|
var PROTOCOL_COLORS = {
|
|
4792
|
-
|
|
4816
|
+
Bitcoin: "#F7931A",
|
|
4793
4817
|
LN: "#fbbf24",
|
|
4794
4818
|
RGB20: "#EF4444",
|
|
4795
4819
|
Spark: "#FFFFFF",
|
package/package.json
CHANGED