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

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 +694 -288
  3. package/dist/index.browser.cjs.map +1 -1
  4. package/dist/index.browser.mjs +634 -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 +634 -259
  9. package/dist/index.native.mjs.map +1 -1
  10. package/dist/index.node.cjs +694 -288
  11. package/dist/index.node.cjs.map +1 -1
  12. package/dist/index.node.mjs +634 -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 +35 -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-client-context-provider.d.ts +4 -0
  61. package/dist/types/wallet-ui-client-context-provider.d.ts.map +1 -0
  62. package/dist/types/wallet-ui-cluster-context-provider.d.ts +4 -0
  63. package/dist/types/wallet-ui-cluster-context-provider.d.ts.map +1 -0
  64. package/dist/types/wallet-ui-cluster-context.d.ts +14 -0
  65. package/dist/types/wallet-ui-cluster-context.d.ts.map +1 -0
  66. package/dist/types/wallet-ui-cluster-dropdown.d.ts +9 -0
  67. package/dist/types/wallet-ui-cluster-dropdown.d.ts.map +1 -0
  68. package/dist/types/wallet-ui-context-provider.d.ts +4 -0
  69. package/dist/types/wallet-ui-context-provider.d.ts.map +1 -0
  70. package/dist/types/wallet-ui-context.d.ts +25 -0
  71. package/dist/types/wallet-ui-context.d.ts.map +1 -0
  72. package/dist/types/wallet-ui-dropdown.d.ts +8 -0
  73. package/dist/types/wallet-ui-dropdown.d.ts.map +1 -0
  74. package/dist/types/wallet-ui-icon-close.d.ts +4 -0
  75. package/dist/types/wallet-ui-icon-close.d.ts.map +1 -0
  76. package/dist/types/wallet-ui-icon-no-wallet.d.ts +4 -0
  77. package/dist/types/wallet-ui-icon-no-wallet.d.ts.map +1 -0
  78. package/dist/types/wallet-ui-icon.d.ts +10 -0
  79. package/dist/types/wallet-ui-icon.d.ts.map +1 -0
  80. package/dist/types/wallet-ui-label.d.ts +9 -0
  81. package/dist/types/wallet-ui-label.d.ts.map +1 -0
  82. package/dist/types/wallet-ui-list-button.d.ts +11 -0
  83. package/dist/types/wallet-ui-list-button.d.ts.map +1 -0
  84. package/dist/types/wallet-ui-list.d.ts +11 -0
  85. package/dist/types/wallet-ui-list.d.ts.map +1 -0
  86. package/dist/types/wallet-ui-modal-trigger.d.ts +9 -0
  87. package/dist/types/wallet-ui-modal-trigger.d.ts.map +1 -0
  88. package/dist/types/wallet-ui-modal.d.ts +11 -0
  89. package/dist/types/wallet-ui-modal.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 gill = require('gill');
9
+ var core$1 = require('@wallet-ui/core');
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 WalletUiSolanaClientContext = React19.createContext({});
253
+
254
+ // src/use-wallet-ui-solana-client.tsx
255
+ function useWalletUiSolanaClient() {
256
+ return React19.useContext(WalletUiSolanaClientContext);
257
+ }
258
+ var WalletUiClusterContext = React19.createContext({});
259
+
260
+ // src/use-wallet-ui-cluster.tsx
261
+ function useWalletUiCluster() {
262
+ return React19.useContext(WalletUiClusterContext);
128
263
  }
