@wallet-ui/react 1.1.0-canary-20250321005249 → 1.1.0-canary-20250324005504

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.
Files changed (119) hide show
  1. package/README.md +1 -1
  2. package/dist/index.browser.cjs +699 -288
  3. package/dist/index.browser.cjs.map +1 -1
  4. package/dist/index.browser.mjs +637 -259
  5. package/dist/index.browser.mjs.map +1 -1
  6. package/dist/index.css +535 -152
  7. package/dist/index.css.map +1 -1
  8. package/dist/index.native.mjs +637 -259
  9. package/dist/index.native.mjs.map +1 -1
  10. package/dist/index.node.cjs +699 -288
  11. package/dist/index.node.cjs.map +1 -1
  12. package/dist/index.node.mjs +637 -259
  13. package/dist/index.node.mjs.map +1 -1
  14. package/dist/types/base-button.d.ts +12 -0
  15. package/dist/types/base-button.d.ts.map +1 -0
  16. package/dist/types/base-dropdown.d.ts +33 -0
  17. package/dist/types/base-dropdown.d.ts.map +1 -0
  18. package/dist/types/base-modal.d.ts +15 -0
  19. package/dist/types/base-modal.d.ts.map +1 -0
  20. package/dist/types/base-svg.d.ts +12 -0
  21. package/dist/types/base-svg.d.ts.map +1 -0
  22. package/dist/types/index.d.ts +37 -13
  23. package/dist/types/index.d.ts.map +1 -1
  24. package/dist/types/types/wallet-ui-button.d.ts +3 -0
  25. package/dist/types/types/wallet-ui-button.d.ts.map +1 -0
  26. package/dist/types/types/wallet-ui-div.d.ts +3 -0
  27. package/dist/types/types/wallet-ui-div.d.ts.map +1 -0
  28. package/dist/types/types/wallet-ui-img.d.ts +3 -0
  29. package/dist/types/types/wallet-ui-img.d.ts.map +1 -0
  30. package/dist/types/types/wallet-ui-size.d.ts +2 -0
  31. package/dist/types/types/wallet-ui-size.d.ts.map +1 -0
  32. package/dist/types/types/wallet-ui-span.d.ts +3 -0
  33. package/dist/types/types/wallet-ui-span.d.ts.map +1 -0
  34. package/dist/types/types/wallet-ui-svg.d.ts +3 -0
  35. package/dist/types/types/wallet-ui-svg.d.ts.map +1 -0
  36. package/dist/types/use-base-dropdown.d.ts +9 -0
  37. package/dist/types/use-base-dropdown.d.ts.map +1 -0
  38. package/dist/types/use-base-modal.d.ts +9 -0
  39. package/dist/types/use-base-modal.d.ts.map +1 -0
  40. package/dist/types/use-wallet-ui-account.d.ts +2 -0
  41. package/dist/types/use-wallet-ui-account.d.ts.map +1 -0
  42. package/dist/types/use-wallet-ui-cluster.d.ts +2 -0
  43. package/dist/types/use-wallet-ui-cluster.d.ts.map +1 -0
  44. package/dist/types/use-wallet-ui-dropdown.d.ts +14 -0
  45. package/dist/types/use-wallet-ui-dropdown.d.ts.map +1 -0
  46. package/dist/types/use-wallet-ui-solana-client.d.ts +2 -0
  47. package/dist/types/use-wallet-ui-solana-client.d.ts.map +1 -0
  48. package/dist/types/use-wallet-ui-wallet.d.ts +10 -0
  49. package/dist/types/use-wallet-ui-wallet.d.ts.map +1 -0
  50. package/dist/types/use-wallet-ui-wallets.d.ts +2 -0
  51. package/dist/types/use-wallet-ui-wallets.d.ts.map +1 -0
  52. package/dist/types/use-wallet-ui.d.ts +2 -0
  53. package/dist/types/use-wallet-ui.d.ts.map +1 -0
  54. package/dist/types/{solana-wallet-provider.d.ts → wallet-ui-account-context-provider.d.ts} +5 -4
  55. package/dist/types/wallet-ui-account-context-provider.d.ts.map +1 -0
  56. package/dist/types/wallet-ui-account-context.d.ts +13 -0
  57. package/dist/types/wallet-ui-account-context.d.ts.map +1 -0
  58. package/dist/types/wallet-ui-button.d.ts +8 -0
  59. package/dist/types/wallet-ui-button.d.ts.map +1 -0
  60. package/dist/types/wallet-ui-cluster-context-provider.d.ts +4 -0
  61. package/dist/types/wallet-ui-cluster-context-provider.d.ts.map +1 -0
  62. package/dist/types/wallet-ui-cluster-context.d.ts +14 -0
  63. package/dist/types/wallet-ui-cluster-context.d.ts.map +1 -0
  64. package/dist/types/wallet-ui-cluster-dropdown.d.ts +9 -0
  65. package/dist/types/wallet-ui-cluster-dropdown.d.ts.map +1 -0
  66. package/dist/types/wallet-ui-context-provider.d.ts +4 -0
  67. package/dist/types/wallet-ui-context-provider.d.ts.map +1 -0
  68. package/dist/types/wallet-ui-context.d.ts +25 -0
  69. package/dist/types/wallet-ui-context.d.ts.map +1 -0
  70. package/dist/types/wallet-ui-dropdown.d.ts +8 -0
  71. package/dist/types/wallet-ui-dropdown.d.ts.map +1 -0
  72. package/dist/types/wallet-ui-icon-close.d.ts +4 -0
  73. package/dist/types/wallet-ui-icon-close.d.ts.map +1 -0
  74. package/dist/types/wallet-ui-icon-no-wallet.d.ts +4 -0
  75. package/dist/types/wallet-ui-icon-no-wallet.d.ts.map +1 -0
  76. package/dist/types/wallet-ui-icon.d.ts +10 -0
  77. package/dist/types/wallet-ui-icon.d.ts.map +1 -0
  78. package/dist/types/wallet-ui-label.d.ts +9 -0
  79. package/dist/types/wallet-ui-label.d.ts.map +1 -0
  80. package/dist/types/wallet-ui-list-button.d.ts +11 -0
  81. package/dist/types/wallet-ui-list-button.d.ts.map +1 -0
  82. package/dist/types/wallet-ui-list.d.ts +11 -0
  83. package/dist/types/wallet-ui-list.d.ts.map +1 -0
  84. package/dist/types/wallet-ui-modal-trigger.d.ts +9 -0
  85. package/dist/types/wallet-ui-modal-trigger.d.ts.map +1 -0
  86. package/dist/types/wallet-ui-modal.d.ts +11 -0
  87. package/dist/types/wallet-ui-modal.d.ts.map +1 -0
  88. package/dist/types/wallet-ui-solana-client-context-provider.d.ts +4 -0
  89. package/dist/types/wallet-ui-solana-client-context-provider.d.ts.map +1 -0
  90. package/dist/types/wallet-ui-solana-client-context.d.ts +8 -0
  91. package/dist/types/wallet-ui-solana-client-context.d.ts.map +1 -0
  92. package/dist/types/wallet-ui.d.ts +15 -0
  93. package/dist/types/wallet-ui.d.ts.map +1 -0
  94. package/package.json +6 -3
  95. package/dist/types/solana-client-context.d.ts +0 -3
  96. package/dist/types/solana-client-context.d.ts.map +0 -1
  97. package/dist/types/solana-client-provider.d.ts +0 -7
  98. package/dist/types/solana-client-provider.d.ts.map +0 -1
  99. package/dist/types/solana-cluster-context.d.ts +0 -17
  100. package/dist/types/solana-cluster-context.d.ts.map +0 -1
  101. package/dist/types/solana-cluster-provider.d.ts +0 -7
  102. package/dist/types/solana-cluster-provider.d.ts.map +0 -1
  103. package/dist/types/solana-provider.d.ts +0 -7
  104. package/dist/types/solana-provider.d.ts.map +0 -1
  105. package/dist/types/solana-wallet-context.d.ts +0 -7
  106. package/dist/types/solana-wallet-context.d.ts.map +0 -1
  107. package/dist/types/solana-wallet-provider.d.ts.map +0 -1
  108. package/dist/types/solana-wallet-ui-button.d.ts +0 -3
  109. package/dist/types/solana-wallet-ui-button.d.ts.map +0 -1
  110. package/dist/types/solana-wallet-ui-context.d.ts +0 -19
  111. package/dist/types/solana-wallet-ui-context.d.ts.map +0 -1
  112. package/dist/types/solana-wallet-ui-dialog-trigger.d.ts +0 -4
  113. package/dist/types/solana-wallet-ui-dialog-trigger.d.ts.map +0 -1
  114. package/dist/types/solana-wallet-ui-dialog.d.ts +0 -12
  115. package/dist/types/solana-wallet-ui-dialog.d.ts.map +0 -1
  116. package/dist/types/solana-wallet-ui-dropdown.d.ts +0 -11
  117. package/dist/types/solana-wallet-ui-dropdown.d.ts.map +0 -1
  118. package/dist/types/solana-wallet-ui-provider.d.ts +0 -5
  119. package/dist/types/solana-wallet-ui-provider.d.ts.map +0 -1
