@xylabs/sdk-react 2.7.5 → 2.7.9

package/src/components/EthAccount/EthAccount.tsx

@@ -1,13 +1,77 @@
-import { EthAccountBase } from './EthAccountBase'
+import { Typography, useTheme } from '@mui/material'
+import { assertEx, EthAddress } from '@xylabs/sdk-js'
+import { MouseEvent, useContext } from 'react'
+
+import { EthersContext } from '../../contexts'
+import { useMediaQuery } from '../../hooks'
+import { ButtonEx } from '../ButtonEx'
+import { FlexGrowRow, FlexRow } from '../FlexBox'
+import { Identicon } from '../Identicon'
 import { EthAccountProps } from './EthAccountProps'
-import { EthAccountTo } from './EthAccountTo'
 
-const EthAccount: React.FC<EthAccountProps> = ({ to, toOptions, ...props }) => {
-  if (to || toOptions) {
-    return <EthAccountTo to={to} toOptions={toOptions} {...props} />
-  } else {
-    return <EthAccountBase {...props} />
+const EthAccount: React.FC<EthAccountProps> = ({
+  address,
+  icon = false,
+  iconSize = 16,
+  iconOnly = false,
+  addressLength = 'auto',
+  fontFamily = '"Source Code Pro",monospace',
+  toEtherScan,
+  onButtonClick,
+  ...props
+}) => {
+  const { localAddress } = useContext(EthersContext)
+  const theme = useTheme()
+
+  const large = useMediaQuery(theme.breakpoints.up('md'))
+
+  const isLocalAddress = address ? localAddress?.toString() === address.toString() : false
+
+  const onClickLocal = (event: MouseEvent<HTMLButtonElement>) => {
+    onButtonClick?.(event)
+    if (toEtherScan && address) {
+      window.open(`https://etherscan.io/address/${address.toString()}`, '_blank')
+    }
   }
+
+  const addressToDisplay = assertEx(address ?? EthAddress.fromString('0x00'), 'Bad Eth Address')
+
+  const testToDisplay =
+    addressLength === 'long'
+      ? addressToDisplay.toString()
+      : addressLength === 'short'
+      ? addressToDisplay.toShortString()
+      : large
+      ? addressToDisplay.toString()
+      : addressToDisplay.toShortString()
+
+  // Note: We use the all zero address for spacing in case it is
+
+  return (
+    <ButtonEx onClick={onClickLocal} title={`0x${address?.toHex()}`} {...props}>
+      <FlexGrowRow justifyContent="space-between" alignItems="center">
+        {icon ? <Identicon size={iconSize} value={address?.toHex()} /> : null}
+        {iconOnly ? null : (
+          <FlexRow>
+            <Typography
+              marginLeft={icon ? 1 : 0}
+              variant="body1"
+              fontFamily={fontFamily}
+              visibility={address ? 'inherit' : 'hidden'}
+            >
+              {testToDisplay}
+            </Typography>
+            {address ? null : (
+              <Typography position="absolute" marginLeft={icon ? 1 : 0} variant="body1" fontFamily={fontFamily}>
+                -- --
+              </Typography>
+            )}
+          </FlexRow>
+        )}
+        {isLocalAddress ? <FlexRow marginLeft={0.5}>(You)</FlexRow> : null}
+      </FlexGrowRow>
+    </ButtonEx>
+  )
 }
 
 export { EthAccount }

package/src/components/EthAccount/EthAccountProps.tsx

@@ -1,20 +1,19 @@
-import { BoxProps } from '@mui/material'
 import { EthAddress } from '@xylabs/sdk-js'
 import { MouseEventHandler } from 'react'
-import { NavigateOptions, To } from 'react-router-dom'
 
-interface EthAccountProps extends BoxProps {
+import { ButtonExProps } from '../ButtonEx'
+
+interface EthAccountProps extends ButtonExProps {
   address?: EthAddress | null
-  auto?: boolean
+  addressLength?: 'auto' | 'short' | 'long'
   full?: boolean
   icon?: boolean
+  iconSize?: number
   iconOnly?: boolean
-  size?: number
   text?: boolean
-  to?: To
-  toOptions?: NavigateOptions
   page?: string
   toEtherScan?: boolean
+  fontFamily?: string
   onButtonClick?: MouseEventHandler<HTMLButtonElement>
 }
 

package/src/components/FlexBox/BusyBox.stories.tsx

@@ -10,7 +10,7 @@ const StorybookEntry = {
       page: null,
     },
   },
-  title: 'BusyBox',
+  title: 'Components/BusyBox',
 } as ComponentMeta<typeof BusyBox>
 
 const BusyBoxTemplate: ComponentStory<typeof BusyBox> = (args) => <BusyBox {...args}></BusyBox>

package/src/components/FlexBox/FlexCol.stories.tsx

@@ -11,7 +11,7 @@ const StorybookEntry = {
       page: null,
     },
   },
