@aptos-labs/wallet-adapter-mui-design 5.5.4 → 5.5.6

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @aptos-labs/wallet-adapter-mui-design
 
+## 5.5.6
+
+### Patch Changes
+
+- @aptos-labs/wallet-adapter-react@8.3.3
+
+## 5.5.5
+
+### Patch Changes
+
+- Updated dependencies [b19c8c2]
+  - @aptos-labs/wallet-adapter-react@8.3.2
+
 ## 5.5.4
 
 ### Patch Changes

package/dist/index.js

@@ -1,37 +1,8 @@
 "use strict";
 var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 var __export = (target, all) => {
   for (var name in all)
     __defProp(target, name, { get: all[name], enumerable: true });
@@ -45,26 +16,6 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
 
 // src/index.tsx
 var index_exports = {};
@@ -96,7 +47,7 @@ function WalletMenu({
   const popoverOpen = Boolean(popoverAnchor);
   const id = popoverOpen ? "wallet-popover" : void 0;
   const onAccountOptionClicked = () => {
-    handleNavigate && handleNavigate();
+    handleNavigate?.();
     handlePopoverClose();
   };
   const handleLogout = () => {
@@ -104,14 +55,13 @@ function WalletMenu({
     handlePopoverClose();
   };
   const [tooltipOpen, setTooltipOpen] = (0, import_react.useState)(false);
-  const copyAddress = () => __async(this, null, function* () {
-    var _a;
-    yield navigator.clipboard.writeText((_a = account == null ? void 0 : account.address) == null ? void 0 : _a.toString());
+  const copyAddress = async () => {
+    await navigator.clipboard.writeText(account?.address?.toString() ?? "");
     setTooltipOpen(true);
     setTimeout(() => {
       setTooltipOpen(false);
     }, 2e3);
-  });
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
     import_material.Popover,
     {
@@ -149,7 +99,6 @@ function WalletButton({
   handleModalOpen,
   handleNavigate
 }) {
-  var _a;
   const { connected, account, wallet } = (0, import_wallet_adapter_react2.useWallet)();
   const [popoverAnchor, setPopoverAnchor] = (0, import_react2.useState)(
     null
@@ -177,12 +126,12 @@ function WalletButton({
           /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
             import_material2.Avatar,
             {
-              alt: wallet == null ? void 0 : wallet.name,
-              src: wallet == null ? void 0 : wallet.icon,
+              alt: wallet?.name,
+              src: wallet?.icon,
               sx: { width: 24, height: 24 }
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.Typography, { noWrap: true, ml: 2, children: (account == null ? void 0 : account.ansName) || (0, import_wallet_adapter_react2.truncateAddress)((_a = account == null ? void 0 : account.address) == null ? void 0 : _a.toString()) || "Unknown" })
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.Typography, { noWrap: true, ml: 2, children: account?.ansName || (0, import_wallet_adapter_react2.truncateAddress)(account?.address?.toString()) || "Unknown" })
         ] }) : /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_icons_material.AccountBalanceWalletOutlined, { sx: { marginRight: 1 } }),
           /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.Typography, { noWrap: true, children: "Connect Wallet" })
@@ -202,7 +151,9 @@ function WalletButton({
 
 // src/WalletModel.tsx
 var import_wallet_adapter_react3 = require("@aptos-labs/wallet-adapter-react");
+var import_icons_material2 = require("@mui/icons-material");
 var import_material3 = require("@mui/material");
+var import_react3 = require("react");
 
 // src/aptosColorPalette.ts
 var grey = {
@@ -220,27 +171,19 @@ var grey = {
 };
 
 // src/WalletModel.tsx
-var import_icons_material2 = require("@mui/icons-material");
-var import_react3 = require("react");
 var import_jsx_runtime3 = require("react/jsx-runtime");
-function WalletsModal(_a) {
-  var _b = _a, {
-    handleClose,
-    modalOpen,
-    networkSupport,
-    modalMaxWidth,
-    crossChainWallets
-  } = _b, walletSortingOptions = __objRest(_b, [
-    "handleClose",
-    "modalOpen",
-    "networkSupport",
-    "modalMaxWidth",
-    "crossChainWallets"
-  ]);
+function WalletsModal({
+  handleClose,
+  modalOpen,
+  networkSupport,
+  modalMaxWidth,
+  crossChainWallets,
+  ...walletSortingOptions
+}) {
   const theme = (0, import_material3.useTheme)();
   const [expanded, setExpanded] = (0, import_react3.useState)(false);
   const [tabValue, setTabValue] = (0, import_react3.useState)(0);
-  const handleTabChange = (event, newValue) => {
+  const handleTabChange = (_event, newValue) => {
     setTabValue(newValue);
   };
   const { wallets = [], notDetectedWallets = [] } = (0, import_wallet_adapter_react3.useWallet)();
@@ -324,7 +267,7 @@ function WalletsModal(_a) {
       onClose: handleClose,
       "aria-label": "wallet selector modal",
       sx: { borderRadius: `${theme.shape.borderRadius}px` },
-      maxWidth: modalMaxWidth != null ? modalMaxWidth : "xs",
+      maxWidth: modalMaxWidth ?? "xs",
       fullWidth: true,
       children: /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
         import_material3.Stack,
@@ -509,7 +452,7 @@ function WalletsModal(_a) {
                     indicatorColor: "secondary",
                     variant: "fullWidth",
                     "aria-label": "cross chain wallets tabs",
-                    children: tabsConfig.map((tab, index) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Tab, __spreadValues({ label: tab.label }, a11yProps(index)), tab.key))
+                    children: tabsConfig.map((tab, index) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Tab, { label: tab.label, ...a11yProps(index) }, tab.key))
                   }
                 ),
                 /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(TabPanel, { value: tabValue, index: getTabIndex("aptos"), children: renderWalletList(aptosWallets, aptosInstallableWallets) }),
@@ -708,17 +651,17 @@ function renderEducationScreen(screen) {
   ] });
 }
 function TabPanel(props) {
-  const _a = props, { children, value, index } = _a, other = __objRest(_a, ["children", "value", "index"]);
+  const { children, value, index, ...other } = props;
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     "div",
-    __spreadProps(__spreadValues({
+    {
       role: "tabpanel",
       hidden: value !== index,
       id: `simple-tabpanel-${index}`,
-      "aria-labelledby": `simple-tab-${index}`
-    }, other), {
+      "aria-labelledby": `simple-tab-${index}`,
+      ...other,
       children: value === index && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_material3.Stack, { sx: { gap: 1 }, children })
-    })
+    }
   );
 }
 function a11yProps(index) {
@@ -730,18 +673,13 @@ function a11yProps(index) {
 
 // src/WalletConnector.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
-function WalletConnector(_a) {
-  var _b = _a, {
-    networkSupport,
-    handleNavigate,
-    modalMaxWidth,
-    crossChainWallets
-  } = _b, walletSortingOptions = __objRest(_b, [
-    "networkSupport",
-    "handleNavigate",
-    "modalMaxWidth",
-    "crossChainWallets"
-  ]);
+function WalletConnector({
+  networkSupport,
+  handleNavigate,
+  modalMaxWidth,
+  crossChainWallets,
+  ...walletSortingOptions
+}) {
   const [modalOpen, setModalOpen] = (0, import_react4.useState)(false);
   const handleModalOpen = () => setModalOpen(true);
   const handleClose = () => setModalOpen(false);
@@ -755,13 +693,14 @@ function WalletConnector(_a) {
     ),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
       WalletsModal,
-      __spreadValues({
+      {
         handleClose,
         modalOpen,
         networkSupport,
         modalMaxWidth,
-        crossChainWallets
-      }, walletSortingOptions)
+        crossChainWallets,
+        ...walletSortingOptions
+      }
     )
   ] });
 }

package/dist/index.mjs

@@ -1,55 +1,3 @@
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var __async = (__this, __arguments, generator) => {
-  return new Promise((resolve, reject) => {
-    var fulfilled = (value) => {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var rejected = (value) => {
-      try {
-        step(generator.throw(value));
-      } catch (e) {
-        reject(e);
-      }
-    };
-    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
-    step((generator = generator.apply(__this, __arguments)).next());
-  });
-};
-
 // src/WalletConnector.tsx
 import { useState as useState4 } from "react";
 
@@ -80,7 +28,7 @@ function WalletMenu({
   const popoverOpen = Boolean(popoverAnchor);
   const id = popoverOpen ? "wallet-popover" : void 0;
   const onAccountOptionClicked = () => {
-    handleNavigate && handleNavigate();
+    handleNavigate?.();
     handlePopoverClose();
   };
   const handleLogout = () => {
@@ -88,14 +36,13 @@ function WalletMenu({
     handlePopoverClose();
   };
   const [tooltipOpen, setTooltipOpen] = useState(false);
-  const copyAddress = () => __async(this, null, function* () {
-    var _a;
-    yield navigator.clipboard.writeText((_a = account == null ? void 0 : account.address) == null ? void 0 : _a.toString());
+  const copyAddress = async () => {
+    await navigator.clipboard.writeText(account?.address?.toString() ?? "");
     setTooltipOpen(true);
     setTimeout(() => {
       setTooltipOpen(false);
     }, 2e3);
-  });
+  };
   return /* @__PURE__ */ jsx(
     Popover,
     {
@@ -133,7 +80,6 @@ function WalletButton({
   handleModalOpen,
   handleNavigate
 }) {
-  var _a;
   const { connected, account, wallet } = useWallet2();
   const [popoverAnchor, setPopoverAnchor] = useState2(
     null
@@ -161,12 +107,12 @@ function WalletButton({
           /* @__PURE__ */ jsx2(
             Avatar,
             {
-              alt: wallet == null ? void 0 : wallet.name,
-              src: wallet == null ? void 0 : wallet.icon,
+              alt: wallet?.name,
+              src: wallet?.icon,
               sx: { width: 24, height: 24 }
             }
           ),
-          /* @__PURE__ */ jsx2(Typography, { noWrap: true, ml: 2, children: (account == null ? void 0 : account.ansName) || truncateAddress((_a = account == null ? void 0 : account.address) == null ? void 0 : _a.toString()) || "Unknown" })
+          /* @__PURE__ */ jsx2(Typography, { noWrap: true, ml: 2, children: account?.ansName || truncateAddress(account?.address?.toString()) || "Unknown" })
         ] }) : /* @__PURE__ */ jsxs2(Fragment, { children: [
           /* @__PURE__ */ jsx2(AccountBalanceWalletOutlinedIcon, { sx: { marginRight: 1 } }),
           /* @__PURE__ */ jsx2(Typography, { noWrap: true, children: "Connect Wallet" })
@@ -188,11 +134,18 @@ function WalletButton({
 import {
   AboutAptosConnect,
   AptosPrivacyPolicy,
-  WalletItem,
   groupAndSortWallets,
   isInstallRequired,
-  useWallet as useWallet3
+  useWallet as useWallet3,
+  WalletItem
 } from "@aptos-labs/wallet-adapter-react";
+import {
+  ArrowBack,
+  ArrowForward,
+  Close as CloseIcon,
+  ExpandMore,
+  LanOutlined as LanOutlinedIcon
+} from "@mui/icons-material";
 import {
   Box,
   Button as Button2,
@@ -208,6 +161,7 @@ import {
   Typography as Typography2,
   useTheme
 } from "@mui/material";
+import { useState as useState3 } from "react";
 
 // src/aptosColorPalette.ts
 var grey = {
@@ -225,33 +179,19 @@ var grey = {
 };
 
 // src/WalletModel.tsx
-import {
-  ArrowBack,
-  ArrowForward,
-  Close as CloseIcon,
-  ExpandMore,
-  LanOutlined as LanOutlinedIcon
-} from "@mui/icons-material";
-import { useState as useState3 } from "react";
 import { Fragment as Fragment2, jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function WalletsModal(_a) {
-  var _b = _a, {
-    handleClose,
-    modalOpen,
-    networkSupport,
-    modalMaxWidth,
-    crossChainWallets
-  } = _b, walletSortingOptions = __objRest(_b, [
-    "handleClose",
-    "modalOpen",
-    "networkSupport",
-    "modalMaxWidth",
-    "crossChainWallets"
-  ]);
+function WalletsModal({
+  handleClose,
+  modalOpen,
+  networkSupport,
+  modalMaxWidth,
+  crossChainWallets,
+  ...walletSortingOptions
+}) {
   const theme = useTheme();
   const [expanded, setExpanded] = useState3(false);
   const [tabValue, setTabValue] = useState3(0);
-  const handleTabChange = (event, newValue) => {
+  const handleTabChange = (_event, newValue) => {
     setTabValue(newValue);
   };
   const { wallets = [], notDetectedWallets = [] } = useWallet3();
@@ -335,7 +275,7 @@ function WalletsModal(_a) {
       onClose: handleClose,
       "aria-label": "wallet selector modal",
       sx: { borderRadius: `${theme.shape.borderRadius}px` },
-      maxWidth: modalMaxWidth != null ? modalMaxWidth : "xs",
+      maxWidth: modalMaxWidth ?? "xs",
       fullWidth: true,
       children: /* @__PURE__ */ jsxs3(
         Stack,
@@ -520,7 +460,7 @@ function WalletsModal(_a) {
                     indicatorColor: "secondary",
                     variant: "fullWidth",
                     "aria-label": "cross chain wallets tabs",
-                    children: tabsConfig.map((tab, index) => /* @__PURE__ */ jsx3(Tab, __spreadValues({ label: tab.label }, a11yProps(index)), tab.key))
+                    children: tabsConfig.map((tab, index) => /* @__PURE__ */ jsx3(Tab, { label: tab.label, ...a11yProps(index) }, tab.key))
                   }
                 ),
                 /* @__PURE__ */ jsx3(TabPanel, { value: tabValue, index: getTabIndex("aptos"), children: renderWalletList(aptosWallets, aptosInstallableWallets) }),
@@ -719,17 +659,17 @@ function renderEducationScreen(screen) {
   ] });
 }
 function TabPanel(props) {
-  const _a = props, { children, value, index } = _a, other = __objRest(_a, ["children", "value", "index"]);
+  const { children, value, index, ...other } = props;
   return /* @__PURE__ */ jsx3(
     "div",
-    __spreadProps(__spreadValues({
+    {
       role: "tabpanel",
       hidden: value !== index,
       id: `simple-tabpanel-${index}`,
-      "aria-labelledby": `simple-tab-${index}`
-    }, other), {
+      "aria-labelledby": `simple-tab-${index}`,
+      ...other,
       children: value === index && /* @__PURE__ */ jsx3(Stack, { sx: { gap: 1 }, children })
-    })
+    }
   );
 }
 function a11yProps(index) {
@@ -741,18 +681,13 @@ function a11yProps(index) {
 
 // src/WalletConnector.tsx
 import { Fragment as Fragment3, jsx as jsx4, jsxs as jsxs4 } from "react/jsx-runtime";
-function WalletConnector(_a) {
-  var _b = _a, {
-    networkSupport,
-    handleNavigate,
-    modalMaxWidth,
-    crossChainWallets
-  } = _b, walletSortingOptions = __objRest(_b, [
-    "networkSupport",
-    "handleNavigate",
-    "modalMaxWidth",
-    "crossChainWallets"
-  ]);
+function WalletConnector({
+  networkSupport,
+  handleNavigate,
+  modalMaxWidth,
+  crossChainWallets,
+  ...walletSortingOptions
+}) {
   const [modalOpen, setModalOpen] = useState4(false);
   const handleModalOpen = () => setModalOpen(true);
   const handleClose = () => setModalOpen(false);
@@ -766,13 +701,14 @@ function WalletConnector(_a) {
     ),
     /* @__PURE__ */ jsx4(
       WalletsModal,
-      __spreadValues({
+      {
         handleClose,
         modalOpen,
         networkSupport,
         modalMaxWidth,
-        crossChainWallets
-      }, walletSortingOptions)
+        crossChainWallets,
+        ...walletSortingOptions
+      }
     )
   ] });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aptos-labs/wallet-adapter-mui-design",
-  "version": "5.5.4",
+  "version": "5.5.6",
   "description": "Aptos Wallet Adapter mui design",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",
@@ -31,7 +31,6 @@
   "devDependencies": {
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
-    "eslint": "^8.57.1",
     "tsup": "^8.4.0",
     "typescript": "^5.8.3",
     "@aptos-labs/wallet-adapter-tsconfig": "0.0.2"
@@ -41,7 +40,7 @@
     "@emotion/styled": "^11.10.5",
     "@mui/icons-material": "^5.11.0",
     "@mui/material": "^5.11.6",
-    "@aptos-labs/wallet-adapter-react": "8.3.1"
+    "@aptos-labs/wallet-adapter-react": "8.3.3"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0",
@@ -52,6 +51,6 @@
     "build": "tsup src/index.tsx --format esm,cjs --dts --external react",
     "dev": "tsup src/index.tsx --format esm,cjs --watch --dts --external react",
     "clean": "rm -rf .turbo && rm -rf node_modules && rm -rf dist",
-    "lint": "TIMING=1 eslint \"src/**/*.ts*\""
+    "lint": "biome lint src"
   }
 }

package/src/WalletButton.tsx

@@ -1,7 +1,8 @@
 import { truncateAddress, useWallet } from "@aptos-labs/wallet-adapter-react";
 import { AccountBalanceWalletOutlined as AccountBalanceWalletOutlinedIcon } from "@mui/icons-material";
 import { Avatar, Button, Typography } from "@mui/material";
-import React, { useState } from "react";
+import type React from "react";
+import { useState } from "react";
 import WalletMenu from "./WalletMenu";
 
 type WalletButtonProps = {

package/src/WalletConnector.tsx

@@ -1,7 +1,7 @@
 import { useState } from "react";
+import type { WalletConnectorProps } from "./types";
 import WalletButton from "./WalletButton";
 import WalletsModal from "./WalletModel";
-import { WalletConnectorProps } from "./types";
 
 export function WalletConnector({
   networkSupport,

package/src/WalletMenu.tsx

@@ -25,7 +25,7 @@ export default function WalletMenu({
   const id = popoverOpen ? "wallet-popover" : undefined;
 
   const onAccountOptionClicked = () => {
-    handleNavigate && handleNavigate();
+    handleNavigate?.();
     handlePopoverClose();
   };
 
@@ -37,7 +37,7 @@ export default function WalletMenu({
   const [tooltipOpen, setTooltipOpen] = useState<boolean>(false);
 
   const copyAddress = async () => {
-    await navigator.clipboard.writeText(account?.address?.toString()!);
+    await navigator.clipboard.writeText(account?.address?.toString() ?? "");
 
     setTooltipOpen(true);
 

package/src/WalletModel.tsx

@@ -1,15 +1,23 @@
 import {
   AboutAptosConnect,
-  AboutAptosConnectEducationScreen,
-  AdapterNotDetectedWallet,
-  AdapterWallet,
+  type AboutAptosConnectEducationScreen,
+  type AdapterNotDetectedWallet,
+  type AdapterWallet,
   AptosPrivacyPolicy,
-  WalletItem,
-  WalletSortingOptions,
   groupAndSortWallets,
   isInstallRequired,
   useWallet,
+  WalletItem,
+  type WalletSortingOptions,
 } from "@aptos-labs/wallet-adapter-react";
+// reported bug with loading mui icons with esm, therefore need to import like this https://github.com/mui/material-ui/issues/35233
+import {
+  ArrowBack,
+  ArrowForward,
+  Close as CloseIcon,
+  ExpandMore,
+  LanOutlined as LanOutlinedIcon,
+} from "@mui/icons-material";
 import {
   Box,
   Button,
@@ -25,21 +33,12 @@ import {
   Typography,
   useTheme,
 } from "@mui/material";
+import { type SyntheticEvent, useState } from "react";
 import { grey } from "./aptosColorPalette";
-// reported bug with loading mui icons with esm, therefore need to import like this https://github.com/mui/material-ui/issues/35233
-import {
-  ArrowBack,
-  ArrowForward,
-  Close as CloseIcon,
-  ExpandMore,
-  LanOutlined as LanOutlinedIcon,
-} from "@mui/icons-material";
-import { SyntheticEvent, useState } from "react";
-import { WalletConnectorProps } from "./types";
+import type { WalletConnectorProps } from "./types";
 
 interface WalletsModalProps
-  extends
-    Pick<WalletConnectorProps, "networkSupport" | "modalMaxWidth">,
+  extends Pick<WalletConnectorProps, "networkSupport" | "modalMaxWidth">,
     WalletSortingOptions {
   handleClose: () => void;
   modalOpen: boolean;
@@ -62,7 +61,7 @@ export default function WalletsModal({
   const [expanded, setExpanded] = useState(false);
   const [tabValue, setTabValue] = useState<number>(0);
 
-  const handleTabChange = (event: SyntheticEvent, newValue: number) => {
+  const handleTabChange = (_event: SyntheticEvent, newValue: number) => {
     setTabValue(newValue);
   };
 

package/src/types.ts

@@ -1,5 +1,5 @@
-import { WalletSortingOptions } from "@aptos-labs/wallet-adapter-react";
-import { Breakpoint } from "@mui/material";
+import type { WalletSortingOptions } from "@aptos-labs/wallet-adapter-react";
+import type { Breakpoint } from "@mui/material";
 
 export interface WalletConnectorProps extends WalletSortingOptions {
   networkSupport?: string;