@@ -1,12 +1,15 @@
1
1
  'use strict';
2
2
 
3
- var React10 = require('react');
4
- var gill = require('gill');
5
- var react = require('@wallet-standard/react');
6
- var dialog = require('@zag-js/dialog');
3
+ var React19 = require('react');
4
+ var react$1 = require('@wallet-standard/react');
5
+ var react$2 = require('@zag-js/react');
7
6
  var menu = require('@zag-js/menu');
8
- var react$1 = require('@zag-js/react');
9
- var core = require('@wallet-ui/core');
7
+ var dialog = require('@zag-js/dialog');
8
+ var core$1 = require('@wallet-ui/core');
9
+ var gill = require('gill');
10
+ var react = require('@solana/react');
11
+ var walletStandardFeatures = require('@solana/wallet-standard-features');
12
+ var core = require('@wallet-standard/core');
10
13
 
11
14
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
12
15
 
@@ -28,119 +31,349 @@ function _interopNamespace(e) {
28
31
  return Object.freeze(n);
29
32
  }
30
33
 
31
- var React10__default = /*#__PURE__*/_interopDefault(React10);
32
- var dialog__namespace = /*#__PURE__*/_interopNamespace(dialog);
34
+ var React19__default = /*#__PURE__*/_interopDefault(React19);
33
35
  var menu__namespace = /*#__PURE__*/_interopNamespace(menu);
36
+ var dialog__namespace = /*#__PURE__*/_interopNamespace(dialog);
34
37
 
