@wallet-ui/react 2.0.0-canary-20250818134015 → 2.0.0-canary-20250827010551
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.browser.cjs +97 -134
- package/dist/index.browser.cjs.map +1 -1
- package/dist/index.browser.mjs +78 -111
- package/dist/index.browser.mjs.map +1 -1
- package/dist/index.native.mjs +78 -111
- package/dist/index.native.mjs.map +1 -1
- package/dist/index.node.cjs +97 -134
- package/dist/index.node.cjs.map +1 -1
- package/dist/index.node.mjs +78 -111
- package/dist/index.node.mjs.map +1 -1
- package/dist/types/index.d.ts +0 -4
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/use-wallet-ui-signer.d.ts +3 -5
- package/dist/types/use-wallet-ui-signer.d.ts.map +1 -1
- package/dist/types/wallet-ui-context-provider.d.ts.map +1 -1
- package/dist/types/wallet-ui-context.d.ts +0 -2
- package/dist/types/wallet-ui-context.d.ts.map +1 -1
- package/dist/types/wallet-ui.d.ts.map +1 -1
- package/package.json +4 -5
- package/dist/types/use-wallet-ui-sign-and-send.d.ts +0 -3
- package/dist/types/use-wallet-ui-sign-and-send.d.ts.map +0 -1
- package/dist/types/use-wallet-ui-solana-client.d.ts +0 -2
- package/dist/types/use-wallet-ui-solana-client.d.ts.map +0 -1
- package/dist/types/wallet-ui-solana-client-context-provider.d.ts +0 -4
- package/dist/types/wallet-ui-solana-client-context-provider.d.ts.map +0 -1
- package/dist/types/wallet-ui-solana-client-context.d.ts +0 -8
- package/dist/types/wallet-ui-solana-client-context.d.ts.map +0 -1
package/dist/index.node.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import
|
|
1
|
+
import React19, { createContext, useContext, useEffect, useId, useMemo, useState } from 'react';
|
|
2
2
|
import { useConnect, useDisconnect, useWallets, uiWalletAccountsAreSame, uiWalletAccountBelongsToUiWallet, getUiWalletAccountStorageKey } from '@wallet-standard/react';
|
|
3
3
|
export * from '@wallet-standard/react';
|
|
4
4
|
import { Portal, useMachine, normalizeProps } from '@zag-js/react';
|
|
@@ -6,7 +6,6 @@ import * as menu from '@zag-js/menu';
|
|
|
6
6
|
import * as dialog from '@zag-js/dialog';
|
|
7
7
|
import { useWalletAccountTransactionSendingSigner } from '@solana/react';
|
|
8
8
|
export * from '@solana/react';
|
|
9
|
-
import { createTransaction, signAndSendTransactionMessageWithSigners, getBase58Decoder, createSolanaClient } from 'gill';
|
|
10
9
|
import { useStore } from '@nanostores/react';
|
|
11
10
|
import { createStorageAccount, createStorageCluster, handleCopyText } from '@wallet-ui/core';
|
|
12
11
|
export * from '@wallet-ui/core';
|
|
@@ -15,13 +14,13 @@ export * from '@wallet-standard/core';
|
|
|
15
14
|
|
|
16
15
|
// src/base-button.tsx
|
|
17
16
|
function BaseButton({ className, label, leftSection, onClick, rightSection, size, ...props }) {
|
|
18
|
-
return /* @__PURE__ */
|
|
17
|
+
return /* @__PURE__ */ React19.createElement("button", { "data-wu": "base-button", className: `${size ?? "md"} ${className ?? ""}`, onClick, ...props }, leftSection ? /* @__PURE__ */ React19.createElement("span", { "data-wu": "base-button-left-section" }, leftSection) : null, label, rightSection ? /* @__PURE__ */ React19.createElement("span", { "data-wu": "base-button-right-section" }, rightSection) : null);
|
|
19
18
|
}
|
|
20
|
-
var WalletUiContext =
|
|
19
|
+
var WalletUiContext = React19.createContext({});
|
|
21
20
|
|
|
22
21
|
// src/use-wallet-ui.tsx
|
|
23
22
|
function useWalletUi() {
|
|
24
|
-
return
|
|
23
|
+
return React19.useContext(WalletUiContext);
|
|
25
24
|
}
|
|
26
25
|
var WalletUiAccountContext = createContext({});
|
|
27
26
|
|
|
@@ -59,7 +58,7 @@ function WalletUiIcon({ className, size = "md", wallet, ...props }) {
|
|
|
59
58
|
if (!wallet) {
|
|
60
59
|
return null;
|
|
61
60
|
}
|
|
62
|
-
return /* @__PURE__ */
|
|
61
|
+
return /* @__PURE__ */ React19.createElement(
|
|
63
62
|
"img",
|
|
64
63
|
{
|
|
65
64
|
"data-wu": "wallet-ui-icon",
|
|
@@ -82,17 +81,17 @@ var BaseDropdownItemType = /* @__PURE__ */ ((BaseDropdownItemType2) => {
|
|
|
82
81
|
})(BaseDropdownItemType || {});
|
|
83
82
|
function BaseDropdown({ buttonProps, dropdown, items, showIndicator, size = "md" }) {
|
|
84
83
|
const api = dropdown.api;
|
|
85
|
-
const trigger = /* @__PURE__ */
|
|
84
|
+
const trigger = /* @__PURE__ */ React19.createElement(
|
|
86
85
|
BaseButton,
|
|
87
86
|
{
|
|
88
87
|
...api.getTriggerProps(),
|
|
89
88
|
size,
|
|
90
|
-
rightSection: showIndicator ? /* @__PURE__ */
|
|
89
|
+
rightSection: showIndicator ? /* @__PURE__ */ React19.createElement("span", { ...api.getIndicatorProps() }, /* @__PURE__ */ React19.createElement(BaseDropdownChevronDown, { size: 12 })) : null,
|
|
91
90
|
...buttonProps
|
|
92
91
|
}
|
|
93
92
|
);
|
|
94
|
-
return /* @__PURE__ */
|
|
95
|
-
return /* @__PURE__ */
|
|
93
|
+
return /* @__PURE__ */ React19.createElement("div", { "data-wu": "base-dropdown" }, trigger, /* @__PURE__ */ React19.createElement("div", { ...api.getPositionerProps(), "data-wu": "base-dropdown-wrapper" }, /* @__PURE__ */ React19.createElement("div", { ...api.getContentProps(), "data-wu": "base-dropdown-list", "data-part": "content" }, items.map((item) => {
|
|
94
|
+
return /* @__PURE__ */ React19.createElement(
|
|
96
95
|
BaseDropdownItem,
|
|
97
96
|
{
|
|
98
97
|
...api.getItemProps({ value: item.value }),
|
|
@@ -113,17 +112,17 @@ function BaseDropdown({ buttonProps, dropdown, items, showIndicator, size = "md"
|
|
|
113
112
|
}
|
|
114
113
|
function BaseDropdownItem({ afterClick, item, size }) {
|
|
115
114
|
if (!item.wallet) {
|
|
116
|
-
return /* @__PURE__ */
|
|
115
|
+
return /* @__PURE__ */ React19.createElement(BaseDropdownItemRender, { afterClick, item, size });
|
|
117
116
|
}
|
|
118
117
|
switch (item.type) {
|
|
119
118
|
case "Item" /* Item */:
|
|
120
|
-
return /* @__PURE__ */
|
|
119
|
+
return /* @__PURE__ */ React19.createElement(BaseDropdownItemRender, { afterClick, item, size });
|
|
121
120
|
case "WalletConnect" /* WalletConnect */:
|
|
122
|
-
return /* @__PURE__ */
|
|
121
|
+
return /* @__PURE__ */ React19.createElement(BaseDropdownItemWalletConnect, { afterClick, item, size, wallet: item.wallet });
|
|
123
122
|
case "WalletCopy" /* WalletCopy */:
|
|
124
|
-
return /* @__PURE__ */
|
|
123
|
+
return /* @__PURE__ */ React19.createElement(BaseDropdownItemRender, { afterClick, item, size });
|
|
125
124
|
case "WalletDisconnect" /* WalletDisconnect */:
|
|
126
|
-
return /* @__PURE__ */
|
|
125
|
+
return /* @__PURE__ */ React19.createElement(
|
|
127
126
|
BaseDropdownItemWalletDisconnect,
|
|
128
127
|
{
|
|
129
128
|
afterClick,
|
|
@@ -141,7 +140,7 @@ function BaseDropdownItemWalletConnect({
|
|
|
141
140
|
wallet
|
|
142
141
|
}) {
|
|
143
142
|
const { connect: connect3 } = useWalletUiWallet({ wallet });
|
|
144
|
-
return /* @__PURE__ */
|
|
143
|
+
return /* @__PURE__ */ React19.createElement(
|
|
145
144
|
BaseDropdownItemRender,
|
|
146
145
|
{
|
|
147
146
|
afterClick,
|
|
@@ -151,7 +150,7 @@ function BaseDropdownItemWalletConnect({
|
|
|
151
150
|
await connect3();
|
|
152
151
|
return await item.handler();
|
|
153
152
|
},
|
|
154
|
-
leftSection: wallet ? /* @__PURE__ */
|
|
153
|
+
leftSection: wallet ? /* @__PURE__ */ React19.createElement(WalletUiIcon, { wallet, size }) : void 0
|
|
155
154
|
},
|
|
156
155
|
size
|
|
157
156
|
}
|
|
@@ -164,7 +163,7 @@ function BaseDropdownItemWalletDisconnect({
|
|
|
164
163
|
wallet
|
|
165
164
|
}) {
|
|
166
165
|
const { disconnect } = useWalletUiWallet({ wallet });
|
|
167
|
-
return /* @__PURE__ */
|
|
166
|
+
return /* @__PURE__ */ React19.createElement(
|
|
168
167
|
BaseDropdownItemRender,
|
|
169
168
|
{
|
|
170
169
|
afterClick,
|
|
@@ -188,10 +187,10 @@ function BaseDropdownItemRender({ afterClick, item, size }) {
|
|
|
188
187
|
afterClick();
|
|
189
188
|
});
|
|
190
189
|
}
|
|
191
|
-
return /* @__PURE__ */
|
|
190
|
+
return /* @__PURE__ */ React19.createElement("button", { type: "button", "data-wu": "base-dropdown-item", className: size, "data-part": "item", onClick }, item.leftSection ? /* @__PURE__ */ React19.createElement("span", { "data-wu": "base-dropdown-item-left-section" }, item.leftSection) : null, item.label, item.rightSection ? /* @__PURE__ */ React19.createElement("span", { "data-wu": "base-dropdown-item-right-section" }, item.rightSection) : null);
|
|
192
191
|
}
|
|
193
192
|
function BaseDropdownChevronDown(props) {
|
|
194
|
-
return /* @__PURE__ */
|
|
193
|
+
return /* @__PURE__ */ React19.createElement(
|
|
195
194
|
"svg",
|
|
196
195
|
{
|
|
197
196
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -205,17 +204,17 @@ function BaseDropdownChevronDown(props) {
|
|
|
205
204
|
strokeLinejoin: "round",
|
|
206
205
|
...props
|
|
207
206
|
},
|
|
208
|
-
/* @__PURE__ */
|
|
207
|
+
/* @__PURE__ */ React19.createElement("path", { d: "m6 9 6 6 6-6" })
|
|
209
208
|
);
|
|
210
209
|
}
|
|
211
210
|
function BaseSvg({ sizes = {}, ...props }) {
|
|
212
211
|
const size = props.size ? sizes[props.size] : 12;
|
|
213
|
-
return /* @__PURE__ */
|
|
212
|
+
return /* @__PURE__ */ React19.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, ...props }, props.children);
|
|
214
213
|
}
|
|
215
214
|
|
|
216
215
|
// src/wallet-ui-icon-close.tsx
|
|
217
216
|
function WalletUiIconClose({ size = "md", ...props }) {
|
|
218
|
-
return /* @__PURE__ */
|
|
217
|
+
return /* @__PURE__ */ React19.createElement(
|
|
219
218
|
BaseSvg,
|
|
220
219
|
{
|
|
221
220
|
size,
|
|
@@ -226,14 +225,14 @@ function WalletUiIconClose({ size = "md", ...props }) {
|
|
|
226
225
|
viewBox: "0 0 14 14",
|
|
227
226
|
...props
|
|
228
227
|
},
|
|
229
|
-
/* @__PURE__ */
|
|
228
|
+
/* @__PURE__ */ React19.createElement("path", { d: "M14 12.461 8.3 6.772l5.234-5.233L12.006 0 6.772 5.234 1.54 0 0 1.539l5.234 5.233L0 12.006l1.539 1.528L6.772 8.3l5.69 5.7L14 12.461z" })
|
|
230
229
|
);
|
|
231
230
|
}
|
|
232
231
|
|
|
233
232
|
// src/base-modal.tsx
|
|
234
233
|
function BaseModal({ modal, buttonLabel, buttonProps = {}, size = "md", ...props }) {
|
|
235
234
|
const api = modal.api;
|
|
236
|
-
return /* @__PURE__ */
|
|
235
|
+
return /* @__PURE__ */ React19.createElement(React19.Fragment, null, buttonLabel ? /* @__PURE__ */ React19.createElement(BaseButton, { label: buttonLabel, size, ...buttonProps, ...api.getTriggerProps() }) : null, api.open && /* @__PURE__ */ React19.createElement(Portal, null, /* @__PURE__ */ React19.createElement("div", { ...api.getBackdropProps() }), /* @__PURE__ */ React19.createElement("div", { ...api.getPositionerProps() }, /* @__PURE__ */ React19.createElement("div", { ...api.getContentProps(), className: size }, /* @__PURE__ */ React19.createElement("header", null, /* @__PURE__ */ React19.createElement("button", { ...api.getCloseTriggerProps() }, /* @__PURE__ */ React19.createElement(WalletUiIconClose, { size }))), props.description ? /* @__PURE__ */ React19.createElement("p", { ...api.getDescriptionProps() }, props.description) : null, /* @__PURE__ */ React19.createElement("main", null, props.children)))));
|
|
237
236
|
}
|
|
238
237
|
function useBaseDropdown() {
|
|
239
238
|
const service = useMachine(menu.machine, { id: useId() });
|
|
@@ -323,7 +322,7 @@ function useWalletUiDropdown({ size = "md" } = {}) {
|
|
|
323
322
|
const buttonProps = useMemo(() => {
|
|
324
323
|
return {
|
|
325
324
|
label: connected ? (account ? ellipsify(account.address) : wallet?.name) ?? "Connected" : "Select Wallet",
|
|
326
|
-
leftSection: connected ? /* @__PURE__ */
|
|
325
|
+
leftSection: connected ? /* @__PURE__ */ React19.createElement(WalletUiIcon, { size, wallet }) : void 0
|
|
327
326
|
};
|
|
328
327
|
}, [account, connected, size, wallet]);
|
|
329
328
|
return {
|
|
@@ -338,30 +337,12 @@ function ellipsify(str = "", len = 4, delimiter = "..") {
|
|
|
338
337
|
const limit = len * 2 + delimiter.length;
|
|
339
338
|
return strLen >= limit ? str.substring(0, len) + delimiter + str.substring(strLen - len, strLen) : str;
|
|
340
339
|
}
|
|
341
|
-
function useWalletUiSigner({
|
|
340
|
+
function useWalletUiSigner({
|
|
341
|
+
account
|
|
342
|
+
}) {
|
|
342
343
|
const { cluster } = useWalletUi();
|
|
343
344
|
return useWalletAccountTransactionSendingSigner(account, cluster.id);
|
|
344
345
|
}
|
|
345
|
-
var WalletUiSolanaClientContext = createContext({});
|
|
346
|
-
|
|
347
|
-
// src/use-wallet-ui-solana-client.tsx
|
|
348
|
-
function useWalletUiSolanaClient() {
|
|
349
|
-
return useContext(WalletUiSolanaClientContext);
|
|
350
|
-
}
|
|
351
|
-
function useWalletUiSignAndSend() {
|
|
352
|
-
const { client } = useWalletUi();
|
|
353
|
-
return async (ix, signer) => {
|
|
354
|
-
const { value: latestBlockhash } = await client.rpc.getLatestBlockhash().send();
|
|
355
|
-
const transaction = createTransaction({
|
|
356
|
-
feePayer: signer,
|
|
357
|
-
instructions: Array.isArray(ix) ? ix : [ix],
|
|
358
|
-
latestBlockhash,
|
|
359
|
-
version: 0
|
|
360
|
-
});
|
|
361
|
-
const signature = await signAndSendTransactionMessageWithSigners(transaction);
|
|
362
|
-
return getBase58Decoder().decode(signature);
|
|
363
|
-
};
|
|
364
|
-
}
|
|
365
346
|
function useWalletUiWallets() {
|
|
366
347
|
const readonlyWallets = useWallets();
|
|
367
348
|
return useMemo(
|
|
@@ -452,7 +433,7 @@ function WalletUiAccountContextProvider({
|
|
|
452
433
|
}
|
|
453
434
|
return [cluster.id, getUiWalletAccountStorageKey(account)].filter(Boolean);
|
|
454
435
|
}, [account, cluster.id]);
|
|
455
|
-
return /* @__PURE__ */
|
|
436
|
+
return /* @__PURE__ */ React19.createElement(
|
|
456
437
|
WalletUiAccountContext.Provider,
|
|
457
438
|
{
|
|
458
439
|
value: useMemo(
|
|
@@ -491,12 +472,11 @@ function WalletUiClusterContextProvider({
|
|
|
491
472
|
storage.set(clusterId2);
|
|
492
473
|
}
|
|
493
474
|
};
|
|
494
|
-
return /* @__PURE__ */
|
|
475
|
+
return /* @__PURE__ */ React19.createElement(WalletUiClusterContext.Provider, { value }, render(value));
|
|
495
476
|
}
|
|
496
477
|
function WalletUiContextProvider({ children, size = "md" }) {
|
|
497
478
|
const { account, accountKeys, cluster, setAccount, wallet } = useWalletUiAccount();
|
|
498
479
|
const wallets = useWalletUiWallets();
|
|
499
|
-
const client = useWalletUiSolanaClient();
|
|
500
480
|
const connected = Boolean(wallet && wallet?.accounts.length > 0);
|
|
501
481
|
function connect3(account2) {
|
|
502
482
|
setAccount(account2);
|
|
@@ -513,7 +493,6 @@ function WalletUiContextProvider({ children, size = "md" }) {
|
|
|
513
493
|
const value = {
|
|
514
494
|
account,
|
|
515
495
|
accountKeys,
|
|
516
|
-
client,
|
|
517
496
|
cluster,
|
|
518
497
|
connect: connect3,
|
|
519
498
|
connected,
|
|
@@ -523,19 +502,7 @@ function WalletUiContextProvider({ children, size = "md" }) {
|
|
|
523
502
|
wallet,
|
|
524
503
|
wallets
|
|
525
504
|
};
|
|
526
|
-
return /* @__PURE__ */
|
|
527
|
-
}
|
|
528
|
-
function WalletUiSolanaClientContextProvider({
|
|
529
|
-
children,
|
|
530
|
-
urlOrMoniker
|
|
531
|
-
}) {
|
|
532
|
-
return /* @__PURE__ */ React20.createElement(
|
|
533
|
-
WalletUiSolanaClientContext.Provider,
|
|
534
|
-
{
|
|
535
|
-
value: useMemo(() => createSolanaClient({ urlOrMoniker }), [urlOrMoniker])
|
|
536
|
-
},
|
|
537
|
-
children
|
|
538
|
-
);
|
|
505
|
+
return /* @__PURE__ */ React19.createElement(WalletUiContext.Provider, { value }, children);
|
|
539
506
|
}
|
|
540
507
|
|
|
541
508
|
// src/wallet-ui.tsx
|
|
@@ -543,34 +510,34 @@ function createWalletUiConfig(props) {
|
|
|
543
510
|
return { ...props };
|
|
544
511
|
}
|
|
545
512
|
function WalletUi({ children, config: { accountStorage, clusters, clusterStorage, ...config } }) {
|
|
546
|
-
return /* @__PURE__ */
|
|
513
|
+
return /* @__PURE__ */ React19.createElement(React19.Fragment, null, /* @__PURE__ */ React19.createElement(
|
|
547
514
|
WalletUiClusterContextProvider,
|
|
548
515
|
{
|
|
549
516
|
clusters,
|
|
550
517
|
storage: clusterStorage,
|
|
551
518
|
render: ({ cluster }) => {
|
|
552
|
-
return /* @__PURE__ */
|
|
519
|
+
return /* @__PURE__ */ React19.createElement(WalletUiAccountContextProvider, { cluster, storage: accountStorage }, /* @__PURE__ */ React19.createElement(WalletUiContextProvider, { ...config }, children));
|
|
553
520
|
}
|
|
554
521
|
}
|
|
555
522
|
));
|
|
556
523
|
}
|
|
557
524
|
function WalletUiDropdown({ size = "md", ...props }) {
|
|
558
525
|
const { buttonProps, items, dropdown } = useWalletUiDropdown({ size });
|
|
559
|
-
return /* @__PURE__ */
|
|
526
|
+
return /* @__PURE__ */ React19.createElement(BaseDropdown, { ...props, buttonProps: { ...buttonProps }, dropdown, items, size });
|
|
560
527
|
}
|
|
561
528
|
|
|
562
529
|
// src/wallet-ui-account-guard.tsx
|
|
563
|
-
function WalletUiAccountGuard({ fallback = /* @__PURE__ */
|
|
530
|
+
function WalletUiAccountGuard({ fallback = /* @__PURE__ */ React19.createElement(WalletUiDropdown, null), render }) {
|
|
564
531
|
const { account, accountKeys, cluster, wallet } = useWalletUiAccount();
|
|
565
532
|
return account ? render({ account, accountKeys, cluster, wallet }) : fallback;
|
|
566
533
|
}
|
|
567
534
|
function WalletUiButton({ ...props }) {
|
|
568
|
-
return /* @__PURE__ */
|
|
535
|
+
return /* @__PURE__ */ React19.createElement(BaseButton, { ...props, label: "CLICK" });
|
|
569
536
|
}
|
|
570
537
|
function WalletUiClusterDropdown({ buttonProps, size = "md", ...props }) {
|
|
571
538
|
const dropdown = useBaseDropdown();
|
|
572
539
|
const { cluster, clusters, setCluster } = useWalletUiCluster();
|
|
573
|
-
return /* @__PURE__ */
|
|
540
|
+
return /* @__PURE__ */ React19.createElement(
|
|
574
541
|
BaseDropdown,
|
|
575
542
|
{
|
|
576
543
|
size,
|
|
@@ -590,7 +557,7 @@ function WalletUiClusterDropdown({ buttonProps, size = "md", ...props }) {
|
|
|
590
557
|
);
|
|
591
558
|
}
|
|
592
559
|
function WalletUiIconNoWallet({ size, ...props }) {
|
|
593
|
-
return /* @__PURE__ */
|
|
560
|
+
return /* @__PURE__ */ React19.createElement(BaseSvg, { size, sizes: { lg: 125, md: 100, sm: 75 }, fill: "none", viewBox: "0 0 97 96", ...props }, /* @__PURE__ */ React19.createElement("circle", { cx: "48.5", cy: "48", r: "48", fill: "url(#paint0_linear_880_5115)", fillOpacity: "0.1" }), /* @__PURE__ */ React19.createElement(
|
|
594
561
|
"circle",
|
|
595
562
|
{
|
|
596
563
|
cx: "48.5",
|
|
@@ -600,19 +567,19 @@ function WalletUiIconNoWallet({ size, ...props }) {
|
|
|
600
567
|
strokeOpacity: "0.4",
|
|
601
568
|
strokeWidth: "2"
|
|
602
569
|
}
|
|
603
|
-
), /* @__PURE__ */
|
|
570
|
+
), /* @__PURE__ */ React19.createElement("g", { clipPath: "url(#clip0_880_5115)" }, /* @__PURE__ */ React19.createElement(
|
|
604
571
|
"path",
|
|
605
572
|
{
|
|
606
573
|
d: "M65.5769 28.1523H31.4231C27.6057 28.1523 24.5 31.258 24.5 35.0754V60.9215C24.5 64.7389 27.6057 67.8446 31.4231 67.8446H65.5769C69.3943 67.8446 72.5 64.7389 72.5 60.9215V35.0754C72.5 31.258 69.3943 28.1523 65.5769 28.1523ZM69.7308 52.1523H59.5769C57.2865 52.1523 55.4231 50.289 55.4231 47.9985C55.4231 45.708 57.2864 43.8446 59.5769 43.8446H69.7308V52.1523ZM69.7308 41.0754H59.5769C55.7595 41.0754 52.6539 44.1811 52.6539 47.9985C52.6539 51.8159 55.7595 54.9215 59.5769 54.9215H69.7308V60.9215C69.7308 63.2119 67.8674 65.0754 65.5769 65.0754H31.4231C29.1327 65.0754 27.2692 63.212 27.2692 60.9215V35.0754C27.2692 32.785 29.1326 30.9215 31.4231 30.9215H65.5769C67.8673 30.9215 69.7308 32.7849 69.7308 35.0754V41.0754Z",
|
|
607
574
|
fill: "url(#paint2_linear_880_5115)"
|
|
608
575
|
}
|
|
609
|
-
), /* @__PURE__ */
|
|
576
|
+
), /* @__PURE__ */ React19.createElement(
|
|
610
577
|
"path",
|
|
611
578
|
{
|
|
612
579
|
d: "M61.4231 46.6172H59.577C58.8123 46.6172 58.1924 47.2371 58.1924 48.0018C58.1924 48.7665 58.8123 49.3863 59.577 49.3863H61.4231C62.1878 49.3863 62.8077 48.7664 62.8077 48.0018C62.8077 47.2371 62.1878 46.6172 61.4231 46.6172Z",
|
|
613
580
|
fill: "url(#paint3_linear_880_5115)"
|
|
614
581
|
}
|
|
615
|
-
)), /* @__PURE__ */
|
|
582
|
+
)), /* @__PURE__ */ React19.createElement("defs", null, /* @__PURE__ */ React19.createElement(
|
|
616
583
|
"linearGradient",
|
|
617
584
|
{
|
|
618
585
|
id: "paint0_linear_880_5115",
|
|
@@ -622,13 +589,13 @@ function WalletUiIconNoWallet({ size, ...props }) {
|
|
|
622
589
|
y2: "8.42498",
|
|
623
590
|
gradientUnits: "userSpaceOnUse"
|
|
624
591
|
},
|
|
625
|
-
/* @__PURE__ */
|
|
626
|
-
/* @__PURE__ */
|
|
627
|
-
/* @__PURE__ */
|
|
628
|
-
/* @__PURE__ */
|
|
629
|
-
/* @__PURE__ */
|
|
630
|
-
/* @__PURE__ */
|
|
631
|
-
), /* @__PURE__ */
|
|
592
|
+
/* @__PURE__ */ React19.createElement("stop", { stopColor: "#9945FF" }),
|
|
593
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
|
|
594
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
|
|
595
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
|
|
596
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
|
|
597
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "1", stopColor: "#00D18C" })
|
|
598
|
+
), /* @__PURE__ */ React19.createElement(
|
|
632
599
|
"linearGradient",
|
|
633
600
|
{
|
|
634
601
|
id: "paint1_linear_880_5115",
|
|
@@ -638,13 +605,13 @@ function WalletUiIconNoWallet({ size, ...props }) {
|
|
|
638
605
|
y2: "8.42498",
|
|
639
606
|
gradientUnits: "userSpaceOnUse"
|
|
640
607
|
},
|
|
641
|
-
/* @__PURE__ */
|
|
642
|
-
/* @__PURE__ */
|
|
643
|
-
/* @__PURE__ */
|
|
644
|
-
/* @__PURE__ */
|
|
645
|
-
/* @__PURE__ */
|
|
646
|
-
/* @__PURE__ */
|
|
647
|
-
), /* @__PURE__ */
|
|
608
|
+
/* @__PURE__ */ React19.createElement("stop", { stopColor: "#9945FF" }),
|
|
609
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
|
|
610
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
|
|
611
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
|
|
612
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
|
|
613
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "1", stopColor: "#00D18C" })
|
|
614
|
+
), /* @__PURE__ */ React19.createElement(
|
|
648
615
|
"linearGradient",
|
|
649
616
|
{
|
|
650
617
|
id: "paint2_linear_880_5115",
|
|
@@ -654,13 +621,13 @@ function WalletUiIconNoWallet({ size, ...props }) {
|
|
|
654
621
|
y2: "23.7879",
|
|
655
622
|
gradientUnits: "userSpaceOnUse"
|
|
656
623
|
},
|
|
657
|
-
/* @__PURE__ */
|
|
658
|
-
/* @__PURE__ */
|
|
659
|
-
/* @__PURE__ */
|
|
660
|
-
/* @__PURE__ */
|
|
661
|
-
/* @__PURE__ */
|
|
662
|
-
/* @__PURE__ */
|
|
663
|
-
), /* @__PURE__ */
|
|
624
|
+
/* @__PURE__ */ React19.createElement("stop", { stopColor: "#9945FF" }),
|
|
625
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
|
|
626
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
|
|
627
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
|
|
628
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
|
|
629
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "1", stopColor: "#00D18C" })
|
|
630
|
+
), /* @__PURE__ */ React19.createElement(
|
|
664
631
|
"linearGradient",
|
|
665
632
|
{
|
|
666
633
|
id: "paint3_linear_880_5115",
|
|
@@ -670,22 +637,22 @@ function WalletUiIconNoWallet({ size, ...props }) {
|
|
|
670
637
|
y2: "45.4453",
|
|
671
638
|
gradientUnits: "userSpaceOnUse"
|
|
672
639
|
},
|
|
673
|
-
/* @__PURE__ */
|
|
674
|
-
/* @__PURE__ */
|
|
675
|
-
/* @__PURE__ */
|
|
676
|
-
/* @__PURE__ */
|
|
677
|
-
/* @__PURE__ */
|
|
678
|
-
/* @__PURE__ */
|
|
679
|
-
), /* @__PURE__ */
|
|
640
|
+
/* @__PURE__ */ React19.createElement("stop", { stopColor: "#9945FF" }),
|
|
641
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
|
|
642
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
|
|
643
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
|
|
644
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
|
|
645
|
+
/* @__PURE__ */ React19.createElement("stop", { offset: "1", stopColor: "#00D18C" })
|
|
646
|
+
), /* @__PURE__ */ React19.createElement("clipPath", { id: "clip0_880_5115" }, /* @__PURE__ */ React19.createElement("rect", { width: "48", height: "48", fill: "white", transform: "translate(24.5 24)" }))));
|
|
680
647
|
}
|
|
681
648
|
function WalletUiLabel({ className, size, wallet, ...props }) {
|
|
682
649
|
if (!wallet) {
|
|
683
650
|
return null;
|
|
684
651
|
}
|
|
685
|
-
return /* @__PURE__ */
|
|
652
|
+
return /* @__PURE__ */ React19.createElement("span", { "data-wu": "wallet-ui-label", className: `${size ?? "md"} ${className ?? ""}`, ...props }, wallet.name);
|
|
686
653
|
}
|
|
687
654
|
function WalletUiListButton({ className, select, size = "md", wallet, ...props }) {
|
|
688
|
-
const [pending, setPending] =
|
|
655
|
+
const [pending, setPending] = React19.useState(false);
|
|
689
656
|
function handleSelect() {
|
|
690
657
|
if (!select) {
|
|
691
658
|
return;
|
|
@@ -697,7 +664,7 @@ function WalletUiListButton({ className, select, size = "md", wallet, ...props }
|
|
|
697
664
|
}
|
|
698
665
|
void select(account).finally(() => setPending(false));
|
|
699
666
|
}
|
|
700
|
-
return /* @__PURE__ */
|
|
667
|
+
return /* @__PURE__ */ React19.createElement(
|
|
701
668
|
"button",
|
|
702
669
|
{
|
|
703
670
|
disabled: pending,
|
|
@@ -706,22 +673,22 @@ function WalletUiListButton({ className, select, size = "md", wallet, ...props }
|
|
|
706
673
|
onClick: handleSelect,
|
|
707
674
|
...props
|
|
708
675
|
},
|
|
709
|
-
/* @__PURE__ */
|
|
710
|
-
/* @__PURE__ */
|
|
676
|
+
/* @__PURE__ */ React19.createElement(WalletUiIcon, { wallet, size }),
|
|
677
|
+
/* @__PURE__ */ React19.createElement(WalletUiLabel, { wallet, size })
|
|
711
678
|
);
|
|
712
679
|
}
|
|
713
680
|
|
|
714
681
|
// src/wallet-ui-list.tsx
|
|
715
682
|
function WalletUiList({ className, select, size = "md", wallets, ...props }) {
|
|
716
|
-
return /* @__PURE__ */
|
|
683
|
+
return /* @__PURE__ */ React19.createElement("div", { "data-wu": "wallet-ui-list", className: `${size} ${className ?? ""}`, ...props }, wallets.map((wallet) => /* @__PURE__ */ React19.createElement(WalletUiListButton, { key: wallet.name, select, size, wallet })));
|
|
717
684
|
}
|
|
718
685
|
function WalletUiModal({ size = "md", wallets, select, ...props }) {
|
|
719
|
-
return /* @__PURE__ */
|
|
686
|
+
return /* @__PURE__ */ React19.createElement(BaseModal, { description: "Connect a wallet on Solana to continue", size, ...props }, /* @__PURE__ */ React19.createElement(WalletUiList, { size, wallets, select }));
|
|
720
687
|
}
|
|
721
688
|
function WalletUiModalTrigger({ label = "Select Wallet", modal, ...props }) {
|
|
722
|
-
return /* @__PURE__ */
|
|
689
|
+
return /* @__PURE__ */ React19.createElement(BaseButton, { label, onClick: () => void modal.open(), ...props });
|
|
723
690
|
}
|
|
724
691
|
|
|
725
|
-
export { BaseButton, BaseDropdown, BaseDropdownChevronDown, BaseDropdownItemType, BaseModal, BaseSvg, WalletUi, WalletUiAccountContext, WalletUiAccountContextProvider, WalletUiAccountGuard, WalletUiButton, WalletUiClusterContext, WalletUiClusterContextProvider, WalletUiClusterDropdown, WalletUiContext, WalletUiContextProvider, WalletUiDropdown, WalletUiIcon, WalletUiIconClose, WalletUiIconNoWallet, WalletUiLabel, WalletUiList, WalletUiListButton, WalletUiModal, WalletUiModalTrigger,
|
|
692
|
+
export { BaseButton, BaseDropdown, BaseDropdownChevronDown, BaseDropdownItemType, BaseModal, BaseSvg, WalletUi, WalletUiAccountContext, WalletUiAccountContextProvider, WalletUiAccountGuard, WalletUiButton, WalletUiClusterContext, WalletUiClusterContextProvider, WalletUiClusterDropdown, WalletUiContext, WalletUiContextProvider, WalletUiDropdown, WalletUiIcon, WalletUiIconClose, WalletUiIconNoWallet, WalletUiLabel, WalletUiList, WalletUiListButton, WalletUiModal, WalletUiModalTrigger, createWalletUiConfig, ellipsify, useBaseDropdown, useBaseModal, useWalletUi, useWalletUiAccount, useWalletUiCluster, useWalletUiDropdown, useWalletUiSigner, useWalletUiWallet, useWalletUiWallets };
|
|
726
693
|
//# sourceMappingURL=index.node.mjs.map
|
|
727
694
|
//# sourceMappingURL=index.node.mjs.map
|