-  title: 'FlexCol',
+  title: 'Components/FlexCol',
 } as ComponentMeta<typeof FlexCol>
 
 const Template: ComponentStory<typeof FlexCol> = (args) => <FlexCol {...args}></FlexCol>

package/src/components/FlexBox/FlexRow.stories.tsx

@@ -11,7 +11,7 @@ const StorybookEntry = {
       page: null,
     },
   },
-  title: 'FlexRow',
+  title: 'Components/FlexRow',
 } as ComponentMeta<typeof FlexRow>
 
 const Template: ComponentStory<typeof FlexRow> = (args) => <FlexRow {...args}></FlexRow>

package/src/components/InvertableThemeProvider/InvertableThemeProvider.stories.tsx

@@ -10,7 +10,7 @@ const StorybookEntry = {
       page: null,
     },
   },
-  title: 'InvertableThemeProvider',
+  title: 'Components/InvertableThemeProvider',
 } as ComponentMeta<typeof InvertableThemeProvider>
 
 const Template: ComponentStory<typeof InvertableThemeProvider> = (args) => (

package/src/components/NumberStatus/NumberStatus.stories.tsx

@@ -10,7 +10,7 @@ const StorybookEntry = {
       page: null,
     },
   },
-  title: 'NumberStatus',
+  title: 'Components/NumberStatus',
 } as ComponentMeta<typeof NumberStatus>
 
 const NumberStatusTemplate: ComponentStory<typeof NumberStatus> = (args) => <NumberStatus {...args}></NumberStatus>

package/src/components/QuickTipButton/QuickTipButton.stories.tsx

@@ -11,7 +11,7 @@ const StorybookEntry = {
       page: null,
     },
   },
-  title: 'QuickTipButton',
+  title: 'Components/QuickTipButton',
 } as ComponentMeta<typeof QuickTipButton>
 
 const Template: ComponentStory<typeof QuickTipButton> = (args) => <QuickTipButton {...args}></QuickTipButton>

package/src/components/ScrollToTop.tsx

@@ -0,0 +1,13 @@
+import { useEffect } from 'react'
+import { useLocation } from 'react-router-dom'
+
+// The point of this component it to return to the top of the page on any router navigate
+
+export const ScrollToTop = () => {
+  const { pathname } = useLocation()
+  useEffect(() => {
+    window.scrollTo(0, 0)
+  }, [pathname])
+
+  return null
+}

package/src/components/TokenAmount/TokenAmount.stories.tsx

@@ -11,7 +11,7 @@ const StorybookEntry = {
       page: null,
     },
   },
-  title: 'TokenAmount',
+  title: 'Components/TokenAmount',
 } as ComponentMeta<typeof TokenAmount>
 
 const Template: ComponentStory<typeof TokenAmount> = (args) => <TokenAmount {...args}></TokenAmount>

package/src/components/dialogs/ErrorDialog.stories.tsx

@@ -0,0 +1,27 @@
+import { ComponentMeta, ComponentStory } from '@storybook/react'
+
+import { ErrorDialog } from './ErrorDialog'
+
+const StorybookEntry = {
+  argTypes: {},
+  component: ErrorDialog,
+  parameters: {
+    docs: {
+      page: null,
+    },
+  },
+  title: 'Dialogs/ErrorDialog',
+} as ComponentMeta<typeof ErrorDialog>
+
+const Template: ComponentStory<typeof ErrorDialog> = (args) => <ErrorDialog {...args}></ErrorDialog>
+
+const Default = Template.bind({})
+Default.args = {
+  error: Error('Test Error'),
+  title: 'Test Error',
+}
+
+export { Default }
+
+// eslint-disable-next-line import/no-default-export
+export default StorybookEntry

package/src/components/dialogs/ErrorDialog.tsx

@@ -1,13 +1,13 @@
-import { Dialog, DialogActions, DialogContent, DialogTitle, Typography } from '@mui/material'
+import { Dialog, DialogActions, DialogContent, DialogProps, DialogTitle, Typography } from '@mui/material'
 import { AxiosError } from 'axios'
 import React from 'react'
 
 import { ButtonEx } from '../ButtonEx'
 import { FlexRow } from '../FlexBox'
 