129
- function useSolanaWalletAddress() {
130
- const [wallet] = useSolanaWallet();
131
- if (!wallet?.address) {
264
+ function WalletUiIcon({ className, size, wallet, ...props }) {
265
+ if (!wallet) {
132
266
  return null;
133
267
  }
134
- return gill.address(wallet.address);
268
+ return /* @__PURE__ */ React19__default.default.createElement(
269
+ "img",
270
+ {
271
+ src: wallet.icon,
272
+ alt: wallet.name,
273
+ className: `wallet-ui-list-icon ${size ?? "md"} ${className ?? ""}`,
274
+ ...props
275
+ }
276
+ );
135
277
  }
136
278
 
137
- // src/solana-wallet-provider.tsx
138
- var STORAGE_KEY2 = "placeholder:selected-wallet-and-address";
279
+ // src/use-wallet-ui-dropdown.tsx
280
+ function getDropdownItemsWallets({
281
+ wallets,
282
+ connect: connect3,
283
+ size
284
+ }) {
285
+ return wallets.length ? wallets.map((wallet) => ({
286
+ handler: async () => {
287
+ const account = wallet.accounts.length > 0 ? wallet.accounts[0] : void 0;
288
+ if (!account) {
289
+ return;
290
+ }
291
+ connect3(account);
292
+ await Promise.resolve();
293
+ },
294
+ label: wallet.name,
295
+ leftSection: /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { wallet, size }),
296
+ type: "WalletConnect" /* WalletConnect */,
297
+ value: wallet.name,
298
+ wallet
299
+ })) : [
300
+ {
301
+ handler: async () => {
302
+ window.open("https://solana.com/solana-wallets", "_blank");
303
+ await Promise.resolve();
304
+ },
305
+ label: "You'll need a wallet on Solana to continue",
306
+ type: "WalletNeeded" /* WalletNeeded */,
307
+ value: "no-wallets"
308
+ }
309
+ ];
310
+ }
311
+ function useWalletUiDropdown({ size = "md" } = {}) {
312
+ const dropdown = useBaseDropdown();
313
+ const { account, connect: connect3, copy, disconnect, connected, wallet, wallets } = useWalletUi();
314
+ const itemsWallets = React19.useMemo(() => {
315
+ return getDropdownItemsWallets({ connect: connect3, size, wallets });
316
+ }, [wallets, size, connect3]);
317
+ const itemsConnected = React19.useMemo(
318
+ () => [
319
+ {
320
+ handler: async () => {
321
+ copy();
322
+ void await Promise.resolve();
323
+ },
324
+ label: "Copy Address",
325
+ type: "WalletCopy" /* WalletCopy */,
326
+ value: "copy"
327
+ },
328
+ {
329
+ handler: async () => {
330
+ disconnect();
331
+ dropdown.close();
332
+ await Promise.resolve();
333
+ },
334
+ label: "Disconnect",
335
+ type: "WalletDisconnect" /* WalletDisconnect */,
336
+ value: "disconnect"
337
+ },
338
+ ...itemsWallets
339
+ ],
340
+ [connect3, copy, disconnect, dropdown, size, wallets]
341
+ );
342
+ const items = React19.useMemo(() => {
343
+ return connected ? itemsConnected : itemsWallets;
344
+ }, [connected, itemsConnected, itemsWallets]);
345
+ const buttonProps = React19.useMemo(() => {
346
+ return {
347
+ label: connected ? (account ? ellipsify(account.address) : wallet?.name) ?? "Connected" : "Select Wallet",
348
+ leftSection: connected ? /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { size, wallet }) : void 0
349
+ };
350
+ }, [account, connected, size, wallet]);
351
+ return {
352
+ buttonProps,
353
+ connected,
354
+ dropdown,
355
+ items
356
+ };
357
+ }
358
+ function ellipsify(str = "", len = 4, delimiter = "..") {
359
+ const strLen = str.length;
360
+ const limit = len * 2 + delimiter.length;
361
+ return strLen >= limit ? str.substring(0, len) + delimiter + str.substring(strLen - len, strLen) : str;
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,433 @@ 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);
203
439
  }
204
- }, [selectedWalletAccount, walletAccount]);
205
- return /* @__PURE__ */ React10__default.default.createElement(SolanaWalletContext.Provider, { value: React10.useMemo(() => [walletAccount, setSelectedWalletAccount2], [walletAccount]) }, children);
440
+ }, [account, walletAccount]);
441
+ const wallet = React19.useMemo(() => {
442
+ if (!walletAccount) {
443
+ return void 0;
444
+ }
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
+ );
477
+ }
478
+ function WalletUiClientContextProvider({ children, urlOrMoniker }) {
479
+ return /* @__PURE__ */ React19__default.default.createElement(
480
+ WalletUiSolanaClientContext.Provider,
481
+ {
482
+ value: React19.useMemo(() => gill.createSolanaClient({ urlOrMoniker }), [urlOrMoniker])
483
+ },
484
+ children
485
+ );
206
486
  }
