@bze/bze-ui-kit 0.4.1 → 0.4.2
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 +18 -1
- package/dist/index.d.ts +18 -1
- package/dist/index.js +292 -195
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +142 -46
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -310,6 +310,7 @@ __export(index_exports, {
|
|
|
310
310
|
useSettings: () => useSettings,
|
|
311
311
|
useSigningClient: () => useSigningClient,
|
|
312
312
|
useToast: () => useToast,
|
|
313
|
+
useValidatorLogos: () => useValidatorLogos,
|
|
313
314
|
validateBZEBech32Address: () => validateBZEBech32Address,
|
|
314
315
|
validateBech32Address: () => validateBech32Address,
|
|
315
316
|
validateEndpoints: () => validateEndpoints,
|
|
@@ -4184,9 +4185,104 @@ var useTx = (chainName, isCosmos, isIBC) => {
|
|
|
4184
4185
|
};
|
|
4185
4186
|
};
|
|
4186
4187
|
|
|
4188
|
+
// src/hooks/useValidatorLogos.ts
|
|
4189
|
+
var import_react17 = require("react");
|
|
4190
|
+
var KEYBASE_API_URL = "https://keybase.io/_/api/1.0/user/lookup.json";
|
|
4191
|
+
var LOGOS_STORAGE_KEY = "validator_logos";
|
|
4192
|
+
var LOGOS_TTL = 24 * 60 * 60 * 1e3;
|
|
4193
|
+
var useValidatorLogos = (validators) => {
|
|
4194
|
+
const [logos, setLogos] = (0, import_react17.useState)({});
|
|
4195
|
+
const [isLoading, setIsLoading] = (0, import_react17.useState)(false);
|
|
4196
|
+
const fetchedRef = (0, import_react17.useRef)(false);
|
|
4197
|
+
const validatorCountRef = (0, import_react17.useRef)(0);
|
|
4198
|
+
const fetchLogos = (0, import_react17.useCallback)(async (identities) => {
|
|
4199
|
+
if (identities.length === 0) return {};
|
|
4200
|
+
let cached = null;
|
|
4201
|
+
try {
|
|
4202
|
+
const raw = typeof window !== "undefined" ? localStorage.getItem(LOGOS_STORAGE_KEY) : null;
|
|
4203
|
+
if (raw) {
|
|
4204
|
+
const parsed = JSON.parse(raw);
|
|
4205
|
+
if (parsed && typeof parsed === "object" && parsed.data && (!parsed.expiry || Date.now() < parsed.expiry)) {
|
|
4206
|
+
cached = parsed.data;
|
|
4207
|
+
}
|
|
4208
|
+
}
|
|
4209
|
+
} catch (e) {
|
|
4210
|
+
}
|
|
4211
|
+
if (cached) {
|
|
4212
|
+
const allCached = identities.every(
|
|
4213
|
+
(v) => v.operatorAddress in cached
|
|
4214
|
+
);
|
|
4215
|
+
if (allCached) {
|
|
4216
|
+
return cached;
|
|
4217
|
+
}
|
|
4218
|
+
}
|
|
4219
|
+
const result = cached != null ? cached : {};
|
|
4220
|
+
const toFetch = identities.filter((v) => !(v.operatorAddress in result));
|
|
4221
|
+
if (toFetch.length === 0) return result;
|
|
4222
|
+
const chunkSize = 20;
|
|
4223
|
+
for (let i = 0; i < toFetch.length; i += chunkSize) {
|
|
4224
|
+
const chunk = toFetch.slice(i, i + chunkSize);
|
|
4225
|
+
const chunkResults = await Promise.all(
|
|
4226
|
+
chunk.map(async ({ operatorAddress, identity }) => {
|
|
4227
|
+
var _a2, _b2, _c, _d, _e;
|
|
4228
|
+
if (!identity) {
|
|
4229
|
+
return { operatorAddress, url: "" };
|
|
4230
|
+
}
|
|
4231
|
+
try {
|
|
4232
|
+
const resp = await fetch(
|
|
4233
|
+
`${KEYBASE_API_URL}?key_suffix=${encodeURIComponent(identity)}&fields=pictures`
|
|
4234
|
+
);
|
|
4235
|
+
const data = await resp.json();
|
|
4236
|
+
const url = (_e = (_d = (_c = (_b2 = (_a2 = data == null ? void 0 : data.them) == null ? void 0 : _a2[0]) == null ? void 0 : _b2.pictures) == null ? void 0 : _c.primary) == null ? void 0 : _d.url) != null ? _e : "";
|
|
4237
|
+
return { operatorAddress, url };
|
|
4238
|
+
} catch (e) {
|
|
4239
|
+
return { operatorAddress, url: "" };
|
|
4240
|
+
}
|
|
4241
|
+
})
|
|
4242
|
+
);
|
|
4243
|
+
for (const { operatorAddress, url } of chunkResults) {
|
|
4244
|
+
result[operatorAddress] = url;
|
|
4245
|
+
}
|
|
4246
|
+
if (i + chunkSize < toFetch.length) {
|
|
4247
|
+
await new Promise((resolve) => setTimeout(resolve, 500));
|
|
4248
|
+
}
|
|
4249
|
+
}
|
|
4250
|
+
try {
|
|
4251
|
+
if (typeof window !== "undefined") {
|
|
4252
|
+
localStorage.setItem(LOGOS_STORAGE_KEY, JSON.stringify({
|
|
4253
|
+
data: result,
|
|
4254
|
+
expiry: Date.now() + LOGOS_TTL
|
|
4255
|
+
}));
|
|
4256
|
+
}
|
|
4257
|
+
} catch (e) {
|
|
4258
|
+
}
|
|
4259
|
+
return result;
|
|
4260
|
+
}, []);
|
|
4261
|
+
(0, import_react17.useEffect)(() => {
|
|
4262
|
+
if (!validators || validators.length === 0) return;
|
|
4263
|
+
if (fetchedRef.current && validatorCountRef.current === validators.length) return;
|
|
4264
|
+
const identities = validators.map((v) => {
|
|
4265
|
+
var _a2, _b2;
|
|
4266
|
+
return {
|
|
4267
|
+
operatorAddress: v.operator_address,
|
|
4268
|
+
identity: (_b2 = (_a2 = v.description) == null ? void 0 : _a2.identity) != null ? _b2 : ""
|
|
4269
|
+
};
|
|
4270
|
+
});
|
|
4271
|
+
setIsLoading(true);
|
|
4272
|
+
fetchedRef.current = true;
|
|
4273
|
+
validatorCountRef.current = validators.length;
|
|
4274
|
+
fetchLogos(identities).then((result) => {
|
|
4275
|
+
setLogos(result);
|
|
4276
|
+
}).catch(console.error).finally(() => {
|
|
4277
|
+
setIsLoading(false);
|
|
4278
|
+
});
|
|
4279
|
+
}, [validators, fetchLogos]);
|
|
4280
|
+
return { logos, isLoading };
|
|
4281
|
+
};
|
|
4282
|
+
|
|
4187
4283
|
// src/components/highlight.tsx
|
|
4188
|
-
var
|
|
4189
|
-
var
|
|
4284
|
+
var import_react18 = require("@chakra-ui/react");
|
|
4285
|
+
var import_react19 = require("react");
|
|
4190
4286
|
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
4191
4287
|
var HighlightText = (_a2) => {
|
|
4192
4288
|
var _b2 = _a2, {
|
|
@@ -4202,14 +4298,14 @@ var HighlightText = (_a2) => {
|
|
|
4202
4298
|
"highlightIntensity",
|
|
4203
4299
|
"children"
|
|
4204
4300
|
]);
|
|
4205
|
-
const [isHighlighted, setIsHighlighted] = (0,
|
|
4206
|
-
const isMountedRef = (0,
|
|
4207
|
-
const timeoutRef = (0,
|
|
4301
|
+
const [isHighlighted, setIsHighlighted] = (0, import_react19.useState)(false);
|
|
4302
|
+
const isMountedRef = (0, import_react19.useRef)(false);
|
|
4303
|
+
const timeoutRef = (0, import_react19.useRef)(void 0);
|
|
4208
4304
|
const childrenString = String(children);
|
|
4209
|
-
const previousValueRef = (0,
|
|
4305
|
+
const previousValueRef = (0, import_react19.useRef)(childrenString);
|
|
4210
4306
|
const highlightOpacity = highlightIntensity === "subtle" ? "15" : "50";
|
|
4211
4307
|
const boxShadowStrength = highlightIntensity === "subtle" ? "10" : "25";
|
|
4212
|
-
(0,
|
|
4308
|
+
(0, import_react19.useEffect)(() => {
|
|
4213
4309
|
if (!isMountedRef.current) {
|
|
4214
4310
|
isMountedRef.current = true;
|
|
4215
4311
|
if (highlightOnMount) {
|
|
@@ -4238,7 +4334,7 @@ var HighlightText = (_a2) => {
|
|
|
4238
4334
|
};
|
|
4239
4335
|
}, [childrenString, duration, highlightOnMount]);
|
|
4240
4336
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
4241
|
-
|
|
4337
|
+
import_react18.Text,
|
|
4242
4338
|
__spreadProps(__spreadValues({}, textProps), {
|
|
4243
4339
|
transition: `all ${duration}ms ease-out`,
|
|
4244
4340
|
bg: isHighlighted ? `${highlightColor}/${highlightOpacity}` : "transparent",
|
|
@@ -4253,12 +4349,12 @@ var HighlightText = (_a2) => {
|
|
|
4253
4349
|
};
|
|
4254
4350
|
|
|
4255
4351
|
// src/components/sidebar/sidebar.tsx
|
|
4256
|
-
var
|
|
4352
|
+
var import_react20 = require("@chakra-ui/react");
|
|
4257
4353
|
var import_lu2 = require("react-icons/lu");
|
|
4258
|
-
var
|
|
4354
|
+
var import_react21 = require("react");
|
|
4259
4355
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
4260
4356
|
var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
4261
|
-
const [isOpen, setIsOpen] = (0,
|
|
4357
|
+
const [isOpen, setIsOpen] = (0, import_react21.useState)(false);
|
|
4262
4358
|
const handleTriggerClick = () => {
|
|
4263
4359
|
setIsOpen(true);
|
|
4264
4360
|
};
|
|
@@ -4267,7 +4363,7 @@ var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
|
4267
4363
|
};
|
|
4268
4364
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
|
|
4269
4365
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { onClick: handleTriggerClick, style: { cursor: "pointer" }, children: trigger }),
|
|
4270
|
-
isOpen && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
4366
|
+
isOpen && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_react20.Portal, { children: [
|
|
4271
4367
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
4272
4368
|
"div",
|
|
4273
4369
|
{
|
|
@@ -4335,13 +4431,13 @@ var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
|
4335
4431
|
}
|
|
4336
4432
|
),
|
|
4337
4433
|
/* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
4338
|
-
|
|
4434
|
+
import_react20.IconButton,
|
|
4339
4435
|
{
|
|
4340
4436
|
"aria-label": "Close sidebar",
|
|
4341
4437
|
variant: "ghost",
|
|
4342
4438
|
size: "sm",
|
|
4343
4439
|
onClick: handleClose,
|
|
4344
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
4440
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_react20.Icon, { size: "md", children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lu2.LuX, {}) })
|
|
4345
4441
|
}
|
|
4346
4442
|
)
|
|
4347
4443
|
]
|
|
@@ -4368,10 +4464,10 @@ var Sidebar = ({ children, trigger, ariaLabel }) => {
|
|
|
4368
4464
|
};
|
|
4369
4465
|
|
|
4370
4466
|
// src/components/sidebar/settings-sidebar.tsx
|
|
4371
|
-
var import_react21 = require("@chakra-ui/react");
|
|
4372
4467
|
var import_react22 = require("@chakra-ui/react");
|
|
4468
|
+
var import_react23 = require("@chakra-ui/react");
|
|
4373
4469
|
var import_next_themes = require("next-themes");
|
|
4374
|
-
var
|
|
4470
|
+
var import_react24 = require("react");
|
|
4375
4471
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
4376
4472
|
var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
4377
4473
|
const { setTheme, resolvedTheme } = (0, import_next_themes.useTheme)();
|
|
@@ -4379,19 +4475,19 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4379
4475
|
const { settings, isLoaded, updateEndpoints, updatePreferredFeeDenom, defaultSettings } = useSettings();
|
|
4380
4476
|
const { connectionType } = useConnectionType();
|
|
4381
4477
|
const { feeTokens, isLoading: feeTokensLoading } = useFeeTokens();
|
|
4382
|
-
const [restEndpoint, setRestEndpoint] = (0,
|
|
4383
|
-
const [rpcEndpoint, setRpcEndpoint] = (0,
|
|
4384
|
-
const [isValidating, setIsValidating] = (0,
|
|
4385
|
-
const [validationResults, setValidationResults] = (0,
|
|
4386
|
-
const [preferredFeeDenom, setPreferredFeeDenom] = (0,
|
|
4387
|
-
(0,
|
|
4478
|
+
const [restEndpoint, setRestEndpoint] = (0, import_react24.useState)("");
|
|
4479
|
+
const [rpcEndpoint, setRpcEndpoint] = (0, import_react24.useState)("");
|
|
4480
|
+
const [isValidating, setIsValidating] = (0, import_react24.useState)(false);
|
|
4481
|
+
const [validationResults, setValidationResults] = (0, import_react24.useState)({});
|
|
4482
|
+
const [preferredFeeDenom, setPreferredFeeDenom] = (0, import_react24.useState)(void 0);
|
|
4483
|
+
(0, import_react24.useEffect)(() => {
|
|
4388
4484
|
if (isLoaded) {
|
|
4389
4485
|
setRestEndpoint(settings.endpoints.restEndpoint);
|
|
4390
4486
|
setRpcEndpoint(settings.endpoints.rpcEndpoint);
|
|
4391
4487
|
setPreferredFeeDenom(settings.preferredFeeDenom || getChainNativeAssetDenom());
|
|
4392
4488
|
}
|
|
4393
4489
|
}, [isLoaded, settings]);
|
|
4394
|
-
const handleValidateEndpoints = (0,
|
|
4490
|
+
const handleValidateEndpoints = (0, import_react24.useCallback)(async (rest, rpc) => {
|
|
4395
4491
|
setIsValidating(true);
|
|
4396
4492
|
setValidationResults({});
|
|
4397
4493
|
try {
|
|
@@ -4411,7 +4507,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4411
4507
|
setTimeout(() => setValidationResults({}), 1e4);
|
|
4412
4508
|
}
|
|
4413
4509
|
}, []);
|
|
4414
|
-
const handleSaveSettings = (0,
|
|
4510
|
+
const handleSaveSettings = (0, import_react24.useCallback)(async (rest, rpc, feeDenom) => {
|
|
4415
4511
|
setValidationResults({});
|
|
4416
4512
|
const results = await validateEndpoints(rest, rpc);
|
|
4417
4513
|
if (!results.isValid) {
|
|
@@ -4431,13 +4527,13 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4431
4527
|
toast.success("Success!", "Settings have been saved.");
|
|
4432
4528
|
}
|
|
4433
4529
|
}, []);
|
|
4434
|
-
const handleResetToDefaults = (0,
|
|
4530
|
+
const handleResetToDefaults = (0, import_react24.useCallback)(() => {
|
|
4435
4531
|
setRestEndpoint(defaultSettings.endpoints.restEndpoint);
|
|
4436
4532
|
setRpcEndpoint(defaultSettings.endpoints.rpcEndpoint);
|
|
4437
4533
|
setPreferredFeeDenom(defaultSettings.preferredFeeDenom);
|
|
4438
4534
|
setValidationResults({});
|
|
4439
4535
|
}, []);
|
|
4440
|
-
const connectionStatusText = (0,
|
|
4536
|
+
const connectionStatusText = (0, import_react24.useMemo)(() => {
|
|
4441
4537
|
switch (connectionType) {
|
|
4442
4538
|
case CONNECTION_TYPE_NONE:
|
|
4443
4539
|
return "Failed";
|
|
@@ -4447,7 +4543,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4447
4543
|
return "Connected";
|
|
4448
4544
|
}
|
|
4449
4545
|
}, [connectionType]);
|
|
4450
|
-
const connectionStatusBadgeColor = (0,
|
|
4546
|
+
const connectionStatusBadgeColor = (0, import_react24.useMemo)(() => {
|
|
4451
4547
|
switch (connectionType) {
|
|
4452
4548
|
case CONNECTION_TYPE_NONE:
|
|
4453
4549
|
return "red";
|
|
@@ -4457,24 +4553,24 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4457
4553
|
return "green";
|
|
4458
4554
|
}
|
|
4459
4555
|
}, [connectionType]);
|
|
4460
|
-
const feeTokensCollection = (0,
|
|
4556
|
+
const feeTokensCollection = (0, import_react24.useMemo)(() => (0, import_react22.createListCollection)({
|
|
4461
4557
|
items: feeTokens.map((token) => ({
|
|
4462
4558
|
label: token.ticker || token.name,
|
|
4463
4559
|
value: token.denom,
|
|
4464
4560
|
name: token.ticker || token.name
|
|
4465
4561
|
}))
|
|
4466
4562
|
}), [feeTokens]);
|
|
4467
|
-
const handleFeeTokenChange = (0,
|
|
4563
|
+
const handleFeeTokenChange = (0, import_react24.useCallback)((denom) => {
|
|
4468
4564
|
setPreferredFeeDenom(denom || void 0);
|
|
4469
4565
|
}, []);
|
|
4470
4566
|
const hasUnsavedChanges = restEndpoint !== settings.endpoints.restEndpoint || rpcEndpoint !== settings.endpoints.rpcEndpoint || preferredFeeDenom !== settings.preferredFeeDenom;
|
|
4471
|
-
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4472
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4473
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4474
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4475
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4567
|
+
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.VStack, { gap: "6", align: "stretch", children: [
|
|
4568
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.Box, { children: [
|
|
4569
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Appearance" }),
|
|
4570
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.VStack, { gap: "3", align: "stretch", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.HStack, { justify: "space-between", children: [
|
|
4571
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", children: "Dark Mode" }),
|
|
4476
4572
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4477
|
-
|
|
4573
|
+
import_react22.Switch.Root,
|
|
4478
4574
|
{
|
|
4479
4575
|
checked: resolvedTheme === "dark",
|
|
4480
4576
|
onCheckedChange: (details) => {
|
|
@@ -4482,19 +4578,19 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4482
4578
|
setTheme(newTheme);
|
|
4483
4579
|
},
|
|
4484
4580
|
children: [
|
|
4485
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4486
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4581
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Switch.HiddenInput, {}),
|
|
4582
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Switch.Control, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Switch.Thumb, {}) })
|
|
4487
4583
|
]
|
|
4488
4584
|
}
|
|
4489
4585
|
)
|
|
4490
4586
|
] }) })
|
|
4491
4587
|
] }),
|
|
4492
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4493
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4494
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4495
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4588
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Separator, {}),
|
|
4589
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.Box, { children: [
|
|
4590
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Fee Token Preference" }),
|
|
4591
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.VStack, { gap: "3", align: "stretch", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.Box, { children: [
|
|
4496
4592
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4497
|
-
|
|
4593
|
+
import_react23.Select.Root,
|
|
4498
4594
|
{
|
|
4499
4595
|
collection: feeTokensCollection,
|
|
4500
4596
|
size: "sm",
|
|
@@ -4502,35 +4598,35 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4502
4598
|
onValueChange: (details) => handleFeeTokenChange(details.value[0] || ""),
|
|
4503
4599
|
disabled: feeTokensLoading,
|
|
4504
4600
|
children: [
|
|
4505
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4506
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4507
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4508
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4509
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4601
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.Label, { children: "Preferred Fee Token" }),
|
|
4602
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.HiddenSelect, {}),
|
|
4603
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react23.Select.Control, { children: [
|
|
4604
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.ValueText, { placeholder: "Native Token (default)" }) }),
|
|
4605
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.IndicatorGroup, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.Indicator, {}) })
|
|
4510
4606
|
] }),
|
|
4511
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4512
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4513
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4607
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.Content, { children: feeTokensCollection.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react23.Select.Item, { item, children: [
|
|
4608
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { children: item.label }),
|
|
4609
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react23.Select.ItemIndicator, {})
|
|
4514
4610
|
] }, item.value)) }) }) })
|
|
4515
4611
|
]
|
|
4516
4612
|
}
|
|
4517
4613
|
),
|
|
4518
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4614
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "xs", color: "fg.muted", mt: "2", children: "Select your preferred token for paying transaction fees. Only tokens with liquidity pools paired with the native token are available." })
|
|
4519
4615
|
] }) })
|
|
4520
4616
|
] }),
|
|
4521
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4522
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4523
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4524
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4525
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4526
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4527
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4617
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Separator, {}),
|
|
4618
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.Box, { children: [
|
|
4619
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "BeeZee Endpoints" }),
|
|
4620
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.VStack, { gap: "4", align: "stretch", children: [
|
|
4621
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.HStack, { gap: "2", align: "center", justify: "space-between", children: [
|
|
4622
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", mb: "1", children: "Status: " }),
|
|
4623
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Badge, { colorPalette: connectionStatusBadgeColor, children: connectionStatusText })
|
|
4528
4624
|
] }) }),
|
|
4529
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4530
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4531
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4625
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.Box, { children: [
|
|
4626
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", mb: "1", children: "REST Endpoint" }),
|
|
4627
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "xs", color: "fg.muted", mb: "2", children: "Note: Endpoint must have CORS enabled to work in browser" }),
|
|
4532
4628
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4533
|
-
|
|
4629
|
+
import_react22.Input,
|
|
4534
4630
|
{
|
|
4535
4631
|
size: "sm",
|
|
4536
4632
|
placeholder: "https://rest.getbze.com",
|
|
@@ -4539,7 +4635,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4539
4635
|
}
|
|
4540
4636
|
),
|
|
4541
4637
|
validationResults.rest && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4542
|
-
|
|
4638
|
+
import_react22.Box,
|
|
4543
4639
|
{
|
|
4544
4640
|
mt: "2",
|
|
4545
4641
|
p: "3",
|
|
@@ -4549,15 +4645,15 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4549
4645
|
borderWidth: "1px",
|
|
4550
4646
|
borderColor: validationResults.rest.isValid ? "green.500/30" : "red.500/30",
|
|
4551
4647
|
borderRadius: "md",
|
|
4552
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4648
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", color: validationResults.rest.isValid ? "green.700" : "red.700", _dark: { color: validationResults.rest.isValid ? "green.300" : "red.300" }, children: validationResults.rest.error || "REST endpoint is valid" })
|
|
4553
4649
|
}
|
|
4554
4650
|
)
|
|
4555
4651
|
] }),
|
|
4556
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
4557
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4558
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4652
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.Box, { children: [
|
|
4653
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", mb: "1", children: "RPC Endpoint" }),
|
|
4654
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "xs", color: "fg.muted", mb: "2", children: "Note: Must support WebSocket (WS/WSS) connections" }),
|
|
4559
4655
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4560
|
-
|
|
4656
|
+
import_react22.Input,
|
|
4561
4657
|
{
|
|
4562
4658
|
size: "sm",
|
|
4563
4659
|
placeholder: "wss://rpc.getbze.com",
|
|
@@ -4566,7 +4662,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4566
4662
|
}
|
|
4567
4663
|
),
|
|
4568
4664
|
validationResults.rpc && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4569
|
-
|
|
4665
|
+
import_react22.Box,
|
|
4570
4666
|
{
|
|
4571
4667
|
mt: "2",
|
|
4572
4668
|
p: "3",
|
|
@@ -4576,12 +4672,12 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4576
4672
|
borderWidth: "1px",
|
|
4577
4673
|
borderColor: validationResults.rpc.isValid ? "green.500/30" : "red.500/30",
|
|
4578
4674
|
borderRadius: "md",
|
|
4579
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4675
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Text, { fontSize: "sm", color: validationResults.rpc.isValid ? "green.700" : "red.700", _dark: { color: validationResults.rpc.isValid ? "green.300" : "red.300" }, children: validationResults.rpc.error || "RPC endpoint is valid" })
|
|
4580
4676
|
}
|
|
4581
4677
|
)
|
|
4582
4678
|
] }),
|
|
4583
4679
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4584
|
-
|
|
4680
|
+
import_react22.Button,
|
|
4585
4681
|
{
|
|
4586
4682
|
size: "sm",
|
|
4587
4683
|
variant: "outline",
|
|
@@ -4593,9 +4689,9 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4593
4689
|
)
|
|
4594
4690
|
] })
|
|
4595
4691
|
] }),
|
|
4596
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4692
|
+
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_react22.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react22.VStack, { gap: "3", children: [
|
|
4597
4693
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4598
|
-
|
|
4694
|
+
import_react22.Button,
|
|
4599
4695
|
{
|
|
4600
4696
|
size: "sm",
|
|
4601
4697
|
width: "full",
|
|
@@ -4606,7 +4702,7 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4606
4702
|
}
|
|
4607
4703
|
),
|
|
4608
4704
|
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
4609
|
-
|
|
4705
|
+
import_react22.Button,
|
|
4610
4706
|
{
|
|
4611
4707
|
size: "sm",
|
|
4612
4708
|
width: "full",
|
|
@@ -4621,10 +4717,10 @@ var SettingsSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4621
4717
|
|
|
4622
4718
|
// src/components/sidebar/wallet-sidebar.tsx
|
|
4623
4719
|
var import_styles = require("@interchain-kit/react/styles.css");
|
|
4624
|
-
var
|
|
4625
|
-
var
|
|
4720
|
+
var import_react25 = require("@interchain-kit/react");
|
|
4721
|
+
var import_react26 = require("@chakra-ui/react");
|
|
4626
4722
|
var import_lu3 = require("react-icons/lu");
|
|
4627
|
-
var
|
|
4723
|
+
var import_react27 = require("react");
|
|
4628
4724
|
var import_core = require("@interchain-kit/core");
|
|
4629
4725
|
var import_bignumber14 = __toESM(require("bignumber.js"));
|
|
4630
4726
|
var import_bzejs5 = require("@bze/bzejs");
|
|
@@ -4645,16 +4741,16 @@ var validateAmount = (amount, coin, onError) => {
|
|
|
4645
4741
|
}
|
|
4646
4742
|
};
|
|
4647
4743
|
var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
4648
|
-
const [showSendButton, setShowSendButton] = (0,
|
|
4649
|
-
const formattedBalanceAmount = (0,
|
|
4744
|
+
const [showSendButton, setShowSendButton] = (0, import_react27.useState)(false);
|
|
4745
|
+
const formattedBalanceAmount = (0, import_react27.useMemo)(() => {
|
|
4650
4746
|
var _a2;
|
|
4651
4747
|
return prettyAmount(uAmountToBigNumberAmount(asset.amount, (_a2 = asset.decimals) != null ? _a2 : 0));
|
|
4652
4748
|
}, [asset.amount, asset.decimals]);
|
|
4653
|
-
const formattedBalanceUSDValue = (0,
|
|
4749
|
+
const formattedBalanceUSDValue = (0, import_react27.useMemo)(() => {
|
|
4654
4750
|
return shortNumberFormat(asset.USDValue);
|
|
4655
4751
|
}, [asset.USDValue]);
|
|
4656
4752
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4657
|
-
|
|
4753
|
+
import_react26.Box,
|
|
4658
4754
|
{
|
|
4659
4755
|
p: "3",
|
|
4660
4756
|
bgGradient: "to-br",
|
|
@@ -4672,10 +4768,10 @@ var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
|
4672
4768
|
onMouseLeave: () => setShowSendButton(false),
|
|
4673
4769
|
onMouseEnter: () => setShowSendButton(true),
|
|
4674
4770
|
children: [
|
|
4675
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4676
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4771
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { justify: "space-between", mb: "2", children: [
|
|
4772
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { children: [
|
|
4677
4773
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4678
|
-
|
|
4774
|
+
import_react26.Image,
|
|
4679
4775
|
{
|
|
4680
4776
|
src: asset.logo,
|
|
4681
4777
|
alt: asset.ticker,
|
|
@@ -4684,13 +4780,13 @@ var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
|
4684
4780
|
borderRadius: "full"
|
|
4685
4781
|
}
|
|
4686
4782
|
),
|
|
4687
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4688
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4689
|
-
isIbcDenom(asset.denom) && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4783
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "sm", fontWeight: "medium", children: asset.ticker }),
|
|
4784
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "xs", color: "fg.muted", children: asset.name }),
|
|
4785
|
+
isIbcDenom(asset.denom) && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Badge, { size: "xs", colorPalette: accentColor, children: "IBC" })
|
|
4690
4786
|
] }),
|
|
4691
|
-
showSendButton && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4787
|
+
showSendButton && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.HStack, { justify: "end", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Button, { size: "2xs", variant: "outline", onClick, children: "Send" }) })
|
|
4692
4788
|
] }),
|
|
4693
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4789
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { justify: "space-between", children: [
|
|
4694
4790
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(HighlightText, { fontSize: "sm", fontFamily: "mono", children: formattedBalanceAmount }),
|
|
4695
4791
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(HighlightText, { fontSize: "sm", color: "fg.muted", children: [
|
|
4696
4792
|
"$",
|
|
@@ -4702,18 +4798,18 @@ var BalanceItem = ({ asset, onClick, accentColor }) => {
|
|
|
4702
4798
|
);
|
|
4703
4799
|
};
|
|
4704
4800
|
var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
4705
|
-
const [isLoading, setIsLoading] = (0,
|
|
4706
|
-
const [selectedCoin, setSelectedCoin] = (0,
|
|
4707
|
-
const [sendAmount, setSendAmount] = (0,
|
|
4708
|
-
const [sendAmountError, setSendAmountError] = (0,
|
|
4709
|
-
const [recipient, setRecipient] = (0,
|
|
4710
|
-
const [recipientError, setRecipientError] = (0,
|
|
4711
|
-
const [memo, setMemo] = (0,
|
|
4712
|
-
const [memoError, setMemoError] = (0,
|
|
4801
|
+
const [isLoading, setIsLoading] = (0, import_react27.useState)(false);
|
|
4802
|
+
const [selectedCoin, setSelectedCoin] = (0, import_react27.useState)();
|
|
4803
|
+
const [sendAmount, setSendAmount] = (0, import_react27.useState)("");
|
|
4804
|
+
const [sendAmountError, setSendAmountError] = (0, import_react27.useState)("");
|
|
4805
|
+
const [recipient, setRecipient] = (0, import_react27.useState)("");
|
|
4806
|
+
const [recipientError, setRecipientError] = (0, import_react27.useState)("");
|
|
4807
|
+
const [memo, setMemo] = (0, import_react27.useState)("");
|
|
4808
|
+
const [memoError, setMemoError] = (0, import_react27.useState)("");
|
|
4713
4809
|
const { toast } = useToast();
|
|
4714
|
-
const { status, address } = (0,
|
|
4810
|
+
const { status, address } = (0, import_react25.useChain)(getChainName());
|
|
4715
4811
|
const { tx } = useSDKTx(getChainName());
|
|
4716
|
-
const coinsCollection = (0,
|
|
4812
|
+
const coinsCollection = (0, import_react26.createListCollection)({
|
|
4717
4813
|
items: balances.map((item) => {
|
|
4718
4814
|
var _a2;
|
|
4719
4815
|
return {
|
|
@@ -4723,16 +4819,16 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4723
4819
|
};
|
|
4724
4820
|
})
|
|
4725
4821
|
});
|
|
4726
|
-
const isValidForm = (0,
|
|
4822
|
+
const isValidForm = (0, import_react27.useMemo)(() => {
|
|
4727
4823
|
return selectedCoin && memoError === "" && recipientError === "" && sendAmountError === "" && sendAmount !== "" && recipient !== "";
|
|
4728
4824
|
}, [selectedCoin, memoError, recipientError, sendAmountError, sendAmount, recipient]);
|
|
4729
|
-
const resetSendForm = (0,
|
|
4825
|
+
const resetSendForm = (0, import_react27.useCallback)(() => {
|
|
4730
4826
|
setSelectedCoin(void 0);
|
|
4731
4827
|
setSendAmount("");
|
|
4732
4828
|
setRecipient("");
|
|
4733
4829
|
setMemo("");
|
|
4734
4830
|
}, []);
|
|
4735
|
-
const handleSend = (0,
|
|
4831
|
+
const handleSend = (0, import_react27.useCallback)(async () => {
|
|
4736
4832
|
var _a2, _b2;
|
|
4737
4833
|
if (!isValidForm) {
|
|
4738
4834
|
toast.error("Can not send coins!", "Please check the input data.");
|
|
@@ -4757,11 +4853,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4757
4853
|
setIsLoading(false);
|
|
4758
4854
|
onClose();
|
|
4759
4855
|
}, [address, memo, onClose, recipient, selectedCoin, sendAmount, status]);
|
|
4760
|
-
const handleCancel = (0,
|
|
4856
|
+
const handleCancel = (0, import_react27.useCallback)(() => {
|
|
4761
4857
|
resetSendForm();
|
|
4762
4858
|
onClose();
|
|
4763
4859
|
}, [onClose, resetSendForm]);
|
|
4764
|
-
const onRecipientChange = (0,
|
|
4860
|
+
const onRecipientChange = (0, import_react27.useCallback)((recipient2) => {
|
|
4765
4861
|
setRecipient(recipient2);
|
|
4766
4862
|
if (recipient2.length === 0) {
|
|
4767
4863
|
setRecipientError("");
|
|
@@ -4774,11 +4870,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4774
4870
|
setRecipientError(validate.message);
|
|
4775
4871
|
}
|
|
4776
4872
|
}, []);
|
|
4777
|
-
const onAmountChange = (0,
|
|
4873
|
+
const onAmountChange = (0, import_react27.useCallback)((amount) => {
|
|
4778
4874
|
setSendAmount(sanitizeNumberInput(amount));
|
|
4779
4875
|
setSendAmountError("");
|
|
4780
4876
|
}, []);
|
|
4781
|
-
const onCoinSelectChange = (0,
|
|
4877
|
+
const onCoinSelectChange = (0, import_react27.useCallback)((ticker) => {
|
|
4782
4878
|
if (ticker === "") return;
|
|
4783
4879
|
const selectedCoin2 = balances.find((item) => item.ticker === ticker);
|
|
4784
4880
|
if (selectedCoin2) {
|
|
@@ -4786,13 +4882,13 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4786
4882
|
validateAmount(sendAmount, selectedCoin2, setSendAmountError);
|
|
4787
4883
|
}
|
|
4788
4884
|
}, [sendAmount, balances]);
|
|
4789
|
-
const setMaxAmount = (0,
|
|
4885
|
+
const setMaxAmount = (0, import_react27.useCallback)(() => {
|
|
4790
4886
|
if (!selectedCoin) return;
|
|
4791
4887
|
const maxAmount = uAmountToBigNumberAmount(selectedCoin.amount, selectedCoin.decimals);
|
|
4792
4888
|
onAmountChange(maxAmount.toString());
|
|
4793
4889
|
validateAmount(maxAmount.toString(), selectedCoin, setSendAmountError);
|
|
4794
4890
|
}, [selectedCoin, onAmountChange]);
|
|
4795
|
-
const onMemoChange = (0,
|
|
4891
|
+
const onMemoChange = (0, import_react27.useCallback)((memo2) => {
|
|
4796
4892
|
setMemo(memo2);
|
|
4797
4893
|
if (memo2.length > 256) {
|
|
4798
4894
|
setMemoError("Memo must be less than or equal to 256 characters");
|
|
@@ -4800,16 +4896,16 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4800
4896
|
setMemoError("");
|
|
4801
4897
|
}
|
|
4802
4898
|
}, []);
|
|
4803
|
-
(0,
|
|
4899
|
+
(0, import_react27.useEffect)(() => {
|
|
4804
4900
|
if (selectedTicker !== "") {
|
|
4805
4901
|
onCoinSelectChange(selectedTicker);
|
|
4806
4902
|
}
|
|
4807
4903
|
}, [onCoinSelectChange, selectedTicker]);
|
|
4808
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4809
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4810
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4904
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.VStack, { gap: "4", align: "stretch", children: [
|
|
4905
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { justify: "space-between", align: "center", children: [
|
|
4906
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "sm", fontWeight: "medium", children: "Send Coins" }),
|
|
4811
4907
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4812
|
-
|
|
4908
|
+
import_react26.Button,
|
|
4813
4909
|
{
|
|
4814
4910
|
size: "xs",
|
|
4815
4911
|
variant: "ghost",
|
|
@@ -4819,25 +4915,25 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4819
4915
|
}
|
|
4820
4916
|
)
|
|
4821
4917
|
] }),
|
|
4822
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4918
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Box, { children: [
|
|
4823
4919
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4824
|
-
|
|
4920
|
+
import_react26.Select.Root,
|
|
4825
4921
|
{
|
|
4826
4922
|
collection: coinsCollection,
|
|
4827
4923
|
size: "sm",
|
|
4828
4924
|
value: (selectedCoin == null ? void 0 : selectedCoin.ticker) ? [selectedCoin.ticker] : [],
|
|
4829
4925
|
onValueChange: (details) => onCoinSelectChange(details.value[0] || ""),
|
|
4830
4926
|
children: [
|
|
4831
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4832
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4833
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4834
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4835
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4927
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.Label, { children: "Coin" }),
|
|
4928
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.HiddenSelect, {}),
|
|
4929
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Select.Control, { children: [
|
|
4930
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.Trigger, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.ValueText, { placeholder: "Select coin" }) }),
|
|
4931
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.IndicatorGroup, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.Indicator, {}) })
|
|
4836
4932
|
] }),
|
|
4837
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4838
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4933
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.Positioner, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.Content, { children: coinsCollection.items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Select.Item, { item, children: [
|
|
4934
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { gap: "2", children: [
|
|
4839
4935
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4840
|
-
|
|
4936
|
+
import_react26.Image,
|
|
4841
4937
|
{
|
|
4842
4938
|
src: item.logo,
|
|
4843
4939
|
alt: item.value,
|
|
@@ -4846,15 +4942,15 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4846
4942
|
borderRadius: "full"
|
|
4847
4943
|
}
|
|
4848
4944
|
),
|
|
4849
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4945
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { children: item.label })
|
|
4850
4946
|
] }),
|
|
4851
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4947
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Select.ItemIndicator, {})
|
|
4852
4948
|
] }, item.value)) }) }) })
|
|
4853
4949
|
]
|
|
4854
4950
|
}
|
|
4855
4951
|
),
|
|
4856
4952
|
selectedCoin && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4857
|
-
|
|
4953
|
+
import_react26.Box,
|
|
4858
4954
|
{
|
|
4859
4955
|
mt: "2",
|
|
4860
4956
|
p: "3",
|
|
@@ -4864,15 +4960,15 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4864
4960
|
borderRadius: "md",
|
|
4865
4961
|
borderWidth: "1px",
|
|
4866
4962
|
borderColor: `${accentColor}.500/30`,
|
|
4867
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4868
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4869
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4870
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4963
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { justify: "space-between", children: [
|
|
4964
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "xs", color: "fg.muted", children: "Available:" }),
|
|
4965
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.VStack, { gap: "0", align: "end", children: [
|
|
4966
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Text, { fontSize: "sm", fontWeight: "medium", children: [
|
|
4871
4967
|
uAmountToAmount(selectedCoin.amount, selectedCoin.decimals),
|
|
4872
4968
|
" ",
|
|
4873
4969
|
selectedCoin.ticker
|
|
4874
4970
|
] }),
|
|
4875
|
-
selectedCoin.USDValue.gt(0) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4971
|
+
selectedCoin.USDValue.gt(0) && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Text, { fontSize: "xs", color: "fg.muted", children: [
|
|
4876
4972
|
"\u2248 $",
|
|
4877
4973
|
shortNumberFormat(selectedCoin.USDValue)
|
|
4878
4974
|
] })
|
|
@@ -4881,11 +4977,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4881
4977
|
}
|
|
4882
4978
|
)
|
|
4883
4979
|
] }),
|
|
4884
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4885
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4886
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
4980
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Field.Root, { invalid: sendAmountError !== "", children: [
|
|
4981
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Field.Label, { children: "Amount" }),
|
|
4982
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Group, { attached: true, w: "full", maxW: "sm", children: [
|
|
4887
4983
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4888
|
-
|
|
4984
|
+
import_react26.Input,
|
|
4889
4985
|
{
|
|
4890
4986
|
size: "sm",
|
|
4891
4987
|
placeholder: "Amount to send",
|
|
@@ -4894,14 +4990,14 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4894
4990
|
onBlur: () => validateAmount(sendAmount, selectedCoin, setSendAmountError)
|
|
4895
4991
|
}
|
|
4896
4992
|
),
|
|
4897
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4993
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Button, { variant: "outline", size: "sm", onClick: setMaxAmount, disabled: isLoading, children: "Max" })
|
|
4898
4994
|
] }),
|
|
4899
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4995
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Field.ErrorText, { children: sendAmountError })
|
|
4900
4996
|
] }) }),
|
|
4901
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4902
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4997
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Field.Root, { invalid: recipientError !== "", children: [
|
|
4998
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Field.Label, { children: "Recipient Address" }),
|
|
4903
4999
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4904
|
-
|
|
5000
|
+
import_react26.Input,
|
|
4905
5001
|
{
|
|
4906
5002
|
size: "sm",
|
|
4907
5003
|
placeholder: "bze...2a1b",
|
|
@@ -4909,20 +5005,20 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4909
5005
|
onChange: (e) => onRecipientChange(e.target.value)
|
|
4910
5006
|
}
|
|
4911
5007
|
),
|
|
4912
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5008
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Field.ErrorText, { children: recipientError })
|
|
4913
5009
|
] }) }),
|
|
4914
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4915
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5010
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Field.Root, { invalid: memoError !== "", children: [
|
|
5011
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Field.Label, { children: [
|
|
4916
5012
|
"Memo",
|
|
4917
5013
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4918
|
-
|
|
5014
|
+
import_react26.Field.RequiredIndicator,
|
|
4919
5015
|
{
|
|
4920
|
-
fallback: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5016
|
+
fallback: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Badge, { size: "xs", variant: "surface", children: "Optional" })
|
|
4921
5017
|
}
|
|
4922
5018
|
)
|
|
4923
5019
|
] }),
|
|
4924
5020
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4925
|
-
|
|
5021
|
+
import_react26.Textarea,
|
|
4926
5022
|
{
|
|
4927
5023
|
size: "sm",
|
|
4928
5024
|
placeholder: "Transaction memo",
|
|
@@ -4932,11 +5028,11 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4932
5028
|
resize: "none"
|
|
4933
5029
|
}
|
|
4934
5030
|
),
|
|
4935
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5031
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Field.ErrorText, { children: memoError })
|
|
4936
5032
|
] }) }),
|
|
4937
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5033
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { gap: "2", children: [
|
|
4938
5034
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4939
|
-
|
|
5035
|
+
import_react26.Button,
|
|
4940
5036
|
{
|
|
4941
5037
|
size: "sm",
|
|
4942
5038
|
flex: "1",
|
|
@@ -4949,7 +5045,7 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4949
5045
|
}
|
|
4950
5046
|
),
|
|
4951
5047
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4952
|
-
|
|
5048
|
+
import_react26.Button,
|
|
4953
5049
|
{
|
|
4954
5050
|
size: "sm",
|
|
4955
5051
|
flex: "1",
|
|
@@ -4963,25 +5059,25 @@ var SendForm = ({ balances, onClose, selectedTicker, accentColor }) => {
|
|
|
4963
5059
|
] });
|
|
4964
5060
|
};
|
|
4965
5061
|
var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
4966
|
-
const [viewState, setViewState] = (0,
|
|
4967
|
-
const [isDisconnecting, setIsDisconnecting] = (0,
|
|
4968
|
-
const [showCopiedTooltip, setShowCopiedTooltip] = (0,
|
|
4969
|
-
const [clickedBalance, setClickedBalance] = (0,
|
|
4970
|
-
const copyButtonRef = (0,
|
|
5062
|
+
const [viewState, setViewState] = (0, import_react27.useState)("balances");
|
|
5063
|
+
const [isDisconnecting, setIsDisconnecting] = (0, import_react27.useState)(false);
|
|
5064
|
+
const [showCopiedTooltip, setShowCopiedTooltip] = (0, import_react27.useState)(false);
|
|
5065
|
+
const [clickedBalance, setClickedBalance] = (0, import_react27.useState)("");
|
|
5066
|
+
const copyButtonRef = (0, import_react27.useRef)(null);
|
|
4971
5067
|
const {
|
|
4972
5068
|
status,
|
|
4973
5069
|
username,
|
|
4974
5070
|
address,
|
|
4975
5071
|
disconnect,
|
|
4976
5072
|
connect
|
|
4977
|
-
} = (0,
|
|
5073
|
+
} = (0, import_react25.useChain)(getChainName());
|
|
4978
5074
|
const { assetsBalances, isLoading: assetsLoading } = useBalances();
|
|
4979
|
-
const balancesWithoutLps = (0,
|
|
5075
|
+
const balancesWithoutLps = (0, import_react27.useMemo)(() => {
|
|
4980
5076
|
if (assetsLoading) return [];
|
|
4981
5077
|
return assetsBalances.filter((asset) => !isLpDenom(asset.denom));
|
|
4982
5078
|
}, [assetsLoading, assetsBalances]);
|
|
4983
5079
|
const nativeDenom = getChainNativeAssetDenom();
|
|
4984
|
-
const sortedBalances = (0,
|
|
5080
|
+
const sortedBalances = (0, import_react27.useMemo)(() => {
|
|
4985
5081
|
return balancesWithoutLps.sort((a, b) => {
|
|
4986
5082
|
if (a.denom === nativeDenom) return -1;
|
|
4987
5083
|
if (b.denom === nativeDenom) return 1;
|
|
@@ -4997,21 +5093,21 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
4997
5093
|
return 0;
|
|
4998
5094
|
});
|
|
4999
5095
|
}, [balancesWithoutLps]);
|
|
5000
|
-
const walletAddress = (0,
|
|
5096
|
+
const walletAddress = (0, import_react27.useMemo)(() => stringTruncateFromCenter(address != null ? address : "", 16), [address]);
|
|
5001
5097
|
const handleCopyAddress = () => {
|
|
5002
5098
|
navigator.clipboard.writeText(address);
|
|
5003
5099
|
setShowCopiedTooltip(true);
|
|
5004
5100
|
setTimeout(() => setShowCopiedTooltip(false), 2e3);
|
|
5005
5101
|
};
|
|
5006
|
-
const handleCancel = (0,
|
|
5102
|
+
const handleCancel = (0, import_react27.useCallback)(() => {
|
|
5007
5103
|
setViewState("balances");
|
|
5008
5104
|
setClickedBalance("");
|
|
5009
5105
|
}, []);
|
|
5010
|
-
const onBalanceClick = (0,
|
|
5106
|
+
const onBalanceClick = (0, import_react27.useCallback)((ticker) => {
|
|
5011
5107
|
setClickedBalance(ticker);
|
|
5012
5108
|
setViewState("send");
|
|
5013
5109
|
}, []);
|
|
5014
|
-
const handleDisconnectAll = (0,
|
|
5110
|
+
const handleDisconnectAll = (0, import_react27.useCallback)(async () => {
|
|
5015
5111
|
setIsDisconnecting(true);
|
|
5016
5112
|
try {
|
|
5017
5113
|
console.log("Disconnected from all chains");
|
|
@@ -5022,16 +5118,16 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5022
5118
|
setIsDisconnecting(false);
|
|
5023
5119
|
}
|
|
5024
5120
|
}, [disconnect]);
|
|
5025
|
-
const renderBalancesView = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5026
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5027
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5028
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5121
|
+
const renderBalancesView = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.VStack, { gap: "6", align: "stretch", children: [
|
|
5122
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Box, { children: [
|
|
5123
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Balances" }),
|
|
5124
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.VStack, { gap: "2", align: "stretch", children: sortedBalances.map((bal) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(BalanceItem, { asset: bal, onClick: () => onBalanceClick(bal.ticker), accentColor }, bal.denom)) })
|
|
5029
5125
|
] }),
|
|
5030
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5031
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5032
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5126
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Box, { children: [
|
|
5127
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "sm", fontWeight: "medium", mb: "3", children: "Quick Actions" }),
|
|
5128
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.VStack, { gap: "2", align: "stretch", children: [
|
|
5033
5129
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5034
|
-
|
|
5130
|
+
import_react26.Button,
|
|
5035
5131
|
{
|
|
5036
5132
|
size: "sm",
|
|
5037
5133
|
variant: "outline",
|
|
@@ -5042,7 +5138,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5042
5138
|
}
|
|
5043
5139
|
),
|
|
5044
5140
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5045
|
-
|
|
5141
|
+
import_react26.Button,
|
|
5046
5142
|
{
|
|
5047
5143
|
size: "sm",
|
|
5048
5144
|
variant: "outline",
|
|
@@ -5055,7 +5151,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5055
5151
|
}
|
|
5056
5152
|
),
|
|
5057
5153
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5058
|
-
|
|
5154
|
+
import_react26.Button,
|
|
5059
5155
|
{
|
|
5060
5156
|
size: "sm",
|
|
5061
5157
|
variant: "outline",
|
|
@@ -5069,8 +5165,8 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5069
5165
|
)
|
|
5070
5166
|
] })
|
|
5071
5167
|
] }),
|
|
5072
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5073
|
-
|
|
5168
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Box, { children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5169
|
+
import_react26.Button,
|
|
5074
5170
|
{
|
|
5075
5171
|
size: "sm",
|
|
5076
5172
|
width: "full",
|
|
@@ -5083,7 +5179,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5083
5179
|
}
|
|
5084
5180
|
) })
|
|
5085
5181
|
] });
|
|
5086
|
-
const statusColor = (0,
|
|
5182
|
+
const statusColor = (0, import_react27.useMemo)(() => {
|
|
5087
5183
|
switch (status) {
|
|
5088
5184
|
case import_core.WalletState.Connected:
|
|
5089
5185
|
return "green";
|
|
@@ -5095,15 +5191,15 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5095
5191
|
return "gray";
|
|
5096
5192
|
}
|
|
5097
5193
|
}, [status]);
|
|
5098
|
-
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5099
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5100
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5101
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5102
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5103
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5194
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.VStack, { gap: "6", align: "stretch", children: [
|
|
5195
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Box, { children: [
|
|
5196
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react25.InterchainWalletModal, {}),
|
|
5197
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { justify: "space-between", mb: "3", children: [
|
|
5198
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "sm", fontWeight: "medium", children: "Wallet Status" }),
|
|
5199
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Badge, { colorPalette: statusColor, size: "sm", children: status })
|
|
5104
5200
|
] }),
|
|
5105
5201
|
status === import_core.WalletState.Connected && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5106
|
-
|
|
5202
|
+
import_react26.Box,
|
|
5107
5203
|
{
|
|
5108
5204
|
p: "3",
|
|
5109
5205
|
bgGradient: "to-br",
|
|
@@ -5113,12 +5209,12 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5113
5209
|
borderWidth: "1px",
|
|
5114
5210
|
borderColor: `${accentColor}.500/20`,
|
|
5115
5211
|
children: [
|
|
5116
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5117
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5118
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5119
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
5212
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "xs", color: "fg.muted", mb: "1", children: username != null ? username : "Address" }),
|
|
5213
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.HStack, { justify: "space-between", children: [
|
|
5214
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Text, { fontSize: "sm", fontFamily: "mono", children: walletAddress }),
|
|
5215
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react26.Box, { position: "relative", children: [
|
|
5120
5216
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5121
|
-
|
|
5217
|
+
import_react26.Button,
|
|
5122
5218
|
{
|
|
5123
5219
|
ref: copyButtonRef,
|
|
5124
5220
|
size: "xs",
|
|
@@ -5128,7 +5224,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5128
5224
|
}
|
|
5129
5225
|
),
|
|
5130
5226
|
showCopiedTooltip && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5131
|
-
|
|
5227
|
+
import_react26.Box,
|
|
5132
5228
|
{
|
|
5133
5229
|
position: "absolute",
|
|
5134
5230
|
top: "-35px",
|
|
@@ -5154,7 +5250,7 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5154
5250
|
}
|
|
5155
5251
|
),
|
|
5156
5252
|
status !== import_core.WalletState.Connected && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5157
|
-
|
|
5253
|
+
import_react26.Button,
|
|
5158
5254
|
{
|
|
5159
5255
|
size: "sm",
|
|
5160
5256
|
variant: "solid",
|
|
@@ -5164,14 +5260,14 @@ var WalletSidebarContent = ({ accentColor = "blue" }) => {
|
|
|
5164
5260
|
}
|
|
5165
5261
|
)
|
|
5166
5262
|
] }),
|
|
5167
|
-
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
5263
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(import_react26.Separator, {}),
|
|
5168
5264
|
status === import_core.WalletState.Connected && viewState === "balances" && renderBalancesView(),
|
|
5169
5265
|
status === import_core.WalletState.Connected && viewState === "send" && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SendForm, { balances: sortedBalances, onClose: handleCancel, selectedTicker: clickedBalance, accentColor })
|
|
5170
5266
|
] });
|
|
5171
5267
|
};
|
|
5172
5268
|
|
|
5173
5269
|
// src/components/settings-toggle.tsx
|
|
5174
|
-
var
|
|
5270
|
+
var import_react28 = require("@chakra-ui/react");
|
|
5175
5271
|
var import_lu4 = require("react-icons/lu");
|
|
5176
5272
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
5177
5273
|
function SettingsToggle({ accentColor }) {
|
|
@@ -5179,21 +5275,21 @@ function SettingsToggle({ accentColor }) {
|
|
|
5179
5275
|
Sidebar,
|
|
5180
5276
|
{
|
|
5181
5277
|
ariaLabel: "Settings",
|
|
5182
|
-
trigger: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
5278
|
+
trigger: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react28.Button, { variant: "subtle", size: { base: "sm", md: "md" }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_lu4.LuSettings, {}) }),
|
|
5183
5279
|
children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(SettingsSidebarContent, { accentColor })
|
|
5184
5280
|
}
|
|
5185
5281
|
);
|
|
5186
5282
|
}
|
|
5187
5283
|
|
|
5188
5284
|
// src/components/testnet-banner.tsx
|
|
5189
|
-
var
|
|
5285
|
+
var import_react29 = require("@chakra-ui/react");
|
|
5190
5286
|
var import_jsx_runtime7 = require("react/jsx-runtime");
|
|
5191
5287
|
var TestnetBanner = () => {
|
|
5192
5288
|
if (!isTestnetChain()) {
|
|
5193
5289
|
return null;
|
|
5194
5290
|
}
|
|
5195
5291
|
return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
5196
|
-
|
|
5292
|
+
import_react29.Box,
|
|
5197
5293
|
{
|
|
5198
5294
|
position: "fixed",
|
|
5199
5295
|
bottom: "0",
|
|
@@ -5207,7 +5303,7 @@ var TestnetBanner = () => {
|
|
|
5207
5303
|
fontSize: "xs",
|
|
5208
5304
|
fontWeight: "bold",
|
|
5209
5305
|
letterSpacing: "wide",
|
|
5210
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
|
|
5306
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(import_react29.Text, { children: "YOU ARE ON TESTNET" })
|
|
5211
5307
|
}
|
|
5212
5308
|
);
|
|
5213
5309
|
};
|
|
@@ -5464,6 +5560,7 @@ var TestnetBanner = () => {
|
|
|
5464
5560
|
useSettings,
|
|
5465
5561
|
useSigningClient,
|
|
5466
5562
|
useToast,
|
|
5563
|
+
useValidatorLogos,
|
|
5467
5564
|
validateBZEBech32Address,
|
|
5468
5565
|
validateBech32Address,
|
|
5469
5566
|
validateEndpoints,
|