35
- // src/solana-client-context.tsx
36
- var SolanaClientContext = React10.createContext({});
37
- function useSolanaClient() {
38
- return React10.useContext(SolanaClientContext);
38
+ // src/base-button.tsx
39
+ function BaseButton({ className, label, leftSection, onClick, rightSection, size, ...props }) {
40
+ return /* @__PURE__ */ React19__default.default.createElement("button", { className: `wallet-ui-base-button ${size ?? "md"} ${className ?? ""}`, onClick, ...props }, leftSection ? /* @__PURE__ */ React19__default.default.createElement("span", { className: "wallet-ui-base-button-left-section" }, leftSection) : null, label, rightSection ? /* @__PURE__ */ React19__default.default.createElement("span", { className: "wallet-ui-base-button-right-section" }, rightSection) : null);
39
41
  }
40
- function SolanaClientProvider({
41
- children,
42
- urlOrMoniker
43
- }) {
44
- const value = React10.useMemo(() => gill.createSolanaClient({ urlOrMoniker }), [urlOrMoniker]);
45
- return /* @__PURE__ */ React10__default.default.createElement(SolanaClientContext.Provider, { value }, children);
42
+ var WalletUiContext = React19__default.default.createContext({});
43
+
44
+ // src/use-wallet-ui.tsx
45
+ function useWalletUi() {
46
+ return React19__default.default.useContext(WalletUiContext);
46
47
  }
47
- var SolanaClusterContext = React10.createContext({});
48
- function useSolanaCluster() {
49
- return React10.useContext(SolanaClusterContext);
48
+ var WalletUiAccountContext = React19.createContext({});
49
+
50
+ // src/use-wallet-ui-account.tsx
51
+ function useWalletUiAccount() {
52
+ return React19.useContext(WalletUiAccountContext);
50
53
  }
51
- function useLocalStorage(key, initialValue) {
52
- const [storedValue, setStoredValue] = React10.useState(() => {
53
- try {
54
- if (typeof window === "undefined") {
55
- return initialValue;
56
- }
57
- const item = window.localStorage.getItem(key);
58
- if (key.includes("wallet") || key.includes("account")) {
59
- return initialValue;
54
+
55
+ // src/use-wallet-ui-wallet.tsx
56
+ function useWalletUiWallet({ wallet }) {
57
+ const { connect: connectAccount } = useWalletUi();
58
+ const { setAccount } = useWalletUiAccount();
59
+ const [isConnecting, connect3] = react$1.useConnect(wallet);
60
+ const [isDisconnecting, disconnect] = react$1.useDisconnect(wallet);
61
+ React19.useEffect(() => {
62
+ }, [isDisconnecting]);
63
+ return {
64
+ connect: async () => {
65
+ const connectedAccount = await connect3();
66
+ console.log("connectedAccount", connectedAccount);
67
+ if (!connectedAccount.length) {
68
+ console.log("connect, no accounts");
69
+ return connectedAccount;
60
70
  }
61
- return item ? JSON.parse(item) : initialValue;
62
- } catch (error) {
63
- console.warn(`Error reading localStorage key "${key}":`, error);
64
- return initialValue;
71
+ const first = connectedAccount[0];
72
+ console.log("connect, setting first account => ", first);
73
+ setAccount(first);
74
+ connectAccount(first);
75
+ return connectedAccount;
76
+ },
77
+ disconnect,
78
+ isConnecting,
79
+ isDisconnecting
80
+ };
81
+ }
82
+
83
+ // src/base-dropdown.tsx
84
+ var BaseDropdownItemType = /* @__PURE__ */ ((BaseDropdownItemType2) => {
85
+ BaseDropdownItemType2["Item"] = "Item";
86
+ BaseDropdownItemType2["WalletConnect"] = "WalletConnect";
87
+ BaseDropdownItemType2["WalletCopy"] = "WalletCopy";
88
+ BaseDropdownItemType2["WalletDisconnect"] = "WalletDisconnect";
89
+ BaseDropdownItemType2["WalletNeeded"] = "WalletNeeded";
90
+ return BaseDropdownItemType2;
91
+ })(BaseDropdownItemType || {});
92
+ function BaseDropdown({ buttonProps, dropdown, showIndicator, items }) {
93
+ const api = dropdown.api;
94
+ const trigger = /* @__PURE__ */ React19__default.default.createElement(
95
+ BaseButton,
96
+ {
97
+ ...api.getTriggerProps(),
98
+ className: `wallet-ui-base-dropdown-trigger`,
99
+ "data-part": "trigger",
100
+ rightSection: showIndicator ? /* @__PURE__ */ React19__default.default.createElement("span", { className: "wallet-actions" }, /* @__PURE__ */ React19__default.default.createElement("span", { ...api.getIndicatorProps(), className: "indicator" }, /* @__PURE__ */ React19__default.default.createElement(BaseDropdownChevronDown, { size: 12 }))) : null,
101
+ ...buttonProps
65
102
  }
66
- });
67
- const setValue = React10.useCallback(
68
- (value) => {
69
- try {
70
- const valueToStore = value instanceof Function ? value(storedValue) : value;
71
- setStoredValue(valueToStore);
72
- if (typeof window !== "undefined") {
73
- if (valueToStore === void 0 || valueToStore === null) {
74
- window.localStorage.removeItem(key);
75
- } else {
76
- window.localStorage.setItem(key, JSON.stringify(valueToStore));
103
+ );
104
+ return /* @__PURE__ */ React19__default.default.createElement("div", { className: "wallet-ui-base-dropdown" }, trigger, /* @__PURE__ */ React19__default.default.createElement("div", { ...api.getPositionerProps(), className: "wallet-positioner" }, /* @__PURE__ */ React19__default.default.createElement("div", { ...api.getContentProps(), className: "wallet-ui-base-dropdown-list", "data-part": "content" }, items.map((item) => {
105
+ return /* @__PURE__ */ React19__default.default.createElement(
106
+ BaseDropdownItem,
107
+ {
108
+ ...api.getItemProps({ value: item.value }),
109
+ key: item.value,
110
+ item,
111
+ afterClick: () => {
112
+ if (item.disabled) {
113
+ return;
114
+ }
115
+ if (item.closeMenu !== false) {
116
+ dropdown.close();
77
117
  }
78
118
  }
79
- } catch (error) {
80
- console.warn(`Error setting localStorage key "${key}":`, error);
81
119
  }
82
- },
83
- [key, storedValue]
84
- );
85
- return [storedValue, setValue];
120
+ );
121
+ }))));
86
122
  }
87
-
88
- // src/solana-cluster-provider.tsx
89
- var STORAGE_KEY = "placeholder:selected-cluster";
90
- function SolanaClusterProvider({ clusters, children }) {
91
- const [clusterId, setClusterId] = useLocalStorage(STORAGE_KEY, "solana:devnet");
92
- if (!clusters.length) {
93
- throw new Error("No clusters provided");
123
+ function BaseDropdownItem({ afterClick, item }) {
124
+ if (!item.wallet) {
125
+ return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemRender, { afterClick, item });
94
126
  }
95
- const cluster = React10.useMemo(() => {
96
- for (const cluster2 of clusters) {
97
- if (cluster2.id === clusterId) {
98
- return cluster2;
127
+ switch (item.type) {
128
+ case "Item" /* Item */:
129
+ return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemRender, { afterClick, item });
130
+ case "WalletConnect" /* WalletConnect */:
131
+ return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemWalletConnect, { afterClick, item, wallet: item.wallet });
132
+ case "WalletCopy" /* WalletCopy */:
133
+ return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemRender, { afterClick, item });
134
+ case "WalletDisconnect" /* WalletDisconnect */:
135
+ return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemWalletDisconnect, { afterClick, item, wallet: item.wallet });
136
+ }
137
+ }
138
+ function BaseDropdownItemWalletConnect({
139
+ afterClick,
140
+ item,
141
+ wallet
142
+ }) {
143
+ const { connect: connect3 } = useWalletUiWallet({ wallet });
144
+ return /* @__PURE__ */ React19__default.default.createElement(
145
+ BaseDropdownItemRender,
146
+ {
147
+ afterClick,
148
+ item: {
149
+ ...item,
150
+ handler: async () => {
151
+ await connect3();
152
+ return await item.handler();
153
+ }
99
154
  }
100
155
  }
101
- return clusters[0];
102
- }, [clusterId, clusters]);
103
- return /* @__PURE__ */ React10__default.default.createElement(
104
- SolanaClusterContext.Provider,
156
+ );
157
+ }
158
+ function BaseDropdownItemWalletDisconnect({
159
+ afterClick,
160
+ item,
161
+ wallet
162
+ }) {
163
+ const { disconnect } = useWalletUiWallet({ wallet });
164
+ return /* @__PURE__ */ React19__default.default.createElement(
165
+ BaseDropdownItemRender,
105
166
  {
106
- value: React10.useMemo(
107
- () => ({
108
- cluster,
109
- clusters,
110
- setCluster(cluster2) {
111
- localStorage.setItem(STORAGE_KEY, cluster2);
112
- setClusterId(cluster2);
113
- }
114
- }),
115
- [cluster, clusters]
116
- )
117
- },
118
- children
167
+ afterClick,
168
+ item: {
169
+ ...item,
170
+ handler: async () => {
171
+ await disconnect();
172
+ return await item.handler();
173
+ }
174
+ }
175
+ }
119
176
  );
120
177
  }
121
- var SolanaWalletContext = React10.createContext([
122
- void 0,
123
- function setSelectedWalletAccount() {
178
+ function BaseDropdownItemRender({ afterClick, item }) {
179
+ function onClick() {
180
+ if (item.disabled) {
181
+ return;
182
+ }
183
+ void item.handler().then(() => {
184
+ afterClick();
185
+ });
124
186
  }
125
- ]);
126
- function useSolanaWallet() {
127
- return React10.useContext(SolanaWalletContext);
187
+ return /* @__PURE__ */ React19__default.default.createElement("div", { className: "wallet-ui-base-dropdown-item", "data-part": "item", onClick }, item.leftSection ? /* @__PURE__ */ React19__default.default.createElement("span", { className: "wallet-ui-base-dropdown-item-left-section" }, item.leftSection) : null, item.label, item.rightSection ? /* @__PURE__ */ React19__default.default.createElement("span", { className: "wallet-ui-base-dropdown-item-right-section" }, item.rightSection) : null);
188
+ }
189
+ function BaseDropdownChevronDown(props) {
190
+ return /* @__PURE__ */ React19__default.default.createElement(
191
+ "svg",
192
+ {
193
+ xmlns: "http://www.w3.org/2000/svg",
194
+ width: props.size ?? 24,
195
+ height: props.size ?? 24,
196
+ viewBox: "0 0 24 24",
197
+ fill: "none",
198
+ stroke: "currentColor",
199
+ strokeWidth: "2",
200
+ strokeLinecap: "round",
201
+ strokeLinejoin: "round",
202
+ ...props
203
+ },
204
+ /* @__PURE__ */ React19__default.default.createElement("path", { d: "m6 9 6 6 6-6" })
205
+ );
206
+ }
207
+ function BaseSvg({ sizes = {}, ...props }) {
208
+ const size = props.size ? sizes[props.size] : 12;
209
+ return /* @__PURE__ */ React19__default.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, ...props }, props.children);
210
+ }
211
+
212
+ // src/wallet-ui-icon-close.tsx
213
+ function WalletUiIconClose({ size = "md", ...props }) {
214
+ return /* @__PURE__ */ React19__default.default.createElement(
215
+ BaseSvg,
216
+ {
217
+ size,
218
+ sizes: { lg: 16, md: 12, sm: 8 },
219
+ fill: "none",
220
+ stroke: "currentColor",
221
+ strokeWidth: "3",
222
+ viewBox: "0 0 14 14",
223
+ ...props
224
+ },
225
+ /* @__PURE__ */ React19__default.default.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" })
226
+ );
227
+ }
228
+
229
+ // src/base-modal.tsx
230
+ function BaseModal({ modal, buttonLabel, buttonProps = {}, size = "md", ...props }) {
231
+ const api = modal.api;
232
+ return /* @__PURE__ */ React19__default.default.createElement(React19__default.default.Fragment, null, buttonLabel ? /* @__PURE__ */ React19__default.default.createElement(BaseButton, { label: buttonLabel, size, ...buttonProps, ...api.getTriggerProps() }) : null, api.open && /* @__PURE__ */ React19__default.default.createElement(react$2.Portal, null, /* @__PURE__ */ React19__default.default.createElement("div", { ...api.getBackdropProps() }), /* @__PURE__ */ React19__default.default.createElement("div", { ...api.getPositionerProps() }, /* @__PURE__ */ React19__default.default.createElement("div", { ...api.getContentProps(), className: size }, /* @__PURE__ */ React19__default.default.createElement("header", null, /* @__PURE__ */ React19__default.default.createElement("button", { ...api.getCloseTriggerProps() }, /* @__PURE__ */ React19__default.default.createElement(WalletUiIconClose, { size }))), props.description ? /* @__PURE__ */ React19__default.default.createElement("p", { ...api.getDescriptionProps() }, props.description) : null, /* @__PURE__ */ React19__default.default.createElement("main", null, props.children)))));
233
+ }
234
+ function useBaseDropdown() {
235
+ const service = react$2.useMachine(menu__namespace.machine, { id: React19.useId() });
236
+ const api = menu__namespace.connect(service, react$2.normalizeProps);
237
+ return {
238
+ api,
239
+ close: () => service.send({ type: "CLOSE" }),
240
+ open: () => service.send({ type: "OPEN" })
241
+ };
242
+ }
243
+ function useBaseModal() {
244
+ const service = react$2.useMachine(dialog__namespace.machine, { id: React19.useId(), modal: true });
245
+ const api = dialog__namespace.connect(service, react$2.normalizeProps);
246
+ return {
247
+ api,
248
+ close: () => service.send({ type: "CLOSE" }),
249
+ open: () => service.send({ type: "OPEN" })
250
+ };
251
+ }
252
+ var WalletUiClusterContext = React19.createContext({});
253
+
254
+ // src/use-wallet-ui-cluster.tsx
255
+ function useWalletUiCluster() {
256
+ return React19.useContext(WalletUiClusterContext);
128
257
  }
129
- function useSolanaWalletAddress() {
130
- const [wallet] = useSolanaWallet();
131
- if (!wallet?.address) {
258
+ function WalletUiIcon({ className, size, wallet, ...props }) {
259
+ if (!wallet) {
132
260
  return null;
133
261
  }
134
- return gill.address(wallet.address);
262
+ return /* @__PURE__ */ React19__default.default.createElement(
263
+ "img",
264
+ {
265
+ src: wallet.icon,
266
+ alt: wallet.name,
267
+ className: `wallet-ui-list-icon ${size ?? "md"} ${className ?? ""}`,
268
+ ...props
269
+ }
270
+ );
271
+ }
272
+
273
+ // src/use-wallet-ui-dropdown.tsx
274
+ function getDropdownItemsWallets({
275
+ wallets,
276
+ connect: connect3,
277
+ size
278
+ }) {
279
+ return wallets.length ? wallets.map((wallet) => ({
280
+ handler: async () => {
281
+ const account = wallet.accounts.length > 0 ? wallet.accounts[0] : void 0;
282
+ if (!account) {
283
+ return;
284
+ }
285
+ connect3(account);
286
+ await Promise.resolve();
287
+ },
288
+ label: wallet.name,
289
+ leftSection: /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { wallet, size }),
290
+ type: "WalletConnect" /* WalletConnect */,
291
+ value: wallet.name,
292
+ wallet
293
+ })) : [
294
+ {
295
+ handler: async () => {
296
+ window.open("https://solana.com/solana-wallets", "_blank");
297
+ await Promise.resolve();
298
+ },
299
+ label: "You'll need a wallet on Solana to continue",
300
+ type: "WalletNeeded" /* WalletNeeded */,
301
+ value: "no-wallets"
302
+ }
303
+ ];
304
+ }
305
+ function useWalletUiDropdown({ size = "md" } = {}) {
306
+ const dropdown = useBaseDropdown();
307
+ const { account, connect: connect3, copy, disconnect, connected, wallet, wallets } = useWalletUi();
308
+ const itemsWallets = React19.useMemo(() => {
309
+ return getDropdownItemsWallets({ connect: connect3, size, wallets });
310
+ }, [wallets, size, connect3]);
311
+ const itemsConnected = React19.useMemo(
312
+ () => [
313
+ {
314
+ handler: async () => {
315
+ copy();
316
+ void await Promise.resolve();
317
+ },
318
+ label: "Copy Address",
319
+ type: "WalletCopy" /* WalletCopy */,
320
+ value: "copy"
321
+ },
322
+ {
323
+ handler: async () => {
324
+ disconnect();
325
+ dropdown.close();
326
+ await Promise.resolve();
327
+ },
328
+ label: "Disconnect",
329
+ type: "WalletDisconnect" /* WalletDisconnect */,
330
+ value: "disconnect"
331
+ },
332
+ ...itemsWallets
333
+ ],
334
+ [connect3, copy, disconnect, dropdown, size, wallets]
335
+ );
336
+ const items = React19.useMemo(() => {
337
+ return connected ? itemsConnected : itemsWallets;
338
+ }, [connected, itemsConnected, itemsWallets]);
339
+ const buttonProps = React19.useMemo(() => {
340
+ return {
341
+ label: connected ? (account ? ellipsify(account.address) : wallet?.name) ?? "Connected" : "Select Wallet",
342
+ leftSection: connected ? /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { size, wallet }) : void 0
343
+ };
344
+ }, [account, connected, size, wallet]);
345
+ return {
346
+ buttonProps,
347
+ connected,
348
+ dropdown,
349
+ items
350
+ };
135
351
  }
352
+ function ellipsify(str = "", len = 4, delimiter = "..") {
353
+ const strLen = str.length;
354
+ const limit = len * 2 + delimiter.length;
355
+ return strLen >= limit ? str.substring(0, len) + delimiter + str.substring(strLen - len, strLen) : str;
356
+ }
357
+ var WalletUiSolanaClientContext = React19.createContext({});
136
358
 
137
- // src/solana-wallet-provider.tsx
138
- var STORAGE_KEY2 = "placeholder:selected-wallet-and-address";
359
+ // src/use-wallet-ui-solana-client.tsx
360
+ function useWalletUiSolanaClient() {
361
+ return React19.useContext(WalletUiSolanaClientContext);
362
+ }
363
+ function useWalletUiWallets() {
364
+ const readonlyWallets = react$1.useWallets();
365
+ return React19.useMemo(
366
+ () => readonlyWallets.filter((wallet) => wallet.chains.some((i) => i.startsWith("solana:"))).sort((a, b) => a.name.localeCompare(b.name)),
367
+ [readonlyWallets]
368
+ );
369
+ }
370
+ var STORAGE_KEY = "wallet-ui:selected-wallet-account";
139
371
  var wasSetterInvoked = false;
140
- function getSavedWalletAccount(wallets, savedWalletNameAndAddress) {
372
+ function getSavedWalletAccount(wallets, storageKey) {
141
373
  if (wasSetterInvoked) {
142
374
  return;
143
375
  }
376
+ const savedWalletNameAndAddress = localStorage.getItem(storageKey);
144
377
  if (!savedWalletNameAndAddress || typeof savedWalletNameAndAddress !== "string") {
145
378
  return;
146
379
  }
@@ -158,260 +391,438 @@ function getSavedWalletAccount(wallets, savedWalletNameAndAddress) {
158
391
  }
159
392
  }
160
393
  }
161
- function SolanaWalletProvider({ children }) {
162
- const [storedKey, setStoredKey] = useLocalStorage(STORAGE_KEY2, null);
163
- const wallets = react.useWallets();
164
- const [selectedWalletAccount, setSelectedWalletAccountInternal] = React10.useState(
165
- () => getSavedWalletAccount(wallets, storedKey)
394
+ function WalletUiAccountContextProvider({
395
+ children,
396
+ storageKey = STORAGE_KEY
397
+ }) {
398
+ const { cluster } = useWalletUiCluster();
399
+ const wallets = react$1.useWallets();
400
+ const [account, setAccountInternal] = React19.useState(
401
+ () => getSavedWalletAccount(wallets, storageKey)
166
402
  );
167
- const setSelectedWalletAccount2 = (setStateAction) => {
168
- setSelectedWalletAccountInternal((prevSelectedWalletAccount) => {
403
+ function setAccount(setStateAction) {
404
+ setAccountInternal((prevAccount) => {
169
405
  wasSetterInvoked = true;
170
- const nextWalletAccount = typeof setStateAction === "function" ? setStateAction(prevSelectedWalletAccount) : setStateAction;
171
- const accountKey = nextWalletAccount ? react.getUiWalletAccountStorageKey(nextWalletAccount) : void 0;
406
+ const nextWalletAccount = typeof setStateAction === "function" ? setStateAction(prevAccount) : setStateAction;
407
+ const accountKey = nextWalletAccount ? react$1.getUiWalletAccountStorageKey(nextWalletAccount) : void 0;
172
408
  if (accountKey) {
173
- setStoredKey(accountKey);
409
+ localStorage.setItem(storageKey, accountKey);
174
410
  } else {
175
- setStoredKey(null);
411
+ localStorage.removeItem(storageKey);
176
412
  }
177
413
  return nextWalletAccount;
178
414
  });
179
- };
180
- React10.useEffect(() => {
181
- const savedWalletAccount = getSavedWalletAccount(wallets, storedKey);
415
+ }
416
+ React19.useEffect(() => {
417
+ const savedWalletAccount = getSavedWalletAccount(wallets, storageKey);
182
418
  if (savedWalletAccount) {
183
- setSelectedWalletAccountInternal(savedWalletAccount);
419
+ setAccountInternal(savedWalletAccount);
184
420
  }
185
421
  }, [wallets]);
186
- const walletAccount = React10.useMemo(() => {
187
- if (selectedWalletAccount) {
422
+ const walletAccount = React19.useMemo(() => {
423
+ if (account) {
188
424
  for (const uiWallet of wallets) {
189
425
  for (const uiWalletAccount of uiWallet.accounts) {
190
- if (react.uiWalletAccountsAreSame(selectedWalletAccount, uiWalletAccount)) {
426
+ if (react$1.uiWalletAccountsAreSame(account, uiWalletAccount)) {
191
427
  return uiWalletAccount;
192
428
  }
193
429
  }
194
- if (react.uiWalletAccountBelongsToUiWallet(selectedWalletAccount, uiWallet) && uiWallet.accounts[0]) {
430
+ if (react$1.uiWalletAccountBelongsToUiWallet(account, uiWallet) && uiWallet.accounts[0]) {
195
431
  return uiWallet.accounts[0];
196
432
  }
197
433
  }
198
434
  }
199
- }, [selectedWalletAccount, wallets]);
200
- React10.useEffect(() => {
201
- if (selectedWalletAccount && !walletAccount) {
202
- setSelectedWalletAccountInternal(void 0);
435
+ }, [account, wallets]);
436
+ React19.useEffect(() => {
437
+ if (account && !walletAccount) {
438
+ setAccountInternal(void 0);
439
+ }
440
+ }, [account, walletAccount]);
441
+ const wallet = React19.useMemo(() => {
442
+ if (!walletAccount) {
443
+ return void 0;
203
444
  }
204
- }, [selectedWalletAccount, walletAccount]);
205
- return /* @__PURE__ */ React10__default.default.createElement(SolanaWalletContext.Provider, { value: React10.useMemo(() => [walletAccount, setSelectedWalletAccount2], [walletAccount]) }, children);
445
+ for (const uiWallet of wallets) {
446
+ for (const uiWalletAccount of uiWallet.accounts) {
447
+ if (react$1.uiWalletAccountsAreSame(walletAccount, uiWalletAccount)) {
448
+ return uiWallet;
449
+ }
450
+ }
451
+ if (react$1.uiWalletAccountBelongsToUiWallet(walletAccount, uiWallet) && uiWallet.accounts[0]) {
452
+ return uiWallet;
453
+ }
454
+ }
455
+ }, [walletAccount, wallets]);
456
+ const accountKeys = React19.useMemo(() => {
457
+ if (!account) {
458
+ return [];
459
+ }
460
+ return [cluster.id, react$1.getUiWalletAccountStorageKey(account)].filter(Boolean);
461
+ }, [account]);
462
+ return /* @__PURE__ */ React19__default.default.createElement(
463
+ WalletUiAccountContext.Provider,
464
+ {
465
+ value: React19.useMemo(
466
+ () => ({
467
+ account: walletAccount,
468
+ accountKeys,
469
+ setAccount,
470
+ wallet
471
+ }),
472
+ [walletAccount, wallet, accountKeys]
473
+ )
474
+ },
475
+ children
476
+ );
206
477
  }
207
- var SolanaWalletUiContext = React10__default.default.createContext(
208
- {}
209
- );
210
- function useSolanaWalletUi() {
211
- return React10__default.default.useContext(SolanaWalletUiContext);
478
+ function useLocalStorage(key, initialValue) {
479
+ const [storedValue, setStoredValue] = React19.useState(() => {
480
+ try {
481
+ if (typeof window === "undefined") {
482
+ return initialValue;
483
+ }
484
+ const item = window.localStorage.getItem(key);
485
+ if (key.includes("wallet") || key.includes("account")) {
486
+ return initialValue;
487
+ }
488
+ return item ? JSON.parse(item) : initialValue;
489
+ } catch (error) {
490
+ console.warn(`Error reading localStorage key "${key}":`, error);
491
+ return initialValue;
492
+ }
493
+ });
494
+ const setValue = React19.useCallback(
495
+ (value) => {
496
+ try {
497
+ const valueToStore = value instanceof Function ? value(storedValue) : value;
498
+ setStoredValue(valueToStore);
499
+ if (typeof window !== "undefined") {
500
+ if (valueToStore === void 0 || valueToStore === null) {
501
+ window.localStorage.removeItem(key);
502
+ } else {
503
+ window.localStorage.setItem(key, JSON.stringify(valueToStore));
504
+ }
505
+ }
506
+ } catch (error) {
507
+ console.warn(`Error setting localStorage key "${key}":`, error);
508
+ }
509
+ },
510
+ [key, storedValue]
511
+ );
512
+ return [storedValue, setValue];
212
513
  }
213
514
 
214
- // src/solana-wallet-ui-provider.tsx
215
- function SolanaWalletUiProvider(props) {
216
- const wallets = react.useWallets();
217
- const [walletAccount, setWalletAccount] = useSolanaWallet();
218
- const [wallet, setWallet] = React10.useState(void 0);
219
- const dialogService = react$1.useMachine(dialog__namespace.machine, { id: React10.useId(), modal: true });
220
- const dialogApi = dialog__namespace.connect(dialogService, react$1.normalizeProps);
221
- const menuService = react$1.useMachine(menu__namespace.machine, { id: React10.useId() });
222
- const menuApi = menu__namespace.connect(menuService, react$1.normalizeProps);
223
- const [connected, setConnected] = React10.useState(false);
224
- function change() {
225
- menuService.send({ type: "CLOSE" });
226
- dialogService.send({ type: "OPEN" });
227
- }
228
- function connectAccount(wallet2, account) {
229
- console.log("connectAccount", account);
230
- setWalletAccount(account);
231
- setWallet(wallet2);
232
- setConnected(true);
233
- dialogService.send({ type: "CLOSE" });
515
+ // src/wallet-ui-cluster-context-provider.tsx
516
+ function WalletUiClusterContextProvider({
517
+ clusters,
518
+ render,
519
+ storageKey = "__wallet-ui:selected-cluster"
520
+ }) {
521
+ const [clusterId, setClusterId] = useLocalStorage(storageKey, "solana:devnet");
522
+ if (!clusters.length) {
523
+ throw new Error("No clusters provided");
234
524
  }
235
- async function copy() {
236
- if (!walletAccount) {
237
- return;
525
+ const cluster = React19.useMemo(() => {
526
+ for (const cluster2 of clusters) {
527
+ if (cluster2.id === clusterId) {
528
+ return cluster2;
529
+ }
238
530
  }
239
- await navigator.clipboard.writeText(walletAccount.address);
240
- menuService.send({ type: "CLOSE" });
241
- dialogService.send({ type: "CLOSE" });
531
+ return clusters[0];
532
+ }, [clusterId, clusters]);
533
+ const value = {
534
+ cluster,
535
+ clusters,
536
+ setCluster: (cluster2) => {
537
+ localStorage.setItem(storageKey, cluster2);
538
+ setClusterId(cluster2);
539
+ }
540
+ };
541
+ return /* @__PURE__ */ React19__default.default.createElement(WalletUiClusterContext.Provider, { value }, render(value));
542
+ }
543
+ function WalletUiContextProvider({ children, size = "md" }) {
544
+ const { account, setAccount, wallet } = useWalletUiAccount();
545
+ const wallets = useWalletUiWallets();
546
+ const client = useWalletUiSolanaClient();
547
+ const walletHasAccounts = Boolean(wallet && wallet?.accounts.length > 0);
548
+ function connect3(account2) {
549
+ setAccount(account2);
242
550
  }
243
551
  function disconnect() {
244
- setConnected(false);
245
- setWalletAccount(void 0);
246
- dialogService.send({ type: "CLOSE" });
247
- menuService.send({ type: "CLOSE" });
552
+ setAccount(void 0);
553
+ }
554
+ function copy() {
555
+ if (!account) {
556
+ return;
557
+ }
558
+ core$1.handleCopyText(account.address);
248
559
  }
249
560
  const value = {
250
- change,
251
- connectAccount,
252
- connected: connected && walletAccount !== void 0,
561
+ account,
562
+ client,
563
+ connect: connect3,
564
+ connected: walletHasAccounts,
253
565
  copy,
254
- dialogApi,
255
566
  disconnect,
256
- menuApi,
567
+ size,
257
568
  wallet,
258
- walletAccount,
259
- wallets: React10.useMemo(() => wallets.filter((wallet2) => wallet2.chains.some((i) => i.startsWith("solana:"))), [wallets])
569
+ wallets
260
570
  };
261
- return /* @__PURE__ */ React10__default.default.createElement(SolanaWalletUiContext.Provider, { value }, props.children);
571
+ return /* @__PURE__ */ React19__default.default.createElement(WalletUiContext.Provider, { value }, children);
262
572
  }
263
-
264
- // src/solana-provider.tsx
265
- function SolanaProvider({ clusters, children }) {
266
- return /* @__PURE__ */ React10__default.default.createElement(SolanaClusterProvider, { clusters }, /* @__PURE__ */ React10__default.default.createElement(SolanaClientProviderLoader, null, /* @__PURE__ */ React10__default.default.createElement(SolanaWalletProvider, null, /* @__PURE__ */ React10__default.default.createElement(SolanaWalletUiProvider, null, children))));
267
- }
268
- function SolanaClientProviderLoader({ children }) {
269
- const { cluster } = useSolanaCluster();
270
- return /* @__PURE__ */ React10__default.default.createElement(SolanaClientProvider, { urlOrMoniker: cluster.urlOrMoniker }, children);
271
- }
272
- function SolanaWalletUiDialogTrigger(props) {
273
- const { dialogApi } = useSolanaWalletUi();
274
- console.log("SolanaWalletUiDialogTrigger", dialogApi);
275
- return /* @__PURE__ */ React10__default.default.createElement("button", { ...props, ...dialogApi.getTriggerProps() }, "Select Wallet");
276
- }
277
- function SolanaWalletUiDropdown() {
278
- const { change, connected, copy, disconnect, menuApi: api, wallet } = useSolanaWalletUi();
279
- const menuItems = [
573
+ function WalletUiSolanaClientContextProvider({
574
+ children,
575
+ urlOrMoniker
576
+ }) {
577
+ return /* @__PURE__ */ React19__default.default.createElement(
578
+ WalletUiSolanaClientContext.Provider,
280
579
  {
281
- handler: copy,
282
- label: "Copy Address",
283
- value: "copy"
580
+ value: React19.useMemo(() => gill.createSolanaClient({ urlOrMoniker }), [urlOrMoniker])
284
581
  },
582
+ children
583
+ );
584
+ }
585
+
586
+ // src/wallet-ui.tsx
587
+ function createWalletUiConfig(props) {
588
+ return { ...props };
589
+ }
590
+ function WalletUi({
591
+ children,
592
+ config: { clusters, clusterStorageKey, selectedAccountStorageKey, ...config }
593
+ }) {
594
+ return /* @__PURE__ */ React19__default.default.createElement(React19__default.default.Fragment, null, /* @__PURE__ */ React19__default.default.createElement(
595
+ WalletUiClusterContextProvider,
285
596
  {
286
- handler: change,
287
- label: "Change Wallet",
288
- value: "change"
289
- },
597
+ clusters,
598
+ storageKey: clusterStorageKey,
599
+ render: ({ cluster }) => {
600
+ return /* @__PURE__ */ React19__default.default.createElement(WalletUiSolanaClientContextProvider, { urlOrMoniker: cluster.urlOrMoniker }, /* @__PURE__ */ React19__default.default.createElement(WalletUiAccountContextProvider, { storageKey: selectedAccountStorageKey }, /* @__PURE__ */ React19__default.default.createElement(WalletUiContextProvider, { ...config }, children)));
601
+ }
602
+ }
603
+ ));
604
+ }
605
+ function WalletUiButton({ ...props }) {
606
+ return /* @__PURE__ */ React19__default.default.createElement(BaseButton, { ...props, label: "CLICK" });
607
+ }
608
+ function WalletUiClusterDropdown({ buttonProps, size = "md", ...props }) {
609
+ const dropdown = useBaseDropdown();
610
+ const { cluster, clusters, setCluster } = useWalletUiCluster();
611
+ return /* @__PURE__ */ React19__default.default.createElement(
612
+ BaseDropdown,
290
613
  {
291
- handler: disconnect,
292
- label: "Disconnect",
293
- value: "disconnect"
614
+ buttonProps: { ...buttonProps, label: cluster.label, size },
615
+ items: clusters.map((cluster2) => ({
616
+ handler: async () => {
617
+ setCluster(cluster2.id);
618
+ await Promise.resolve();
619
+ },
620
+ label: cluster2.label,
621
+ type: "Item" /* Item */,
622
+ value: cluster2.id
623
+ })),
624
+ dropdown,
625
+ ...props
294
626
  }
295
- ];
296
- const trigger = /* @__PURE__ */ React10__default.default.createElement(
297
- AppMenuButton,
627
+ );
628
+ }
629
+ function WalletUiDropdown({ size = "md", ...props }) {
630
+ const { buttonProps, items, dropdown } = useWalletUiDropdown({ size });
631
+ return /* @__PURE__ */ React19__default.default.createElement(BaseDropdown, { ...props, buttonProps: { ...buttonProps, size }, items, dropdown });
632
+ }
633
+ function WalletUiIconNoWallet({ size, ...props }) {
634
+ return /* @__PURE__ */ React19__default.default.createElement(BaseSvg, { size, sizes: { lg: 125, md: 100, sm: 75 }, fill: "none", viewBox: "0 0 97 96", ...props }, /* @__PURE__ */ React19__default.default.createElement("circle", { cx: "48.5", cy: "48", r: "48", fill: "url(#paint0_linear_880_5115)", fillOpacity: "0.1" }), /* @__PURE__ */ React19__default.default.createElement(
635
+ "circle",
298
636
  {
299
- ...api.getTriggerProps(),
300
- className: `wallet-trigger ${connected ? "connected" : ""}`,
301
- "data-part": "trigger"
637
+ cx: "48.5",
638
+ cy: "48",
639
+ r: "47",
640
+ stroke: "url(#paint1_linear_880_5115)",
641
+ strokeOpacity: "0.4",
642
+ strokeWidth: "2"
643
+ }
644
+ ), /* @__PURE__ */ React19__default.default.createElement("g", { clipPath: "url(#clip0_880_5115)" }, /* @__PURE__ */ React19__default.default.createElement(
645
+ "path",
646
+ {
647
+ 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",
648
+ fill: "url(#paint2_linear_880_5115)"
649
+ }
650
+ ), /* @__PURE__ */ React19__default.default.createElement(
651
+ "path",
652
+ {
653
+ 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",
654
+ fill: "url(#paint3_linear_880_5115)"
655
+ }
656
+ )), /* @__PURE__ */ React19__default.default.createElement("defs", null, /* @__PURE__ */ React19__default.default.createElement(
657
+ "linearGradient",
658
+ {
659
+ id: "paint0_linear_880_5115",
660
+ x1: "3.41664",
661
+ y1: "98.0933",
662
+ x2: "103.05",
663
+ y2: "8.42498",
664
+ gradientUnits: "userSpaceOnUse"
302
665
  },
303
- connected ? wallet?.name : "Select Wallet",
304
- /* @__PURE__ */ React10__default.default.createElement("span", { className: "wallet-actions" }, /* @__PURE__ */ React10__default.default.createElement("span", { ...api.getIndicatorProps(), className: "indicator" }, "\u25BE"))
305
- );
306
- return /* @__PURE__ */ React10__default.default.createElement("div", { className: "wallet-menu" }, trigger, /* @__PURE__ */ React10__default.default.createElement("div", { ...api.getPositionerProps(), className: "wallet-positioner" }, /* @__PURE__ */ React10__default.default.createElement("ul", { ...api.getContentProps(), className: "wallet-content", "data-part": "content" }, menuItems.map((item) => /* @__PURE__ */ React10__default.default.createElement(
307
- "li",
666
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
667
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
668
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
669
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
670
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
671
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
672
+ ), /* @__PURE__ */ React19__default.default.createElement(
673
+ "linearGradient",
308
674
  {
309
- key: item.value,
310
- ...api.getItemProps({ value: item.value }),
311
- className: "wallet-item",
312
- "data-part": "item",
313
- onClick: () => {
314
- if (item.disabled) {
315
- return;
316
- }
317
- void item.handler();
318
- }
675
+ id: "paint1_linear_880_5115",
676
+ x1: "3.41664",
677
+ y1: "98.0933",
678
+ x2: "103.05",
679
+ y2: "8.42498",
680
+ gradientUnits: "userSpaceOnUse"
319
681
  },
320
- item.label
321
- )))));
322
- }
323
- function AppMenuButton(props) {
324
- return /* @__PURE__ */ React10__default.default.createElement("button", { ...props }, props.children);
325
- }
326
-
327
- // src/solana-wallet-ui-button.tsx
328
- function SolanaWalletUiButton() {
329
- const { connected } = useSolanaWalletUi();
330
- return connected ? /* @__PURE__ */ React10__default.default.createElement(SolanaWalletUiDropdown, null) : /* @__PURE__ */ React10__default.default.createElement(SolanaWalletUiDialogTrigger, null);
331
- }
332
- function SolanaWalletUiDialog({ description, title }) {
333
- const { dialogApi: api, connected, disconnect } = useSolanaWalletUi();
334
- if (!api) {
335
- console.log("no api");
336
- return null;
337
- }
338
- if (!api.open) {
339
- console.log("no api.open");
340
- return null;
341
- }
342
- return /* @__PURE__ */ React10__default.default.createElement(react$1.Portal, null, /* @__PURE__ */ React10__default.default.createElement("div", { className: "dialog", ...api.getBackdropProps() }), /* @__PURE__ */ React10__default.default.createElement("div", { className: "dialog", ...api.getPositionerProps() }, /* @__PURE__ */ React10__default.default.createElement("div", { className: "dialog", ...api.getContentProps() }, title ? /* @__PURE__ */ React10__default.default.createElement("h2", { className: "dialog", ...api.getTitleProps() }, title) : null, description ? /* @__PURE__ */ React10__default.default.createElement("p", { className: "dialog", ...api.getDescriptionProps() }, description) : null, /* @__PURE__ */ React10__default.default.createElement("div", { style: { marginTop: "32px" } }, /* @__PURE__ */ React10__default.default.createElement(SolanaWalletUiDialogList, null), connected ? /* @__PURE__ */ React10__default.default.createElement("button", { onClick: disconnect }, "Disconnect") : null), /* @__PURE__ */ React10__default.default.createElement("button", { className: "dialog", ...api.getCloseTriggerProps() }, "\xD7"))));
343
- }
344
- function SolanaWalletUiDialogList() {
345
- const { wallets } = useSolanaWalletUi();
346
- return /* @__PURE__ */ React10__default.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "16px" } }, wallets.map((item, index) => /* @__PURE__ */ React10__default.default.createElement(SolanaWalletUiDialogListItem, { key: `${item.name}-${index}`, wallet: item })));
347
- }
348
- function SolanaWalletUiDialogListItem({ wallet }) {
349
- const [isConnecting, connect3] = react.useConnect(wallet);
350
- const [isDisconnecting, disconnect] = react.useDisconnect(wallet);
351
- const { connectAccount, walletAccount } = useSolanaWalletUi();
352
- const accounts = wallet.accounts ?? [];
353
- const isConnected = wallet.accounts.length > 0;
354
- const isPending = isConnecting || isDisconnecting;
355
- if (isPending) {
356
- return /* @__PURE__ */ React10__default.default.createElement("div", null, "Pending...");
357
- }
358
- return /* @__PURE__ */ React10__default.default.createElement("div", { style: { display: "flex", flexDirection: "column", gap: "8px" } }, /* @__PURE__ */ React10__default.default.createElement("div", { style: { display: "flex", justifyContent: "space-between" } }, /* @__PURE__ */ React10__default.default.createElement("div", { style: { alignItems: "center", display: "flex", gap: "8px" } }, /* @__PURE__ */ React10__default.default.createElement("img", { src: wallet.icon, alt: wallet.name, style: { height: 32 } }), /* @__PURE__ */ React10__default.default.createElement("span", { style: { fontSize: "1rem", fontWeight: "500" } }, wallet.name)), isConnected ? /* @__PURE__ */ React10__default.default.createElement(
359
- "button",
682
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
683
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
684
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
685
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
686
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
687
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
688
+ ), /* @__PURE__ */ React19__default.default.createElement(
689
+ "linearGradient",
360
690
  {
361
- disabled: isPending,
362
- onClick: () => {
363
- void disconnect();
364
- }
691
+ id: "paint2_linear_880_5115",
692
+ x1: "25.9583",
693
+ y1: "68.7101",
694
+ x2: "67.2337",
695
+ y2: "23.7879",
696
+ gradientUnits: "userSpaceOnUse"
365
697
  },
366
- "Disconnect"
367
- ) : /* @__PURE__ */ React10__default.default.createElement(
368
- "button",
698
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
699
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
700
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
701
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
702
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
703
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
704
+ ), /* @__PURE__ */ React19__default.default.createElement(
705
+ "linearGradient",
369
706
  {
370
- disabled: isPending,
371
- onClick: () => {
372
- void connect3();
373
- }
707
+ id: "paint3_linear_880_5115",
708
+ x1: "58.3326",
709
+ y1: "49.4467",
710
+ x2: "61.0002",
711
+ y2: "45.4453",
712
+ gradientUnits: "userSpaceOnUse"
374
713
  },
375
- "Connect"
376
- )), accounts.map((item, index) => /* @__PURE__ */ React10__default.default.createElement("div", { key: `${item.address}-${index}` }, /* @__PURE__ */ React10__default.default.createElement(
714
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
715
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
716
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
717
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
718
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
719
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
720
+ ), /* @__PURE__ */ React19__default.default.createElement("clipPath", { id: "clip0_880_5115" }, /* @__PURE__ */ React19__default.default.createElement("rect", { width: "48", height: "48", fill: "white", transform: "translate(24.5 24)" }))));
721
+ }
722
+ function WalletUiLabel({ className, size, wallet, ...props }) {
723
+ if (!wallet) {
724
+ return null;
725
+ }
726
+ return /* @__PURE__ */ React19__default.default.createElement("span", { className: `wallet-ui-list-label ${size ?? "md"} ${className ?? ""}`, ...props }, wallet.name);
727
+ }
728
+ function WalletUiListButton({ className, select, size = "md", wallet, ...props }) {
729
+ const [pending, setPending] = React19__default.default.useState(false);
730
+ function handleSelect() {
731
+ if (!select) {
732
+ return;
733
+ }
734
+ setPending(true);
735
+ const account = wallet.accounts.length > 0 ? wallet.accounts[0] : void 0;
736
+ if (!account) {
737
+ return;
738
+ }
739
+ void select(account).finally(() => setPending(false));
740
+ }
741
+ return /* @__PURE__ */ React19__default.default.createElement(
377
742
  "button",
378
743
  {
379
- disabled: item.address === walletAccount?.address,
380
- onClick: () => {
381
- void connectAccount(wallet, item);
382
- }
744
+ disabled: pending,
745
+ className: `wallet-ui-list-button ${size} ${pending ? "wallet-ui-list-button-pending" : ""} ${className ?? ""}`,
746
+ onClick: handleSelect,
747
+ ...props
383
748
  },
384
- item.address
385
- ))));
749
+ /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { className: "wallet-ui-list-button-icon", wallet, size }),
750
+ /* @__PURE__ */ React19__default.default.createElement(WalletUiLabel, { className: "wallet-ui-list-button-label", wallet, size })
751
+ );
386
752
  }
387
753
 
388
- exports.AppMenuButton = AppMenuButton;
389
- exports.SolanaClientContext = SolanaClientContext;
390
- exports.SolanaClientProvider = SolanaClientProvider;
391
- exports.SolanaClusterContext = SolanaClusterContext;
392
- exports.SolanaClusterProvider = SolanaClusterProvider;
393
- exports.SolanaProvider = SolanaProvider;
394
- exports.SolanaWalletContext = SolanaWalletContext;
395
- exports.SolanaWalletProvider = SolanaWalletProvider;
396
- exports.SolanaWalletUiButton = SolanaWalletUiButton;
397
- exports.SolanaWalletUiContext = SolanaWalletUiContext;
398
- exports.SolanaWalletUiDialog = SolanaWalletUiDialog;
399
- exports.SolanaWalletUiDialogList = SolanaWalletUiDialogList;
400
- exports.SolanaWalletUiDialogListItem = SolanaWalletUiDialogListItem;
401
- exports.SolanaWalletUiDialogTrigger = SolanaWalletUiDialogTrigger;
402
- exports.SolanaWalletUiDropdown = SolanaWalletUiDropdown;
403
- exports.SolanaWalletUiProvider = SolanaWalletUiProvider;
404
- exports.useSolanaClient = useSolanaClient;
405
- exports.useSolanaCluster = useSolanaCluster;
406
- exports.useSolanaWallet = useSolanaWallet;
407
- exports.useSolanaWalletAddress = useSolanaWalletAddress;
408
- exports.useSolanaWalletUi = useSolanaWalletUi;
754
+ // src/wallet-ui-list.tsx
755
+ function WalletUiList({ className, select, size = "md", wallets, ...props }) {
756
+ return /* @__PURE__ */ React19__default.default.createElement("div", { className: `wallet-ui-list ${size} ${className ?? ""}`, ...props }, wallets.map((wallet) => /* @__PURE__ */ React19__default.default.createElement(WalletUiListButton, { key: wallet.name, select, size, wallet })));
757
+ }
758
+ function WalletUiModal({ size = "md", wallets, select, ...props }) {
759
+ return /* @__PURE__ */ React19__default.default.createElement(BaseModal, { description: "Connect a wallet on Solana to continue", size, ...props }, /* @__PURE__ */ React19__default.default.createElement(WalletUiList, { size, wallets, select }));
760
+ }
761
+ function WalletUiModalTrigger({ label = "Select Wallet", modal, ...props }) {
762
+ return /* @__PURE__ */ React19__default.default.createElement(BaseButton, { label, onClick: () => void modal.open(), ...props });
763
+ }
764
+
765
+ exports.BaseButton = BaseButton;
766
+ exports.BaseDropdown = BaseDropdown;
767
+ exports.BaseDropdownChevronDown = BaseDropdownChevronDown;
768
+ exports.BaseDropdownItemType = BaseDropdownItemType;
769
+ exports.BaseModal = BaseModal;
770
+ exports.BaseSvg = BaseSvg;
771
+ exports.WalletUi = WalletUi;
772
+ exports.WalletUiAccountContext = WalletUiAccountContext;
773
+ exports.WalletUiAccountContextProvider = WalletUiAccountContextProvider;
774
+ exports.WalletUiButton = WalletUiButton;
775
+ exports.WalletUiClusterContext = WalletUiClusterContext;
776
+ exports.WalletUiClusterContextProvider = WalletUiClusterContextProvider;
777
+ exports.WalletUiClusterDropdown = WalletUiClusterDropdown;
778
+ exports.WalletUiContext = WalletUiContext;
779
+ exports.WalletUiContextProvider = WalletUiContextProvider;
780
+ exports.WalletUiDropdown = WalletUiDropdown;
781
+ exports.WalletUiIcon = WalletUiIcon;
782
+ exports.WalletUiIconClose = WalletUiIconClose;
783
+ exports.WalletUiIconNoWallet = WalletUiIconNoWallet;
784
+ exports.WalletUiLabel = WalletUiLabel;
785
+ exports.WalletUiList = WalletUiList;
786
+ exports.WalletUiListButton = WalletUiListButton;
787
+ exports.WalletUiModal = WalletUiModal;
788
+ exports.WalletUiModalTrigger = WalletUiModalTrigger;
789
+ exports.WalletUiSolanaClientContext = WalletUiSolanaClientContext;
790
+ exports.WalletUiSolanaClientContextProvider = WalletUiSolanaClientContextProvider;
791
+ exports.createWalletUiConfig = createWalletUiConfig;
792
+ exports.ellipsify = ellipsify;
793
+ exports.useBaseDropdown = useBaseDropdown;
794
+ exports.useBaseModal = useBaseModal;
795
+ exports.useWalletUi = useWalletUi;
796
+ exports.useWalletUiAccount = useWalletUiAccount;
797
+ exports.useWalletUiCluster = useWalletUiCluster;
798
+ exports.useWalletUiDropdown = useWalletUiDropdown;
799
+ exports.useWalletUiSolanaClient = useWalletUiSolanaClient;
800
+ exports.useWalletUiWallet = useWalletUiWallet;
801
+ exports.useWalletUiWallets = useWalletUiWallets;
802
+ Object.keys(react$1).forEach(function (k) {
803
+ if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
804
+ enumerable: true,
805
+ get: function () { return react$1[k]; }
806
+ });
807
+ });
808
+ Object.keys(core$1).forEach(function (k) {
809
+ if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
810
+ enumerable: true,
811
+ get: function () { return core$1[k]; }
812
+ });
813
+ });
409
814
  Object.keys(react).forEach(function (k) {
410
815
  if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
411
816
  enumerable: true,
412
817
  get: function () { return react[k]; }
413
818
  });
414
819
  });
820
+ Object.keys(walletStandardFeatures).forEach(function (k) {
821
+ if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
822
+ enumerable: true,
823
+ get: function () { return walletStandardFeatures[k]; }
824
+ });
825
+ });
415
826
  Object.keys(core).forEach(function (k) {
416
827
  if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
417
828
  enumerable: true,