207
- var SolanaWalletUiContext = React10__default.default.createContext(
208
- {}
209
- );
210
- function useSolanaWalletUi() {
211
- return React10__default.default.useContext(SolanaWalletUiContext);
487
+ function useLocalStorage(key, initialValue) {
488
+ const [storedValue, setStoredValue] = React19.useState(() => {
489
+ try {
490
+ if (typeof window === "undefined") {
491
+ return initialValue;
492
+ }
493
+ const item = window.localStorage.getItem(key);
494
+ if (key.includes("wallet") || key.includes("account")) {
495
+ return initialValue;
496
+ }
497
+ return item ? JSON.parse(item) : initialValue;
498
+ } catch (error) {
499
+ console.warn(`Error reading localStorage key "${key}":`, error);
500
+ return initialValue;
501
+ }
502
+ });
503
+ const setValue = React19.useCallback(
504
+ (value) => {
505
+ try {
506
+ const valueToStore = value instanceof Function ? value(storedValue) : value;
507
+ setStoredValue(valueToStore);
508
+ if (typeof window !== "undefined") {
509
+ if (valueToStore === void 0 || valueToStore === null) {
510
+ window.localStorage.removeItem(key);
511
+ } else {
512
+ window.localStorage.setItem(key, JSON.stringify(valueToStore));
513
+ }
514
+ }
515
+ } catch (error) {
516
+ console.warn(`Error setting localStorage key "${key}":`, error);
517
+ }
518
+ },
519
+ [key, storedValue]
520
+ );
521
+ return [storedValue, setValue];
212
522
  }
213
523
 
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" });
524
+ // src/wallet-ui-cluster-context-provider.tsx
525
+ function WalletUiClusterContextProvider({
526
+ clusters,
527
+ render,
528
+ storageKey = "__wallet-ui:selected-cluster"
529
+ }) {
530
+ const [clusterId, setClusterId] = useLocalStorage(storageKey, "solana:devnet");
531
+ if (!clusters.length) {
532
+ throw new Error("No clusters provided");
234
533
  }
235
- async function copy() {
236
- if (!walletAccount) {
237
- return;
534
+ const cluster = React19.useMemo(() => {
535
+ for (const cluster2 of clusters) {
536
+ if (cluster2.id === clusterId) {
537
+ return cluster2;
538
+ }
238
539
  }
239
- await navigator.clipboard.writeText(walletAccount.address);
240
- menuService.send({ type: "CLOSE" });
241
- dialogService.send({ type: "CLOSE" });
540
+ return clusters[0];
541
+ }, [clusterId, clusters]);
542
+ const value = {
543
+ cluster,
544
+ clusters,
545
+ setCluster: (cluster2) => {
546
+ localStorage.setItem(storageKey, cluster2);
547
+ setClusterId(cluster2);
548
+ }
549
+ };
550
+ return /* @__PURE__ */ React19__default.default.createElement(WalletUiClusterContext.Provider, { value }, render(value));
551
+ }
552
+ function WalletUiContextProvider({ children, size = "md" }) {
553
+ const { account, setAccount, wallet } = useWalletUiAccount();
554
+ const wallets = useWalletUiWallets();
555
+ const client = useWalletUiSolanaClient();
556
+ const walletHasAccounts = Boolean(wallet && wallet?.accounts.length > 0);
557
+ function connect3(account2) {
558
+ setAccount(account2);
242
559
  }
243
560
  function disconnect() {
244
- setConnected(false);
245
- setWalletAccount(void 0);
246
- dialogService.send({ type: "CLOSE" });
247
- menuService.send({ type: "CLOSE" });
561
+ setAccount(void 0);
562
+ }
563
+ function copy() {
564
+ if (!account) {
565
+ return;
566
+ }
567
+ core$1.handleCopyText(account.address);
248
568
  }
249
569
  const value = {
250
- change,
251
- connectAccount,
252
- connected: connected && walletAccount !== void 0,
570
+ account,
571
+ client,
572
+ connect: connect3,
573
+ connected: walletHasAccounts,
253
574
  copy,
254
- dialogApi,
255
575
  disconnect,
256
- menuApi,
576
+ size,
257
577
  wallet,
258
- walletAccount,
259
- wallets: React10.useMemo(() => wallets.filter((wallet2) => wallet2.chains.some((i) => i.startsWith("solana:"))), [wallets])
578
+ wallets
260
579
  };
261
- return /* @__PURE__ */ React10__default.default.createElement(SolanaWalletUiContext.Provider, { value }, props.children);
580
+ return /* @__PURE__ */ React19__default.default.createElement(WalletUiContext.Provider, { value }, children);
262
581
  }
263
582
 
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 = [
583
+ // src/wallet-ui.tsx
584
+ function createWalletUiConfig(props) {
585
+ return { ...props };
586
+ }
587
+ function WalletUi({
588
+ children,
589
+ config: { clusters, clusterStorageKey, selectedAccountStorageKey, ...config }
590
+ }) {
591
+ return /* @__PURE__ */ React19__default.default.createElement(React19__default.default.Fragment, null, /* @__PURE__ */ React19__default.default.createElement(
592
+ WalletUiClusterContextProvider,
280
593
  {
281
- handler: copy,
282
- label: "Copy Address",
283
- value: "copy"
284
- },
594
+ clusters,
595
+ storageKey: clusterStorageKey,
596
+ render: ({ cluster }) => {
597
+ return /* @__PURE__ */ React19__default.default.createElement(WalletUiClientContextProvider, { urlOrMoniker: cluster.urlOrMoniker }, /* @__PURE__ */ React19__default.default.createElement(WalletUiAccountContextProvider, { storageKey: selectedAccountStorageKey }, /* @__PURE__ */ React19__default.default.createElement(WalletUiContextProvider, { ...config }, children)));
598
+ }
599
+ }
600
+ ));
601
+ }
602
+ function WalletUiButton({ ...props }) {
603
+ return /* @__PURE__ */ React19__default.default.createElement(BaseButton, { ...props, label: "CLICK" });
604
+ }
605
+ function WalletUiClusterDropdown({ buttonProps, size = "md", ...props }) {
606
+ const dropdown = useBaseDropdown();
607
+ const { cluster, clusters, setCluster } = useWalletUiCluster();
608
+ return /* @__PURE__ */ React19__default.default.createElement(
609
+ BaseDropdown,
285
610
  {
286
- handler: change,
287
- label: "Change Wallet",
288
- value: "change"
289
- },
611
+ buttonProps: { ...buttonProps, label: cluster.label, size },
612
+ items: clusters.map((cluster2) => ({
613
+ handler: async () => {
614
+ setCluster(cluster2.id);
615
+ await Promise.resolve();
616
+ },
617
+ label: cluster2.label,
618
+ type: "Item" /* Item */,
619
+ value: cluster2.id
620
+ })),
621
+ dropdown,
622
+ ...props
623
+ }
624
+ );
625
+ }
626
+ function WalletUiDropdown({ size = "md", ...props }) {
627
+ const { buttonProps, items, dropdown } = useWalletUiDropdown({ size });
628
+ return /* @__PURE__ */ React19__default.default.createElement(BaseDropdown, { ...props, buttonProps: { ...buttonProps, size }, items, dropdown });
629
+ }
630
+ function WalletUiIconNoWallet({ size, ...props }) {
631
+ 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(
632
+ "circle",
290
633
  {
291
- handler: disconnect,
292
- label: "Disconnect",
293
- value: "disconnect"
634
+ cx: "48.5",
635
+ cy: "48",
636
+ r: "47",
637
+ stroke: "url(#paint1_linear_880_5115)",
638
+ strokeOpacity: "0.4",
639
+ strokeWidth: "2"
294
640
  }
295
- ];
296
- const trigger = /* @__PURE__ */ React10__default.default.createElement(
297
- AppMenuButton,
641
+ ), /* @__PURE__ */ React19__default.default.createElement("g", { clipPath: "url(#clip0_880_5115)" }, /* @__PURE__ */ React19__default.default.createElement(
642
+ "path",
298
643
  {
299
- ...api.getTriggerProps(),
300
- className: `wallet-trigger ${connected ? "connected" : ""}`,
301
- "data-part": "trigger"
644
+ 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",
645
+ fill: "url(#paint2_linear_880_5115)"
646
+ }
647
+ ), /* @__PURE__ */ React19__default.default.createElement(
648
+ "path",
649
+ {
650
+ 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",
651
+ fill: "url(#paint3_linear_880_5115)"
652
+ }
653
+ )), /* @__PURE__ */ React19__default.default.createElement("defs", null, /* @__PURE__ */ React19__default.default.createElement(
654
+ "linearGradient",
655
+ {
656
+ id: "paint0_linear_880_5115",
657
+ x1: "3.41664",
658
+ y1: "98.0933",
659
+ x2: "103.05",
660
+ y2: "8.42498",
661
+ gradientUnits: "userSpaceOnUse"
302
662
  },
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",
663
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
664
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
665
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
666
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
667
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
668
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
669
+ ), /* @__PURE__ */ React19__default.default.createElement(
670
+ "linearGradient",
308
671
  {
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
- }
672
+ id: "paint1_linear_880_5115",
673
+ x1: "3.41664",
674
+ y1: "98.0933",
675
+ x2: "103.05",
676
+ y2: "8.42498",
677
+ gradientUnits: "userSpaceOnUse"
319
678
  },
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",
679
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
680
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
681
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
682
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
683
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
684
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
685
+ ), /* @__PURE__ */ React19__default.default.createElement(
686
+ "linearGradient",
360
687
  {
361
- disabled: isPending,
362
- onClick: () => {
363
- void disconnect();
364
- }
688
+ id: "paint2_linear_880_5115",
689
+ x1: "25.9583",
690
+ y1: "68.7101",
691
+ x2: "67.2337",
692
+ y2: "23.7879",
693
+ gradientUnits: "userSpaceOnUse"
365
694
  },
366
- "Disconnect"
367
- ) : /* @__PURE__ */ React10__default.default.createElement(
368
- "button",
695
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
696
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
697
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
698
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
699
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
700
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
701
+ ), /* @__PURE__ */ React19__default.default.createElement(
702
+ "linearGradient",
369
703
  {
370
- disabled: isPending,
371
- onClick: () => {
372
- void connect3();
373
- }
704
+ id: "paint3_linear_880_5115",
705
+ x1: "58.3326",
706
+ y1: "49.4467",
707
+ x2: "61.0002",
708
+ y2: "45.4453",
709
+ gradientUnits: "userSpaceOnUse"
374
710
  },
375
- "Connect"
376
- )), accounts.map((item, index) => /* @__PURE__ */ React10__default.default.createElement("div", { key: `${item.address}-${index}` }, /* @__PURE__ */ React10__default.default.createElement(
711
+ /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
712
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
713
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
714
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
715
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
716
+ /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
717
+ ), /* @__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)" }))));
718
+ }
719
+ function WalletUiLabel({ className, size, wallet, ...props }) {
720
+ if (!wallet) {
721
+ return null;
722
+ }
723
+ return /* @__PURE__ */ React19__default.default.createElement("span", { className: `wallet-ui-list-label ${size ?? "md"} ${className ?? ""}`, ...props }, wallet.name);
724
+ }
725
+ function WalletUiListButton({ className, select, size = "md", wallet, ...props }) {
726
+ const [pending, setPending] = React19__default.default.useState(false);
727
+ function handleSelect() {
728
+ if (!select) {
729
+ return;
730
+ }
731
+ setPending(true);
732
+ const account = wallet.accounts.length > 0 ? wallet.accounts[0] : void 0;
733
+ if (!account) {
734
+ return;
735
+ }
736
+ void select(account).finally(() => setPending(false));
737
+ }
738
+ return /* @__PURE__ */ React19__default.default.createElement(
377
739
  "button",
378
740
  {
379
- disabled: item.address === walletAccount?.address,
380
- onClick: () => {
381
- void connectAccount(wallet, item);
382
- }
741
+ disabled: pending,
742
+ className: `wallet-ui-list-button ${size} ${pending ? "wallet-ui-list-button-pending" : ""} ${className ?? ""}`,
743
+ onClick: handleSelect,
744
+ ...props
383
745
  },
384
- item.address
385
- ))));
746
+ /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { className: "wallet-ui-list-button-icon", wallet, size }),
747
+ /* @__PURE__ */ React19__default.default.createElement(WalletUiLabel, { className: "wallet-ui-list-button-label", wallet, size })
748
+ );
386
749
  }