-interface Props {
+export interface ErrorDialogProps extends DialogProps {
   error?: Error
-  onClose?: (retry: boolean) => void
+  onAction?: (retry: boolean) => void
   title?: string
 }
 
@@ -15,22 +15,25 @@ const toAxiosError = (error: Error) => {
   return (error as AxiosError).isAxiosError ? (error as AxiosError) : undefined
 }
 
-const ErrorDialogOpen: React.FC<Props> = (props) => {
-  const { onClose, title = 'Oops. Something went wrong.', error = Error('Unknown Error') } = props
-
+const ErrorDialogOpen: React.FC<ErrorDialogProps> = ({
+  onAction,
+  title = 'Oops. Something went wrong.',
+  error = Error('Unknown Error'),
+  ...props
+}) => {
   const onCloseClicked = () => {
-    onClose?.(false)
+    onAction?.(false)
   }
 
   const onRetryClicked = () => {
-    onClose?.(true)
+    onAction?.(true)
   }
 
   const axiosError = toAxiosError(error)
   const message = error.message ?? error.toString()
 
   return (
-    <Dialog onClose={onClose} open={!!error}>
+    <Dialog {...props}>
       <DialogTitle>{title}</DialogTitle>
       <DialogContent>
         <FlexRow>
@@ -53,13 +56,10 @@ const ErrorDialogOpen: React.FC<Props> = (props) => {
   )
 }
 
-const ErrorDialog: React.FC<Props> = (props) => {
-  const { error } = props
+export const ErrorDialog: React.FC<ErrorDialogProps> = ({ open, error, ...props }) => {
   if (error) {
-    return <ErrorDialogOpen {...props} />
+    return <ErrorDialogOpen open={!!error || open} error={error} {...props} />
   } else {
     return null
   }
 }
-
-export { ErrorDialog }

package/src/components/dialogs/MessageDialog.stories.tsx

@@ -0,0 +1,27 @@
+import { ComponentMeta, ComponentStory } from '@storybook/react'
+
+import { MessageDialog } from './MessageDialog'
+
+const StorybookEntry = {
+  argTypes: {},
+  component: MessageDialog,
+  parameters: {
+    docs: {
+      page: null,
+    },
+  },
+  title: 'Dialogs/MessageDialog',
+} as ComponentMeta<typeof MessageDialog>
+
+const Template: ComponentStory<typeof MessageDialog> = (args) => <MessageDialog {...args}>Test Message</MessageDialog>
+
+const Default = Template.bind({})
+Default.args = {
+  open: true,
+  title: 'Test Error',
+}
+
+export { Default }
+
+// eslint-disable-next-line import/no-default-export
+export default StorybookEntry

package/src/components/dialogs/MessageDialog.tsx

@@ -2,12 +2,12 @@ import { Button, Dialog, DialogActions, DialogContent, DialogProps, DialogTitle
 
 import { FlexCol, FlexRow } from '../FlexBox'
 
-interface Props extends DialogProps {
+export interface MessageDialogProps extends DialogProps {
   onOk?: () => void
   onCancel?: () => void
 }
 
-const MessageDialog: React.FC<Props> = ({ onOk, onCancel, children, title, ...props }) => {
+export const MessageDialog: React.FC<MessageDialogProps> = ({ onOk, onCancel, children, title, ...props }) => {
   return (
     <Dialog {...props}>
       <DialogTitle>{title}</DialogTitle>
@@ -27,5 +27,3 @@ const MessageDialog: React.FC<Props> = ({ onOk, onCancel, children, title, ...pr
     </Dialog>
   )
 }
-
-export { MessageDialog }

package/src/components/index.ts

@@ -19,7 +19,7 @@ export * from './LinkEx'
 export * from './NumberStatus'
 export * from './QuickTipButton'
 export * from './RichResult'
+export * from './ScrollToTop'
 export * from './TokenAmount'
 
-// eslint-disable-next-line @delagen/deprecation/deprecation
 export { Background, CoverProgress, HoverScale, Identicon, RedirectWithQuery, ScrollToTopButton }

package/src/hooks/index.ts

@@ -1,6 +1,7 @@
 import { useBreakpoint } from './useBreakpoint'
+import { useMediaQuery } from './useMediaQuery'
 import { useMounted } from './useMounted'
 import { useNavigateToEthAddress } from './useNavigateToEthAddress'
 import { useWindowSize } from './useWindowSize'
 
-export { useBreakpoint, useMounted, useNavigateToEthAddress, useWindowSize }
+export { useBreakpoint, useMediaQuery, useMounted, useNavigateToEthAddress, useWindowSize }

package/src/hooks/useBreakpoint.ts

@@ -1,4 +1,6 @@
-import { useMediaQuery, useTheme } from '@mui/material'
+import { useTheme } from '@mui/material'
+
+import { useMediaQuery } from './useMediaQuery'
 
 const useBreakpoint = () => {
   const theme = useTheme()

package/src/hooks/useMediaQuery.ts

@@ -0,0 +1,6 @@
+/* eslint-disable import/no-deprecated */
+import { useMediaQuery } from '@mui/material'
+
+export { useMediaQuery }
+
+/* file exists to deal with false warning */

package/dist/components/EthAccount/EthAccountBase.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import { EthAccountProps } from './EthAccountProps';
-declare const EthAccountBase: React.FC<EthAccountProps>;
-export { EthAccountBase };
-//# sourceMappingURL=EthAccountBase.d.ts.map

package/dist/components/EthAccount/EthAccountBase.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EthAccountBase.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccountBase.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,QAAA,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA+C7C,CAAA;AAED,OAAO,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/EthAccount/EthAccountBase.js

@@ -1,41 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Typography, useMediaQuery, useTheme } from '@mui/material';
-import { useContext } from 'react';
-import { EthersContext } from '../../contexts';
-import { ButtonEx } from '../ButtonEx';
-import { FlexGrowRow, FlexRow } from '../FlexBox';
-import { Identicon } from '../Identicon';
-const EthAccountBase = (_a) => {
-    var { address, icon = false, iconOnly = false, full = false, auto, size = 16, toEtherScan, onButtonClick } = _a, props = __rest(_a, ["address", "icon", "iconOnly", "full", "auto", "size", "toEtherScan", "onButtonClick"]);
-    const { localAddress } = useContext(EthersContext);
-    const theme = useTheme();
-    const large = useMediaQuery(theme.breakpoints.up('md'));
-    const fontFamily = '"Source Code Pro",monospace';
-    if (address) {
-        const isLocalAddress = (localAddress === null || localAddress === void 0 ? void 0 : localAddress.toString()) === address.toString();
-        const onClickLocal = (event) => {
-            onButtonClick === null || onButtonClick === void 0 ? void 0 : onButtonClick(event);
-            if (toEtherScan) {
-                window.open(`https://etherscan.io/address/${address.toString()}`, '_blank');
-            }
-        };
-        const testToDisplay = full || !auto ? address.toString() : large ? address.toString() : address.toShortString();
-        return (_jsx(FlexRow, Object.assign({ margin: 0.5, padding: 0.5, title: `0x${address === null || address === void 0 ? void 0 : address.toHex()}` }, props, { children: _jsx(ButtonEx, Object.assign({ fullWidth: true, onClick: onClickLocal, variant: "outlined" }, { children: _jsxs(FlexGrowRow, Object.assign({ justifyContent: "space-between", alignItems: "center" }, { children: [icon ? _jsx(Identicon, { size: size, value: address === null || address === void 0 ? void 0 : address.toHex() }, void 0) : null, iconOnly ? null : (_jsx(Typography, Object.assign({ variant: "body1", fontFamily: fontFamily, style: { textTransform: 'none' } }, { children: testToDisplay }), void 0)), isLocalAddress ? _jsx(FlexRow, Object.assign({ marginLeft: 0.5 }, { children: "(You)" }), void 0) : null] }), void 0) }), void 0) }), void 0));
-    }
-    else {
-        return _jsx(FlexRow, Object.assign({}, props, { children: ' - - ' }), void 0);
-    }
-};
-export { EthAccountBase };
-//# sourceMappingURL=EthAccountBase.js.map

package/dist/components/EthAccount/EthAccountBase.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"EthAccountBase.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccountBase.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACnE,OAAO,EAAc,UAAU,EAAE,MAAM,OAAO,CAAA;AAE9C,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAA;AAC9C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAA;AACtC,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAGxC,MAAM,cAAc,GAA8B,CAAC,EAUlD,EAAE,EAAE;QAV8C,EACjD,OAAO,EACP,IAAI,GAAG,KAAK,EACZ,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,KAAK,EACZ,IAAI,EACJ,IAAI,GAAG,EAAE,EACT,WAAW,EACX,aAAa,OAEd,EADI,KAAK,cATyC,uFAUlD,CADS;IAER,MAAM,EAAE,YAAY,EAAE,GAAG,UAAU,CAAC,aAAa,CAAC,CAAA;IAClD,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,KAAK,GAAG,aAAa,CAAC,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAA;IACvD,MAAM,UAAU,GAAG,6BAA6B,CAAA;IAEhD,IAAI,OAAO,EAAE;QACX,MAAM,cAAc,GAAG,CAAA,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,QAAQ,EAAE,MAAK,OAAO,CAAC,QAAQ,EAAE,CAAA;QAEtE,MAAM,YAAY,GAAG,CAAC,KAAoC,EAAE,EAAE;YAC5D,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,KAAK,CAAC,CAAA;YACtB,IAAI,WAAW,EAAE;gBACf,MAAM,CAAC,IAAI,CAAC,gCAAgC,OAAO,CAAC,QAAQ,EAAE,EAAE,EAAE,QAAQ,CAAC,CAAA;aAC5E;QACH,CAAC,CAAA;QAED,MAAM,aAAa,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,aAAa,EAAE,CAAA;QAE/G,OAAO,CACL,KAAC,OAAO,kBAAC,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,EAAE,EAAE,IAAM,KAAK,cAC3E,KAAC,QAAQ,kBAAC,SAAS,QAAC,OAAO,EAAE,YAAY,EAAE,OAAO,EAAC,UAAU,gBAC3D,MAAC,WAAW,kBAAC,cAAc,EAAC,eAAe,EAAC,UAAU,EAAC,QAAQ,iBAC5D,IAAI,CAAC,CAAC,CAAC,KAAC,SAAS,IAAC,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,aAAP,OAAO,uBAAP,OAAO,CAAE,KAAK,EAAE,WAAI,CAAC,CAAC,CAAC,IAAI,EAChE,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CACjB,KAAC,UAAU,kBAAC,OAAO,EAAC,OAAO,EAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,EAAE,gBACjF,aAAa,YACH,CACd,EACA,cAAc,CAAC,CAAC,CAAC,KAAC,OAAO,kBAAC,UAAU,EAAE,GAAG,mCAAiB,CAAC,CAAC,CAAC,IAAI,aACtD,YACL,YACH,CACX,CAAA;KACF;SAAM;QACL,OAAO,KAAC,OAAO,oBAAK,KAAK,cAAG,OAAO,YAAW,CAAA;KAC/C;AACH,CAAC,CAAA;AAED,OAAO,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/EthAccount/EthAccountTo.d.ts

@@ -1,5 +0,0 @@
-/// <reference types="react" />
-import { EthAccountProps } from './EthAccountProps';
-declare const EthAccountTo: React.FC<EthAccountProps>;
-export { EthAccountTo };
-//# sourceMappingURL=EthAccountTo.d.ts.map

package/dist/components/EthAccount/EthAccountTo.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"EthAccountTo.d.ts","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccountTo.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAEnD,QAAA,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAqB3C,CAAA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/components/EthAccount/EthAccountTo.js

@@ -1,30 +0,0 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useNavigateToEthAddress } from '../../hooks';
-import { EthAccountBase } from './EthAccountBase';
-const EthAccountTo = (_a) => {
-    var { address, to, page, toOptions, toEtherScan, onButtonClick } = _a, props = __rest(_a, ["address", "to", "page", "toOptions", "toEtherScan", "onButtonClick"]);
-    const { navigateToEthAddress } = useNavigateToEthAddress();
-    if (address) {
-        const localOnClick = (event) => {
-            onButtonClick === null || onButtonClick === void 0 ? void 0 : onButtonClick(event);
-            if (to) {
-                navigateToEthAddress(address, event, page, to, toOptions, toEtherScan);
-            }
-        };
-        return _jsx(EthAccountBase, Object.assign({ onButtonClick: localOnClick }, props), void 0);
-    }
-    return null;
-};
-export { EthAccountTo };
-//# sourceMappingURL=EthAccountTo.js.map

package/dist/components/EthAccount/EthAccountTo.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"EthAccountTo.js","sourceRoot":"","sources":["../../../src/components/EthAccount/EthAccountTo.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,aAAa,CAAA;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAGjD,MAAM,YAAY,GAA8B,CAAC,EAQhD,EAAE,EAAE;QAR4C,EAC/C,OAAO,EACP,EAAE,EACF,IAAI,EACJ,SAAS,EACT,WAAW,EACX,aAAa,OAEd,EADI,KAAK,cAPuC,sEAQhD,CADS;IAER,MAAM,EAAE,oBAAoB,EAAE,GAAG,uBAAuB,EAAE,CAAA;IAC1D,IAAI,OAAO,EAAE;QACX,MAAM,YAAY,GAAG,CAAC,KAAoC,EAAE,EAAE;YAC5D,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAG,KAAK,CAAC,CAAA;YACtB,IAAI,EAAE,EAAE;gBACN,oBAAoB,CAAC,OAAO,EAAE,KAAK,EAAE,IAAI,EAAE,EAAE,EAAE,SAAS,EAAE,WAAW,CAAC,CAAA;aACvE;QACH,CAAC,CAAA;QAED,OAAO,KAAC,cAAc,kBAAC,aAAa,EAAE,YAAY,IAAM,KAAK,UAAI,CAAA;KAClE;IACD,OAAO,IAAI,CAAA;AACb,CAAC,CAAA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/src/components/EthAccount/EthAccountBase.tsx

@@ -1,59 +0,0 @@
-import { Typography, useMediaQuery, useTheme } from '@mui/material'
-import { MouseEvent, useContext } from 'react'
-
-import { EthersContext } from '../../contexts'
-import { ButtonEx } from '../ButtonEx'
-import { FlexGrowRow, FlexRow } from '../FlexBox'
-import { Identicon } from '../Identicon'
-import { EthAccountProps } from './EthAccountProps'
-
-const EthAccountBase: React.FC<EthAccountProps> = ({
-  address,
-  icon = false,
-  iconOnly = false,
-  full = false,
-  auto,
-  size = 16,
-  toEtherScan,
-  onButtonClick,
-  ...props
-}) => {
-  const { localAddress } = useContext(EthersContext)
-  const theme = useTheme()
-
-  const large = useMediaQuery(theme.breakpoints.up('md'))
-  const fontFamily = '"Source Code Pro",monospace'
-
-  if (address) {
-    const isLocalAddress = localAddress?.toString() === address.toString()
-
-    const onClickLocal = (event: MouseEvent<HTMLButtonElement>) => {
-      onButtonClick?.(event)
-      if (toEtherScan) {
-        window.open(`https://etherscan.io/address/${address.toString()}`, '_blank')
-      }
-    }
-
-    const testToDisplay = full || !auto ? address.toString() : large ? address.toString() : address.toShortString()
-
-    return (
-      <FlexRow margin={0.5} padding={0.5} title={`0x${address?.toHex()}`} {...props}>
-        <ButtonEx fullWidth onClick={onClickLocal} variant="outlined">
-          <FlexGrowRow justifyContent="space-between" alignItems="center">
-            {icon ? <Identicon size={size} value={address?.toHex()} /> : null}
-            {iconOnly ? null : (
-              <Typography variant="body1" fontFamily={fontFamily} style={{ textTransform: 'none' }}>
-                {testToDisplay}
-              </Typography>
-            )}
-            {isLocalAddress ? <FlexRow marginLeft={0.5}>(You)</FlexRow> : null}
-          </FlexGrowRow>
-        </ButtonEx>
-      </FlexRow>
-    )
-  } else {
-    return <FlexRow {...props}>{' - - '}</FlexRow>
-  }
-}
-
-export { EthAccountBase }

package/src/components/EthAccount/EthAccountTo.tsx

@@ -1,30 +0,0 @@
-import { MouseEvent } from 'react'
-
-import { useNavigateToEthAddress } from '../../hooks'
-import { EthAccountBase } from './EthAccountBase'
-import { EthAccountProps } from './EthAccountProps'
-
-const EthAccountTo: React.FC<EthAccountProps> = ({
-  address,
-  to,
-  page,
-  toOptions,
-  toEtherScan,
-  onButtonClick,
-  ...props
-}) => {
-  const { navigateToEthAddress } = useNavigateToEthAddress()
-  if (address) {
-    const localOnClick = (event: MouseEvent<HTMLButtonElement>) => {
-      onButtonClick?.(event)
-      if (to) {
-        navigateToEthAddress(address, event, page, to, toOptions, toEtherScan)
-      }
-    }
-
-    return <EthAccountBase onButtonClick={localOnClick} {...props} />
-  }
-  return null
-}
-
-export { EthAccountTo }