@xyo-network/react-wallet 3.0.1 → 3.0.3

package/package.json

@@ -1,51 +1,30 @@
 {
   "name": "@xyo-network/react-wallet",
-  "author": {
-    "email": "support@xyo.network",
-    "name": "XYO Development Team",
-    "url": "https://xyo.network"
-  },
+  "version": "3.0.3",
+  "description": "Common React library for all XYO projects that use React",
+  "keywords": [
+    "xyo",
+    "utility",
+    "typescript",
+    "react"
+  ],
+  "homepage": "https://xyo.network",
   "bugs": {
-    "email": "support@xyo.network",
-    "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues"
-  },
-  "dependencies": {
-    "@scure/bip39": "^1.3.0",
-    "@xylabs/eth-address": "^4.0.1",
-    "@xylabs/react-button": "^4.0.1",
-    "@xylabs/react-crypto": "^4.0.1",
-    "@xylabs/react-flexbox": "^4.0.1",
-    "@xylabs/react-identicon": "^4.0.1",
-    "@xylabs/react-number-status": "^4.0.1",
-    "@xylabs/react-promise": "^4.0.1",
-    "@xylabs/react-quick-tip-button": "^4.0.1",
-    "@xylabs/react-select": "^4.0.1",
-    "@xylabs/react-shared": "^4.0.1",
-    "@xyo-network/account": "^3.0.2",
-    "@xyo-network/account-model": "^3.0.2",
-    "@xyo-network/react-address-render": "^3.0.1",
-    "@xyo-network/react-network": "^3.0.1",
-    "@xyo-network/react-shared": "^3.0.1",
-    "@xyo-network/wallet-model": "^3.0.2",
-    "async-mutex": "^0.5.0"
+    "url": "git+https://github.com/XYOracleNetwork/sdk-xyo-react-js/issues",
+    "email": "support@xyo.network"
   },
-  "peerDependencies": {
-    "@mui/icons-material": "^5",
-    "@mui/material": "^5",
-    "@mui/styles": "^5",
-    "react": "^18",
-    "react-dom": "^18"
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/XYOracleNetwork/sdk-xyo-react-js.git"
   },
-  "description": "Common React library for all XYO projects that use React",
-  "devDependencies": {
-    "@storybook/react": "^8.2.9",
-    "@xylabs/ts-scripts-yarn3": "^4.0.0-rc.15",
-    "@xylabs/tsconfig-react": "^4.0.0-rc.15",
-    "@xyo-network/react-storybook": "^3.0.1",
-    "react-router-dom": "^6.26.0",
-    "typescript": "^5.5.4"
+  "license": "LGPL-3.0-only",
+  "author": {
+    "name": "XYO Development Team",
+    "email": "support@xyo.network",
+    "url": "https://xyo.network"
   },
-  "docs": "dist/docs.json",
+  "sideEffects": false,
+  "type": "module",
   "exports": {
     ".": {
       "import": {
@@ -58,27 +37,54 @@
     "./package.json": "./package.json"
   },
   "module": "dist/browser/index.mjs",
-  "homepage": "https://xyo.network",
-  "keywords": [
-    "xyo",
-    "utility",
-    "typescript",
-    "react"
-  ],
-  "license": "LGPL-3.0-only",
-  "publishConfig": {
-    "access": "public"
+  "types": "dist/browser/index.d.ts",
+  "scripts": {
+    "license": "yarn license-checker --exclude \"MIT, ISC, Apache-2.0, BSD, BSD-2-Clause, CC-BY-4.0, Unlicense, CC-BY-3.0, CC0-1.0\"",
+    "lint-pkg": "npmPkgJsonLint ."
   },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/XYOracleNetwork/sdk-xyo-react-js.git"
+  "dependencies": {
+    "@scure/bip39": "^1.3.0",
+    "@xylabs/eth-address": "^4.0.5",
+    "@xylabs/react-button": "^4.0.3",
+    "@xylabs/react-crypto": "^4.0.3",
+    "@xylabs/react-flexbox": "^4.0.3",
+    "@xylabs/react-identicon": "^4.0.3",
+    "@xylabs/react-number-status": "^4.0.3",
+    "@xylabs/react-promise": "^4.0.3",
+    "@xylabs/react-quick-tip-button": "^4.0.3",
+    "@xylabs/react-select": "^4.0.3",
+    "@xylabs/react-shared": "^4.0.3",
+    "@xyo-network/account": "^3.0.15",
+    "@xyo-network/account-model": "^3.0.15",
+    "@xyo-network/react-address-render": "^3.0.3",
+    "@xyo-network/react-network": "^3.0.3",
+    "@xyo-network/react-shared": "^3.0.3",
+    "@xyo-network/wallet-model": "^3.0.15",
+    "async-mutex": "^0.5.0"
   },
-  "scripts": {
-    "lint-pkg": "npmPkgJsonLint .",
-    "license": "yarn license-checker --exclude \"MIT, ISC, Apache-2.0, BSD, BSD-2-Clause, CC-BY-4.0, Unlicense, CC-BY-3.0, CC0-1.0\""
+  "devDependencies": {
+    "@mui/icons-material": "^5.16.7",
+    "@mui/material": "^5.16.7",
+    "@mui/styles": "^5.16.7",
+    "@storybook/react": "^8.2.9",
+    "@xylabs/ts-scripts-yarn3": "^4.0.7",
+    "@xylabs/tsconfig-react": "^4.0.7",
+    "@xyo-network/react-storybook": "^3.0.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-router-dom": "^6.26.1",
+    "storybook": "^8.2.9",
+    "typescript": "^5.5.4"
   },
-  "sideEffects": false,
-  "types": "dist/browser/index.d.ts",
-  "version": "3.0.1",
-  "type": "module"
+  "peerDependencies": {
+    "@mui/icons-material": "^5",
+    "@mui/material": "^5",
+    "@mui/styles": "^5",
+    "react": "^18",
+    "react-dom": "^18"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "docs": "dist/docs.json"
 }

package/src/components/MaxAccounts/MaxAccountsTableRow.tsx

@@ -1,4 +1,7 @@
-import { ButtonGroup, TableCell, TableRow, TableRowProps, Typography } from '@mui/material'
+import type { TableRowProps } from '@mui/material'
+import {
+  ButtonGroup, TableCell, TableRow, Typography,
+} from '@mui/material'
 import { ButtonEx } from '@xylabs/react-button'
 import React, { useState } from 'react'
 
@@ -10,7 +13,9 @@ export interface MaxAccountsTableRow extends TableRowProps {
   maxAccounts?: number
 }
 
-export const MaxAccountsTableRow: React.FC<MaxAccountsTableRow> = ({ activeAccountIndex, changeMaxAccounts, maxAccounts }) => {
+export const MaxAccountsTableRow: React.FC<MaxAccountsTableRow> = ({
+  activeAccountIndex, changeMaxAccounts, maxAccounts,
+}) => {
   const [desiredMaximumAccounts, setDesiredMaximumAccounts] = useState<number | undefined>()
   const [showSnackBar, setShowSnackBar] = useState(false)
 

package/src/components/MaxAccounts/OutOfBoundsSnackBar.tsx

@@ -1,5 +1,9 @@
-import { Alert, AlertTitle, Snackbar, SnackbarProps } from '@mui/material'
-import React, { Dispatch, SetStateAction } from 'react'
+import type { SnackbarProps } from '@mui/material'
+import {
+  Alert, AlertTitle, Snackbar,
+} from '@mui/material'
+import type { Dispatch, SetStateAction } from 'react'
+import React from 'react'
 
 export interface OutOfBoundsSnackBarProps extends SnackbarProps {
   activeAccountIndex?: number

package/src/components/SeedPhrase/DefaultSeedPhrase.stories.tsx

@@ -1,4 +1,4 @@
-import { Meta, StoryFn } from '@storybook/react'
+import type { Meta, StoryFn } from '@storybook/react'
 import React from 'react'
 
 import { DefaultSeedPhrase } from './DefaultSeedPhrase.tsx'
@@ -11,14 +11,10 @@ export default {
 const Template: StoryFn<typeof DefaultSeedPhrase> = props => <DefaultSeedPhrase {...props} />
 
 const Default = Template.bind({})
-Default.args = {
-  seedPhrase: 'test me',
-}
+Default.args = { seedPhrase: 'test me' }
 
 const WithoutDefaultSeedPhrase = Template.bind({})
-WithoutDefaultSeedPhrase.args = {
-  changeSeedPhrase: (mnemonic?: string) => alert(`Generated Default Seed Phrase: ${mnemonic}`),
-}
+WithoutDefaultSeedPhrase.args = { changeSeedPhrase: (mnemonic?: string) => alert(`Generated Default Seed Phrase: ${mnemonic}`) }
 
 const WithHiddenDefaultSeedPhrase = Template.bind({})
 WithHiddenDefaultSeedPhrase.args = {
@@ -26,4 +22,6 @@ WithHiddenDefaultSeedPhrase.args = {
   ...WithoutDefaultSeedPhrase.args,
 }
 
-export { Default, WithHiddenDefaultSeedPhrase, WithoutDefaultSeedPhrase }
+export {
+  Default, WithHiddenDefaultSeedPhrase, WithoutDefaultSeedPhrase,
+}

package/src/components/SeedPhrase/DefaultSeedPhrase.tsx

@@ -1,8 +1,10 @@
-import { Alert, AlertTitle, Snackbar } from '@mui/material'
+import {
+  Alert, AlertTitle, Snackbar,
+} from '@mui/material'
 import { generateMnemonic } from '@scure/bip39'
 // eslint-disable-next-line import-x/no-internal-modules
 import { wordlist } from '@scure/bip39/wordlists/english'
-import { WithChildren } from '@xylabs/react-shared'
+import type { WithChildren } from '@xylabs/react-shared'
 import React, { useEffect, useState } from 'react'
 
 export interface DefaultSeedPhraseProps extends WithChildren {
@@ -11,7 +13,9 @@ export interface DefaultSeedPhraseProps extends WithChildren {
   seedPhrase?: string
 }
 
-export const DefaultSeedPhrase: React.FC<DefaultSeedPhraseProps> = ({ changeSeedPhrase, children, hideDefaultSeedPhraseMessage, seedPhrase }) => {
+export const DefaultSeedPhrase: React.FC<DefaultSeedPhraseProps> = ({
+  changeSeedPhrase, children, hideDefaultSeedPhraseMessage, seedPhrase,
+}) => {
   const [showSnackBar, setShowSnackBar] = useState(false)
 
   useEffect(() => {

package/src/components/SeedPhrase/_shared/SeedPhraseIconButton.tsx

@@ -1,4 +1,5 @@
 import { HelpOutline as HelpOutlineIcon } from '@mui/icons-material'
+import type { IconButtonProps } from '@mui/material'
 import {
   Button,
   Dialog,
@@ -6,7 +7,6 @@ import {
   DialogContent,
   DialogTitle,
   IconButton,
-  IconButtonProps,
   Link,
   List,
   ListItem,

package/src/components/SeedPhrase/dialog/SeedPhraseDialog.stories.tsx

@@ -2,7 +2,7 @@ import { Button, Typography } from '@mui/material'
 import { generateMnemonic } from '@scure/bip39'
 // eslint-disable-next-line import-x/no-internal-modules
 import { wordlist } from '@scure/bip39/wordlists/english'
-import { Meta, StoryFn } from '@storybook/react'
+import type { Meta, StoryFn } from '@storybook/react'
 import { FlexCol } from '@xylabs/react-flexbox'
 import React, { useState } from 'react'
 

package/src/components/SeedPhrase/dialog/SeedPhraseDialog.tsx

@@ -1,4 +1,7 @@
-import { Dialog, DialogContent, DialogProps, DialogTitle, FormLabel } from '@mui/material'
+import type { DialogProps } from '@mui/material'
+import {
+  Dialog, DialogContent, DialogTitle, FormLabel,
+} from '@mui/material'
 import React from 'react'
 
 import { SeedPhraseProvider, useSeedPhrase } from '../../../contexts/index.ts'
@@ -17,7 +20,9 @@ export interface SeedPhraseDialogProps extends DialogProps {
   seedPhrase?: string
 }
 
-export const SeedPhraseDialog: React.FC<SeedPhraseDialogProps> = ({ changeSeedPhrase, seedPhrase, ...props }) => {
+export const SeedPhraseDialog: React.FC<SeedPhraseDialogProps> = ({
+  changeSeedPhrase, seedPhrase, ...props
+}) => {
   return (
     <SeedPhraseProvider
       seedPhrase={seedPhrase}
@@ -31,7 +36,9 @@ export const SeedPhraseDialog: React.FC<SeedPhraseDialogProps> = ({ changeSeedPh
 }
 
 export const SeedPhraseDialogInner: React.FC<SeedPhraseDialogProps> = (props) => {
-  const { overwriteWarning, seedPhrase, validPhrase } = useSeedPhrase()
+  const {
+    overwriteWarning, seedPhrase, validPhrase,
+  } = useSeedPhrase()
 
   return (
     <Dialog aria-labelledby="alert-dialog-title" aria-describedby="alert-dialog-description" fullWidth maxWidth="sm" {...props}>
@@ -40,7 +47,10 @@ export const SeedPhraseDialogInner: React.FC<SeedPhraseDialogProps> = (props) =>
         {' '}
         <SeedPhraseIconButton />
       </DialogTitle>
-      <DialogContent sx={{ display: 'flex', flexDirection: 'column', rowGap: 2 }}>
+      <DialogContent sx={{
+        display: 'flex', flexDirection: 'column', rowGap: 2,
+      }}
+      >
         <NewPhraseTextField>
           <FormLabel>
             <PhraseHeaderBox conditional={validPhrase}>New Seed Phrase</PhraseHeaderBox>

package/src/components/SeedPhrase/dialog/components/DialogActionButtons.tsx

@@ -1,5 +1,7 @@
-import { Button, DialogActions, DialogActionsProps, DialogProps } from '@mui/material'
-import React, { MouseEvent } from 'react'
+import type { DialogActionsProps, DialogProps } from '@mui/material'
+import { Button, DialogActions } from '@mui/material'
+import type { MouseEvent } from 'react'
+import React from 'react'
 
 import { useSeedPhrase } from '../../../../contexts/index.ts'
 

package/src/components/SeedPhrase/dialog/components/fields/NewPhraseTextField.tsx

@@ -1,5 +1,7 @@
-import { FormControl, StandardTextFieldProps, TextField } from '@mui/material'
-import React, { ReactNode } from 'react'
+import type { StandardTextFieldProps } from '@mui/material'
+import { FormControl, TextField } from '@mui/material'
+import type { ReactNode } from 'react'
+import React from 'react'
 
 import { useSeedPhrase } from '../../../../../contexts/index.ts'
 import { colorParser, InvalidPhraseTypography } from './validation-messages/index.ts'
@@ -9,11 +11,21 @@ export interface NewPhraseTextFieldProps extends StandardTextFieldProps {
   disableColor?: boolean
 }
 
-export const NewPhraseTextField: React.FC<NewPhraseTextFieldProps> = ({ children, disableColor, ...props }) => {
-  const { phrase, setPhrase, validPhrase } = useSeedPhrase()
+export const NewPhraseTextField: React.FC<NewPhraseTextFieldProps> = ({
+  children, disableColor, ...props
+}) => {
+  const {
+    phrase, setPhrase, validPhrase,
+  } = useSeedPhrase()
   return (
     <>
-      <FormControl fullWidth size="small" sx={{ display: 'flex', flexDirection: 'column', rowGap: 1 }}>
+      <FormControl
+        fullWidth
+        size="small"
+        sx={{
+          display: 'flex', flexDirection: 'column', rowGap: 1,
+        }}
+      >
         {children}
         <TextField
           focused

package/src/components/SeedPhrase/dialog/components/fields/PhraseDialogActions.tsx

@@ -4,7 +4,9 @@ import React from 'react'
 import { useSeedPhrase } from '../../../../../contexts/index.ts'
 
 export const PhraseDialogActions = () => {
-  const { handleClear, handleGenerate, overwriteWarning } = useSeedPhrase()
+  const {
+    handleClear, handleGenerate, overwriteWarning,
+  } = useSeedPhrase()
   return (
     <DialogActions sx={{ justifyContent: 'center' }}>
       <Button disabled={overwriteWarning} variant="outlined" onClick={handleGenerate}>

package/src/components/SeedPhrase/dialog/components/fields/SavedPhraseTextField.tsx

@@ -1,4 +1,7 @@
-import { Chip, FormControl, FormLabel, StandardTextFieldProps, TextField } from '@mui/material'
+import type { StandardTextFieldProps } from '@mui/material'
+import {
+  Chip, FormControl, FormLabel, TextField,
+} from '@mui/material'
 import React, { useState } from 'react'
 
 import { useSeedPhrase } from '../../../../../contexts/index.ts'
@@ -9,13 +12,21 @@ export interface SavedPhraseTextFieldProps extends StandardTextFieldProps {
   showPhraseHeader?: boolean
 }
 
-export const SavedPhraseTextField: React.FC<SavedPhraseTextFieldProps> = ({ fullWidth, showPhraseHeader, ...props }) => {
+export const SavedPhraseTextField: React.FC<SavedPhraseTextFieldProps> = ({
+  fullWidth, showPhraseHeader, ...props
+}) => {
   const { validSeedPhrase, seedPhrase } = useSeedPhrase()
 
   const [visible, setVisible] = useState(false)
 
   return (
-    <FormControl fullWidth={fullWidth} size="small" sx={{ display: 'flex', flexDirection: 'column', rowGap: 1 }}>
+    <FormControl
+      fullWidth={fullWidth}
+      size="small"
+      sx={{
+        display: 'flex', flexDirection: 'column', rowGap: 1,
+      }}
+    >
       <Chip
         label={visible ? 'Hide Saved Seed Phrase' : 'Reveal Saved Seed Phrase'}
         onClick={() => setVisible(!visible)}

package/src/components/SeedPhrase/dialog/components/fields/validation-messages/InvalidPhrase.tsx

@@ -1,4 +1,5 @@
-import { Link, Typography, TypographyProps } from '@mui/material'
+import type { TypographyProps } from '@mui/material'
+import { Link, Typography } from '@mui/material'
 import React from 'react'
 
 export const InvalidPhraseTypography: React.FC<TypographyProps> = props => (

package/src/components/SeedPhrase/dialog/components/fields/validation-messages/PhraseHeaderBox.tsx

@@ -1,13 +1,16 @@
 import { CheckCircleOutline as CheckCircleOutlineIcon, HighlightOff as HighlightOffIcon } from '@mui/icons-material'
-import { FlexBoxProps, FlexRow } from '@xylabs/react-flexbox'
-import { WithChildren } from '@xylabs/react-shared'
+import type { FlexBoxProps } from '@xylabs/react-flexbox'
+import { FlexRow } from '@xylabs/react-flexbox'
+import type { WithChildren } from '@xylabs/react-shared'
 import React, { useMemo } from 'react'
 
 interface PhraseHeaderBox extends FlexBoxProps, WithChildren {
   conditional?: boolean | null
 }
 
-export const PhraseHeaderBox: React.FC<PhraseHeaderBox> = ({ children, conditional, ...props }) => {
+export const PhraseHeaderBox: React.FC<PhraseHeaderBox> = ({
+  children, conditional, ...props
+}) => {
   const state = useMemo(() => {
     switch (conditional) {
       case true: {

package/src/components/SeedPhrase/settings/SeedPhraseTableRow.stories.tsx

@@ -1,5 +1,5 @@
 import { Table, TableBody } from '@mui/material'
-import { Meta, StoryFn } from '@storybook/react'
+import type { Meta, StoryFn } from '@storybook/react'
 import React from 'react'
 
 import { SeedPhraseTableRow } from './SeedPhraseTableRow.tsx'
@@ -20,9 +20,7 @@ const Template: StoryFn<typeof SeedPhraseTableRow> = props => (
 )
 
 const Default = Template.bind({})
-Default.args = {
-  changeSeedPhrase,
-}
+Default.args = { changeSeedPhrase }
 
 const WithSeedPhrase = Template.bind({})
 WithSeedPhrase.args = {

package/src/components/SeedPhrase/settings/SeedPhraseTableRow.tsx

@@ -1,5 +1,8 @@
 import { Cancel as CancelIcon, RadioButtonChecked as RadioButtonCheckedIcon } from '@mui/icons-material'
-import { Button, ButtonGroup, TableCell, TableRow, TableRowProps } from '@mui/material'
+import type { TableRowProps } from '@mui/material'
+import {
+  Button, ButtonGroup, TableCell, TableRow,
+} from '@mui/material'
 import React, { useState } from 'react'
 
 import { SeedPhraseIconButton } from '../_shared/index.ts'
@@ -10,7 +13,9 @@ export interface SeedPhraseTableRowProps extends TableRowProps {
   seedPhrase?: string
 }
 
-export const SeedPhraseTableRow: React.FC<SeedPhraseTableRowProps> = ({ changeSeedPhrase, seedPhrase, ...props }) => {
+export const SeedPhraseTableRow: React.FC<SeedPhraseTableRowProps> = ({
+  changeSeedPhrase, seedPhrase, ...props
+}) => {
   const [open, setOpen] = useState(false)
 
   const handleOpen = () => {

package/src/components/WalletAccountDetails/WalletAccountDetails.stories.tsx

@@ -1,4 +1,4 @@
-import { Meta, StoryFn } from '@storybook/react'
+import type { Meta, StoryFn } from '@storybook/react'
 import React from 'react'
 import { BrowserRouter } from 'react-router-dom'
 
@@ -7,11 +7,7 @@ import { WalletAccountDetails } from './WalletAccountDetails.tsx'
 const StorybookEntry = {
   argTypes: {},
   component: WalletAccountDetails,
-  parameters: {
-    docs: {
-      page: null,
-    },
-  },
+  parameters: { docs: { page: null } },
   title: 'wallet/WalletAccountDetails',
 } as Meta<typeof WalletAccountDetails>
 

package/src/components/WalletAccountDetails/WalletAccountDetails.tsx

@@ -1,9 +1,10 @@
 import { EthAddress } from '@xylabs/eth-address'
 import { EthAccountButton } from '@xylabs/react-crypto'
-import { FlexBoxProps, FlexCol, FlexRow } from '@xylabs/react-flexbox'
+import type { FlexBoxProps } from '@xylabs/react-flexbox'
+import { FlexCol, FlexRow } from '@xylabs/react-flexbox'
 import { NumberStatus } from '@xylabs/react-number-status'
 import { useNetwork } from '@xyo-network/react-network'
-import { WalletInstance } from '@xyo-network/wallet-model'
+import type { WalletInstance } from '@xyo-network/wallet-model'
 import React from 'react'
 
 import { useAccount } from '../../hooks/index.ts'
@@ -13,7 +14,9 @@ export interface WalletAccountDetailsProps extends FlexBoxProps {
   exploreUrl?: string
 }
 
-export const WalletAccountDetails: React.FC<WalletAccountDetailsProps> = ({ exploreUrl = 'https://explore.xyo.network', account, ...props }) => {
+export const WalletAccountDetails: React.FC<WalletAccountDetailsProps> = ({
+  exploreUrl = 'https://explore.xyo.network', account, ...props
+}) => {
   const [accountToUse] = useAccount({ account })
   const { network } = useNetwork()
   const exploreAddressUrl = `${exploreUrl}/recent?account=${accountToUse?.address}&network=${network?.name ?? 'main'}`

package/src/components/WalletAccountDetails/WalletAccountDetailsWithProvider.stories.tsx

@@ -1,4 +1,4 @@
-import { Meta, StoryFn } from '@storybook/react'
+import type { Meta, StoryFn } from '@storybook/react'
 import { DefaultSeedPhrase } from '@xyo-network/react-storybook'
 import React from 'react'
 import { BrowserRouter } from 'react-router-dom'
@@ -10,11 +10,7 @@ import { WalletAccountDetails } from './WalletAccountDetails.tsx'
 const StorybookEntry = {
   argTypes: {},
   component: WalletAccountDetails,
-  parameters: {
-    docs: {
-      page: null,
-    },
-  },
+  parameters: { docs: { page: null } },
   title: 'wallet/WalletAccountDetailsWithProvider',
 } as Meta<typeof WalletAccountDetails>
 

package/src/components/WalletAccountSelect/Select.tsx

@@ -1,6 +1,8 @@
-import { CircularProgress, MenuItem, SelectProps } from '@mui/material'
+import type { SelectProps } from '@mui/material'
+import { CircularProgress, MenuItem } from '@mui/material'
 import { SelectEx } from '@xylabs/react-select'
-import { AddressRenderRowBox, AddressRenderRowBoxProps } from '@xyo-network/react-address-render'
+import type { AddressRenderRowBoxProps } from '@xyo-network/react-address-render'
+import { AddressRenderRowBox } from '@xyo-network/react-address-render'
 import React from 'react'
 
 import { useWalletContext } from '../../contexts/index.ts'
@@ -30,7 +32,9 @@ export const WalletAccountSelect: React.FC<WalletAccountSelectProps> = ({
   variant = 'outlined',
   ...props
 }) => {
-  const { activeAccountIndex = 0, setActiveAccountIndex, rootWallet } = useWalletContext()
+  const {
+    activeAccountIndex = 0, setActiveAccountIndex, rootWallet,
+  } = useWalletContext()
   const disabled = !rootWallet || activeAccountIndex === undefined
 
   return (
@@ -47,7 +51,12 @@ export const WalletAccountSelect: React.FC<WalletAccountSelectProps> = ({
                   const customName = selectedAccount ? addressNames?.[selectedAccount.address] : undefined
                   const favorite = !!selectedAccount && selectedAccount.address in (addressNames ?? {})
                   return (
-                    <MenuItem value={selectedAccountIndex} sx={{ minHeight: 0, paddingBottom: 0, paddingTop: 0 }}>
+                    <MenuItem
+                      value={selectedAccountIndex}
+                      sx={{
+                        minHeight: 0, paddingBottom: 0, paddingTop: 0,
+                      }}
+                    >
                       <AddressRenderRowBox
                         disableSharedRef={true}
                         flexGrow={1}
@@ -77,7 +86,13 @@ export const WalletAccountSelect: React.FC<WalletAccountSelectProps> = ({
                   const customName = account ? addressNames?.[account.address] : undefined
                   const favorite = !!account && account.address in (addressNames ?? {})
                   return (
-                    <MenuItem key={account?.address} value={index} sx={{ minHeight: 0, paddingBottom: 0, paddingTop: 0 }}>
+                    <MenuItem
+                      key={account?.address}
+                      value={index}
+                      sx={{
+                        minHeight: 0, paddingBottom: 0, paddingTop: 0,
+                      }}
+                    >
                       <AddressRenderRowBox
                         disableSharedRef={true}
                         flexGrow={1}

package/src/components/WalletAccountSelect/SelectBar.tsx

@@ -1,4 +1,5 @@
-import { FlexBoxProps, FlexCol } from '@xylabs/react-flexbox'
+import type { FlexBoxProps } from '@xylabs/react-flexbox'
+import { FlexCol } from '@xylabs/react-flexbox'
 import React from 'react'
 
 import { WalletAccountSelect } from './Select.tsx'

package/src/components/WalletAccountSelect/WalletAccountSelect.stories.tsx

@@ -1,20 +1,18 @@
 import { Stack } from '@mui/material'
-import { Meta, StoryFn } from '@storybook/react'
+import type { Meta, StoryFn } from '@storybook/react'
 import React from 'react'
 
 import { WalletAccountSelect } from './Select.tsx'
 import { WalletProviderDecorator } from './stories/index.ts'
-import { AccountInfo, RootWalletInfo, SelectedWalletInfo, WalletInfo } from './WalletInfo.tsx'
+import {
+  AccountInfo, RootWalletInfo, SelectedWalletInfo, WalletInfo,
+} from './WalletInfo.tsx'
 
 const StorybookEntry = {
   argTypes: {},
   component: WalletAccountSelect,
   decorators: [WalletProviderDecorator],
-  parameters: {
-    docs: {
-      page: null,
-    },
-  },
+  parameters: { docs: { page: null } },
   title: 'wallet/WalletAccountSelect',
 } as Meta<typeof WalletAccountSelect>
 

package/src/components/WalletAccountSelect/WalletAccountSelectBar.stories.tsx

@@ -1,5 +1,5 @@
-import { Meta, StoryFn } from '@storybook/react'
-import { WalletInstance } from '@xyo-network/wallet-model'
+import type { Meta, StoryFn } from '@storybook/react'
+import type { WalletInstance } from '@xyo-network/wallet-model'
 import React from 'react'
 
 import { useWallets } from '../../hooks/index.ts'
@@ -12,11 +12,7 @@ const StorybookEntry = {
   argTypes: {},
   component: WalletAccountSelectBar,
   decorators: [WalletProviderDecorator],
-  parameters: {
-    docs: {
-      page: null,
-    },
-  },
+  parameters: { docs: { page: null } },
   title: 'wallet/WalletAccountSelectBar',
 } as Meta<typeof WalletAccountSelectBar>
 
@@ -60,6 +56,8 @@ WithAdditionalAccounts.args = { icons: true, maxAccounts: 10 }
 
 const WithAccountFavorites = WithFavoritesTemplate.bind({})
 
-export { Default, WithAccountFavorites, WithAdditionalAccounts, WithWallet, WithWalletIcon }
+export {
+  Default, WithAccountFavorites, WithAdditionalAccounts, WithWallet, WithWalletIcon,
+}
 
 export default StorybookEntry