387
750
 
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;
751
+ // src/wallet-ui-list.tsx
752
+ function WalletUiList({ className, select, size = "md", wallets, ...props }) {
753
+ 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 })));
754
+ }
755
+ function WalletUiModal({ size = "md", wallets, select, ...props }) {
756
+ 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 }));
757
+ }
758
+ function WalletUiModalTrigger({ label = "Select Wallet", modal, ...props }) {
759
+ return /* @__PURE__ */ React19__default.default.createElement(BaseButton, { label, onClick: () => void modal.open(), ...props });
760
+ }
761
+
762
+ exports.BaseButton = BaseButton;
763
+ exports.BaseDropdown = BaseDropdown;
764
+ exports.BaseDropdownChevronDown = BaseDropdownChevronDown;
765
+ exports.BaseDropdownItemType = BaseDropdownItemType;
766
+ exports.BaseModal = BaseModal;
767
+ exports.BaseSvg = BaseSvg;
768
+ exports.WalletUi = WalletUi;
769
+ exports.WalletUiButton = WalletUiButton;
770
+ exports.WalletUiClientContextProvider = WalletUiClientContextProvider;
771
+ exports.WalletUiClusterContext = WalletUiClusterContext;
772
+ exports.WalletUiClusterContextProvider = WalletUiClusterContextProvider;
773
+ exports.WalletUiClusterDropdown = WalletUiClusterDropdown;
774
+ exports.WalletUiContext = WalletUiContext;
775
+ exports.WalletUiContextProvider = WalletUiContextProvider;
776
+ exports.WalletUiDropdown = WalletUiDropdown;
777
+ exports.WalletUiIcon = WalletUiIcon;
778
+ exports.WalletUiIconClose = WalletUiIconClose;
779
+ exports.WalletUiIconNoWallet = WalletUiIconNoWallet;
780
+ exports.WalletUiLabel = WalletUiLabel;
781
+ exports.WalletUiList = WalletUiList;
782
+ exports.WalletUiListButton = WalletUiListButton;
783
+ exports.WalletUiModal = WalletUiModal;
784
+ exports.WalletUiModalTrigger = WalletUiModalTrigger;
785
+ exports.WalletUiSolanaClientContext = WalletUiSolanaClientContext;
786
+ exports.createWalletUiConfig = createWalletUiConfig;
787
+ exports.ellipsify = ellipsify;
788
+ exports.useBaseDropdown = useBaseDropdown;
789
+ exports.useBaseModal = useBaseModal;
790
+ exports.useWalletUi = useWalletUi;
791
+ exports.useWalletUiAccount = useWalletUiAccount;
792
+ exports.useWalletUiCluster = useWalletUiCluster;
793
+ exports.useWalletUiDropdown = useWalletUiDropdown;
794
+ exports.useWalletUiSolanaClient = useWalletUiSolanaClient;
795
+ exports.useWalletUiWallet = useWalletUiWallet;
796
+ exports.useWalletUiWallets = useWalletUiWallets;
797
+ Object.keys(react$1).forEach(function (k) {
798
+ if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
799
+ enumerable: true,
800
+ get: function () { return react$1[k]; }
801
+ });
802
+ });
803
+ Object.keys(core$1).forEach(function (k) {
804
+ if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
805
+ enumerable: true,
806
+ get: function () { return core$1[k]; }
807
+ });
808
+ });
409
809
  Object.keys(react).forEach(function (k) {
410
810
  if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
411
811
  enumerable: true,
412
812
  get: function () { return react[k]; }
413
813
  });
414
814
  });
815
+ Object.keys(walletStandardFeatures).forEach(function (k) {
816
+ if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
817
+ enumerable: true,
818
+ get: function () { return walletStandardFeatures[k]; }
819
+ });
820
+ });
415
821
  Object.keys(core).forEach(function (k) {
416
822
  if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
417
823
  enumerable: true,