@wallet-ui/react 2.0.0-canary-20250827030244 → 2.0.0-canary-20250922105257

package/dist/index.browser.cjs

@@ -1,6 +1,6 @@
 'use strict';
 
-var React19 = require('react');
+var React18 = require('react');
 var react$1 = require('@wallet-standard/react');
 var react$2 = require('@zag-js/react');
 var menu = require('@zag-js/menu');
@@ -31,25 +31,25 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React19__default = /*#__PURE__*/_interopDefault(React19);
+var React18__default = /*#__PURE__*/_interopDefault(React18);
 var menu__namespace = /*#__PURE__*/_interopNamespace(menu);
 var dialog__namespace = /*#__PURE__*/_interopNamespace(dialog);
 
 // src/base-button.tsx
-function BaseButton({ className, label, leftSection, onClick, rightSection, size, ...props }) {
-  return /* @__PURE__ */ React19__default.default.createElement("button", { "data-wu": "base-button", className: `${size ?? "md"} ${className ?? ""}`, onClick, ...props }, leftSection ? /* @__PURE__ */ React19__default.default.createElement("span", { "data-wu": "base-button-left-section" }, leftSection) : null, label, rightSection ? /* @__PURE__ */ React19__default.default.createElement("span", { "data-wu": "base-button-right-section" }, rightSection) : null);
+function BaseButton({ className, label, leftSection, onClick, rightSection, ...props }) {
+  return /* @__PURE__ */ React18__default.default.createElement("button", { "data-wu": "base-button", className: `${className ?? ""}`, onClick, ...props }, leftSection ? /* @__PURE__ */ React18__default.default.createElement("span", { "data-wu": "base-button-left-section" }, leftSection) : null, label, rightSection ? /* @__PURE__ */ React18__default.default.createElement("span", { "data-wu": "base-button-right-section" }, rightSection) : null);
 }
-var WalletUiContext = React19__default.default.createContext({});
+var WalletUiContext = React18__default.default.createContext({});
 
 // src/use-wallet-ui.tsx
 function useWalletUi() {
-  return React19__default.default.useContext(WalletUiContext);
+  return React18__default.default.useContext(WalletUiContext);
 }
-var WalletUiAccountContext = React19.createContext({});
+var WalletUiAccountContext = React18.createContext({});
 
 // src/use-wallet-ui-account.tsx
 function useWalletUiAccount() {
-  return React19.useContext(WalletUiAccountContext);
+  return React18.useContext(WalletUiAccountContext);
 }
 
 // src/use-wallet-ui-wallet.tsx
@@ -58,7 +58,7 @@ function useWalletUiWallet({ wallet }) {
   const { setAccount } = useWalletUiAccount();
   const [isConnecting, connect3] = react$1.useConnect(wallet);
   const [isDisconnecting, disconnect] = react$1.useDisconnect(wallet);
-  React19.useEffect(() => {
+  React18.useEffect(() => {
   }, [isDisconnecting]);
   return {
     connect: async () => {
@@ -77,20 +77,11 @@ function useWalletUiWallet({ wallet }) {
     isDisconnecting
   };
 }
-function WalletUiIcon({ className, size = "md", wallet, ...props }) {
+function WalletUiIcon({ className, wallet, ...props }) {
   if (!wallet) {
     return null;
   }
-  return /* @__PURE__ */ React19__default.default.createElement(
-    "img",
-    {
-      "data-wu": "wallet-ui-icon",
-      src: wallet.icon,
-      alt: wallet.name,
-      className: `${size} ${className ?? ""}`,
-      ...props
-    }
-  );
+  return /* @__PURE__ */ React18__default.default.createElement("img", { "data-wu": "wallet-ui-icon", src: wallet.icon, alt: wallet.name, className: className ?? "", ...props });
 }
 
 // src/base-dropdown.tsx
@@ -102,25 +93,23 @@ var BaseDropdownItemType = /* @__PURE__ */ ((BaseDropdownItemType2) => {
   BaseDropdownItemType2["WalletNeeded"] = "WalletNeeded";
   return BaseDropdownItemType2;
 })(BaseDropdownItemType || {});
-function BaseDropdown({ buttonProps, dropdown, items, showIndicator, size = "md" }) {
+function BaseDropdown({ buttonProps, dropdown, items, showIndicator }) {
   const api = dropdown.api;
-  const trigger = /* @__PURE__ */ React19__default.default.createElement(
+  const trigger = /* @__PURE__ */ React18__default.default.createElement(
     BaseButton,
     {
       ...api.getTriggerProps(),
-      size,
-      rightSection: showIndicator ? /* @__PURE__ */ React19__default.default.createElement("span", { ...api.getIndicatorProps() }, /* @__PURE__ */ React19__default.default.createElement(BaseDropdownChevronDown, { size: 12 })) : null,
+      rightSection: showIndicator ? /* @__PURE__ */ React18__default.default.createElement("span", { ...api.getIndicatorProps() }, /* @__PURE__ */ React18__default.default.createElement(BaseDropdownChevronDown, null)) : null,
       ...buttonProps
     }
   );
-  return /* @__PURE__ */ React19__default.default.createElement("div", { "data-wu": "base-dropdown" }, trigger, /* @__PURE__ */ React19__default.default.createElement("div", { ...api.getPositionerProps(), "data-wu": "base-dropdown-wrapper" }, /* @__PURE__ */ React19__default.default.createElement("div", { ...api.getContentProps(), "data-wu": "base-dropdown-list", "data-part": "content" }, items.map((item) => {
-    return /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement("div", { "data-wu": "base-dropdown" }, trigger, /* @__PURE__ */ React18__default.default.createElement("div", { ...api.getPositionerProps(), "data-wu": "base-dropdown-wrapper" }, /* @__PURE__ */ React18__default.default.createElement("div", { ...api.getContentProps(), "data-wu": "base-dropdown-list", "data-part": "content" }, items.map((item) => {
+    return /* @__PURE__ */ React18__default.default.createElement(
       BaseDropdownItem,
       {
         ...api.getItemProps({ value: item.value }),
         key: item.value,
         item,
-        size,
         afterClick: () => {
           if (item.disabled) {
             return;
@@ -133,37 +122,28 @@ function BaseDropdown({ buttonProps, dropdown, items, showIndicator, size = "md"
     );
   }))));
 }
-function BaseDropdownItem({ afterClick, item, size }) {
+function BaseDropdownItem({ afterClick, item }) {
   if (!item.wallet) {
-    return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemRender, { afterClick, item, size });
+    return /* @__PURE__ */ React18__default.default.createElement(BaseDropdownItemRender, { afterClick, item });
   }
   switch (item.type) {
     case "Item" /* Item */:
-      return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemRender, { afterClick, item, size });
+      return /* @__PURE__ */ React18__default.default.createElement(BaseDropdownItemRender, { afterClick, item });
     case "WalletConnect" /* WalletConnect */:
-      return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemWalletConnect, { afterClick, item, size, wallet: item.wallet });
+      return /* @__PURE__ */ React18__default.default.createElement(BaseDropdownItemWalletConnect, { afterClick, item, wallet: item.wallet });
     case "WalletCopy" /* WalletCopy */:
-      return /* @__PURE__ */ React19__default.default.createElement(BaseDropdownItemRender, { afterClick, item, size });
+      return /* @__PURE__ */ React18__default.default.createElement(BaseDropdownItemRender, { afterClick, item });
     case "WalletDisconnect" /* WalletDisconnect */:
-      return /* @__PURE__ */ React19__default.default.createElement(
-        BaseDropdownItemWalletDisconnect,
-        {
-          afterClick,
-          item,
-          size,
-          wallet: item.wallet
-        }
-      );
+      return /* @__PURE__ */ React18__default.default.createElement(BaseDropdownItemWalletDisconnect, { afterClick, item, wallet: item.wallet });
   }
 }
 function BaseDropdownItemWalletConnect({
   afterClick,
   item,
-  size,
   wallet
 }) {
   const { connect: connect3 } = useWalletUiWallet({ wallet });
-  return /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement(
     BaseDropdownItemRender,
     {
       afterClick,
@@ -173,20 +153,18 @@ function BaseDropdownItemWalletConnect({
           await connect3();
           return await item.handler();
         },
-        leftSection: wallet ? /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { wallet, size }) : void 0
-      },
-      size
+        leftSection: wallet ? /* @__PURE__ */ React18__default.default.createElement(WalletUiIcon, { wallet }) : void 0
+      }
     }
   );
 }
 function BaseDropdownItemWalletDisconnect({
   afterClick,
   item,
-  size,
   wallet
 }) {
   const { disconnect } = useWalletUiWallet({ wallet });
-  return /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement(
     BaseDropdownItemRender,
     {
       afterClick,
@@ -196,12 +174,11 @@ function BaseDropdownItemWalletDisconnect({
           await disconnect();
           return await item.handler();
         }
-      },
-      size
+      }
     }
   );
 }
-function BaseDropdownItemRender({ afterClick, item, size }) {
+function BaseDropdownItemRender({ afterClick, item }) {
   function onClick() {
     if (item.disabled) {
       return;
@@ -210,15 +187,15 @@ function BaseDropdownItemRender({ afterClick, item, size }) {
       afterClick();
     });
   }
-  return /* @__PURE__ */ React19__default.default.createElement("button", { type: "button", "data-wu": "base-dropdown-item", className: size, "data-part": "item", onClick }, item.leftSection ? /* @__PURE__ */ React19__default.default.createElement("span", { "data-wu": "base-dropdown-item-left-section" }, item.leftSection) : null, item.label, item.rightSection ? /* @__PURE__ */ React19__default.default.createElement("span", { "data-wu": "base-dropdown-item-right-section" }, item.rightSection) : null);
+  return /* @__PURE__ */ React18__default.default.createElement("button", { type: "button", "data-wu": "base-dropdown-item", "data-part": "item", onClick }, item.leftSection ? /* @__PURE__ */ React18__default.default.createElement("span", { "data-wu": "base-dropdown-item-left-section" }, item.leftSection) : null, item.label, item.rightSection ? /* @__PURE__ */ React18__default.default.createElement("span", { "data-wu": "base-dropdown-item-right-section" }, item.rightSection) : null);
 }
 function BaseDropdownChevronDown(props) {
-  return /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
-      width: props.size ?? 24,
-      height: props.size ?? 24,
+      width: 12,
+      height: 12,
       viewBox: "0 0 24 24",
       fill: "none",
       stroke: "currentColor",
@@ -227,38 +204,37 @@ function BaseDropdownChevronDown(props) {
       strokeLinejoin: "round",
       ...props
     },
-    /* @__PURE__ */ React19__default.default.createElement("path", { d: "m6 9 6 6 6-6" })
+    /* @__PURE__ */ React18__default.default.createElement("path", { d: "m6 9 6 6 6-6" })
   );
 }
-function BaseSvg({ sizes = {}, ...props }) {
-  const size = props.size ? sizes[props.size] : 12;
-  return /* @__PURE__ */ React19__default.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: size, height: size, ...props }, props.children);
+function BaseSvg({ ...props }) {
+  return /* @__PURE__ */ React18__default.default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", ...props }, props.children);
 }
 
 // src/wallet-ui-icon-close.tsx
-function WalletUiIconClose({ size = "md", ...props }) {
-  return /* @__PURE__ */ React19__default.default.createElement(
+function WalletUiIconClose({ ...props }) {
+  return /* @__PURE__ */ React18__default.default.createElement(
     BaseSvg,
     {
-      size,
-      sizes: { lg: 16, md: 12, sm: 8 },
       fill: "none",
       stroke: "currentColor",
       strokeWidth: "3",
+      width: 12,
+      height: 12,
       viewBox: "0 0 14 14",
       ...props
     },
-    /* @__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" })
+    /* @__PURE__ */ React18__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" })
   );
 }
 
 // src/base-modal.tsx
-function BaseModal({ modal, buttonLabel, buttonProps = {}, size = "md", ...props }) {
+function BaseModal({ modal, buttonLabel, buttonProps = {}, ...props }) {
   const api = modal.api;
-  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)))));
+  return /* @__PURE__ */ React18__default.default.createElement(React18__default.default.Fragment, null, buttonLabel ? /* @__PURE__ */ React18__default.default.createElement(BaseButton, { label: buttonLabel, ...buttonProps, ...api.getTriggerProps() }) : null, api.open && /* @__PURE__ */ React18__default.default.createElement(react$2.Portal, null, /* @__PURE__ */ React18__default.default.createElement("div", { ...api.getBackdropProps() }), /* @__PURE__ */ React18__default.default.createElement("div", { ...api.getPositionerProps() }, /* @__PURE__ */ React18__default.default.createElement("div", { ...api.getContentProps() }, /* @__PURE__ */ React18__default.default.createElement("header", null, /* @__PURE__ */ React18__default.default.createElement("button", { ...api.getCloseTriggerProps() }, /* @__PURE__ */ React18__default.default.createElement(WalletUiIconClose, null))), props.description ? /* @__PURE__ */ React18__default.default.createElement("p", { ...api.getDescriptionProps() }, props.description) : null, /* @__PURE__ */ React18__default.default.createElement("main", null, props.children)))));
 }
 function useBaseDropdown() {
-  const service = react$2.useMachine(menu__namespace.machine, { id: React19.useId() });
+  const service = react$2.useMachine(menu__namespace.machine, { id: React18.useId() });
   const api = menu__namespace.connect(service, react$2.normalizeProps);
   return {
     api,
@@ -267,7 +243,7 @@ function useBaseDropdown() {
   };
 }
 function useBaseModal() {
-  const service = react$2.useMachine(dialog__namespace.machine, { id: React19.useId(), modal: true });
+  const service = react$2.useMachine(dialog__namespace.machine, { id: React18.useId(), modal: true });
   const api = dialog__namespace.connect(service, react$2.normalizeProps);
   return {
     api,
@@ -275,11 +251,11 @@ function useBaseModal() {
     open: () => service.send({ type: "OPEN" })
   };
 }
-var WalletUiClusterContext = React19.createContext({});
+var WalletUiClusterContext = React18.createContext({});
 
 // src/use-wallet-ui-cluster.tsx
 function useWalletUiCluster() {
-  return React19.useContext(WalletUiClusterContext);
+  return React18.useContext(WalletUiClusterContext);
 }
 function getDropdownItemsWallets({
   wallets,
@@ -310,11 +286,11 @@ function getDropdownItemsWallets({
     }
   ];
 }
-function useWalletUiDropdown({ size = "md" } = {}) {
+function useWalletUiDropdown() {
   const dropdown = useBaseDropdown();
   const { account, connect: connect3, copy, disconnect, connected, wallet, wallets } = useWalletUi();
-  const itemsWallets = React19.useMemo(() => getDropdownItemsWallets({ connect: connect3, wallets }), [wallets, connect3]);
-  const itemsConnected = React19.useMemo(
+  const itemsWallets = React18.useMemo(() => getDropdownItemsWallets({ connect: connect3, wallets }), [wallets, connect3]);
+  const itemsConnected = React18.useMemo(
     () => [
       {
         handler: async () => {
@@ -339,15 +315,15 @@ function useWalletUiDropdown({ size = "md" } = {}) {
     ],
     [copy, disconnect, dropdown, itemsWallets]
   );
-  const items = React19.useMemo(() => {
+  const items = React18.useMemo(() => {
     return connected ? itemsConnected : itemsWallets;
   }, [connected, itemsConnected, itemsWallets]);
-  const buttonProps = React19.useMemo(() => {
+  const buttonProps = React18.useMemo(() => {
     return {
       label: connected ? (account ? ellipsify(account.address) : wallet?.name) ?? "Connected" : "Select Wallet",
-      leftSection: connected ? /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { size, wallet }) : void 0
+      leftSection: connected ? /* @__PURE__ */ React18__default.default.createElement(WalletUiIcon, { wallet }) : void 0
     };
-  }, [account, connected, size, wallet]);
+  }, [account, connected, wallet]);
   return {
     buttonProps,
     connected,
@@ -368,7 +344,7 @@ function useWalletUiSigner({
 }
 function useWalletUiWallets() {
   const readonlyWallets = react$1.useWallets();
-  return React19.useMemo(
+  return React18.useMemo(
     () => readonlyWallets.filter((wallet) => wallet.chains.some((i) => i.startsWith("solana:"))).sort((a, b) => a.name.localeCompare(b.name)),
     [readonlyWallets]
   );
@@ -398,7 +374,7 @@ function WalletUiAccountContextProvider({
 }) {
   const wallets = react$1.useWallets();
   const accountId = react$3.useStore(storage.value);
-  const [account, setAccountInternal] = React19.useState(
+  const [account, setAccountInternal] = React18.useState(
     () => getSavedWalletAccount(wallets, accountId)
   );
   function setAccount(setStateAction) {
@@ -410,13 +386,13 @@ function WalletUiAccountContextProvider({
       return nextWalletAccount;
     });
   }
-  React19.useEffect(() => {
+  React18.useEffect(() => {
     const savedWalletAccount = getSavedWalletAccount(wallets, accountId);
     if (savedWalletAccount) {
       setAccountInternal(savedWalletAccount);
     }
   }, [accountId, wallets]);
-  const walletAccount = React19.useMemo(() => {
+  const walletAccount = React18.useMemo(() => {
     if (account) {
       for (const uiWallet of wallets) {
         for (const uiWalletAccount of uiWallet.accounts) {
@@ -430,12 +406,12 @@ function WalletUiAccountContextProvider({
       }
     }
   }, [account, wallets]);
-  React19.useEffect(() => {
+  React18.useEffect(() => {
     if (account && !walletAccount) {
       setAccountInternal(void 0);
     }
   }, [account, walletAccount]);
-  const wallet = React19.useMemo(() => {
+  const wallet = React18.useMemo(() => {
     if (!walletAccount) {
       return void 0;
     }
@@ -450,16 +426,16 @@ function WalletUiAccountContextProvider({
       }
     }
   }, [walletAccount, wallets]);
-  const accountKeys = React19.useMemo(() => {
+  const accountKeys = React18.useMemo(() => {
     if (!account) {
       return [];
     }
     return [cluster.id, react$1.getUiWalletAccountStorageKey(account)].filter(Boolean);
   }, [account, cluster.id]);
-  return /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement(
     WalletUiAccountContext.Provider,
     {
-      value: React19.useMemo(
+      value: React18.useMemo(
         () => ({
           account: walletAccount,
           accountKeys,
@@ -495,9 +471,9 @@ function WalletUiClusterContextProvider({
       storage.set(clusterId2);
     }
   };
-  return /* @__PURE__ */ React19__default.default.createElement(WalletUiClusterContext.Provider, { value }, render(value));
+  return /* @__PURE__ */ React18__default.default.createElement(WalletUiClusterContext.Provider, { value }, render(value));
 }
-function WalletUiContextProvider({ children, size = "md" }) {
+function WalletUiContextProvider({ children }) {
   const { account, accountKeys, cluster, setAccount, wallet } = useWalletUiAccount();
   const wallets = useWalletUiWallets();
   const connected = Boolean(wallet && wallet?.accounts.length > 0);
@@ -521,11 +497,10 @@ function WalletUiContextProvider({ children, size = "md" }) {
     connected,
     copy,
     disconnect,
-    size,
     wallet,
     wallets
   };
-  return /* @__PURE__ */ React19__default.default.createElement(WalletUiContext.Provider, { value }, children);
+  return /* @__PURE__ */ React18__default.default.createElement(WalletUiContext.Provider, { value }, children);
 }
 
 // src/wallet-ui.tsx
@@ -533,38 +508,34 @@ function createWalletUiConfig(props) {
   return { ...props };
 }
 function WalletUi({ children, config: { accountStorage, clusters, clusterStorage, ...config } }) {
-  return /* @__PURE__ */ React19__default.default.createElement(React19__default.default.Fragment, null, /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement(React18__default.default.Fragment, null, /* @__PURE__ */ React18__default.default.createElement(
     WalletUiClusterContextProvider,
     {
       clusters,
       storage: clusterStorage,
       render: ({ cluster }) => {
-        return /* @__PURE__ */ React19__default.default.createElement(WalletUiAccountContextProvider, { cluster, storage: accountStorage }, /* @__PURE__ */ React19__default.default.createElement(WalletUiContextProvider, { ...config }, children));
+        return /* @__PURE__ */ React18__default.default.createElement(WalletUiAccountContextProvider, { cluster, storage: accountStorage }, /* @__PURE__ */ React18__default.default.createElement(WalletUiContextProvider, { ...config }, children));
       }
     }
   ));
 }
-function WalletUiDropdown({ size = "md", ...props }) {
-  const { buttonProps, items, dropdown } = useWalletUiDropdown({ size });
-  return /* @__PURE__ */ React19__default.default.createElement(BaseDropdown, { ...props, buttonProps: { ...buttonProps }, dropdown, items, size });
+function WalletUiDropdown({ ...props }) {
+  const { buttonProps, items, dropdown } = useWalletUiDropdown();
+  return /* @__PURE__ */ React18__default.default.createElement(BaseDropdown, { ...props, buttonProps: { ...buttonProps }, dropdown, items });
 }
 
 // src/wallet-ui-account-guard.tsx
-function WalletUiAccountGuard({ fallback = /* @__PURE__ */ React19__default.default.createElement(WalletUiDropdown, null), render }) {
+function WalletUiAccountGuard({ fallback = /* @__PURE__ */ React18__default.default.createElement(WalletUiDropdown, null), render }) {
   const { account, accountKeys, cluster, wallet } = useWalletUiAccount();
   return account ? render({ account, accountKeys, cluster, wallet }) : fallback;
 }
-function WalletUiButton({ ...props }) {
-  return /* @__PURE__ */ React19__default.default.createElement(BaseButton, { ...props, label: "CLICK" });
-}
-function WalletUiClusterDropdown({ buttonProps, size = "md", ...props }) {
+function WalletUiClusterDropdown({ buttonProps, ...props }) {
   const dropdown = useBaseDropdown();
   const { cluster, clusters, setCluster } = useWalletUiCluster();
-  return /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement(
     BaseDropdown,
     {
-      size,
-      buttonProps: { ...buttonProps, label: cluster.label, size },
+      buttonProps: { ...buttonProps, label: cluster.label },
       items: clusters.map((cluster2) => ({
         handler: async () => {
           setCluster(cluster2.id);
@@ -579,8 +550,8 @@ function WalletUiClusterDropdown({ buttonProps, size = "md", ...props }) {
     }
   );
 }
-function WalletUiIconNoWallet({ size, ...props }) {
-  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(
+function WalletUiIconNoWallet({ ...props }) {
+  return /* @__PURE__ */ React18__default.default.createElement(BaseSvg, { fill: "none", height: 100, width: 100, viewBox: "0 0 97 96", ...props }, /* @__PURE__ */ React18__default.default.createElement("circle", { cx: "48.5", cy: "48", r: "48", fill: "url(#paint0_linear_880_5115)", fillOpacity: "0.1" }), /* @__PURE__ */ React18__default.default.createElement(
     "circle",
     {
       cx: "48.5",
@@ -590,19 +561,19 @@ function WalletUiIconNoWallet({ size, ...props }) {
       strokeOpacity: "0.4",
       strokeWidth: "2"
     }
-  ), /* @__PURE__ */ React19__default.default.createElement("g", { clipPath: "url(#clip0_880_5115)" }, /* @__PURE__ */ React19__default.default.createElement(
+  ), /* @__PURE__ */ React18__default.default.createElement("g", { clipPath: "url(#clip0_880_5115)" }, /* @__PURE__ */ React18__default.default.createElement(
     "path",
     {
       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",
       fill: "url(#paint2_linear_880_5115)"
     }
-  ), /* @__PURE__ */ React19__default.default.createElement(
+  ), /* @__PURE__ */ React18__default.default.createElement(
     "path",
     {
       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",
       fill: "url(#paint3_linear_880_5115)"
     }
-  )), /* @__PURE__ */ React19__default.default.createElement("defs", null, /* @__PURE__ */ React19__default.default.createElement(
+  )), /* @__PURE__ */ React18__default.default.createElement("defs", null, /* @__PURE__ */ React18__default.default.createElement(
     "linearGradient",
     {
       id: "paint0_linear_880_5115",
@@ -612,13 +583,13 @@ function WalletUiIconNoWallet({ size, ...props }) {
       y2: "8.42498",
       gradientUnits: "userSpaceOnUse"
     },
-    /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
-  ), /* @__PURE__ */ React19__default.default.createElement(
+    /* @__PURE__ */ React18__default.default.createElement("stop", { stopColor: "#9945FF" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
+  ), /* @__PURE__ */ React18__default.default.createElement(
     "linearGradient",
     {
       id: "paint1_linear_880_5115",
@@ -628,13 +599,13 @@ function WalletUiIconNoWallet({ size, ...props }) {
       y2: "8.42498",
       gradientUnits: "userSpaceOnUse"
     },
-    /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
-  ), /* @__PURE__ */ React19__default.default.createElement(
+    /* @__PURE__ */ React18__default.default.createElement("stop", { stopColor: "#9945FF" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
+  ), /* @__PURE__ */ React18__default.default.createElement(
     "linearGradient",
     {
       id: "paint2_linear_880_5115",
@@ -644,13 +615,13 @@ function WalletUiIconNoWallet({ size, ...props }) {
       y2: "23.7879",
       gradientUnits: "userSpaceOnUse"
     },
-    /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
-  ), /* @__PURE__ */ React19__default.default.createElement(
+    /* @__PURE__ */ React18__default.default.createElement("stop", { stopColor: "#9945FF" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
+  ), /* @__PURE__ */ React18__default.default.createElement(
     "linearGradient",
     {
       id: "paint3_linear_880_5115",
@@ -660,22 +631,22 @@ function WalletUiIconNoWallet({ size, ...props }) {
       y2: "45.4453",
       gradientUnits: "userSpaceOnUse"
     },
-    /* @__PURE__ */ React19__default.default.createElement("stop", { stopColor: "#9945FF" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
-    /* @__PURE__ */ React19__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
-  ), /* @__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)" }))));
-}
-function WalletUiLabel({ className, size, wallet, ...props }) {
+    /* @__PURE__ */ React18__default.default.createElement("stop", { stopColor: "#9945FF" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.14", stopColor: "#8A53F4" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.42", stopColor: "#6377D6" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.79", stopColor: "#24B0A7" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "0.99", stopColor: "#00D18C" }),
+    /* @__PURE__ */ React18__default.default.createElement("stop", { offset: "1", stopColor: "#00D18C" })
+  ), /* @__PURE__ */ React18__default.default.createElement("clipPath", { id: "clip0_880_5115" }, /* @__PURE__ */ React18__default.default.createElement("rect", { width: "48", height: "48", fill: "white", transform: "translate(24.5 24)" }))));
+}
+function WalletUiLabel({ className, wallet, ...props }) {
   if (!wallet) {
     return null;
   }
-  return /* @__PURE__ */ React19__default.default.createElement("span", { "data-wu": "wallet-ui-label", className: `${size ?? "md"} ${className ?? ""}`, ...props }, wallet.name);
+  return /* @__PURE__ */ React18__default.default.createElement("span", { "data-wu": "wallet-ui-label", className: `${className ?? ""}`, ...props }, wallet.name);
 }
-function WalletUiListButton({ className, select, size = "md", wallet, ...props }) {
-  const [pending, setPending] = React19__default.default.useState(false);
+function WalletUiListButton({ className, select, wallet, ...props }) {
+  const [pending, setPending] = React18__default.default.useState(false);
   function handleSelect() {
     if (!select) {
       return;
@@ -687,29 +658,29 @@ function WalletUiListButton({ className, select, size = "md", wallet, ...props }
     }
     void select(account).finally(() => setPending(false));
   }
-  return /* @__PURE__ */ React19__default.default.createElement(
+  return /* @__PURE__ */ React18__default.default.createElement(
     "button",
     {
       disabled: pending,
       "data-wu": "wallet-ui-list-button",
-      className: `${size} ${pending ? "pending" : ""} ${className ?? ""}`,
+      className: `${pending ? "pending" : ""} ${className ?? ""}`,
       onClick: handleSelect,
       ...props
     },
-    /* @__PURE__ */ React19__default.default.createElement(WalletUiIcon, { wallet, size }),
-    /* @__PURE__ */ React19__default.default.createElement(WalletUiLabel, { wallet, size })
+    /* @__PURE__ */ React18__default.default.createElement(WalletUiIcon, { wallet }),
+    /* @__PURE__ */ React18__default.default.createElement(WalletUiLabel, { wallet })
   );
 }
 
 // src/wallet-ui-list.tsx
-function WalletUiList({ className, select, size = "md", wallets, ...props }) {
-  return /* @__PURE__ */ React19__default.default.createElement("div", { "data-wu": "wallet-ui-list", className: `${size} ${className ?? ""}`, ...props }, wallets.map((wallet) => /* @__PURE__ */ React19__default.default.createElement(WalletUiListButton, { key: wallet.name, select, size, wallet })));
+function WalletUiList({ className, select, wallets, ...props }) {
+  return /* @__PURE__ */ React18__default.default.createElement("div", { "data-wu": "wallet-ui-list", className: `${className ?? ""}`, ...props }, wallets.map((wallet) => /* @__PURE__ */ React18__default.default.createElement(WalletUiListButton, { key: wallet.name, select, wallet })));
 }
-function WalletUiModal({ size = "md", wallets, select, ...props }) {
-  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 }));
+function WalletUiModal({ wallets, select, ...props }) {
+  return /* @__PURE__ */ React18__default.default.createElement(BaseModal, { description: "Connect a wallet on Solana to continue", ...props }, /* @__PURE__ */ React18__default.default.createElement(WalletUiList, { wallets, select }));
 }
 function WalletUiModalTrigger({ label = "Select Wallet", modal, ...props }) {
-  return /* @__PURE__ */ React19__default.default.createElement(BaseButton, { label, onClick: () => void modal.open(), ...props });
+  return /* @__PURE__ */ React18__default.default.createElement(BaseButton, { label, onClick: () => void modal.open(), ...props });
 }
 
 exports.BaseButton = BaseButton;
@@ -722,7 +693,6 @@ exports.WalletUi = WalletUi;
 exports.WalletUiAccountContext = WalletUiAccountContext;
 exports.WalletUiAccountContextProvider = WalletUiAccountContextProvider;
 exports.WalletUiAccountGuard = WalletUiAccountGuard;
-exports.WalletUiButton = WalletUiButton;
 exports.WalletUiClusterContext = WalletUiClusterContext;
 exports.WalletUiClusterContextProvider = WalletUiClusterContextProvider;
 exports.WalletUiClusterDropdown = WalletUiClusterDropdown;